diff --git a/resources/js/components/NavLogoLink.vue b/resources/js/components/NavLogoLink.vue
index 2b903295..b222d575 100644
--- a/resources/js/components/NavLogoLink.vue
+++ b/resources/js/components/NavLogoLink.vue
@@ -1,13 +1,14 @@
 <script setup lang="ts">
 import ApplicationLogo from '@/components/ApplicationLogo.vue'
+import { Link as InertiaLink } from '@inertiajs/vue3'
 </script>
 
 <template>
     <Button
         :href="route('welcome')"
+        :as="InertiaLink"
         pt:root:class="flex items-center justify-start gap-4 no-underline p-0"
         variant="link"
-        as="InertiaLink"
     >
         <ApplicationLogo class="block h-8 lg:h-10 w-auto fill-current text-surface-900 dark:text-surface-0" />
         <span class="font-bold">Laravel + PrimeVue Starter Kit</span>
diff --git a/resources/js/layouts/UserSettingsLayout.vue b/resources/js/layouts/UserSettingsLayout.vue
index 0841b142..00759859 100644
--- a/resources/js/layouts/UserSettingsLayout.vue
+++ b/resources/js/layouts/UserSettingsLayout.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { computed } from 'vue'
-import { usePage } from '@inertiajs/vue3'
+import { usePage, Link as InertiaLink } from '@inertiajs/vue3'
 import PageTitleSection from '@/components/PageTitleSection.vue'
 
 const page = usePage()
@@ -54,7 +54,7 @@ const sidebarNavItems = computed(() => [
                         :severity="item.active ? 'secondary' : ''"
                         :variant="item.active ? 'outlined' : 'text'"
                         :href="item.route"
-                        as="InertiaLink"
+                        :as="InertiaLink"
                     >
                         {{ item.title }}
                     </Button>