From d4938bc28a0ad904bf38f875b57a595ed7c14c68 Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 18:14:59 +0200
Subject: [PATCH 01/13] feat: add repository and link for external translations

---
 __tests__/e2e/.vitepress/config.ts            |  8 ++++
 .../theme-default/components/VPMenuLink.vue   |  4 ++
 .../components/VPNavBarTranslations.vue       | 25 ++++++++++++-
 .../components/VPNavScreenTranslations.vue    |  2 +
 src/client/theme-default/composables/langs.ts | 37 ++++++++++++++++---
 types/shared.d.ts                             | 11 +++++-
 6 files changed, 78 insertions(+), 9 deletions(-)

diff --git a/__tests__/e2e/.vitepress/config.ts b/__tests__/e2e/.vitepress/config.ts
index 65f845ab364d..45b9b2d1480b 100644
--- a/__tests__/e2e/.vitepress/config.ts
+++ b/__tests__/e2e/.vitepress/config.ts
@@ -159,6 +159,14 @@ export default defineConfig({
       lazyLoading: true
     }
   },
+  locales: {
+    root: { label: 'English', repo: 'https://github.com/vuejs/vitepress' },
+    zh: {
+      label: '简体中文',
+      link: 'https://vitepress.dev/zh/',
+      repo: 'https://github.com/vitejs/vite'
+    }
+  },
   themeConfig: {
     nav,
     sidebar,
diff --git a/src/client/theme-default/components/VPMenuLink.vue b/src/client/theme-default/components/VPMenuLink.vue
index 52b4fac38ea0..4effdcbac8b6 100644
--- a/src/client/theme-default/components/VPMenuLink.vue
+++ b/src/client/theme-default/components/VPMenuLink.vue
@@ -8,6 +8,10 @@ defineProps<{
   item: DefaultTheme.NavItemWithLink
 }>()
 
+defineSlots<{
+  default: () => void
+}>()
+
 const { page } = useData()
 </script>
 
diff --git a/src/client/theme-default/components/VPNavBarTranslations.vue b/src/client/theme-default/components/VPNavBarTranslations.vue
index a92aad8c9a46..15e225f6dc75 100644
--- a/src/client/theme-default/components/VPNavBarTranslations.vue
+++ b/src/client/theme-default/components/VPNavBarTranslations.vue
@@ -3,9 +3,13 @@ import VPFlyout from './VPFlyout.vue'
 import VPMenuLink from './VPMenuLink.vue'
 import { useData } from '../composables/data'
 import { useLangs } from '../composables/langs'
+import VPSocialLink from "./VPSocialLink.vue";
+// import { computed } from 'vue'
 
 const { theme } = useData()
 const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
+// for helping translate
+// const repoLink = computed(() => currentLang.value.repo || (localeLinks.value.length > 1 && localeLinks.value.some(l => !!l.repo)))
 </script>
 
 <template>
@@ -16,10 +20,20 @@ const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
     :label="theme.langMenuLabel || 'Change language'"
   >
     <div class="items">
-      <p class="title">{{ currentLang.label }}</p>
+      <div v-if="currentLang.repo">
+        <div class="menu-item">
+          <p class="title">{{ currentLang.label }}</p>
+          <VPSocialLink icon="github" :link="currentLang.repo.link" :ariaLabel="currentLang.repo.title" />
+        </div>
+      </div>
+      <p v-else class="title">{{ currentLang.label }}</p>
 
       <template v-for="locale in localeLinks" :key="locale.link">
-        <VPMenuLink :item="locale" />
+        <div v-if="locale.repo" class="menu-item">
+          <VPMenuLink :item="locale" />
+          <VPSocialLink icon="github" :link="locale.repo.link" :ariaLabel="locale.repo.title" />
+        </div>
+        <VPMenuLink v-else :item="locale" />
       </template>
     </div>
   </VPFlyout>
@@ -30,6 +44,13 @@ const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
   display: none;
 }
 
+.menu-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  position: relative;
+}
+
 @media (min-width: 1280px) {
   .VPNavBarTranslations {
     display: flex;
diff --git a/src/client/theme-default/components/VPNavScreenTranslations.vue b/src/client/theme-default/components/VPNavScreenTranslations.vue
index a67ffa96f68e..a0b6261a9f3e 100644
--- a/src/client/theme-default/components/VPNavScreenTranslations.vue
+++ b/src/client/theme-default/components/VPNavScreenTranslations.vue
@@ -5,6 +5,8 @@ import VPLink from './VPLink.vue'
 
 const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
 const isOpen = ref(false)
+// for helping translate
+// const repoLink = computed(() => currentLang.value.repo || (localeLinks.value.length > 1 && localeLinks.value.some(l => !!l.repo)))
 
 function toggle() {
   isOpen.value = !isOpen.value
diff --git a/src/client/theme-default/composables/langs.ts b/src/client/theme-default/composables/langs.ts
index 7d5a2e4c8238..1d183636aeb2 100644
--- a/src/client/theme-default/composables/langs.ts
+++ b/src/client/theme-default/composables/langs.ts
@@ -4,12 +4,25 @@ import { useData } from './data'
 
 export function useLangs({ correspondingLink = false } = {}) {
   const { site, localeIndex, page, theme, hash } = useData()
-  const currentLang = computed(() => ({
-    label: site.value.locales[localeIndex.value]?.label,
-    link:
-      site.value.locales[localeIndex.value]?.link ||
-      (localeIndex.value === 'root' ? '/' : `/${localeIndex.value}/`)
-  }))
+  const currentLang = computed(() => {
+    const lang = site.value.locales[localeIndex.value]
+    return {
+      label: lang?.label,
+      link:
+        lang?.link || localeIndex.value === 'root'
+          ? '/'
+          : `/${localeIndex.value}/`,
+      repo: lang?.repo
+        ? {
+            link: typeof lang.repo === 'string' ? lang.repo : lang.repo.link,
+            title:
+              typeof lang.repo === 'string'
+                ? `${lang.label} repository`
+                : lang.repo.title
+          }
+        : undefined
+    }
+  })
 
   const localeLinks = computed(() =>
     Object.entries(site.value.locales).flatMap(([key, value]) =>
@@ -17,6 +30,18 @@ export function useLangs({ correspondingLink = false } = {}) {
         ? []
         : {
             text: value.label,
+            repo: value.repo
+              ? {
+                  link:
+                    typeof value.repo === 'string'
+                      ? value.repo
+                      : value.repo.link,
+                  title:
+                    typeof value.repo === 'string'
+                      ? `${value.label} repository`
+                      : value.repo.title
+                }
+              : undefined,
             link:
               normalizeLink(
                 value.link || (key === 'root' ? '/' : `/${key}/`),
diff --git a/types/shared.d.ts b/types/shared.d.ts
index 0ea216538a73..d3e31ec82e47 100644
--- a/types/shared.d.ts
+++ b/types/shared.d.ts
@@ -161,7 +161,16 @@ export interface LocaleSpecificConfig<ThemeConfig = any> {
 
 export type LocaleConfig<ThemeConfig = any> = Record<
   string,
-  LocaleSpecificConfig<ThemeConfig> & { label: string; link?: string }
+  LocaleSpecificConfig<ThemeConfig> & {
+    label: string
+    link?: string
+    repo?:
+      | string
+      | {
+          link: string
+          title: string
+        }
+  }
 >
 
 // Manually declaring all properties as rollup-plugin-dts

From 688483790798548c974c3526cb771b6b00f0f5ba Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 21:50:24 +0200
Subject: [PATCH 02/13] chore: cleanup nav bar translation style

---
 src/client/theme-default/components/VPNavBarTranslations.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/client/theme-default/components/VPNavBarTranslations.vue b/src/client/theme-default/components/VPNavBarTranslations.vue
index 15e225f6dc75..8dba1128d731 100644
--- a/src/client/theme-default/components/VPNavBarTranslations.vue
+++ b/src/client/theme-default/components/VPNavBarTranslations.vue
@@ -48,7 +48,6 @@ const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
   display: flex;
   align-items: center;
   justify-content: space-between;
-  position: relative;
 }
 
 @media (min-width: 1280px) {

From 5c82a01203dea3fc73eb8abbd0285548d3097c94 Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 21:50:48 +0200
Subject: [PATCH 03/13] chore: include logic for mobile

---
 .../components/VPNavScreenTranslations.vue    | 53 +++++++++++++++----
 1 file changed, 43 insertions(+), 10 deletions(-)

diff --git a/src/client/theme-default/components/VPNavScreenTranslations.vue b/src/client/theme-default/components/VPNavScreenTranslations.vue
index a0b6261a9f3e..11581a859945 100644
--- a/src/client/theme-default/components/VPNavScreenTranslations.vue
+++ b/src/client/theme-default/components/VPNavScreenTranslations.vue
@@ -1,12 +1,12 @@
 <script setup lang="ts">
-import { ref } from 'vue'
+import { computed, ref } from 'vue'
 import { useLangs } from '../composables/langs'
 import VPLink from './VPLink.vue'
+import VPSocialLink from "./VPSocialLink.vue";
 
 const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
 const isOpen = ref(false)
-// for helping translate
-// const repoLink = computed(() => currentLang.value.repo || (localeLinks.value.length > 1 && localeLinks.value.some(l => !!l.repo)))
+const repo = computed(() => !!currentLang.value.repo || (localeLinks.value.length > 1 && localeLinks.value.some(l => !!l.repo)))
 
 function toggle() {
   isOpen.value = !isOpen.value
@@ -17,17 +17,26 @@ function toggle() {
   <div
     v-if="localeLinks.length && currentLang.label"
     class="VPNavScreenTranslations"
-    :class="{ open: isOpen }"
+    :class="{ open: isOpen, repo }"
   >
-    <button class="title" @click="toggle">
-      <span class="vpi-languages icon lang" />
-      {{ currentLang.label }}
-      <span class="vpi-chevron-down icon chevron" />
+    <button class="title" :class="{ repo: !!currentLang.repo }" @click="toggle">
+      <span v-if="currentLang.repo" class="repo">
+        <span class="vpi-languages icon lang" />
+        <span>{{ currentLang.label }}</span>
+        <span class="vpi-chevron-down icon chevron" />
+      </span>
+      <template v-else>
+        <span class="vpi-languages icon lang" />
+        <span>{{ currentLang.label }}</span>
+        <span class="vpi-chevron-down icon chevron" />
+      </template>
+      <VPSocialLink v-if="currentLang.repo" icon="github" :link="currentLang.repo.link" :ariaLabel="currentLang.repo.title" />
     </button>
 
     <ul class="list">
-      <li v-for="locale in localeLinks" :key="locale.link" class="item">
+      <li v-for="locale in localeLinks" :key="locale.link" :class="{ repo: !!locale.repo }" class="item">
         <VPLink class="link" :href="locale.link">{{ locale.text }}</VPLink>
+        <VPSocialLink v-if="locale.repo" icon="github" :link="locale.repo.link" :ariaLabel="locale.repo.title" />
       </li>
     </ul>
   </div>
@@ -39,16 +48,34 @@ function toggle() {
   overflow: hidden;
 }
 
+.VPNavScreenTranslations.repo {
+  height: 40px;
+}
+
 .VPNavScreenTranslations.open {
   height: auto;
 }
 
-.title {
+.title, .title.repo .repo {
   display: flex;
   align-items: center;
   font-size: 14px;
   font-weight: 500;
   color: var(--vp-c-text-1);
+
+}
+
+.VPNavScreenTranslations .title .vpi-chevron-down {
+  transition: transform 0.25s;
+  transform: rotate(90deg);
+}
+.VPNavScreenTranslations.open .title .vpi-chevron-down {
+  transform: rotate(-90deg);
+}
+
+.title.repo {
+  width: 100%;
+  justify-content: space-between;
 }
 
 .icon {
@@ -67,6 +94,12 @@ function toggle() {
   padding: 4px 0 0 24px;
 }
 
+.list .item.repo {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
 .link {
   line-height: 32px;
   font-size: 13px;

From dfeeb430c7474f3b491c6f5dd2fecbc1a469f044 Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 22:05:24 +0200
Subject: [PATCH 04/13] chore: cleanup menu link

---
 src/client/theme-default/components/VPMenuLink.vue | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/client/theme-default/components/VPMenuLink.vue b/src/client/theme-default/components/VPMenuLink.vue
index 4effdcbac8b6..52b4fac38ea0 100644
--- a/src/client/theme-default/components/VPMenuLink.vue
+++ b/src/client/theme-default/components/VPMenuLink.vue
@@ -8,10 +8,6 @@ defineProps<{
   item: DefaultTheme.NavItemWithLink
 }>()
 
-defineSlots<{
-  default: () => void
-}>()
-
 const { page } = useData()
 </script>
 

From 2ab1ff5fd1c129b9afa482b70d168e9816059d9b Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 22:05:45 +0200
Subject: [PATCH 05/13] chore: cleanup nav bar translations

---
 src/client/theme-default/components/VPNavBarTranslations.vue | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/client/theme-default/components/VPNavBarTranslations.vue b/src/client/theme-default/components/VPNavBarTranslations.vue
index 8dba1128d731..9df68e649708 100644
--- a/src/client/theme-default/components/VPNavBarTranslations.vue
+++ b/src/client/theme-default/components/VPNavBarTranslations.vue
@@ -4,12 +4,9 @@ import VPMenuLink from './VPMenuLink.vue'
 import { useData } from '../composables/data'
 import { useLangs } from '../composables/langs'
 import VPSocialLink from "./VPSocialLink.vue";
-// import { computed } from 'vue'
 
 const { theme } = useData()
 const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
-// for helping translate
-// const repoLink = computed(() => currentLang.value.repo || (localeLinks.value.length > 1 && localeLinks.value.some(l => !!l.repo)))
 </script>
 
 <template>

From a52ca0aca5501388e6a24d347b22a5a8ce7879d0 Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 22:11:31 +0200
Subject: [PATCH 06/13] chore: include root locale link

---
 __tests__/e2e/.vitepress/config.ts | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/__tests__/e2e/.vitepress/config.ts b/__tests__/e2e/.vitepress/config.ts
index 45b9b2d1480b..9cd9164b3c92 100644
--- a/__tests__/e2e/.vitepress/config.ts
+++ b/__tests__/e2e/.vitepress/config.ts
@@ -160,7 +160,11 @@ export default defineConfig({
     }
   },
   locales: {
-    root: { label: 'English', repo: 'https://github.com/vuejs/vitepress' },
+    root: {
+      label: 'English',
+      link: 'https://vitepress.dev',
+      repo: 'https://github.com/vuejs/vitepress'
+    },
     zh: {
       label: '简体中文',
       link: 'https://vitepress.dev/zh/',

From e65610907a5e5c2251bece39fba7aa6f1b539059 Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 22:11:49 +0200
Subject: [PATCH 07/13] chore: move title button styles

---
 .../components/VPNavScreenTranslations.vue            | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/client/theme-default/components/VPNavScreenTranslations.vue b/src/client/theme-default/components/VPNavScreenTranslations.vue
index 11581a859945..0c1ed06ba948 100644
--- a/src/client/theme-default/components/VPNavScreenTranslations.vue
+++ b/src/client/theme-default/components/VPNavScreenTranslations.vue
@@ -65,6 +65,12 @@ function toggle() {
 
 }
 
+.title.repo {
+  width: 100%;
+  justify-content: space-between;
+}
+
+
 .VPNavScreenTranslations .title .vpi-chevron-down {
   transition: transform 0.25s;
   transform: rotate(90deg);
@@ -73,11 +79,6 @@ function toggle() {
   transform: rotate(-90deg);
 }
 
-.title.repo {
-  width: 100%;
-  justify-content: space-between;
-}
-
 .icon {
   font-size: 16px;
 }

From 66d7ed166918c78f602caa9e220763ac8655a5ed Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 22:30:02 +0200
Subject: [PATCH 08/13] chore: rename and remove string from locale repository
 type + update translation sfc

---
 .../components/VPNavBarTranslations.vue       | 16 ++++++++---
 .../components/VPNavScreenTranslations.vue    | 27 ++++++++++++++-----
 src/client/theme-default/composables/langs.ts | 21 +++++----------
 types/shared.d.ts                             | 14 +++++-----
 4 files changed, 47 insertions(+), 31 deletions(-)

diff --git a/src/client/theme-default/components/VPNavBarTranslations.vue b/src/client/theme-default/components/VPNavBarTranslations.vue
index 9df68e649708..59850f63b885 100644
--- a/src/client/theme-default/components/VPNavBarTranslations.vue
+++ b/src/client/theme-default/components/VPNavBarTranslations.vue
@@ -17,18 +17,26 @@ const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
     :label="theme.langMenuLabel || 'Change language'"
   >
     <div class="items">
-      <div v-if="currentLang.repo">
+      <div v-if="currentLang.repository">
         <div class="menu-item">
           <p class="title">{{ currentLang.label }}</p>
-          <VPSocialLink icon="github" :link="currentLang.repo.link" :ariaLabel="currentLang.repo.title" />
+          <VPSocialLink
+            icon="github"
+            :link="currentLang.repository.link"
+            :ariaLabel="currentLang.repository.title"
+          />
         </div>
       </div>
       <p v-else class="title">{{ currentLang.label }}</p>
 
       <template v-for="locale in localeLinks" :key="locale.link">
-        <div v-if="locale.repo" class="menu-item">
+        <div v-if="locale.repository" class="menu-item">
           <VPMenuLink :item="locale" />
-          <VPSocialLink icon="github" :link="locale.repo.link" :ariaLabel="locale.repo.title" />
+          <VPSocialLink
+            icon="github"
+            :link="locale.repository.link"
+            :ariaLabel="locale.repository.title"
+          />
         </div>
         <VPMenuLink v-else :item="locale" />
       </template>
diff --git a/src/client/theme-default/components/VPNavScreenTranslations.vue b/src/client/theme-default/components/VPNavScreenTranslations.vue
index 0c1ed06ba948..574190b8f0fb 100644
--- a/src/client/theme-default/components/VPNavScreenTranslations.vue
+++ b/src/client/theme-default/components/VPNavScreenTranslations.vue
@@ -6,7 +6,7 @@ import VPSocialLink from "./VPSocialLink.vue";
 
 const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
 const isOpen = ref(false)
-const repo = computed(() => !!currentLang.value.repo || (localeLinks.value.length > 1 && localeLinks.value.some(l => !!l.repo)))
+const repo = computed(() => !!currentLang.value.repository || (localeLinks.value.length > 1 && localeLinks.value.some(l => !!l.repository)))
 
 function toggle() {
   isOpen.value = !isOpen.value
@@ -19,8 +19,8 @@ function toggle() {
     class="VPNavScreenTranslations"
     :class="{ open: isOpen, repo }"
   >
-    <button class="title" :class="{ repo: !!currentLang.repo }" @click="toggle">
-      <span v-if="currentLang.repo" class="repo">
+    <button class="title" :class="{ repo: !!currentLang.repository }" @click="toggle">
+      <span v-if="currentLang.repository" class="repo">
         <span class="vpi-languages icon lang" />
         <span>{{ currentLang.label }}</span>
         <span class="vpi-chevron-down icon chevron" />
@@ -30,13 +30,28 @@ function toggle() {
         <span>{{ currentLang.label }}</span>
         <span class="vpi-chevron-down icon chevron" />
       </template>
-      <VPSocialLink v-if="currentLang.repo" icon="github" :link="currentLang.repo.link" :ariaLabel="currentLang.repo.title" />
+      <VPSocialLink
+        v-if="currentLang.repository"
+        icon="github"
+        :link="currentLang.repository.link"
+        :ariaLabel="currentLang.repository.title"
+      />
     </button>
 
     <ul class="list">
-      <li v-for="locale in localeLinks" :key="locale.link" :class="{ repo: !!locale.repo }" class="item">
+      <li
+        v-for="locale in localeLinks"
+        :key="locale.link"
+        :class="{ repo: !!locale.repository }"
+        class="item"
+      >
         <VPLink class="link" :href="locale.link">{{ locale.text }}</VPLink>
-        <VPSocialLink v-if="locale.repo" icon="github" :link="locale.repo.link" :ariaLabel="locale.repo.title" />
+        <VPSocialLink
+          v-if="locale.repository"
+          icon="github"
+          :link="locale.repository.link"
+          :ariaLabel="locale.repository.title"
+        />
       </li>
     </ul>
   </div>
diff --git a/src/client/theme-default/composables/langs.ts b/src/client/theme-default/composables/langs.ts
index 1d183636aeb2..18d3e88bae8b 100644
--- a/src/client/theme-default/composables/langs.ts
+++ b/src/client/theme-default/composables/langs.ts
@@ -12,13 +12,10 @@ export function useLangs({ correspondingLink = false } = {}) {
         lang?.link || localeIndex.value === 'root'
           ? '/'
           : `/${localeIndex.value}/`,
-      repo: lang?.repo
+      repository: lang?.repository
         ? {
-            link: typeof lang.repo === 'string' ? lang.repo : lang.repo.link,
-            title:
-              typeof lang.repo === 'string'
-                ? `${lang.label} repository`
-                : lang.repo.title
+            link: lang.repository.link,
+            title: lang.repository.title
           }
         : undefined
     }
@@ -30,16 +27,10 @@ export function useLangs({ correspondingLink = false } = {}) {
         ? []
         : {
             text: value.label,
-            repo: value.repo
+            repository: value.repository
               ? {
-                  link:
-                    typeof value.repo === 'string'
-                      ? value.repo
-                      : value.repo.link,
-                  title:
-                    typeof value.repo === 'string'
-                      ? `${value.label} repository`
-                      : value.repo.title
+                  link: value.repository.link,
+                  title: value.repository.title
                 }
               : undefined,
             link:
diff --git a/types/shared.d.ts b/types/shared.d.ts
index d3e31ec82e47..09449edd1867 100644
--- a/types/shared.d.ts
+++ b/types/shared.d.ts
@@ -164,12 +164,14 @@ export type LocaleConfig<ThemeConfig = any> = Record<
   LocaleSpecificConfig<ThemeConfig> & {
     label: string
     link?: string
-    repo?:
-      | string
-      | {
-          link: string
-          title: string
-        }
+    repository?: {
+      link: string
+      title: string
+      help?: {
+        link: string
+        text: string
+      }
+    }
   }
 >
 

From 4a88eb5f526718ce4b68b9ee4005b632568bcc10 Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 22:32:45 +0200
Subject: [PATCH 09/13] chore: update e2e locales entry

---
 __tests__/e2e/.vitepress/config.ts | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/__tests__/e2e/.vitepress/config.ts b/__tests__/e2e/.vitepress/config.ts
index 9cd9164b3c92..85f5db109be9 100644
--- a/__tests__/e2e/.vitepress/config.ts
+++ b/__tests__/e2e/.vitepress/config.ts
@@ -163,12 +163,18 @@ export default defineConfig({
     root: {
       label: 'English',
       link: 'https://vitepress.dev',
-      repo: 'https://github.com/vuejs/vitepress'
+      repository: {
+        link: 'https://github.com/vuejs/vitepress',
+        title: 'English Repository'
+      }
     },
     zh: {
       label: '简体中文',
       link: 'https://vitepress.dev/zh/',
-      repo: 'https://github.com/vitejs/vite'
+      repository: {
+        link: 'https://github.com/vitejs/vite',
+        title: '中文存储库'
+      }
     }
   },
   themeConfig: {

From ea7928992b9499767441602e8d5a407875b2c697 Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 22:33:22 +0200
Subject: [PATCH 10/13] chore: .

---
 __tests__/e2e/.vitepress/config.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/__tests__/e2e/.vitepress/config.ts b/__tests__/e2e/.vitepress/config.ts
index 85f5db109be9..3745df897de0 100644
--- a/__tests__/e2e/.vitepress/config.ts
+++ b/__tests__/e2e/.vitepress/config.ts
@@ -172,6 +172,7 @@ export default defineConfig({
       label: '简体中文',
       link: 'https://vitepress.dev/zh/',
       repository: {
+        // for testing purposes
         link: 'https://github.com/vitejs/vite',
         title: '中文存储库'
       }

From 8588b7ab4e8c1092f59db48594eaac9e8dfee723 Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 23:45:32 +0200
Subject: [PATCH 11/13] chore: add `gitlab` and `bitbacket` to social icons

---
 __tests__/e2e/.vitepress/config.ts               | 11 +++++++++++
 .../components/VPNavBarTranslations.vue          |  4 ++--
 .../components/VPNavScreenTranslations.vue       |  4 ++--
 src/client/theme-default/composables/langs.ts    | 16 +++-------------
 src/client/theme-default/styles/icons.css        |  8 ++++++++
 types/default-theme.d.ts                         |  2 ++
 types/shared.d.ts                                |  4 ++++
 7 files changed, 32 insertions(+), 17 deletions(-)

diff --git a/__tests__/e2e/.vitepress/config.ts b/__tests__/e2e/.vitepress/config.ts
index 3745df897de0..3989835956db 100644
--- a/__tests__/e2e/.vitepress/config.ts
+++ b/__tests__/e2e/.vitepress/config.ts
@@ -168,12 +168,23 @@ export default defineConfig({
         title: 'English Repository'
       }
     },
+    es: {
+      label: 'Español',
+      link: 'https://vitepress.dev/es/',
+      repository: {
+        // for testing purposes
+        link: 'https://github.com/vuejs/core',
+        icon: 'gitlab',
+        title: 'Repositorio en Español'
+      }
+    },
     zh: {
       label: '简体中文',
       link: 'https://vitepress.dev/zh/',
       repository: {
         // for testing purposes
         link: 'https://github.com/vitejs/vite',
+        icon: 'bitbucket',
         title: '中文存储库'
       }
     }
diff --git a/src/client/theme-default/components/VPNavBarTranslations.vue b/src/client/theme-default/components/VPNavBarTranslations.vue
index 59850f63b885..4d997ee15b2a 100644
--- a/src/client/theme-default/components/VPNavBarTranslations.vue
+++ b/src/client/theme-default/components/VPNavBarTranslations.vue
@@ -21,7 +21,7 @@ const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
         <div class="menu-item">
           <p class="title">{{ currentLang.label }}</p>
           <VPSocialLink
-            icon="github"
+            :icon="currentLang.repository.icon ?? 'github'"
             :link="currentLang.repository.link"
             :ariaLabel="currentLang.repository.title"
           />
@@ -33,7 +33,7 @@ const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
         <div v-if="locale.repository" class="menu-item">
           <VPMenuLink :item="locale" />
           <VPSocialLink
-            icon="github"
+            :icon="locale.repository.icon ?? 'github'"
             :link="locale.repository.link"
             :ariaLabel="locale.repository.title"
           />
diff --git a/src/client/theme-default/components/VPNavScreenTranslations.vue b/src/client/theme-default/components/VPNavScreenTranslations.vue
index 574190b8f0fb..23944b33446b 100644
--- a/src/client/theme-default/components/VPNavScreenTranslations.vue
+++ b/src/client/theme-default/components/VPNavScreenTranslations.vue
@@ -32,7 +32,7 @@ function toggle() {
       </template>
       <VPSocialLink
         v-if="currentLang.repository"
-        icon="github"
+        :icon="currentLang.repository.icon ?? 'github'"
         :link="currentLang.repository.link"
         :ariaLabel="currentLang.repository.title"
       />
@@ -48,7 +48,7 @@ function toggle() {
         <VPLink class="link" :href="locale.link">{{ locale.text }}</VPLink>
         <VPSocialLink
           v-if="locale.repository"
-          icon="github"
+          :icon="locale.repository.icon ?? 'github'"
           :link="locale.repository.link"
           :ariaLabel="locale.repository.title"
         />
diff --git a/src/client/theme-default/composables/langs.ts b/src/client/theme-default/composables/langs.ts
index 18d3e88bae8b..7996e10742f4 100644
--- a/src/client/theme-default/composables/langs.ts
+++ b/src/client/theme-default/composables/langs.ts
@@ -8,16 +8,11 @@ export function useLangs({ correspondingLink = false } = {}) {
     const lang = site.value.locales[localeIndex.value]
     return {
       label: lang?.label,
+      repository: lang?.repository,
       link:
         lang?.link || localeIndex.value === 'root'
           ? '/'
-          : `/${localeIndex.value}/`,
-      repository: lang?.repository
-        ? {
-            link: lang.repository.link,
-            title: lang.repository.title
-          }
-        : undefined
+          : `/${localeIndex.value}/`
     }
   })
 
@@ -27,12 +22,7 @@ export function useLangs({ correspondingLink = false } = {}) {
         ? []
         : {
             text: value.label,
-            repository: value.repository
-              ? {
-                  link: value.repository.link,
-                  title: value.repository.title
-                }
-              : undefined,
+            repository: value.repository,
             link:
               normalizeLink(
                 value.link || (key === 'root' ? '/' : `/${key}/`),
diff --git a/src/client/theme-default/styles/icons.css b/src/client/theme-default/styles/icons.css
index b5612d1f8192..a8a789a14a77 100644
--- a/src/client/theme-default/styles/icons.css
+++ b/src/client/theme-default/styles/icons.css
@@ -121,3 +121,11 @@
 .vpi-social-youtube {
   --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z'/%3E%3C/svg%3E");
 }
+/* gitlab: under MIT from https://icon-sets.iconify.design/akar-icons/gitlab-fill/ */
+.vpi-repo-gitlab {
+  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m22.749 9.769l-.031-.08l-3.027-7.9a.79.79 0 0 0-.782-.495a.8.8 0 0 0-.456.17a.8.8 0 0 0-.268.408L16.14 8.125H7.865L5.822 1.872a.8.8 0 0 0-.269-.409a.81.81 0 0 0-.926-.05c-.14.09-.25.22-.312.376L1.283 9.684l-.03.08a5.62 5.62 0 0 0 1.864 6.496l.01.008l.028.02l4.61 3.453l2.282 1.726l1.39 1.049a.935.935 0 0 0 1.13 0l1.389-1.05l2.281-1.726l4.639-3.473l.011-.01A5.62 5.62 0 0 0 22.75 9.77'/%3E%3C/svg%3E");
+}
+/* bitbucket: under MIT from https://icon-sets.iconify.design/pajamas/bitbucket/ */
+.vpi-repo-bitbucket {
+  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' d='M1.454 1.816a.45.45 0 0 0-.345.153a.44.44 0 0 0-.103.358L2.91 13.684c.049.287.3.498.596.5h9.135a.45.45 0 0 0 .449-.37L14.994 2.33a.44.44 0 0 0-.1-.358a.45.45 0 0 0-.342-.156zm8.018 8.208H6.557l-.79-4.05h4.412z'/%3E%3C/svg%3E");
+}
diff --git a/types/default-theme.d.ts b/types/default-theme.d.ts
index 37be5babd03c..5d9268f746eb 100644
--- a/types/default-theme.d.ts
+++ b/types/default-theme.d.ts
@@ -334,9 +334,11 @@ export namespace DefaultTheme {
   }
 
   export type SocialLinkIcon =
+    | 'bitbucket'
     | 'discord'
     | 'facebook'
     | 'github'
+    | 'gitlab'
     | 'instagram'
     | 'linkedin'
     | 'mastodon'
diff --git a/types/shared.d.ts b/types/shared.d.ts
index 09449edd1867..1f4604c8ea61 100644
--- a/types/shared.d.ts
+++ b/types/shared.d.ts
@@ -159,6 +159,8 @@ export interface LocaleSpecificConfig<ThemeConfig = any> {
   themeConfig?: ThemeConfig
 }
 
+export type RepositoryLinkIcon = 'github' | 'gitlab' | 'bitbucket'
+
 export type LocaleConfig<ThemeConfig = any> = Record<
   string,
   LocaleSpecificConfig<ThemeConfig> & {
@@ -167,6 +169,8 @@ export type LocaleConfig<ThemeConfig = any> = Record<
     repository?: {
       link: string
       title: string
+      /** @default 'github' */
+      icon?: RepositoryLinkIcon
       help?: {
         link: string
         text: string

From 95900ad606ba2799b007d45185edc85f464aeffa Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Fri, 6 Sep 2024 23:51:36 +0200
Subject: [PATCH 12/13] chore: update computed repo in nv screen sfc

---
 src/client/theme-default/components/VPNavScreenTranslations.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/client/theme-default/components/VPNavScreenTranslations.vue b/src/client/theme-default/components/VPNavScreenTranslations.vue
index 23944b33446b..79dedc01095a 100644
--- a/src/client/theme-default/components/VPNavScreenTranslations.vue
+++ b/src/client/theme-default/components/VPNavScreenTranslations.vue
@@ -6,7 +6,7 @@ import VPSocialLink from "./VPSocialLink.vue";
 
 const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
 const isOpen = ref(false)
-const repo = computed(() => !!currentLang.value.repository || (localeLinks.value.length > 1 && localeLinks.value.some(l => !!l.repository)))
+const repo = computed(() => !!currentLang.value.repository || localeLinks.value.some(l => !!l.repository))
 
 function toggle() {
   isOpen.value = !isOpen.value

From bb76458c7d050dbaee06aa171947158c97351536 Mon Sep 17 00:00:00 2001
From: userquin <userquin@gmail.com>
Date: Sat, 7 Sep 2024 00:33:41 +0200
Subject: [PATCH 13/13] chore: update `gitlab` and `bitbacket` css class name

---
 src/client/theme-default/styles/icons.css | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/client/theme-default/styles/icons.css b/src/client/theme-default/styles/icons.css
index a8a789a14a77..40bf7267b92b 100644
--- a/src/client/theme-default/styles/icons.css
+++ b/src/client/theme-default/styles/icons.css
@@ -122,10 +122,10 @@
   --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z'/%3E%3C/svg%3E");
 }
 /* gitlab: under MIT from https://icon-sets.iconify.design/akar-icons/gitlab-fill/ */
-.vpi-repo-gitlab {
+.vpi-social-gitlab {
   --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m22.749 9.769l-.031-.08l-3.027-7.9a.79.79 0 0 0-.782-.495a.8.8 0 0 0-.456.17a.8.8 0 0 0-.268.408L16.14 8.125H7.865L5.822 1.872a.8.8 0 0 0-.269-.409a.81.81 0 0 0-.926-.05c-.14.09-.25.22-.312.376L1.283 9.684l-.03.08a5.62 5.62 0 0 0 1.864 6.496l.01.008l.028.02l4.61 3.453l2.282 1.726l1.39 1.049a.935.935 0 0 0 1.13 0l1.389-1.05l2.281-1.726l4.639-3.473l.011-.01A5.62 5.62 0 0 0 22.75 9.77'/%3E%3C/svg%3E");
 }
 /* bitbucket: under MIT from https://icon-sets.iconify.design/pajamas/bitbucket/ */
-.vpi-repo-bitbucket {
+.vpi-social-bitbucket {
   --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' d='M1.454 1.816a.45.45 0 0 0-.345.153a.44.44 0 0 0-.103.358L2.91 13.684c.049.287.3.498.596.5h9.135a.45.45 0 0 0 .449-.37L14.994 2.33a.44.44 0 0 0-.1-.358a.45.45 0 0 0-.342-.156zm8.018 8.208H6.557l-.79-4.05h4.412z'/%3E%3C/svg%3E");
 }