From 76c9228721a7fbfa872d659945cac0d6f0f7a7f1 Mon Sep 17 00:00:00 2001
From: Collin Brown <collinbrown95@gmail.com>
Date: Tue, 8 Sep 2020 18:33:13 -0400
Subject: [PATCH] Adding button to change languages Including examples using
 localePath and $t

---
 .../containers/documents/DocumentList.vue     |  2 +-
 .../components/organisms/layout/TheHeader.vue | 27 +++++++++++++++++++
 frontend/pages/projects/_id/index.vue         |  2 +-
 3 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/frontend/components/containers/documents/DocumentList.vue b/frontend/components/containers/documents/DocumentList.vue
index bcc776a3..9cebbb38 100644
--- a/frontend/components/containers/documents/DocumentList.vue
+++ b/frontend/components/containers/documents/DocumentList.vue
@@ -137,7 +137,7 @@ export default {
       const offset = (this.options.page - 1) * this.options.itemsPerPage
       const page = offset + index + 1
       this.$router.push({
-        path: `/projects/${this.$route.params.id}/${this.getLink}`,
+        path: this.localePath(`/projects/${this.$route.params.id}/${this.getLink}`),
         query: {
           page,
           q: this.search
diff --git a/frontend/components/organisms/layout/TheHeader.vue b/frontend/components/organisms/layout/TheHeader.vue
index 4e6951f1..1c7ee512 100644
--- a/frontend/components/organisms/layout/TheHeader.vue
+++ b/frontend/components/organisms/layout/TheHeader.vue
@@ -29,6 +29,33 @@
     </v-btn>
     <div class="flex-grow-1" />
     <the-color-mode-switcher />
+    <v-menu
+      open-on-hover
+      offset-y
+    >
+      <template v-slot:activator="{ on }">
+        <v-btn
+          text
+          v-on="on"
+        >
+          {{ $i18n.locale }}
+          <v-icon>mdi-menu-down</v-icon>
+        </v-btn>
+      </template>
+      <v-list
+        v-for="locale in $i18n.locales"
+        :key="locale.code"
+      >
+        <v-list-item>
+          <nuxt-link
+            style="text-decoration: none; color: inherit;"
+            :to="switchLocalePath(locale.code)"
+          >
+            {{ locale.name }}
+          </nuxt-link>
+        </v-list-item>
+      </v-list>
+    </v-menu>
     <v-btn
       v-if="isAuthenticated"
       text
diff --git a/frontend/pages/projects/_id/index.vue b/frontend/pages/projects/_id/index.vue
index 02257099..c00f732e 100644
--- a/frontend/pages/projects/_id/index.vue
+++ b/frontend/pages/projects/_id/index.vue
@@ -1,7 +1,7 @@
 <template>
   <v-card>
     <v-card-title>
-      Welcome to doccano!
+      {{ $t('home.welcome') }}
     </v-card-title>
     <v-stepper
       v-model="e6"