feat: add language selector and lazy-load i18n infrastructure
Updated i18n.ts with SUPPORTED_LOCALES, setLocale() lazy loading, localStorage persistence. Added language selector in Settings.vue. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -453,6 +453,23 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Language Section -->
|
||||
<div class="glass-card px-6 py-6 mb-6">
|
||||
<h2 class="text-xl font-semibold text-white/96 mb-2">Language</h2>
|
||||
<p class="text-sm text-white/60 mb-4">Choose your preferred language</p>
|
||||
<div class="flex gap-3 flex-wrap">
|
||||
<button
|
||||
v-for="loc in supportedLocales"
|
||||
:key="loc.code"
|
||||
@click="changeLocale(loc.code)"
|
||||
class="glass-button px-4 py-2 rounded-lg text-sm font-medium transition-all"
|
||||
:class="currentLocale === loc.code ? 'ring-2 ring-orange-400/60 bg-white/10' : ''"
|
||||
>
|
||||
<span class="mr-2">{{ loc.flag }}</span>{{ loc.name }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Claude Authentication Section -->
|
||||
<div class="glass-card px-6 py-6 mb-6">
|
||||
<h2 class="text-xl font-semibold text-white/96 mb-2">{{ t('settings.claudeAuth') }}</h2>
|
||||
@@ -818,6 +835,7 @@
|
||||
import { computed, ref, onMounted, nextTick } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { SUPPORTED_LOCALES, setLocale, type SupportedLocale } from '@/i18n'
|
||||
import { useAppStore } from '../stores/app'
|
||||
import { useUIModeStore } from '@/stores/uiMode'
|
||||
import { useAIPermissionsStore, AI_PERMISSION_CATEGORIES } from '@/stores/aiPermissions'
|
||||
@@ -827,8 +845,13 @@ import { useModalKeyboard } from '@/composables/useModalKeyboard'
|
||||
import type { UIMode } from '@/types/api'
|
||||
|
||||
const router = useRouter()
|
||||
const { t } = useI18n()
|
||||
const { t, locale } = useI18n()
|
||||
const store = useAppStore()
|
||||
const supportedLocales = SUPPORTED_LOCALES
|
||||
const currentLocale = computed(() => locale.value)
|
||||
async function changeLocale(code: string) {
|
||||
await setLocale(code as SupportedLocale)
|
||||
}
|
||||
const uiMode = useUIModeStore()
|
||||
const aiPermissions = useAIPermissionsStore()
|
||||
const aiCategoryGroups = computed(() => {
|
||||
|
||||
Reference in New Issue
Block a user