'use client';

import { Header } from '@/components/ui/Header';
import { TasksProvider, useTasksContext } from '@/contexts/TasksContext';
import { UserPreferencesProvider } from '@/contexts/UserPreferencesContext';
import { Task, Tag, TaskStats, UserPreferences } from '@/lib/types';
import { CreateTaskData } from '@/clients/tasks-client';
import { DashboardStats } from '@/components/dashboard/DashboardStats';
import { QuickActions } from '@/components/dashboard/QuickActions';
import { RecentTasks } from '@/components/dashboard/RecentTasks';
import { ProductivityAnalytics } from '@/components/dashboard/ProductivityAnalytics';

interface HomePageClientProps {
  initialTasks: Task[];
  initialStats: TaskStats;
  initialTags: (Tag & { usage: number })[];
  initialPreferences: UserPreferences;
}


function HomePageContent() {
  const { stats, syncing, createTask, tasks } = useTasksContext();

  // Handler pour la création de tâche
  const handleCreateTask = async (data: CreateTaskData) => {
    await createTask(data);
  };

  return (
    <div className="min-h-screen bg-[var(--background)]">
      <Header 
        title="TowerControl" 
        subtitle="Dashboard - Vue d'ensemble"
        stats={stats}
        syncing={syncing}
      />
      
      <main className="container mx-auto px-6 py-8">
        {/* Statistiques */}
        <DashboardStats stats={stats} />
        
        {/* Actions rapides */}
        <QuickActions onCreateTask={handleCreateTask} />
        
        {/* Analytics et métriques */}
        <ProductivityAnalytics />
        
        {/* Tâches récentes */}
        <RecentTasks tasks={tasks} />
      </main>
    </div>
  );
}

export function HomePageClient({ initialTasks, initialStats, initialTags, initialPreferences }: HomePageClientProps) {
  return (
    <UserPreferencesProvider initialPreferences={initialPreferences}>
      <TasksProvider 
        initialTasks={initialTasks} 
        initialStats={initialStats}
        initialTags={initialTags}
      >
        <HomePageContent />
      </TasksProvider>
    </UserPreferencesProvider>
  );
}
