import React, { Fragment } from 'react';
import Navbar from '../components/Navbar/Navbar';
import Hero from '../components/hero/hero';
import Features from '../components/Features/Features';
import About from '../components/about/about';
import ServiceSection from '../components/ServiceSection/ServiceSection';
import ServiceSectionS2 from '../components/ServiceSectionS2/ServiceSectionS2';
import Testimonial from '../components/Testimonial/Testimonial';
import FunFact from '../components/FunFact/FunFact';
import Donors from '../components/Donors/Donors';
import BlogSection from '../components/BlogSection/BlogSection';
import Footer from '../components/footer/Footer';
import Scrollbar from '../components/scrollbar/scrollbar';
import introImg from '/public/images/home/expert-immigration-guidance.webp';

import { serverSideTranslations } from 'next-i18next/serverSideTranslations';

const HomePage = () => {
    return (
        <Fragment>
            <Navbar hclass={'wpo-site-header-s1'} topbarNone={'topbar-none'} Logo={'/images/logo.svg'} />
            <Hero />
            <Features sClass={'wpo-service-section-s2'} />
            <About introImg={introImg} abClass={'wpo-about-section-s2'} />
            <ServiceSection />
            {/* <FunFact fnTpClass={'funfact-wrap-sec'} fnClass={'wpo-fun-fact-section-s3'} /> */}
            <ServiceSectionS2 />
            <Testimonial />
            <Donors />
            <BlogSection />
            <Footer />
            <Scrollbar />
        </Fragment>
    );
};

export default HomePage;

// ✅ This enables translations (menu, and more if you add other namespaces)
export async function getStaticProps({ locale }) {
    return {
        props: {
            ...(await serverSideTranslations(locale, ['common', 'menu', 'homeHero', 'home4Card', '(home)/homeAbout', '(home)/homeFeature', '(home)/testimonial', '(home)/homeCalltoAction', 'blog', 'footer'])), // Add 'home', 'footer', etc. if needed
        },
    };
}