Add Clear All Data feature to settings page
- Add 'Clear All Data' button in Danger Zone section - Implement confirmation dialog before clearing - Clear all localStorage and redirect to onboarding - Add translations for clearAllData, clearAllDataConfirm, and clearAllDataDescription in all 5 languages (EN, DE, FR, IT, PL) - Style with red theme to indicate destructive action
This commit is contained in:
@@ -5,7 +5,7 @@ import { useRouter } from "next/navigation";
|
||||
import Header from "@/components/Header";
|
||||
import { useTranslation } from "@/lib/i18n/useTranslation";
|
||||
import { SupportedLanguage } from "@/lib/i18n/translations";
|
||||
import { ArrowLeft, Save } from "lucide-react";
|
||||
import { ArrowLeft, Save, Trash2 } from "lucide-react";
|
||||
|
||||
export default function SettingsPage() {
|
||||
const router = useRouter();
|
||||
@@ -58,6 +58,16 @@ export default function SettingsPage() {
|
||||
router.push("/");
|
||||
};
|
||||
|
||||
const handleClearAllData = () => {
|
||||
if (window.confirm(t.common.clearAllDataConfirm)) {
|
||||
// Clear all localStorage
|
||||
localStorage.clear();
|
||||
|
||||
// Redirect to onboarding
|
||||
router.push("/onboarding");
|
||||
}
|
||||
};
|
||||
|
||||
if (!mounted) return null;
|
||||
|
||||
return (
|
||||
@@ -158,6 +168,23 @@ export default function SettingsPage() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Danger Zone - Clear All Data */}
|
||||
<div className="pt-6 border-t border-red-200 dark:border-red-800">
|
||||
<h2 className="text-lg font-semibold text-red-600 dark:text-red-400 mb-2">
|
||||
Danger Zone
|
||||
</h2>
|
||||
<p className="text-sm text-gray-600 dark:text-gray-400 mb-4">
|
||||
{t.common.clearAllDataDescription}
|
||||
</p>
|
||||
<button
|
||||
onClick={handleClearAllData}
|
||||
className="flex items-center gap-2 px-4 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 font-medium shadow-md transition-all"
|
||||
>
|
||||
<Trash2 size={18} />
|
||||
{t.common.clearAllData}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="pt-6 border-t border-gray-200 dark:border-gray-700 flex justify-end">
|
||||
|
||||
@@ -9,6 +9,9 @@ export interface Translations {
|
||||
loading: string;
|
||||
error: string;
|
||||
save: string;
|
||||
clearAllData: string;
|
||||
clearAllDataConfirm: string;
|
||||
clearAllDataDescription: string;
|
||||
};
|
||||
|
||||
// Header
|
||||
@@ -181,6 +184,9 @@ const en: Translations = {
|
||||
loading: 'Loading...',
|
||||
error: 'Error',
|
||||
save: 'Save',
|
||||
clearAllData: 'Clear All Data',
|
||||
clearAllDataConfirm: 'Are you sure you want to clear all data? This will delete all saved games, settings, and usernames. This action cannot be undone.',
|
||||
clearAllDataDescription: 'Remove all saved games, settings, and cached data from your browser.',
|
||||
},
|
||||
header: {
|
||||
tagline: 'with Gemini & Stockfish',
|
||||
@@ -342,6 +348,9 @@ const de: Translations = {
|
||||
loading: 'Lädt...',
|
||||
error: 'Fehler',
|
||||
save: 'Speichern',
|
||||
clearAllData: 'Alle Daten löschen',
|
||||
clearAllDataConfirm: 'Sind Sie sicher, dass Sie alle Daten löschen möchten? Dies löscht alle gespeicherten Spiele, Einstellungen und Benutzernamen. Diese Aktion kann nicht rückgängig gemacht werden.',
|
||||
clearAllDataDescription: 'Alle gespeicherten Spiele, Einstellungen und zwischengespeicherten Daten aus Ihrem Browser entfernen.',
|
||||
},
|
||||
header: {
|
||||
tagline: 'mit Gemini & Stockfish',
|
||||
@@ -503,6 +512,9 @@ const fr: Translations = {
|
||||
loading: 'Chargement...',
|
||||
error: 'Erreur',
|
||||
save: 'Enregistrer',
|
||||
clearAllData: 'Effacer toutes les données',
|
||||
clearAllDataConfirm: 'Êtes-vous sûr de vouloir effacer toutes les données ? Cela supprimera toutes les parties sauvegardées, les paramètres et les noms d\'utilisateur. Cette action est irréversible.',
|
||||
clearAllDataDescription: 'Supprimer toutes les parties sauvegardées, les paramètres et les données en cache de votre navigateur.',
|
||||
},
|
||||
header: {
|
||||
tagline: 'avec Gemini & Stockfish',
|
||||
@@ -664,6 +676,9 @@ const it: Translations = {
|
||||
loading: 'Caricamento...',
|
||||
error: 'Errore',
|
||||
save: 'Salva',
|
||||
clearAllData: 'Cancella tutti i dati',
|
||||
clearAllDataConfirm: 'Sei sicuro di voler cancellare tutti i dati? Questo eliminerà tutte le partite salvate, le impostazioni e i nomi utente. Questa azione non può essere annullata.',
|
||||
clearAllDataDescription: 'Rimuovi tutte le partite salvate, le impostazioni e i dati memorizzati dal tuo browser.',
|
||||
},
|
||||
header: {
|
||||
tagline: 'con Gemini & Stockfish',
|
||||
@@ -825,6 +840,9 @@ const pl: Translations = {
|
||||
loading: 'Ładowanie...',
|
||||
error: 'Błąd',
|
||||
save: 'Zapisz',
|
||||
clearAllData: 'Wyczyść wszystkie dane',
|
||||
clearAllDataConfirm: 'Czy na pewno chcesz wyczyścić wszystkie dane? Spowoduje to usunięcie wszystkich zapisanych gier, ustawień i nazw użytkowników. Ta akcja jest nieodwracalna.',
|
||||
clearAllDataDescription: 'Usuń wszystkie zapisane gry, ustawienia i dane z pamięci podręcznej przeglądarki.',
|
||||
},
|
||||
header: {
|
||||
tagline: 'z Gemini i Stockfish',
|
||||
|
||||
Reference in New Issue
Block a user