crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-05-16 14:36:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

Disables Add to Cart while mutating

Browse Source
This commit is contained in:
Michael Novotny 2023-04-24 15:17:38 -05:00
parent c2b96d6e2f
commit d37b0cca7d
No known key found for this signature in database
1 changed files with 9 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/product/add-to-cart.tsx
View File

@ -1,5 +1,6 @@
'use client';
import clsx from 'clsx';
import { useRouter, useSearchParams } from 'next/navigation';
import { useEffect, useState, useTransition } from 'react';
@ -62,10 +63,15 @@ export function AddToCart({
return (
<button
aria-label="Add item to cart"
disabled={isMutating}
onClick={handleAdd}
className={`${
availableForSale ? 'opacity-90 hover:opacity-100' : 'cursor-not-allowed opacity-60'
} flex w-full items-center justify-center bg-black p-4 text-sm uppercase tracking-wide text-white dark:bg-white dark:text-black`}
className={clsx(
'flex w-full items-center justify-center bg-black p-4 text-sm uppercase tracking-wide text-white opacity-90 hover:opacity-100 dark:bg-white dark:text-black',
{
'cursor-not-allowed opacity-60': !availableForSale,
'cursor-not-allowed': isMutating
}
)}
>
<span>{availableForSale ? 'Add To Cart' : 'Out Of Stock'}</span>
{isMutating ? <LoadingDots className="bg-white dark:bg-black" /> : null}