From ec4f1ac6f76e294c82f279cfdf48dcac4181244e Mon Sep 17 00:00:00 2001
From: Michelle Chen <michelle.chen@shopify.com>
Date: Wed, 22 May 2024 13:29:05 -0400
Subject: [PATCH] add changeset

---
 .changeset/nice-deers-return.md | 67 +++++++++++++++++++++++++++++++++
 1 file changed, 67 insertions(+)
 create mode 100644 .changeset/nice-deers-return.md

diff --git a/.changeset/nice-deers-return.md b/.changeset/nice-deers-return.md
new file mode 100644
index 0000000000..ed34d664b6
--- /dev/null
+++ b/.changeset/nice-deers-return.md
@@ -0,0 +1,67 @@
+---
+'skeleton': patch
+'@shopify/hydrogen': patch
+'@shopify/cli-hydrogen': patch
+---
+
+Remove manual setting of session in headers and recommend setting it in server after response is created.
+
+Step 1: Add `isPending` implementation in session
+
+```diff
+// in app/lib/session.ts
+export class AppSession implements HydrogenSession {
++  public isPending = false;
+
+  get unset() {
++    this.isPending = true;
+    return this.#session.unset;
+  }
+
+  get set() {
++    this.isPending = true;
+    return this.#session.set;
+  }
+
+  commit() {
++    this.isPending = false;
+    return this.#sessionStorage.commitSession(this.#session);
+  }
+}
+```
+
+Step 2: update response header if `session.isPending` is true
+
+```diff
+// in server.ts
+export default {
+  async fetch(request: Request): Promise<Response> {
+    try {
+      const response = await handleRequest(request);
+
++      if (session.isPending) {
++        response.headers.set('Set-Cookie', await session.commit());
++      }
+
+      return response;
+    } catch (error) {
+      ...
+    }
+  },
+};
+```
+
+Step 3: remove setting cookie with session.commit()
+
+```diff
+// in route files
+export async function loader({context}: LoaderFunctionArgs) {
+  return json({},
+-    {
+-      headers: {
+-        'Set-Cookie': await context.session.commit(),
+-      },
+    },
+  );
+}
+```