sboulahtit/orion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: properly call parent init in cart and product components

Browse Source 
Issue:
- sessionId was undefined when cart/product pages loaded
- Parent shopLayoutData init() was being overridden, not called
- Session ID setup in parent wasn't running

Solution:
- Store reference to baseData before spreading
- Explicitly call baseData.init() in child component init
- This ensures sessionId is initialized before cart/product logic runs
- Add session ID logging for debugging

Now the session ID is properly initialized and cart functionality works.

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Samir Boulahtit
2025-11-23 09:28:15 +01:00
parent 84c6c38a50
commit 4c69a94f14
2 changed files with 86 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
app/templates/shop/cart.html
View File

@@ -169,38 +169,47 @@
{% block extra_scripts %}
<script>
document.addEventListener('alpine:init', () => {
Alpine.data('shoppingCart', () => ({
...shopLayoutData(),
Alpine.data('shoppingCart', () => {
const baseData = shopLayoutData();
items: [],
loading: false,
updating: false,
return {
...baseData,
// Computed properties
get totalItems() {
return this.items.reduce((sum, item) => sum + item.quantity, 0);
},
items: [],
loading: false,
updating: false,
get subtotal() {
return this.items.reduce((sum, item) =>
sum + (parseFloat(item.price) * item.quantity), 0
);
},
// Computed properties
get totalItems() {
return this.items.reduce((sum, item) => sum + item.quantity, 0);
},
get shipping() {
// Free shipping over €50
return this.subtotal >= 50 ? 0 : 5.99;
},
get subtotal() {
return this.items.reduce((sum, item) =>
sum + (parseFloat(item.price) * item.quantity), 0
);
},
get total() {
return this.subtotal + this.shipping;
},
get shipping() {
// Free shipping over €50
return this.subtotal >= 50 ? 0 : 5.99;
},
// Initialize
async init() {
console.log('[SHOP] Cart page initializing...');
await this.loadCart();
},
get total() {
return this.subtotal + this.shipping;
},
// Initialize
async init() {
console.log('[SHOP] Cart page initializing...');
// Call parent init to set up sessionId
if (baseData.init) {
baseData.init.call(this);
}
await this.loadCart();
},
// Load cart from API
async loadCart() {
@@ -302,7 +311,8 @@ document.addEventListener('alpine:init', () => {
window.location.href = '{{ base_url }}shop/checkout';
}
}
}));
};
});
});
</script>
{% endblock %}

86
app/templates/shop/product.html
View File

@@ -216,47 +216,58 @@ window.PRODUCT_ID = {{ product_id }};
window.VENDOR_ID = {{ vendor.id }};
document.addEventListener('alpine:init', () => {
Alpine.data('productDetail', () => ({
...shopLayoutData(),
Alpine.data('productDetail', () => {
const baseData = shopLayoutData();
// Data
product: null,
relatedProducts: [],
loading: false,
addingToCart: false,
quantity: 1,
selectedImage: null,
vendorId: window.VENDOR_ID,
productId: window.PRODUCT_ID,
return {
...baseData,
// Computed properties
get canAddToCart() {
return this.product?.is_active &&
this.product?.available_inventory > 0 &&
this.quantity > 0 &&
this.quantity <= this.product?.available_inventory;
},
// Data
product: null,
relatedProducts: [],
loading: false,
addingToCart: false,
quantity: 1,
selectedImage: null,
vendorId: window.VENDOR_ID,
productId: window.PRODUCT_ID,
get totalPrice() {
const price = this.product?.sale_price || this.product?.price || 0;
return price * this.quantity;
},
// Computed properties
get canAddToCart() {
return this.product?.is_active &&
this.product?.available_inventory > 0 &&
this.quantity > 0 &&
this.quantity <= this.product?.available_inventory;
},
get hasAdditionalDetails() {
return this.product?.marketplace_product?.gtin ||
this.product?.condition ||
this.product?.marketplace_product?.color ||
this.product?.marketplace_product?.size ||
this.product?.marketplace_product?.material;
},
get totalPrice() {
const price = this.product?.sale_price || this.product?.price || 0;
return price * this.quantity;
},
// Initialize
async init() {
console.log('[SHOP] Product detail page initializing...');
console.log('[SHOP] Product ID:', this.productId);
console.log('[SHOP] Vendor ID:', this.vendorId);
await this.loadProduct();
},
get hasAdditionalDetails() {
return this.product?.marketplace_product?.gtin ||
this.product?.condition ||
this.product?.marketplace_product?.color ||
this.product?.marketplace_product?.size ||
this.product?.marketplace_product?.material;
},
// Initialize
async init() {
console.log('[SHOP] Product detail page initializing...');
// Call parent init to set up sessionId
if (baseData.init) {
baseData.init.call(this);
}
console.log('[SHOP] Product ID:', this.productId);
console.log('[SHOP] Vendor ID:', this.vendorId);
console.log('[SHOP] Session ID:', this.sessionId);
await this.loadProduct();
},
// Load product details
async loadProduct() {
@@ -384,7 +395,8 @@ document.addEventListener('alpine:init', () => {
this.addingToCart = false;
}
}
}));
};
});
});
</script>
{% endblock %}