@oxyhq/services 6.9.45 → 6.10.1

package/src/ui/screens/AccountVerificationScreen.tsx

@@ -9,10 +9,9 @@ import {
     ActivityIndicator,
 } from 'react-native';
 import type { BaseScreenProps } from '../types/navigation';
-import { toast } from '../../lib/sonner';
-import * as Prompt from '@oxyhq/bloom/prompt';
-import { usePromptControl } from '@oxyhq/bloom/prompt';
-import { Header, Section } from '../components';
+import { Dialog, toast, useDialogControl } from '@oxyhq/bloom';
+import { Header } from '../components';
+import { SettingsListGroup } from '@oxyhq/bloom/settings-list';
 import { useI18n } from '../hooks/useI18n';
 import { useTheme } from '@oxyhq/bloom/theme';
 import { useOxy } from '../context/OxyContext';
@@ -32,8 +31,8 @@ const AccountVerificationScreen: React.FC<BaseScreenProps> = ({
 
     const bloomTheme = useTheme();
 
-    // Prompt controls
-    const successPrompt = usePromptControl();
+    // Dialog controls
+    const successDialog = useDialogControl();
 
     const handleSuccessAcknowledged = useCallback(() => {
         setReason('');
@@ -62,7 +61,7 @@ const AccountVerificationScreen: React.FC<BaseScreenProps> = ({
             setSuccessMessage(
                 t('accountVerification.successMessage') || `Your verification request has been submitted. Request ID: ${result.requestId}`
             );
-            successPrompt.open();
+            successDialog.open();
         } catch (error: unknown) {
             if (__DEV__) {
                 console.error('Failed to submit verification request:', error);
@@ -73,7 +72,7 @@ const AccountVerificationScreen: React.FC<BaseScreenProps> = ({
         } finally {
             setIsSubmitting(false);
         }
-    }, [reason, evidence, oxyServices, t, successPrompt]);
+    }, [reason, evidence, oxyServices, t, successDialog]);
 
     return (
         <View style={[styles.container, { backgroundColor: bloomTheme.colors.background }]}>
@@ -86,13 +85,13 @@ const AccountVerificationScreen: React.FC<BaseScreenProps> = ({
             />
 
             <ScrollView style={styles.content}>
-                <Section  isFirst={true}>
+                <SettingsListGroup>
                     <Text style={styles.description} className="text-muted-foreground">
                         {t('accountVerification.description') || 'Request a verified badge for your account. Verified accounts help establish authenticity and credibility.'}
                     </Text>
-                </Section>
+                </SettingsListGroup>
 
-                <Section title={t('accountVerification.sections.request') || 'VERIFICATION REQUEST'} >
+                <SettingsListGroup title={t('accountVerification.sections.request') || 'VERIFICATION REQUEST'}>
                     <View style={styles.inputGroup}>
                         <Text style={styles.label} className="text-foreground">
                             {t('accountVerification.reasonLabel') || 'Reason for Verification *'}
@@ -134,9 +133,9 @@ const AccountVerificationScreen: React.FC<BaseScreenProps> = ({
                             editable={!isSubmitting}
                         />
                     </View>
-                </Section>
+                </SettingsListGroup>
 
-                <Section >
+                <SettingsListGroup>
                     <TouchableOpacity
                         style={styles.submitButton}
                         className={isSubmitting ? 'bg-muted-foreground' : 'bg-primary'}
@@ -144,28 +143,31 @@ const AccountVerificationScreen: React.FC<BaseScreenProps> = ({
                         disabled={isSubmitting || !reason.trim()}
                     >
                         {isSubmitting ? (
-                            <ActivityIndicator color="#FFFFFF" />
+                            <ActivityIndicator color={bloomTheme.colors.negativeForeground} />
                         ) : (
-                            <Text style={styles.submitButtonText}>
+                            <Text style={[styles.submitButtonText, { color: bloomTheme.colors.negativeForeground }]}>
                                 {t('accountVerification.submit') || 'Submit Request'}
                             </Text>
                         )}
                     </TouchableOpacity>
-                </Section>
+                </SettingsListGroup>
 
-                <Section >
+                <SettingsListGroup>
                     <Text style={styles.note} className="text-muted-foreground">
                         {t('accountVerification.note') || 'Note: Verification requests are reviewed manually and may take several days. We will notify you once your request has been reviewed.'}
                     </Text>
-                </Section>
+                </SettingsListGroup>
             </ScrollView>
-            <Prompt.Basic
-                control={successPrompt}
+            <Dialog
+                control={successDialog}
                 title={t('accountVerification.successTitle') || 'Request Submitted'}
                 description={successMessage}
-                onConfirm={handleSuccessAcknowledged}
-                confirmButtonCta={t('accountVerification.ok') || 'OK'}
-                showCancel={false}
+                actions={[
+                    {
+                        label: t('accountVerification.ok') || 'OK',
+                        onPress: handleSuccessAcknowledged,
+                    },
+                ]}
             />
         </View>
     );
@@ -211,7 +213,6 @@ const styles = StyleSheet.create({
         minHeight: 50,
     },
     submitButtonText: {
-        color: '#FFFFFF',
         fontSize: 16,
         fontWeight: '600',
     },

package/src/ui/screens/AppInfoScreen.tsx

@@ -12,9 +12,8 @@ import {
     ActivityIndicator,
 } from 'react-native';
 import type { BaseScreenProps } from '../types/navigation';
-import { fontFamilies } from '../styles/fonts';
 import { packageInfo } from '@oxyhq/core';
-import { toast } from '../../lib/sonner';
+import { toast } from '@oxyhq/bloom';
 import { Ionicons } from '@expo/vector-icons';
 import OxyServicesLogo from '../../assets/icons/OxyServices';
 import { SettingsIcon } from '../components/SettingsIcon';
@@ -53,8 +52,7 @@ const AppInfoScreen: React.FC<BaseScreenProps> = ({
     const colorScheme = useColorScheme();
     const normalizedColorScheme = normalizeColorScheme(colorScheme);
     const themeColors = Colors[normalizedColorScheme];
-    // AppInfoScreen uses a slightly different light background
-    const backgroundColor = bloomTheme.isDark ? bloomTheme.colors.background : '#f2f2f2';
+    const backgroundColor = bloomTheme.colors.background;
     const primaryColor = themeColors.iconSecurity;
 
     useEffect(() => {
@@ -163,11 +161,11 @@ const AppInfoScreen: React.FC<BaseScreenProps> = ({
     return (
         <View style={[styles.container, { backgroundColor }]}>
             {/* Header */}
-            <View style={styles.header}>
+            <View style={[styles.header, { backgroundColor: bloomTheme.colors.card }]}>
                 <TouchableOpacity style={styles.cancelButton} onPress={onClose}>
-                    <Ionicons name="close" size={24} color="#666" />
+                    <Ionicons name="close" size={24} color={bloomTheme.colors.textSecondary} />
                 </TouchableOpacity>
-                <Text style={styles.headerTitle}>{t('appInfo.title')}</Text>
+                <Text style={[styles.headerTitle, { color: bloomTheme.colors.text }]}>{t('appInfo.title')}</Text>
                 <View style={styles.placeholder} />
             </View>
 
@@ -273,7 +271,7 @@ const AppInfoScreen: React.FC<BaseScreenProps> = ({
                                 description={user.email || 'N/A'}
                             />
                             <SettingsListItem
-                                icon={<SettingsIcon name="star" color={user.isPremium ? '#FFD700' : '#8E8E93'} />}
+                                icon={<SettingsIcon name="star" color={user.isPremium ? bloomTheme.colors.warning : bloomTheme.colors.textTertiary} />}
                                 title={t('appInfo.items.premiumStatus')}
                                 description={user.isPremium ? t('appInfo.items.premium') : t('appInfo.items.standard')}
                             />
@@ -353,7 +351,7 @@ const AppInfoScreen: React.FC<BaseScreenProps> = ({
                     <SettingsListItem
                         icon={<SettingsIcon
                             name={isRunningSystemCheck ? 'sync' : 'check-circle'}
-                            color={isRunningSystemCheck ? '#FF9500' : '#34C759'}
+                            color={isRunningSystemCheck ? bloomTheme.colors.warning : bloomTheme.colors.success}
                         />}
                         title={isRunningSystemCheck ? t('appInfo.items.runningSystemCheck') : t('appInfo.items.runSystemCheck')}
                         description={isRunningSystemCheck
@@ -362,7 +360,7 @@ const AppInfoScreen: React.FC<BaseScreenProps> = ({
                         onPress={runSystemCheck}
                         disabled={isRunningSystemCheck}
                         rightElement={isRunningSystemCheck ? (
-                            <ActivityIndicator color="#FF9500" size="small" />
+                            <ActivityIndicator color={bloomTheme.colors.warning} size="small" />
                         ) : undefined}
                     />
                 </SettingsListGroup>
@@ -381,7 +379,6 @@ const styles = StyleSheet.create({
         justifyContent: 'space-between',
         paddingHorizontal: 16,
         paddingVertical: 12,
-        backgroundColor: '#fff',
     },
     cancelButton: {
         padding: 5,
@@ -389,8 +386,6 @@ const styles = StyleSheet.create({
     headerTitle: {
         fontSize: 24,
         fontWeight: 'bold',
-        color: '#000',
-        fontFamily: fontFamilies.interBold,
     },
     placeholder: {
         width: 34, // Same width as cancel button to center title