// Root app — wires nav, modals, assistant.

const { useState: usApp } = React;

function App() {
  const [route, setRoute] = usApp('dashboard');
  const [assistantOpen, setAssistantOpen] = usApp(false);

  // Modals
  const [detailCandidate, setDetailCandidate] = usApp(null);
  const [chatCand, setChatCand] = usApp(null);
  const [callCand, setCallCand] = usApp(null);
  const [scheduleCand, setScheduleCand] = usApp(null);
  const [kitCand, setKitCand] = usApp(null);
  const [submitCand, setSubmitCand] = usApp(null);
  const [campaignOpen, setCampaignOpen] = usApp(false);

  // ⌘J shortcut
  React.useEffect(() => {
    const h = (e) => {
      if ((e.metaKey || e.ctrlKey) && (e.key === 'j' || e.key === 'J')) {
        e.preventDefault();
        setAssistantOpen((v) => !v);
      }
    };
    window.addEventListener('keydown', h);
    return () => window.removeEventListener('keydown', h);
  }, []);

  const navigate = (r) => { setRoute(r); window.scrollTo({ top: 0, behavior: 'smooth' }); };

  const screenProps = {
    onNavigate: navigate,
    onOpenAssistant: () => setAssistantOpen(true),
    onOpenCandidate: setDetailCandidate,
    onOpenChat: setChatCand,
    onOpenCall: setCallCand,
    onOpenSchedule: setScheduleCand,
    onOpenKit: setKitCand,
    onOpenSubmit: setSubmitCand,
    onOpenCampaign: () => setCampaignOpen(true),
    onLaunchCall: setCallCand,
  };

  return (
    <ToastProvider>
      <div className="min-h-screen flex bg-app">
        <Sidebar route={route} onNavigate={navigate} />
        <div className="flex-1 min-w-0 flex flex-col">
          <TopBar onOpenAssistant={() => setAssistantOpen(true)} onNavigate={navigate} />
          <main className="flex-1 px-8 py-7 max-w-[1480px] w-full mx-auto">
            {route === 'dashboard'    && <DashboardScreen {...screenProps} />}
            {route === 'requisitions' && <RequisitionsScreen {...screenProps} />}
            {route === 'candidates'   && <CandidatesScreen {...screenProps} />}
            {route === 'screening'    && <ScreeningScreen {...screenProps} />}
            {route === 'interviews'   && <InterviewsScreen {...screenProps} />}
            {route === 'clients'      && <ClientsScreen {...screenProps} />}
            {route === 'reports'      && <ReportsScreen {...screenProps} />}
            {route === 'settings'     && <SettingsScreen {...screenProps} />}
          </main>
        </div>
      </div>

      {/* Slide-overs and modals */}
      <CandidateDetail
        candidate={detailCandidate}
        open={!!detailCandidate}
        onClose={() => setDetailCandidate(null)}
        onOpenChat={(c) => setChatCand(c)}
        onOpenCall={(c) => setCallCand(c)}
        onOpenSchedule={(c) => setScheduleCand(c)}
        onOpenKit={(c) => setKitCand(c)}
        onOpenSubmit={(c) => setSubmitCand(c)}
      />
      <AssistantPanel
        open={assistantOpen}
        onClose={() => setAssistantOpen(false)}
        onNavigate={navigate}
        onOpenCandidate={(c) => { setAssistantOpen(false); setDetailCandidate(c); }}
      />
      <SofiaChatModal open={!!chatCand} onClose={() => setChatCand(null)} candidate={chatCand} />
      <SofiaCallModal open={!!callCand} onClose={() => setCallCand(null)} candidate={callCand} />
      <ScheduleCallModal open={!!scheduleCand} onClose={() => setScheduleCand(null)} candidate={scheduleCand} />
      <InterviewKitModal open={!!kitCand} onClose={() => setKitCand(null)} candidate={kitCand} />
      <SubmitToClientModal open={!!submitCand} onClose={() => setSubmitCand(null)} candidate={submitCand} />
      <BulkCampaignModal open={campaignOpen} onClose={() => setCampaignOpen(false)} />
    </ToastProvider>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<App />);