Cart error messages

pages/store/cart.js

@@ -10,7 +10,8 @@ import Table from '~/components/table'
 export default function Cart(){
   const [cart, setCart] = useCart()
   const numItems = (cart?.items) ? cart.items.length : 0
-  const allInStock = !cart?.items.some(item => !item.number_in_stock || item.number_in_stock < 1)
+  const allInStock = !cart?.items.some(item => !item.item.number_in_stock || item.item.number_in_stock < 1)
+  const allHaveEnough = !cart?.items.some(item => item.count > item.item.number_in_stock)
 
   const handleRemove = id => async ev => {
     if(ev) ev.preventDefault()
@@ -36,6 +37,7 @@ export default function Cart(){
                 <>
                   <Link href={`/store/item/${row.item.urlslug}`}><a>{row.item.name}</a></Link>
                   {(!row.item.number_in_stock || row.item.number_in_stock < 1) && <strong style={{marginLeft: '6px'}}>Out of stock</strong>}
+                  {(row.item.number_in_stock > 0 && row.count > row.item.number_in_stock) && <strong style={{marginLeft: '6px'}}>Not enough in stock</strong>}
                 </>
               )},
               {name: 'Quantity in Cart', extractor: row => row.count},
@@ -72,7 +74,18 @@ export default function Cart(){
       }
 
       <FormController>
-        <Button enabled={!!(cart?.items?.length) && allInStock} type="submit">Proceed to Checkout</Button>
+        {(()=>{
+          if(!(cart?.items?.length))
+            return <Button enabled={false} type="submit">No items in cart</Button>
+
+          if(!allInStock)
+            return <Button enabled={false} type="submit">Items out of stock</Button>
+
+          if(!allHaveEnough)
+            return <Button enabled={false} type="submit">Not enough stock</Button>
+
+          return <Button type="submit">Proceed to Checkout</Button>
+        })()}
       </FormController>
     </>
   )