@ethora/chat-component-rn 26.5.5 → 26.5.10

package/src/context/MessageNotificationContext.tsx

@@ -1,6 +1,6 @@
 // RN port of the web MessageNotificationProvider. Renders Telegram-style
 // in-app toasts when a new message arrives in a room that is NOT the
-// currently active room. Backed by the global messageNotificationManager,
+// currently visible room. Backed by the global messageNotificationManager,
 // which means non-React code (stanza handlers) can push notifications.
 import React, {
   createContext,
@@ -63,8 +63,8 @@ export const MessageNotificationProvider: React.FC<ProviderProps> = ({
   const contextConfig = useSelector(
     (state: RootState) => state.chatSettingStore?.config
   );
-  const activeRoomJID = useSelector(
-    (state: RootState) => state.rooms.activeRoomJID
+  const visibleRoomJID = useSelector(
+    (state: RootState) => state.rooms.visibleRoomJID
   );
 
   const config = propConfig || contextConfig;
@@ -104,9 +104,9 @@ export const MessageNotificationProvider: React.FC<ProviderProps> = ({
 
   // Clear toasts when their room becomes active.
   useEffect(() => {
-    if (!activeRoomJID) {return;}
-    setToasts((prev) => prev.filter((t) => t.roomJID !== activeRoomJID));
-  }, [activeRoomJID]);
+    if (!visibleRoomJID) {return;}
+    setToasts((prev) => prev.filter((t) => t.roomJID !== visibleRoomJID));
+  }, [visibleRoomJID]);
 
   const dismiss = useCallback((id: string) => {
     setToasts((prev) => prev.filter((t) => t.id !== id));
@@ -142,7 +142,7 @@ export const MessageNotificationProvider: React.FC<ProviderProps> = ({
     ) => {
       if (!isEnabled) {return;}
       // Don't toast for the currently active room.
-      if (activeRoomJID && activeRoomJID === roomJID) {return;}
+      if (visibleRoomJID && visibleRoomJID === roomJID) {return;}
       const id = `msg-notification-${message.id}-${Date.now()}`;
       const item: ToastItem = {
         id,
@@ -159,7 +159,7 @@ export const MessageNotificationProvider: React.FC<ProviderProps> = ({
           : next;
       });
     },
-    [isEnabled, activeRoomJID, maxNotifications]
+    [isEnabled, visibleRoomJID, maxNotifications]
   );
 
   // Register with the global manager.

package/src/context/xmppProvider.tsx

@@ -4,11 +4,16 @@ import React, {
   useCallback,
   useContext,
   useEffect,
+  useMemo,
   useRef,
   useState,
 } from 'react';
 import { AppState, DeviceEventEmitter } from 'react-native';
-import XmppClient from '../networking/xmppClient';
+import NetInfo from '@react-native-community/netinfo';
+import XmppClient, {
+  XmppCredentialsProvider,
+} from '../networking/xmppClient';
+import { refreshTokens } from '../roomStore/chatSettingsSlice';
 import {
   IConfig,
   ProviderBootstrapStatus,
@@ -17,6 +22,7 @@ import {
 } from '../types/types';
 import {
   buildXmppClientKey,
+  getGlobalXmppClient,
   getReusableXmppClientByKey,
   isXmppClientReusable,
   setGlobalXmppClient,
@@ -24,6 +30,7 @@ import {
 } from '../utils/clientRegistry';
 import {
   applyResolvedUserToStore,
+  refreshUserCredentialsForXmpp,
   resolveInitBeforeLoadUser,
 } from '../helpers/resolveInitBeforeLoadUser';
 import { ensureScopedChatCache } from '../helpers/ensureScopedChatCache';
@@ -31,7 +38,13 @@ import { getRooms as prefetchRoomsViaRest } from '../networking/api-requests/roo
 import { allRoomPresences } from '../networking/xmpp/allRoomPresences.xmpp';
 import { store } from '../roomStore';
 import { logout, setStoreClient } from '../roomStore/chatSettingsSlice';
-import { setLogoutState } from '../roomStore/roomsSlice';
+import {
+  setLogoutState,
+  setVisibleRoom,
+  clearVisibleRoom,
+  setLastViewedTimestamp,
+  deleteRoomMessage,
+} from '../roomStore/roomsSlice';
 import { runHistoryPreloadScheduler } from '../helpers/historyPreloadScheduler';
 import { asyncLocalStorage } from '../hooks/useLocalStorage';
 import { localStorageConstants } from '../helpers/constants/LOCAL_STORAGE';
@@ -59,15 +72,18 @@ const XmppContext = createContext<XmppContextType | null>(null);
 interface XmppProviderProps {
   children: ReactNode;
   config?: IConfig;
+  // Consumer-supplied "is the chat surface shown" signal for hosts that
+  // keep <Chat> mounted while hidden (tab/route navigators). See the
+  // visibility effect below. Omit when you unmount <Chat> on hide.
+  isVisible?: boolean;
 }
 
 const LOGOUT_EVENT = 'ethora-xmpp-logout';
 
-export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config }) => {
+export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config, isVisible }) => {
   const [client, setClient] = useState<XmppClient | null>(null);
   const [providerBootstrapStatus, setProviderBootstrapStatus] =
     useState<ProviderBootstrapStatus>('idle');
-  const [reconnectAttempts, setReconnectAttempts] = useState(0);
 
   // Track which "init mode" this provider runs in. When config.initBeforeLoad
   // is true, the provider owns bootstrap and ChatWrapper just waits.
@@ -77,6 +93,79 @@ export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config })
   const completedBootstrapKeyRef = useRef<string>('');
   const inflightBootstrapKeyRef = useRef<string>('');
 
+  // Callback XmppClient uses to fetch fresh credentials after a SASL
+  // `not-authorized` (typically JWT expiry during idle, bug #17).
+  // Always installed — the underlying `refreshUserCredentialsForXmpp`
+  // picks the right path based on config:
+  //   - `jwtLogin` → re-exchange JWT via `/users/client`
+  //   - `userLogin` / `customLogin` / store / persisted → `/users/my`
+  //     with REST refresh chain (handles 401 → refresh → retry)
+  // Returns last-known cached creds if nothing usable is available so
+  // the XmppClient at least doesn't crash on `undefined.password`.
+  const credentialsProvider = useMemo<XmppCredentialsProvider>(() => {
+    return async () => {
+      // 1. Consumer-supplied REST refresh (when wired). This runs
+      //    before the SDK's own refresh chain so non-Ethora backends
+      //    can keep auth state in sync with their own token endpoint.
+      const customRefresh = config?.refreshTokens?.refreshFunction;
+      if (customRefresh) {
+        try {
+          const result = await customRefresh();
+          if (result?.accessToken) {
+            store.dispatch(
+              refreshTokens({
+                token: result.accessToken,
+                refreshToken: result.refreshToken || '',
+              })
+            );
+          }
+        } catch (err) {
+          devPushLog('warn', 'XMPP creds refresh: customRefresh failed', err);
+        }
+      }
+
+      // 2. Re-mint XMPP creds via the right priority chain for the
+      //    current auth mode. This call ALWAYS hydrates (unlike
+      //    `resolveInitBeforeLoadUser` which short-circuits when a
+      //    cached user already has xmppCredentials).
+      const fresh = await refreshUserCredentialsForXmpp(config).catch(
+        (err) => {
+          devPushLog('warn', 'XMPP creds refresh: full chain failed', err);
+          return null;
+        }
+      );
+      if (fresh) {
+        applyResolvedUserToStore(fresh);
+        return {
+          username:
+            fresh.xmppUsername ||
+            fresh.defaultWallet?.walletAddress ||
+            '',
+          password: fresh.xmppPassword || '',
+        };
+      }
+
+      // 3. Last-resort: return the cached creds so reconnect() can
+      //    still attempt a connection. If the original failure was
+      //    a stale JWT this will fail again and the user has to
+      //    re-mount the chat — but at least we don't break the
+      //    transient-network-blip case where the cached creds are
+      //    still valid.
+      const u = store.getState().chatSettingStore.user;
+      return {
+        username: u?.xmppUsername || u?.defaultWallet?.walletAddress || '',
+        password: u?.xmppPassword || '',
+      };
+    };
+  }, [
+    config?.jwtLogin?.enabled,
+    config?.jwtLogin?.token,
+    config?.refreshTokens?.refreshFunction,
+    config?.userLogin?.enabled,
+    config?.customLogin?.enabled,
+    config?.initBeforeLoadAuth?.myEndpoint,
+  ]);
+
   const initializeClient = useCallback(
     async (
       username: string,
@@ -103,7 +192,17 @@ export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config })
       // 3. Otherwise create a new client under the init lock to dedup
       //    concurrent calls for the same key.
       const created = await withXmppClientInitLock(key, async () => {
+        const prevGlobal = getGlobalXmppClient();
+        if (prevGlobal) {
+          try { await prevGlobal.close(); } catch {}
+        }
         const newClient = new XmppClient(username, password, settings);
+        // Wire up the credentialsProvider so SASL `not-authorized`
+        // after idle triggers a refresh chain (jwtLogin →
+        // /users/client; userLogin/customLogin/store → /users/my +
+        // REST refresh) instead of looping forever with stale creds.
+        // Bug #17 — full coverage in 26.5.6.
+        newClient.setCredentialsProvider(credentialsProvider);
         setGlobalXmppClient(newClient, key);
         await newClient.waitForOnline().catch((err) => {
           console.error('Error waiting for xmpp online:', err);
@@ -112,12 +211,37 @@ export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config })
         return newClient;
       });
 
+      // Reused clients (steps 1+2 above) also need the provider — config
+      // may have changed since the singleton was created.
+      created.setCredentialsProvider(credentialsProvider);
+
+      // Re-join MUC rooms on every 'online'. After a reconnect the new
+      // XMPP stream isn't a member of any room, so a sent message gets a
+      // local double-tick but never reaches the room (bug #21). Re-sending
+      // presence on reconnect fixes delivery. On the very first connect
+      // the room list isn't loaded yet so this joins nothing — the
+      // bootstrap's own allRoomPresences handles that pass.
+      created.setOnOnline(() => {
+        const underlying = (created as any).client;
+        if (!underlying) {return;}
+        allRoomPresences(underlying).catch((e) =>
+          devPushLog('warn', 'reconnect: allRoomPresences re-join failed', e)
+        );
+        // Also refresh the private store so unread / lastViewed markers
+        // are accurate after a long reconnect — the MUC re-join above only
+        // restores delivery, not unread state. Idempotent on first connect.
+        created
+          .getChatsPrivateStoreRequestStanza()
+          .catch((e: unknown) =>
+            devPushLog('warn', 'reconnect: privateStore refresh failed', e)
+          );
+      });
+
       setClient(created);
       lastCredsRef.current = { username, password, settings };
-      setReconnectAttempts(0);
       return created;
     },
-    [client, config?.xmppSettings]
+    [client, config?.xmppSettings, credentialsProvider]
   );
 
   // -----------------------------------------------------------
@@ -131,6 +255,30 @@ export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config })
 
     const abortController = new AbortController();
     let cancelled = false;
+    // Auto-retry a TRANSIENT bootstrap failure a few times with backoff
+    // before surfacing the error modal — a flaky network at launch should
+    // self-heal, not dead-end the user on a Retry button. (Bad-creds
+    // failures resolve to null below and fail fast — they never reach the
+    // catch, so they aren't retried.)
+    const MAX_BOOTSTRAP_ATTEMPTS = 3;
+    let bootstrapAttempt = 0;
+    // Overall time budget: if we never reach 'ready' (a step hangs), abort
+    // the in-flight work and fail so the loader can't spin forever.
+    const BOOTSTRAP_BUDGET_MS = 45000;
+    let reachedReady = false;
+    let budgetTimer: ReturnType<typeof setTimeout> | null = setTimeout(() => {
+      if (cancelled || reachedReady) {return;}
+      devPushLog('warn', 'initBeforeLoad: time budget exceeded → failed');
+      abortController.abort();
+      inflightBootstrapKeyRef.current = '';
+      setProviderBootstrapStatus('failed');
+    }, BOOTSTRAP_BUDGET_MS);
+    const clearBudget = () => {
+      if (budgetTimer) {
+        clearTimeout(budgetTimer);
+        budgetTimer = null;
+      }
+    };
 
     const run = async () => {
       // Stable bootstrap key — re-run only when these change.
@@ -244,6 +392,8 @@ export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config })
         store.dispatch(setStoreClient(c));
         completedBootstrapKeyRef.current = key;
         inflightBootstrapKeyRef.current = '';
+        reachedReady = true;
+        clearBudget();
         setProviderBootstrapStatus('ready');
         devPushLog('rn', 'initBeforeLoad: READY');
 
@@ -264,13 +414,34 @@ export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config })
           roomLimit: qos?.preloadTopKRooms,
         }).catch((err) => console.warn('History preload scheduler failed', err));
       } catch (error: any) {
-        if (cancelled) {return;}
-        devPushLog('error', 'initBeforeLoad: bootstrap threw', {
+        if (cancelled || abortController.signal.aborted) {return;}
+        bootstrapAttempt += 1;
+        // Throws here are transient (network / XMPP connect). A bad-creds
+        // failure resolves to null above and fails fast without throwing,
+        // so it never reaches this catch. Retry with backoff before the
+        // modal; release the in-flight key so the recursive run() isn't
+        // short-circuited by its own guard.
+        if (bootstrapAttempt < MAX_BOOTSTRAP_ATTEMPTS) {
+          const backoff = Math.min(8000, 1000 * 2 ** (bootstrapAttempt - 1));
+          devPushLog(
+            'rn',
+            `initBeforeLoad: attempt ${bootstrapAttempt} failed (${error?.message}); retrying in ${backoff}ms`
+          );
+          inflightBootstrapKeyRef.current = '';
+          setTimeout(() => {
+            if (!cancelled && !abortController.signal.aborted) {
+              run();
+            }
+          }, backoff);
+          return;
+        }
+        devPushLog('error', 'initBeforeLoad: bootstrap threw (giving up)', {
           message: error?.message,
           status: error?.response?.status,
           data: error?.response?.data,
         });
         inflightBootstrapKeyRef.current = '';
+        clearBudget();
         setProviderBootstrapStatus('failed');
       }
     };
@@ -279,6 +450,7 @@ export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config })
 
     return () => {
       cancelled = true;
+      clearBudget();
       abortController.abort();
       // Re-running this effect (deps changed or unmount) must release the
       // in-flight bootstrap key so the next render isn't permanently
@@ -308,29 +480,30 @@ export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config })
   ]);
 
   // -----------------------------------------------------------
-  // Reconnect / reinit on disconnect
+  // Reconnect watchdog. The client now owns reconnection (onDisconnect →
+  // scheduleReconnect with uncapped, clamped backoff; a connect 'error'
+  // reschedules too). This is the single provider-side safety net for the
+  // states the event-driven triggers miss: a stuck 'connecting', a connect
+  // 'error', or a server-side outage where NetInfo never reported the
+  // device offline. While foregrounded, if we're not provably online and
+  // not suppressed, force a reconnect (debounced inside forceReconnect).
+  //
+  // Replaces the old status-keyed reconnect effect, which keyed on
+  // `client.status` — a mutated class field React does NOT track — so on a
+  // silent socket drop it frequently never re-ran (and its 3-attempts-then-
+  // full-reinit path was effectively dead).
   // -----------------------------------------------------------
   useEffect(() => {
     if (!client) {return;}
-    if (client.status !== 'offline') {return;}
-
-    if (reconnectAttempts < 3) {
-      console.log(`xmpp reconnect attempt ${reconnectAttempts + 1}`);
-      client.scheduleReconnect();
-      setReconnectAttempts((prev) => prev + 1);
-      return;
-    }
-
-    // After 3 failed reconnects, drop the client and re-init from scratch.
-    if (lastCredsRef.current) {
-      const { username, password, settings } = lastCredsRef.current;
-      setGlobalXmppClient(null);
-      setClient(null);
-      initializeClient(username, password, settings).catch((err) =>
-        console.error('Full reinit failed:', err)
-      );
-    }
-  }, [client, client?.status, reconnectAttempts, initializeClient]);
+    const id = setInterval(() => {
+      if (AppState.currentState !== 'active') {return;}
+      if (client.status !== 'online' && !client.suppressReconnect) {
+        devPushLog('rn', `watchdog: client ${client.status} → forceReconnect`);
+        client.forceReconnect();
+      }
+    }, 30000);
+    return () => clearInterval(id);
+  }, [client]);
 
   // -----------------------------------------------------------
   // AppState → background: flush lastViewedTimestamp into the
@@ -345,22 +518,143 @@ export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config })
   // entry, or when this build has `disableLastRead`.
   // -----------------------------------------------------------
   useEffect(() => {
+    // Remembers the room that was visible when we backgrounded so it can
+    // be re-marked visible on return. Lives in the effect closure (one per
+    // client) — persists across the listener's many invocations.
+    let visibleBeforeBackground: string | null = null;
     const sub = AppState.addEventListener('change', (next) => {
-      if (next === 'active') {return;}
       const c = client;
+      if (next === 'active') {
+        // Returned to foreground. If the socket died while backgrounded
+        // (iOS suspends the WebSocket; long background kills it), the
+        // status may still read 'online' until xmpp.js notices the dead
+        // TCP — which can take a full timeout. Force an immediate
+        // reconnect when we're not provably online so cached UI gets
+        // live again fast instead of "100 years".
+        // Only force a reconnect from a genuinely dead state. Don't
+        // interrupt an in-progress 'connecting' (iOS delivers spurious
+        // inactive→active flaps for control-center / notifications /
+        // biometric prompts that would otherwise restart a healthy
+        // connect).
+        if (c && (c.status === 'offline' || c.status === 'error')) {
+          devPushLog('rn', `AppState active: client ${c.status} → forceReconnect`);
+          c.forceReconnect();
+        }
+        // Re-mark the previously-open room visible so its unread clears
+        // now that the user is looking again. We restore ONLY what was
+        // visible at background time, so a chat the consumer had already
+        // blurred (e.g. on a non-chat tab/route) correctly stays cleared.
+        if (visibleBeforeBackground) {
+          store.dispatch(setVisibleRoom({ roomJID: visibleBeforeBackground }));
+          visibleBeforeBackground = null;
+        }
+        return;
+      }
+      // Going to background/inactive (sleep / app switcher / tray):
       if (!c) {return;}
       const state = store.getState();
       const rooms = state.rooms?.rooms;
-      const activeRoomJID = state.rooms?.activeRoomJID || null;
+      const visibleRoomJID = state.rooms?.visibleRoomJID || null;
+      // Mark the open room "not visible" while backgrounded so messages
+      // that arrive (or MAM-replay on reconnect) count as unread instead
+      // of being silently treated as read — the "mounted == visible ==
+      // read" gap. Stamp lastViewed=now as the read baseline, clear
+      // visibility, then flush that marker to the server private store.
+      // Restored on the next 'active' transition above. Handled here in
+      // the provider so consumers using the component as a package get
+      // correct unread without reaching into the chat store themselves.
+      visibleBeforeBackground = visibleRoomJID;
+      if (visibleRoomJID) {
+        store.dispatch(
+          setLastViewedTimestamp({ chatJID: visibleRoomJID, timestamp: Date.now() })
+        );
+        // Drop the "New messages" divider for the room we're leaving so it
+        // doesn't linger when the user comes back (mirrors ChatRoom's
+        // unmount cleanup, which never runs while the pane stays mounted).
+        store.dispatch(
+          deleteRoomMessage({ roomJID: visibleRoomJID, messageId: 'delimiter-new' })
+        );
+        store.dispatch(clearVisibleRoom());
+      }
       // Fire-and-forget — we're going to the background and don't
       // care about the resolution path.
-      c.flushLastViewedToPrivateStoreStanza(rooms, { activeRoomJID }).catch(
+      c.flushLastViewedToPrivateStoreStanza(rooms, { visibleRoomJID }).catch(
         () => {}
       );
     });
     return () => sub.remove();
   }, [client]);
 
+  // -----------------------------------------------------------
+  // Consumer visibility signal (`isVisible` prop). For hosts that keep
+  // <Chat> MOUNTED while hidden (tab/route navigators — so the XMPP
+  // connection survives tab switches), ChatRoom's mount/unmount can't tell
+  // "shown" from "hidden", so the unread middleware would keep the open
+  // room's badge at 0 and messages arriving while you're elsewhere look
+  // already-read. When the host passes `isVisible`, mirror the AppState
+  // background/foreground handling: hidden → stamp lastViewed=now + clear
+  // room visibility (so later messages count) + flush; shown → restore
+  // visibility for the open room. Doing it here means consumers never
+  // touch the chat store themselves. (Undefined = host unmounts on hide,
+  // nothing to do.)
+  // -----------------------------------------------------------
+  useEffect(() => {
+    if (typeof isVisible !== 'boolean') {return;}
+    const state = store.getState();
+    const rooms = state.rooms?.rooms;
+    const activeRoomJID = state.rooms?.activeRoomJID || null;
+    if (isVisible) {
+      if (activeRoomJID) {
+        store.dispatch(setVisibleRoom({ roomJID: activeRoomJID }));
+      }
+    } else {
+      if (activeRoomJID) {
+        store.dispatch(
+          setLastViewedTimestamp({ chatJID: activeRoomJID, timestamp: Date.now() })
+        );
+        // Drop the "New messages" divider so it's gone when the user
+        // returns to the chat (mirrors ChatRoom's unmount cleanup).
+        store.dispatch(
+          deleteRoomMessage({ roomJID: activeRoomJID, messageId: 'delimiter-new' })
+        );
+      }
+      store.dispatch(clearVisibleRoom());
+      if (client?.flushLastViewedToPrivateStoreStanza) {
+        client
+          .flushLastViewedToPrivateStoreStanza(rooms, { visibleRoomJID: activeRoomJID })
+          .catch(() => {});
+      }
+    }
+  }, [isVisible, client]);
+
+  // -----------------------------------------------------------
+  // NetInfo → proactive reconnect on network restore. Without this the
+  // only reconnect trigger is xmpp.js noticing the socket is dead, which
+  // on a Wi-Fi/cellular drop can hang on the TCP timeout for tens of
+  // seconds. NetInfo tells us the instant connectivity returns so we can
+  // force a reconnect immediately (and reset the backoff budget).
+  // -----------------------------------------------------------
+  useEffect(() => {
+    if (!client) {return;}
+    const unsub = NetInfo.addEventListener((state) => {
+      // Guard against undefined/partial state (jest mock, early emit).
+      const reachable =
+        !!state?.isConnected && state?.isInternetReachable !== false;
+      if (!reachable) {return;}
+      // Reachable. If we're in a dead state, kick a reconnect — do NOT
+      // require a prior offline→online transition (a missed/coalesced
+      // offline event otherwise left us stuck offline forever). Skip
+      // 'connecting' so we don't interrupt an in-progress connect; the
+      // watchdog covers a stuck 'connecting'. forceReconnect() debounces
+      // bursts and resets the backoff itself.
+      if (client.status === 'offline' || client.status === 'error') {
+        devPushLog('rn', `NetInfo: reachable & client ${client.status} → forceReconnect`);
+        client.forceReconnect();
+      }
+    });
+    return () => unsub();
+  }, [client]);
+
   // -----------------------------------------------------------
   // Retry-bootstrap listener — fired by ChatWrapper's error modal so
   // a transient failure (bad endpoint, server hiccup, etc.) can be
@@ -391,7 +685,6 @@ export const XmppProvider: React.FC<XmppProviderProps> = ({ children, config })
       setClient(null);
       completedBootstrapKeyRef.current = '';
       inflightBootstrapKeyRef.current = '';
-      setReconnectAttempts(0);
       setProviderBootstrapStatus('idle');
       await clearPersistedState();
     });
@@ -418,6 +711,18 @@ export const useXmppClient = () => {
   if (!context) {
     throw new Error('useXmppClient must be used within an XmppProvider');
   }
+  if (!context.client) {
+    const candidates: Array<XmppClient | null | undefined> = [
+      getGlobalXmppClient(),
+      store.getState()?.chatSettingStore?.client as XmppClient | undefined,
+    ];
+    const live = candidates.find(
+      (c) => c && (c as any).status === 'online'
+    );
+    if (live) {
+      return { ...context, client: live };
+    }
+  }
   return context;
 };
 

package/src/helpers/chatAutoEnterer.ts

@@ -2,6 +2,7 @@
 
 import { AppDispatch } from '../roomStore';
 import { setCurrentRoom } from '../roomStore/roomsSlice';
+import { normalizeRoomJid } from './normalizeRoomJid';
 
 interface XmppConfig {
   xmppSettings?: {
@@ -25,15 +26,8 @@ export const chatAutoEnterer = ({
   console.log('🟡 chatAutoEnterer: Called', { roomJID, wasAutoSelected });
 
   if (roomJID) {
-    // If roomJID is already a full JID, use it directly
-    // Otherwise, construct it from chatId if needed
     const conferenceDomain = config.xmppSettings?.conference ?? '';
-    let finalRoomJID = roomJID;
-
-    if (!roomJID.includes('@') && conferenceDomain) {
-      finalRoomJID = `${roomJID}@${conferenceDomain}`;
-      console.log('🟡 chatAutoEnterer: Constructed roomJID', finalRoomJID);
-    }
+    const finalRoomJID = normalizeRoomJid(roomJID, conferenceDomain);
 
     console.log('🟡 chatAutoEnterer: Setting current room', finalRoomJID);
     dispatch(setCurrentRoom({ roomJID: finalRoomJID }));

package/src/helpers/historyPreloadScheduler.ts

@@ -25,7 +25,10 @@ interface QueueItem {
 }
 
 const DEFAULT_CONCURRENCY = 3;
-const DEFAULT_PAGE_SIZE = 10;
+// Fetch the most recent ~20 on re-entry (mirrors web). A larger first page
+// also means more id-overlap with cache, so the merge in
+// `mergeHistoryIntoCache` rarely has to fall back to clear-and-replace.
+const DEFAULT_PAGE_SIZE = 20;
 const DEFAULT_RETRY_LIMIT = 2;
 
 const sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));

package/src/helpers/insertMessageWithDelimiter.ts

@@ -29,10 +29,21 @@ export function insertMessageWithDelimiter(
   );
 
   if (existingIndex !== -1) {
-    roomMessages[existingIndex] = deepMerge(
-      { ...roomMessages[existingIndex] },
-      { ...message, pending: false }
-    );
+    const existing = roomMessages[existingIndex];
+    // Preserve the sender identity captured on first insert. The MUC echo
+    // parses user.id from the stanza's `from`/senderJID (the room nick or
+    // bare-jid local part), which often differs from the optimistic
+    // sender id (xmppUsername / walletAddress) set when WE sent it.
+    // deepMerge would overwrite it, flipping an own message to the "other"
+    // side (rendered on the left, "as if someone else wrote it"). Keep the
+    // original id so ownership (user.id === self) stays correct.
+    const preservedUserId =
+      (existing as any)?.user?.id || (message as any)?.user?.id;
+    const merged = deepMerge({ ...existing }, { ...message, pending: false });
+    if (merged.user && preservedUserId) {
+      merged.user.id = preservedUserId;
+    }
+    roomMessages[existingIndex] = merged;
     return;
   }
 
@@ -60,25 +71,21 @@ export function insertMessageWithDelimiter(
         isDateAfter(msg.date?.toString() ?? '', lastViewedTimestamp.toString())
       );
 
-      if (delimiterIndex !== -1) {
-        roomMessages.splice(delimiterIndex, 0, {
-          id: 'delimiter-new',
-          user: {
+        if (delimiterIndex !== -1) {
+          roomMessages.splice(delimiterIndex, 0, {
+            id: 'delimiter-new',
+            user: {
             id: 'system',
             name: undefined,
             token: '',
             refreshToken: '',
           },
           date: new Date().toString(),
-          body: 'New Messages',
-          roomJid: '',
-        });
-
-        if (lastViewedTimestamp.toString() === '0') {
-          roomMessages.splice(delimiterIndex, 1);
+            body: 'New Messages',
+            roomJid: '',
+          });
         }
       }
-    }
   } else if (
     isDateBefore(newMessageDate.toString(), firstMessage?.date?.toString() ?? '')
   ) {