import styles from './HomeStyles/Home.module.css'

import Sidebar from '../../components/Sidebar';
import { PageManager, SidebarProvider } from '../../core/PageManager';
import { useCurrentUser } from '../../hooks/useUsers';



function Home () {
    // Ensure user data is loaded and cached in localStorage for privilege checks
    const { isLoading: userLoading, error: userError } = useCurrentUser();
    
    // Show loading state while user data is being fetched
    if (userLoading) {
        return (
            <div className={styles.homeContainer}>
                <div className={styles.loadingContainer}>
                    Lade Benutzerdaten...
                </div>
            </div>
        );
    }

    // Show error state if user data failed to load
    if (userError) {
        return (
            <div className={styles.homeContainer}>
                <div className={styles.errorContainer}>
                    Fehler beim Laden der Benutzerdaten: {userError}
                </div>
            </div>
        );
    }

    // Loading component
    const LoadingComponent = () => (
        <div className={styles.loadingContainer}>
            Lade Seite...
        </div>
    );

    // Error component
    const ErrorComponent = () => (
        <div className={styles.errorContainer}>
            Seite nicht verfügbar oder deaktiviert
        </div>
    );

    return (
        <SidebarProvider>
            <div className={styles.homeContainer}> 
                <div className={styles.body}>
                    <div className={styles.homeSidebar}>
                        <Sidebar />
                    </div>
                    <div className={styles.homeContent}>
                        <PageManager 
                            loadingComponent={LoadingComponent}
                            errorComponent={ErrorComponent}
                        />
                    </div>
                </div>
            </div>
        </SidebarProvider>
    );
}

export default Home;