fix: update nav based on the current page.

xiCO2k · Feb 19, 2024 · 738bbc6 · 738bbc6
1 parent 762710c
commit 738bbc6
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 4 deletions.
diff --git a/resources/js/Shared/MainNav.vue b/resources/js/Shared/MainNav.vue
@@ -1,5 +1,11 @@
+<script setup>
+import { usePage } from '@inertiajs/vue3';
+
+const page = usePage();
+</script>
+
 <template>
-    <nav class="flex space-x-4 sm:space-x-8 text-gray-400 text-sm sm:text-base">
+    <nav :key="page.url" class="flex space-x-4 sm:space-x-8 text-gray-400 text-sm sm:text-base">
         <Link
             href="/given-talks"
             class="link-underline hover:text-gray-100"
@@ -10,7 +16,7 @@
         <Link
             href="/about"
             class="link-underline hover:text-gray-100"
-            :class="route().current('about') ? 'active text-gray-100' : ''"
+            :class="page.url.startsWith('/about') ? 'active text-gray-100' : ''"
         >
             About
         </Link>

diff --git a/resources/js/app.js b/resources/js/app.js
@@ -5,7 +5,7 @@ import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
 import MainLayout from './Shared/MainLayout.vue'
 import { Shiki } from './shiki'
 import twemoji from 'twemoji'
-import { ZiggyVue } from 'ziggy'
+import { ZiggyVue } from '../../vendor/tightenco/ziggy/dist/vue.m';
 
 createInertiaApp({
     resolve: async name => {

diff --git a/vite.config.js b/vite.config.js
@@ -20,7 +20,6 @@ export default defineConfig({
     resolve: {
         alias: {
             img: '/resources/img',
-            ziggy: '/vendor/tightenco/ziggy/dist/vue.m',
         },
     },
 });