@nolag/feed 0.1.2 → 1.1.0

package/dist/index.cjs

@@ -1,7 +1,5 @@
 'use strict';
 
-var jsSdk = require('@nolag/js-sdk');
-
 class EventEmitter {
     constructor() {
         this._handlers = new Map();
@@ -275,6 +273,29 @@ function createLogger(prefix, enabled) {
     }
     return (...args) => { console.log(`[${prefix}]`, ...args); };
 }
+// ============ Wrapper registry ============
+// One wrapper instance per (client, appName): two wrappers sharing an app on
+// one connection would collide on topics, presence and the online lobby.
+// Warn (not throw): HMR and tests legitimately construct before disposing.
+const wrapperRegistry = new WeakMap();
+/** Register a wrapper against a client + appName; warns on collision. */
+function registerWrapper(client, appName, wrapperName) {
+    let apps = wrapperRegistry.get(client);
+    if (!apps) {
+        apps = new Map();
+        wrapperRegistry.set(client, apps);
+    }
+    const existing = apps.get(appName);
+    if (existing) {
+        console.warn(`[${wrapperName}] Another wrapper (${existing}) is already attached to this client for app "${appName}". ` +
+            `Use one wrapper per (client, app) — detach the other instance first.`);
+    }
+    apps.set(appName, wrapperName);
+}
+/** Release a wrapper's (client, appName) registration on detach. */
+function releaseWrapper(client, appName) {
+    wrapperRegistry.get(client)?.delete(appName);
+}
 
 const DEFAULT_APP_NAME = 'feed';
 const DEFAULT_MAX_POST_CACHE = 200;
@@ -283,18 +304,33 @@ const TOPIC_POSTS = 'posts';
 const TOPIC_REACTIONS = 'reactions';
 const TOPIC_COMMENTS = 'comments';
 const LOBBY_ID = 'online';
+/** Delay before the post-setup lobby presence refetch (catches simultaneous joiners) */
+const LOBBY_REFRESH_DELAY_MS = 2000;
 
+/**
+ * FeedChannel — a single feed channel with posts, comments, reactions, and
+ * presence.
+ *
+ * Created via `NoLagFeed.joinChannel(name)`. Do not instantiate directly.
+ */
 class FeedChannel extends EventEmitter {
-    constructor(name, roomContext, localUser, options, log) {
+    /** @internal */
+    constructor(name, roomContext, localUser, options, log, isConnected) {
         super();
         this._comments = new Map();
         this._unreadCount = 0;
         this._active = false;
+        // Stored topic handler refs — cleanup removes exactly these, never all
+        // handlers for a topic (the client may be shared with other consumers).
+        this._onPostsRef = null;
+        this._onReactionsRef = null;
+        this._onCommentsRef = null;
         this.name = name;
         this._roomContext = roomContext;
         this._localUser = localUser;
         this._options = options;
         this._log = log;
+        this._isConnected = isConnected;
         this._presenceManager = new PresenceManager(localUser.actorTokenId);
         this._postStore = new PostStore(options.maxPostCache);
         this._reactionManager = new ReactionManager();
@@ -360,13 +396,27 @@ class FeedChannel extends EventEmitter {
         }
     }
     getUsers() { return this._presenceManager.getAll(); }
+    /** @internal Subscribe to post/reaction/comment topics and attach listeners (all channels) */
     _subscribe() {
+        this._log('Channel subscribe:', this.name);
         this._roomContext.subscribe(TOPIC_POSTS);
         this._roomContext.subscribe(TOPIC_REACTIONS);
         this._roomContext.subscribe(TOPIC_COMMENTS);
-        this._roomContext.on(TOPIC_POSTS, (data, meta) => this._handleIncomingPost(data, meta));
-        this._roomContext.on(TOPIC_REACTIONS, (data) => this._handleIncomingReaction(data));
-        this._roomContext.on(TOPIC_COMMENTS, (data, meta) => this._handleIncomingComment(data, meta));
+        // Listen for posts (refs stored for handler-specific removal)
+        this._onPostsRef = (data, meta) => {
+            this._handleIncomingPost(data, meta);
+        };
+        this._roomContext.on(TOPIC_POSTS, this._onPostsRef);
+        // Listen for reactions
+        this._onReactionsRef = (data) => {
+            this._handleIncomingReaction(data);
+        };
+        this._roomContext.on(TOPIC_REACTIONS, this._onReactionsRef);
+        // Listen for comments
+        this._onCommentsRef = (data, meta) => {
+            this._handleIncomingComment(data, meta);
+        };
+        this._roomContext.on(TOPIC_COMMENTS, this._onCommentsRef);
     }
     _activate() {
         this._active = true;
@@ -399,13 +449,27 @@ class FeedChannel extends EventEmitter {
     _handleReplayStart(count) { this.emit('replayStart', { count }); }
     _handleReplayEnd(replayed) { this.emit('replayEnd', { replayed }); }
     _updateLocalPresence() { this._setPresence(); }
+    /** @internal Unsubscribe and clean up */
     _cleanup() {
-        this._roomContext.unsubscribe(TOPIC_POSTS);
-        this._roomContext.unsubscribe(TOPIC_REACTIONS);
-        this._roomContext.unsubscribe(TOPIC_COMMENTS);
-        this._roomContext.off(TOPIC_POSTS);
-        this._roomContext.off(TOPIC_REACTIONS);
-        this._roomContext.off(TOPIC_COMMENTS);
+        this._log('Channel cleanup:', this.name);
+        // Server unsubscribes need a live socket; skip when disconnected
+        // (best-effort — the core would no-op with an error callback anyway).
+        if (this._isConnected()) {
+            this._roomContext.unsubscribe(TOPIC_POSTS);
+            this._roomContext.unsubscribe(TOPIC_REACTIONS);
+            this._roomContext.unsubscribe(TOPIC_COMMENTS);
+        }
+        // Handler-specific removal only: the client may be shared, and a bare
+        // off(topic) would strip other consumers' handlers too.
+        if (this._onPostsRef)
+            this._roomContext.off(TOPIC_POSTS, this._onPostsRef);
+        if (this._onReactionsRef)
+            this._roomContext.off(TOPIC_REACTIONS, this._onReactionsRef);
+        if (this._onCommentsRef)
+            this._roomContext.off(TOPIC_COMMENTS, this._onCommentsRef);
+        this._onPostsRef = null;
+        this._onReactionsRef = null;
+        this._onCommentsRef = null;
         this._postStore.clear();
         this._reactionManager.clear();
         this._comments.clear();
@@ -467,169 +531,470 @@ class FeedChannel extends EventEmitter {
         this._roomContext.setPresence({
             userId: this._localUser.userId, username: this._localUser.username,
             avatar: this._localUser.avatar, metadata: this._localUser.metadata,
+            // Scope tag: on a shared client, other apps' wrappers filter our
+            // presence out by this (and we filter theirs).
+            __scope: this._options.appName,
         });
     }
 }
 
+/**
+ * NoLagFeed — high-level activity-feed SDK built on @nolag/js-sdk.
+ *
+ * Provides multi-channel feeds, posts, likes, comments, presence (who's
+ * online), replay, and user mapping — all framework-agnostic via events.
+ *
+ * The wrapper NEVER manages the connection. The app owns one core NoLag
+ * client (shared by any number of wrappers on distinct apps) and the
+ * wrapper attaches to it at construction and releases it via `detach()`.
+ *
+ * @example
+ * ```typescript
+ * import { NoLag } from '@nolag/js-sdk';
+ * import { NoLagFeed } from '@nolag/feed';
+ *
+ * const client = NoLag(async () => (await (await fetch('/api/nolag-token')).json()).token);
+ * const feed = new NoLagFeed({ client, appName: 'my-feed', username: 'Alice' });
+ *
+ * feed.on('userOnline', (user) => console.log(user.username, 'is online'));
+ *
+ * await client.connect();   // the app owns the connection
+ * await feed.ready();       // wrapper setup done (identity, lobby, channels)
+ *
+ * const channel = feed.joinChannel('general');
+ * channel.on('postCreated', (post) => console.log(post.username + ':', post.content));
+ * channel.createPost({ content: 'Hello!' });
+ *
+ * feed.detach();            // wrapper releases its handlers and topics
+ * client.disconnect();      // the app closes the socket
+ * ```
+ */
 class NoLagFeed extends EventEmitter {
-    constructor(token, options) {
+    constructor(options) {
         super();
-        this._client = null;
         this._localUser = null;
         this._channels = new Map();
         this._lobby = null;
         this._onlineUsers = new Map();
         this._actorToUserId = new Map();
         this._activeChannel = null;
-        this._token = token;
+        // Lifecycle: one setup run per connection epoch; detach is terminal.
+        this._epoch = 0;
+        this._detached = false;
+        this._isReady = false;
+        this._lobbyRefreshTimer = null;
+        // Stored client handler refs. INVARIANT: every client.on() below has a
+        // matching client.off() in detach() — never bare off(event), never inline
+        // closures on the client.
+        this._onConnectRef = () => this._onConnect();
+        this._onDisconnectRef = (reason) => {
+            this._log('Disconnected:', reason);
+            this.emit('disconnected', reason);
+        };
+        this._onReconnectRef = () => {
+            this._log('Reconnecting...');
+            this.emit('reconnecting');
+        };
+        this._onErrorRef = (error) => {
+            this._log('Error:', error);
+            this.emit('error', error);
+        };
+        this._onReplayStartRef = (data) => {
+            const event = data;
+            for (const channel of this._channels.values()) {
+                channel._handleReplayStart(event.count);
+            }
+        };
+        this._onReplayEndRef = (data) => {
+            const event = data;
+            for (const channel of this._channels.values()) {
+                channel._handleReplayEnd(event.replayed);
+            }
+        };
+        this._onPresenceJoinRef = (data) => this._handleRoomPresenceJoin(data);
+        this._onPresenceLeaveRef = (data) => this._handleRoomPresenceLeave(data);
+        this._onPresenceUpdateRef = (data) => this._handleRoomPresenceUpdate(data);
+        this._onLobbyJoinRef = (data) => this._handleLobbyJoin(data);
+        this._onLobbyLeaveRef = (data) => this._handleLobbyLeave(data);
+        this._onLobbyUpdateRef = (data) => this._handleLobbyUpdate(data);
+        if (!options?.client) {
+            throw new TypeError('NoLagFeed requires an injected NoLag client: new NoLagFeed({ client, username, ... })');
+        }
+        this._client = options.client;
         this._userId = generateId();
         this._options = {
-            username: options.username, avatar: options.avatar, metadata: options.metadata,
-            appName: options.appName ?? DEFAULT_APP_NAME, url: options.url,
+            username: options.username,
+            avatar: options.avatar,
+            metadata: options.metadata,
+            appName: options.appName ?? DEFAULT_APP_NAME,
             maxPostCache: options.maxPostCache ?? DEFAULT_MAX_POST_CACHE,
             maxCommentCache: options.maxCommentCache ?? DEFAULT_MAX_COMMENT_CACHE,
-            debug: options.debug ?? false, reconnect: options.reconnect ?? true, channels: options.channels ?? [],
+            debug: options.debug ?? false,
+            channels: options.channels ?? [],
         };
         this._log = createLogger('NoLagFeed', this._options.debug);
+        this._readyPromise = new Promise((resolve, reject) => {
+            this._readyResolve = resolve;
+            this._readyReject = reject;
+        });
+        // ready() rejection is only meaningful to callers that await it
+        this._readyPromise.catch(() => { });
+        registerWrapper(this._client, this._options.appName, 'NoLagFeed');
+        // Construction = attach: wire everything now, with stored refs.
+        this._client.on('connect', this._onConnectRef);
+        this._client.on('disconnect', this._onDisconnectRef);
+        this._client.on('reconnect', this._onReconnectRef);
+        this._client.on('error', this._onErrorRef);
+        this._client.on('replay:start', this._onReplayStartRef);
+        this._client.on('replay:end', this._onReplayEndRef);
+        this._client.on('presence:join', this._onPresenceJoinRef);
+        this._client.on('presence:leave', this._onPresenceLeaveRef);
+        this._client.on('presence:update', this._onPresenceUpdateRef);
+        this._client.on('lobbyPresence:join', this._onLobbyJoinRef);
+        this._client.on('lobbyPresence:leave', this._onLobbyLeaveRef);
+        this._client.on('lobbyPresence:update', this._onLobbyUpdateRef);
+        // Attach-to-connected: if the client is already authenticated, run setup.
+        // The microtask lets the caller wire wrapper event handlers synchronously
+        // first; a racing real 'connect' event wins via the epoch guard.
+        queueMicrotask(() => {
+            if (this._epoch === 0 && !this._detached && this._client.connected) {
+                this._onConnect();
+            }
+        });
     }
-    get connected() { return this._client?.connected ?? false; }
-    get localUser() { return this._localUser; }
-    get channels() { return this._channels; }
-    async connect() {
-        const clientOptions = { debug: this._options.debug, reconnect: this._options.reconnect };
-        if (this._options.url)
-            clientOptions.url = this._options.url;
-        this._client = jsSdk.NoLag(this._token, clientOptions);
-        this._client.on('connect', () => { if (this._channels.size > 0) {
-            this._restoreChannels();
-            this.emit('reconnected');
-        } });
-        this._client.on('disconnect', (reason) => this.emit('disconnected', reason));
-        this._client.on('reconnect', () => { });
-        this._client.on('error', (error) => this.emit('error', error));
-        this._client.on('replay:start', (data) => { for (const ch of this._channels.values())
-            ch._handleReplayStart(data.count); });
-        this._client.on('replay:end', (data) => { for (const ch of this._channels.values())
-            ch._handleReplayEnd(data.replayed); });
-        await this._client.connect();
-        this._client.on('presence:join', (data) => this._handleRoomPresenceJoin(data));
-        this._client.on('presence:leave', (data) => this._handleRoomPresenceLeave(data));
-        this._client.on('presence:update', (data) => this._handleRoomPresenceUpdate(data));
-        this._localUser = {
-            userId: this._userId, actorTokenId: this._client.actorId, username: this._options.username,
-            avatar: this._options.avatar, metadata: this._options.metadata, joinedAt: Date.now(), isLocal: true,
-        };
-        await this._setupLobby();
-        for (const name of this._options.channels)
-            this._subscribeChannel(name);
-        this.emit('connected');
-        setTimeout(() => { if (this._lobby && this._client?.connected)
-            this._lobby.fetchPresence().then((s) => this._hydrateOnlineUsers(s)).catch(() => { }); }, 2000);
-    }
-    disconnect() {
-        for (const name of [...this._channels.keys()])
-            this.leaveChannel(name);
-        this._lobby?.unsubscribe();
+    // ============ Public Properties ============
+    /** Whether the underlying connection is established (connected ≠ ready) */
+    get connected() {
+        return !this._detached && this._client.connected;
+    }
+    /** The injected core client (owned by the app, not the wrapper) */
+    get client() {
+        return this._client;
+    }
+    /** The local user's info (available after ready) */
+    get localUser() {
+        return this._localUser;
+    }
+    /** All currently joined channels */
+    get channels() {
+        return this._channels;
+    }
+    // ============ Lifecycle ============
+    /**
+     * Resolves once the wrapper's first setup completed (identity, lobby and
+     * configured channels ready — equivalently, once 'connected' has fired).
+     * Rejects only if detach() is called before that. Client auth failures
+     * surface via the app's own `await client.connect()`, not here.
+     */
+    ready() {
+        return this._readyPromise;
+    }
+    /**
+     * Detach from the client: remove every handler this wrapper added,
+     * unsubscribe its topics and lobby (when connected), clear state.
+     * Terminal and idempotent; never touches the socket. To use the feed again,
+     * construct a new instance.
+     */
+    detach() {
+        if (this._detached)
+            return;
+        this._log('Detaching...');
+        this._detached = true;
+        this._epoch++; // aborts any in-flight setup at its next checkpoint
+        if (this._lobbyRefreshTimer) {
+            clearTimeout(this._lobbyRefreshTimer);
+            this._lobbyRefreshTimer = null;
+        }
+        // Remove all client handlers by stored ref
+        this._client.off('connect', this._onConnectRef);
+        this._client.off('disconnect', this._onDisconnectRef);
+        this._client.off('reconnect', this._onReconnectRef);
+        this._client.off('error', this._onErrorRef);
+        this._client.off('replay:start', this._onReplayStartRef);
+        this._client.off('replay:end', this._onReplayEndRef);
+        this._client.off('presence:join', this._onPresenceJoinRef);
+        this._client.off('presence:leave', this._onPresenceLeaveRef);
+        this._client.off('presence:update', this._onPresenceUpdateRef);
+        this._client.off('lobbyPresence:join', this._onLobbyJoinRef);
+        this._client.off('lobbyPresence:leave', this._onLobbyLeaveRef);
+        this._client.off('lobbyPresence:update', this._onLobbyUpdateRef);
+        // Channels: handler-specific off + connected-gated server unsubscribe
+        for (const name of [...this._channels.keys()]) {
+            this._channels.get(name)._cleanup();
+            this._channels.delete(name);
+        }
+        this._activeChannel = null;
+        // Lobby: server unsubscribe is best-effort and needs a live socket
+        if (this._lobby && this._client.connected) {
+            try {
+                this._lobby.unsubscribe();
+            }
+            catch {
+                /* best-effort */
+            }
+        }
         this._lobby = null;
-        this._client?.disconnect();
-        this._client = null;
         this._onlineUsers.clear();
         this._actorToUserId.clear();
         this._localUser = null;
+        releaseWrapper(this._client, this._options.appName);
+        if (!this._isReady) {
+            this._readyReject(new Error('NoLagFeed detached before ready'));
+        }
+    }
+    // ============ Private: Epoch Setup ============
+    _onConnect() {
+        this._epoch++;
+        void this._runSetup(this._epoch);
     }
+    /**
+     * One setup pass per connection epoch. Serves both initial setup (epoch 1)
+     * and reconnect restore (epoch > 1). Aborts silently whenever a newer
+     * epoch started or the wrapper detached — checked after every await.
+     */
+    async _runSetup(epoch) {
+        const stale = () => epoch !== this._epoch || this._detached;
+        this._log(this._isReady ? 'Restoring after reconnect...' : 'Setting up...');
+        // Identity (client.actorId is guaranteed post-auth)
+        if (!this._localUser) {
+            this._localUser = {
+                userId: this._userId,
+                actorTokenId: this._client.actorId,
+                username: this._options.username,
+                avatar: this._options.avatar,
+                metadata: this._options.metadata,
+                joinedAt: Date.now(),
+                isLocal: true,
+            };
+            this._log('Local user:', this._localUser.userId, '→', this._localUser.actorTokenId);
+        }
+        else {
+            this._localUser.actorTokenId = this._client.actorId;
+        }
+        // Lobby: subscribe every epoch (idempotent server-side) and diff-hydrate
+        // from the returned snapshot — one path for setup and restore.
+        if (!this._lobby) {
+            this._lobby = this._client.setApp(this._options.appName).setLobby(LOBBY_ID);
+        }
+        try {
+            const state = await this._lobby.subscribe();
+            if (stale())
+                return;
+            this._diffHydrateOnlineUsers(state);
+            this._log('Lobby subscribed, online users:', this._onlineUsers.size);
+        }
+        catch (err) {
+            if (stale())
+                return;
+            this._log('Lobby subscription failed:', err);
+        }
+        if (!this._isReady) {
+            // First successful setup: pre-subscribe configured channels
+            // (posts only, no presence)
+            for (const channelName of this._options.channels) {
+                this._subscribeChannelInternal(channelName);
+            }
+        }
+        else if (this._activeChannel) {
+            // Server auto-restored topic subscriptions; only channel-scoped presence
+            // needs re-applying (the core does not restore it).
+            this._channels.get(this._activeChannel)?._updateLocalPresence();
+        }
+        if (stale())
+            return;
+        // Ready keys on the first setup that COMPLETES, not on epoch 1: an
+        // epoch aborted by a racing reconnect must not strand ready().
+        if (!this._isReady) {
+            this._isReady = true;
+            this._readyResolve();
+            this.emit('connected');
+        }
+        else {
+            this.emit('reconnected');
+        }
+        // Deferred lobby refetch: catches users who joined during the setup
+        // window (e.g. simultaneous multi-tab connects).
+        this._scheduleLobbyRefresh(epoch);
+    }
+    _scheduleLobbyRefresh(epoch) {
+        if (this._lobbyRefreshTimer)
+            clearTimeout(this._lobbyRefreshTimer);
+        this._lobbyRefreshTimer = setTimeout(() => {
+            this._lobbyRefreshTimer = null;
+            if (epoch !== this._epoch || this._detached || !this._client.connected || !this._lobby) {
+                return;
+            }
+            this._lobby
+                .fetchPresence()
+                .then((state) => {
+                if (epoch !== this._epoch || this._detached)
+                    return;
+                this._diffHydrateOnlineUsers(state);
+            })
+                .catch(() => {
+                /* best-effort */
+            });
+        }, LOBBY_REFRESH_DELAY_MS);
+    }
+    // ============ Channel Management ============
+    /**
+     * Join (activate) a feed channel. Deactivates the previous active channel.
+     * If the channel was pre-subscribed via the `channels` option, activates it.
+     * Otherwise creates, subscribes, and activates it.
+     */
     joinChannel(name) {
-        if (!this._client || !this._localUser)
-            throw new Error('Not connected — call connect() first');
+        this._assertUsable();
+        // Deactivate the current active channel
         if (this._activeChannel && this._activeChannel !== name) {
-            this._channels.get(this._activeChannel)?._deactivate();
+            const prev = this._channels.get(this._activeChannel);
+            if (prev)
+                prev._deactivate();
+        }
+        // Get or create the channel
+        let channel = this._channels.get(name);
+        if (!channel) {
+            channel = this._subscribeChannelInternal(name);
         }
-        let ch = this._channels.get(name);
-        if (!ch)
-            ch = this._subscribeChannel(name);
         this._activeChannel = name;
-        ch._activate();
-        return ch;
+        channel._activate();
+        return channel;
     }
+    /**
+     * Leave a feed channel. Fully unsubscribes and removes it.
+     */
     leaveChannel(name) {
-        const ch = this._channels.get(name);
-        if (!ch)
+        const channel = this._channels.get(name);
+        if (!channel)
             return;
-        ch._cleanup();
+        this._log('Leaving channel:', name);
+        channel._cleanup();
         this._channels.delete(name);
-        if (this._activeChannel === name)
+        if (this._activeChannel === name) {
             this._activeChannel = null;
+        }
+    }
+    /**
+     * Get all joined channels.
+     */
+    getChannels() {
+        return Array.from(this._channels.values());
+    }
+    // ============ Global Presence ============
+    /**
+     * Get all users currently online across all channels.
+     */
+    getOnlineUsers() {
+        return Array.from(this._onlineUsers.values());
+    }
+    // ============ Profile ============
+    /**
+     * Update the local user's profile info (broadcast to the active channel).
+     */
+    updateProfile(updates) {
+        if (!this._localUser)
+            return;
+        if (updates.username !== undefined) {
+            this._localUser.username = updates.username;
+            this._options.username = updates.username;
+        }
+        if (updates.avatar !== undefined) {
+            this._localUser.avatar = updates.avatar;
+            this._options.avatar = updates.avatar;
+        }
+        if (updates.metadata !== undefined) {
+            this._localUser.metadata = { ...this._localUser.metadata, ...updates.metadata };
+            this._options.metadata = this._localUser.metadata;
+        }
+        // Re-set presence only on the active channel
+        if (this._activeChannel) {
+            const activeChannel = this._channels.get(this._activeChannel);
+            if (activeChannel)
+                activeChannel._updateLocalPresence();
+        }
+    }
+    // ============ Private: Guards ============
+    _assertUsable() {
+        if (this._detached) {
+            throw new Error('NoLagFeed has been detached — construct a new instance');
+        }
+        if (!this._isReady || !this._localUser) {
+            throw new Error('NoLagFeed not ready — await ready() or the "connected" event');
+        }
     }
-    getOnlineUsers() { return Array.from(this._onlineUsers.values()); }
-    _subscribeChannel(name) {
-        if (!this._client || !this._localUser)
-            throw new Error('Not connected');
+    // ============ Private: Channel Setup ============
+    _subscribeChannelInternal(name) {
+        this._log('Subscribing channel:', name);
         const roomContext = this._client.setApp(this._options.appName).setRoom(name);
-        const ch = new FeedChannel(name, roomContext, this._localUser, this._options, createLogger(`FeedChannel:${name}`, this._options.debug));
-        this._channels.set(name, ch);
-        ch._subscribe();
-        return ch;
+        const channel = new FeedChannel(name, roomContext, this._localUser, this._options, createLogger(`FeedChannel:${name}`, this._options.debug), () => this._client.connected);
+        this._channels.set(name, channel);
+        channel._subscribe();
+        return channel;
     }
+    // ============ Private: Scope Filtering ============
+    /**
+     * On a shared client, presence events from other apps' wrappers arrive on
+     * the same connection-level events. Wrappers stamp their presence with a
+     * `__scope` (their appName); a mismatched tag means another app's data.
+     * Untagged presence is accepted (older peers in this same app).
+     */
+    _foreignScope(data) {
+        const scope = data?.__scope;
+        return typeof scope === 'string' && scope !== this._options.appName;
+    }
+    // ============ Private: Channel Presence → Active Channel ============
     _handleRoomPresenceJoin(data) {
         if (data.actorTokenId === this._localUser?.actorTokenId)
             return;
-        const pd = data.presence;
-        if (!pd?.userId)
+        const presenceData = data.presence;
+        if (!presenceData?.userId || this._foreignScope(presenceData))
             return;
-        const user = this._presenceToUser(data.actorTokenId, pd);
+        // Track as online user
+        const user = this._presenceToUser(data.actorTokenId, presenceData);
         this._actorToUserId.set(data.actorTokenId, user.userId);
         if (!this._onlineUsers.has(user.userId)) {
             this._onlineUsers.set(user.userId, user);
             this.emit('userOnline', user);
         }
-        const room = this._activeChannel ? this._channels.get(this._activeChannel) : undefined;
-        if (room)
-            room._handlePresenceJoin(data.actorTokenId, pd);
+        const channel = this._activeChannel ? this._channels.get(this._activeChannel) : undefined;
+        if (channel) {
+            channel._handlePresenceJoin(data.actorTokenId, presenceData);
+        }
     }
     _handleRoomPresenceLeave(data) {
         if (data.actorTokenId === this._localUser?.actorTokenId)
             return;
-        const room = this._activeChannel ? this._channels.get(this._activeChannel) : undefined;
-        if (room)
-            room._handlePresenceLeave(data.actorTokenId);
+        // Channel leave ≠ offline — user may still be in another channel.
+        // Lobby leave handles actual offline status.
+        const channel = this._activeChannel ? this._channels.get(this._activeChannel) : undefined;
+        if (channel) {
+            channel._handlePresenceLeave(data.actorTokenId);
+        }
     }
     _handleRoomPresenceUpdate(data) {
         if (data.actorTokenId === this._localUser?.actorTokenId)
             return;
-        const pd = data.presence;
-        if (!pd?.userId)
-            return;
-        const room = this._activeChannel ? this._channels.get(this._activeChannel) : undefined;
-        if (room)
-            room._handlePresenceUpdate(data.actorTokenId, pd);
-    }
-    async _setupLobby() {
-        if (!this._client)
+        const presenceData = data.presence;
+        if (!presenceData?.userId || this._foreignScope(presenceData))
             return;
-        this._lobby = this._client.setApp(this._options.appName).setLobby(LOBBY_ID);
-        const lh = (type) => (data) => {
-            const e = data;
-            if (type === 'join')
-                this._handleLobbyJoin(e);
-            else if (type === 'leave')
-                this._handleLobbyLeave(e);
-        };
-        this._client.on('lobbyPresence:join', lh('join'));
-        this._client.on('lobbyPresence:leave', lh('leave'));
-        this._client.on('lobbyPresence:update', lh('update'));
-        try {
-            const s = await this._lobby.subscribe();
-            this._hydrateOnlineUsers(s);
+        // Update online user info if we already track them
+        if (this._onlineUsers.has(presenceData.userId)) {
+            const user = this._presenceToUser(data.actorTokenId, presenceData);
+            this._onlineUsers.set(user.userId, user);
+        }
+        const channel = this._activeChannel ? this._channels.get(this._activeChannel) : undefined;
+        if (channel) {
+            channel._handlePresenceUpdate(data.actorTokenId, presenceData);
         }
-        catch { }
     }
+    // ============ Private: Lobby ============
     _handleLobbyJoin(event) {
         const { actorId, data } = event;
         if (actorId === this._localUser?.actorTokenId)
             return;
-        const pd = data;
-        if (!pd.userId)
+        const presenceData = data;
+        if (!presenceData.userId || this._foreignScope(presenceData))
             return;
-        const user = this._presenceToUser(actorId, pd);
+        const user = this._presenceToUser(actorId, presenceData);
         this._actorToUserId.set(actorId, user.userId);
         if (!this._onlineUsers.has(user.userId)) {
             this._onlineUsers.set(user.userId, user);
@@ -640,8 +1005,12 @@ class NoLagFeed extends EventEmitter {
         const { actorId, data } = event;
         if (actorId === this._localUser?.actorTokenId)
             return;
-        const pd = data;
-        const userId = pd?.userId || this._actorToUserId.get(actorId);
+        const presenceData = data;
+        if (this._foreignScope(presenceData))
+            return;
+        const userId = presenceData?.userId
+            || this._actorToUserId.get(actorId)
+            || this._findUserIdByActorId(actorId);
         if (userId) {
             const user = this._onlineUsers.get(userId);
             if (user) {
@@ -651,34 +1020,81 @@ class NoLagFeed extends EventEmitter {
             }
         }
     }
-    _hydrateOnlineUsers(state) {
+    _handleLobbyUpdate(event) {
+        const { actorId, data } = event;
+        if (actorId === this._localUser?.actorTokenId)
+            return;
+        const presenceData = data;
+        if (!presenceData.userId || this._foreignScope(presenceData))
+            return;
+        const user = this._presenceToUser(actorId, presenceData);
+        this._onlineUsers.set(user.userId, user);
+    }
+    /**
+     * Reconcile the online-user map against a fresh lobby snapshot, emitting
+     * only the deltas (userOffline for vanished, userOnline for new). One path
+     * for initial hydration, reconnect restore, and the deferred refetch.
+     */
+    _diffHydrateOnlineUsers(state) {
+        // Build the fresh user set from the snapshot
+        const fresh = new Map();
+        const freshActors = new Map();
         for (const roomId of Object.keys(state)) {
-            for (const actorId of Object.keys(state[roomId])) {
+            const roomPresence = state[roomId];
+            for (const actorId of Object.keys(roomPresence)) {
                 if (actorId === this._localUser?.actorTokenId)
                     continue;
-                const raw = state[roomId][actorId];
-                const pd = (raw?.presence ?? raw);
-                if (pd?.userId) {
-                    const user = this._presenceToUser(actorId, pd);
-                    this._actorToUserId.set(actorId, user.userId);
-                    if (!this._onlineUsers.has(user.userId)) {
-                        this._onlineUsers.set(user.userId, user);
-                        this.emit('userOnline', user);
+                const raw = roomPresence[actorId];
+                // Server returns full actor records with presence nested under .presence
+                const presenceData = (raw?.presence ?? raw);
+                if (presenceData?.userId && !this._foreignScope(presenceData)) {
+                    if (!fresh.has(presenceData.userId)) {
+                        fresh.set(presenceData.userId, this._presenceToUser(actorId, presenceData));
                     }
+                    freshActors.set(actorId, presenceData.userId);
+                }
+            }
+        }
+        // Vanished users
+        for (const [userId, user] of [...this._onlineUsers]) {
+            if (!fresh.has(userId)) {
+                this._onlineUsers.delete(userId);
+                for (const [actorId, mappedUserId] of [...this._actorToUserId]) {
+                    if (mappedUserId === userId)
+                        this._actorToUserId.delete(actorId);
                 }
+                this.emit('userOffline', user);
             }
         }
+        // New users
+        for (const [userId, user] of fresh) {
+            if (!this._onlineUsers.has(userId)) {
+                this._onlineUsers.set(userId, user);
+                this.emit('userOnline', user);
+            }
+        }
+        for (const [actorId, userId] of freshActors) {
+            this._actorToUserId.set(actorId, userId);
+        }
     }
+    // ============ Private: Helpers ============
     _presenceToUser(actorTokenId, data) {
-        return { userId: data.userId, actorTokenId, username: data.username, avatar: data.avatar, metadata: data.metadata, joinedAt: Date.now(), isLocal: false };
+        return {
+            userId: data.userId,
+            actorTokenId,
+            username: data.username,
+            avatar: data.avatar,
+            metadata: data.metadata,
+            joinedAt: Date.now(),
+            isLocal: false,
+        };
     }
-    _restoreChannels() {
-        if (this._activeChannel) {
-            const ch = this._channels.get(this._activeChannel);
-            if (ch)
-                ch._updateLocalPresence();
+    _findUserIdByActorId(actorTokenId) {
+        for (const user of this._onlineUsers.values()) {
+            if (user.actorTokenId === actorTokenId)
+                return user.userId;
         }
-        this._lobby?.fetchPresence().then((s) => { this._onlineUsers.clear(); this._actorToUserId.clear(); this._hydrateOnlineUsers(s); }).catch(() => { });
+        return undefined;
     }
 }