amirhosein.ashourlooandClaude Sonnet 5
66f92b634e
- Real in-site login/register (password + SMS OTP) against Meshkee's /auth API, with self-healing access-token refresh (15 min lifetime) and an in-flight-refresh guard so AuthContext and CartContext don't race each other into a failed concurrent refresh. - Real cart: header cart button/badge, a cart popup, and a working "add to cart" on both product cards (where a specific variant id is known) and the product/store-item detail buy-box (always resolves a purchasable variant, even for single-SKU products with no selectable variation). - /checkout: address + cash/bank-transfer payment, posts to the real checkout API and creates an order; refreshes the cart afterward so the header badge doesn't go stale. - New /store-items and /store-items/[id] pages (variant-level browsing, separate from the product-level /products catalog), cross-referencing the parent product for images/description/technical-info. - Product gallery: click-to-open fullscreen lightbox alongside the existing hover-zoom. - Comments tab wired to the real comments API, gated to logged-in users (a product decision — the API itself doesn't require auth) with a login prompt otherwise. - Similar-products row on product/store-item detail pages. - Contact page wired to the real contact-submissions API, with a toast and inline confirmation on success, and the form resetting. - CONTEXT.md: a maintained architecture/conventions doc for this repo, now auto-loaded via CLAUDE.md, covering the Meshkee integration quirks and UI conventions established across this project. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
27 lines
858 B
TypeScript
27 lines
858 B
TypeScript
"use client";
|
|
|
|
import { useAuth } from "@/context/AuthContext";
|
|
import { useCart } from "@/context/CartContext";
|
|
|
|
export function CartButton() {
|
|
const { user } = useAuth();
|
|
const { itemCount, openPopup } = useCart();
|
|
const { openLoginModal } = useAuth();
|
|
|
|
return (
|
|
<button
|
|
type="button"
|
|
onClick={user ? openPopup : openLoginModal}
|
|
className="relative flex items-center gap-1.5 rounded-lg border border-border px-3 py-2 transition-colors hover:border-red hover:text-red"
|
|
>
|
|
<span aria-hidden>🛒</span>
|
|
<span className="hidden sm:inline">سبد خرید</span>
|
|
{itemCount > 0 && (
|
|
<span className="absolute -top-1.5 -left-1.5 flex h-5 min-w-5 items-center justify-center rounded-full bg-red px-1 text-[10px] font-bold text-white">
|
|
{itemCount}
|
|
</span>
|
|
)}
|
|
</button>
|
|
);
|
|
}
|