handle max stock

src/components/ProductDetails/ProductDetails.jsx

   }
 
   const handleIncrement = () => {
-    setQuantity((prevQuantity) => prevQuantity + 1);
+    setQuantity((prevQuantity) => (prevQuantity >= variantSelection.quantityAvailable ? variantSelection.quantityAvailable : prevQuantity + 1));
   };
 
   const handleDecrement = () => {
           <Typography
             variant="body1"
           >
-            IN STOCK: {`${variantSelection?.quantityAvailable}`}
+            {(variantSelection?.quantityAvailable == 0) ? <span style={{color:"red", fontWeight:"bolder"}}>{`OUT OF STOCK`}</span> : `IN STOCK: ${variantSelection?.quantityAvailable}`}
           </Typography>
         </Box>
 
               variant="contained"
               color="primary"
               sx={{ width: "35px" }}
-              disabled={variantSelection?.quantityAvailable == 0}
+              disabled={variantSelection?.quantityAvailable == 0 || quantity == 1}
               onClick={handleDecrement}
             >
               <RemoveIcon />
               variant="contained"
               color="primary"
               sx={{ width: "35px" }}
-              disabled={variantSelection?.quantityAvailable == 0}
+              disabled={variantSelection?.quantityAvailable == 0 || quantity == variantSelection?.quantityAvailable}
               onClick={handleIncrement}
             >
               <AddIcon />