From 15b3bd9465999bac803e0a071c1b5ffc52859285 Mon Sep 17 00:00:00 2001
From: Frank John Begornia <frank.begornia@yahoo.com>
Date: Fri, 21 Nov 2025 22:45:08 +0800
Subject: [PATCH] feat: add authentication token handling for design
 persistence

---
 app/pages/designer.vue     | 4 ++++
 server/api/designs.post.ts | 4 ++++
 2 files changed, 8 insertions(+)

diff --git a/app/pages/designer.vue b/app/pages/designer.vue
index ace1139..2a1e9a0 100644
--- a/app/pages/designer.vue
+++ b/app/pages/designer.vue
@@ -128,8 +128,12 @@ const persistDesign = async (designId: string, design: ExportedDesign) => {
     ),
   ]);
 
+  // Get Firebase ID token for authentication
+  const idToken = user.value ? await user.value.getIdToken() : null;
+
   await $fetch("/api/designs", {
     method: "POST",
+    headers: idToken ? { Authorization: `Bearer ${idToken}` } : {},
     body: {
       designId,
       templateId: design.templateId,
diff --git a/server/api/designs.post.ts b/server/api/designs.post.ts
index 5b688f3..7f8ca7c 100644
--- a/server/api/designs.post.ts
+++ b/server/api/designs.post.ts
@@ -27,6 +27,9 @@ export default defineEventHandler(async (event) => {
     });
   }
 
+  // Extract the authorization token from the incoming request
+  const authHeader = getHeader(event, "authorization");
+
   const payload = {
     designId: body.designId,
     templateId: body.templateId,
@@ -43,6 +46,7 @@ export default defineEventHandler(async (event) => {
     const result = await $fetch("/designs", {
       baseURL: backendUrl,
       method: "POST",
+      headers: authHeader ? { Authorization: authHeader } : {},
       body: payload,
     });