optimize translation

ppy-sb · Aug 24, 2023 · dc1f17e · dc1f17e
1 parent 9c9652d
commit dc1f17e
Show file tree

Hide file tree

Showing 21 changed files with 84 additions and 65 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -36,6 +36,7 @@
     "katu",
     "lazer",
     "leaderboard",
+    "leaderboards",
     "lintfix",
     "lowlight",
     "Mapset",

diff --git a/src/components/app/mode-switcher.vue b/src/components/app/mode-switcher.vue
@@ -18,7 +18,7 @@ const emit = defineEmits<{
 }>()
 
 const { hasLeaderboardRankingSystem, hasRuleset, supportedModes, supportedRulesets, supportedLeaderboardRankingSystems } = useAdapterConfig()
-const { t } = useI18n()
+useI18n()
 
 const [switcher, setSwitcher] = useLeaderboardSwitcher(
   toRaw(props.modelValue) || {}
@@ -62,7 +62,7 @@ watch(switcher, () => emitData())
         }"
         @click="setSwitcher({ ruleset })"
       >
-        {{ t(localeKey.ruleset(ruleset)) }}
+        {{ $t(localeKey.ruleset(ruleset)) }}
       </a>
     </div>
     <div
@@ -89,7 +89,7 @@ watch(switcher, () => emitData())
           }"
           @click="setSwitcher({ rankingSystem })"
         >
-          {{ t(localeKey.rankingSystem(rankingSystem)) }}
+          {{ $t(localeKey.rankingSystem(rankingSystem)) }}
         </a>
       </template>
     </div>

diff --git a/src/components/app/navbar/index.vue b/src/components/app/navbar/index.vue
@@ -154,21 +154,21 @@ function clearFocus() {
               <li>
                 <nuxt-link-locale :to="{ name: 'auth-logout' }" @click="clearFocus">
                   <icon name="majesticons:logout-half-circle-line" class="w-5 h-5" size="100%" />
-                  {{ t('global.logout') }}
+                  {{ $t('global.logout') }}
                 </nuxt-link-locale>
               </li>
             </template>
             <template v-else>
               <li>
                 <nuxt-link-locale :to="{ name: 'auth-login' }" @click="clearFocus">
                   <icon name="majesticons:login-half-circle-line" class="w-5 h-5" size="100%" />
-                  {{ t('global.login') }}
+                  {{ $t('global.login') }}
                 </nuxt-link-locale>
               </li>
               <li>
                 <nuxt-link-locale :to="{ name: 'auth-register' }" @click="clearFocus">
                   <icon name="mingcute:signature-fill" class="w-5 h-5" size="100%" />
-                  {{ t('global.register') }}
+                  {{ $t('global.register') }}
                 </nuxt-link-locale>
               </li>
             </template>

diff --git a/src/components/app/score-list-item.vue b/src/components/app/score-list-item.vue
@@ -152,7 +152,7 @@ zh-CN:
               <div class="font-bold font-mono">
                 {{ score.pp.toFixed(2) }}
               </div>
-              <span class="font-light">{{ t('global.pp') }}</span>
+              <span class="font-light">{{ $t('global.pp') }}</span>
             </template>
             <template v-else-if="(leaderboardScoreRankingSystems).includes(props.rankingSystem as LeaderboardScoreRankingSystem)">
               <div class="font-bold font-mono">
@@ -184,7 +184,7 @@ zh-CN:
             <span class="flex">
               <b class="font-mono">{{ score.accuracy.toFixed(2) }}</b>
               <div class="text-light">
-                % {{ t('global.acc') }}
+                % {{ $t('global.acc') }}
               </div>
             </span>
           </div>

diff --git a/src/components/app/score/heading.vue b/src/components/app/score/heading.vue
@@ -16,7 +16,7 @@ defineProps<{
 const { hasRankingSystem, hasRuleset } = useAdapterConfig()
 
 const scoreFmt = createScoreFormatter({ notation: undefined })
-const { t, locale } = useI18n()
+const { locale } = useI18n()
 </script>
 
 <i18n lang="yaml">
@@ -93,7 +93,7 @@ zh-CN:
       </template>
       <template v-else-if="rankingSystem === Rank.PPv2 && hasRuleset(score.mode, score.ruleset) && hasRankingSystem(score.mode, score.ruleset, Rank.PPv2)">
         <span class="text-5xl">{{ scoreFmt(score[Rank.PPv2].pp) }}</span>
-        <span class="text-3xl">{{ t('global.pp') }}</span>
+        <span class="text-3xl">{{ $t('global.pp') }}</span>
       </template>
     </div>
     <div class="p-8 text-8xl">

diff --git a/src/components/app/scores/ranking-system-switcher.vue b/src/components/app/scores/ranking-system-switcher.vue
@@ -12,7 +12,7 @@ const emit = defineEmits<{
 }>()
 
 const { hasRankingSystem, hasRuleset, supportedRankingSystems: rankingSystems } = useAdapterConfig()
-const { t } = useI18n()
+useI18n()
 
 const show = computed(() =>
   rankingSystems.filter(
@@ -41,7 +41,7 @@ watch([() => props.mode, () => props.ruleset], () => {
       :value="rs"
       class="[--tab-border-color:transparent]"
     >
-      {{ t(localeKey.rankingSystem(rs)) }}
+      {{ $t(localeKey.rankingSystem(rs)) }}
     </t-tab>
   </t-tabs>
 </template>
diff --git a/src/components/app/scores/table.vue b/src/components/app/scores/table.vue
@@ -32,20 +32,20 @@ zh-CN:
   <table class="table table-compact table-zebra">
     <thead>
       <tr>
-        <th>{{ t('global.player') }}</th>
+        <th>{{ $t('global.player') }}</th>
         <th class="text-right">
-          {{ t('global.rank') }}
+          {{ $t('global.rank') }}
         </th>
         <th class="text-right">
-          {{ t('global.mods') }}
+          {{ $t('global.mods') }}
         </th>
         <th class="text-right">
-          {{ t(localeKey.rankingSystem(Rank.Score)) }}
+          {{ $t(localeKey.rankingSystem(Rank.Score)) }}
         </th>
         <th v-if="rankingSystem !== Rank.Score" class="text-right">
-          {{ t(localeKey.rankingSystem(rankingSystem)) }}
+          {{ $t(localeKey.rankingSystem(rankingSystem)) }}
         </th>
-        <th>{{ t('global.played-at') }}</th>
+        <th>{{ $t('global.played-at') }}</th>
         <!-- <th class="text-center">
           Actions
         </th> -->

diff --git a/src/components/app/search-modal.client.vue b/src/components/app/search-modal.client.vue
@@ -154,7 +154,7 @@ const {
           v-if="Array.isArray(beatmapsets) && beatmapsets.length"
         >
           <div class="divider font-bold">
-            <span v-if="loading.beatmapsets" class="loading loading-spinner loading-lg" /> {{ t('global.beatmapsets') }}
+            <span v-if="loading.beatmapsets" class="loading loading-spinner loading-lg" /> {{ $t('global.beatmapsets') }}
           </div>
           <transition-group tag="ul" class="menu" name="left">
             <li
@@ -186,7 +186,7 @@ const {
         </template>
         <template v-if="Array.isArray(beatmaps) && beatmaps.length">
           <div class="divider font-bold">
-            <span v-if="loading.beatmaps" class="loading loading-spinner loading-lg" /> {{ t('global.beatmaps') }}
+            <span v-if="loading.beatmaps" class="loading loading-spinner loading-lg" /> {{ $t('global.beatmaps') }}
           </div>
           <transition-group tag="ul" class="menu truncate" name="left">
             <li
@@ -217,7 +217,7 @@ const {
         </template>
         <template v-if="Array.isArray(users) && users.length">
           <div class="divider font-bold">
-            <span v-if="loading.users" class="loading loading-spinner loading-lg" /> {{ t('global.users') }}
+            <span v-if="loading.users" class="loading loading-spinner loading-lg" /> {{ $t('global.users') }}
           </div>
           <transition-group tag="ul" class="menu" name="left">
             <li

diff --git a/src/components/userpage/heading.vue b/src/components/userpage/heading.vue
@@ -119,7 +119,7 @@ zh-CN:
         <p class="flex gap-1">
           <span v-if="page.user.roles.includes(UserPrivilege.Verified)" class="flex items-center gap-1">
             <icon name="ic:round-verified" class="w-5 h-5" />
-            {{ t(localeKey.priv(UserPrivilege.Verified)) }}
+            {{ $t(localeKey.priv(UserPrivilege.Verified)) }}
           </span>
           <span v-if="page.user.roles.includes(UserPrivilege.Staff)" class="flex items-center gap-1">
             <icon name="healthicons:social-work" class="w-5 h-5" />

diff --git a/src/components/userpage/ranking-system-switcher.vue b/src/components/userpage/ranking-system-switcher.vue
@@ -67,7 +67,7 @@ zh-CN:
         class="f-tab"
         :value="key"
       >
-        {{ t(localeKey.rankingSystem(key)) }}
+        {{ $t(localeKey.rankingSystem(key)) }}
       </t-tab>
 
       <div
@@ -88,7 +88,7 @@ zh-CN:
           >
             <li v-for="(_stats, key) of dropdown" :key="`user-tab-${key}`">
               <a class="z-50" @click="select(key)">{{
-                t(localeKey.rankingSystem(key))
+                $t(localeKey.rankingSystem(key))
               }}</a>
             </li>
           </ul>

diff --git a/src/composables/useSearchablePages.tsx b/src/composables/useSearchablePages.tsx
@@ -22,15 +22,15 @@ export const pages: {
   show?(keyword: string): boolean
 }[] = [
   {
-    render: () => <><icon name="majesticons:login-half-circle-line" class="w-5 h-5" size="100%" />{ useI18n().t('global.login') }</>,
+    render: () => <><icon name="majesticons:login-half-circle-line" class="w-5 h-5" size="100%" />{ useI18n({ useScope: 'global' }).t('global.login') }</>,
     route: {
       name: 'auth-login',
     },
     keyword: ['login', 'sign in'],
     show: notLoggedIn,
   },
   {
-    render: () => <><icon name="mingcute:signature-fill" class="w-5 h-5" size="100%" />{ useI18n().t('global.register') }</>,
+    render: () => <><icon name="mingcute:signature-fill" class="w-5 h-5" size="100%" />{ useI18n({ useScope: 'global' }).t('global.register') }</>,
     route: {
       name: 'auth-register',
     },
@@ -39,7 +39,7 @@ export const pages: {
   },
 
   {
-    render: () => <><icon name="material-symbols:admin-panel-settings-rounded" class="w-5 h-5" size="100%" />{ useI18n().t('titles.admin-panel') }</>,
+    render: () => <><icon name="material-symbols:admin-panel-settings-rounded" class="w-5 h-5" size="100%" />{ useI18n({ useScope: 'global' }).t('titles.admin-panel') }</>,
     route: {
       name: 'admin',
     },
@@ -55,23 +55,23 @@ export const pages: {
   //   show: admin,
   // },
   {
-    render: () => <><icon name="tabler:circles-relation" class="w-5 h-5" size="100%" />{ useI18n().t('titles.relations') }</>,
+    render: () => <><icon name="tabler:circles-relation" class="w-5 h-5" size="100%" />{ useI18n({ useScope: 'global' }).t('titles.relations') }</>,
     route: {
       name: 'me-relations',
     },
     keyword: ['settings', 'friends', 'blocks', 'relationship', 'revoke'],
     show: loggedIn,
   },
   {
-    render: () => <><icon name="solar:settings-bold" class="w-5 h-5" size="100%" />{ useI18n().t('titles.settings') }</>,
+    render: () => <><icon name="solar:settings-bold" class="w-5 h-5" size="100%" />{ useI18n({ useScope: 'global' }).t('titles.settings') }</>,
     route: {
       name: 'me-settings',
     },
     keyword: ['settings', 'preference', 'profile', 'edit', 'change'],
     show: loggedIn,
   },
   {
-    render: () => <><icon name="majesticons:logout-half-circle-line" class="w-5 h-5" size="100%" />{ useI18n().t('global.logout') }</>,
+    render: () => <><icon name="majesticons:logout-half-circle-line" class="w-5 h-5" size="100%" />{ useI18n({ useScope: 'global' }).t('global.logout') }</>,
     route: {
       name: 'auth-logout',
     },

diff --git a/src/pages/article/edit.vue b/src/pages/article/edit.vue
@@ -7,7 +7,7 @@ import type { ArticleProvider } from '$base/server'
 definePageMeta({
   middleware: ['auth', 'admin'],
 })
-const app$ = useNuxtApp()
+const app = useNuxtApp()
 const { t } = useI18n()
 const importArticleFile = shallowRef<HTMLInputElement | null>(null)
 const editor = shallowRef<InstanceType<typeof ContentEditor> | null>(null)
@@ -32,21 +32,21 @@ const access = shallowRef<Record<'write' | 'read', boolean>>()
 
 const { data: content, refresh: refreshContent } = await useAsyncData(async () => {
   if (article.value.slug) {
-    return app$.$client.article.get.query(article.value.slug)
+    return app.$client.article.get.query(article.value.slug)
   }
   return undefined
 })
 
-const { data: articles, refresh: refreshTree } = app$.$client.article.localSlugs.useQuery()
+const { data: articles, refresh: refreshTree } = app.$client.article.localSlugs.useQuery()
 
 const privileges: Record<ArticleProvider.TWriteAccess, string> = {
-  staff: t(localeKey.priv(UserPrivilege.Staff)),
-  moderator: t(localeKey.priv(UserPrivilege.Moderator)),
-  beatmapNominator: t(localeKey.priv(UserPrivilege.BeatmapNominator)),
+  staff: app.$i18n.t(localeKey.priv(UserPrivilege.Staff)),
+  moderator: app.$i18n.t(localeKey.priv(UserPrivilege.Moderator)),
+  beatmapNominator: app.$i18n.t(localeKey.priv(UserPrivilege.BeatmapNominator)),
 }
 const readPrivileges: Record<ArticleProvider.TReadAccess, string> = {
   ...privileges,
-  [Scope.Public]: t(localeKey.scope(Scope.Public)),
+  [Scope.Public]: app.$i18n.t(localeKey.scope(Scope.Public)),
 }
 
 // Helper function to convert privilege object to select options
@@ -118,7 +118,7 @@ async function save() {
     return
   }
 
-  await app$.$client.article.save.mutate(article.value as Required<typeof article['value']>)
+  await app.$client.article.save.mutate(article.value as Required<typeof article['value']>)
 }
 
 // Delete article from server
@@ -133,7 +133,7 @@ async function del() {
     return
   }
 
-  await app$.$client.article.delete.mutate({
+  await app.$client.article.delete.mutate({
     slug: article.value.slug,
   })
 }

diff --git a/src/pages/auth/login.vue b/src/pages/auth/login.vue
@@ -11,10 +11,10 @@ if (session.loggedIn) {
 
 const route = useRoute()
 const config = useAppConfig()
-
+const app = useNuxtApp()
 const { t } = useI18n()
 useHead({
-  titleTemplate: `${t('global.login')} - ${config.title}`,
+  titleTemplate: `${app.$i18n.t('global.login')} - ${config.title}`,
 })
 
 definePageMeta({
@@ -87,7 +87,7 @@ zh-CN:
         <h2
           class="text-2xl pl-2 text-gbase-800 dark:text-gbase-50"
         >
-          {{ t('global.login') }}
+          {{ $t('global.login') }}
         </h2>
       </div>
       <form
@@ -132,13 +132,13 @@ zh-CN:
           <t-nuxt-link-locale-button
             to="/auth/register"
             variant="accent"
-            @mouseenter="registerButton = t('global.register')"
+            @mouseenter="registerButton = $t('global.register')"
             @mouseleave="registerButton = t('have-no-account')"
           >
             {{ registerButton }}
           </t-nuxt-link-locale-button>
           <button type="submit" class="btn btn-primary">
-            {{ t('global.login') }}
+            {{ $t('global.login') }}
           </button>
         </div>
       </form>

diff --git a/src/pages/auth/register.vue b/src/pages/auth/register.vue
@@ -59,7 +59,7 @@ const validate: {
 }
 
 useHead({
-  titleTemplate: `${t('global.register')} - ${config.title}`,
+  titleTemplate: `${app.$i18n.t('global.register')} - ${config.title}`,
 })
 definePageMeta({
   layout: 'hero',
@@ -142,7 +142,7 @@ zh-CN:
         <h2
           class="text-2xl pl-3 text-gbase-800 dark:text-gbase-50"
         >
-          {{ t('global.register') }}
+          {{ $t('global.register') }}
         </h2>
       </div>
       <form
@@ -238,13 +238,13 @@ zh-CN:
           <t-nuxt-link-locale-button
             :to="{ name: 'auth-login' }"
             variant="secondary"
-            @mouseenter="loginButton = t('global.login')"
+            @mouseenter="loginButton = $t('global.login')"
             @mouseleave="loginButton = t('have-account')"
           >
             {{ loginButton }}
           </t-nuxt-link-locale-button>
           <button type="submit" class="btn btn-primary">
-            {{ t('global.register') }}
+            {{ $t('global.register') }}
           </button>
         </div>
       </form>

diff --git a/src/pages/index.vue b/src/pages/index.vue
@@ -48,13 +48,13 @@ zh-CN:
         </template>
         <template v-else>
           <t-nuxt-link-locale-button :to="{ name: 'auth-login' }" variant="primary">
-            {{ t('global.login') }}
+            {{ $t('global.login') }}
           </t-nuxt-link-locale-button>
           <t-nuxt-link-locale-button
             :to="{ name: 'auth-register' }"
             variant="secondary"
           >
-            {{ t('global.register') }}
+            {{ $t('global.register') }}
           </t-nuxt-link-locale-button>
         </template>
       </div>