Initial Changes

components/hero-page/Hero.jsx

@@ -14,7 +14,8 @@ import Autoplay from "embla-carousel-autoplay";
 import Link from "next/link";
 import { ArrowRight } from "lucide-react";
 
-const Hero = () => {
+const Hero = ({ data }) => {
+  console.log(data);
   const plugin = React.useRef(
     Autoplay({ delay: 4000, stopOnInteraction: true })
   );
@@ -32,7 +33,7 @@ const Hero = () => {
     return () => window.removeEventListener("resize", checkMobile);
   }, []);
 
-  const heroData = [
+  const heroData = data || [
     {
       type: "image",
       src: "/rudraksh banner image 2.avif",
@@ -84,7 +85,6 @@ const Hero = () => {
                   className="object-cover brightness-75"
                   priority={index === 0}
                 />
-
               </div>
             </CarouselItem>
           ))}

components/hero-page/HeroFour.jsx

@@ -1,20 +1,21 @@
 import React from "react";
 
-const HeroFour = () => {
+const HeroFour = ({ data }) => {
+  const { header1, description1, video_link1 } = data ?? {};
   return (
     <div className="min-h-[70vh] mt-10 pb-14 sm:px-6 lg:px-8">
       <div className="max-w-8xl mx-auto">
         <div className="text-center mb-12">
           <h1 className="font-serif text-5xl text-slate-800 mb-4">
-            Explore Gupta Rudraksha
+            {header1 ?? "Explore Gupta Rudraksha"}
           </h1>
           <h2 className="text-xl text-slate-700">
-            Dive deep with us in our Gupta Rudraksha Journey and our get to know
-            us even more better.
+            {description1 ??
+              "Dive deep with us in our Gupta Rudraksha Journey and our get to know us even more better."}
           </h2>
         </div>
         <iframe
-          src="https://www.youtube.com/embed/_drMO01Mjtc"
+          src={`${video_link1 ?? "https://www.youtube.com/embed/_drMO01Mjtc"}`}
           title="Rudraksha &amp; It’s REAL POWER explained, Jaap Benefits | Pashupatinath, Bhairav, Nepal’s History | TRS"
           frameBorder="0"
           className="mx-auto h-[180px] sm:h-[570px]  w-[300px] sm:w-3/4"

components/hero-page/HeroSix.jsx

@@ -1,10 +1,10 @@
-'use client'
-import { guranteeData } from "@/utils";
+"use client";
 import Image from "next/image";
 import React from "react";
 import { motion } from "framer-motion";
 
-const HeroSix = () => {
+const HeroSix = ({ guranteeData, data }) => {
+  const { heading2, description2 } = data | {};
   return (
     <section className="py-16 bg-gradient-to-b from-background to-muted">
       <div className="container px-4 mx-auto">
@@ -15,11 +15,11 @@ const HeroSix = () => {
           className="text-center mb-12"
         >
           <h2 className="text-3xl md:text-4xl font-bold text-foreground mb-4">
-            Our Sacred Commitment
+            {heading2 ?? "Our Sacred Commitment"}
           </h2>
           <p className="text-lg text-muted-foreground max-w-2xl mx-auto">
-            Certified Excellence in Rudraksha - Nepal&apos;s Premier ISO 9001:2015
-            Accredited Organization
+            {description2 ??
+              "Certified Excellence in Rudraksha - Nepal&apos;s Premier ISO 9001:2015 Accredited Organization"}
           </p>
         </motion.div>
         <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-8">