"use client";
import Header from '@/components/Header';
import Hero from '@/components/Hero';
import MeetRisers from '@/components/MeetRisers';
import EasyDiversified from '@/components/EasyDiversified';
import Statistics from '@/components/Statistics';
import GoalBased from '@/components/GoalBased';
import InvestmentCalculator from '@/components/InvestmentCalculator';
import TeamSection from '@/components/TeamSection';
import CommunitySection from '@/components/CommunitySection';
import Footer from '@/components/Footer';
import { useRef, useState } from 'react';
import WelcomeScreen from '@/components/WelcomeScreen';
import FeatureCards from '@/components/FeatureCards';
import NotificationBar from '@/components/NotificationBar';
import PlansCard from '@/components/PlansCard';
import VideoCards from '@/components/VideoCards';
export default function Home() {

  const plansCardRef = useRef<HTMLDivElement>(null);

  const scrollToPlans = () => {
    plansCardRef.current?.scrollIntoView({
      behavior: 'smooth',
      block: 'start',
    });
  };

  const [showWelcome, setShowWelcome] = useState(true);

  const handleContinue = () => {
    setShowWelcome(false);
  };

  return (
    <div className="min-h-screen bg-white">
      {showWelcome ? ( <WelcomeScreen onContinue={handleContinue} />) : (
      <>
      <NotificationBar />
      <Header />
      <main>
        
        <Hero />
        <MeetRisers />
        <FeatureCards />

        <GoalBased onExploreClick={scrollToPlans} />
        <PlansCard ref={plansCardRef} />
        <Statistics />
        
        <InvestmentCalculator />
        <EasyDiversified />
        <VideoCards />
        <TeamSection />
      </main>
      <Footer />
      </>
      )}
    </div>
  );
}
