fix: ensure cookie names are encoded for js-cookie compatibility (#92)

* fix: ensure cookie names are encoded for js-cookie compatibility

* chore: add changeset to ensure cookie names are encoded for js-cookie compatibility

---------

Co-authored-by: MURAKAMI Masahiko <m-murakami@esm.co.jp>

Author: ikoamu

.changeset/quiet-clocks-open.md

@@ -0,0 +1,5 @@
+---
+"amplify-adapter-react-router": patch
+---
+
+fix: ensure cookie names are encoded for js-cookie compatibility

packages/amplify-adapter-react-router/src/adapter.ts

@@ -14,6 +14,19 @@ import {
 import { parseAmplifyConfig } from "aws-amplify/utils";
 import cookie from "cookie";
 
+/**
+ * Ensures the cookie names are encoded in order to look up the cookie store
+ * that is manipulated by js-cookie on the client side.
+ *
+ * see: https://github.com/aws-amplify/amplify-js/blob/main/packages/adapter-nextjs/src/utils/cookie/ensureEncodedForJSCookie.ts
+ */
+function ensureEncodedForJSCookie(name: string) {
+  return encodeURIComponent(name).replace(
+    /%(2[346B]|5E|60|7C)/g,
+    decodeURIComponent,
+  );
+}
+
 export type ReactRouterServerContext = {
   request: Request;
   responseHeaders: Headers;
@@ -72,24 +85,30 @@ export function createServerRunner({
                   name,
                   value,
                 })),
-              get: (name: string): CookieStorage.Cookie | undefined => ({
-                name,
-                value: cookies[name],
-              }),
+              get: (name: string): CookieStorage.Cookie | undefined => {
+                const encodedName = ensureEncodedForJSCookie(name);
+                return { name: encodedName, value: cookies[encodedName] };
+              },
               set: (
                 name: string,
                 value: string,
                 options?: CookieStorage.SetCookieOptions,
               ): void => {
                 responseHeaders.append(
                   "Set-Cookie",
-                  cookie.serialize(name, value, options),
+                  cookie.serialize(
+                    ensureEncodedForJSCookie(name),
+                    value,
+                    options,
+                  ),
                 );
               },
               delete: (name: string): void => {
                 responseHeaders.append(
                   "Set-Cookie",
-                  cookie.serialize(name, "", { expires: new Date(0) }),
+                  cookie.serialize(ensureEncodedForJSCookie(name), "", {
+                    expires: new Date(0),
+                  }),
                 );
               },
             });