avoid more dynamic imports

website/src/routes/+layout.server.ts

@@ -7,8 +7,8 @@ function getModule(language: string | undefined, guide: string) {
         [guide, subguide] = guide.split('/');
     }
     return subguide
-        ? import(`./../../../lib/docs/${language}/${guide}/${subguide}.mdx`)
+        ? import(`./../lib/docs/${language}/${guide}/${subguide}.mdx`)
-        : import(`./../../../lib/docs/${language}/${guide}.mdx`);
+        : import(`./../lib/docs/${language}/${guide}.mdx`);
 }
 
 export async function load({ params }) {

website/src/routes/+layout.svelte

@@ -13,6 +13,10 @@
 	import { goto } from '$app/navigation';
 	import { getURLForLanguage } from '$lib/utils';
 
+	export let data: {
+		guideTitles: Record<string, string>;
+	};
+
 	const appRoutes = ['/[[language]]/app', '/[[language]]/embed'];
 
 	onMount(() => {
@@ -29,26 +33,20 @@
 			let lang = $page.params.language.replace('/', '');
 			if ($locale !== lang) {
 				if (languages.hasOwnProperty(lang)) {
-					locale.set(lang);
+					$locale = lang;
 				} else if (browser) {
 					goto(`${base}/404`);
 				}
 			}
 		} else if ($locale !== 'en') {
-			locale.set('en');
+			$locale = 'en';
 		}
 	}
 
 	$: if (browser && !$isLoading && $locale) {
 		let title = `gpx.studio — ${$_(`metadata.${$page.route.id?.replace('/[[language]]', '').split('/')[1] ?? 'home'}_title`)}`;
 		if ($page.params.guide) {
-			const [guide, subguide] = $page.params.guide.split('/');
+			document.title = `${title} | ${data.guideTitles[$page.params.guide]}`;
-			const promise = subguide
-				? import(`../lib/docs/${$locale ?? 'en'}/${guide}/${subguide}.mdx`)
-				: import(`../lib/docs/${$locale ?? 'en'}/${guide}.mdx`);
-			promise.then((module) => {
-				document.title = `${title} | ${module.metadata.title}`;
-			});
 		} else {
 			document.title = title;
 		}

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

@@ -1,29 +0,0 @@
-import { getNextGuide, getPreviousGuide } from "$lib/components/docs/docs";
-
-function getModule(language: string | undefined, guide: string) {
-    language = language ?? 'en';
-    let subguide = undefined;
-    if (guide.includes('/')) {
-        [guide, subguide] = guide.split('/');
-    }
-    return subguide
-        ? import(`./../../../../lib/docs/${language}/${guide}/${subguide}.mdx`)
-        : import(`./../../../../lib/docs/${language}/${guide}.mdx`);
-}
-
-export async function load({ params }) {
-    const { guide, language } = params;
-
-    const previousGuide = getPreviousGuide(guide);
-    const nextGuide = getNextGuide(guide);
-
-    const previousGuideTitle = previousGuide ? (await getModule(language, previousGuide)).metadata.title : undefined;
-    const nextGuideTitle = nextGuide ? (await getModule(language, nextGuide)).metadata.title : undefined;
-
-    return {
-        previousGuide,
-        previousGuideTitle,
-        nextGuide,
-        nextGuideTitle
-    };
-}

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

@@ -1,5 +1,6 @@
 <script lang="ts">
 	import { page } from '$app/stores';
+	import { getNextGuide, getPreviousGuide } from '$lib/components/docs/docs';
 	import DocsContainer from '$lib/components/docs/DocsContainer.svelte';
 	import { Button } from '$lib/components/ui/button';
 	import { getURLForLanguage } from '$lib/utils';
@@ -8,11 +9,11 @@
 
 	export let data: {
 		guideModule: any;
-		previousGuide: string | undefined;
+		guideTitles: Record<string, string>;
-		previousGuideTitle: string | undefined;
-		nextGuide: string | undefined;
-		nextGuideTitle: string | undefined;
 	};
+
+	$: previousGuide = getPreviousGuide($page.params.guide);
+	$: nextGuide = getNextGuide($page.params.guide);
 </script>
 
 <div class="markdown flex flex-col gap-3">
@@ -20,23 +21,23 @@
 </div>
 
 <div class="flex flex-row flex-wrap gap-3 pt-6">
-	{#if data.previousGuide}
+	{#if previousGuide}
 		<Button
 			variant="outline"
 			class="mr-auto"
-			href={getURLForLanguage($locale, `/help/${data.previousGuide}`)}
+			href={getURLForLanguage($locale, `/help/${previousGuide}`)}
 		>
 			<ChevronLeft size="14" class="mr-1 mt-0.5" />
-			{data.previousGuideTitle}
+			{data.guideTitles[previousGuide]}
 		</Button>
 	{/if}
-	{#if data.nextGuide}
+	{#if nextGuide}
 		<Button
 			variant="outline"
 			class="ml-auto"
-			href={getURLForLanguage($locale, `/help/${data.nextGuide}`)}
+			href={getURLForLanguage($locale, `/help/${nextGuide}`)}
 		>
-			{data.nextGuideTitle}
+			{data.guideTitles[nextGuide]}
 			<ChevronRight size="14" class="ml-1 mt-0.5" />
 		</Button>
 	{/if}

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

@@ -9,13 +9,12 @@ function getModule(language: string | undefined, guide: string) {
         : import(`./../../../../lib/docs/${language}/${guide}.mdx`);
 }
 
-export async function load({ data, params }) {
+export async function load({ params }) {
     const { guide, language } = params;
 
     const guideModule = await getModule(language, guide);
 
     return {
         guideModule,
-        ...data,
     };
 }