chore: refactor project structure and clean up unused components
- Updated `TODO.md` to reflect new testing tasks and final structure expectations. - Simplified TypeScript path mappings in `tsconfig.json` for better clarity. - Revised business logic separation rules in `.cursor/rules` to align with new directory structure. - Deleted unused client components and services to streamline the codebase. - Adjusted import paths in scripts to match the new structure.
This commit is contained in:
Julien Froidefond
263
src/components/settings/AdvancedSettingsPageClient.tsx
Normal file
263
src/components/settings/AdvancedSettingsPageClient.tsx
Normal file
@@ -0,0 +1,263 @@
|
||||
'use client';
|
||||
|
||||
import { useState } from 'react';
|
||||
import { UserPreferences } from '@/lib/types';
|
||||
import { Header } from '@/components/ui/Header';
|
||||
import { Card, CardHeader, CardContent } from '@/components/ui/Card';
|
||||
import { Button } from '@/components/ui/Button';
|
||||
import { UserPreferencesProvider } from '@/contexts/UserPreferencesContext';
|
||||
import { backupClient, BackupListResponse } from '@/clients/backup-client';
|
||||
import Link from 'next/link';
|
||||
|
||||
interface DatabaseStats {
|
||||
taskCount: number;
|
||||
tagCount: number;
|
||||
completionRate: number;
|
||||
}
|
||||
|
||||
interface AdvancedSettingsPageClientProps {
|
||||
initialPreferences: UserPreferences;
|
||||
initialDbStats: DatabaseStats;
|
||||
initialBackupData: BackupListResponse;
|
||||
}
|
||||
|
||||
export function AdvancedSettingsPageClient({
|
||||
initialPreferences,
|
||||
initialDbStats,
|
||||
initialBackupData
|
||||
}: AdvancedSettingsPageClientProps) {
|
||||
const [backupData, setBackupData] = useState<BackupListResponse>(initialBackupData);
|
||||
const [dbStats] = useState<DatabaseStats>(initialDbStats);
|
||||
const [isCreatingBackup, setIsCreatingBackup] = useState(false);
|
||||
const [isVerifying, setIsVerifying] = useState(false);
|
||||
|
||||
const reloadBackupData = async () => {
|
||||
try {
|
||||
const data = await backupClient.listBackups();
|
||||
setBackupData(data);
|
||||
} catch (error) {
|
||||
console.error('Failed to reload backup data:', error);
|
||||
}
|
||||
};
|
||||
|
||||
const handleCreateBackup = async () => {
|
||||
setIsCreatingBackup(true);
|
||||
try {
|
||||
const result = await backupClient.createBackup();
|
||||
if (result === null) {
|
||||
alert('⏭️ Sauvegarde sautée : aucun changement détecté');
|
||||
} else {
|
||||
alert('✅ Sauvegarde créée avec succès');
|
||||
}
|
||||
await reloadBackupData();
|
||||
} catch (error) {
|
||||
console.error('Failed to create backup:', error);
|
||||
alert('❌ Erreur lors de la création de la sauvegarde');
|
||||
} finally {
|
||||
setIsCreatingBackup(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleVerifyDatabase = async () => {
|
||||
setIsVerifying(true);
|
||||
try {
|
||||
await backupClient.verifyDatabase();
|
||||
alert('✅ Base de données vérifiée avec succès');
|
||||
} catch (error) {
|
||||
console.error('Database verification failed:', error);
|
||||
alert('❌ Erreur lors de la vérification de la base');
|
||||
} finally {
|
||||
setIsVerifying(false);
|
||||
}
|
||||
};
|
||||
|
||||
const formatFileSize = (bytes: number): string => {
|
||||
const units = ['B', 'KB', 'MB', 'GB'];
|
||||
let size = bytes;
|
||||
let unitIndex = 0;
|
||||
|
||||
while (size >= 1024 && unitIndex < units.length - 1) {
|
||||
size /= 1024;
|
||||
unitIndex++;
|
||||
}
|
||||
|
||||
return `${size.toFixed(1)} ${units[unitIndex]}`;
|
||||
};
|
||||
|
||||
const formatTimeAgo = (date: Date): string => {
|
||||
// Format fixe pour éviter les erreurs d'hydratation
|
||||
const d = new Date(date);
|
||||
return d.toLocaleDateString('fr-FR', {
|
||||
day: '2-digit',
|
||||
month: '2-digit',
|
||||
year: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit',
|
||||
hour12: false
|
||||
});
|
||||
};
|
||||
|
||||
const getNextBackupTime = (): string => {
|
||||
if (!backupData.scheduler.nextBackup) return 'Non planifiée';
|
||||
|
||||
const nextBackup = new Date(backupData.scheduler.nextBackup);
|
||||
const now = new Date();
|
||||
const diffMs = nextBackup.getTime() - now.getTime();
|
||||
const diffMins = Math.floor(diffMs / (1000 * 60));
|
||||
const diffHours = Math.floor(diffMins / 60);
|
||||
|
||||
if (diffMins < 60) {
|
||||
return `dans ${diffMins}min`;
|
||||
} else {
|
||||
return `dans ${diffHours}h ${diffMins % 60}min`;
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<UserPreferencesProvider initialPreferences={initialPreferences}>
|
||||
<div className="min-h-screen bg-[var(--background)]">
|
||||
<Header
|
||||
title="TowerControl"
|
||||
subtitle="Paramètres avancés"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-4 py-4">
|
||||
<div className="max-w-4xl mx-auto">
|
||||
{/* Breadcrumb */}
|
||||
<div className="mb-4 text-sm">
|
||||
<Link href="/settings" className="text-[var(--muted-foreground)] hover:text-[var(--primary)]">
|
||||
Paramètres
|
||||
</Link>
|
||||
<span className="mx-2 text-[var(--muted-foreground)]">/</span>
|
||||
<span className="text-[var(--foreground)]">Avancé</span>
|
||||
</div>
|
||||
|
||||
{/* Page Header */}
|
||||
<div className="mb-6">
|
||||
<h1 className="text-2xl font-mono font-bold text-[var(--foreground)] mb-2">
|
||||
🛠️ Paramètres avancés
|
||||
</h1>
|
||||
<p className="text-[var(--muted-foreground)]">
|
||||
Configuration système, sauvegarde et outils de développement
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-6">
|
||||
{/* Sauvegarde et données */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h2 className="text-lg font-semibold">💾 Sauvegarde et données</h2>
|
||||
<p className="text-sm text-[var(--muted-foreground)]">
|
||||
Gestion des sauvegardes automatiques et manuelles
|
||||
</p>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<div className="p-4 bg-[var(--card)] rounded border border-dashed border-[var(--border)]">
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<h3 className="font-medium">Sauvegarde automatique</h3>
|
||||
<span className={`h-2 w-2 rounded-full ${
|
||||
backupData.scheduler.isRunning ? 'bg-green-500' : 'bg-red-500'
|
||||
}`}></span>
|
||||
</div>
|
||||
<p className="text-sm text-[var(--muted-foreground)] mb-2">
|
||||
{backupData.scheduler.isEnabled
|
||||
? `Sauvegarde ${backupData.scheduler.interval === 'hourly' ? 'toutes les heures' :
|
||||
backupData.scheduler.interval === 'daily' ? 'quotidienne' : 'hebdomadaire'}`
|
||||
: 'Sauvegarde automatique désactivée'
|
||||
}
|
||||
</p>
|
||||
<p className="text-xs text-[var(--muted-foreground)]">
|
||||
{backupData.scheduler.isRunning
|
||||
? `Prochaine sauvegarde: ${getNextBackupTime()}`
|
||||
: 'Planificateur arrêté'
|
||||
}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="p-4 bg-[var(--card)] rounded border border-dashed border-[var(--border)]">
|
||||
<h3 className="font-medium mb-2">Sauvegardes disponibles</h3>
|
||||
<p className="text-sm text-[var(--muted-foreground)] mb-2">
|
||||
{backupData.backups.length} sauvegarde{backupData.backups.length > 1 ? 's' : ''} conservée{backupData.backups.length > 1 ? 's' : ''}
|
||||
</p>
|
||||
{backupData.backups.length > 0 ? (
|
||||
<p className="text-xs text-[var(--muted-foreground)]">
|
||||
Dernière: {formatTimeAgo(backupData.backups[0].createdAt)}
|
||||
({formatFileSize(backupData.backups[0].size)})
|
||||
</p>
|
||||
) : (
|
||||
<p className="text-xs text-[var(--muted-foreground)]">
|
||||
Aucune sauvegarde disponible
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-2 pt-2">
|
||||
<Button
|
||||
onClick={handleCreateBackup}
|
||||
disabled={isCreatingBackup}
|
||||
className="px-3 py-1.5 bg-[var(--primary)] text-[var(--primary-foreground)] rounded text-sm font-medium"
|
||||
>
|
||||
{isCreatingBackup ? 'Création...' : 'Créer une sauvegarde'}
|
||||
</Button>
|
||||
<Link href="/settings/backup">
|
||||
<Button className="px-3 py-1.5 bg-[var(--card)] text-[var(--foreground)] border border-[var(--border)] rounded text-sm font-medium">
|
||||
Gérer les sauvegardes
|
||||
</Button>
|
||||
</Link>
|
||||
<Button
|
||||
onClick={handleVerifyDatabase}
|
||||
disabled={isVerifying}
|
||||
className="px-3 py-1.5 bg-[var(--card)] text-[var(--foreground)] border border-[var(--border)] rounded text-sm font-medium"
|
||||
>
|
||||
{isVerifying ? 'Vérification...' : 'Vérifier DB'}
|
||||
</Button>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Base de données */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h2 className="text-lg font-semibold">🗄️ Base de données</h2>
|
||||
<p className="text-sm text-[var(--muted-foreground)]">
|
||||
Informations et maintenance de la base de données
|
||||
</p>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<div className="p-4 bg-[var(--card)] rounded border border-dashed border-[var(--border)]">
|
||||
<h3 className="font-medium mb-1">Tâches</h3>
|
||||
<p className="text-2xl font-bold text-[var(--primary)]">
|
||||
{dbStats.taskCount}
|
||||
</p>
|
||||
<p className="text-xs text-[var(--muted-foreground)]">entrées</p>
|
||||
</div>
|
||||
|
||||
<div className="p-4 bg-[var(--card)] rounded border border-dashed border-[var(--border)]">
|
||||
<h3 className="font-medium mb-1">Tags</h3>
|
||||
<p className="text-2xl font-bold text-[var(--primary)]">
|
||||
{dbStats.tagCount}
|
||||
</p>
|
||||
<p className="text-xs text-[var(--muted-foreground)]">entrées</p>
|
||||
</div>
|
||||
|
||||
<div className="p-4 bg-[var(--card)] rounded border border-dashed border-[var(--border)]">
|
||||
<h3 className="font-medium mb-1">Taux complétion</h3>
|
||||
<p className="text-2xl font-bold text-[var(--primary)]">
|
||||
{dbStats.completionRate}
|
||||
</p>
|
||||
<p className="text-xs text-[var(--muted-foreground)]">%</p>
|
||||
</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</UserPreferencesProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user