update

src/App.js

@@ -22,25 +22,25 @@ import Feedback from "./components/Feedback/index";
 function App() {
   return (
     <div className="App">
-      <ProductDesign />
+      {/* <ProductDesign /> */}
-      <VodProductDesign />
+      {/* <VodProductDesign /> */}
-      <BookDesign />
+      {/* <BookDesign /> */}
-      <ButtonDesign />
+      {/* <ButtonDesign /> */}
-      <ProductTags />
+      {/* <ProductTags /> */}
-      <CounterDesign />
+      {/* <CounterDesign /> */}
-      <BlogDesign1 />
+      {/* <BlogDesign1 /> */}
-      <BlogDesign2 />
+      {/* <BlogDesign2 /> */}
-      <BlogDesign3 />
+      {/* <BlogDesign3 /> */}
-      <BlogDesign4 />
+      {/* <BlogDesign4 /> */}
-      <BlogDesign5 />
+      {/* <BlogDesign5 /> */}
-      <BlogDesign6 />
+      {/* <BlogDesign6 /> */}
-      <HeaderDesign1 />
+      {/* <HeaderDesign1 /> */}
-      <ContactInfoSection />
+      {/* <ContactInfoSection /> */}
       <FooterDesign1 />
       {/* <Testttt /> */}
-      <Design2D />
+      {/* <Design2D /> */}
-      <Features />
+      {/* <Features /> */}
-      <Feedback />
+      {/* <Feedback /> */}
     </div>
   );
 }

src/components/footer/design1/FooterDesign1.js

@@ -7,17 +7,22 @@ import samandehi from "../../../assets/images/samandehi-pic.svg";
 
 import lightBlueLine from "../../../assets/icons/light-blue-line.svg";
 
-const FooterDesign1 = ({ footerItems }) => {
+const FooterDesign1 = ({ footerItems, array }) => {
   return (
     <footer className="p-6 flex flex-col md:flex-row justify-around items-start md:items-start relative">
       <div className="flex items-start">
-        <ul className="mr-10">
+        {array.map((item, index) => (
-          {footerItems.map((footerItem, index) => (
+          <ul className="mr-10" key={index}>
-            <li className="font-light text-xs leading-7 footer-items">
+            {item.footerItems.map((footerItem, index) => (
+              <li
+                className="font-light text-xs leading-7 footer-items"
+                key={index}
+              >
                 <a href="#">{footerItem.name}</a>
               </li>
             ))}
           </ul>
+        ))}
       </div>
       <div className="flex items-center mt-10 md:mt-0">
         <img src={enamad} alt="" className="w-28 ml-10" />
@@ -36,6 +41,8 @@ const FooterDesign1 = ({ footerItems }) => {
 export default FooterDesign1;
 
 FooterDesign1.defaultProps = {
+  array: [
+    {
       footerItems: [
         {
           name: "لینک های اصلی",
@@ -50,4 +57,51 @@ FooterDesign1.defaultProps = {
           name: "پرسش های متداول",
         },
       ],
+    },
+    {
+      footerItems: [
+        {
+          name: "لینک های اصلی",
+        },
+        {
+          name: "فروشگاه",
+        },
+        {
+          name: "در باره ما",
+        },
+        {
+          name: "پرسش های متداول",
+        },
+      ],
+    },
+    {
+      footerItems: [
+        {
+          name: "لینک های اصلی",
+        },
+        {
+          name: "فروشگاه",
+        },
+        {
+          name: "در باره ما",
+        },
+        {
+          name: "پرسش های متداول",
+        },
+      ],
+    },
+    {
+      footerItems: [
+        {
+          name: "لینک های اصلی",
+        },
+        {
+          name: "فروشگاه",
+        },
+        {
+          name: "در باره ما",
+        },
+      ],
+    },
+  ],
 };