"use client";

import InitialHero from "@/components/pages/participant/home/initial-hero";
import BenefitsTakingPart from "@/components/pages/participant/home/benefits-taking-part";
import HowItWorks from "@/components/pages/participant/home/how-it-works";
import OpportunitiesShowcase from "@/components/pages/participant/home/opportunities-showcase";
import Stats from "@/components/pages/participant/home/stats";
import ConnectedSection from "@/components/pages/participant/home/connected-section";
import { Post } from "@/types/blog/blogTypes";
import LatestPosts from "@/components/pages/participant/home/latest-posts";
import { Options } from "@/types/options/options-data-types";
import BrandsSection from "@/components/pages/participant/home/brands-section";
import type { ParticipantHomeContent } from "@/lib/participant-home-ghost-content";

type ParticipantHomepageProps = {
  options: {
    currencyOptions: Options;
    typeOfStudyOptions: Options;
    paymentMethods: Options;
    jobTopicOptions: Options;
    formatOfResearchOptions: Options;
  };
  isLoggedIn: boolean;
  recentPosts: Post[];
  content: ParticipantHomeContent;
};

function ParticipantHomepage({
  options,
  recentPosts,
  isLoggedIn = false,
  content,
}: ParticipantHomepageProps) {
  return (
    <div className="flex flex-col min-h-screen">
      <InitialHero content={content.hero} isLoggedIn={isLoggedIn} />
      <Stats content={content.stats} />
      <BrandsSection content={content.brands} />
      <BenefitsTakingPart content={content.benefits} isLoggedIn={isLoggedIn} />
      <HowItWorks content={content.howItWorks} />
      <OpportunitiesShowcase
        content={content.opportunities}
        options={options}
      />
      <LatestPosts content={content.articles} recentPosts={recentPosts} />
      <ConnectedSection content={content.contact} typeOfPage="homepage" />
    </div>
  );
}

export default ParticipantHomepage;
