feat: add customer authentication and order dashboard

components/QuantityControl.tsx

@@ -7,11 +7,13 @@ import {useAppDispatch, useAppSelector} from '@/store/hooks';
 import {addToCart, decrementQty} from '@/store/cartSlice';
 import {useLanguage} from '@/app/context/LanguageContext';
 import {commerceCopy} from '@/data/commerce';
+import {useAuth} from '@/app/context/AuthContext';
 
 export default function QuantityControl({product}: {product: CartProduct}) {
     const dispatch = useAppDispatch();
     const {locale} = useLanguage();
     const copy = commerceCopy[locale];
+    const auth = useAuth();
     const quantity = useAppSelector(state => state.cart.items.find(item => item.id === product.id)?.qty ?? 0);
 
     return (
@@ -19,14 +21,17 @@ export default function QuantityControl({product}: {product: CartProduct}) {
              className="inline-flex items-center gap-3 rounded-xl border border-subtle bg-page p-1" dir="ltr">
             <Button icon={<MinusOutlined/>} disabled={quantity === 0}
                     aria-label={`${copy.decrease}: ${product.name}`}
-                    onClick={() => dispatch(decrementQty(product.id))}/>
+                    onClick={() => auth.isAuthenticated ? dispatch(decrementQty(product.id)) : auth.openLogin()}/>
             <span aria-live="polite" aria-atomic="true" className="min-w-8 text-center font-bold text-primary">
                 {quantity.toLocaleString(locale === 'fa' ? 'fa-IR' : 'en-US')}
             </span>
             <Button type="primary" icon={<PlusOutlined/>}
                     aria-label={`${copy.increase}: ${product.name}`}
-                    onClick={() => dispatch(addToCart({id: product.id, name: product.name, image: product.image,
-                        priceLabel: product.priceLabel, priceNumeric: product.priceNumeric}))}/>
+                    onClick={() => {
+                        const add = () => dispatch(addToCart({id: product.id, name: product.name, image: product.image,
+                            priceLabel: product.priceLabel, priceNumeric: product.priceNumeric}));
+                        if (auth.isAuthenticated) add(); else auth.openLogin(add);
+                    }}/>
         </div>
     );
 }