From 6c43d772ecd0e60d51a99e3723afcc9641480997 Mon Sep 17 00:00:00 2001
From: "Jude.Chen" <jude.j.chen@outlook.com>
Date: Tue, 6 Oct 2026 22:31:37 +0800
Subject: [PATCH] Settings: sponsor card with Afdian link at the top

---
 src/app/(tabs)/settings.tsx | 23 ++++++++++++++++++++++-
 src/i18n/zh.ts              |  4 ++++
 2 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/src/app/(tabs)/settings.tsx b/src/app/(tabs)/settings.tsx
index be28029..350dda2 100644
--- a/src/app/(tabs)/settings.tsx
+++ b/src/app/(tabs)/settings.tsx
@@ -7,7 +7,7 @@ import { Screen } from '@/components/screen';
 import { Section, Row } from '@/components/section';
 import { ScreenHeader } from '@/components/screen-header';
 import { ThemedText } from '@/components/themed-text';
-import { Spacing } from '@/constants/theme';
+import { Radius, Spacing } from '@/constants/theme';
 import {
   useAccountActions,
   useAccountViews,
@@ -15,6 +15,7 @@ import {
   useBackgroundState,
   useNotificationPermission,
 } from '@/data/hooks';
+import { useTheme } from '@/hooks/use-theme';
 import { useT, type LocaleSetting, type ThemeSetting } from '@/i18n';
 import { usePreferences } from '@/providers/preferences';
 import { Button, Segmented } from '@/ui/controls';
@@ -30,6 +31,7 @@ const SPONSOR_URL = 'https://afdian.com/a/nextroad';
 export default function SettingsScreen() {
   const router = useRouter();
   const t = useT();
+  const theme = useTheme();
   const accounts = useAccountViews();
   const views = accounts.data ?? [];
   const actions = useAccountActions();
@@ -59,6 +61,25 @@ export default function SettingsScreen() {
     <Screen>
       <ScreenHeader title={t('Settings')} />
 
+      {/* sponsor card: the one rounded surface on the page, so it reads as an invitation, not a setting */}
+      <Animated.View
+        entering={enterItem(0)}
+        style={{
+          backgroundColor: theme.backgroundElement,
+          borderColor: theme.border,
+          borderWidth: 1,
+          borderRadius: Radius.control + 4,
+          padding: Spacing.three,
+          gap: Spacing.two,
+        }}
+      >
+        <ThemedText type="smallBold">{t('Support AI Usage')}</ThemedText>
+        <ThemedText type="small" themeColor="textSecondary">
+          {t('AI Usage is free and has no ads. If it helps you, consider supporting development.')}
+        </ThemedText>
+        <Button title={t('Support on Afdian')} onPress={() => Linking.openURL(SPONSOR_URL)} />
+      </Animated.View>
+
       <Section title={t('Language & appearance')} bandStyle={{ gap: Spacing.three }}>
         <View style={{ gap: Spacing.two }}>
           <ThemedText type="small" themeColor="textSecondary">
diff --git a/src/i18n/zh.ts b/src/i18n/zh.ts
index 00c7352..43a557c 100644
--- a/src/i18n/zh.ts
+++ b/src/i18n/zh.ts
@@ -29,6 +29,10 @@ export const zh: Record<string, string> = {
   'Tap refresh to load usage.': '点击刷新以加载用量。',
   Refresh: '刷新',
   Sponsor: '赞助',
+  'Support AI Usage': '支持 AI Usage',
+  'AI Usage is free and has no ads. If it helps you, consider supporting development.':
+    'AI Usage 免费且没有广告。如果它对你有帮助，欢迎支持开发。',
+  'Support on Afdian': '去爱发电支持',
   Afdian: '爱发电',
   'Search providers': '搜索提供商',
   'No provider matches "{query}".': '没有找到与“{query}”匹配的提供商。',