@oxy.so/services 6.2.0 → 8.0.0

package/src/ui/screens/AccountMembersScreen.tsx

@@ -60,7 +60,7 @@ const AccountMembersScreen: React.FC<BaseScreenProps> = ({ onClose, goBack, acco
 
   const accountQuery = useQuery({
     queryKey: ['accounts', 'detail', id],
-    queryFn: () => oxyServices.getAccount(id),
+    queryFn: () => oxyServices.accounts.get(id),
     enabled: canUsePrivateApi && id.length > 0,
   });
 
@@ -84,7 +84,7 @@ const AccountMembersScreen: React.FC<BaseScreenProps> = ({ onClose, goBack, acco
 
   const membersQuery = useQuery({
     queryKey: ['accounts', 'members', id],
-    queryFn: () => oxyServices.listAccountMembers(id),
+    queryFn: () => oxyServices.accounts.members.list(id),
     enabled: canUsePrivateApi && id.length > 0 && canRead,
   });
   const members = useMemo<AccountMember[]>(() => membersQuery.data ?? [], [membersQuery.data]);
@@ -94,7 +94,7 @@ const AccountMembersScreen: React.FC<BaseScreenProps> = ({ onClose, goBack, acco
   );
   const memberProfilesQuery = useQuery({
     queryKey: ['users', 'by-ids', memberUserIds],
-    queryFn: () => oxyServices.getUsersByIds(memberUserIds),
+    queryFn: () => oxyServices.users.getMany(memberUserIds),
     enabled: canUsePrivateApi && memberUserIds.length > 0,
   });
   const memberLabelByUserId = useMemo(() => {
@@ -142,7 +142,7 @@ const AccountMembersScreen: React.FC<BaseScreenProps> = ({ onClose, goBack, acco
   const inviteMutation = useMutation({
     mutationKey: ['accounts', 'members', 'invite', id],
     mutationFn: (input: { usernameOrEmail: string; role: AssignableRole }) =>
-      oxyServices.inviteAccountMember(id, input),
+      oxyServices.accounts.members.invite(id, input),
     onSuccess: () => {
       setInviteIdentifier('');
       setInviteRole('editor');
@@ -164,7 +164,7 @@ const AccountMembersScreen: React.FC<BaseScreenProps> = ({ onClose, goBack, acco
   const updateMutation = useMutation({
     mutationKey: ['accounts', 'members', 'update', id],
     mutationFn: (input: { memberId: string; role: AssignableRole }) =>
-      oxyServices.updateAccountMember(id, input.memberId, { role: input.role }),
+      oxyServices.accounts.members.update(id, input.memberId, { role: input.role }),
     onSuccess: () => {
       invalidateMembers();
       toast.success(t('accounts.members.toasts.roleUpdated') || 'Role updated');
@@ -176,7 +176,7 @@ const AccountMembersScreen: React.FC<BaseScreenProps> = ({ onClose, goBack, acco
 
   const removeMutation = useMutation({
     mutationKey: ['accounts', 'members', 'remove', id],
-    mutationFn: (memberId: string) => oxyServices.removeAccountMember(id, memberId),
+    mutationFn: (memberId: string) => oxyServices.accounts.members.remove(id, memberId),
     onSuccess: () => {
       invalidateMembers();
       toast.success(t('accounts.members.toasts.removed') || 'Member removed');
@@ -188,7 +188,7 @@ const AccountMembersScreen: React.FC<BaseScreenProps> = ({ onClose, goBack, acco
 
   const transferMutation = useMutation({
     mutationKey: ['accounts', 'members', 'transfer', id],
-    mutationFn: (userId: string) => oxyServices.transferAccountOwnership(id, { userId }),
+    mutationFn: (userId: string) => oxyServices.accounts.transferOwnership(id, { userId }),
     onSuccess: () => {
       invalidateMembers();
       toast.success(t('accounts.members.toasts.transferred') || 'Ownership transferred');

package/src/ui/screens/AccountSecurityPanelScreen.tsx

@@ -0,0 +1,26 @@
+/**
+ * The frame the account's own security panels render in when presented as a
+ * surface (`showBottomSheet('DeleteAccount' | 'LinkCommons' | 'SignInPassword'
+ * | 'SignInAuthenticator')`): the panel draws its own large header, so the bar
+ * holds only the way back, and the body keeps the dialog's screen gutter.
+ */
+
+import type React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { useSurfaceHeader } from '../hooks/useSurfaceHeader';
+
+/** Bloom's large-title gutter (`screen-margin`), as the account dialog uses. */
+const SCREEN_MARGIN = 20;
+
+export const AccountSecurityPanelFrame: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+  useSurfaceHeader({});
+  return <View style={styles.body}>{children}</View>;
+};
+
+const styles = StyleSheet.create({
+  body: {
+    paddingTop: 4,
+    paddingBottom: 20,
+    paddingHorizontal: SCREEN_MARGIN,
+  },
+});

package/src/ui/screens/AccountSettingsScreen.tsx

@@ -48,7 +48,7 @@ const AccountSettingsScreen: React.FC<BaseScreenProps> = ({ onClose, goBack, nav
 
   const accountQuery = useQuery({
     queryKey: ['accounts', 'detail', id],
-    queryFn: () => oxyServices.getAccount(id),
+    queryFn: () => oxyServices.accounts.get(id),
     enabled: canUsePrivateApi && id.length > 0,
   });
 
@@ -81,7 +81,7 @@ const AccountSettingsScreen: React.FC<BaseScreenProps> = ({ onClose, goBack, nav
 
   const updateMutation = useMutation({
     mutationKey: ['accounts', 'update', id],
-    mutationFn: (input: UpdateAccountInput) => oxyServices.updateAccount(id, input),
+    mutationFn: (input: UpdateAccountInput) => oxyServices.accounts.update(id, input),
     onSuccess: (updatedNode, input) => {
       const cleared = clearedFieldsFromAccountUpdate(input);
       upsertCachedUser(queryClient, updatedNode.account, user?.id, {
@@ -98,7 +98,7 @@ const AccountSettingsScreen: React.FC<BaseScreenProps> = ({ onClose, goBack, nav
 
   const archiveMutation = useMutation({
     mutationKey: ['accounts', 'archive', id],
-    mutationFn: () => oxyServices.archiveAccount(id),
+    mutationFn: () => oxyServices.accounts.archive(id),
     onSuccess: async () => {
       // If we archived the account we're currently signed in AS, switch back to
       // the personal account so the app isn't left as an archived identity.

package/src/ui/screens/AccountVerificationScreen.tsx

@@ -52,7 +52,7 @@ const AccountVerificationScreen: React.FC<BaseScreenProps> = ({
 
         setIsSubmitting(true);
         try {
-            const result = await oxyServices.requestAccountVerification(
+            const result = await oxyServices.users.requestVerification(
                 reason.trim(),
                 evidence.trim() || undefined
             );

package/src/ui/screens/AppInfoScreen.tsx

@@ -76,7 +76,7 @@ const AppInfoScreen: React.FC<BaseScreenProps> = ({
             }
 
             try {
-                await oxyServices.healthCheck();
+                await oxyServices.health();
                 setConnectionStatus('connected');
             } catch (error) {
                 setConnectionStatus('disconnected');
@@ -110,7 +110,7 @@ const AppInfoScreen: React.FC<BaseScreenProps> = ({
             // Check API connection
             if (oxyServices) {
                 try {
-                    await oxyServices.healthCheck();
+                    await oxyServices.health();
                     setConnectionStatus('connected');
                 } catch (error) {
                     setConnectionStatus('disconnected');
@@ -271,8 +271,8 @@ const AppInfoScreen: React.FC<BaseScreenProps> = ({
                         <SettingsListItem
                             icon={<SettingsIcon name="server" color={colors.primary} />}
                             title={t('appInfo.items.apiBaseUrl')}
-                            description={oxyServices?.getBaseURL() || t('appInfo.items.notConfigured')}
-                            onPress={() => copyToClipboard(oxyServices?.getBaseURL() || t('appInfo.items.notConfigured'), t('appInfo.items.apiBaseUrl'))}
+                            description={oxyServices?.baseURL || t('appInfo.items.notConfigured')}
+                            onPress={() => copyToClipboard(oxyServices?.baseURL || t('appInfo.items.notConfigured'), t('appInfo.items.apiBaseUrl'))}
                         />
                         <SettingsListItem
                             icon={<SettingsIcon
@@ -291,7 +291,7 @@ const AppInfoScreen: React.FC<BaseScreenProps> = ({
                                 }
 
                                 try {
-                                    await oxyServices.healthCheck();
+                                    await oxyServices.health();
                                     setConnectionStatus('connected');
                                     toast.success(t('appInfo.toasts.apiConnectionSuccess'));
                                 } catch (error) {

package/src/ui/screens/AvatarCropScreen.tsx

@@ -358,11 +358,11 @@ const AvatarCropScreen: React.FC<AvatarCropScreenProps> = ({
             if (!imageFileId) {
                 throw new Error('No file id to resolve for cropping');
             }
-            const resolved = await oxyServices.assetGetUrl(imageFileId);
-            if (!resolved?.url) {
+            const resolved = await oxyServices.assets.url(imageFileId);
+            if (!resolved) {
                 throw new Error('No download URL returned for the selected image');
             }
-            return resolved.url;
+            return resolved;
         },
     });
 

package/src/ui/screens/ChangeAvatarScreen.tsx

@@ -149,7 +149,7 @@ const ChangeAvatarScreen: React.FC<BaseScreenProps> = ({ navigate, dismiss }) =>
     );
     const avatarUri = useMemo(
         // `thumb` is 256x256 — exactly a 2x source for the 132dp hero.
-        () => (user?.avatar ? oxyServices.getFileDownloadUrl(user.avatar, 'thumb') : undefined),
+        () => (user?.avatar ? oxyServices.assets.publicUrl(user.avatar, 'thumb') : undefined),
         [user?.avatar, oxyServices],
     );
 

package/src/ui/screens/CreateAccountScreen.tsx

@@ -195,7 +195,7 @@ const CreateAccountScreen: React.FC<BaseScreenProps> = ({
     const seq = ++usernameCheckSeqRef.current;
     debounceTimerRef.current = setTimeout(async () => {
       try {
-        const result = await oxyServices.checkUsernameAvailability(value);
+        const result = await oxyServices.auth.checkUsername(value);
         if (seq !== usernameCheckSeqRef.current) return;
         setUsernameStatus(result.available ? 'available' : 'taken');
         setUsernameMessage(

package/src/ui/screens/DeleteAccountScreen.tsx

@@ -0,0 +1,13 @@
+import type React from 'react';
+import { OxyDeleteAccountPanel } from '../components/signIn/OxyDeleteAccountPanel';
+import type { BaseScreenProps } from '../types/navigation';
+import { AccountSecurityPanelFrame } from './AccountSecurityPanelScreen';
+
+/** `DeleteAccount`: delete an account without a key, with a code by email. */
+const DeleteAccountScreen: React.FC<BaseScreenProps> = ({ onClose, goBack }) => (
+  <AccountSecurityPanelFrame>
+    <OxyDeleteAccountPanel onCancel={goBack ?? onClose} />
+  </AccountSecurityPanelFrame>
+);
+
+export default DeleteAccountScreen;

package/src/ui/screens/DomainsScreen.tsx

@@ -0,0 +1,187 @@
+import React, { useCallback, useState } from 'react';
+import { StyleSheet, View } from 'react-native';
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import type { DomainVerificationInstructions, VerifiedDomain } from '@oxy.so/contracts';
+import { Button } from '@oxy.so/bloom/button';
+import { Loading } from '@oxy.so/bloom/loading';
+import { SettingsListGroup, SettingsListItem } from '@oxy.so/bloom/settings-list';
+import { surfaces } from '@oxy.so/bloom/surfaces';
+import { TextField, TextFieldInput, TextFieldLabel } from '@oxy.so/bloom/text-field';
+import { useTheme } from '@oxy.so/bloom/theme';
+import { toast } from '@oxy.so/bloom/toast';
+import { Text } from '@oxy.so/bloom/typography';
+import type { BaseScreenProps } from '../types/navigation';
+import { SettingsIcon } from '../components/SettingsIcon';
+import { useOxy } from '../context/OxyContext';
+import { queryKeys } from '../hooks/queries/queryKeys';
+import { useI18n } from '../hooks/useI18n';
+import { useSurfaceHeader } from '../hooks/useSurfaceHeader';
+
+const errorMessage = (error: unknown, fallback: string): string =>
+    (error instanceof Error && error.message) || fallback;
+
+/**
+ * DomainsScreen — prove that the signed-in identity controls a web domain.
+ *
+ * Request a verification for a domain, publish either the DNS TXT record or the
+ * `.well-known` file the API answers with, then verify. Verified domains are
+ * listed and can be removed. Drives `oxy.identity.domains.*`
+ * (`/identity/domains`).
+ */
+const DomainsScreen: React.FC<BaseScreenProps> = () => {
+    const { t } = useI18n();
+    useSurfaceHeader({ title: t('domains.title') });
+    const bloomTheme = useTheme();
+    const queryClient = useQueryClient();
+    const { oxyServices, user, isAuthenticated } = useOxy();
+
+    const [domain, setDomain] = useState('');
+    const [pending, setPending] = useState<DomainVerificationInstructions | null>(null);
+
+    const listKey = queryKeys.domains.list(user?.id);
+    const domains = useQuery({
+        queryKey: listKey,
+        enabled: isAuthenticated && Boolean(user?.id),
+        queryFn: () => oxyServices.identity.domains.list(),
+    });
+
+    const request = useMutation({
+        mutationFn: (name: string) => oxyServices.identity.domains.requestVerification(name),
+        onSuccess: (instructions) => {
+            setPending(instructions);
+            setDomain('');
+        },
+        onError: (error) => toast.error(errorMessage(error, t('domains.errors.request'))),
+    });
+
+    const verify = useMutation({
+        mutationFn: (name: string) => oxyServices.identity.domains.verify(name),
+        onSuccess: (result) => {
+            if (!result.verified) {
+                toast.error(t('domains.errors.notYet'));
+                return;
+            }
+            setPending(null);
+            toast.success(t('domains.verified', { domain: result.domain.domain }));
+            void queryClient.invalidateQueries({ queryKey: listKey });
+        },
+        onError: (error) => toast.error(errorMessage(error, t('domains.errors.notYet'))),
+    });
+
+    const remove = useMutation({
+        mutationFn: (name: string) => oxyServices.identity.domains.remove(name),
+        onSuccess: () => void queryClient.invalidateQueries({ queryKey: listKey }),
+        onError: (error) => toast.error(errorMessage(error, t('domains.errors.remove'))),
+    });
+
+    const confirmRemove = useCallback(
+        async (item: VerifiedDomain) => {
+            const confirmed = await surfaces.confirm({
+                title: t('domains.remove.title'),
+                description: t('domains.remove.message', { domain: item.domain }),
+                confirmLabel: t('domains.remove.confirm'),
+                cancelLabel: t('common.cancel') || 'Cancel',
+                destructive: true,
+            });
+            if (confirmed) remove.mutate(item.domain);
+        },
+        [remove, t],
+    );
+
+    const submit = () => {
+        const name = domain.trim().toLowerCase();
+        if (name && !request.isPending) request.mutate(name);
+    };
+
+    if (domains.isPending && isAuthenticated) {
+        return <Loading size="large" color={bloomTheme.colors.primary} />;
+    }
+
+    return (
+        <View className="px-screen-margin pb-space-24">
+            {pending ? (
+                <SettingsListGroup title={t('domains.instructions.title', { domain: pending.domain })}>
+                    <View className="px-space-16 py-space-12" style={styles.instructions}>
+                        <Text className="text-text-secondary">{t('domains.instructions.dns')}</Text>
+                        <Text selectable testID="domains-dns-name">{pending.dns.name}</Text>
+                        <Text selectable testID="domains-dns-value">{pending.dns.value}</Text>
+                        <Text className="text-text-secondary">{t('domains.instructions.wellKnown')}</Text>
+                        <Text selectable testID="domains-wellknown-url">{pending.wellKnown.url}</Text>
+                        <Text selectable testID="domains-wellknown-body">{pending.wellKnown.body}</Text>
+                        <Button
+                            appearance="solid"
+                            tone="action"
+                            loading={verify.isPending}
+                            disabled={verify.isPending}
+                            onPress={() => verify.mutate(pending.domain)}
+                            testID="domains-verify"
+                        >
+                            {t('domains.instructions.verify')}
+                        </Button>
+                        <Button appearance="plain" tone="neutral" onPress={() => setPending(null)} testID="domains-cancel">
+                            {t('common.cancel') || 'Cancel'}
+                        </Button>
+                    </View>
+                </SettingsListGroup>
+            ) : (
+                <SettingsListGroup title={t('domains.add.title')}>
+                    <View className="px-space-16 py-space-12" style={styles.instructions}>
+                        <TextFieldLabel>{t('domains.add.label')}</TextFieldLabel>
+                        <TextField disabled={request.isPending}>
+                            <TextFieldInput
+                                testID="domains-input"
+                                label={t('domains.add.label')}
+                                value={domain}
+                                onValueChange={setDomain}
+                                placeholder="example.com"
+                                autoCapitalize="none"
+                                autoCorrect={false}
+                                keyboardType="url"
+                                returnKeyType="go"
+                                onSubmitEditing={submit}
+                            />
+                        </TextField>
+                        <Button
+                            appearance="solid"
+                            tone="action"
+                            loading={request.isPending}
+                            disabled={request.isPending || domain.trim().length === 0}
+                            onPress={submit}
+                            testID="domains-request"
+                        >
+                            {t('domains.add.action')}
+                        </Button>
+                    </View>
+                </SettingsListGroup>
+            )}
+
+            <SettingsListGroup title={t('domains.list.title')}>
+                {(domains.data ?? []).length === 0 ? (
+                    <Text className="text-text-secondary px-space-16 py-space-12">{t('domains.list.empty')}</Text>
+                ) : (
+                    (domains.data ?? []).map((item) => (
+                        <SettingsListItem
+                            key={item.domain}
+                            icon={<SettingsIcon name="web" color={bloomTheme.colors.success} />}
+                            title={item.domain}
+                            description={item.method === 'dns-txt' ? t('domains.method.dns') : t('domains.method.wellKnown')}
+                            onPress={() => void confirmRemove(item)}
+                            disabled={remove.isPending}
+                            destructive
+                            showChevron={false}
+                        />
+                    ))
+                )}
+            </SettingsListGroup>
+        </View>
+    );
+};
+
+// Layout-only: the vertical rhythm between the stacked instruction lines.
+const styles = StyleSheet.create({
+    instructions: {
+        gap: 8,
+    },
+});
+
+export default React.memo(DomainsScreen);

package/src/ui/screens/EditProfileScreen.tsx

@@ -34,7 +34,7 @@ const EditProfileScreen: React.FC<BaseScreenProps> = ({ navigate }) => {
         [user],
     );
     const avatarUri = useMemo(
-        () => (user?.avatar ? oxyServices.getFileDownloadUrl(user.avatar, 'thumb') : undefined),
+        () => (user?.avatar ? oxyServices.assets.publicUrl(user.avatar, 'thumb') : undefined),
         [user?.avatar, oxyServices],
     );
 

package/src/ui/screens/FileManagementScreen.tsx

@@ -266,7 +266,7 @@ const FileManagementScreen: React.FC<FileManagementScreenProps> = ({
         const fileVisibility = (file.metadata as Record<string, unknown> | undefined)?.visibility || 'private';
         if (fileVisibility !== defaultVisibility) {
             try {
-                await oxyServices.assetUpdateVisibility(file.id, defaultVisibility);
+                await oxyServices.assets.setVisibility(file.id, defaultVisibility);
             } catch (error) {
                 // Continue anyway - selection shouldn't fail if visibility update fails
             }
@@ -275,13 +275,10 @@ const FileManagementScreen: React.FC<FileManagementScreenProps> = ({
         // Link file to entity if linkContext is provided
         if (linkContext) {
             try {
-                await oxyServices.assetLink(
+                await oxyServices.assets.link(
                     file.id,
-                    linkContext.app,
-                    linkContext.entityType,
-                    linkContext.entityId,
-                    defaultVisibility,
-                    linkContext.webhookUrl
+                    { app: linkContext.app, entityType: linkContext.entityType, entityId: linkContext.entityId },
+                    { visibility: defaultVisibility, webhookUrl: linkContext.webhookUrl },
                 );
             } catch (error) {
                 // Continue anyway - selection shouldn't fail if linking fails
@@ -340,7 +337,7 @@ const FileManagementScreen: React.FC<FileManagementScreenProps> = ({
             const fileVisibility = (file.metadata as Record<string, unknown> | undefined)?.visibility || 'private';
             if (fileVisibility !== defaultVisibility) {
                 try {
-                    await oxyServices.assetUpdateVisibility(file.id, defaultVisibility);
+                    await oxyServices.assets.setVisibility(file.id, defaultVisibility);
                 } catch (error) {
                     // Visibility update failed, continue with selection
                 }
@@ -349,13 +346,10 @@ const FileManagementScreen: React.FC<FileManagementScreenProps> = ({
             // Link file to entity if linkContext provided
             if (linkContext) {
                 try {
-                    await oxyServices.assetLink(
+                    await oxyServices.assets.link(
                         file.id,
-                        linkContext.app,
-                        linkContext.entityType,
-                        linkContext.entityId,
-                        defaultVisibility,
-                        linkContext.webhookUrl
+                        { app: linkContext.app, entityType: linkContext.entityType, entityId: linkContext.entityId },
+                        { visibility: defaultVisibility, webhookUrl: linkContext.webhookUrl },
                     );
                 } catch (error) {
                     // File linking failed, continue with selection
@@ -438,7 +432,7 @@ const FileManagementScreen: React.FC<FileManagementScreenProps> = ({
 
         try {
             setDeletingId(fileId);
-            await oxyServices.deleteFile(fileId);
+            await oxyServices.assets.delete(fileId);
 
             toast.success(t('fileManagement.toasts.deleteSuccess'));
 
@@ -476,7 +470,7 @@ const FileManagementScreen: React.FC<FileManagementScreenProps> = ({
         try {
             const deletePromises = Array.from(selectedIds).map(async (fileId) => {
                 try {
-                    await oxyServices.deleteFile(fileId);
+                    await oxyServices.assets.delete(fileId);
                     removeFileFromCache(queryClient, targetUserId, fileId);
                     return { success: true, fileId };
                 } catch (error: unknown) {
@@ -508,7 +502,7 @@ const FileManagementScreen: React.FC<FileManagementScreenProps> = ({
         try {
             const updatePromises = Array.from(selectedIds).map(async (fileId) => {
                 try {
-                    await oxyServices.assetUpdateVisibility(fileId, visibility);
+                    await oxyServices.assets.setVisibility(fileId, visibility);
                     return { success: true, fileId };
                 } catch (error: unknown) {
                     return { success: false, fileId, error };
@@ -557,7 +551,7 @@ const FileManagementScreen: React.FC<FileManagementScreenProps> = ({
             // Resolve an authenticated, private-safe URL. The synchronous
             // `getFileDownloadUrl` yields the public CDN origin, which 404s for
             // private assets (the default visibility).
-            const downloadUrl = await oxyServices.getFileDownloadUrlAsync(fileId);
+            const downloadUrl = await oxyServices.assets.url(fileId);
 
             // For web platforms, use link download
             if (typeof window !== 'undefined' && window.document) {
@@ -573,7 +567,7 @@ const FileManagementScreen: React.FC<FileManagementScreenProps> = ({
                     toast.success(t('fileManagement.toasts.downloadStarted'));
                 } catch (linkError) {
                     // Fallback to authenticated download
-                    const blob = await oxyServices.getFileContentAsBlob(fileId);
+                    const blob = await oxyServices.assets.blob(fileId);
                     const url = URL.createObjectURL(blob);
 
                     const link = document.createElement('a');
@@ -626,11 +620,11 @@ const FileManagementScreen: React.FC<FileManagementScreenProps> = ({
                         // For images, PDFs, videos, and audio, we render the URL
                         // directly. Resolve the authenticated, private-safe URL —
                         // the synchronous public-CDN URL 404s for private assets.
-                        const downloadUrl = await oxyServices.getFileDownloadUrlAsync(file.id);
+                        const downloadUrl = await oxyServices.assets.url(file.id);
                         setFileContent(downloadUrl);
                     } else {
                         // For text files, get the content using authenticated request
-                        const content = await oxyServices.getFileContentAsText(file.id);
+                        const content = await oxyServices.assets.text(file.id);
                         setFileContent(content);
                     }
                 } catch (error: unknown) {

package/src/ui/screens/HelpSupportScreen.tsx

@@ -11,7 +11,6 @@ import { useSurfaceHeader } from '../hooks/useSurfaceHeader';
 const HelpSupportScreen: React.FC<BaseScreenProps> = ({
     onClose,
     goBack,
-    navigate,
 }) => {
     const { t } = useI18n();
 
@@ -24,14 +23,6 @@ const HelpSupportScreen: React.FC<BaseScreenProps> = ({
         });
     }, [t]);
 
-    const handleFAQ = useMemo(() => () => {
-        if (navigate) {
-            navigate('FAQ');
-        } else {
-            toast.info(t('help.faqComing') || 'FAQ coming soon');
-        }
-    }, [navigate, t]);
-
     const handleReportBug = useMemo(() => () => {
         Linking.openURL('mailto:bugs@oxy.so?subject=Bug Report').catch(() => {
             toast.error(t('help.reportError') || 'Failed to open email client');
@@ -62,12 +53,6 @@ const HelpSupportScreen: React.FC<BaseScreenProps> = ({
             <View className="px-screen-margin pb-space-24">
                     {/* Help Options */}
                     <SettingsListGroup title={t('help.options') || 'Get Help'}>
-                        <SettingsListItem
-                            icon={<SettingsIcon name="help-circle" color={bloomTheme.colors.info} />}
-                            title={t('help.faq.title') || 'Frequently Asked Questions'}
-                            description={t('help.faq.subtitle') || 'Find answers to common questions'}
-                            onPress={handleFAQ}
-                        />
                         <SettingsListItem
                             icon={<SettingsIcon name="email" color={bloomTheme.colors.success} />}
                             title={t('help.contact.title') || 'Contact Support'}

package/src/ui/screens/LinkCommonsScreen.tsx

@@ -0,0 +1,13 @@
+import type React from 'react';
+import { OxyLinkCommonsPanel } from '../components/signIn/OxyLinkCommonsPanel';
+import type { BaseScreenProps } from '../types/navigation';
+import { AccountSecurityPanelFrame } from './AccountSecurityPanelScreen';
+
+/** `LinkCommons`: make the account self-custodied with the key Commons holds. */
+const LinkCommonsScreen: React.FC<BaseScreenProps> = () => (
+  <AccountSecurityPanelFrame>
+    <OxyLinkCommonsPanel />
+  </AccountSecurityPanelFrame>
+);
+
+export default LinkCommonsScreen;