knacky/mimic
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat(frontend): i18n C2 components (config card, tasks panel, execute/import modals, picker)

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Knacky
2026-06-21 23:51:12 +02:00
parent bdda02b07a
commit ad0a3f5cac
10 changed files with 117 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
frontend/src/components/C2CallbackPicker.tsx
View File

@@ -1,3 +1,4 @@
import { useTranslation } from 'react-i18next';
import { extractApiError } from '@/api/client';
import type { C2Callback } from '@/api/types';
@@ -20,20 +21,22 @@ export function C2CallbackPicker({
onSelect,
rowTestId = 'c2-callback-row',
}: C2CallbackPickerProps): JSX.Element {
const { t } = useTranslation();
if (isLoading) {
return <p className="text-[14px] text-graphite">Loading callbacks…</p>;
return <p className="text-[14px] text-graphite">{t('state.loading')}</p>;
}
if (isError) {
return (
<p className="text-[14px] text-bloom-deep">
Could not load callbacks: {extractApiError(error, 'Unknown error')}
{extractApiError(error, t('state.error.desc'))}
</p>
);
}
if (callbacks.length === 0) {
return <p className="text-[14px] text-graphite">No callbacks available.</p>;
return <p className="text-[14px] text-graphite">{t('c2.modal.picker.empty')}</p>;
}
return (
@@ -41,12 +44,12 @@ export function C2CallbackPicker({
<table className="w-full text-[14px]">
<thead>
<tr className="bg-cloud border-b border-hairline">
<th className="px-md py-sm text-left font-medium text-ink">Display ID</th>
<th className="px-md py-sm text-left font-medium text-ink">Active</th>
<th className="px-md py-sm text-left font-medium text-ink">Host</th>
<th className="px-md py-sm text-left font-medium text-ink">User</th>
<th className="px-md py-sm text-left font-medium text-ink">Domain</th>
<th className="px-md py-sm text-left font-medium text-ink">Last check-in</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.modal.picker.col.displayId')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.modal.picker.col.active')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.modal.picker.col.host')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.modal.picker.col.user')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.modal.picker.col.domain')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.modal.picker.col.lastCheckin')}</th>
</tr>
</thead>
<tbody>
@@ -78,7 +81,7 @@ export function C2CallbackPicker({
: 'bg-cloud text-graphite border border-hairline'
}`}
>
{cb.active ? 'Active' : 'Inactive'}
{cb.active ? t('c2.modal.picker.status.active') : t('c2.modal.picker.status.inactive')}
</span>
</td>
<td className="px-md py-sm font-mono">{cb.host}</td>

49
frontend/src/components/C2ConfigCard.tsx
View File

@@ -1,4 +1,5 @@
import { useEffect, useState, type FormEvent } from 'react';
import { useTranslation } from 'react-i18next';
import { extractApiError } from '@/api/client';
import { useC2Config, useDeleteC2Config, useTestC2Config, useUpdateC2Config } from '@/hooks/useC2';
import { ConfirmDialog } from './ConfirmDialog';
@@ -10,6 +11,7 @@ interface C2ConfigCardProps {
}
export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
const { t } = useTranslation();
const { push } = useToast();
const configQuery = useC2Config(engagementId);
@@ -55,11 +57,11 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
try {
await updateMutation.mutateAsync(input);
push('C2 configuration saved', 'success');
push(t('c2.config.toast.saved'), 'success');
setToken('');
setReplaceToken(false);
} catch (err) {
push(extractApiError(err, 'Could not save C2 configuration'), 'error');
push(extractApiError(err, t('c2.config.error.save')), 'error');
}
};
@@ -68,13 +70,13 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
setTestResult(null);
try {
await deleteMutation.mutateAsync();
push('C2 configuration removed', 'success');
push(t('c2.config.toast.deleted'), 'success');
setUrl('');
setToken('');
setVerifyTls(false);
setReplaceToken(false);
} catch (err) {
push(extractApiError(err, 'Could not remove C2 configuration'), 'error');
push(extractApiError(err, t('c2.config.error.delete')), 'error');
}
};
@@ -84,10 +86,10 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
const result = await testMutation.mutateAsync();
setTestResult({
ok: result.ok,
message: result.ok ? 'Connected' : (result.error ?? 'Connection failed'),
message: result.ok ? t('c2.config.connected') : (result.error ?? t('c2.config.connectionFailed')),
});
} catch (err) {
setTestResult({ ok: false, message: extractApiError(err, 'Test failed') });
setTestResult({ ok: false, message: extractApiError(err, t('c2.config.connectionFailed')) });
}
};
@@ -98,25 +100,25 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
data-testid="c2-config-card"
className="card-product flex flex-col gap-md"
>
<h2 className="text-[20px] font-medium text-ink">C2 configuration</h2>
<h2 className="text-[20px] font-medium text-ink">{t('c2.config.title')}</h2>
{is503 && (
<div
role="alert"
className="rounded-none px-xl py-md bg-fog border border-hairline text-[14px] text-charcoal"
>
C2 features are disabled (server has no encryption key configured).
{t('c2.config.disabled')}
</div>
)}
{configQuery.isLoading ? (
<p className="text-[14px] text-graphite">Loading…</p>
<p className="text-[14px] text-graphite">{t('c2.config.loading')}</p>
) : (
<form onSubmit={onSave} noValidate className="flex flex-col gap-md">
<FormField
label="URL"
label={t('c2.config.field.url')}
htmlFor="c2-url"
hint="HTTPS required (e.g. https://mythic.lab:7443)"
hint={t('c2.config.field.urlHint')}
>
<TextInput
id="c2-url"
@@ -130,7 +132,7 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
/>
</FormField>
<FormField label="API token" htmlFor="c2-token">
<FormField label={t('c2.config.field.token')} htmlFor="c2-token">
{config?.has_token && !replaceToken ? (
<div className="flex items-center gap-md">
<TextInput
@@ -149,7 +151,7 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
onClick={() => setReplaceToken(true)}
disabled={disabled}
>
Replace token
{t('c2.config.btn.replaceToken')}
</button>
</div>
) : (
@@ -158,7 +160,7 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
data-testid="c2-token-input"
type="password"
name="api_token"
placeholder={config?.has_token ? 'Enter new token' : 'API token'}
placeholder={config?.has_token ? t('c2.config.field.tokenHint') : t('c2.config.field.token')}
value={token}
onChange={(e) => setToken(e.target.value)}
disabled={disabled}
@@ -178,12 +180,11 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
className="h-4 w-4 accent-primary"
/>
<label htmlFor="c2-verify-tls" className="text-[14px] text-ink">
Verify TLS certificate
{t('c2.config.field.verifyTls')}
</label>
</div>
<p className="text-[12px] text-graphite">
Uncheck only for lab Mythic with self-signed certificates. Disabling
verification exposes the API token to MITM.
{t('c2.config.field.verifyTlsHint')}
</p>
</div>
@@ -194,7 +195,7 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
className="btn-primary"
disabled={disabled || submitting}
>
{updateMutation.isPending ? 'Saving…' : 'Save'}
{updateMutation.isPending ? t('c2.config.btn.saving') : t('c2.config.btn.save')}
</button>
<button
@@ -204,7 +205,7 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
onClick={onTest}
disabled={disabled || testMutation.isPending || !config}
>
{testMutation.isPending ? 'Testing…' : 'Test connection'}
{testMutation.isPending ? t('c2.config.btn.testing') : t('c2.config.btn.test')}
</button>
{testResult !== null && (
@@ -223,7 +224,7 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
onClick={() => setShowDeleteConfirm(true)}
disabled={disabled || submitting}
>
Delete configuration
{t('c2.config.btn.delete')}
</button>
)}
</div>
@@ -232,10 +233,10 @@ export function C2ConfigCard({ engagementId }: C2ConfigCardProps): JSX.Element {
{showDeleteConfirm && (
<ConfirmDialog
title="Delete C2 configuration"
description="This will remove the C2 configuration for this engagement. The API token will be permanently deleted."
confirmLabel="Delete"
cancelLabel="Cancel"
title={t('c2.config.deleteConfirm.title')}
description={t('c2.config.deleteConfirm.desc')}
confirmLabel={t('c2.config.deleteConfirm.confirm')}
cancelLabel={t('c2.config.deleteConfirm.cancel')}
destructive
onConfirm={onDelete}
onCancel={() => setShowDeleteConfirm(false)}

18
frontend/src/components/C2TasksPanel.tsx
View File

@@ -1,5 +1,6 @@
import { Fragment, useState } from 'react';
import { ChevronRight, ChevronDown } from 'lucide-react';
import { useTranslation } from 'react-i18next';
import { useC2Tasks } from '@/hooks/useC2';
import { C2TaskStatusBadge } from './C2TaskStatusBadge';
@@ -8,6 +9,7 @@ interface C2TasksPanelProps {
}
export function C2TasksPanel({ simulationId }: C2TasksPanelProps): JSX.Element {
const { t } = useTranslation();
const query = useC2Tasks(simulationId, { enabled: true });
const [expandedIds, setExpandedIds] = useState<Set<number>>(new Set());
@@ -33,13 +35,13 @@ export function C2TasksPanel({ simulationId }: C2TasksPanelProps): JSX.Element {
className="card-product flex flex-col gap-md"
>
<div className="flex items-center justify-between">
<h3 className="text-[16px] font-medium text-ink">C2 Tasks</h3>
<h3 className="text-[16px] font-medium text-ink">{t('c2.tasks.title')}</h3>
{isRefreshing && (
<span
data-testid="c2-task-refresh-indicator"
className="text-[12px] text-graphite"
>
Refreshing…
{t('c2.tasks.refreshing')}
</span>
)}
</div>
@@ -47,7 +49,7 @@ export function C2TasksPanel({ simulationId }: C2TasksPanelProps): JSX.Element {
{tasks.length === 0 ? (
<div className="border border-hairline rounded-none px-md py-md">
<p className="text-[14px] text-graphite">
No C2 tasks yet. Use Execute via C2 to launch commands.
{t('c2.tasks.empty')}
</p>
</div>
) : (
@@ -56,11 +58,11 @@ export function C2TasksPanel({ simulationId }: C2TasksPanelProps): JSX.Element {
<thead>
<tr className="bg-cloud border-b border-hairline">
<th className="px-md py-sm text-left font-medium text-ink w-8" aria-label="Expand" />
<th className="px-md py-sm text-left font-medium text-ink">Task</th>
<th className="px-md py-sm text-left font-medium text-ink">Command</th>
<th className="px-md py-sm text-left font-medium text-ink">Source</th>
<th className="px-md py-sm text-left font-medium text-ink">Status</th>
<th className="px-md py-sm text-left font-medium text-ink">Completed at</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.tasks.col.task')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.tasks.col.command')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.tasks.col.source')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.tasks.col.status')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.tasks.col.completedAt')}</th>
</tr>
</thead>
<tbody>

20
frontend/src/components/ExecuteViaC2Modal.tsx
View File

@@ -1,4 +1,5 @@
import { useState } from 'react';
import { useTranslation } from 'react-i18next';
import { extractApiError } from '@/api/client';
import { useC2Callbacks, useExecuteC2 } from '@/hooks/useC2';
import { C2CallbackPicker } from './C2CallbackPicker';
@@ -17,6 +18,7 @@ export function ExecuteViaC2Modal({
initialCommands,
onClose,
}: ExecuteViaC2ModalProps): JSX.Element {
const { t } = useTranslation();
const { push } = useToast();
const callbacksQuery = useC2Callbacks(engagementId, { enabled: true });
@@ -43,10 +45,10 @@ export function ExecuteViaC2Modal({
callback_display_id: selectedId,
commands: commandLines,
});
push(`${result.tasks.length} task(s) submitted`, 'success');
push(t('c2.modal.execute.toast.launched', { count: result.tasks.length }), 'success');
onClose();
} catch (err) {
setSubmitError(extractApiError(err, 'Could not execute via C2'));
setSubmitError(extractApiError(err, t('c2.modal.execute.error.launch')));
}
};
@@ -62,12 +64,12 @@ export function ExecuteViaC2Modal({
<div className="relative card-product w-full max-w-3xl mx-md flex flex-col gap-md max-h-[90vh] overflow-y-auto">
<h2 id="c2-modal-title" className="text-[20px] font-medium text-ink">
Execute via C2
{t('c2.modal.execute.title')}
</h2>
{/* Callback picker */}
<div className="flex flex-col gap-xs">
<span className="text-[14px] font-medium text-ink">Select callback</span>
<span className="text-[14px] font-medium text-ink">{t('c2.modal.execute.callback')}</span>
<C2CallbackPicker
callbacks={callbacks}
isLoading={callbacksQuery.isLoading}
@@ -82,7 +84,7 @@ export function ExecuteViaC2Modal({
{/* Commands */}
<div className="flex flex-col gap-xs">
<label htmlFor="c2-commands" className="text-[14px] font-medium text-ink">
Commands
{t('simulation.field.commands')}
</label>
<textarea
id="c2-commands"
@@ -90,10 +92,10 @@ export function ExecuteViaC2Modal({
value={commands}
onChange={(e) => setCommands(e.target.value)}
className="text-input min-h-[112px] py-sm font-mono text-[14px]"
placeholder="One command per line"
placeholder={t('simulation.field.commands')}
/>
<span className="text-[12px] text-graphite">
{commandLines.length} command{commandLines.length !== 1 ? 's' : ''} — one task per line
{t('c2.modal.execute.commandCount', { count: commandLines.length })}
</span>
</div>
@@ -112,7 +114,7 @@ export function ExecuteViaC2Modal({
onClick={onLaunch}
disabled={!canLaunch || executeMutation.isPending}
>
{executeMutation.isPending ? 'Launching…' : 'Launch'}
{executeMutation.isPending ? t('c2.modal.execute.btn.launching') : t('c2.modal.execute.btn.launch')}
</button>
<button
type="button"
@@ -120,7 +122,7 @@ export function ExecuteViaC2Modal({
onClick={onClose}
disabled={executeMutation.isPending}
>
Cancel
{t('c2.modal.execute.btn.cancel')}
</button>
</div>
</div>

44
frontend/src/components/ImportC2HistoryModal.tsx
View File

@@ -1,4 +1,5 @@
import { useState } from 'react';
import { useTranslation } from 'react-i18next';
import { extractApiError } from '@/api/client';
import { useC2Callbacks, useC2CallbackHistory, useImportC2 } from '@/hooks/useC2';
import { C2CallbackPicker } from './C2CallbackPicker';
@@ -18,6 +19,7 @@ export function ImportC2HistoryModal({
engagementId,
onClose,
}: ImportC2HistoryModalProps): JSX.Element {
const { t } = useTranslation();
const { push } = useToast();
const callbacksQuery = useC2Callbacks(engagementId, { enabled: true });
@@ -70,12 +72,12 @@ export function ImportC2HistoryModal({
});
const msg =
result.skipped > 0
? `Imported ${result.imported} task(s), ${result.skipped} already attached`
: `Imported ${result.imported} task(s)`;
? t('c2.modal.import.toast.partial', { imported: result.imported, skipped: result.skipped })
: t('c2.modal.import.toast.imported', { count: result.imported });
push(msg, 'success');
onClose();
} catch (err) {
setSubmitError(extractApiError(err, 'Could not import tasks'));
setSubmitError(extractApiError(err, t('c2.modal.import.error.import')));
}
};
@@ -91,12 +93,12 @@ export function ImportC2HistoryModal({
<div className="relative card-product w-full max-w-4xl mx-md flex flex-col gap-md max-h-[90vh] overflow-y-auto">
<h2 id="c2-import-modal-title" className="text-[20px] font-medium text-ink">
Import C2 history
{t('c2.modal.import.title')}
</h2>
{/* Step 1: callback picker */}
<div className="flex flex-col gap-xs">
<span className="text-[14px] font-medium text-ink">Select callback</span>
<span className="text-[14px] font-medium text-ink">{t('c2.modal.picker.title')}</span>
<C2CallbackPicker
callbacks={callbacks}
isLoading={callbacksQuery.isLoading}
@@ -112,24 +114,24 @@ export function ImportC2HistoryModal({
{selectedCallbackId !== null && (
<div className="flex flex-col gap-xs">
<span className="text-[14px] font-medium text-ink">
Task history{' '}
{t('c2.tasks.title')}{' '}
{total > 0 && (
<span className="text-graphite font-normal">({total} total)</span>
<span className="text-graphite font-normal">({total} {t('c2.modal.import.total').toLowerCase()})</span>
)}
</span>
{historyQuery.isLoading && (
<p className="text-[14px] text-graphite">Loading history…</p>
<p className="text-[14px] text-graphite">{t('state.loading')}</p>
)}
{historyQuery.isError && (
<p className="text-[14px] text-bloom-deep">
{extractApiError(historyQuery.error, 'Could not load history')}
{extractApiError(historyQuery.error, t('c2.modal.import.error.import'))}
</p>
)}
{!historyQuery.isLoading && historyTasks.length === 0 && !historyQuery.isError && (
<p className="text-[14px] text-graphite">No task history for this callback.</p>
<p className="text-[14px] text-graphite">{t('c2.modal.import.empty')}</p>
)}
{historyTasks.length > 0 && (
@@ -140,10 +142,10 @@ export function ImportC2HistoryModal({
<tr className="bg-cloud border-b border-hairline">
<th className="px-md py-sm w-8" aria-label="Select" />
<th className="px-md py-sm text-left font-medium text-ink">#</th>
<th className="px-md py-sm text-left font-medium text-ink">Command</th>
<th className="px-md py-sm text-left font-medium text-ink">Status</th>
<th className="px-md py-sm text-left font-medium text-ink">Completed</th>
<th className="px-md py-sm text-left font-medium text-ink">Timestamp</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.tasks.col.command')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.tasks.col.status')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.modal.import.col.completed')}</th>
<th className="px-md py-sm text-left font-medium text-ink">{t('c2.modal.import.col.timestamp')}</th>
</tr>
</thead>
<tbody>
@@ -175,7 +177,7 @@ export function ImportC2HistoryModal({
<C2TaskStatusBadge status={task.status} />
</td>
<td className="px-md py-sm text-[14px]">
{task.completed ? 'Yes' : 'No'}
{task.completed ? t('common.yes') : t('common.no')}
</td>
<td className="px-md py-sm font-mono text-graphite">
{task.created_at}
@@ -195,10 +197,10 @@ export function ImportC2HistoryModal({
onClick={() => setPage((p) => Math.max(1, p - 1))}
disabled={page <= 1}
>
Prev
{t('c2.modal.import.prev')}
</button>
<span>
Page {page} of {totalPages}
{t('c2.modal.import.page')} {page} {t('c2.modal.import.of')} {totalPages}
</span>
<button
type="button"
@@ -207,11 +209,11 @@ export function ImportC2HistoryModal({
onClick={() => setPage((p) => Math.min(totalPages, p + 1))}
disabled={page >= totalPages}
>
Next
{t('c2.modal.import.next')}
</button>
{checkedIds.size > 0 && (
<span className="ml-auto text-ink">
{checkedIds.size} selected
{checkedIds.size} {t('c2.modal.import.selected')}
</span>
)}
</div>
@@ -235,7 +237,7 @@ export function ImportC2HistoryModal({
onClick={onImport}
disabled={!canImport || importMutation.isPending}
>
{importMutation.isPending ? 'Importing…' : 'Import selected'}
{importMutation.isPending ? t('c2.modal.import.btn.importing') : t('c2.modal.import.btn.import')}
</button>
<button
type="button"
@@ -243,7 +245,7 @@ export function ImportC2HistoryModal({
onClick={onClose}
disabled={importMutation.isPending}
>
Cancel
{t('c2.modal.import.btn.cancel')}
</button>
</div>
</div>

28
frontend/src/i18n/fr.json
View File

@@ -14,7 +14,9 @@
"create": "Créer",
"creating": "Création…",
"close": "Fermer",
"confirm": "Confirmer"
"confirm": "Confirmer",
"yes": "Oui",
"no": "Non"
},
"nav": {
"engagements": "Engagements",
@@ -389,7 +391,7 @@
"commandsRequired": "Aucune commande à exécuter"
},
"toast": {
"launched": "Tâche C2 lancée"
"launched": "{{count}} tâche(s) C2 lancée(s)"
},
"error": {
"launch": "Impossible de lancer la tâche C2"
@@ -409,9 +411,13 @@
},
"selected": "sélectionné(s)",
"empty": "Aucun historique C2 disponible.",
"col": {
"timestamp": "Horodatage",
"completed": "Terminé"
},
"toast": {
"imported": "Historique C2 importé",
"partial": "Import partiel"
"imported": "{{count}} tâche(s) importée(s)",
"partial": "{{imported}} importée(s), {{skipped}} déjà attachée(s)"
},
"error": {
"import": "Impossible d'importer l'historique C2"
@@ -421,7 +427,19 @@
"title": "Sélectionner un agent",
"empty": "Aucun agent disponible.",
"hostnameColon": "Hôte :",
"lastCheckinColon": "Dernière connexion :"
"lastCheckinColon": "Dernière connexion :",
"col": {
"displayId": "ID",
"active": "Actif",
"host": "Hôte",
"user": "Utilisateur",
"domain": "Domaine",
"lastCheckin": "Dernière connexion"
},
"status": {
"active": "Actif",
"inactive": "Inactif"
}
}
}
},

10
frontend/tests/components/C2ConfigCard.test.tsx
View File

@@ -57,7 +57,7 @@ describe('C2ConfigCard — with config (has_token=true)', () => {
it('shows Replace token affordance when has_token=true', async () => {
renderWithProviders(<C2ConfigCard engagementId={1} />);
await waitFor(() => {
expect(screen.getByText('Replace token')).toBeInTheDocument();
expect(screen.getByText('Remplacer le token')).toBeInTheDocument();
});
// Token input shows placeholder bullets (readOnly)
const tokenInput = screen.getByTestId('c2-token-input') as HTMLInputElement;
@@ -75,9 +75,9 @@ describe('C2ConfigCard — with config (has_token=true)', () => {
it('clicking Replace token makes input editable', async () => {
renderWithProviders(<C2ConfigCard engagementId={1} />);
await waitFor(() => {
expect(screen.getByText('Replace token')).toBeInTheDocument();
expect(screen.getByText('Remplacer le token')).toBeInTheDocument();
});
fireEvent.click(screen.getByText('Replace token'));
fireEvent.click(screen.getByText('Remplacer le token'));
await waitFor(() => {
const tokenInput = screen.getByTestId('c2-token-input') as HTMLInputElement;
expect(tokenInput.readOnly).toBeFalsy();
@@ -99,7 +99,7 @@ describe('C2ConfigCard — with config (has_token=true)', () => {
});
fireEvent.click(screen.getByTestId('c2-test-btn'));
await waitFor(() => {
expect(screen.getByText('Connected')).toBeInTheDocument();
expect(screen.getByText('Connecté')).toBeInTheDocument();
});
});
@@ -124,7 +124,7 @@ describe('C2ConfigCard — 503 disabled state', () => {
renderWithProviders(<C2ConfigCard engagementId={1} />);
await waitFor(() => {
expect(
screen.getByText(/C2 features are disabled/i),
screen.getByText(/fonctionnalités C2 sont désactivées/i),
).toBeInTheDocument();
});
expect(screen.getByTestId('c2-save-btn')).toBeDisabled();

2
frontend/tests/components/C2TasksPanel.test.tsx
View File

@@ -66,7 +66,7 @@ describe('C2TasksPanel — empty state', () => {
await waitFor(() => {
expect(screen.getByTestId('c2-tasks-panel')).toBeInTheDocument();
});
expect(screen.getByText(/No C2 tasks yet/i)).toBeInTheDocument();
expect(screen.getByText(/Aucune tâche C2/i)).toBeInTheDocument();
expect(screen.queryByTestId('c2-task-row')).toBeNull();
});
});

4
frontend/tests/components/ExecuteViaC2Modal.test.tsx
View File

@@ -66,7 +66,7 @@ describe('ExecuteViaC2Modal', () => {
it('renders modal with title and callback table', async () => {
renderModal();
expect(screen.getByTestId('c2-modal')).toBeInTheDocument();
expect(screen.getByText('Execute via C2')).toBeInTheDocument();
expect(screen.getByText('Exécuter via C2')).toBeInTheDocument();
await waitFor(() => {
expect(screen.getAllByTestId('c2-callback-row')).toHaveLength(2);
});
@@ -148,7 +148,7 @@ describe('ExecuteViaC2Modal', () => {
await waitFor(() => {
expect(screen.getAllByTestId('c2-callback-row')).toHaveLength(2);
});
fireEvent.click(screen.getByRole('button', { name: /cancel/i }));
fireEvent.click(screen.getByRole('button', { name: /Annuler/i }));
expect(onClose).toHaveBeenCalled();
});

8
frontend/tests/components/ImportC2HistoryModal.test.tsx
View File

@@ -88,7 +88,7 @@ describe('ImportC2HistoryModal — step 1: callback picker', () => {
it('renders modal with title and callback rows', async () => {
renderModal();
expect(screen.getByTestId('c2-import-modal')).toBeInTheDocument();
expect(screen.getByText('Import C2 history')).toBeInTheDocument();
expect(screen.getByText("Importer l'historique C2")).toBeInTheDocument();
await waitFor(() => {
expect(screen.getAllByTestId('c2-import-callback-row')).toHaveLength(2);
});
@@ -322,7 +322,7 @@ describe('ImportC2HistoryModal — toast wording', () => {
fireEvent.click(screen.getByTestId('c2-import-submit-btn'));
await waitFor(() => {
expect(screen.getByText('Imported 1 task(s)')).toBeInTheDocument();
expect(screen.getByText('1 tâche(s) importée(s)')).toBeInTheDocument();
});
});
@@ -342,7 +342,7 @@ describe('ImportC2HistoryModal — toast wording', () => {
await waitFor(() => {
expect(
screen.getByText('Imported 0 task(s), 1 already attached'),
screen.getByText('0 importée(s), 1 déjà attachée(s)'),
).toBeInTheDocument();
});
});
@@ -374,7 +374,7 @@ describe('ImportC2HistoryModal — Cancel button', () => {
await waitFor(() => {
expect(screen.getAllByTestId('c2-import-callback-row')).toHaveLength(2);
});
fireEvent.click(screen.getByRole('button', { name: /cancel/i }));
fireEvent.click(screen.getByRole('button', { name: /Annuler/i }));
expect(onClose).toHaveBeenCalled();
});
});