Fix(JSX) Added props for checked

ViktorSvertoka · Oct 12, 2023 · 0eb1418 · 0eb1418
1 parent 6d3eed8
commit 0eb1418
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/src/components/CarItem/CarItem.jsx b/src/components/CarItem/CarItem.jsx
@@ -46,7 +46,11 @@ export default function CarItem({ data, favoritesCars, setFavoritesCars }) {
   return (
     <Wrapper>
       <ImageWrap>
-        <HeartIcon id={data.id} toggleFavorite={toggleFavorite} />
+        <HeartIcon
+          id={data.id}
+          toggleFavorite={toggleFavorite}
+          isFavorite={isCarInFavorites}
+        />
         <Image src={data.img} alt="Car" />
       </ImageWrap>
       <TitleWrap>

diff --git a/src/components/HeartIcon/HeartIcon.jsx b/src/components/HeartIcon/HeartIcon.jsx
@@ -2,14 +2,15 @@ import Checkbox from '@mui/material/Checkbox';
 import { HeartFill, HeartStroke, HeartWrap } from './HeartIcon.styled';
 const label = { inputProps: { 'aria-label': 'Checkbox demo' } };
 
-export default function HeartIcon({ toggleFavorite, id }) {
+export default function HeartIcon({ toggleFavorite, id, isFavorite }) {
   return (
     <HeartWrap>
       <Checkbox
         {...label}
         icon={<HeartStroke />}
         checkedIcon={<HeartFill />}
         onChange={() => toggleFavorite(id)}
+        checked={isFavorite}
       />
     </HeartWrap>
   );