Initial Changes

app/products/premium-rudraksha-consultation-astrology/page.jsx

@@ -1,26 +1,62 @@
-import PremiumBanner from '@/components/premium-rudraksha/PremiumBanner'
-import PremiumBannerLast from '@/components/premium-rudraksha/PremiumBannerLast'
-import PremiumBannerOne from '@/components/premium-rudraksha/PremiumBannerOne'
-import PremiumBannerTwo from '@/components/premium-rudraksha/PremiumBannerTwo'
-import PremuimBannerThree from '@/components/premium-rudraksha/PremuimBannerThree'
-import React from 'react'
+import PremiumBanner from "@/components/premium-rudraksha/PremiumBanner";
+import PremiumBannerLast from "@/components/premium-rudraksha/PremiumBannerLast";
+import PremiumBannerOne from "@/components/premium-rudraksha/PremiumBannerOne";
+import PremiumBannerTwo from "@/components/premium-rudraksha/PremiumBannerTwo";
+import PremuimBannerThree from "@/components/premium-rudraksha/PremuimBannerThree";
+import { categoriesForPremiumThree, services } from "@/utils";
+import { backendUrl, serAxios } from "@/utils/axios";
+import React from "react";
 
 export const metadata = {
   title: "Premium Rudraksha Consultation Astrology",
   description: "Generated by create next app",
 };
 
+const getConsultantPageData = async () => {
+  // Fetch data from external API
+  try {
+    const res = await serAxios.get("/dynamic-ui/page/consultation/");
+    const data = res.data;
+    return data.data;
+  } catch (error) {
+    console.error("Error fetching data:", error);
+    return null;
+  }
+  // Pass data to the page via props
+};
 
-const Page = () => {
+async function Page() {
+  const data = await getConsultantPageData();
   return (
     <div>
-      <PremiumBanner />
-      <PremiumBannerOne />
-      <PremiumBannerTwo />
-      <PremuimBannerThree />
-      <PremiumBannerLast />
+      <PremiumBanner data={data} />
+      <PremiumBannerOne data={data} />
+      <PremiumBannerTwo data={data} />
+      <PremuimBannerThree
+        data={data}
+        categoriesForPremiumThree={
+          data?.consultation_reasons?.map((item, index) => ({
+            title: item.title,
+            description: item.description,
+            logo: (
+              <img src={`${backendUrl}${item.image?.path}`} alt={item.title} />
+            ),
+          })) ?? categoriesForPremiumThree
+        }
+      />
+      <PremiumBannerLast
+        services={data?.perks?.map((item) => ({
+          title: item.title,
+          description: item.description,
+          imageUrl: [
+            `${backendUrl}${item.image1?.path}`,
+            `${backendUrl}${item.image2?.path}`,
+          ],
+        }))}
+        data={data}
+      />
     </div>
-  )
+  );
 }
 
-export default Page
+export default Page;