update

src/App.js

@@ -58,16 +58,16 @@ function App() {
         {/* <Testttt /> */}
         {/* <Design2D /> */}
         {/* <Features /> */}
-        {/* <Feedback /> */}
+        <Feedback />
         {/* <Alert /> */}
         {/* <Toast /> */}
-        {/* <ProductSuggestion /> */}
+        <ProductSuggestion />
         {/* <ProductImage /> */}
-        {/* <ProductTab /> */}
+        <ProductTab />
         {/* <ProductStatusCard /> */}
-        <AdvertisementDesign1 />
+        {/* <AdvertisementDesign1 /> */}
-        <AdvertisementDesign2 />
+        {/* <AdvertisementDesign2 /> */}
-        <AdvertisementDesign3 />
+        {/* <AdvertisementDesign3 /> */}
       </div>
     </Provider>
   );

src/components/ProductSuggestion/index.js

@@ -19,6 +19,7 @@ const ProductSuggestion = ({ suggestions, selected }) => {
             <div
               className={`flex flex-col items-center border rounded-md border-gray-300 p-5 mx-4 cursor-pointer transition-all ease-in-out duration-500
                 ${selectedProduct === suggestion ? "bg-white" : ""}`}
+              onClick={() => setSelectedProduct(suggestion)}
             >
               <img
                 src={suggestion.productImage}
@@ -32,12 +33,16 @@ const ProductSuggestion = ({ suggestions, selected }) => {
                 {suggestion.productPrice}
                 <span className="mr-1 text-xs text-black">تومان</span>
               </p>
-              <div className="flex flex-col items-center mt-3">
+              <div className="flex flex-col items-center">
-                {suggestion.selected && (
+                {/* {suggestion.selected && (
                   <span className="text-xs">انتخاب شما</span>
+                )} */}
+                {selectedProduct === suggestion && (
+                  <span className="text-xs mt-2">انتخاب شما</span>
                 )}
                 <input
-                  checked={suggestion.selected}
+                  // checked={suggestion.selected}
+                  checked={selectedProduct === suggestion ? true : false}
                   onClick={() => setSelectedProduct(suggestion)}
                   className="checkbox-input mt-4 cursor-pointer w-4 h-4"
                   type="checkbox"
@@ -79,28 +84,28 @@ ProductSuggestion.defaultProps = {
       productTitle: "لپ تاپ گیمینگ ایسوس",
       productPrice: "750000",
       plusIcon: null,
-      selected: true,
+      // selected: true,
     },
     {
       productImage: productImg,
       productTitle: "مانیتور 40 اینچ",
       productPrice: "3.000.000",
       plusIcon: plus,
-      selected: false,
+      // selected: true,
     },
     {
       productImage: productImg,
       productTitle: "ماوس گیمینگ",
       productPrice: "650/000",
       plusIcon: plus,
-      selected: false,
+      // selected: false,
     },
     {
       productImage: productImg,
       productTitle: "لپ تاپ مک بوک پرو 2022",
       productPrice: "2000",
       plusIcon: plus,
-      selected: false,
+      // selected: false,
     },
   ],
 };