@oxyhq/services 8.6.0 → 8.7.0

package/src/ui/components/OxyProvider.tsx

@@ -103,6 +103,7 @@ const OxyProvider: FC<OxyProviderProps> = ({
     children,
     onAuthStateChange,
     storageKeyPrefix,
+    appName,
     baseURL,
     authWebUrl,
     authRedirectUri,
@@ -296,6 +297,7 @@ const OxyProvider: FC<OxyProviderProps> = ({
                     authWebUrl={authWebUrl}
                     authRedirectUri={authRedirectUri}
                     storageKeyPrefix={storageKeyPrefix}
+                    appName={appName}
                     onAuthStateChange={onAuthStateChange as OxyContextProviderProps['onAuthStateChange']}
                 >
                     {children}

package/src/ui/components/SignInModal.tsx

@@ -93,7 +93,7 @@ const SignInModal: React.FC = () => {
 
     const insets = useSafeAreaInsets();
     const theme = useTheme();
-    const { oxyServices, switchSession } = useOxy();
+    const { oxyServices, switchSession, appName } = useOxy();
 
     const socketRef = useRef<Socket | null>(null);
     const pollingIntervalRef = useRef<ReturnType<typeof setInterval> | null>(null);
@@ -273,7 +273,7 @@ const SignInModal: React.FC = () => {
             await oxyServices.makeRequest('POST', '/auth/session/create', {
                 sessionToken,
                 expiresAt,
-                appId: Platform.OS,
+                appId: appName,
             }, { cache: false });
 
             setAuthSession({ sessionToken, expiresAt });
@@ -284,7 +284,7 @@ const SignInModal: React.FC = () => {
         } finally {
             setIsLoading(false);
         }
-    }, [oxyServices, connectSocket]);
+    }, [oxyServices, connectSocket, appName]);
 
     // Generate a cryptographically random session token.
     // 16 random bytes -> 32 hex chars (128 bits of entropy) — unguessable.

package/src/ui/context/OxyContext.tsx

@@ -42,6 +42,7 @@ import { useDeviceManagement } from '../hooks/useDeviceManagement';
 import { getStorageKeys, createPlatformStorage, type StorageInterface } from '../utils/storageHelpers';
 import { isInvalidSessionError, isTimeoutOrNetworkError } from '../utils/errorHandlers';
 import { readActiveAuthuser, writeActiveAuthuser } from '../utils/activeAuthuser';
+import { resolveAppDisplayName } from '../utils/appName';
 import type { RouteName } from '../navigation/routes';
 import { showBottomSheet as globalShowBottomSheet } from '../navigation/bottomSheetManager';
 import { useQueryClient } from '@tanstack/react-query';
@@ -114,6 +115,13 @@ export interface OxyContextState {
   clearSessionState: () => Promise<void>;
   clearAllAccountData: () => Promise<void>;
   storageKeyPrefix: string;
+  /**
+   * Resolved human-readable app display name surfaced on the central Oxy
+   * sign-in / consent experience (e.g. "Mention wants to access your Oxy
+   * account"). Always non-empty — derived from the `appName` prop, then
+   * `storageKeyPrefix`, then `document.title` (web), then the platform.
+   */
+  appName: string;
   oxyServices: OxyServices;
   useFollow?: UseFollowHook;
   showBottomSheet?: (screenOrConfig: RouteName | { screen: RouteName; props?: Record<string, unknown> }) => void;
@@ -140,6 +148,11 @@ export interface OxyContextProviderProps {
   authWebUrl?: string;
   authRedirectUri?: string;
   storageKeyPrefix?: string;
+  /**
+   * Human-readable name of the consuming app shown on the central Oxy
+   * sign-in / consent experience. See {@link OxyContextState.appName}.
+   */
+  appName?: string;
   onAuthStateChange?: (user: User | null) => void;
   onError?: (error: ApiError) => void;
 }
@@ -204,6 +217,34 @@ const SILENT_IFRAME_TIMEOUT = 2500;
  */
 const COOKIE_RESTORE_TIMEOUT = 3000;
 
+/**
+ * HARD overall deadline (ms) for the entire cold-boot step loop —
+ * defense-in-depth so a single non-settling step can NEVER hang auth resolution
+ * forever (the production regression: a `navigator.credentials.get()` that
+ * ignored its abort signal left the `fedcm-silent` step's promise unsettled, so
+ * `runColdBoot` never advanced to the terminal `/sso` bounce and auth hung
+ * indefinitely).
+ *
+ * Every step ALREADY bounds its own network work (the stored-session bearer
+ * validation at 8s, the silent iframe at `SILENT_IFRAME_TIMEOUT`, the refresh
+ * cookie at `COOKIE_RESTORE_TIMEOUT`, FedCM silent at `FEDCM_SILENT_TIMEOUT`
+ * plus its hard settle). On a healthy load the FIRST recovering step wins in a
+ * single round-trip (1–3s) and the chain short-circuits long before this fires.
+ * This budget only trips when one of those per-step bounds regresses.
+ *
+ * 20s is the chosen value: comfortably ABOVE the worst-case bounded
+ * stored-session path under transient slowness (the 8s parallel validation
+ * window plus a `switchSession` round-trip) so a genuinely slow-but-healthy
+ * reload is never cut off, yet well BELOW the ~28–30s the previous
+ * probe-first ordering took — and, critically, finite, so the user can never
+ * sit on an indefinite spinner. When the deadline trips, `runColdBoot` keeps
+ * iterating to the terminal `sso-bounce` step (whose navigation side effect
+ * runs synchronously), so a genuine no-local-session first visit STILL reaches
+ * the cross-domain `/sso` fallback. Native runs only the stored-session step,
+ * which is bounded well under this, so the deadline never alters native flow.
+ */
+const COLD_BOOT_OVERALL_DEADLINE = 20000;
+
 /**
  * Whether `idpOrigin` is a same-site, first-party host of the current page —
  * i.e. it shares the page's registrable apex (last two labels), so a "no
@@ -273,6 +314,7 @@ export const OxyProvider: React.FC<OxyContextProviderProps> = ({
   authWebUrl,
   authRedirectUri,
   storageKeyPrefix = 'oxy_session',
+  appName: appNameProp,
   onAuthStateChange,
   onError,
 }) => {
@@ -382,6 +424,14 @@ export const OxyProvider: React.FC<OxyContextProviderProps> = ({
 
   const storageKeys = useMemo(() => getStorageKeys(storageKeyPrefix), [storageKeyPrefix]);
 
+  // Human-readable app display name for the central sign-in / consent UI.
+  // Derived once from the consumer config; never "web" unless the app supplies
+  // no name, no custom prefix, and no document title.
+  const appName = useMemo(
+    () => resolveAppDisplayName(appNameProp, storageKeyPrefix),
+    [appNameProp, storageKeyPrefix],
+  );
+
   // Storage initialization.
   //
   // `storage` (state) drives render-time gating (`isStorageReady`) and the
@@ -1144,6 +1194,21 @@ export const OxyProvider: React.FC<OxyContextProviderProps> = ({
             );
           }
         },
+        // Defense-in-depth: a single step whose promise never settles (the
+        // production FedCM-silent hang) can no longer block the chain forever.
+        // On expiry the runner keeps iterating to the terminal `sso-bounce`
+        // step so a genuine no-local-session visit still reaches the
+        // cross-domain `/sso` fallback; the `finally` backstop flips
+        // `authResolved` regardless. See `COLD_BOOT_OVERALL_DEADLINE`.
+        overallDeadlineMs: COLD_BOOT_OVERALL_DEADLINE,
+        onStepDeadline: (id) => {
+          if (__DEV__) {
+            loggerUtil.debug(
+              `Cold-boot step "${id}" exceeded the overall deadline (abandoned, falling through)`,
+              { component: 'OxyContext', method: 'restoreSessionsFromStorage' },
+            );
+          }
+        },
       });
 
       if (__DEV__ && outcome.kind === 'session') {
@@ -1601,6 +1666,7 @@ export const OxyProvider: React.FC<OxyContextProviderProps> = ({
     clearSessionState,
     clearAllAccountData,
     storageKeyPrefix,
+    appName,
     oxyServices,
     useFollow: useFollowHook,
     showBottomSheet: showBottomSheetForContext,
@@ -1629,6 +1695,7 @@ export const OxyProvider: React.FC<OxyContextProviderProps> = ({
     logoutAllDeviceSessions,
     oxyServices,
     storageKeyPrefix,
+    appName,
     refreshSessionsWithUser,
     sessions,
     setLanguage,
@@ -1706,6 +1773,7 @@ const LOADING_STATE: OxyContextState = {
   clearSessionState: () => rejectMissingProvider<void>(),
   clearAllAccountData: () => rejectMissingProvider<void>(),
   storageKeyPrefix: 'oxy_session',
+  appName: resolveAppDisplayName(undefined, undefined),
   oxyServices: LOADING_STATE_OXY_SERVICES,
   openAvatarPicker: () => {},
   actingAs: null,

package/src/ui/screens/OxyAuthScreen.tsx

@@ -119,7 +119,7 @@ const OxyAuthScreen: React.FC<BaseScreenProps> = ({
   theme,
 }) => {
   const bloomTheme = useTheme();
-  const { oxyServices, signIn, switchSession, storageKeyPrefix } = useOxy();
+  const { oxyServices, signIn, switchSession, appName } = useOxy();
 
   const [authSession, setAuthSession] = useState<AuthSession | null>(null);
   const [isLoading, setIsLoading] = useState(true);
@@ -273,7 +273,7 @@ const OxyAuthScreen: React.FC<BaseScreenProps> = ({
       await oxyServices.makeRequest('POST', '/auth/session/create', {
         sessionToken,
         expiresAt,
-        appId: storageKeyPrefix ? storageKeyPrefix.charAt(0).toUpperCase() + storageKeyPrefix.slice(1) : Platform.OS,
+        appId: appName,
       }, { cache: false });
 
       setAuthSession({ sessionToken, expiresAt });
@@ -286,7 +286,7 @@ const OxyAuthScreen: React.FC<BaseScreenProps> = ({
     } finally {
       setIsLoading(false);
     }
-  }, [oxyServices, connectSocket]);
+  }, [oxyServices, connectSocket, appName]);
 
   // Generate a random session token
   const generateSessionToken = (): string => {

package/src/ui/types/navigation.ts

@@ -52,6 +52,14 @@ export interface OxyProviderProps {
     children?: ReactNode;
     onAuthStateChange?: (user: unknown) => void;
     storageKeyPrefix?: string;
+    /**
+     * Human-readable name of the consuming app (e.g. "Mention", "Homiio").
+     * Surfaced on the central Oxy sign-in / consent experience as
+     * "{appName} wants to access your Oxy account". When omitted, the SDK
+     * derives a name from `storageKeyPrefix`, then `document.title` (web),
+     * falling back to the platform. Set this to guarantee correct branding.
+     */
+    appName?: string;
     baseURL?: string;
     authWebUrl?: string;
     authRedirectUri?: string;

package/src/ui/utils/__tests__/appName.test.ts

@@ -0,0 +1,52 @@
+import { resolveAppDisplayName } from '../appName';
+
+// The shared react-native mock pins `Platform.OS` to 'web', which is exactly
+// the platform on which the historical "web wants to access your Oxy account"
+// regression occurred. These tests assert the resolution order that prevents it.
+
+describe('resolveAppDisplayName', () => {
+  const originalTitle = typeof document !== 'undefined' ? document.title : '';
+
+  afterEach(() => {
+    if (typeof document !== 'undefined') {
+      document.title = originalTitle;
+    }
+  });
+
+  it('prefers an explicit appName, trimmed', () => {
+    expect(resolveAppDisplayName('  Mention  ', 'oxy_session')).toBe('Mention');
+  });
+
+  it('explicit appName wins over a custom storageKeyPrefix', () => {
+    expect(resolveAppDisplayName('Mention', 'homiio')).toBe('Mention');
+  });
+
+  it('capitalizes a custom storageKeyPrefix when no appName is given', () => {
+    expect(resolveAppDisplayName(undefined, 'mention')).toBe('Mention');
+  });
+
+  it('ignores the default storageKeyPrefix (never surfaces "Oxy_session")', () => {
+    if (typeof document !== 'undefined') {
+      document.title = '';
+    }
+    expect(resolveAppDisplayName(undefined, 'oxy_session')).toBe('web');
+  });
+
+  it('falls back to document.title on web when no name or custom prefix is set', () => {
+    if (typeof document !== 'undefined') {
+      document.title = 'Homiio';
+    }
+    expect(resolveAppDisplayName(undefined, 'oxy_session')).toBe('Homiio');
+  });
+
+  it('falls back to the platform only when nothing else is available', () => {
+    if (typeof document !== 'undefined') {
+      document.title = '';
+    }
+    expect(resolveAppDisplayName(undefined, undefined)).toBe('web');
+  });
+
+  it('treats a whitespace-only appName as absent', () => {
+    expect(resolveAppDisplayName('   ', 'mention')).toBe('Mention');
+  });
+});

package/src/ui/utils/appName.ts

@@ -0,0 +1,62 @@
+import { Platform } from 'react-native';
+
+/**
+ * The `storageKeyPrefix` default applied by `OxyContextProvider`. When the
+ * consumer never overrides it, the prefix carries no app-identity signal and
+ * must NOT be used to derive a display name (it would surface "Oxy_session").
+ */
+const DEFAULT_STORAGE_KEY_PREFIX = 'oxy_session';
+
+/**
+ * Capitalize the first character of a non-empty string. Used to turn a lower
+ * case `storageKeyPrefix` (e.g. `"mention"`) into a presentable label
+ * (`"Mention"`). Pure; leaves the remainder untouched so multi-word or already
+ * capitalized values are preserved.
+ */
+function capitalizeFirst(value: string): string {
+  return value.charAt(0).toUpperCase() + value.slice(1);
+}
+
+/**
+ * Resolve a human-readable application display name for the consent / sign-in
+ * UI shown by the central Oxy auth experience (e.g. "Mention wants to access
+ * your Oxy account"). This is sent as the `appId` field on
+ * `POST /auth/session/create` and rendered verbatim by the auth consent page.
+ *
+ * Resolution order (first non-empty wins):
+ *   1. An explicit `appName` declared by the consumer on `OxyProvider`.
+ *   2. The capitalized `storageKeyPrefix` — but only when the consumer actually
+ *      overrode the default. Apps already pass a brand-shaped prefix
+ *      (`"mention"`, `"homiio"`, …) so this gives most apps a correct name with
+ *      zero extra config.
+ *   3. On web only, a meaningful `document.title` (trimmed). This rescues
+ *      zero-config web apps that set a page title but no prefix.
+ *   4. `Platform.OS` as the terminal fallback. On web this yields the historical
+ *      `"web"` value — now reached ONLY when an app supplies neither an explicit
+ *      name, a custom prefix, nor a document title.
+ *
+ * The result is never empty.
+ */
+export function resolveAppDisplayName(
+  appName: string | undefined,
+  storageKeyPrefix: string | undefined,
+): string {
+  const explicit = appName?.trim();
+  if (explicit) {
+    return explicit;
+  }
+
+  const prefix = storageKeyPrefix?.trim();
+  if (prefix && prefix !== DEFAULT_STORAGE_KEY_PREFIX) {
+    return capitalizeFirst(prefix);
+  }
+
+  if (Platform.OS === 'web' && typeof document !== 'undefined') {
+    const title = document.title?.trim();
+    if (title) {
+      return title;
+    }
+  }
+
+  return Platform.OS;
+}