feat: [US-050] - Join/leave notifications

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

src/lib/collaboration/realtime.ts

@@ -23,6 +23,8 @@ export type RemoteCursor = {
 type RealtimeCallbacks = {
   onConnectionStateChange: (state: ConnectionState) => void
   onPresenceSync?: (users: PresenceUser[]) => void
+  onPresenceJoin?: (user: PresenceUser) => void
+  onPresenceLeave?: (user: PresenceUser) => void
   onChannelSubscribed?: (channel: RealtimeChannel) => void
   onCursorUpdate?: (cursor: RemoteCursor) => void
 }
@@ -76,6 +78,28 @@ export class RealtimeConnection {
           this.callbacks.onPresenceSync?.(users)
         }
       })
+      .on('presence', { event: 'join' }, ({ newPresences }) => {
+        for (const presence of newPresences) {
+          const p = presence as { userId?: string; displayName?: string }
+          if (p.userId && p.userId !== this.userId) {
+            this.callbacks.onPresenceJoin?.({
+              userId: p.userId,
+              displayName: p.displayName || 'Anonymous',
+            })
+          }
+        }
+      })
+      .on('presence', { event: 'leave' }, ({ leftPresences }) => {
+        for (const presence of leftPresences) {
+          const p = presence as { userId?: string; displayName?: string }
+          if (p.userId && p.userId !== this.userId) {
+            this.callbacks.onPresenceLeave?.({
+              userId: p.userId,
+              displayName: p.displayName || 'Anonymous',
+            })
+          }
+        }
+      })
       .on('broadcast', { event: 'cursor' }, ({ payload }) => {
         if (payload.userId === this.userId) return
         this.callbacks.onCursorUpdate?.({