Initial Changes

app/page.js

@@ -4,16 +4,40 @@ import HeroSix from "@/components/hero-page/HeroSix";
 import SecondGallery from "@/components/product-category/SecondGallery";
 import BannerSlider from "@/components/sliders/BannerSlider";
 import SliderTwo from "@/components/sliders/SliderTwo";
+import { backendUrl, serAxios } from "@/utils/axios";
+import { guranteeData, categories } from "@/utils";
 
-export default function Home() {
+const getDashboardData = async () => {
+  // Fetch data from external API
+  try {
+    const res = await serAxios.get('/dynamic-ui/page/dashboard/')
+    const data = res.data
+    return data.data
+  } catch (error) {
+    return null
+  }
+  // Pass data to the page via props
+}
+export default async function Home({ page }) {
+  const data = await getDashboardData();
   return (
     <>
-      <Hero />
-      <HeroFour />
-      <HeroSix />
-      <BannerSlider />
+      <Hero data={data ? data.images.map((image) => ({
+        type: "image",
+        src: `${backendUrl}${image.path}`,
+      })) : null} />
+      <HeroFour data={data} />
+      <HeroSix data={data} guranteeData={data?.org_item?.map((item, index) => ({
+        id: index,
+        title: item.title,
+        imageUrl: `${backendUrl}${item.image?.path}`,
+      })) ?? guranteeData} />
+      <BannerSlider data={data} categories={data?.discover_item?.map((item) => ({
+        title: item.title,
+        image: `${backendUrl}${item.image?.path}`,
+      })) ?? categories} />
       <SliderTwo />
-      <SecondGallery />
+      <SecondGallery data={data} />
     </>
   );
 }