meta-handbags

As a user, I want to view an elegant home page featuring the Captainmarvel brand, a 3D rotating handbag carousel, a luxurious hero video banner showcasing models at Dubai landmarks, and a call-to-action 'Shop the Collection' button. Implement micro-interactions (gold shimmer on buttons, heart-pulse wishlist icon) and gold-accented Captainmarvel branding in header/footer. Based on the existing Home (v3) JSX design. Links to Shop page.

As a user, I want to sign in to my account via the Login page so that I can access personalized features like wishlist and order history. Implement based on the existing Login (v2) JSX design. On successful login, admin users are routed to Dashboard Overview; regular users are routed to the Home page. Includes form validation and error handling.

As a user, I want to browse handbags by categories (tote bags, crossbody bags, shoulder bags, etc.) and filter products so that I can quickly find what I want. Implement based on the existing Shop (v2) JSX design. Page flows from Home → Shop → Filter → Product Detail. Displays promotions and discounts.

As a user, I want to view detailed product information including images, price, description, and a 360-degree modal view so that I can make an informed purchase decision. Implement based on the existing Product (v1) JSX design. Users can add to cart or wishlist from this page. Links from Shop and links to Cart.

As a user, I want to review items in my shopping cart, update quantities, and proceed to checkout so that I can complete my purchase. Implement based on the existing Cart (v2) JSX design. Flows from Product Detail → Cart → Checkout.

As an admin, I want to view a high-level overview of store performance (orders, revenue, product stats) on the Dashboard so that I can monitor business health. Implement based on the existing Dashboard (v1) JSX design. Links to Products, Orders, and Reviews management pages.

As a user, I want to securely complete my purchase with card payment so that I can receive my handbag. Implement based on the existing Checkout (v1) JSX design. Includes order summary, shipping details form, and payment integration placeholder. Flows from Cart → Checkout → Order confirmation.

As an admin, I want to manage product listings and add new products so that the catalog stays up to date. Implement based on the existing Products (v2) JSX design. Includes product list view, add/edit/delete product forms, and category management. Flows: Dashboard → Products → Add Product.

As an admin, I want to view and process customer orders so that I can fulfill purchases efficiently. Implement based on the existing Orders (v2) JSX design. Includes order list, status updates, and order detail view. Flows: Dashboard → Orders → Process Order.

As an admin, I want to manage customer reviews and respond to feedback so that I can maintain product quality and trust. Implement based on the existing Reviews (v1) JSX design. Includes review list, approve/reject controls, and response input. Flows: Dashboard → Reviews.

As a user, I want to use a backend API to save and retrieve my wishlist so that I can keep track of favorite handbags. Implement FastAPI endpoints: POST /wishlist, GET /wishlist, DELETE /wishlist/{product_id}.

As a user, I want to contact customer support via WhatsApp or live chat before making a purchase so that I can get help quickly. Integrate WhatsApp click-to-chat button and/or a chat widget on the frontend (Home, Product, Cart pages). Configure backend webhook for chat notifications if needed.

As a user, I want to use a backend API for browsing and filtering products by category so that the Shop and Product Detail pages display live catalog data. Implement FastAPI endpoints: GET /products, GET /products/{id}, POST /products (admin), PUT /products/{id} (admin), DELETE /products/{id} (admin). Supports category filtering and pagination.

As a user, I want to use a backend API for managing my cart and completing checkout so that purchases are securely processed. Implement FastAPI endpoints: POST /cart, GET /cart, DELETE /cart/{item_id}, POST /orders (create order), GET /orders/{id}. Integrates with payment gateway for card transactions.

As a user, I want to use a backend API to read and submit product reviews so that I can share and view feedback. Implement FastAPI endpoints: GET /reviews?product_id=, POST /reviews, PUT /reviews/{id} (admin), DELETE /reviews/{id} (admin).

As a user, I want to browse the website in English or Arabic so that the platform is accessible to both local and international customers. Implement i18n support using react-i18next, add language toggle in the header, and provide Arabic translations for all UI text. Ensure RTL layout support for Arabic.

As an admin, I want to use a backend API to view and process orders so that I can manage fulfillment efficiently. Implement FastAPI endpoints: GET /admin/orders, GET /admin/orders/{id}, PATCH /admin/orders/{id}/status.

As a user, I want to use a secure payment backend API for card transactions so that I can safely purchase handbags. Integrate a payment gateway (e.g., Stripe or similar) with FastAPI. Implement POST /payments/create-intent and POST /payments/confirm. Ensure SSL and PCI compliance as per UAE e-commerce regulations.

As a user, I want to view promotions and discounts on the homepage and shop pages so that I can take advantage of deals. Implement a promotions banner component on Home and Shop pages. Add backend API: GET /promotions (admin: POST/PUT/DELETE). Connect to Admin dashboard for promotion management.