@oxy.so/services 11.2.0-oxy-one.2 → 11.2.0-oxy-one.4

package/src/ui/screens/trust/TrustCenterScreen.tsx

@@ -16,234 +16,176 @@ import { useOxy } from '../../context/OxyContext';
 import { trustTierLabel } from '@oxy.so/core';
 import { queryKeys } from '../../hooks/queries/queryKeys';
 
-const TrustCenterScreen: React.FC<BaseScreenProps> = ({
-    navigate,
-}) => {
-    // Reputation/trust is the ACTIVE account's standing (the org/project/bot
-    // when switched, else the personal user).
-    const { user, oxyServices, isAuthenticated } = useOxy();
-    const { t, locale } = useI18n();
-    const bloomTheme = useTheme();
-    const primaryColor = bloomTheme.colors.primary;
+const TrustCenterScreen: React.FC<BaseScreenProps> = ({ navigate }) => {
+  // Reputation/trust is the ACTIVE account's standing (the org/project/bot
+  // when switched, else the personal user).
+  const { user, oxyServices, isAuthenticated } = useOxy();
+  const { t, locale } = useI18n();
+  const bloomTheme = useTheme();
+  const primaryColor = bloomTheme.colors.primary;
 
-    // Keyed on the account id, not the `user` object: a profile write that
-    // replaces `user` must not refetch the ledger.
-    const userId = user?.id;
-    const standing = useQuery({
-        queryKey: queryKeys.reputation.transactions(userId, 20),
-        enabled: Boolean(userId),
-        queryFn: async () => {
-            const [balance, transactions] = await Promise.all([
-                oxyServices.reputation.balance(),
-                oxyServices.reputation.transactions(userId, { limit: 20, offset: 0 }),
-            ]);
-            return { balance, transactions: Array.isArray(transactions) ? transactions : [] };
-        },
-    });
-    const reputationTotal = standing.data?.balance.total ?? null;
-    const trustTier = standing.data?.balance.trustTier ?? null;
-    const transactions = standing.data?.transactions ?? [];
-    const isLoading = standing.isPending && Boolean(userId);
-    const error = standing.error
-        ? (standing.error instanceof Error ? standing.error.message : null) ||
-          (t('trust.center.loadError') || 'Failed to load reputation data')
-        : null;
-
-    const resolvedTrustTierLabel = useMemo(
-        () => (trustTier ? trustTierLabel(locale, trustTier) : null),
-        [trustTier, locale],
-    );
+  // Keyed on the account id, not the `user` object: a profile write that
+  // replaces `user` must not refetch the ledger.
+  const userId = user?.id;
+  const standing = useQuery({
+    queryKey: queryKeys.reputation.transactions(userId, 20),
+    enabled: Boolean(userId),
+    queryFn: async () => {
+      const [balance, transactions] = await Promise.all([
+        oxyServices.reputation.balance(),
+        oxyServices.reputation.transactions(userId, { limit: 20, offset: 0 }),
+      ]);
+      return { balance, transactions: Array.isArray(transactions) ? transactions : [] };
+    },
+  });
+  const reputationTotal = standing.data?.balance.total ?? null;
+  const trustTier = standing.data?.balance.trustTier ?? null;
+  const transactions = standing.data?.transactions ?? [];
+  const isLoading = standing.isPending && Boolean(userId);
+  const error = standing.error
+    ? (standing.error instanceof Error ? standing.error.message : null) ||
+      t('trust.center.loadError') ||
+      'Failed to load reputation data'
+    : null;
 
-    const title = t('trust.center.title') || 'Trust Center';
-    useSurfaceHeader({ title });
+  const resolvedTrustTierLabel = useMemo(
+    () => (trustTier ? trustTierLabel(locale, trustTier) : null),
+    [trustTier, locale],
+  );
 
-    if (!isAuthenticated) {
-        return (
-                <View className="items-center py-space-40">
-                    <Text className="text-text font-medium text-base">
-                        {t('common.status.notSignedIn') || 'Not signed in'}
-                    </Text>
-                </View>
-        );
-    }
+  const title = t('trust.center.title') || 'Trust Center';
+  useSurfaceHeader({ title });
 
-    if (isLoading) {
-        return (
-                <View className="items-center py-space-40">
-                    <Loading size="lg" color={primaryColor} />
-                </View>
-        );
-    }
+  if (!isAuthenticated) {
+    return (
+      <View className="items-center py-space-40">
+        <Text className="text-text font-medium text-base">
+          {t('common.status.notSignedIn') || 'Not signed in'}
+        </Text>
+      </View>
+    );
+  }
 
+  if (isLoading) {
     return (
-            <View className="px-screen-margin pt-space-16 pb-space-24">
-                {/* Balance hero card */}
-                <View className="items-center bg-fill-secondary rounded-radius-20 px-space-20 py-space-24 mb-space-16">
-                    <H1 style={{ color: primaryColor }}>{reputationTotal ?? 0}</H1>
-                    <Text className="text-text-tertiary text-base mt-space-2 mb-space-12">
-                        {t('trust.center.balance') || 'Reputation Balance'}
-                    </Text>
-                    {resolvedTrustTierLabel ? (
-                        <Chip
-                            variant="subtle"
-                            color="primary"
-                            startIcon={
-                                <Ionicons
-                                    name="shield-checkmark-outline"
-                                    size={14}
-                                    color={primaryColor}
-                                />
-                            }
-                        >
-                            {resolvedTrustTierLabel}
-                        </Chip>
-                    ) : null}
-                    <Text
-                        className="text-text-tertiary text-sm text-center mt-space-16"
-                        style={styles.infoText}
-                    >
-                        {t('trust.center.info') ||
-                            'Reputation can only be earned by positive actions in the Oxy Ecosystem. It cannot be sent or received directly.'}
-                    </Text>
-                </View>
+      <View className="items-center py-space-40">
+        <Loading size="lg" color={primaryColor} />
+      </View>
+    );
+  }
 
-                {/* Trust actions */}
-                <SettingsListGroup
-                    title={t('trust.center.actions.title') || 'Explore'}
-                >
-                    <SettingsListItem
-                        icon={
-                            <SettingsIcon
-                                name="trophy"
-                                color={bloomTheme.colors.warning}
-                            />
-                        }
-                        title={t('trust.center.actions.leaderboard') || 'Leaderboard'}
-                        onPress={() => navigate?.('TrustLeaderboard')}
-                    />
-                    <SettingsListItem
-                        icon={
-                            <SettingsIcon
-                                name="file-document"
-                                color={bloomTheme.colors.info}
-                            />
-                        }
-                        title={t('trust.center.actions.rules') || 'Rules'}
-                        onPress={() => navigate?.('TrustRules')}
-                    />
-                    <SettingsListItem
-                        icon={
-                            <SettingsIcon
-                                name="gift"
-                                color={bloomTheme.colors.success}
-                            />
-                        }
-                        title={t('trust.center.actions.rewards') || 'Rewards'}
-                        onPress={() => navigate?.('TrustRewards')}
-                    />
-                    <SettingsListItem
-                        icon={
-                            <SettingsIcon
-                                name="star"
-                                color={bloomTheme.colors.primary}
-                            />
-                        }
-                        title={t('trust.center.actions.about') || 'About'}
-                        onPress={() => navigate?.('AboutTrust')}
-                    />
-                    <SettingsListItem
-                        icon={
-                            <SettingsIcon
-                                name="help-circle"
-                                color={bloomTheme.colors.secondary}
-                            />
-                        }
-                        title={t('trust.center.actions.faq') || 'FAQ'}
-                        onPress={() => navigate?.('TrustFAQ')}
-                    />
-                </SettingsListGroup>
+  return (
+    <View className="px-screen-margin pt-space-16 pb-space-24">
+      {/* Balance hero card */}
+      <View className="items-center bg-fill-secondary rounded-radius-20 px-space-20 py-space-24 mb-space-16">
+        <H1 style={{ color: primaryColor }}>{reputationTotal ?? 0}</H1>
+        <Text className="text-text-tertiary text-base mt-space-2 mb-space-12">
+          {t('trust.center.balance') || 'Reputation Balance'}
+        </Text>
+        {resolvedTrustTierLabel ? (
+          <Chip
+            variant="subtle"
+            color="primary"
+            startIcon={<Ionicons name="shield-checkmark-outline" size={14} color={primaryColor} />}
+          >
+            {resolvedTrustTierLabel}
+          </Chip>
+        ) : null}
+        <Text
+          className="text-text-tertiary text-sm text-center mt-space-16"
+          style={styles.infoText}
+        >
+          {t('trust.center.info') ||
+            'Reputation can only be earned by positive actions in the Oxy Ecosystem. It cannot be sent or received directly.'}
+        </Text>
+      </View>
 
-                {/* Reputation history */}
-                <SettingsListGroup
-                    title={t('trust.center.history') || 'Reputation History'}
-                >
-                    {transactions.length === 0 ? (
-                        <SettingsListItem
-                            icon={
-                                <SettingsIcon
-                                    name="history"
-                                    color={bloomTheme.colors.textTertiary}
-                                />
-                            }
-                            title={
-                                t('trust.center.noHistory') || 'No reputation history yet.'
-                            }
-                            showChevron={false}
-                            disabled
-                        />
-                    ) : (
-                        transactions.map((entry) => (
-                            <SettingsListItem
-                                key={entry.id}
-                                icon={
-                                    <SettingsIcon
-                                        name={
-                                            entry.points > 0
-                                                ? 'plus-circle'
-                                                : 'minus-circle'
-                                        }
-                                        color={
-                                            entry.points > 0
-                                                ? bloomTheme.colors.success
-                                                : bloomTheme.colors.error
-                                        }
-                                    />
-                                }
-                                title={
-                                    entry.reason ||
-                                    entry.actionType ||
-                                    (t('trust.center.noDescription') || 'No description')
-                                }
-                                description={
-                                    `${entry.category}${
-                                        entry.createdAt
-                                            ? ` · ${new Date(entry.createdAt).toLocaleString()}`
-                                            : ''
-                                    }`
-                                }
-                                rightElement={
-                                    <Chip
-                                        variant="subtle"
-                                        size="small"
-                                        color={entry.points > 0 ? 'success' : 'error'}
-                                    >
-                                        {`${entry.points > 0 ? '+' : ''}${entry.points}`}
-                                    </Chip>
-                                }
-                                showChevron={false}
-                            />
-                        ))
-                    )}
-                </SettingsListGroup>
+      {/* Trust actions */}
+      <SettingsListGroup title={t('trust.center.actions.title') || 'Explore'}>
+        <SettingsListItem
+          icon={<SettingsIcon name="trophy" color={bloomTheme.colors.warning} />}
+          title={t('trust.center.actions.leaderboard') || 'Leaderboard'}
+          onPress={() => navigate?.('TrustLeaderboard')}
+        />
+        <SettingsListItem
+          icon={<SettingsIcon name="file-document" color={bloomTheme.colors.info} />}
+          title={t('trust.center.actions.rules') || 'Rules'}
+          onPress={() => navigate?.('TrustRules')}
+        />
+        <SettingsListItem
+          icon={<SettingsIcon name="gift" color={bloomTheme.colors.success} />}
+          title={t('trust.center.actions.rewards') || 'Rewards'}
+          onPress={() => navigate?.('TrustRewards')}
+        />
+        <SettingsListItem
+          icon={<SettingsIcon name="star" color={bloomTheme.colors.primary} />}
+          title={t('trust.center.actions.about') || 'About'}
+          onPress={() => navigate?.('AboutTrust')}
+        />
+        <SettingsListItem
+          icon={<SettingsIcon name="help-circle" color={bloomTheme.colors.secondary} />}
+          title={t('trust.center.actions.faq') || 'FAQ'}
+          onPress={() => navigate?.('TrustFAQ')}
+        />
+      </SettingsListGroup>
 
-                {error ? (
-                    <Text
-                        className="text-sm text-center mt-space-16"
-                        style={{ color: bloomTheme.colors.error }}
-                    >
-                        {error}
-                    </Text>
-                ) : null}
-            </View>
-    );
+      {/* Reputation history */}
+      <SettingsListGroup title={t('trust.center.history') || 'Reputation History'}>
+        {transactions.length === 0 ? (
+          <SettingsListItem
+            icon={<SettingsIcon name="history" color={bloomTheme.colors.textTertiary} />}
+            title={t('trust.center.noHistory') || 'No reputation history yet.'}
+            showChevron={false}
+            disabled
+          />
+        ) : (
+          transactions.map((entry) => (
+            <SettingsListItem
+              key={entry.id}
+              icon={
+                <SettingsIcon
+                  name={entry.points > 0 ? 'plus-circle' : 'minus-circle'}
+                  color={entry.points > 0 ? bloomTheme.colors.success : bloomTheme.colors.error}
+                />
+              }
+              title={
+                entry.reason ||
+                entry.actionType ||
+                t('trust.center.noDescription') ||
+                'No description'
+              }
+              description={`${entry.category}${
+                entry.createdAt ? ` · ${new Date(entry.createdAt).toLocaleString()}` : ''
+              }`}
+              rightElement={
+                <Chip variant="subtle" size="small" color={entry.points > 0 ? 'success' : 'error'}>
+                  {`${entry.points > 0 ? '+' : ''}${entry.points}`}
+                </Chip>
+              }
+              showChevron={false}
+            />
+          ))
+        )}
+      </SettingsListGroup>
+
+      {error ? (
+        <Text
+          className="text-sm text-center mt-space-16"
+          style={{ color: bloomTheme.colors.error }}
+        >
+          {error}
+        </Text>
+      ) : null}
+    </View>
+  );
 };
 
 // Layout-only styles: the info caption's measured max width. No color, spacing,
 // radius, or typography roles live here — those use Bloom token classes.
 const styles = StyleSheet.create({
-    infoText: {
-        maxWidth: 320,
-    },
+  infoText: {
+    maxWidth: 320,
+  },
 });
 
 export default TrustCenterScreen;

package/src/ui/screens/trust/TrustFAQScreen.tsx

@@ -4,10 +4,10 @@ import type { BaseScreenProps } from '../../types/navigation';
 import { useSurfaceHeader } from '../../hooks/useSurfaceHeader';
 import { Search } from '@oxy.so/bloom/search';
 import {
-    Accordion,
-    AccordionItem,
-    AccordionTrigger,
-    AccordionContent,
+  Accordion,
+  AccordionItem,
+  AccordionTrigger,
+  AccordionContent,
 } from '@oxy.so/bloom/accordion';
 import { Text } from '@oxy.so/bloom/typography';
 import { useI18n } from '../../hooks/useI18n';
@@ -23,79 +23,72 @@ const FAQ_KEYS = ['what', 'earn', 'lose', 'use', 'transfer', 'support'] as const
  * `LayoutAnimation` is used here.
  */
 const TrustFAQScreen: React.FC<BaseScreenProps> = () => {
-    const { t } = useI18n();
+  const { t } = useI18n();
 
-    useSurfaceHeader({
-        title: t('trust.faq.title') || 'Trust FAQ',
-        subtitle: t('trust.faq.subtitle') || 'Frequently asked questions about Oxy Trust',
-    });
+  useSurfaceHeader({
+    title: t('trust.faq.title') || 'Trust FAQ',
+    subtitle: t('trust.faq.subtitle') || 'Frequently asked questions about Oxy Trust',
+  });
 
-    const [search, setSearch] = useState('');
-    const [expanded, setExpanded] = useState<string | undefined>(undefined);
+  const [search, setSearch] = useState('');
+  const [expanded, setExpanded] = useState<string | undefined>(undefined);
 
-    const faqs = useMemo(() => FAQ_KEYS.map(key => ({
+  const faqs = useMemo(
+    () =>
+      FAQ_KEYS.map((key) => ({
         id: key,
         q: t(`trust.faq.items.${key}.q`) || '',
         a: t(`trust.faq.items.${key}.a`) || '',
-    })), [t]);
+      })),
+    [t],
+  );
 
-    const filteredFaqs = useMemo(() => {
-        if (!search.trim()) return faqs;
-        const searchLower = search.toLowerCase();
-        return faqs.filter(faq =>
-            faq.q.toLowerCase().includes(searchLower) ||
-            faq.a.toLowerCase().includes(searchLower)
-        );
-    }, [search, faqs]);
-
-    const handleAccordionChange = useCallback(
-        (value: string | string[] | undefined) => {
-            setExpanded(Array.isArray(value) ? value[0] : value);
-        },
-        [],
+  const filteredFaqs = useMemo(() => {
+    if (!search.trim()) return faqs;
+    const searchLower = search.toLowerCase();
+    return faqs.filter(
+      (faq) =>
+        faq.q.toLowerCase().includes(searchLower) || faq.a.toLowerCase().includes(searchLower),
     );
+  }, [search, faqs]);
 
-    return (
-        <>
-            <View className="px-screen-margin pt-space-20 pb-space-12">
-                <Search
-                    label={t('trust.faq.search') || 'Search FAQ...'}
-                    value={search}
-                    onChangeText={setSearch}
-                    onClearText={() => setSearch('')}
-                    accessibilityLabel="Search Trust FAQ"
-                />
-            </View>
+  const handleAccordionChange = useCallback((value: string | string[] | undefined) => {
+    setExpanded(Array.isArray(value) ? value[0] : value);
+  }, []);
 
-            <View className="px-screen-margin">
-                {filteredFaqs.length === 0 ? (
-                    <Text className="text-text-secondary text-center p-space-40">
-                        {t('trust.faq.noResults', { query: search }) ||
-                            `No FAQ items found matching "${search}"`}
-                    </Text>
-                ) : (
-                    <Accordion
-                        type="single"
-                        value={expanded}
-                        onValueChange={handleAccordionChange}
-                    >
-                        {filteredFaqs.map(faq => (
-                            <AccordionItem key={faq.id} value={faq.id}>
-                                <AccordionTrigger>
-                                    {faq.q}
-                                </AccordionTrigger>
-                                <AccordionContent>
-                                    <Text className="font-sans text-body text-text-secondary">
-                                        {faq.a}
-                                    </Text>
-                                </AccordionContent>
-                            </AccordionItem>
-                        ))}
-                    </Accordion>
-                )}
-            </View>
-        </>
-    );
+  return (
+    <>
+      <View className="px-screen-margin pt-space-20 pb-space-12">
+        <Search
+          label={t('trust.faq.search') || 'Search FAQ...'}
+          value={search}
+          onChangeText={setSearch}
+          onClearText={() => setSearch('')}
+          accessibilityLabel="Search Trust FAQ"
+        />
+      </View>
+
+      <View className="px-screen-margin">
+        {filteredFaqs.length === 0 ? (
+          <Text className="text-text-secondary text-center p-space-40">
+            {t('trust.faq.noResults', { query: search }) ||
+              `No FAQ items found matching "${search}"`}
+          </Text>
+        ) : (
+          <Accordion type="single" value={expanded} onValueChange={handleAccordionChange}>
+            {filteredFaqs.map((faq) => (
+              <AccordionItem key={faq.id} value={faq.id}>
+                <AccordionTrigger>{faq.q}</AccordionTrigger>
+                <AccordionContent>
+                  <Text className="font-sans text-body text-text-secondary">{faq.a}</Text>
+                </AccordionContent>
+              </AccordionItem>
+            ))}
+          </Accordion>
+        )}
+      </View>
+    </>
+  );
 };
 
 export default React.memo(TrustFAQScreen);