'use client';

import { useEffect } from 'react';
import { useAuthStore } from '@/store/auth-store';
import { LoginForm } from '@/components/login-form';
import { AppHeader } from '@/components/app-header';
import VotingPanel from '@/components/voting-panel';
import ResultsPanel from '@/components/results-panel';
import AdminDashboard from '@/components/admin-dashboard';

export default function Home() {
  const { isAuthenticated, isLoading, currentView, setUser } = useAuthStore();

  // Check auth on mount
  useEffect(() => {
    const checkAuth = async () => {
      try {
        const res = await fetch('/api/auth/me');
        const data = await res.json();
        if (data.authenticated && data.user) {
          setUser(data.user);
        } else {
          setUser(null);
        }
      } catch {
        setUser(null);
      }
    };
    checkAuth();
  }, [setUser]);

  if (isLoading) {
    return (
      <div className="min-h-screen flex items-center justify-center bg-background">
        <div className="flex flex-col items-center gap-4">
          <div className="h-12 w-12 animate-spin rounded-full border-4 border-emerald-200 border-t-emerald-600" />
          <p className="text-sm text-muted-foreground">กำลังโหลด...</p>
        </div>
      </div>
    );
  }

  if (!isAuthenticated) {
    return (
      <div className="min-h-screen flex flex-col bg-background">
        <div className="flex-1 flex items-center justify-center">
          <LoginForm />
        </div>
        <footer className="mt-auto py-4 text-center text-xs text-muted-foreground border-t bg-background">
          ระบบเลือกตั้งตัวแทนพนักงาน • การลงคะแนนเป็นความลับ • ไม่เปิดเผยตัวตนผู้ลงคะแนน
        </footer>
      </div>
    );
  }

  return (
    <div className="min-h-screen flex flex-col bg-background">
      <AppHeader />
      <main className="flex-1">
        {currentView === 'voting' && <VotingPanel />}
        {currentView === 'results' && <ResultsPanel />}
        {currentView === 'admin' && <AdminDashboard />}
      </main>
      <footer className="mt-auto py-3 text-center text-xs text-muted-foreground border-t bg-background">
        ระบบเลือกตั้งตัวแทนพนักงาน • การลงคะแนนเป็นความลับ • ไม่เปิดเผยตัวตนผู้ลงคะแนน
      </footer>
    </div>
  );
}
