diff --git a/CLAUDE.md b/CLAUDE.md index 9e3327e..fb2d0ad 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -730,6 +730,33 @@ export function useMyModule() { - **ALWAYS extend BaseService for module services** - **NEVER create direct dependencies between modules** +### **⚠️ CRITICAL: JavaScript Falsy Value Bug Prevention** + +**ALWAYS use nullish coalescing (`??`) instead of logical OR (`||`) for numeric defaults:** + +```typescript +// ❌ WRONG: Treats 0 as falsy, defaults to 1 even when quantity is validly 0 +quantity: productData.quantity || 1 + +// ✅ CORRECT: Only defaults to 1 when quantity is null or undefined +quantity: productData.quantity ?? 1 +``` + +**Why this matters:** +- JavaScript falsy values include: `false`, `0`, `""`, `null`, `undefined`, `NaN` +- Using `||` for defaults will incorrectly override valid `0` values +- This caused a critical bug where products with quantity `0` displayed as quantity `1` +- The `??` operator only triggers for `null` and `undefined`, preserving valid `0` values + +**Common scenarios where this bug occurs:** +- Product quantities, prices, counters (any numeric value where 0 is valid) +- Boolean flags where `false` is a valid state +- Empty strings that should be preserved vs. undefined strings + +**Rule of thumb:** +- Use `||` only when `0`, `false`, or `""` should trigger the default +- Use `??` when only `null`/`undefined` should trigger the default (most cases) + **Build Configuration:** - Vite config includes PWA, image optimization, and bundle analysis - Manual chunking strategy for vendor libraries (vue-vendor, ui-vendor, shadcn) diff --git a/src/modules/market/composables/useMarket.ts b/src/modules/market/composables/useMarket.ts index a25d827..63fba57 100644 --- a/src/modules/market/composables/useMarket.ts +++ b/src/modules/market/composables/useMarket.ts @@ -310,7 +310,7 @@ export function useMarket() { description: productData.description || '', price: productData.price || 0, currency: productData.currency || 'sats', - quantity: productData.quantity || 1, + quantity: productData.quantity ?? 1, // Use nullish coalescing to preserve 0 images: productData.images || [], categories: categories, createdAt: latestEvent.created_at, @@ -502,7 +502,7 @@ export function useMarket() { description: productData.description || '', price: productData.price || 0, currency: productData.currency || 'sats', - quantity: productData.quantity || 1, + quantity: productData.quantity ?? 1, // Use nullish coalescing to preserve 0 images: productData.images || [], categories: categories, createdAt: event.created_at,