feat: add user_template setting (#36)

src/locales/en/translation.json

@@ -152,5 +152,13 @@
   "NewUser": "New user",
   "Count": "Count",
   "LastBlockReason": "Last Block Reason",
-  "LastBlockTime": "Last ban time"
+  "LastBlockTime": "Last ban time",
+  "Theme": "Theme",
+  "Author": "Author",
+  "Repository": "Repository",
+  "Community": "Community",
+  "Official": "Official",
+  "CommunityThemeWarning": "You are using a community theme",
+  "CommunityThemeDescription": "This theme is provided by the community, use it at your own risk",
+  "Cancel": "Cancel"
 }

src/locales/it/translation.json

@@ -152,5 +152,13 @@
   "NewUser": "Nuovo utente",
   "Count": "Contare",
   "LastBlockReason": "Motivo dell'ultimo divieto",
-  "LastBlockTime": "L'ultima volta che è stato vietato"
+  "LastBlockTime": "L'ultima volta che è stato vietato",
+  "Theme": "Tema",
+  "Author": "Autore",
+  "Repository": "Repository",
+  "Community": "Comunità",
+  "Official": "Ufficiale",
+  "CommunityThemeWarning": "Questo tema appartiene alla comunità",
+  "CommunityThemeDescription": "Questo tema viene fornito dalla comunità, utilizzalo a tuo rischio e pericolo",
+  "Cancel": "Annulla"
 }

src/locales/zh-CN/translation.json

@@ -152,5 +152,13 @@
   "NewUser": "新用户",
   "Count": "计数",
   "LastBlockReason": "最后封禁原因",
-  "LastBlockTime": "最后封禁时间"
+  "LastBlockTime": "最后封禁时间",
+  "Theme": "主题",
+  "Author": "作者",
+  "Repository": "仓库",
+  "Community": "社区",
+  "Official": "官方",
+  "CommunityThemeWarning": "正在使用社区主题",
+  "CommunityThemeDescription": "社区主题未经官方审计，需自行甄别风险。",
+  "Cancel": "取消"
 }

src/locales/zh-TW/translation.json

@@ -152,5 +152,13 @@
   "NewUser": "新用戶",
   "Count": "計數",
   "LastBlockReason": "最後封鎖原因",
-  "LastBlockTime": "最後封鎖時間"
+  "LastBlockTime": "最後封鎖時間",
+  "Theme": "主題",
+  "Author": "作者",
+  "Repository": "仓库",
+  "Community": "社区",
+  "Official": "官方",
+  "CommunityThemeWarning": "正在使用社區主題",
+  "CommunityThemeDescription": "社區主題未經官方審計，需自行甄別風險。",
+  "Cancel": "取消"
 }

src/routes/settings.tsx

@@ -38,6 +38,7 @@ const settingFormSchema = z.object({
     cover: z.coerce.number().int().min(1),
     site_name: z.string().min(1),
     language: z.string().min(2),
+    user_template: z.string().min(1),
     install_host: asOptionalField(z.string()),
     custom_code: asOptionalField(z.string()),
     custom_code_dashboard: asOptionalField(z.string()),
@@ -78,12 +79,14 @@ export default function SettingsPage() {
             ? {
                 ...config,
                 site_name: config.site_name || "",
+                user_template: config.user_template || Object.keys(config.user_templates || {})[0] || "user-dist",
             }
             : {
                 ip_change_notification_group_id: 0,
                 cover: 1,
                 site_name: "",
                 language: "",
+                user_template: "user-dist",
             },
         resetOptions: {
             keepDefaultValues: false,
@@ -158,6 +161,72 @@ export default function SettingsPage() {
                                 </FormItem>
                             )}
                         />
+                        <FormField
+                            control={form.control}
+                            name="user_template"
+                            render={({ field }) => (
+                                <FormItem>
+                                    <FormLabel>{t("Theme")}</FormLabel>
+                                    <FormControl>
+                                        <Select 
+                                            value={field.value}
+                                            onValueChange={(value) => {
+                                                const template = config?.user_templates?.find(t => t.path === value);
+                                                if (template) {
+                                                    form.setValue("user_template", template.path);
+                                                }
+                                            }}
+                                        >
+                                            <FormControl>
+                                                <SelectTrigger>
+                                                    <SelectValue placeholder={t("SelectTheme")} />
+                                                </SelectTrigger>
+                                            </FormControl>
+                                            <SelectContent>
+                                                {(config?.user_templates || []).map((template) => (
+                                                    <div key={template.path}>
+                                                        <SelectItem value={template.path}>
+                                                            <div className="flex flex-col items-start gap-1">
+                                                                <div className="font-medium">{template.name}</div>
+                                                                <div className="flex items-center gap-2 text-sm text-muted-foreground">
+                                                                    <span>{t("Author")}: {template.author}</span>
+                                                                    {template.community ? (
+                                                                        <span className="px-1.5 py-0.5 rounded-md bg-red-100 text-red-800 text-xs">
+                                                                            {t("Community")}
+                                                                        </span>
+                                                                    ): (
+                                                                        <span className="px-1.5 py-0.5 rounded-md bg-blue-100 text-blue-800 text-xs">
+                                                                            {t("Official")}
+                                                                        </span>
+                                                                    )}
+                                                                </div>
+                                                            </div>
+                                                        </SelectItem>
+                                                        <div className="px-8 py-1">
+                                                            <a 
+                                                                href={template.repository}
+                                                                target="_blank"
+                                                                rel="noopener noreferrer"
+                                                                className="text-sm text-blue-600 hover:text-blue-800 hover:underline"
+                                                            >
+                                                                {template.repository}
+                                                            </a>
+                                                        </div>
+                                                    </div>
+                                                ))}
+                                            </SelectContent>
+                                        </Select>
+                                    </FormControl>
+                                    <FormMessage />
+                                    {config?.user_templates?.find(t => t.path === field.value)?.community && (
+                                        <div className="mt-2 text-sm text-yellow-700 dark:text-yellow-200 bg-yellow-100 dark:bg-yellow-900 border border-yellow-200 dark:border-yellow-700 rounded-md p-2">
+                                            <div className="font-medium text-lg mb-1">{t("CommunityThemeWarning")}</div>
+                                            <div className="text-yellow-700 dark:text-yellow-200">{t("CommunityThemeDescription")}</div>
+                                        </div>
+                                    )}
+                                </FormItem>
+                            )}
+                        />
                         <FormField
                             control={form.control}
                             name="custom_code"

src/types/api.ts

@@ -587,6 +587,14 @@ export interface ModelSettingForm {
   tls?: boolean;
 }
 
+export interface ModelUserTemplateItem {
+  path: string;
+  name: string;
+  repository: string;
+  author: string;
+  community: boolean;
+}
+
 export interface ModelSettingResponse {
   agent_secret_key: string;
   avg_ping_count: number;
@@ -619,6 +627,9 @@ export interface ModelSettingResponse {
   site_name: string;
   tls: boolean;
   version: string;
+  /** 前台主题 */
+  user_templates: ModelUserTemplateItem[];
+  user_template: string;
 }
 
 export interface ModelStreamServer {