- Revert grid layout changes - boxes now stack vertically as before
- Remove Group wrapper from curved text - was causing image disappearance
- Curved text now renders as simple TextPath with click handlers
- Text can be selected but not dragged (will add dragging back safely later)
- Images should now display correctly when curved text is enabled
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Add CSS Grid layout to Image Dimensions boxes (2 columns on lg screens)
- Add CSS Grid layout to Font Properties boxes (2 columns on lg screens)
- Boxes now wrap horizontally instead of stretching page vertically
- Mobile-first: stacks vertically on sm/md, wraps to 2 columns on lg+
- Reduces page scroll while keeping all controls accessible
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Move x/y positioning from TextPath to Group wrapper
- TextPath now renders at default position using only path data
- Group handles x/y positioning and dragging
- Remove fontStyle/letterSpacing from TextPath (not needed)
- This should fix text disappearing when curved text is enabled
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Re-add x/y coordinates to TextPath for proper positioning within Group
- Add fontStyle and letterSpacing properties for complete font rendering
- Group remains draggable for movement
- Text content and font should now persist and render correctly when curves enabled
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Wrap TextPath in Group to enable dragging while preserving text on toggle
- Group handles x/y positioning and drag events
- TextPath is non-listening so Group events take priority
- Curved text can now be selected, dragged, and unchecked without losing content
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- TextPath positioning is handled by the path data, not x/y coordinates
- Removed x={el.x} and y={el.y} from TextPath to prevent coordinate corruption
- Removes drag handlers from TextPath since curves are centered on canvas
- Text now properly persists when toggling between curved and straight
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Initialize curvedPath: null when creating text elements
- Ensures all text elements have the curvedPath property from creation
- Prevents text loss when toggling curved text on/off
- Text content is now properly preserved when switching between curved and straight
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Remove Group wrapper that was preventing TextPath from receiving click events
- Make TextPath directly draggable and selectable with proper event handlers
- TextPath now supports: clicking to select, dragging to move, position persistence
- Users can now properly interact with curved text on the canvas
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Wrap TextPath in Group container to enable dragging of curved text
Previously curved text couldn't be moved on canvas. Now users can:
• Add curved text
• Move it by dragging
• Update position is saved correctly
- Confirm curved text is per-element: Each text element has its own
curvedPath property, so you can mix curved and straight text on the
same design (Font 1: circle, Font 2: wave, Font 3: straight, etc.)
- TextPath uses listening={false} since Group handles all interactions
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Fix: Redirect users back to product page after login by passing 'next' parameter
in LoginPromptModal. Previously users were redirected to /account and lost
design context. Now they return to where they started (e.g., /made-to-order/
classic-t-shirt) where design drafts are restored from localStorage.
- Fix: Clear design draft from localStorage only AFTER successful cart addition,
not immediately. This ensures draft persists if user needs to login mid-design.
- Feature: Add Font Properties boxes (Font 1, Font 2, etc.) similar to Image
Dimensions. Each text element now displays with editable controls for:
• Text content
• Font family (dropdown with all fonts)
• Font size (slider 10-80pt with display)
• Text color (color picker)
• Rotation (slider 0-360 degrees)
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Remove Reference Size input fields from customer design page
- Rulers now use product.referenceWidthCm and product.referenceHeightCm
- Reference size is set by admin when editing product (not customer)
- Simplify Add to bag validation - only check for design elements
- Remove reference size state from DesignCanvas component
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Add Reference Size (cm) section with Width and Height inputs
- Rulers now use reference size instead of product print area dimensions
- Measurements scale to garment size specified by user
- Add to bag button disabled until reference sizes are provided
- Rulers span full canvas and show custom scale (e.g., 0-40cm x 0-60cm)
- Reference size required for personalization checkout
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Add printAreaWidthMm and printAreaHeightMm to ProductDTO type
- Include these fields in toProductDTO conversion function
- Refactor ruler calculations to use simple for loops
- Rulers now display correctly showing 2cm increments on both axes
- Position & Size panel now shows accurate cm measurements
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Add product parameter to PrintSurface component props
- Pass product to both front and back PrintSurface calls
- Allows rulers to access product.printAreaWidthMm for cm calculations
- Fixes ReferenceError: product is not defined
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Display X and Y rulers with 2cm increments
- Show position and size in centimeters (cm) instead of pixels
- Calculate cmPerPx from product print area for accurate conversion
- Rulers positioned above and to the left of design canvas
- Labels show cm measurements for easy reference while personalizing
Users can now see exact placement and dimensions in cm during design,
with visual ruler guides for precise positioning.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Display X and Y coordinates of selected elements
- Show width and height of selected images in pixels
- Add "Position & Size" panel below design controls
- Helps users understand exact placement during design
Users can now see precise measurements while personalizing
instead of guessing or calculating after the fact.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Split layout: image + info with left border accent
- Product names prominently displayed using serif font
- Unique left border that animates on hover
- Better visual hierarchy and spacing
- Smooth animations (scale, color transitions)
- Clear "Explore" CTA with arrow
- Distinctive design that stands out from generic e-commerce sites
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Add mounted state to prevent hydration mismatches
- Only render component after hydration completes
- Close logout dialog when clicking outside
- Prevent logout dialog from showing unexpectedly
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
Use empty dependency array to ensure clear() runs once on mount.
Add logging and also clear isCheckingOut flag.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
Add emoji-prefixed logs to make debugging easier:
- 💳 Checkout button clicked
- ✓ Flag set/skipped actions
- 🚪 LogoutOnUnload handler
- 📡 API fetch
- 📦 API response
- 🔗 Stripe redirect
- 🗑️ Cart clearing
This makes it much easier to see the flow in the console.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
Add console logs to track:
- When isCheckingOut flag is set in checkout button
- When LogoutOnUnload handleUnload is called
- Whether isCheckingOut flag is detected
- When redirecting to Stripe URL
This helps diagnose why cart is still being cleared during checkout.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
Use sessionStorage flag to prevent LogoutOnUnload from clearing cart and logging
out when navigating to Stripe checkout.
Changes:
- Checkout button sets 'isCheckingOut' flag in sessionStorage before API call
- LogoutOnUnload checks this flag and skips logout if checkout in progress
- Flag is removed if API returns an error
- Flag persists during navigation to Stripe URL
This ensures cart and login persist through Stripe payment flow.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
Critical fix: Don't clear cart or logout when navigating to Stripe checkout.
The issue was:
1. User clicks 'Continue to payment'
2. API call to /api/checkout succeeds
3. Client redirects to Stripe URL with window.location.href
4. This triggers beforeunload event
5. LogoutOnUnload component logs out and clears cart
6. User is logged out and cart is empty during checkout
Solution:
- Detect when /api/checkout is being called
- Set isCheckingOut flag
- Skip logout/cart-clear in beforeunload if checkout in progress
- User stays logged in and cart persists through Stripe flow
This allows logout on browser close but not during payment navigation.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Move 'Admin login activity' from Financial submenu to top-level Admin menu
- Move 'Customer login activity' from Financial submenu to top-level Admin menu
- Keep Financial menu focused on accounting: Accounts, Reports, Bank Reconciliation, Audit Trail
- Login activity now easier to access at main menu level
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Create DownloadPhotoButton component for downloading customer photos
- Add download button before 'Start a design for this' button
- Allows admin to save photo locally for editing in design software before approval
Addresses user request: admin should be able to download photo from request
for editing before uploading final design to the approval flow.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Create LoginPromptModal component for authentication encouragement
- Check customer authentication before adding items to cart
- Show modal for non-logged-in users with options to create account, log in, or continue as guest
- Allow guests to add items (stored in IndexedDB) while prompting to sign up
- Implemented in both StandardProductView (ready-made products) and DesignCanvas (personalized items)
- Add server action checkCustomerAuth() for authentication checks
Addresses user request: prompt guests to create account or log in when adding items to cart.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Clear cart when customer logs out
- Hide cart bag button for non-authenticated users (only show for logged-in customers)
- Fix dark mode text visibility in all form inputs (input/textarea/select elements)
Addresses user request: cart should clear on logout and only be accessible to logged-in customers.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Create LogoutOnUnload component that triggers logout on page close
- Uses beforeunload/unload events with navigator.sendBeacon() for reliability
- Create /api/logout endpoint that clears both admin and customer sessions
- Add LogoutOnUnload to root layout so it runs on all pages
- Works for both admin and customer users
Behavior:
- When user closes browser tab/window, logout happens automatically
- Session cookies are cleared via API endpoint
- Improves security by preventing session hijacking from closed windows
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Add colorNames utility with 80+ standard color names
- Map hex codes to human-readable names (Black, Navy, Red, Teal, etc)
- Display color names in product page (with hex tooltip for reference)
- Show selected color name below color swatches
- Update shopping cart to display color names instead of hex codes
- Admin color picker shows both name and hex code for clarity
Improves UX for customers who don't understand hex color codes.
Keeps hex codes for internal data and system tooltips.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Grouped accounts, reports, reconciliation, and audit logs under one menu
- All 6 financial tools now accessible from expandable Financial submenu
- Cleaner admin navigation with collapsible sections
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Add FinancialAuditLog model to track all financial changes
- Log action (CREATE, UPDATE, DELETE) with before/after values
- Capture who made changes (IP address)
- Record timestamp and reason for change
- Create /admin/financial-audit page to view audit trail
- Add filtering by entity type, action, date range
- Show summary stats (total changes, deletions, etc)
- Integrate with purchases: log create and delete operations
- Red-flag deletions for security awareness
- Add "Financial audit trail" link to admin menu
This provides foundation for Phase 2 (reporting UI) and Phase 3 (bank reconciliation).
All financial changes are now traceable and auditable for compliance.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Add CustomerLoginLog model to track customer login attempts
- Record successful and failed customer logins
- Capture email, IP address, and user agent for each attempt
- Create /admin/customer-login-logs page to view activity
- Show login stats (successes, failures, active customers)
- Display browser/device and IP for each login attempt
- Add "Customer login activity" link to admin menu
- Monitor customer access patterns and detect suspicious activity
- Last 30 days active customer count
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Add AdminLoginLog model to track all login attempts
- Record successful and failed login attempts
- Capture IP address and user agent for each login
- Create /admin/login-logs page to view activity history
- Show login stats (successes, failures, last 30 days)
- Display browser/device and IP for each login
- Add "Login activity" link to admin menu
- Useful for security auditing and monitoring access
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Install pdf-parse and tesseract.js for PDF/image processing
- Create /api/admin/parse-invoice endpoint to extract line items from invoices
- Parser extracts quantity and description from invoice text
- Attempts to match extracted items to products in database
- Update PurchaseForm with "Extract items" button
- Pre-fill purchase form with parsed items (user can edit/add more)
- Supports PDF files and image scans (JPG, PNG, etc)
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Import and use existing AdminMenu component instead of simple link
- Displays dropdown menu with all admin section links when clicked
- Includes logout button in admin menu
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Check isAdminAuthenticated() in Header component
- Show 'Admin' link to /admin/orders when user is logged in as admin
- Allows quick navigation to admin section after login
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
Hide admin interface completely from public site. Admins access /admin/login
directly. Cleaner separation between customer-facing UI and back office.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
