// 하루결 — 메인 앱 (라우터)

function App() {
  const s = useStore();
  const [route, navigate] = useRoute();
  const [onboarded, setOnboarded] = React.useState(() => !!localStorage.getItem(K.onboarded));
  const [showEncouragement, setShowEncouragement] = React.useState(false);

  // 응원 모달: 하루 1회, 온보딩 후, 활성화된 경우
  React.useEffect(() => {
    if (!onboarded) return;
    const lastShown = localStorage.getItem(K.encShown);
    const enabled = Store.load(K.encEnabled, true);
    if (enabled && lastShown !== todayISO()) {
      const t = setTimeout(() => setShowEncouragement(true), 600);
      return () => clearTimeout(t);
    }
  }, [onboarded]);

  const dismissEncouragement = () => {
    localStorage.setItem(K.encShown, todayISO());
    setShowEncouragement(false);
  };

  // 보호자 → 환자 전환 시 라우트 자동 조정
  React.useEffect(() => {
    if (s.mode === 'caregiver' && !route.startsWith('cg-') && !['emergency', 'schedule', 'meal', 'symptom', 'questions', 'meds', 'firstcare', 'settings'].includes(route)) {
      navigate('cg-home');
    }
    if (s.mode === 'patient' && route.startsWith('cg-')) {
      navigate('home');
    }
  }, [s.mode]);

  if (!onboarded) {
    return (
      <div className="hg-app">
        <FakeStatusBar dark />
        <OnboardingScreen onDone={() => { localStorage.setItem(K.onboarded, '1'); setOnboarded(true); }} />
      </div>
    );
  }

  // 라우트별 화면 매핑
  const renderScreen = () => {
    // 환자 모드
    switch (route) {
      case 'home':           return <HomeScreen navigate={navigate} />;
      case 'schedule':       return <ScheduleScreen navigate={navigate} />;
      case 'meal':           return <MealsScreen navigate={navigate} />;
      case 'meal-new':       return <MealsScreen navigate={navigate} initialOpen />;
      case 'symptom':        return <SymptomsScreen navigate={navigate} />;
      case 'symptom-new':    return <SymptomsScreen navigate={navigate} initialOpen />;
      case 'questions':      return <QuestionsScreen navigate={navigate} />;
      case 'questions-new':  return <QuestionsScreen navigate={navigate} initialOpen />;
      case 'meds':           return <MedsScreen navigate={navigate} />;
      case 'firstcare':      return <FirstCareScreen navigate={navigate} />;
      case 'library':        return <LibraryScreen navigate={navigate} />;
      case 'exercise':       return <ExerciseScreen navigate={navigate} />;
      case 'meal-plan':      return <MealPlanScreen navigate={navigate} />;
      case 'labs':           return <LabsScreen navigate={navigate} />;
      case 'exams':          return <ExamsScreen navigate={navigate} />;
      case 'goals':          return <GoalsScreen navigate={navigate} />;
      case 'community':      return <CommunityScreen navigate={navigate} />;
      case 'safety':         return <SafetyScreen navigate={navigate} />;
      case 'buddies':        return <BuddiesScreen navigate={navigate} />;
      case 'more':           return <MoreScreen navigate={navigate} />;
      case 'emergency':      return <EmergencyScreen navigate={navigate} />;
      case 'settings':       return <SettingsScreen navigate={navigate} />;

      // 보호자 모드
      case 'cg-home':    return <CaregiverHomeScreen navigate={navigate} />;
      case 'cg-monitor': return <CaregiverMonitorScreen navigate={navigate} />;
      case 'cg-visit':   return <CaregiverVisitScreen navigate={navigate} />;
      case 'cg-more':    return <CaregiverMoreScreen navigate={navigate} />;

      default:
        if (route.startsWith('library/'))  return <LibraryScreen  navigate={navigate} articleId={route.slice('library/'.length)} />;
        if (route.startsWith('exercise/')) return <ExerciseScreen navigate={navigate} exerciseId={route.slice('exercise/'.length)} />;
        if (route.startsWith('labs/'))     return <LabsScreen     navigate={navigate} termId={route.slice('labs/'.length)} />;
        if (route.startsWith('exams/'))    return <ExamsScreen    navigate={navigate} examId={route.slice('exams/'.length)} />;
        if (route.startsWith('community/')) return <CommunityScreen navigate={navigate} roomId={route.slice('community/'.length)} />;
        if (route.startsWith('meds/'))     return <MedsScreen navigate={navigate} medId={route.slice('meds/'.length)} />;
        if (route.startsWith('buddies/'))  return <BuddiesScreen navigate={navigate} buddyId={route.slice('buddies/'.length)} />;
        return <HomeScreen navigate={navigate} />;
    }
  };

  const moreLikeRoutes = ['emergency', 'firstcare', 'settings', 'meds', 'questions', 'questions-new', 'library', 'exercise', 'meal-plan', 'labs', 'exams', 'goals', 'community', 'safety', 'buddies'];
  const hideTabs = moreLikeRoutes.includes(route)
    || route.startsWith('library/') || route.startsWith('exercise/') || route.startsWith('labs/') || route.startsWith('exams/') || route.startsWith('community/') || route.startsWith('meds/') || route.startsWith('buddies/');
  const dark = route === 'emergency' || route === 'firstcare';

  // 활성 탭 결정
  const activeTab = (() => {
    if (route.startsWith('cg-')) return route;
    if (['meal', 'meal-new'].includes(route)) return 'meal';
    if (['symptom', 'symptom-new'].includes(route)) return 'symptom';
    if (['questions', 'questions-new', 'meds', 'firstcare', 'settings', 'more', 'library', 'exercise', 'meal-plan', 'labs', 'exams', 'goals', 'community', 'safety', 'buddies'].includes(route)
        || route.startsWith('library/') || route.startsWith('exercise/') || route.startsWith('labs/') || route.startsWith('exams/') || route.startsWith('community/') || route.startsWith('meds/') || route.startsWith('buddies/')) return 'more';
    return route;
  })();

  return (
    <div className="hg-app">
      <div className="hg-app__scroll" style={{
        display: 'flex', flexDirection: 'column', minHeight: '100%',
        paddingBottom: hideTabs ? 0 : 0,
      }}>
        <FakeStatusBar dark={dark} />
        <div key={route} className="screen-fade-enter screen-fade-enter-active" style={{ flex: 1, display: 'flex', flexDirection: 'column' }}>
          {renderScreen()}
        </div>
        {!hideTabs && (
          <BottomNav active={activeTab} mode={s.mode} onChange={navigate} />
        )}
        {/* 전역 위급 호출 — 환자 모드에서 응급 화면이 아닐 때만 */}
        {!hideTabs && s.mode === 'patient' && route !== 'emergency' && (
          <EmergencyFAB onClick={() => navigate('emergency')} />
        )}
      </div>
      {showEncouragement && <EncouragementModal onClose={dismissEncouragement} />}
    </div>
  );
}

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