Refactor LanguageSwitcher component to use DropdownLink; comment out …

…Composer install step in deploy workflow
abdessamadbettal · Dec 6, 2024 · e57d738 · e57d738
1 parent 3ae9652
commit e57d738
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 6 deletions.
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -19,8 +19,8 @@ jobs:
           php-version: '8.2'
           tools: 'composer'
 
-      - name: Composer install
-        run: composer install
+      # - name: Composer install
+      #   run: composer install
 
       - name: NPM install
         run: npm install && npm run build

diff --git a/resources/js/Components/LanguageSwitcher.vue b/resources/js/Components/LanguageSwitcher.vue
@@ -20,15 +20,16 @@
                 </template>
 
                 <template #content>
-                    <button
+                    <DropdownLink
                         v-for="lang in languages"
                         :key="lang.code"
+                        :href="getURL(lang)"
                         class="px-4 py-2 hover:bg-gray-100 cursor-pointer flex"
-                        @click="changeLanguage(lang)"
+                        @click.prevent="changeLanguage(lang)"
                     >
                         <img :src="lang.flag" alt="" class="w-4 h-4 me-2">
                         {{ lang.name }}
-                    </button>
+                    </DropdownLink>
                 </template>
             </Dropdown>
         </div>
@@ -39,7 +40,8 @@
 import { computed } from 'vue';
 import { router as inertiaRouter } from '@inertiajs/vue3';
 import Dropdown from '@/Components/Forms/Dropdown.vue';
-import { setLocale } from '@/i18n';
+import DropdownLink from '@/Components/DropdownLink.vue';
+import i18n, { setLocale } from '@/i18n';
 
 const props = defineProps(['currentLocale']);
 
@@ -54,6 +56,11 @@ const currentLanguage = computed(() => {
     return languages.find(lang => lang.code === props.currentLocale);
 });
 
+const getURL = (lang) => {
+    const currentUrl = new URL(window.location.href);
+    return currentUrl.pathname.replace(`/${props.currentLocale}`, `/${lang.code}`);
+};
+
 async function changeLanguage(lang) {
     const currentUrl = new URL(window.location.href);