App.tsx

import React, { useState, useEffect } from 'react';
import Layout from './components/Layout';
import Dashboard from './modules/Dashboard';
import StudyAssistant from './modules/StudyAssistant';
import NotesGenerator from './modules/NotesGenerator';
import ExamSimulator from './modules/ExamSimulator';
import CareerCopilot from './modules/CareerCopilot';
import Analytics from './modules/Analytics';
import Schedule from './modules/Schedule';
import Onboarding from './modules/Onboarding';
import Settings from './modules/Settings';
import ImageGenerator from './modules/ImageGenerator';
import { AppView, ScheduleItem, UserProfile } from './types';
import { GraduationCap, Sparkles } from 'lucide-react';

const SplashScreen: React.FC<{ onFinish: () => void }> = ({ onFinish }) => {
  useEffect(() => {
    const timer = setTimeout(onFinish, 2800); // 2.8 seconds splash
    return () => clearTimeout(timer);
  }, [onFinish]);

  return (
    <div className="fixed inset-0 bg-white flex flex-col items-center justify-center z-50 text-slate-900 overflow-hidden">
      <div className="relative">
         {/* Background Glow */}
         <div className="absolute inset-0 bg-brand-100 blur-[80px] opacity-60 rounded-full animate-pulse-slow"></div>
         
         {/* Logo Container */}
         <div className="relative z-10 flex flex-col items-center">
            <div className="w-24 h-24 bg-gradient-to-br from-brand-600 to-brand-700 rounded-3xl flex items-center justify-center shadow-2xl shadow-brand-500/20 animate-scale-in mb-6 transform rotate-3">
               <GraduationCap size={48} className="text-white drop-shadow-md" />
            </div>
            
            <div className="overflow-hidden mb-2">
                <h1 className="text-5xl font-bold tracking-tight animate-slide-up text-slate-900">
                   StudySync
                </h1>
            </div>
            
            <div className="flex items-center gap-2 animate-fade-in opacity-0" style={{ animationDelay: '0.6s', animationFillMode: 'forwards' }}>
               <Sparkles size={16} className="text-accent-500" />
               <p className="text-slate-500 font-medium tracking-wide">Your AI Academic Copilot</p>
               <Sparkles size={16} className="text-accent-500" />
            </div>
         </div>
      </div>

      <div className="absolute bottom-12 animate-fade-in opacity-0" style={{ animationDelay: '1s', animationFillMode: 'forwards' }}>
         <div className="w-12 h-12 rounded-full border-2 border-slate-200 border-t-brand-600 animate-spin"></div>
      </div>
    </div>
  );
};

const App: React.FC = () => {
  const [showSplash, setShowSplash] = useState(true);
  const [currentView, setCurrentView] = useState<AppView>(AppView.DASHBOARD);
  
  // Initialize UserProfile from localStorage to persist login
  const [userProfile, setUserProfileState] = useState<UserProfile | null>(() => {
    const savedProfile = localStorage.getItem('studySync_userProfile');
    return savedProfile ? JSON.parse(savedProfile) : null;
  });
  
  // Initialize Schedule from localStorage
  const [schedule, setScheduleState] = useState<ScheduleItem[]>(() => {
    const savedSchedule = localStorage.getItem('studySync_schedule');
    return savedSchedule ? JSON.parse(savedSchedule) : [];
  });

  // Wrapper to save profile to localStorage
  const setUserProfile = (profile: UserProfile) => {
    setUserProfileState(profile);
    localStorage.setItem('studySync_userProfile', JSON.stringify(profile));
  };

  // Wrapper to save schedule to localStorage
  const setSchedule = (items: ScheduleItem[]) => {
    setScheduleState(items);
    localStorage.setItem('studySync_schedule', JSON.stringify(items));
  };

  // Handle Logout: Clear storage and reset state
  const handleLogout = () => {
    setUserProfileState(null);
    setScheduleState([]);
    localStorage.removeItem('studySync_userProfile');
    localStorage.removeItem('studySync_schedule');
    setCurrentView(AppView.DASHBOARD);
  };

  // Handle Splash Screen Logic
  if (showSplash) {
    return <SplashScreen onFinish={() => setShowSplash(false)} />;
  }

  if (!userProfile) {
    return (
      <div className="animate-fade-in">
        <Onboarding onComplete={setUserProfile} />
      </div>
    );
  }

  const renderView = () => {
    switch (currentView) {
      case AppView.DASHBOARD:
        return <Dashboard onNavigate={setCurrentView} schedule={schedule} userProfile={userProfile} />;
      case AppView.STUDY_ASSISTANT:
        return <StudyAssistant userProfile={userProfile} />;
      case AppView.NOTES_GENERATOR:
        return <NotesGenerator />;
      case AppView.EXAM_SIMULATOR:
        return <ExamSimulator />;
      case AppView.CAREER_COPILOT:
        return <CareerCopilot />;
      case AppView.ANALYTICS:
        return <Analytics userProfile={userProfile} />;
      case AppView.SCHEDULE:
        return <Schedule schedule={schedule} setSchedule={setSchedule} />;
      case AppView.SETTINGS:
        return <Settings userProfile={userProfile} onUpdateProfile={setUserProfile} />;
      case AppView.IMAGE_GENERATION:
        return <ImageGenerator />;
      default:
        return <Dashboard onNavigate={setCurrentView} schedule={schedule} userProfile={userProfile} />;
    }
  };

  return (
    <Layout currentView={currentView} onNavigate={setCurrentView} userProfile={userProfile} onLogout={handleLogout}>
      {renderView()}
    </Layout>
  );
};

export default App;