Fixes matching of similar dynamic parameters

.changeset/red-lies-play.md

@@ -0,0 +1,5 @@
+---
+"@astrolicious/i18n": patch
+---
+
+Fixes matching of similar dynamic parameters

package/assets/stubs/virtual.mjs

@@ -237,13 +237,22 @@ export const switchLocalePath = (locale) => {
 	if (!currentLocaleRoute) {
 		currentLocaleRoute = currentLocaleRoutes
 			.filter((route) => route.params.length > 0)
-			.find(
-				(route) =>
-					JSON.stringify(route.params.sort()) ===
-					JSON.stringify(
-						Object.keys(config.paths.dynamicParams?.[locale] ?? {}).sort(),
-					),
-			);
+			.find((route) => {
+				// Convert the route pattern to a regex pattern
+
+				// Replace all dynamic params with the ".*" regex pattern
+				let pattern = route.injectedRoute.pattern.replace(/[*.]/g, "\\$&");
+				pattern = Object.keys(
+					config.paths.dynamicParams?.[locale] ?? {},
+				).reduce((acc, key) => acc.replace(`[${key}]`, ".*"), pattern);
+
+				// Escape all special characters
+				pattern = pattern.replace(/[-[\]{}()+?,\\^$|#\s]/g, "\\$&");
+
+				return new RegExp(`^${pattern}$`).test(
+					_withoutTrailingSlash(config.paths.pathname),
+				);
+			});
 	}
 
 	// Fallback

playground/src/layouts/Layout.astro

@@ -30,6 +30,7 @@ const { title } = Astro.props;
         <a href={getLocalePath("/")}>{t("home:title")}</a>
         <a href={getLocalePath("/about")}>{t("about")}</a>
         <a href={getLocalePath("/blog")}>{t("blog")}</a>
+        <a href={getLocalePath("/user")}>{t("user")}</a>
       </div>
       <LocaleSwitcher />
     </header>

playground/src/locales/en/common.json

@@ -1,5 +1,6 @@
 {
 	"home": "Home",
 	"about": "About",
-	"blog": "The blog"
+	"blog": "The blog",
+	"user": "The user"
 }

playground/src/locales/fr/common.json

@@ -1,5 +1,6 @@
 {
 	"home": "Accueil",
 	"about": "A propos",
-	"blog": "Le blog"
+	"blog": "Le blog",
+	"user": "Utilisateur"
 }

playground/src/routes/user.astro

@@ -0,0 +1,32 @@
+---
+import { getLocale, getLocalePath, t } from "i18n:astro";
+import Layout from "~/layouts/Layout.astro";
+
+const title = t("user");
+
+const slugs = [
+	{
+		en: "a",
+		fr: "d",
+	},
+	{
+		en: "b",
+		fr: "e",
+	},
+	{
+		en: "c",
+		fr: "f",
+	},
+];
+
+const currentLocaleSlugs = slugs.map((e) => e[getLocale()]);
+---
+
+<Layout {title}>
+  <h1>{title}</h1>
+  {
+    currentLocaleSlugs.map((slug) => (
+      <a href={getLocalePath("/user/[slug]", { slug })} class="block p-1 underline">{slug}</a>
+    ))
+  }
+</Layout>

playground/src/routes/user/[slug].astro

@@ -0,0 +1,63 @@
+---
+import {
+	getDefaultLocalePlaceholder,
+	getLocalePlaceholder,
+	getLocalesPlaceholder,
+	setDynamicParams,
+	t,
+} from "i18n:astro";
+import sitemap from "i18n:astro/sitemap";
+import type { GetStaticPaths } from "astro";
+import Layout from "~/layouts/Layout.astro";
+
+export const getStaticPaths = (() => {
+	const locale = getLocalePlaceholder();
+	const locales = getLocalesPlaceholder();
+	const defaultLocale = getDefaultLocalePlaceholder();
+	console.log({ locale, locales, defaultLocale });
+
+	const slugs = [
+		{
+			en: "a",
+			fr: "d",
+		},
+		{
+			en: "b",
+			fr: "e",
+		},
+		{
+			en: "c",
+			fr: "f",
+		},
+	];
+
+	return slugs.map((slug) => {
+		const dynamicParams = Object.entries(slug).map(([locale, slug]) => ({
+			locale,
+			params: { slug },
+		}));
+		sitemap({
+			dynamicParams,
+		});
+		return {
+			params: {
+				slug: slug[locale],
+			},
+			props: {
+				dynamicParams,
+			},
+		};
+	});
+}) satisfies GetStaticPaths;
+
+const { slug } = Astro.params;
+const { dynamicParams } = Astro.props;
+
+setDynamicParams(dynamicParams);
+
+const title = t("user");
+---
+
+<Layout {title}>
+  <h1>{title} {slug}</h1>
+</Layout>