feat: add user_template setting (#36)

This commit is contained in:
仓鼠
2024-12-07 01:17:00 +08:00
committed by GitHub
parent d702996021
commit c01a48cab9
6 changed files with 116 additions and 4 deletions

View File

@@ -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"