From 84c6c38a50af12d1fab22348612c5cd49b94673a Mon Sep 17 00:00:00 2001
From: Samir Boulahtit <samir.boulahtit@wizard.lu>
Date: Sun, 23 Nov 2025 09:25:27 +0100
Subject: [PATCH] fix: add sessionId to shopLayoutData for cart functionality
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Issue:
- Cart was empty after adding products
- Product and cart pages reference this.sessionId but it wasn't defined
- Session ID was being created separately in each page component

Solution:
- Add sessionId property to shopLayoutData base component
- Add getOrCreateSessionId() method to manage session across all pages
- Initialize sessionId in init() so it's available to all child components
- Session ID stored in localStorage as 'cart_session_id'

Now the cart session is shared across all shop pages and cart items
persist correctly.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 static/shop/js/shop-layout.js | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/static/shop/js/shop-layout.js b/static/shop/js/shop-layout.js
index 54d1ca6f..80a0a9af 100644
--- a/static/shop/js/shop-layout.js
+++ b/static/shop/js/shop-layout.js
@@ -29,11 +29,16 @@ function shopLayoutData() {
 
         // Cart state
         cart: [],
+        sessionId: null,
 
         // Initialize
         init() {
             shopLog.info('Shop layout initializing...');
 
+            // Get or create session ID
+            this.sessionId = this.getOrCreateSessionId();
+            shopLog.debug('Session ID:', this.sessionId);
+
             // Load cart from localStorage
             this.loadCart();
 
@@ -45,6 +50,17 @@ function shopLayoutData() {
             shopLog.info('Shop layout initialized');
         },
 
+        // Get or create session ID
+        getOrCreateSessionId() {
+            let sessionId = localStorage.getItem('cart_session_id');
+            if (!sessionId) {
+                sessionId = 'session_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9);
+                localStorage.setItem('cart_session_id', sessionId);
+                shopLog.info('Created new session ID:', sessionId);
+            }
+            return sessionId;
+        },
+
         // Theme management
         toggleTheme() {
             this.dark = !this.dark;