Backlog/v12 pipeline test moda (#2420)

* fix[frontend](testmodal/pipelines/rules): added changeable name on those sections of the test modal

* fix[frontend](testmodal/pipelines/rules): added missing translations

Author: AlexSanchez-bit

frontend/src/features/alerting-rules/components/rule-drawer.tsx

@@ -181,6 +181,7 @@ export function RuleDrawer({
       {showTestModal && (
         <TestPlaygroundModal
           mode="rule"
+          titleKey="playground.titleRule"
           dataTypeOptions={form.dataTypes}
           draftContent={ruleFormToYaml(form)}
           onClose={() => setShowTestModal(false)}

frontend/src/features/alerting-rules/pages/AlertingRulesPage.tsx

@@ -295,7 +295,7 @@ export function AlertingRulesPage() {
       {open && <RuleDrawer rule={open} dataTypeOptions={dataTypeOptions} onClose={() => setOpen(null)} onToggle={toggleActive} onDelete={remove} onSaved={() => { setOpen(null); refresh() }} t={t} />}
       {creating && <RuleDrawer create dataTypeOptions={dataTypeOptions} onClose={() => setCreating(false)} onSaved={() => { setCreating(false); refresh() }} t={t} />}
       {importResults && <ImportResultsDialog res={importResults} onClose={() => setImportResults(null)} t={t} />}
-      {showTestModal && <TestPlaygroundModal mode="rule" dataTypeOptions={testDataTypes} onClose={() => setShowTestModal(false)} />}
+      {showTestModal && <TestPlaygroundModal mode="rule" titleKey="playground.titleRule" dataTypeOptions={testDataTypes} onClose={() => setShowTestModal(false)} />}
       <ConfirmDialog
         open={pendingDelete != null}
         title={t('alertingRules.editor.delete') ?? 'Delete'}

frontend/src/features/parsing-filters/components/FilterFormDrawer.tsx

@@ -285,6 +285,7 @@ export function FilterFormDrawer({ filter, creating, onClose, onSaved }: Props)
       {showTestModal && (
         <TestPlaygroundModal
           mode="filter"
+          titleKey="playground.titleFilter"
           dataTypeOptions={model.dataTypes}
           draftContent={content}
           onClose={() => setShowTestModal(false)}

frontend/src/features/parsing-filters/pages/ParsingFiltersPage.tsx

@@ -292,7 +292,7 @@ export function ParsingFiltersPage() {
       )}
 
       {showTestModal && (
-        <TestPlaygroundModal mode="filter" dataTypeOptions={dataTypeOptions} onClose={() => setShowTestModal(false)} />
+        <TestPlaygroundModal mode="filter" titleKey="playground.titleFilter" dataTypeOptions={dataTypeOptions} onClose={() => setShowTestModal(false)} />
       )}
     </div>
   )

frontend/src/features/playground/components/TestPlaygroundModal.tsx

@@ -16,14 +16,16 @@ const MAX_BYTES = 1024 * 1024
 
 interface Props {
   mode: PlaygroundMode
+  /** i18n key for the modal header, e.g. `playground.titleFilter` or `playground.titleRule`. */
+  titleKey: string
   /** Entry A: active dataTypes from the catalog. Entry B: `model.dataTypes` of the draft. */
   dataTypeOptions: string[]
   /** Present only for Entry B (unsaved draft content); omitted tests the live pipeline. */
   draftContent?: string
   onClose: () => void
 }
 
-export function TestPlaygroundModal({ mode, dataTypeOptions, draftContent, onClose }: Props) {
+export function TestPlaygroundModal({ mode, titleKey, dataTypeOptions, draftContent, onClose }: Props) {
   const { t } = useTranslation()
   const [selectedDataType, setSelectedDataType] = useState(dataTypeOptions[0] ?? '')
   const [rawLog, setRawLog] = useState('')
@@ -87,7 +89,7 @@ export function TestPlaygroundModal({ mode, dataTypeOptions, draftContent, onClo
       >
         <header className="flex items-center justify-between gap-4 border-b border-border px-6 py-4">
           <h2 className="flex items-center gap-2 text-lg font-semibold">
-            <PlayCircle size={16} className="text-primary" /> {t('playground.title')}
+            <PlayCircle size={16} className="text-primary" /> {t(titleKey)}
           </h2>
           <button
             type="button"

frontend/src/shared/i18n/locales/de.json

@@ -5178,5 +5178,52 @@
       "level2": "Stufe 2",
       "level3": "Stufe 3"
     }
+  },
+  "playground": {
+    "titleFilter": "Pipeline testen",
+    "titleRule": "Regel testen",
+    "noDataTypes": "Dieser Pipeline sind noch keine Datentypen zugewiesen — füge einen hinzu, um sie zu testen.",
+    "dataTypeLabel": "Datentyp",
+    "dataTypePlaceholder": "Keine Datentypen verfügbar",
+    "dataTypeSingleHint": "Diese Pipeline hat nur einen Datentyp — füge weitere hinzu, um zwischen ihnen zu wählen.",
+    "rawLogLabel": "Rohprotokoll",
+    "rawLogPlaceholder": "Füge eine Beispielprotokollzeile ein…",
+    "rawLogCounter": "{{chars}} Zeichen · {{kb}} KB",
+    "rawLogTooLarge": "Dieses Protokoll überschreitet das 1-MB-Limit — kürze es vor dem Test.",
+    "run": {
+      "label": "Ausführen",
+      "running": "Wird getestet…",
+      "waitHint": "Dies kann bis zu 15 Sekunden dauern, während die Pipeline das Protokoll verarbeitet."
+    },
+    "errors": {
+      "busy": "Der Playground führt bereits einen anderen Test aus — bitte versuche es gleich erneut.",
+      "timeout": "Der Test hat das Zeitlimit überschritten — meist passt der gewählte Datentyp nicht zum Protokollformat.",
+      "validation": "Die Anfrage war ungültig — prüfe das Rohprotokoll und den Pipeline-Inhalt.",
+      "server": "Der Playground konnte den Test nicht abschließen — bitte erneut versuchen."
+    },
+    "result": {
+      "label": "Verarbeitetes Ergebnis",
+      "empty": "Führe einen Test aus, um das verarbeitete Ereignis hier zu sehen.",
+      "loading": "Warte auf das verarbeitete Ereignis…",
+      "tabs": {
+        "fields": "Felder",
+        "json": "JSON"
+      },
+      "fieldsCount_one": "{{count}} Feld",
+      "fieldsCount_other": "{{count}} Felder",
+      "copy": "Kopieren",
+      "copied": "Kopiert",
+      "elapsed": "Verarbeitet in {{time}}",
+      "elapsedHint": "Zeit von „Ausführen“ bis zum verarbeiteten Ergebnis",
+      "searchPlaceholder": "Felder suchen…",
+      "noMatch": "Keine Felder entsprechen deiner Suche."
+    },
+    "alerts": {
+      "label": "Alarme",
+      "empty": "Führe einen Test aus, um hier ausgelöste Alarme zu sehen.",
+      "none": "Es wurden keine Alarme ausgelöst.",
+      "count_one": "{{count}} Alarm",
+      "count_other": "{{count}} Alarme"
+    }
   }
 }

frontend/src/shared/i18n/locales/en.json

@@ -4589,7 +4589,8 @@
     "testPipeline": "Test pipeline"
   },
   "playground": {
-    "title": "Test pipeline",
+    "titleFilter": "Test pipeline",
+    "titleRule": "Test rule",
     "noDataTypes": "This pipeline has no data types assigned yet — add one to test it.",
     "dataTypeLabel": "Data type",
     "dataTypePlaceholder": "No data types available",

frontend/src/shared/i18n/locales/es.json

@@ -5140,5 +5140,52 @@
       "level2": "Nivel 2",
       "level3": "Nivel 3"
     }
+  },
+  "playground": {
+    "titleFilter": "Probar pipeline",
+    "titleRule": "Probar regla",
+    "noDataTypes": "Este pipeline aún no tiene tipos de datos asignados — añade uno para probarlo.",
+    "dataTypeLabel": "Tipo de dato",
+    "dataTypePlaceholder": "No hay tipos de datos disponibles",
+    "dataTypeSingleHint": "Este pipeline solo tiene un tipo de dato — añade más para poder elegir.",
+    "rawLogLabel": "Log en crudo",
+    "rawLogPlaceholder": "Pega una línea de log de ejemplo…",
+    "rawLogCounter": "{{chars}} caracteres · {{kb}} KB",
+    "rawLogTooLarge": "Este log supera el límite de 1 MB — recórtalo antes de ejecutar la prueba.",
+    "run": {
+      "label": "Ejecutar",
+      "running": "Probando…",
+      "waitHint": "Esto puede tardar hasta 15 segundos mientras el pipeline procesa el log."
+    },
+    "errors": {
+      "busy": "El playground está ocupado con otra prueba — inténtalo de nuevo en un momento.",
+      "timeout": "La prueba agotó el tiempo — normalmente significa que el tipo de dato seleccionado no coincide con el formato del log.",
+      "validation": "La solicitud no era válida — revisa el log en crudo y el contenido del pipeline.",
+      "server": "El playground no pudo completar la prueba — inténtalo de nuevo."
+    },
+    "result": {
+      "label": "Resultado procesado",
+      "empty": "Ejecuta una prueba para ver aquí el evento procesado.",
+      "loading": "Esperando el evento procesado…",
+      "tabs": {
+        "fields": "Campos",
+        "json": "JSON"
+      },
+      "fieldsCount_one": "{{count}} campo",
+      "fieldsCount_other": "{{count}} campos",
+      "copy": "Copiar",
+      "copied": "Copiado",
+      "elapsed": "Procesado en {{time}}",
+      "elapsedHint": "Tiempo desde Ejecutar hasta el resultado procesado",
+      "searchPlaceholder": "Buscar campos…",
+      "noMatch": "Ningún campo coincide con tu búsqueda."
+    },
+    "alerts": {
+      "label": "Alertas",
+      "empty": "Ejecuta una prueba para ver aquí las alertas resultantes.",
+      "none": "No se activó ninguna alerta.",
+      "count_one": "{{count}} alerta",
+      "count_other": "{{count}} alertas"
+    }
   }
 }

frontend/src/shared/i18n/locales/fr.json

@@ -5178,5 +5178,52 @@
       "level2": "Niveau 2",
       "level3": "Niveau 3"
     }
+  },
+  "playground": {
+    "titleFilter": "Tester le pipeline",
+    "titleRule": "Tester la règle",
+    "noDataTypes": "Aucun type de données n'est encore attribué à ce pipeline — ajoutez-en un pour le tester.",
+    "dataTypeLabel": "Type de données",
+    "dataTypePlaceholder": "Aucun type de données disponible",
+    "dataTypeSingleHint": "Ce pipeline n'a qu'un seul type de données — ajoutez-en d'autres pour pouvoir choisir.",
+    "rawLogLabel": "Journal brut",
+    "rawLogPlaceholder": "Collez une ligne de journal d'exemple…",
+    "rawLogCounter": "{{chars}} car. · {{kb}} Ko",
+    "rawLogTooLarge": "Ce journal dépasse la limite de 1 Mo — réduisez-le avant d'exécuter le test.",
+    "run": {
+      "label": "Exécuter",
+      "running": "Test en cours…",
+      "waitHint": "Cela peut prendre jusqu'à 15 secondes pendant que le pipeline traite le journal."
+    },
+    "errors": {
+      "busy": "Le playground exécute déjà un autre test — veuillez réessayer sous peu.",
+      "timeout": "Le test a expiré — cela signifie généralement que le type de données sélectionné ne correspond pas au format du journal.",
+      "validation": "La requête est invalide — vérifiez le journal brut et le contenu du pipeline.",
+      "server": "Le playground n'a pas pu terminer le test — veuillez réessayer."
+    },
+    "result": {
+      "label": "Résultat analysé",
+      "empty": "Exécutez un test pour voir ici l'événement analysé.",
+      "loading": "En attente de l'événement analysé…",
+      "tabs": {
+        "fields": "Champs",
+        "json": "JSON"
+      },
+      "fieldsCount_one": "{{count}} champ",
+      "fieldsCount_other": "{{count}} champs",
+      "copy": "Copier",
+      "copied": "Copié",
+      "elapsed": "Analysé en {{time}}",
+      "elapsedHint": "Temps entre Exécuter et le résultat analysé",
+      "searchPlaceholder": "Rechercher des champs…",
+      "noMatch": "Aucun champ ne correspond à votre recherche."
+    },
+    "alerts": {
+      "label": "Alertes",
+      "empty": "Exécutez un test pour voir ici les alertes déclenchées.",
+      "none": "Aucune alerte n'a été déclenchée.",
+      "count_one": "{{count}} alerte",
+      "count_other": "{{count}} alertes"
+    }
   }
 }

frontend/src/shared/i18n/locales/it.json

@@ -5178,5 +5178,52 @@
       "level2": "Livello 2",
       "level3": "Livello 3"
     }
+  },
+  "playground": {
+    "titleFilter": "Prova pipeline",
+    "titleRule": "Prova regola",
+    "noDataTypes": "A questa pipeline non è ancora assegnato alcun tipo di dato — aggiungine uno per provarla.",
+    "dataTypeLabel": "Tipo di dato",
+    "dataTypePlaceholder": "Nessun tipo di dato disponibile",
+    "dataTypeSingleHint": "Questa pipeline ha un solo tipo di dato — aggiungine altri per poter scegliere.",
+    "rawLogLabel": "Log grezzo",
+    "rawLogPlaceholder": "Incolla una riga di log di esempio…",
+    "rawLogCounter": "{{chars}} caratteri · {{kb}} KB",
+    "rawLogTooLarge": "Questo log supera il limite di 1 MB — riducilo prima di eseguire il test.",
+    "run": {
+      "label": "Esegui",
+      "running": "Test in corso…",
+      "waitHint": "Può richiedere fino a 15 secondi mentre la pipeline elabora il log."
+    },
+    "errors": {
+      "busy": "Il playground sta eseguendo un altro test — riprova a breve.",
+      "timeout": "Il test è scaduto — di solito significa che il tipo di dato selezionato non corrisponde al formato del log.",
+      "validation": "La richiesta non è valida — controlla il log grezzo e il contenuto della pipeline.",
+      "server": "Il playground non è riuscito a completare il test — riprova."
+    },
+    "result": {
+      "label": "Risultato elaborato",
+      "empty": "Esegui un test per vedere qui l'evento elaborato.",
+      "loading": "In attesa dell'evento elaborato…",
+      "tabs": {
+        "fields": "Campi",
+        "json": "JSON"
+      },
+      "fieldsCount_one": "{{count}} campo",
+      "fieldsCount_other": "{{count}} campi",
+      "copy": "Copia",
+      "copied": "Copiato",
+      "elapsed": "Elaborato in {{time}}",
+      "elapsedHint": "Tempo tra Esegui e il risultato elaborato",
+      "searchPlaceholder": "Cerca campi…",
+      "noMatch": "Nessun campo corrisponde alla tua ricerca."
+    },
+    "alerts": {
+      "label": "Avvisi",
+      "empty": "Esegui un test per vedere qui gli avvisi generati.",
+      "none": "Nessun avviso è stato generato.",
+      "count_one": "{{count}} avviso",
+      "count_other": "{{count}} avvisi"
+    }
   }
 }