import React from "react";
import PageBanner from "@/components/reuseables/PageBanner";
import MethodOne from "@/components/reuseables/services/MethodOne";
import MethodTwoSection from "@/components/reuseables/services/MethodTwo";
import Clientele from "@/components/reuseables/Clientele";
import qs from "qs";
import axios from "axios";
import { cleanImage } from "@/layout/imageHandling";
import Seo from "@/components/reuseables/Seo/Seo";
import LeftSideImage from "@/container/Corpedia/LeftSideImage";
import RightSideImage from "@/container/Corpedia/RightSideImage";
import ConversionCode from "@/components/reuseables/ConversionCode/ConversionCode";

const banners = [
  {
    imageSrc: "/images/banner/transaction_advisory.webp",
    pageTitle: " Transaction Advisory",
    homePageUrl: "/client-servicing",
    homePageText: "Client Servicing",
    activePageText: "Transaction Advisory",
  },
  // Add more banners as needed
];
const CFOData = [
  {
    subtitle: "Client Servicing",
    title: "Transaction Advisory",
    paragraphs: [
      "At Advith Consulting, we don’t see deals as isolated events but rather as multiple related events forming part of a dynamic lifecycle. Our approach encompasses strategy, project management & execution and post transaction support. Our services include Deal Structuring, Mergers & Acquisitions, Due Diligence, Valuations, Cross Border Transactions, Transfer Pricing Advisory, Fund Raise Management, etc",
    ],
    imageSrc: "/images/client-service/Transaction-Advisory.png",
    imageAlt: "Client Servicing Image",
  },
  {
    subtitle: "Client Servicing",
    title: "About Transaction Advisory",
    paragraphs: [
      "Make or break events for an organisation, a transaction is an event that is likey to impact the operations, growth and scale of organisations in a siginficant manner.We bring together experts at different functional layers in order to ensure that you receive a 360 degree perspective on your transaction.",
    ],
    imageSrc: "/images/client-service/About-Transaction-Advisory.png",
    imageAlt: "FC & CFO Services Image",
  },
  // Add more objects here if needed
];

const sliderConfig = {
  spaceBetween: 20,
  slidesPerView: 4,
  breakpoints: {
    320: {
      slidesPerView: 2,
      spaceBetween: 10,
    },
    768: {
      slidesPerView: 2,
      spaceBetween: 20,
    },
    1024: {
      slidesPerView: 3,
      spaceBetween: 20,
    },
    1200: {
      slidesPerView: 5,
      spaceBetween: 20,
    },
  },
};

// method one content
const MethodOneData = [
  {
    stepNumber: "01",
    img: "/images/shape/icon/discovery.png",
    title: "Strategy Evaluation & Planning ",
    descr: " Strategy, Structuring, Gantt & RACI, Preparedness",
    altText: "discovery-icon",
  },
  {
    stepNumber: "02",
    img: "/images/shape/icon/analysis.png",
    title: "Execution",
    descr:
      "Negotiation, Due Diligence, Conflict Management, Roadshows, Valuations",
    altText: "analysis-icon",
  },
  {
    stepNumber: "03",
    img: "/images/shape/icon/setup.png",
    title: "Completion",
    descr: "Sign Off's, Impact Assessment, Reporting   ",
    altText: "setup-icon",
  },
  {
    stepNumber: "04",
    img: "/images/shape/icon/execution.png",
    title: "Post Completion Support ",
    descr:
      " Implementation, Change Management, Synergy Evaluation, Stabilisation ",
    altText: "execution-icon",
  },
];

const methodTwoData = [
  {
    img: "/images/services/cfo/activity/recurring.png",
    title: " Deal Structuring & Negotiation",
    descr:
      "Review of books of accounts, on call advisory, co-ordination with Bankers, Employees, Vendors on finance related matters",
  },
  {
    img: "/images/services/cfo/activity/monthly.png",
    title: " Business Modelling",
    descr:
      "Monthly book closures, payroll processing, compliance management, tracking of budget vs actuals, cash & fund flow management ",
  },
  {
    img: "/images/services/cfo/activity/quarterly.png",
    title: "Due Diligence",
    descr:
      "Presentation to the Board, Investment Evaluation, Evaluation of Processes",
  },
  {
    img: "/images/services/cfo/activity/annual.png",
    title: "Valuations",
    descr: "Audit Assistance, Budgeting, Reporting to Investors",
  },
  {
    img: "/images/services/cfo/activity/need.png",
    title: "Mergers & Acquisitions",
    descr: "As per requirement of the Management",
  },

  {
    img: "/images/services/cfo/activity/quarterly.png",
    title: " Fund Raise Management",
    descr:
      "Presentation to the Board, Investment Evaluation, Evaluation of Processes",
  },
  {
    img: "/images/services/cfo/activity/annual.png",
    title: "Post Merger Integrations",
    descr: "Audit Assistance, Budgeting, Reporting to Investors",
  },
  {
    img: "/images/services/cfo/activity/need.png",
    title: "Cross Border Transactions",
    descr: "As per requirement of the Management",
  },
  {
    img: "/images/services/cfo/activity/annual.png",
    title: "Transfer Pricing Advisory",
    descr: "Audit Assistance, Budgeting, Reporting to Investors",
  },
  {
    img: "/images/services/cfo/activity/need.png",
    title: "Business Restructuring",
    descr: "As per requirement of the Management",
  },
  // Add more data as needed
];

const partners = [
  {
    image: "/images/clientel/academic-city.svg",
    altText: "partner",
    link: "#",
  },
  {
    image: "/images/clientel/Ace.svg",
    altText: "partner",
    link: "#",
  },
  {
    image: "/images/clientel/ADALVO.svg",
    altText: "partner",
    link: "#",
  },
  {
    image: "/images/clientel/Arihant.svg",
    altText: "partner",
    link: "#",
  },
  {
    image: "/images/clientel/CRESTA.svg",
    altText: "partner",
    link: "#",
  },
  {
    image: "/images/clientel/DAZZLES.svg",
    altText: "partner",
    link: "#",
  },
  {
    image: "/images/clientel/DESMET.svg",
    altText: "partner",
    link: "#",
  },
  {
    image: "/images/clientel/KNOWLEDGEUM.svg",
    altText: "partner",
    link: "#",
  },
  {
    image: "/images/clientel/LEADICS.svg",
    altText: "partner",
    link: "#",
  },
  {
    image: "/images/clientel/Sigma.svg",
    altText: "partner",
    link: "#",
  },
  {
    image: "/images/clientel/THOLASI.svg",
    altText: "partner",
    link: "#",
  },
  {
    image: "/images/clientel/Vista-spaces.svg",
    altText: "partner",
    link: "#",
  },
];

const TaPage = ({ tapage ,conversionData  }) => {
  const banners = [
    {
      imageSrc: cleanImage(tapage?.Banner?.Image?.url),
      pageTitle: tapage?.Banner?.Heading,
      homePageUrl: "/",
      homePageText: "Home",
      activePageText: tapage?.Banner?.Heading,
    },
    // Add more banners as needed
  ];

  const dynamicdata = tapage?.TransactionDeatils;
  // console.log("dynamicdata", dynamicdata);

  const clientlogo = tapage?.Clientel;
  // console.log("clientlogo", clientlogo);
  const seo = tapage?.seo;
  // console.log(seo, "seo")
  const code = conversionData?.conversion;

  return (
    <>
      <Seo seo={seo} />
      <ConversionCode code={code} />

      <PageBanner banners={banners} />

      <div className="what-we-do-area pt-100">
        <section className="cfo-page">
          {dynamicdata &&
            dynamicdata?.map((section, index) => {
              // console.log("section", section);
              switch (section.__component) {
                case "dynamic-zone.about":
                  return (
                    <LeftSideImage
                      title={section?.Title}
                      subtitle={section?.Subtitle}
                      image={section?.Image}
                      content={section?.Content}
                    />
                  );
                case "dynamic-zone.background":
                  return (
                    <RightSideImage
                      title={section?.Title}
                      subtitle={section?.Subtitle}
                      image={section?.Image}
                      content={section?.Content}
                    />
                  );
                case "dynamic-zone.element-one":
                  return (
                    <MethodOne
                      heading={section?.Heading}
                      data={section?.ElementList}
                    />
                  );
                case "dynamic-zone.element-two":
                  return (
                    <MethodTwoSection
                      heading={section?.Heading}
                      data={section?.ElementList}
                    />
                  );
                default:
                  return null;
              }
            })}
        </section>
      </div>
      {/* <MethodOne
        data={MethodOneData}
        sectionTitle="Methodology 2 - How we do it? "
        heading="Elements in CFO Services"
        descrption="Here are some key activities we focus on in our CFO services."
        sliderConfig={sliderConfig} // Pass the slider configuration here
      />
      <MethodTwoSection
        sectionTitle="Methodology 2 - How we do it? "
        subTitle="Elements in CFO Services - Option 2"
        methodData={methodTwoData}
        slidesPerView={sliderConfig.slidesPerView}
        breakpoints={sliderConfig.breakpoints} // Pass breakpoints here
        spaceBetween={sliderConfig.spaceBetween}
        autoplayDelay={sliderConfig.autoplayDelay}
        showPagination={sliderConfig.showPagination}
        showAutoplay={sliderConfig.showAutoplay}
      /> */}
 <div className="ptb-100">
        <Clientele partners={clientlogo} />
      </div>
    </>
  );
};

export default TaPage;

export async function getServerSideProps() {
  try {
    const query1 = {
      populate: [
        "Banner.Image",
        "TransactionDeatils",
        "TransactionDeatils.Image",
        "TransactionDeatils.Heading",
        "TransactionDeatils.ElementList.StepImg",
        "Clientel.logos",
        "seo",
        "seo.metaImage",
        "seo.schema",
      ],
    };

    const query2 = {
      populate: ["conversion"],
    };

    const query1String = qs.stringify(query1, {
      encodeValuesOnly: true,
    });

    const query12String = qs.stringify(query2, {
      encodeValuesOnly: true,
    });

    const endpoint1 = `${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/transaction-page?${query1String}`;
    const endpoint2 = `${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/google-manger?${query12String}`;
    
    console.log(`Final url: ${endpoint1}`);

    const [response1, response2] = await Promise.all([
      axios.get(endpoint1),
      axios.get(endpoint2),
    ]);
    const tapage = response1.data.data;
    const conversionData = response2.data.data;


    return {
      props: { tapage , conversionData },
    };
  } catch (error) {
    console.log("Error", error);
  }
}