release: v1.0.2

Add i18n (zh-CN/en), mobile navigation menus, stats and upload UI
improvements, and Docker reset-password CLI for emergency recovery.

app/composables/useAppearanceMenus.ts

@@ -0,0 +1,98 @@
+import type { DropdownMenuItem } from '@nuxt/ui'
+
+export function useAppearanceMenus() {
+  const colorMode = useColorMode()
+  const { locale, locales, setLocale, t } = useI18n()
+
+  const themeIcon = computed(() => {
+    if (colorMode.preference === 'system') return 'i-lucide-monitor'
+    return colorMode.preference === 'dark' ? 'i-lucide-moon' : 'i-lucide-sun'
+  })
+
+  const localeMenuItems = computed<DropdownMenuItem[][]>(() => [[
+    ...locales.value.map(loc => ({
+      label: t(`locale.${loc.code}`),
+      icon: 'i-lucide-languages',
+      type: 'checkbox' as const,
+      checked: locale.value === loc.code,
+      onUpdateChecked(checked: boolean) {
+        if (checked && typeof loc.code === 'string') {
+          void setLocale(loc.code)
+        }
+      }
+    }))
+  ]])
+
+  const themeMenuItems = computed<DropdownMenuItem[][]>(() => [[
+    {
+      label: t('theme.light'),
+      icon: 'i-lucide-sun',
+      type: 'checkbox',
+      checked: colorMode.preference === 'light',
+      onUpdateChecked(checked: boolean) {
+        if (checked) colorMode.preference = 'light'
+      }
+    },
+    {
+      label: t('theme.dark'),
+      icon: 'i-lucide-moon',
+      type: 'checkbox',
+      checked: colorMode.preference === 'dark',
+      onUpdateChecked(checked: boolean) {
+        if (checked) colorMode.preference = 'dark'
+      }
+    },
+    {
+      label: t('theme.system'),
+      icon: 'i-lucide-monitor',
+      type: 'checkbox',
+      checked: colorMode.preference === 'system',
+      onUpdateChecked(checked: boolean) {
+        if (checked) colorMode.preference = 'system'
+      }
+    }
+  ]])
+
+  const themeOptions = computed(() => [
+    {
+      value: 'light' as const,
+      label: t('theme.light'),
+      icon: 'i-lucide-sun'
+    },
+    {
+      value: 'dark' as const,
+      label: t('theme.dark'),
+      icon: 'i-lucide-moon'
+    },
+    {
+      value: 'system' as const,
+      label: t('theme.system'),
+      icon: 'i-lucide-monitor'
+    }
+  ])
+
+  const localeOptions = computed(() =>
+    locales.value.map(loc => ({
+      code: String(loc.code),
+      label: t(`locale.${loc.code}`)
+    }))
+  )
+
+  function setThemePreference(value: 'light' | 'dark' | 'system') {
+    colorMode.preference = value
+  }
+
+  async function setLocalePreference(code: string) {
+    await setLocale(code)
+  }
+
+  return {
+    themeIcon,
+    localeMenuItems,
+    themeMenuItems,
+    localeOptions,
+    themeOptions,
+    setThemePreference,
+    setLocalePreference
+  }
+}