small fixed

src/components/CartPage/CartItem.js

@@ -19,10 +19,8 @@ const {
 } = require('@mui/material');
 
 export const CartItem = ({ order, onDeleteClick }) => {
-    const {
-        good: { _id, images = [], name = '', price = 0 },
-        count = 1,
-    } = order || {};
+    const { good, count = 1 } = order || {};
+    const { _id, images = [], name = '', price = 0, amount = 1 } = good;
 
     const dispatch = useDispatch();
     const [countInput, setCountInput] = useState(count || 1);
@@ -32,11 +30,11 @@ export const CartItem = ({ order, onDeleteClick }) => {
     }, [count]);
 
     useEffect(() => {
-        dispatch(actionCartChange({ _id, name, images, price }, +countInput));
+        dispatch(actionCartChange(good, +countInput));
     }, [countInput]);
 
     const handleChange = (count) => {
-        if (count >= 0 && count <= 99) {
+        if (count >= 0 && count <= 99 && count <= amount) {
             setCountInput(+count);
         }
     };
@@ -61,7 +59,7 @@ export const CartItem = ({ order, onDeleteClick }) => {
                     <IconButton onClick={() => handleChange(countInput - 1)}>
                         <AiOutlineMinus />
                     </IconButton>
-                    <Typography >{countInput}</Typography>
+                    <Typography>{countInput}</Typography>
                     <IconButton onClick={() => handleChange(countInput + 1)}>
                         <AiOutlinePlus />
                     </IconButton>

src/components/CartPage/index.js

@@ -56,7 +56,6 @@ export const CartPage = () => {
                     onSubmit={(order) => {
                         const orderToSubmit = order;
                         orderToSubmit.orderGoods = Object.values(cart);
-                        console.log(orderToSubmit);
                         dispatch(actionOrderUpsert(orderToSubmit));
                     }}
                 />

src/components/GoodPage/index.js

@@ -11,21 +11,21 @@ export const GoodPage = () => {
     const { _id = '', name = '', price = '', description = '', images = [] } = good || {};
     return (
         <Box className="GoodPage">
-            <Grid container spacing={4} className="images" >
+            <Grid container spacing={4} className="images">
                 <Grid item xs={12} md={4}>
-                    <Carousel showIndicators={false} showStatus={false}>
+                    <Carousel showIndicators={false} showStatus={false} showArrows={true}>
                         {(good.images || [{ url: defaultGoodImage }]).map((image) => (
                             <img src={image?.url ? `${image?.url}` : defaultGoodImage} />
                         ))}
                     </Carousel>
                 </Grid>
-                <Grid item xs={12} md={8} className="content" >
+                <Grid item xs={12} md={8} className="content">
                     <Stack spacing={2}>
                         <Stack direction="row" alignItems="center" spacing={2}>
                             <Typography variant="body1" color="#1C1B1F">
                                 <b>Ціна:</b> {price}
                             </Typography>
-                            <CBuyButton good={{ name, images, price, _id }} />
+                            <CBuyButton good={good} />
                         </Stack>
                         <Divider />
                         <Typography variant="h5">

src/components/LayoutPage/index.js

@@ -20,7 +20,6 @@ import { MainPage } from '../MainPage';
 const GoodsPageContainer = () => {
     const params = useParams();
     const dispatch = useDispatch();
-    console.log(params);
     dispatch(actionCatById({ _id: params._id }));
 
     return <CGoodsPage />;

src/components/common/BuyButton/index.js

@@ -15,10 +15,14 @@ export const BuyButton = ({ onClick, onDeleteClick, good, cart }) => {
                 <Button onClick={() => onDeleteClick(good)} variant="outlined">
                     Вже у кошику
                 </Button>
-            ) : (
+            ) : good.amount > 0 ? (
                 <Button onClick={() => onClick(good)} variant="contained" className="button">
                     Купити
                 </Button>
+            ) : (
+                <Button disabled variant="contained" className="button">
+                    Немає в наявності
+                </Button>
             )}
         </Box>
     );

src/index.scss

@@ -8,7 +8,6 @@
   text-decoration: none;
 }
 
-
 .AuthPage{
 
   display: flex;
@@ -31,12 +30,14 @@
       border:1px solid #C9C5CA!important;
     }
   }
+
 }
 
 .GoodCard{
 
   & .BuyButton{
     margin-left: auto;
+    white-space: nowrap;
   }
 }