ianshaloom 1ea527ca1f feat(admin): implement product image upload & gallery management (Plan 04) ...

- Add Next.js API route for server-side Cloudinary upload with structured
  public_id (the-pet-loft/products/{id}/main|gallery-n) and asset_folder
  for portal folder visibility in dynamic folder mode
- Add background removal flow via Image Processing API with side-by-side
  original vs processed preview (Skeleton while loading)
- Dual upload buttons: processed (background removed) or original file
- Horizontal drag-and-drop image gallery using @dnd-kit/sortable with
  horizontalListSortingStrategy; reorder persisted via reorderImages mutation
- Per-image delete with AlertDialog confirmation
- 180° rotation technique for card layout: drag handle top, image center,
  delete bottom
- Debounced product search (300 ms) with inline results (max 3); clears
  gallery state when search input is cleared
- Install: cloudinary, @dnd-kit/core/sortable/utilities, embla-carousel-react,
  ShadCN carousel component
- Configure next.config.js with Cloudinary remote image pattern
- Mark checklist items 3.5 and 3.6 complete

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

2026-03-06 06:45:03 +03:00

648 KiB

Raw Blame History

View Raw