import React, { Fragment, useEffect } from "react";
// import Banner from "./Banner";
// import SearchBar from "./SearchBar";
// import LetDiscover from "./LetDiscover";
// import BrowseExperiences from "./BrowseExperiences";
// import GiftAnExperience from "./GiftAnExperience";
// import Testimonial from "./Testimonial";
// import SignUpToExperienceOurPlatform from "./SignUpToExperienceOurPlatform";
import { useDispatch, useSelector } from "react-redux";
import dynamic from "next/dynamic";
const Banner = dynamic(() => import("./Banner"));
const SearchBar = dynamic(() => import("./SearchBar"));
const LetDiscover = dynamic(() => import("./LetDiscover"));
const BrowseExperiences = dynamic(() => import("./BrowseExperiences"));
const GiftAnExperience = dynamic(() => import("./GiftAnExperience"));
const Testimonial = dynamic(() => import("./Testimonial"));
const SignUpToExperienceOurPlatform = dynamic(() => import("./SignUpToExperienceOurPlatform"));

const Home = () => {
  const { categories } = useSelector(state => state.categories);
  const { testimonial } = useSelector(sate => sate.testimonial);
  const { allActivitiesData } = useSelector(sate => sate.allActivitiesData);
  const { homeBanner } = useSelector(state => state.homeBanner);
  // console.log("homeBanner", homeBanner);
  // console.log("categories", categories);
  // console.log("testimonial", testimonial);
  // console.log("allActivitiesData", allActivitiesData);
  const dispatch = useDispatch();
  useEffect(() => {
    // dispatch(getHomePage())
  }, [dispatch]);
  return (
    <Fragment>
      <main>
        <Banner homeBanner={homeBanner} />
        <SearchBar />
        <LetDiscover categories={categories} />
        <BrowseExperiences allActivitiesData={allActivitiesData} />
        <GiftAnExperience />
        <Testimonial testimonial={testimonial} />
        <SignUpToExperienceOurPlatform />
      </main>
    </Fragment>
  );
};

export default Home;