@oxy.so/services 11.14.0 → 11.16.0

package/src/ui/components/signIn/OxyAccountPicker.tsx

@@ -17,16 +17,18 @@
  */
 
 import type React from 'react';
-import { Fragment, useState } from 'react';
 import { ScrollView } from 'react-native';
-import { Pressable, View } from 'react-native-css/components';
+import { View } from 'react-native-css/components';
 import { Avatar } from '@oxy.so/bloom/avatar';
-import { RiArrowRightSLine } from '@oxy.so/bloom/icons/RiArrowRightSLine';
 import { RiCheckLine } from '@oxy.so/bloom/icons/RiCheckLine';
 import { RiUserAddLine } from '@oxy.so/bloom/icons/RiUserAddLine';
 import { SpinnerIcon } from '@oxy.so/bloom/loading';
 import { useTheme } from '@oxy.so/bloom/theme';
-import { Text } from '@oxy.so/bloom/typography';
+import {
+  GroupedSection,
+  GroupedSectionItem,
+  GroupedSectionIcon,
+} from '@oxy.so/bloom/grouped-section';
 import {
   showsPrincipalHeaders,
   type SwitcherContextRow,
@@ -71,7 +73,6 @@ export const OxyAccountPicker: React.FC<OxyAccountPickerProps> = ({
 }) => {
   const theme = useTheme();
   const { t } = useI18n();
-  const [hovered, setHovered] = useState<number | null>(null);
   // Whose route a row is only needs naming once someone holds more than one
   // account here — the same rule the account menu's group headers follow.
   const namesTheOperator = showsPrincipalHeaders(principals);
@@ -85,19 +86,6 @@ export const OxyAccountPicker: React.FC<OxyAccountPickerProps> = ({
           : null,
     })),
   );
-  const useAnotherIndex = rows.length;
-
-  /** The hairline under row `index`, hidden while either neighbour is hovered. */
-  const divider = (index: number) =>
-    hovered === index || hovered === index + 1 ? (
-      <View className="h-px mx-[8px]" />
-    ) : (
-      <View className="h-px mx-[8px] bg-border opacity-50" />
-    );
-
-  const rowClassName = (index: number, disabled: boolean) =>
-    `flex-row items-center gap-[12px] rounded-[14px] p-[8px] ${hovered === index && !disabled ? 'bg-fill' : ''} ${disabled ? 'opacity-50' : ''}`;
-
   return (
     <OxyAuthScreen>
       <OxyAuthScreenHeader
@@ -108,49 +96,28 @@ export const OxyAccountPicker: React.FC<OxyAccountPickerProps> = ({
             : t('signin.chooser.subtitle')
         }
       />
-      <View
-        className="bg-fill-secondary rounded-[22px] overflow-hidden"
-        testID="account-picker-list"
-      >
-        <ScrollView style={{ maxHeight: LIST_MAX_HEIGHT }} contentContainerStyle={{ padding: 8 }}>
-          {rows.map(({ context, operatedBy }, index) => {
-            const activating = pendingContextId === context.contextId;
-            const disabled = isLoading || !context.canActivate;
-            const current = !signedOut && context.isActive;
-            const accent = resolveAccentHex(context.color, theme.colors.primary);
-            const handle = context.handle ? `@${context.handle}` : null;
-            const label = signedOut
-              ? t('signin.chooser.continueAs', { name: handle ?? context.displayName })
-              : context.displayName;
-            return (
-              <Fragment key={context.contextId}>
-                <Pressable
-                  className={rowClassName(index, disabled && !activating)}
+      <View testID="account-picker-list">
+        <ScrollView style={{ maxHeight: LIST_MAX_HEIGHT }}>
+          <GroupedSection>
+            {rows.map(({ context, operatedBy }) => {
+              const activating = pendingContextId === context.contextId;
+              const disabled = isLoading || !context.canActivate;
+              const current = !signedOut && context.isActive;
+              const accent = resolveAccentHex(context.color, theme.colors.primary);
+              const handle = context.handle ? `@${context.handle}` : undefined;
+              const label = signedOut
+                ? t('signin.chooser.continueAs', { name: handle ?? context.displayName })
+                : context.displayName;
+              return (
+                <GroupedSectionItem
+                  key={context.contextId}
+                  title={context.displayName}
+                  description={operatedBy ?? handle}
                   onPress={() => onSelectContext(context)}
-                  onHoverIn={() => setHovered(index)}
-                  onHoverOut={() => setHovered((value) => (value === index ? null : value))}
                   disabled={disabled}
-                  accessibilityRole="button"
                   accessibilityLabel={label}
                   accessibilityState={{ selected: current, disabled, busy: activating }}
-                >
-                  <View className="flex-1 min-w-0">
-                    <Text
-                      className="text-body text-text"
-                      style={{ fontWeight: '500' }}
-                      numberOfLines={1}
-                    >
-                      {context.displayName}
-                    </Text>
-                    {operatedBy || handle ? (
-                      <Text className="text-bodySmall text-text-secondary" numberOfLines={1}>
-                        {operatedBy ?? handle}
-                      </Text>
-                    ) : null}
-                  </View>
-                  <View className="flex-row items-center gap-[8px] shrink-0">
-                    {/* The current account: Avatar's own verified slot (bottom-right,
-                        above the image), holding the accent check badge. */}
+                  icon={
                     <Avatar
                       source={context.avatarUrl ?? undefined}
                       variant="thumb"
@@ -166,42 +133,24 @@ export const OxyAccountPicker: React.FC<OxyAccountPickerProps> = ({
                         </View>
                       }
                     />
-                    {activating ? (
-                      <SpinnerIcon size={20} color={accent} />
-                    ) : (
-                      <RiArrowRightSLine size="sm" fill={theme.colors.textSecondary} />
-                    )}
-                  </View>
-                </Pressable>
-                {divider(index)}
-              </Fragment>
-            );
-          })}
-          <Pressable
-            className={rowClassName(useAnotherIndex, isLoading)}
-            onPress={onUseAnother}
-            onHoverIn={() => setHovered(useAnotherIndex)}
-            onHoverOut={() => setHovered((value) => (value === useAnotherIndex ? null : value))}
-            disabled={isLoading}
-            accessibilityRole="button"
-            accessibilityLabel={t('signin.chooser.useAnother')}
-            testID="use-another-account"
-          >
-            <View className="flex-1 min-w-0">
-              <Text className="text-body text-text" style={{ fontWeight: '500' }} numberOfLines={1}>
-                {t('signin.chooser.useAnother')}
-              </Text>
-            </View>
-            <View className="flex-row items-center gap-[8px] shrink-0">
-              <View
-                className="bg-fill items-center justify-center rounded-full"
-                style={{ width: AVATAR_SIZE, height: AVATAR_SIZE }}
-              >
-                <RiUserAddLine size="md" fill={theme.colors.textSecondary} />
-              </View>
-              <RiArrowRightSLine size="sm" fill={theme.colors.textSecondary} />
-            </View>
-          </Pressable>
+                  }
+                  rightElement={activating ? <SpinnerIcon size={20} color={accent} /> : undefined}
+                  showChevron={!activating}
+                />
+              );
+            })}
+            <GroupedSectionItem
+              title={t('signin.chooser.useAnother')}
+              onPress={onUseAnother}
+              disabled={isLoading}
+              testID="use-another-account"
+              icon={
+                <GroupedSectionIcon>
+                  {({ color }) => <RiUserAddLine size="sm" fill={color} />}
+                </GroupedSectionIcon>
+              }
+            />
+          </GroupedSection>
         </ScrollView>
       </View>
       <OxyAuthTerms />

package/src/ui/components/signIn/OxyAuthenticatorPanel.tsx

@@ -22,7 +22,7 @@ import { Text } from '@oxy.so/bloom/typography';
 import type { TotpEnrollResponse } from '@oxy.so/contracts';
 import { TOTP_DIGITS } from '@oxy.so/contracts/client';
 import { useQueryClient } from '@tanstack/react-query';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { useSignInMethods } from '../../hooks/queries/useAuthMethods';
 import { queryKeys } from '../../hooks/queries/queryKeys';
 import { useI18n } from '../../hooks/useI18n';

package/src/ui/components/signIn/OxyDeleteAccountPanel.tsx

@@ -13,7 +13,7 @@
 import type React from 'react';
 import { useState } from 'react';
 import { surfaces } from '@oxy.so/bloom/surfaces';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { useSignInMethods } from '../../hooks/queries/useAuthMethods';
 import { useI18n } from '../../hooks/useI18n';
 import { OxyAuthLoading, OxyAuthScreen, OxyAuthScreenHeader } from './OxyAuthScreen';

package/src/ui/components/signIn/OxyEmailAccountChoice.tsx

@@ -18,7 +18,7 @@ import { useTheme } from '@oxy.so/bloom/theme';
 import { Text } from '@oxy.so/bloom/typography';
 import type { EmailSignInAccountOption } from '@oxy.so/contracts';
 import { getNormalizedUserHandle } from '@oxy.so/core';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 
 /** The list scrolls past this height (`max-h-96`). */
 const LIST_MAX_HEIGHT = 384;

package/src/ui/components/signIn/OxyLinkCommonsPanel.tsx

@@ -20,7 +20,7 @@ import { Loading } from '@oxy.so/bloom/loading';
 import { useTheme } from '@oxy.so/bloom/theme';
 import { Text } from '@oxy.so/bloom/typography';
 import type { IdentityLinkCreateResponse } from '@oxy.so/contracts';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { loadIdentityCrypto } from '../../utils/identityCrypto';
 import { useSignInMethods } from '../../hooks/queries/useAuthMethods';
 import { useI18n } from '../../hooks/useI18n';

package/src/ui/components/signIn/OxyPasswordPanel.tsx

@@ -13,7 +13,7 @@ import { Switch } from '@oxy.so/bloom/switch';
 import { toast } from '@oxy.so/bloom/toast';
 import { PASSWORD_MAX_LENGTH, PASSWORD_MIN_LENGTH } from '@oxy.so/contracts/client';
 import { useQueryClient } from '@tanstack/react-query';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { useSignInMethods } from '../../hooks/queries/useAuthMethods';
 import { queryKeys } from '../../hooks/queries/queryKeys';
 import { useI18n } from '../../hooks/useI18n';

package/src/ui/components/signIn/OxySignInPanel.tsx

@@ -50,7 +50,7 @@ import {
   isSecondFactorRequired,
 } from '@oxy.so/contracts/client';
 import { useQueryClient } from '@tanstack/react-query';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { useAccountDialogSnapshot } from '../../hooks/accountDialogSnapshot';
 import { useDeviceSwitcher } from '../../hooks/useDeviceSwitcher';
 import { useI18n } from '../../hooks/useI18n';

package/src/ui/components/signIn/OxySignUpPanel.tsx

@@ -17,7 +17,7 @@ import { Linking, Platform } from 'react-native';
 import { toast } from '@oxy.so/bloom/toast';
 import type { EmailVerificationConfirmResponse } from '@oxy.so/contracts';
 import { SIGN_IN_ERROR_CODES, emailAddressCheck, checkContract } from '@oxy.so/contracts/client';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { useAccountDialogSnapshot } from '../../hooks/accountDialogSnapshot';
 import { useI18n } from '../../hooks/useI18n';
 import { getCommonsAcquisitionUrl } from '../../utils/commonsStoreLinks';

package/src/ui/components/signIn/ReauthStep.tsx

@@ -8,9 +8,11 @@
 
 import type React from 'react';
 import { useState } from 'react';
+import { View } from 'react-native';
+import { Button } from '@oxy.so/bloom/button';
 import type { ReauthAction, ReauthProof } from '@oxy.so/contracts';
 import { EMAIL_CODE_LENGTH, TOTP_DIGITS } from '@oxy.so/contracts/client';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { useI18n } from '../../hooks/useI18n';
 import { SubtleLink } from '../authChooser/primitives';
 import { OxyAuthScreen, OxyAuthScreenHeader } from './OxyAuthScreen';
@@ -188,13 +190,29 @@ export const ReauthStep: React.FC<ReauthStepProps> = ({
         </>
       ) : null}
       {error ? <AccountFlowErrorLine message={error} /> : null}
-      <AccountFlowAction
-        label={needsCode ? t('reauth.sendCode') : submitLabel}
-        onPress={submit}
-        pending={pending}
-        destructive={destructive && !needsCode}
-        testID={needsCode ? 'reauth-send-code' : 'reauth-submit'}
-      />
+      <View style={{ flexDirection: 'row', alignItems: 'center', gap: 12 }}>
+        {secondary ? (
+          <Button
+            appearance="plain"
+            tone="neutral"
+            size="lg"
+            onPress={secondary.onPress}
+            disabled={pending}
+            testID="reauth-cancel"
+          >
+            {secondary.label}
+          </Button>
+        ) : null}
+        <View style={{ flex: 1, minWidth: 0 }}>
+          <AccountFlowAction
+            label={needsCode ? t('reauth.sendCode') : submitLabel}
+            onPress={submit}
+            pending={pending}
+            destructive={destructive && !needsCode}
+            testID={needsCode ? 'reauth-send-code' : 'reauth-submit'}
+          />
+        </View>
+      </View>
       {mode === 'email' && verificationId ? (
         <SubtleLink
           label={t('emailCode.resend')}
@@ -214,14 +232,6 @@ export const ReauthStep: React.FC<ReauthStepProps> = ({
           testID="reauth-switch-method"
         />
       ) : null}
-      {secondary ? (
-        <SubtleLink
-          label={secondary.label}
-          onPress={secondary.onPress}
-          disabled={pending}
-          testID="reauth-cancel"
-        />
-      ) : null}
     </OxyAuthScreen>
   );
 };

package/src/ui/components/signIn/accountFlowParts.tsx

@@ -27,7 +27,7 @@ import {
   SIGN_IN_ERROR_CODES,
   normalizeEmailSignInCode,
 } from '@oxy.so/contracts/client';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { useI18n } from '../../hooks/useI18n';
 import type { Translate } from '../authChooser/types';
 import { SubtleLink } from '../authChooser/primitives';

package/src/ui/components/supervision/PersonPicker.tsx

@@ -4,7 +4,7 @@ import { useQuery } from '@tanstack/react-query';
 import { Button } from '@oxy.so/bloom/button';
 import { Text } from '@oxy.so/bloom/typography';
 import type { SafetyPerson } from '@oxy.so/contracts';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { useI18n } from '../../hooks/useI18n';
 import { AccountFlowField, AccountFlowNote } from '../signIn/accountFlowParts';
 export function PersonPicker({

package/src/ui/context/OxyContext.tsx

@@ -9,16 +9,7 @@ import {
   setIsolatedOAuthSession,
 } from './isolatedOAuthSession';
 import type React from 'react';
-import {
-  createContext,
-  useCallback,
-  useContext,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-  useSyncExternalStore,
-} from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState, useSyncExternalStore } from 'react';
 import { AppState, Linking, Platform } from 'react-native';
 import { OxyServices } from '@oxy.so/core';
 import type { LoginSessionResult } from '@oxy.so/contracts';
@@ -118,9 +109,6 @@ import {
 } from '../session';
 import type { OxyContextState, OxyRuntimeProviderProps, CommitInput } from './oxyContextTypes';
 import { DEFAULT_SESSION_VALIDITY_MS } from './oxyContextHelpers';
-// `useFollow` imports this module back, so the binding must only be READ inside
-// the provider body — at render time, once every module has evaluated. It is
-// never dereferenced at module scope here.
 import { useFollow } from '../hooks/useFollow';
 import { commitDeviceSetAndResolve } from './commitSessionFlow';
 import { clearSignInFlows } from '../components/signIn/signInFlowStore';
@@ -129,27 +117,20 @@ import { AppAssertionProvider } from '../appAssertion/AppAssertionContext';
 
 export type { LogoutResult, OxyContextState, OxyRuntimeProviderProps } from './oxyContextTypes';
 
-const OxyRuntimeContext = createContext<OxyContextState | null>(null);
+import {
+  OxyRuntimeContext,
+  OxyAuthActionsContext,
+  type OxyAuthActionsContextState,
+} from './oxyRuntimeContext';
+export {
+  useOxyAuthActions,
+  useOxy,
+  useOptionalOxy,
+  OxyProviderMissingError,
+} from './oxyRuntimeContext';
 
 const subscribeNever = (): (() => void) => () => undefined;
 
-type OxyAuthActionsContextState = Pick<
-  OxyContextState,
-  | 'signIn'
-  | 'logout'
-  | 'logoutAll'
-  | 'refreshSessions'
-  | 'oxyServices'
-  | 'switchToAccount'
-  | 'hasIdentity'
-  | 'getPublicKey'
-  | 'showBottomSheet'
-  | 'openAvatarPicker'
-  | 'openAccountDialog'
-> & { ensureDeviceSessionLane: () => void | Promise<void> };
-
-const OxyAuthActionsContext = createContext<OxyAuthActionsContextState | null>(null);
-
 /**
  * The SDK's internal runtime provider — the session/account state machine that
  * backs `useOxy()`.
@@ -437,6 +418,7 @@ export const OxyRuntimeProvider: React.FC<OxyRuntimeProviderProps> = ({
     languageName: currentLanguageName,
     nativeLanguageName: currentNativeLanguageName,
     setLanguage,
+    setLanguages,
   } = useLanguageManagement({
     storage,
     languageKey: storageKeys.language,
@@ -1627,6 +1609,7 @@ export const OxyRuntimeProvider: React.FC<OxyRuntimeProviderProps> = ({
       removeSession: logout,
       refreshSessions: refreshSessionsForContext,
       setLanguage,
+      setLanguages,
       getDeviceSessions,
       logoutAllDeviceSessions,
       updateDeviceName,
@@ -1682,6 +1665,7 @@ export const OxyRuntimeProvider: React.FC<OxyRuntimeProviderProps> = ({
       switchSessionForContext,
       refreshSessionsForContext,
       setLanguage,
+      setLanguages,
       getDeviceSessions,
       logoutAllDeviceSessions,
       updateDeviceName,
@@ -1759,51 +1743,3 @@ export const OxyRuntimeProvider: React.FC<OxyRuntimeProviderProps> = ({
     </OxyRuntimeHandleProvider>
   );
 };
-
-const PROVIDER_MISSING_ERROR_MESSAGE =
-  'useOxy() was called outside <OxyProvider>. Mount <OxyProvider clientId="…"> above this component, ' +
-  'or use useOptionalOxy() if this component legitimately renders both inside and outside the provider.';
-
-export class OxyProviderMissingError extends Error {
-  readonly code = 'oxy_provider_missing';
-
-  constructor() {
-    super(PROVIDER_MISSING_ERROR_MESSAGE);
-    this.name = 'OxyProviderMissingError';
-  }
-}
-
-/**
- * The base runtime hook. THROWS when no `<OxyProvider>` is mounted.
- *
- * It used to return a fabricated forever-loading runtime — `isLoading: true`,
- * `isPrivateApiPending: true`, every method a rejecting no-op — which turned a
- * missing provider into a UI that spins forever with nothing in the console.
- * Failing here names the mistake at the exact component that made it (ADR 0004).
- *
- * A component that legitimately renders both inside and outside the provider
- * uses {@link useOptionalOxy} instead.
- */
-export const useOxy = (): OxyContextState => {
-  const context = useContext(OxyRuntimeContext);
-  if (!context) {
-    throw new OxyProviderMissingError();
-  }
-  return context;
-};
-
-/**
- * `useOxy()` for the rare component that renders both inside and outside the
- * provider — returns `null` instead of throwing. Callers must handle `null`;
- * there is no fabricated runtime to fall back on.
- */
-export const useOptionalOxy = (): OxyContextState | null => useContext(OxyRuntimeContext);
-
-/** Stable auth commands for selector-based hooks; never carries mutable state. */
-export const useOxyAuthActions = (): OxyAuthActionsContextState => {
-  const actions = useContext(OxyAuthActionsContext);
-  if (!actions) {
-    throw new OxyProviderMissingError();
-  }
-  return actions;
-};

package/src/ui/context/oxyContextTypes.ts

@@ -142,6 +142,7 @@ export interface OxyContextState {
   removeSession: (sessionId: string) => Promise<LogoutResult>;
   refreshSessions: () => Promise<void>;
   setLanguage: (languageId: string) => Promise<void>;
+  setLanguages: (languageIds: readonly string[]) => Promise<void>;
   getDeviceSessions: () => Promise<
     Array<{
       sessionId: string;

package/src/ui/context/oxyRuntimeContext.ts

@@ -0,0 +1,69 @@
+import { createContext, useContext } from 'react';
+import type { OxyContextState } from './oxyContextTypes';
+
+export const OxyRuntimeContext = createContext<OxyContextState | null>(null);
+
+const PROVIDER_MISSING_ERROR_MESSAGE =
+  'useOxy() was called outside <OxyProvider>. Mount <OxyProvider clientId="…"> above this component, ' +
+  'or use useOptionalOxy() if this component legitimately renders both inside and outside the provider.';
+
+export class OxyProviderMissingError extends Error {
+  readonly code = 'oxy_provider_missing';
+
+  constructor() {
+    super(PROVIDER_MISSING_ERROR_MESSAGE);
+    this.name = 'OxyProviderMissingError';
+  }
+}
+
+/**
+ * The base runtime hook. THROWS when no `<OxyProvider>` is mounted.
+ *
+ * It used to return a fabricated forever-loading runtime — `isLoading: true`,
+ * `isPrivateApiPending: true`, every method a rejecting no-op — which turned a
+ * missing provider into a UI that spins forever with nothing in the console.
+ * Failing here names the mistake at the exact component that made it (ADR 0004).
+ *
+ * A component that legitimately renders both inside and outside the provider
+ * uses {@link useOptionalOxy} instead.
+ */
+export const useOxy = (): OxyContextState => {
+  const context = useContext(OxyRuntimeContext);
+  if (!context) {
+    throw new OxyProviderMissingError();
+  }
+  return context;
+};
+
+/**
+ * `useOxy()` for the rare component that renders both inside and outside the
+ * provider — returns `null` instead of throwing. Callers must handle `null`;
+ * there is no fabricated runtime to fall back on.
+ */
+export const useOptionalOxy = (): OxyContextState | null => useContext(OxyRuntimeContext);
+
+export type OxyAuthActionsContextState = Pick<
+  OxyContextState,
+  | 'signIn'
+  | 'logout'
+  | 'logoutAll'
+  | 'refreshSessions'
+  | 'oxyServices'
+  | 'switchToAccount'
+  | 'hasIdentity'
+  | 'getPublicKey'
+  | 'showBottomSheet'
+  | 'openAvatarPicker'
+  | 'openAccountDialog'
+> & { ensureDeviceSessionLane: () => void | Promise<void> };
+
+export const OxyAuthActionsContext = createContext<OxyAuthActionsContextState | null>(null);
+
+/** Stable auth commands for selector-based hooks; never carries mutable state. */
+export const useOxyAuthActions = (): OxyAuthActionsContextState => {
+  const actions = useContext(OxyAuthActionsContext);
+  if (!actions) {
+    throw new OxyProviderMissingError();
+  }
+  return actions;
+};

package/src/ui/context/oxySupportContext.ts

@@ -0,0 +1,9 @@
+import { createContext, type ReactNode } from 'react';
+
+/** Host-owned support integration; keeps Alia an optional dependency. */
+export const OxySupportContext = createContext<{
+  onAskAlia?: () => void | Promise<void>;
+  documentationUrl?: string;
+  aliaAvatar?: ReactNode;
+  oxyOneArtwork?: ReactNode;
+}>({});

package/src/ui/hooks/mutations/useAccountMutations.ts

@@ -18,7 +18,7 @@ import {
   invalidateSessionQueries,
 } from '../queries/queryKeys';
 import { mutationKeys } from './mutationKeys';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { toast } from '@oxy.so/bloom/toast';
 import { useAuthStore } from '../../stores/authStore';
 import { clearedFieldsFromProfileUpdate, upsertCachedUser } from '../queries/userCache';

package/src/ui/hooks/mutations/useServicesMutations.ts

@@ -2,7 +2,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
 import type { ClientSession } from '@oxy.so/core';
 import { queryKeys, invalidateSessionQueries } from '../queries/queryKeys';
 import { mutationKeys } from './mutationKeys';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { toast } from '@oxy.so/bloom/toast';
 
 /**

package/src/ui/hooks/queries/useAccountQueries.ts

@@ -4,7 +4,7 @@ import { authenticatedApiCall } from '@oxy.so/core';
 import type { ConnectedApp, User } from '@oxy.so/core';
 import { queryKeys } from './queryKeys';
 import { mutationKeys } from '../mutations/mutationKeys';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { useAuthStore } from '../../stores/authStore';
 
 /**
@@ -70,11 +70,13 @@ export const useUserProfiles = (sessionIds: string[], options?: { enabled?: bool
  * handler is responsible for writing the final value to the store.
  */
 export const useCurrentUser = (options?: { enabled?: boolean }) => {
-  const { oxyServices, activeSessionId, isAuthenticated } = useOxy();
+  const { oxyServices, activeSessionId, isAuthenticated, user } = useOxy();
   const queryClient = useQueryClient();
 
   const query = useQuery({
     queryKey: queryKeys.accounts.current(activeSessionId),
+    initialData: isAuthenticated && user ? user : undefined,
+    initialDataUpdatedAt: 0,
     queryFn: async () => {
       return await oxyServices.users.me();
     },

package/src/ui/hooks/queries/useAuthMethods.ts

@@ -1,7 +1,7 @@
 import { useQuery } from '@tanstack/react-query';
 import type { AuthMethodEntry, AuthMethodsResponse, SignInMethods } from '@oxy.so/contracts';
 import { queryKeys } from './queryKeys';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 
 /** Stable empty list so the derived selectors keep a stable reference while loading. */
 const EMPTY_METHODS: readonly AuthMethodEntry[] = Object.freeze([]);

package/src/ui/hooks/queries/useFileQueries.ts

@@ -16,7 +16,7 @@ import {
   type QueryClient,
 } from '@tanstack/react-query';
 import type { FileApplicationAccess, FileMetadata } from '@oxy.so/core';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { queryKeys } from './queryKeys';
 
 /** Files fetched per page. */

package/src/ui/hooks/queries/usePaymentQueries.ts

@@ -1,7 +1,7 @@
 import { useQuery } from '@tanstack/react-query';
 import { authenticatedApiCall } from '@oxy.so/core';
 import { queryKeys } from './queryKeys';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import type { Subscription, Payment, Wallet, WalletTransactionsResponse } from './paymentTypes';
 
 /**

package/src/ui/hooks/queries/usePersonalPlans.ts

@@ -1,6 +1,6 @@
 import { useQuery } from '@tanstack/react-query';
 import { authenticatedApiCall } from '@oxy.so/core';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 
 /** Public discovery; deliberately outside persisted customer payment queries. */
 export function usePersonalPlans() {