From 6f5b90c66fe27a83f075ef66cc0e8360359a0aa3 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Mon, 8 Apr 2024 08:32:22 +0900
Subject: [PATCH] fix(react-server): decode dynamic route params (#271)

---
 packages/react-server/examples/basic/e2e/basic.test.ts    | 8 ++++++++
 .../examples/basic/src/routes/test/dynamic/layout.tsx     | 2 ++
 packages/react-server/src/lib/router.tsx                  | 2 +-
 3 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/packages/react-server/examples/basic/e2e/basic.test.ts b/packages/react-server/examples/basic/e2e/basic.test.ts
index f2b6afdc3..cf41a2533 100644
--- a/packages/react-server/examples/basic/e2e/basic.test.ts
+++ b/packages/react-server/examples/basic/e2e/basic.test.ts
@@ -727,6 +727,14 @@ test("dynamic routes", async ({ page }) => {
   await page.getByText("file: /test/dynamic/[id]/[nested]/page.tsx").click();
   await page.getByText("pathname: /test/dynamic/abc/def").click();
   await page.getByText('params: {"id":"abc","nested":"def"}').click();
+
+  await page.getByRole("link", { name: "/test/dynamic/🎸 + 🎷 = 🎶" }).click();
+  await page.getByText('params: {"id":"🎸 + 🎷 = 🎶"}').click();
+  await page.waitForURL("/test/dynamic/🎸 + 🎷 = 🎶");
+
+  await page.getByRole("link", { name: "/test/dynamic/%F0%9F%8E%B8%" }).click();
+  await page.getByText('params: {"id":"🎸 + 🎷 = 🎶"}').click();
+  await page.waitForURL("/test/dynamic/🎸 + 🎷 = 🎶");
 });
 
 test("full client route", async ({ page }) => {
diff --git a/packages/react-server/examples/basic/src/routes/test/dynamic/layout.tsx b/packages/react-server/examples/basic/src/routes/test/dynamic/layout.tsx
index 76b2c5fb9..2408cb37e 100644
--- a/packages/react-server/examples/basic/src/routes/test/dynamic/layout.tsx
+++ b/packages/react-server/examples/basic/src/routes/test/dynamic/layout.tsx
@@ -11,6 +11,8 @@ export default function Layout(props: LayoutProps) {
           "/test/dynamic",
           "/test/dynamic/static",
           "/test/dynamic/abc",
+          "/test/dynamic/🎸 + 🎷 = 🎶",
+          "/test/dynamic/" + encodeURI("🎸 + 🎷 = 🎶"),
           "/test/dynamic/abc/def",
         ]}
       />
diff --git a/packages/react-server/src/lib/router.tsx b/packages/react-server/src/lib/router.tsx
index 459561385..35c520707 100644
--- a/packages/react-server/src/lib/router.tsx
+++ b/packages/react-server/src/lib/router.tsx
@@ -106,7 +106,7 @@ export async function renderRouteMap(
     if (next?.child) {
       node = next.child;
       if (next.param) {
-        params = { ...params, [next.param]: key };
+        params = { ...params, [next.param]: decodeURI(key) };
       }
     } else {
       node = initNode();