feat: bootstrap v2 admin app tabs

app/login.tsx

@@ -0,0 +1,84 @@
+import { zodResolver } from '@hookform/resolvers/zod';
+import { Globe, KeyRound } from 'lucide-react-native';
+import { Controller, useForm } from 'react-hook-form';
+import { Pressable, Text, TextInput, View } from 'react-native';
+import { z } from 'zod';
+
+import { ListCard } from '@/src/components/list-card';
+import { ScreenShell } from '@/src/components/screen-shell';
+import { adminConfigState, saveAdminConfig } from '@/src/store/admin-config';
+
+const { useSnapshot } = require('valtio/react');
+
+const schema = z.object({
+  baseUrl: z.string().min(1, '请输入 Host'),
+  adminApiKey: z.string().min(1, '请输入 Admin Token'),
+});
+
+type FormValues = z.infer<typeof schema>;
+
+export default function LoginScreen() {
+  const config = useSnapshot(adminConfigState);
+  const { control, handleSubmit, formState } = useForm<FormValues>({
+    resolver: zodResolver(schema),
+    defaultValues: {
+      baseUrl: config.baseUrl,
+      adminApiKey: config.adminApiKey,
+    },
+  });
+
+  return (
+    <ScreenShell title="登录" subtitle="输入 host 和 adminToken 后开始管理。">
+      <ListCard title="Host" meta="当前站点或管理代理地址" icon={Globe}>
+        <Controller
+          control={control}
+          name="baseUrl"
+          render={({ field: { onChange, value } }) => (
+            <TextInput
+              value={value}
+              onChangeText={onChange}
+              placeholder="http://localhost:8787"
+              placeholderTextColor="#9b9081"
+              autoCapitalize="none"
+              className="rounded-[18px] bg-[#f1ece2] px-4 py-4 text-base text-[#16181a]"
+            />
+          )}
+        />
+      </ListCard>
+
+      <ListCard title="Admin Token" meta="管理员 token" icon={KeyRound}>
+        <Controller
+          control={control}
+          name="adminApiKey"
+          render={({ field: { onChange, value } }) => (
+            <TextInput
+              value={value}
+              onChangeText={onChange}
+              placeholder="admin-xxxxxxxx"
+              placeholderTextColor="#9b9081"
+              autoCapitalize="none"
+              className="rounded-[18px] bg-[#f1ece2] px-4 py-4 text-base text-[#16181a]"
+            />
+          )}
+        />
+      </ListCard>
+
+      {(formState.errors.baseUrl || formState.errors.adminApiKey) ? (
+        <View className="rounded-[20px] bg-[#fbf1eb] px-4 py-3">
+          <Text className="text-sm text-[#c25d35]">{formState.errors.baseUrl?.message || formState.errors.adminApiKey?.message}</Text>
+        </View>
+      ) : null}
+
+      <Pressable
+        className="rounded-[20px] bg-[#1d5f55] px-4 py-4"
+        onPress={handleSubmit(async (values) => {
+          await saveAdminConfig(values);
+        })}
+      >
+        <Text className="text-center text-sm font-semibold tracking-[1.2px] text-white">
+          {config.saving ? '登录中...' : '进入管理台'}
+        </Text>
+      </Pressable>
+    </ScreenShell>
+  );
+}