import { Outlet, useNavigate } from "react-router";
import styles from "./styles.module.css";
import Header from "../../components/header";
import Sidebar from "../../components/sidebar";
import { useEffect } from "react";
import Chatbot from "../../components/chatbot";

export default function ProtectedLayout() {

    const navigate = useNavigate();
    const token = localStorage.getItem("token");
    if (!token) {
        navigate("/login");
    }

    useEffect(() => {
        if (!token) {
            navigate("/login");
        }
    }, [token]);

    return (
        <>
            <div className={styles.mainContainer}>
                <Sidebar />

                <section className={styles.contentArea}>
                    <Header />
                    <main className={styles.main}>
                        <Outlet />
                    </main>

                    <Chatbot />
                {/* <Footer /> */}
                </section>
                
            </div>
        </>
    );
}
