import Navigation from "../Navigation/Navigation.tsx";
import React, {useState} from "react";
import styles from './MainComponent.module.css'
import Survey from "../Survey/Survey.tsx";
import SettingSurvey from "../SettingSurvey/SettingSurvey.tsx";

const MainComponent: React.FC = () => {
    const [activePage, setActivePage] = useState(
        localStorage.getItem("activePage") || "Вопросы"
    );

    const handleNavigationClick = (title: string) => {
        setActivePage(title);
        localStorage.setItem('activePage', title);
    }

    return (
        <main className={styles.mainPage}>
            <Navigation
                activePage={activePage}
                onNavigationClick={handleNavigationClick}
            />
            { activePage === 'Вопросы' && <Survey />}
            {activePage === 'Настройки' && <SettingSurvey />}
        </main>
    )
}

export default MainComponent;