@akhilpulse/samadhaan-session-replay 0.3.4 → 0.3.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@akhilpulse/samadhaan-session-replay",
-  "version": "0.3.4",
+  "version": "0.3.6",
   "description": "React Native SDK for Samadhaan Guided Support — session recording, live remote screen-share, take-control, and guided-tour overlays.",
   "main": "src/index.ts",
   "module": "src/index.ts",

package/src/SessionReplayProvider.tsx

@@ -47,7 +47,19 @@ const SessionReplayPixelCopy: PixelCopyNative | undefined =
 let pixelCopyDisabled = false; // turned true after a runtime failure to avoid retrying every frame
 
 const STORAGE_KEY = "@akhilpulse/samadhaan-session-replay/sessionId";
-const SDK_VERSION = "0.3.0";
+const SDK_VERSION = "0.3.6";
+
+// ---- Module-level session singleton --------------------------------------
+// Multiple SessionReplayProvider mounts (intentional or via React StrictMode's
+// double-invoke in dev) used to each race to POST /sessions before any of
+// them could persist the sessionId, producing 2-4 duplicate sessions on
+// startup. We now share a single in-flight init promise across every
+// Provider instance in the JS runtime so they all resolve to the same
+// session.
+type SessionInitResult = { sessionId: string; ingestToken: string; status: string } | null;
+let _activeSession: SessionInitResult = null;
+let _initPromise: Promise<SessionInitResult> | null = null;
+let _providerMountCount = 0;
 
 /** Default Samadhaan production endpoint. Override via `config.serverUrl` for staging. */
 export const DEFAULT_SERVER_URL = "https://samadhaan.pulseenergy.io";
@@ -138,26 +150,47 @@ export function SessionReplayProvider({ config, children }: { config: Config; ch
   // ---- Session init / resume ----
   // initTick is bumped whenever we recycle (sessionId went to null at runtime) so this effect re-fires.
   const [initTick, setInitTick] = useState(0);
+
+  // Mount-count singleton warning: if the host app accidentally renders the
+  // provider in two places, we still only init once (thanks to _initPromise),
+  // but we surface a warning so the developer knows.
+  useEffect(() => {
+    _providerMountCount += 1;
+    if (_providerMountCount > 1 && __DEV__) {
+      console.warn(
+        `[session-replay] SessionReplayProvider is mounted ${_providerMountCount} times. ` +
+        `Render it exactly once at the root of your app — the SDK will reuse a single session, ` +
+        `but multiple mounts waste resources.`
+      );
+    }
+    return () => { _providerMountCount = Math.max(0, _providerMountCount - 1); };
+  }, []);
+
   useEffect(() => {
     let cancelled = false;
-    (async () => {
+
+    // If another Provider instance (or a previous run of this same effect
+    // under StrictMode) already created a session, just adopt it. No new POST.
+    if (_activeSession) {
+      setSessionId(_activeSession.sessionId);
+      setIngestToken(_activeSession.ingestToken);
+      setStatus((_activeSession.status as Ctx["status"]) || "active");
+      return;
+    }
+
+    const doInit = async (): Promise<SessionInitResult> => {
       try {
         const stored = await AsyncStorage.getItem(STORAGE_KEY);
-        if (stored && !cancelled) {
-          // resume via PUBLIC status endpoint (no auth needed) — also returns the ingest token
+        if (stored) {
           const r = await fetch(`${serverUrl}/api/guided-support/sessions/${stored}/status`);
           if (r.ok) {
             const j = await r.json();
-            // If the stored session was already ended (server-side idle timeout while app
-            // was backgrounded), drop it and fall through to create a fresh one.
             if (j.status === "ended") {
               try { await AsyncStorage.removeItem(STORAGE_KEY); } catch {}
             } else {
-              if (!cancelled) { setSessionId(stored); setStatus(j.status || "active"); setIngestToken(j.ingestToken); }
-              return;
+              return { sessionId: stored, ingestToken: j.ingestToken, status: j.status || "active" };
             }
           } else {
-            // 404 / not found — clear stale id and create fresh.
             try { await AsyncStorage.removeItem(STORAGE_KEY); } catch {}
           }
         }
@@ -169,23 +202,41 @@ export function SessionReplayProvider({ config, children }: { config: Config; ch
             user: config.user,
             appVersion: config.appVersion,
             sdkVersion: SDK_VERSION,
-            deviceInfo: {
-              os: Platform.OS,
-              osVersion: String(Platform.Version),
-            },
+            deviceInfo: { os: Platform.OS, osVersion: String(Platform.Version) },
           }),
         });
         const j = await res.json();
-        if (!cancelled && j.sessionId) {
-          setSessionId(j.sessionId);
-          setIngestToken(j.ingestToken);
-          setStatus("active");
+        if (j.sessionId) {
           await AsyncStorage.setItem(STORAGE_KEY, j.sessionId);
+          return { sessionId: j.sessionId, ingestToken: j.ingestToken, status: "active" };
         }
-      } catch (e) {
-        // best-effort; SDK is non-blocking
+        return null;
+      } catch {
+        return null;
       }
-    })();
+    };
+
+    // Coalesce concurrent inits into a single in-flight promise. Any later
+    // mount that arrives while this is pending will await the same promise
+    // instead of issuing its own POST.
+    if (!_initPromise) {
+      _initPromise = doInit().then((result) => {
+        _activeSession = result;
+        return result;
+      }).finally(() => {
+        // Clear the promise once settled so a later recycle (initTick bump
+        // after the server idle-ends the session) can re-init.
+        _initPromise = null;
+      });
+    }
+
+    _initPromise.then((result) => {
+      if (cancelled || !result) return;
+      setSessionId(result.sessionId);
+      setIngestToken(result.ingestToken);
+      setStatus((result.status as Ctx["status"]) || "active");
+    });
+
     return () => { cancelled = true; };
   }, [config.appId, serverUrl, config.appVersion, config.user, initTick]);
 
@@ -618,10 +669,10 @@ const styles = StyleSheet.create({
   consentTitle: { color: "#0f172a", fontSize: 18, fontWeight: "700", marginBottom: 8, textAlign: "center" },
   consentBody: { color: "#475569", fontSize: 14, lineHeight: 20, textAlign: "center", marginBottom: 20 },
   consentEmphasis: { color: "#0f172a", fontWeight: "600" },
-  consentRow: { flexDirection: "row", justifyContent: "center", gap: 10, width: "100%" },
+  consentRow: { flexDirection: "row", justifyContent: "center", width: "100%", marginHorizontal: -5 },
   btn: {
     flex: 1, paddingVertical: 12, paddingHorizontal: 16, borderRadius: 10,
-    alignItems: "center", justifyContent: "center", minHeight: 44,
+    alignItems: "center", justifyContent: "center", minHeight: 44, marginHorizontal: 5,
   },
   btnPressed: { opacity: 0.7 },
   btnGhost: { backgroundColor: "#f1f5f9" },