change base to resolve

website/src/routes/+layout.svelte

@@ -7,7 +7,7 @@
     import Footer from '$lib/components/Footer.svelte';
     import { onMount, type Snippet } from 'svelte';
     import { convertOldEmbeddingOptions } from '$lib/components/embedding/embedding';
-    import { base } from '$app/paths';
+    import { resolve } from '$app/paths';
     import { languages } from '$lib/i18n/languages';
     import { browser } from '$app/environment';
     import { goto } from '$app/navigation';
@@ -31,7 +31,7 @@
             let folders = page.url.pathname.split('/');
             let locale =
                 folders.indexOf('l') >= 0 ? (folders[folders.indexOf('l') + 1] ?? 'en') : 'en';
-            window.location.href = `${getURLForLanguage(locale, '/embed')}?options=${encodeURIComponent(JSON.stringify(convertOldEmbeddingOptions(page.url.searchParams)))}`;
+            window.location.href = `${resolve(getURLForLanguage(locale, '/embed'))}?options=${encodeURIComponent(JSON.stringify(convertOldEmbeddingOptions(page.url.searchParams)))}`;
         }
     });
 
@@ -43,7 +43,7 @@
                     if (Object.hasOwn(languages, lang)) {
                         i18n.lang = lang;
                     } else if (browser) {
-                        goto(`${base}/404`);
+                        goto(resolve('/404'));
                     }
                 }
             } else if (i18n.lang !== 'en') {

website/src/routes/404/+page.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+    import { resolve } from '$app/paths';
     import { Button } from '$lib/components/ui/button';
     import Logo from '$lib/components/Logo.svelte';
     import { getURLForLanguage } from '$lib/utils';
@@ -12,7 +13,7 @@
     <Logo class="h-40 my-3 animate-spin" style="animation-duration: 20000ms" iconOnly={true} />
     <div class="w-full flex flex-row flex-wrap gap-3 justify-center">
         <Button
-            href={getURLForLanguage(i18n.lang, '/')}
+            href={resolve(getURLForLanguage(i18n.lang, '/'))}
             class="text-base w-1/4 min-w-fit rounded-full"
         >
             <House size="18" />
@@ -20,14 +21,14 @@
         </Button>
         <Button
             data-sveltekit-reload
-            href={getURLForLanguage(i18n.lang, '/app')}
+            href={resolve(getURLForLanguage(i18n.lang, '/app'))}
             class="text-base w-1/4 min-w-fit rounded-full"
         >
             <Map size="18" />
             {i18n._('homepage.app')}
         </Button>
         <Button
-            href={getURLForLanguage(i18n.lang, '/help')}
+            href={resolve(getURLForLanguage(i18n.lang, '/help'))}
             class="text-base w-1/4 min-w-fit rounded-full"
         >
             <BookOpenText size="18" />

website/src/routes/[[language]]/+page.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+    import { resolve } from '$app/paths';
     import { Button } from '$lib/components/ui/button';
     import ElevationProfile from '$lib/components/elevation-profile/ElevationProfile.svelte';
     import GPXStatistics from '$lib/components/GPXStatistics.svelte';
@@ -58,7 +59,7 @@
                 <div class="w-full flex flex-row xs:justify-center gap-3">
                     <Button
                         data-sveltekit-reload
-                        href={getURLForLanguage(i18n.lang, '/app')}
+                        href={resolve(getURLForLanguage(i18n.lang, '/app'))}
                         class="w-1/3 min-w-fit"
                     >
                         <Map size="18" />
@@ -66,7 +67,7 @@
                     </Button>
                     <Button
                         variant="secondary"
-                        href={getURLForLanguage(i18n.lang, '/help')}
+                        href={resolve(getURLForLanguage(i18n.lang, '/help'))}
                         class="w-1/3 min-w-fit"
                     >
                         <BookOpenText size="18" />
@@ -74,7 +75,10 @@
                     </Button>
                 </div>
             </div>
-            <a href={getURLForLanguage(i18n.lang, '/app')} aria-label="Link to the web app.">
+            <a
+                href={resolve(getURLForLanguage(i18n.lang, '/app'))}
+                aria-label="Link to the web app."
+            >
                 <enhanced:img
                     src="/src/lib/assets/img/docs/getting-started/interface.webp"
                     alt="The gpx.studio interface."

website/src/routes/[[language]]/app/+page.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+    import { resolve } from '$app/paths';
     import GPXLayers from '$lib/components/map/gpx-layer/GPXLayers.svelte';
     import ElevationProfile from '$lib/components/elevation-profile/ElevationProfile.svelte';
     import FileList from '$lib/components/file-list/FileList.svelte';
@@ -79,7 +80,9 @@
             const saved = get(settings.language);
             if (saved !== undefined && saved !== language) {
                 await goto(
-                    `${getURLForLanguage(saved, page.url.pathname)}${page.url.search}${page.url.hash}`,
+                    resolve(
+                        `${getURLForLanguage(saved, page.url.pathname)}${page.url.search}${page.url.hash}`
+                    ),
                     { replaceState: true }
                 );
             }

website/src/routes/[[language]]/help/+layout.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+    import { resolve } from '$app/paths';
     import { Button } from '$lib/components/ui/button';
     import AlgoliaDocSearch from '$lib/components/AlgoliaDocSearch.svelte';
     import { getURLForLanguage } from '$lib/utils';
@@ -27,7 +28,7 @@
             {#each Object.keys(guides) as guide}
                 <Button
                     variant="link"
-                    href={getURLForLanguage(i18n.lang, `/help/${guide}`)}
+                    href={resolve(getURLForLanguage(i18n.lang, `/help/${guide}`))}
                     class="min-h-5 h-fit p-0 w-fit border-none text-muted-foreground hover:text-foreground hover:no-underline font-normal hover:font-semibold items-start whitespace-normal {page
                         .params.guide === guide
                         ? 'font-semibold text-foreground'
@@ -38,7 +39,7 @@
                 {#each guides[guide] as subGuide}
                     <Button
                         variant="link"
-                        href={getURLForLanguage(i18n.lang, `/help/${guide}/${subGuide}`)}
+                        href={resolve(getURLForLanguage(i18n.lang, `/help/${guide}/${subGuide}`))}
                         class="min-h-5 h-fit p-0 w-fit border-none text-muted-foreground hover:text-foreground hover:no-underline font-normal hover:font-semibold items-start whitespace-normal ml-3 {page
                             .params.guide ===
                         guide + '/' + subGuide

website/src/routes/[[language]]/help/+page.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+    import { resolve } from '$app/paths';
     import { Button } from '$lib/components/ui/button';
     import { getURLForLanguage } from '$lib/utils';
     import { i18n } from '$lib/i18n/i18n.svelte';
@@ -17,7 +18,7 @@
     {#each Object.keys(guides) as guide}
         <Button
             variant="outline"
-            href={getURLForLanguage(i18n.lang, `/help/${guide}`)}
+            href={resolve(getURLForLanguage(i18n.lang, `/help/${guide}`))}
             class="min-h-36 h-full pt-6 pb-3 px-0"
         >
             <div class="flex flex-col w-full">
@@ -31,7 +32,9 @@
                     {#each guides[guide] as subGuide}
                         <Button
                             variant="link"
-                            href={getURLForLanguage(i18n.lang, `/help/${guide}/${subGuide}`)}
+                            href={resolve(
+                                getURLForLanguage(i18n.lang, `/help/${guide}/${subGuide}`)
+                            )}
                             class="min-h-8 h-fit min-w-24 px-0 py-1 text-muted-foreground text-base text-center whitespace-normal"
                         >
                             {#if typeof guideIcons[subGuide] === 'string'}

website/src/routes/[[language]]/help/[...guide]/+page.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+    import { resolve } from '$app/paths';
     import { page } from '$app/state';
     import { getNextGuide, getPreviousGuide } from '$lib/components/docs/docs';
     import DocsContainer from '$lib/components/docs/DocsContainer.svelte';
@@ -22,7 +23,7 @@
         <Button
             variant="outline"
             class="mr-auto"
-            href={getURLForLanguage(i18n.lang, `/help/${previousGuide}`)}
+            href={resolve(getURLForLanguage(i18n.lang, `/help/${previousGuide}`))}
         >
             <ChevronLeft size="14" class="mt-0.5" />
             {data.guideTitles[previousGuide]}
@@ -32,7 +33,7 @@
         <Button
             variant="outline"
             class="ml-auto"
-            href={getURLForLanguage(i18n.lang, `/help/${nextGuide}`)}
+            href={resolve(getURLForLanguage(i18n.lang, `/help/${nextGuide}`))}
         >
             {data.guideTitles[nextGuide]}
             <ChevronRight size="14" class="mt-0.5" />