Generated by Spark: Add translation to error fallback

src/ErrorFallback.tsx

@@ -1,11 +1,12 @@
 import { Alert, AlertTitle, AlertDescription } from "./components/ui/alert";
 import { Button } from "./components/ui/button";
+import { useTranslation } from "@/hooks/use-translation";
 
 import { AlertTriangleIcon, RefreshCwIcon } from "lucide-react";
 
 export const ErrorFallback = ({ error, resetErrorBoundary }) => {
-  // When encountering an error in the development mode, rethrow it and don't display the boundary.
-  // The parent UI will take care of showing a more helpful dialog.
+  const { t } = useTranslation();
+
   if (import.meta.env.DEV) throw error;
 
   return (
@@ -13,14 +14,14 @@ export const ErrorFallback = ({ error, resetErrorBoundary }) => {
       <div className="w-full max-w-md">
         <Alert variant="destructive" className="mb-6">
           <AlertTriangleIcon />
-          <AlertTitle>This spark has encountered a runtime error</AlertTitle>
+          <AlertTitle>{t('errors.runtimeError')}</AlertTitle>
           <AlertDescription>
-            Something unexpected happened while running the application. The error details are shown below. Contact the spark author and let them know about this issue.
+            {t('errors.runtimeErrorDescription')}
           </AlertDescription>
         </Alert>
         
         <div className="bg-card border rounded-lg p-4 mb-6">
-          <h3 className="font-semibold text-sm text-muted-foreground mb-2">Error Details:</h3>
+          <h3 className="font-semibold text-sm text-muted-foreground mb-2">{t('errors.errorDetails')}</h3>
           <pre className="text-xs text-destructive bg-muted/50 p-3 rounded border overflow-auto max-h-32">
             {error.message}
           </pre>
@@ -32,7 +33,7 @@ export const ErrorFallback = ({ error, resetErrorBoundary }) => {
           variant="outline"
         >
           <RefreshCwIcon />
-          Try Again
+          {t('errors.tryAgain')}
         </Button>
       </div>
     </div>

src/data/translations/en.json

@@ -578,7 +578,11 @@
     "notFound": "Resource not found",
     "unauthorized": "You are not authorized to perform this action",
     "serverError": "Server error. Please try again later.",
-    "loadingFailed": "Failed to load data"
+    "loadingFailed": "Failed to load data",
+    "runtimeError": "This spark has encountered a runtime error",
+    "runtimeErrorDescription": "Something unexpected happened while running the application. The error details are shown below. Contact the spark author and let them know about this issue.",
+    "errorDetails": "Error Details:",
+    "tryAgain": "Try Again"
   },
   "currency": {
     "title": "Currency Management",

src/data/translations/es.json

@@ -578,7 +578,11 @@
     "notFound": "Recurso no encontrado",
     "unauthorized": "No está autorizado para realizar esta acción",
     "serverError": "Error del servidor. Por favor, inténtelo más tarde.",
-    "loadingFailed": "Error al cargar datos"
+    "loadingFailed": "Error al cargar datos",
+    "runtimeError": "Esta aplicación ha encontrado un error de ejecución",
+    "runtimeErrorDescription": "Algo inesperado sucedió mientras se ejecutaba la aplicación. Los detalles del error se muestran a continuación. Póngase en contacto con el autor de la aplicación e infórmele sobre este problema.",
+    "errorDetails": "Detalles del Error:",
+    "tryAgain": "Intentar de Nuevo"
   },
   "currency": {
     "title": "Gestión de Monedas",

src/data/translations/fr.json

@@ -578,7 +578,11 @@
     "notFound": "Ressource introuvable",
     "unauthorized": "Vous n'êtes pas autorisé à effectuer cette action",
     "serverError": "Erreur du serveur. Veuillez réessayer plus tard.",
-    "loadingFailed": "Échec du chargement des données"
+    "loadingFailed": "Échec du chargement des données",
+    "runtimeError": "Cette application a rencontré une erreur d'exécution",
+    "runtimeErrorDescription": "Quelque chose d'inattendu s'est produit lors de l'exécution de l'application. Les détails de l'erreur sont affichés ci-dessous. Contactez l'auteur de l'application et informez-le de ce problème.",
+    "errorDetails": "Détails de l'Erreur:",
+    "tryAgain": "Réessayer"
   },
   "currency": {
     "title": "Gestion des Devises",