Homepage was rendering 71MB of HTML because every uploaded image (gallery,
products, proofs, custom requests, design previews, invoices, receipts) was
stored as base64 in Postgres and double-embedded via RSC hydration payloads.
Adds src/lib/storage.ts (sharp-based compression, disk storage under
public/uploads/) and a new /api/design-uploads endpoint for images added
inside the design tool, migrates existing rows, and drops the now-unused
base64 columns and the dead ProductImage table.
Also fixes a systemic bug from the Next.js 16 upgrade where dynamic pages
across the app still destructured params/searchParams synchronously instead
of awaiting them as Promises, which was silently breaking filters/params and
crashing /products/[slug] outright.
Updates README.md and SETUP_AND_BUILD.md to reflect Postgres + Next.js 16 and
document the new image storage architecture and backup requirements.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Design Canvas (Primary)
- FabricDesignCanvasV2: Fabric.js-based product customization canvas
- Lazy-loads Fabric.js to minimize bundle impact
- Renders product mockup with print area guide (magenta dashed box)
- Supports front/back view switching with correct product images
- Color swatch selection for garment customization
- Text element creation with selection handles and transform controls
- Fixed React dependency array to prevent infinite renders
Support Components
- DesignCanvasWrapper: Client-side wrapper for SSR compatibility
- DesignCanvasErrorBoundary: Error boundary for canvas failures
- ThemeInitializer: Theme detection and application
Configuration
- Updated .claude/launch.json with dev server settings
- Updated .claude/settings.local.json with local preferences
- Updated next.config.mjs for production build optimization
- Dependency updates in package.json and package-lock.json
Known Issues & TODO
- Image element rendering disabled (Fabric.js compatibility investigation)
- Text editing UI controls needed (font, size, color pickers)
- Delete/undo functionality pending
- Print area alignment needs visual verification
- "Add to Cart" integration with design serialization pending
Testing Artifacts
- check_*.js: Product verification scripts for debugging
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
