wip: other strategy redirect in locale-choice page

1024pix · Jan 1, 2023 · f75bf87 · f75bf87
1 parent 098d384
commit f75bf87
Show file tree

Hide file tree

Showing 3 changed files with 61 additions and 32 deletions.
diff --git a/pages/pix-site/locale-choice.vue b/pages/pix-site/locale-choice.vue
@@ -1,6 +1,6 @@
 <template>
   <client-only>
-    <div class="locale-choice">
+    <div :class="localeChoiceClassName">
       <h1>
         <pix-image
           class="logo-pix"
@@ -13,7 +13,10 @@
         class="locale-choice__link"
         :locale="locale"
       />
-      <pix-image class="planet" :field="{ url: '/images/planet.svg' }" />
+      <pix-image
+        :class="planetClassName"
+        :field="{ url: '/images/planet.svg' }"
+      />
     </div>
   </client-only>
 </template>
@@ -26,12 +29,38 @@ export default {
   data() {
     return {
       locales: language.locales,
+      localeChoiceClassName: 'not-visible',
+      planetClassName: 'not-visible',
+    }
+  },
+  mounted() {
+    console.log('mounted')
+
+    const cookieLocale = _getLocaleFromCookie()
+    console.log({ cookieLocale })
+    if (!cookieLocale) {
+      this.localeChoiceClassName = 'locale-choice'
+      this.planetClassName = 'planet'
+      return
     }
+
+    this.$router.push(`/${cookieLocale}`)
   },
 }
+function _getLocaleFromCookie() {
+  const localeCookie = document.cookie
+    .split(';')
+    .find((item) => item.startsWith('locale'))
+  if (!localeCookie) return null
+  return localeCookie.split('=')[1]
+}
 </script>
 
 <style lang="scss" scoped>
+.not-visible {
+  visibility: hidden;
+}
+
 .logo-pix {
   margin: 0 auto 5vh;
   display: block;

diff --git a/plugins/locale-observer.js b/plugins/locale-observer.js
@@ -1,25 +1,25 @@
-export default function ({ app, route }) {
+export default function ({ app }) {
   window.onNuxtReady(() => {
     console.log('window.onNuxtReady')
-    const cookieLocale = _getLocaleFromCookie()
-    if (!cookieLocale) return
+    // const cookieLocale = _getLocaleFromCookie()
+    // if (!cookieLocale) return
 
-    console.log({ path: route.path })
-    window.$nuxt.$router.push(`/${cookieLocale}`)
+    // console.log({ path: route.path })
+    // window.$nuxt.$router.push(`/${cookieLocale}`)
   })
 
   app.i18n.onBeforeLanguageSwitch = (oldLocale, newLocale) => {
     _setLocaleCookie(newLocale)
   }
 }
 
-function _getLocaleFromCookie() {
-  const localeCookie = document.cookie
-    .split(';')
-    .find((item) => item.startsWith('locale'))
-  if (!localeCookie) return null
-  return localeCookie.split('=')[1]
-}
+// function _getLocaleFromCookie() {
+//   const localeCookie = document.cookie
+//     .split(';')
+//     .find((item) => item.startsWith('locale'))
+//   if (!localeCookie) return null
+//   return localeCookie.split('=')[1]
+// }
 
 function _setLocaleCookie(locale) {
   document.cookie = `locale=${locale};path=/`

diff --git a/tests/plugins/locale-observer.test.js b/tests/plugins/locale-observer.test.js
@@ -13,26 +13,26 @@ describe('Plugins | locale-observer', () => {
   })
 
   describe('when is first page', () => {
-    describe('when cookie', () => {
-      it('redirects to locale index', () => {
-        // given
-        document.cookie = 'locale=fr'
-        const context = {
-          app: {
-            i18n: {},
-          },
-          route: {
-            path: '/',
-          },
-        }
+    //   describe('when cookie', () => {
+    //     it('redirects to locale index', () => {
+    //       // given
+    //       document.cookie = 'locale=fr'
+    //       const context = {
+    //         app: {
+    //           i18n: {},
+    //         },
+    //         route: {
+    //           path: '/',
+    //         },
+    //       }
 
-        // when
-        localeObserver(context)
+    //       // when
+    //       localeObserver(context)
 
-        // then
-        expect(window.$nuxt.$router.push).toHaveBeenCalledWith('/fr')
-      })
-    })
+    //       // then
+    //       expect(window.$nuxt.$router.push).toHaveBeenCalledWith('/fr')
+    //     })
+    // })
 
     describe('when no cookie', () => {
       it('save locale', () => {