@oxyhq/services 10.2.1 → 10.2.2

package/src/ui/context/OxyContext.tsx

@@ -4,6 +4,7 @@ import {
   useCallback,
   useContext,
   useEffect,
+  useLayoutEffect,
   useMemo,
   useRef,
   useState,
@@ -287,6 +288,12 @@ function isSameSiteIdP(idpOrigin: string): boolean {
   return idpHostname === pageApex || idpHostname.endsWith(`.${pageApex}`);
 }
 
+function isOnSsoCallbackPath(): boolean {
+  return isWebBrowser() && window.location.pathname === SSO_CALLBACK_PATH;
+}
+
+const useBrowserLayoutEffect = typeof document !== 'undefined' ? useLayoutEffect : useEffect;
+
 let cachedUseFollowHook: UseFollowHook | null = null;
 
 const loadUseFollowHook = (): UseFollowHook => {
@@ -387,6 +394,7 @@ export const OxyProvider: React.FC<OxyContextProviderProps> = ({
   const [authResolved, setAuthResolved] = useState(false);
   const authResolvedRef = useRef(false);
   const [initialized, setInitialized] = useState(false);
+  const [ssoCallbackIntercepting, setSsoCallbackIntercepting] = useState(false);
   const setAuthState = useAuthStore.setState;
 
   // Keep the shared `oxyClient` singleton's token store in lockstep with the
@@ -1293,13 +1301,12 @@ export const OxyProvider: React.FC<OxyContextProviderProps> = ({
   // +not-found screen before the storage-gated cold-boot `sso-return` step gets
   // a chance to strip the fragment and restore the real destination.
   //
-  // This effect fires the SAME `runSsoReturn` kernel the instant we mount ON the
-  // callback path, BEFORE the cold boot (which awaits storage init). It restores
-  // the pre-bounce destination (and, on `ok`, commits the exchanged session via
-  // `handleWebSSOSession`) immediately, so the router re-syncs off the callback
-  // path and never lingers on it. Because the SDK owns this interception
-  // entirely, NO app needs a `/__oxy/sso-callback` route — it works identically
-  // across every consumer with zero per-app code.
+  // This effect fires the SAME `runSsoReturn` kernel the instant we hydrate ON
+  // the callback path, BEFORE the cold boot (which awaits storage init). The
+  // first render intentionally matches the app/router's static HTML; the
+  // browser layout effect then hides the internal route and consumes the
+  // callback before the first visible paint. That keeps SSR/SSG hydration stable
+  // while still ensuring no app needs a `/__oxy/sso-callback` route.
   //
   // It is purely ADDITIVE. The later cold-boot `sso-return` step stays as
   // defense-in-depth for the non-callback-path case; `consumeSsoReturn` strips
@@ -1315,13 +1322,13 @@ export const OxyProvider: React.FC<OxyContextProviderProps> = ({
   // already wired when this fires at eager-mount time. If for any reason it were
   // not yet set, the later cold-boot `sso-return` step would commit it — but the
   // ref IS set during render, so the eager `ok` commit works.
-  useEffect(() => {
-    if (!isWebBrowser()) {
-      return;
-    }
-    if (window.location.pathname !== SSO_CALLBACK_PATH) {
+  useBrowserLayoutEffect(() => {
+    if (!isOnSsoCallbackPath()) {
+      setSsoCallbackIntercepting(false);
       return;
     }
+    let mounted = true;
+    setSsoCallbackIntercepting(true);
     runSsoReturnRef.current().catch((error) => {
       if (__DEV__) {
         loggerUtil.debug(
@@ -1330,7 +1337,15 @@ export const OxyProvider: React.FC<OxyContextProviderProps> = ({
           error,
         );
       }
+    }).finally(() => {
+      if (mounted) {
+        setSsoCallbackIntercepting(false);
+      }
     });
+
+    return () => {
+      mounted = false;
+    };
   }, []);
 
   // Web SSO: automatically check for cross-domain session on web platforms.
@@ -1718,7 +1733,7 @@ export const OxyProvider: React.FC<OxyContextProviderProps> = ({
 
   return (
     <OxyContext.Provider value={contextValue}>
-      {children}
+      {ssoCallbackIntercepting ? null : children}
     </OxyContext.Provider>
   );
 };

package/src/ui/hooks/useAuth.ts

@@ -194,7 +194,7 @@ export function useAuth(): UseAuthReturn {
     // State
     user,
     isAuthenticated,
-    isLoading,
+    isLoading: isLoading || !isAuthResolved,
     isReady: isTokenReady,
     isAuthResolved,
     error,

package/src/ui/hooks/useFollow.ts

@@ -1,7 +1,7 @@
 import { useCallback, useMemo, useEffect } from 'react';
 import { useFollowStore } from '../stores/followStore';
 import { useOxy } from '../context/OxyContext';
-import type { OxyServices } from '@oxyhq/core';
+import { logger as loggerUtil, type OxyServices } from '@oxyhq/core';
 import { useShallow } from 'zustand/react/shallow';
 
 /**
@@ -18,7 +18,8 @@ import { useShallow } from 'zustand/react/shallow';
  *    them in selectors would cause unnecessary selector recalculations).
  */
 export const useFollow = (userId?: string | string[]) => {
-  const { oxyServices } = useOxy();
+  const { oxyServices, isAuthenticated, isAuthResolved, isTokenReady } = useOxy();
+  const canUsePrivateApi = isAuthResolved && isTokenReady && isAuthenticated;
   const userIds = useMemo(() => (Array.isArray(userId) ? userId : userId ? [userId] : []), [userId]);
   const isSingleUser = typeof userId === 'string';
 
@@ -75,9 +76,10 @@ export const useFollow = (userId?: string | string[]) => {
   // Store actions are accessed via getState() to avoid subscribing to them.
   const toggleFollow = useCallback(async () => {
     if (!isSingleUser || !userId) throw new Error('toggleFollow is only available for single user mode');
+    if (!canUsePrivateApi) throw new Error('Authentication is required to follow users');
     const currentlyFollowing = useFollowStore.getState().followingUsers[userId] ?? false;
     await useFollowStore.getState().toggleFollowUser(userId, oxyServices, currentlyFollowing);
-  }, [isSingleUser, userId, oxyServices]);
+  }, [isSingleUser, userId, canUsePrivateApi, oxyServices]);
 
   const setFollowStatus = useCallback((following: boolean) => {
     if (!isSingleUser || !userId) throw new Error('setFollowStatus is only available for single user mode');
@@ -86,8 +88,9 @@ export const useFollow = (userId?: string | string[]) => {
 
   const fetchStatus = useCallback(async () => {
     if (!isSingleUser || !userId) throw new Error('fetchStatus is only available for single user mode');
+    if (!canUsePrivateApi) return;
     await useFollowStore.getState().fetchFollowStatus(userId, oxyServices);
-  }, [isSingleUser, userId, oxyServices]);
+  }, [isSingleUser, userId, canUsePrivateApi, oxyServices]);
 
   const clearError = useCallback(() => {
     if (!isSingleUser || !userId) throw new Error('clearError is only available for single user mode');
@@ -114,28 +117,33 @@ export const useFollow = (userId?: string | string[]) => {
     if (!isSingleUser || !userId) return;
 
     if ((followerCount === null || followingCount === null) && !isLoadingCounts) {
-      fetchUserCounts().catch((err: unknown) => console.warn('useFollow: fetchUserCounts failed', err));
+      fetchUserCounts().catch((error: unknown) => {
+        loggerUtil.warn('useFollow: fetchUserCounts failed', { component: 'useFollow' }, error);
+      });
     }
   }, [isSingleUser, userId, followerCount, followingCount, isLoadingCounts, fetchUserCounts]);
 
   // Multi-user callbacks
   const toggleFollowForUser = useCallback(async (targetUserId: string) => {
+    if (!canUsePrivateApi) throw new Error('Authentication is required to follow users');
     const currentState = useFollowStore.getState().followingUsers[targetUserId] ?? false;
     await useFollowStore.getState().toggleFollowUser(targetUserId, oxyServices, currentState);
-  }, [oxyServices]);
+  }, [canUsePrivateApi, oxyServices]);
 
   const setFollowStatusForUser = useCallback((targetUserId: string, following: boolean) => {
     useFollowStore.getState().setFollowingStatus(targetUserId, following);
   }, []);
 
   const fetchStatusForUser = useCallback(async (targetUserId: string) => {
+    if (!canUsePrivateApi) return;
     await useFollowStore.getState().fetchFollowStatus(targetUserId, oxyServices);
-  }, [oxyServices]);
+  }, [canUsePrivateApi, oxyServices]);
 
   const fetchAllStatuses = useCallback(async () => {
+    if (!canUsePrivateApi) return;
     const store = useFollowStore.getState();
     await Promise.all(userIds.map(uid => store.fetchFollowStatus(uid, oxyServices)));
-  }, [userIds, oxyServices]);
+  }, [canUsePrivateApi, userIds, oxyServices]);
 
   const clearErrorForUser = useCallback((targetUserId: string) => {
     useFollowStore.getState().clearFollowError(targetUserId);