import {useEffect} from 'react';
import { useLocation } from 'react-router-dom';
import Home from './components/Home/Home.jsx';
import Experiences from './components/Experiences/Experiences.jsx';
import Projects from '../../components/Projects/Projects.jsx';
import Skills from './components/Skills/Skills.jsx';
import Footer from '../../components/Footer/Footer.jsx';

function HomePage() {
    const location = useLocation();

    useEffect(() => {
        if (location.hash) {
            const id = location.hash.replace('#', '');
            const element = document.getElementById(id);
            if (element) {
                setTimeout(() => {
                    element.scrollIntoView({ behavior: 'smooth' });
                }, 100);
            }
        }
    }, [location]);

    return (
        <div>
            <Home/>
            <Experiences/>
            <Projects/>
            <Skills/>
            <Footer/>
        </div>
    );
}
export default HomePage;