fix: add baseURL on GlobalHeader links

Author: genj11

apps/web/app/components/GlobalHeader.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { useRuntimeConfig } from '#imports'
+import { useRuntimeConfig, useWithBase } from '#imports'
 import { useI18n } from '#i18n'
 import { useNav } from '~/composables/useNav'
 import { useScreenOrientation, useWindowSize } from '@vueuse/core'
@@ -36,8 +36,10 @@ const toggleMenu = () => {
   showMenu.value = !showMenu.value
 }
 
+const withBase = useWithBase()
 const getAnchorPath = computed(
-  () => (anchor: string) => (locale.value === 'ja' ? `/${anchor}` : `/en/${anchor}`),
+  () => (anchor: string) =>
+    locale.value === 'ja' ? withBase(`/${anchor}`) : withBase(`en/${anchor}`),
 )
 </script>
 

apps/web/app/composables/useWithBase.ts

@@ -0,0 +1,11 @@
+import { useRuntimeConfig } from '#app'
+
+export function useWithBase() {
+  const baseUrl = useRuntimeConfig().app.baseURL
+
+  function withBase(path: string) {
+    return (baseUrl + path).replace(/\/\//g, '/')
+  }
+
+  return withBase
+}