'use client';

import { Header } from '@/components/ui/Header';
import { useUserPreferences } from '@/contexts/UserPreferencesContext';
import { useState, useEffect, useTransition } from 'react';
import { backupClient } from '@/clients/backup-client';
import { jiraClient } from '@/clients/jira-client';
import { getSystemInfo } from '@/actions/system-info';
import { SystemInfo } from '@/services/core/system-info';
import { QuickStats } from './index/QuickStats';
import { SettingsNavigation } from './index/SettingsNavigation';
import { QuickActions } from './index/QuickActions';
import { SystemInfo as SystemInfoComponent } from './index/SystemInfo';

interface SettingsIndexPageClientProps {
  initialSystemInfo: SystemInfo;
}

export function SettingsIndexPageClient({
  initialSystemInfo,
}: SettingsIndexPageClientProps) {
  const { preferences } = useUserPreferences();
  // États pour les actions
  const [isBackupLoading, setIsBackupLoading] = useState(false);
  const [isJiraTestLoading, setIsJiraTestLoading] = useState(false);
  const [systemInfo, setSystemInfo] = useState<SystemInfo | null>(
    initialSystemInfo || null
  );
  const [messages, setMessages] = useState<{
    backup?: { type: 'success' | 'error'; text: string };
    jira?: { type: 'success' | 'error'; text: string };
  }>({});

  // useTransition pour le server action
  const [isSystemInfoLoading, startTransition] = useTransition();

  // Fonction pour recharger les infos système (server action)
  const loadSystemInfo = () => {
    startTransition(async () => {
      try {
        const result = await getSystemInfo();
        if (result.success && result.data) {
          setSystemInfo(result.data);
        } else {
          console.error('Error loading system info:', result.error);
        }
      } catch (error) {
        console.error('Error loading system info:', error);
      }
    });
  };

  // Fonction pour créer une sauvegarde manuelle
  const handleCreateBackup = async () => {
    setIsBackupLoading(true);
    try {
      const backup = await backupClient.createBackup();
      if (backup) {
        setMessages((prev) => ({
          ...prev,
          backup: {
            type: 'success',
            text: `Sauvegarde créée: ${backup.filename}`,
          },
        }));
      } else {
        setMessages((prev) => ({
          ...prev,
          backup: {
            type: 'success',
            text: 'Sauvegarde sautée: aucun changement détecté',
          },
        }));
      }

      // Recharger les infos système pour mettre à jour le nombre de sauvegardes
      loadSystemInfo();
    } catch {
      setMessages((prev) => ({
        ...prev,
        backup: {
          type: 'error',
          text: 'Erreur lors de la création de la sauvegarde',
        },
      }));
    } finally {
      setIsBackupLoading(false);
    }
  };

  // Fonction pour tester la connexion Jira
  const handleTestJira = async () => {
    setIsJiraTestLoading(true);
    try {
      const status = await jiraClient.testConnection();
      setMessages((prev) => ({
        ...prev,
        jira: {
          type: status.connected ? 'success' : 'error',
          text: status.connected
            ? 'Connexion Jira réussie !'
            : `Erreur: ${status.message || 'Connexion échouée'}`,
        },
      }));
    } catch {
      setMessages((prev) => ({
        ...prev,
        jira: { type: 'error', text: 'Erreur lors du test de connexion Jira' },
      }));
    } finally {
      setIsJiraTestLoading(false);
    }
  };

  // Auto-dismiss des messages après 5 secondes
  useEffect(() => {
    Object.keys(messages).forEach((key) => {
      if (messages[key as keyof typeof messages]) {
        const timer = setTimeout(() => {
          setMessages((prev) => ({ ...prev, [key]: undefined }));
        }, 5000);
        return () => clearTimeout(timer);
      }
    });
  }, [messages]);

  const settingsPages = [
    {
      href: '/settings/general',
      icon: '⚙️',
      title: 'Paramètres généraux',
      description: "Interface, thème, préférences d'affichage",
      status: 'Fonctionnel',
    },
    {
      href: '/settings/integrations',
      icon: '🔌',
      title: 'Intégrations',
      description: 'Jira, GitHub, Slack et autres services externes',
      status: 'Fonctionnel',
    },
    {
      href: '/settings/backup',
      icon: '💾',
      title: 'Sauvegardes',
      description: 'Gestion des sauvegardes automatiques et manuelles',
      status: 'Fonctionnel',
    },
    {
      href: '/settings/advanced',
      icon: '🛠️',
      title: 'Paramètres avancés',
      description: 'Logs, debug et maintenance système',
      status: 'Fonctionnel',
    },
  ];

  return (
    <div className="min-h-screen bg-[var(--background)]">
      <Header title="TowerControl" subtitle="Configuration & Paramètres" />

      <div className="container mx-auto px-4 py-4">
        <div className="max-w-4xl mx-auto">
          {/* Page Header */}
          <div className="mb-8">
            <h1 className="text-3xl font-mono font-bold text-[var(--foreground)] mb-3">
              Paramètres
            </h1>
            <p className="text-[var(--muted-foreground)] text-lg">
              Configuration de TowerControl et de ses intégrations
            </p>
          </div>

          {/* Quick Stats */}
          <QuickStats preferences={preferences} systemInfo={systemInfo} />

          {/* Settings Sections */}
          <SettingsNavigation settingsPages={settingsPages} />

          {/* Quick Actions */}
          <QuickActions
            onCreateBackup={handleCreateBackup}
            onTestJira={handleTestJira}
            isBackupLoading={isBackupLoading}
            isJiraTestLoading={isJiraTestLoading}
            jiraEnabled={preferences.jiraConfig.enabled}
            messages={messages}
          />

          {/* System Info */}
          <SystemInfoComponent
            systemInfo={systemInfo}
            isLoading={isSystemInfoLoading}
            onRefresh={loadSystemInfo}
          />
        </div>
      </div>
    </div>
  );
}
