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

feat(frontend): i18n template pages (list, form, picker modal)

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Knacky
2026-06-21 23:36:20 +02:00
parent 5b93f880a3
commit 284494cee8
6 changed files with 124 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
frontend/src/components/TemplatePickerModal.tsx
View File

@@ -1,3 +1,4 @@
import { useTranslation } from 'react-i18next';
import { extractApiError } from '@/api/client';
import type { SimulationTemplate } from '@/api/types';
import { useTemplates } from '@/hooks/useTemplates';
@@ -23,6 +24,7 @@ export function TemplatePickerModal({
onSelectTemplate,
isPending = false,
}: TemplatePickerModalProps): JSX.Element {
const { t } = useTranslation();
const { data, isLoading, isError, error, refetch } = useTemplates();
return (
@@ -37,11 +39,11 @@ export function TemplatePickerModal({
<div className="relative card-product max-w-xl w-full mx-md flex flex-col gap-md max-h-[80vh] overflow-hidden">
<div className="flex items-center justify-between">
<h2 id="tpl-picker-title" className="text-[20px] font-medium text-ink">
From template…
{t('template.picker.title')}
</h2>
<button
type="button"
aria-label="Close"
aria-label={t('common.close')}
onClick={onClose}
className="text-graphite hover:text-ink text-[20px] leading-none"
>
@@ -50,19 +52,18 @@ export function TemplatePickerModal({
</div>
<div className="overflow-y-auto flex-1 -mx-xl px-xl">
{isLoading ? <LoadingState label="Loading templates…" /> : null}
{isLoading ? <LoadingState label={t('template.picker.loading')} /> : null}
{isError ? (
<ErrorState
message={extractApiError(error, 'Could not load templates')}
message={extractApiError(error, t('template.form.errorLoad'))}
onRetry={() => refetch()}
/>
) : null}
{!isLoading && !isError && data && data.length === 0 ? (
<EmptyState
title="No templates available"
description="Create one from the Templates page."
title={t('template.picker.empty')}
/>
) : null}
@@ -70,22 +71,22 @@ export function TemplatePickerModal({
<table className="w-full text-left" data-testid="template-picker-table">
<thead className="bg-cloud border-b border-hairline">
<tr className="text-[12px] uppercase tracking-[0.5px] text-graphite">
<th className="px-md py-sm">Name</th>
<th className="px-md py-sm">MITRE</th>
<th className="px-md py-sm">Created by</th>
<th className="px-md py-sm">{t('template.list.col.name')}</th>
<th className="px-md py-sm">{t('simulation.list.col.mitre')}</th>
<th className="px-md py-sm">{t('template.list.col.createdBy')}</th>
</tr>
</thead>
<tbody>
{data.map((t) => (
{data.map((template) => (
<tr
key={t.id}
key={template.id}
className="border-b border-hairline last:border-0 hover:bg-cloud cursor-pointer"
onClick={() => !isPending && onSelectTemplate(t)}
data-testid={`template-row-${t.id}`}
onClick={() => !isPending && onSelectTemplate(template)}
data-testid={`template-row-${template.id}`}
>
<td className="px-md py-sm text-ink font-medium">{t.name}</td>
<td className="px-md py-sm text-charcoal text-[14px]">{mitreCount(t)}</td>
<td className="px-md py-sm text-charcoal text-[14px]">{t.created_by.username}</td>
<td className="px-md py-sm text-ink font-medium">{template.name}</td>
<td className="px-md py-sm text-charcoal text-[14px]">{mitreCount(template)}</td>
<td className="px-md py-sm text-charcoal text-[14px]">{template.created_by.username}</td>
</tr>
))}
</tbody>
@@ -95,7 +96,7 @@ export function TemplatePickerModal({
<div className="border-t border-hairline pt-sm">
<button type="button" className="btn-outline-ink" onClick={onClose}>
Cancel
{t('common.cancel')}
</button>
</div>
</div>

93
frontend/src/pages/TemplateFormPage.tsx
View File

@@ -1,6 +1,7 @@
import { useEffect, useState, type FormEvent } from 'react';
import { Link, useNavigate, useParams } from 'react-router-dom';
import { Save, Grid2x2 } from 'lucide-react';
import { useTranslation } from 'react-i18next';
import { extractApiError } from '@/api/client';
import type { MitreTechnique, MitreTacticRef } from '@/api/types';
import { useToast } from '@/hooks/useToast';
@@ -25,6 +26,7 @@ interface FormState {
const EMPTY: FormState = { name: '', description: '', commands: '', prerequisites: '' };
export function TemplateFormPage(): JSX.Element {
const { t } = useTranslation();
const { id } = useParams<{ id: string }>();
const templateId = id ? Number(id) : undefined;
const isNew = !templateId;
@@ -47,15 +49,15 @@ export function TemplateFormPage(): JSX.Element {
useEffect(() => {
if (existing.data) {
const t = existing.data;
const tpl = existing.data;
setForm({
name: t.name,
description: t.description ?? '',
commands: t.commands ?? '',
prerequisites: t.prerequisites ?? '',
name: tpl.name,
description: tpl.description ?? '',
commands: tpl.commands ?? '',
prerequisites: tpl.prerequisites ?? '',
});
setTechniques(t.techniques);
setTactics(t.tactics);
setTechniques(tpl.techniques);
setTactics(tpl.tactics);
}
}, [existing.data]);
@@ -65,7 +67,7 @@ export function TemplateFormPage(): JSX.Element {
e.preventDefault();
setFormError(null);
if (!form.name.trim()) {
setFormError('Name is required');
setFormError(t('template.form.validation.nameRequired'));
return;
}
const payload = {
@@ -73,20 +75,20 @@ export function TemplateFormPage(): JSX.Element {
description: form.description.trim() || null,
commands: form.commands.trim() || null,
prerequisites: form.prerequisites.trim() || null,
technique_ids: techniques.map((t) => t.id),
tactic_ids: tactics.map((t) => t.id),
technique_ids: techniques.map((tech) => tech.id),
tactic_ids: tactics.map((tac) => tac.id),
};
try {
if (isNew) {
const created = await createMutation.mutateAsync(payload);
push('Template created', 'success');
push(t('template.form.toast.created'), 'success');
navigate(`/admin/templates/${created.id}/edit`, { replace: true });
} else {
await updateMutation.mutateAsync(payload);
push('Template saved', 'success');
push(t('template.form.toast.saved'), 'success');
}
} catch (err) {
setFormError(extractApiError(err, 'Could not save template'));
setFormError(extractApiError(err, t('template.form.errorSave')));
}
};
@@ -94,10 +96,10 @@ export function TemplateFormPage(): JSX.Element {
if (!templateId) return;
try {
await deleteMutation.mutateAsync(templateId);
push('Template deleted', 'success');
push(t('template.form.toast.deleted'), 'success');
navigate('/admin/templates', { replace: true });
} catch (err) {
push(extractApiError(err, 'Could not delete template'), 'error');
push(extractApiError(err, t('template.form.errorDelete')), 'error');
}
setShowDeleteConfirm(false);
};
@@ -109,16 +111,16 @@ export function TemplateFormPage(): JSX.Element {
};
const handlePickerSelect = (technique: MitreTechnique) => {
if (techniques.some((t) => t.id === technique.id)) return;
if (techniques.some((tech) => tech.id === technique.id)) return;
setTechniques((prev) => [...prev, technique]);
setShowPicker(false);
};
if (!isNew && existing.isLoading) return <LoadingState label="Loading template…" />;
if (!isNew && existing.isLoading) return <LoadingState label={t('template.form.loading')} />;
if (!isNew && existing.isError) {
return (
<ErrorState
message={extractApiError(existing.error, 'Could not load template')}
message={extractApiError(existing.error, t('template.form.errorLoad'))}
onRetry={() => existing.refetch()}
/>
);
@@ -128,9 +130,9 @@ export function TemplateFormPage(): JSX.Element {
<div className="flex flex-col gap-xl">
<header className="flex items-start justify-between gap-md">
<div className="flex flex-col gap-sm">
<BackLink to="/admin/templates">Back to templates</BackLink>
<BackLink to="/admin/templates">{t('engagement.detail.backTo')}</BackLink>
<h1 className="text-[32px] font-medium leading-none">
{isNew ? 'New template' : (existing.data?.name ?? 'Edit template')}
{isNew ? t('template.form.title.new') : (existing.data?.name ?? t('template.form.title.edit'))}
</h1>
</div>
{!isNew ? (
@@ -140,13 +142,13 @@ export function TemplateFormPage(): JSX.Element {
onClick={() => setShowDeleteConfirm(true)}
disabled={deleteMutation.isPending}
>
Delete
{t('template.form.btn.delete')}
</button>
) : null}
</header>
<form onSubmit={onSubmit} className="card-product flex flex-col gap-lg max-w-2xl">
<FormField label="Name" htmlFor="tpl-name" required error={formError}>
<FormField label={t('template.form.field.name')} htmlFor="tpl-name" required error={formError}>
<TextInput
id="tpl-name"
value={form.name}
@@ -155,56 +157,56 @@ export function TemplateFormPage(): JSX.Element {
/>
</FormField>
<FormField label="Description" htmlFor="tpl-desc">
<FormField label={t('template.form.field.description')} htmlFor="tpl-desc">
<TextArea
id="tpl-desc"
value={form.description}
onChange={(e) => setForm({ ...form, description: e.target.value })}
disabled={isPending}
placeholder="What does this simulation cover?"
placeholder={t('template.form.field.descriptionPlaceholder')}
/>
</FormField>
<FormField label="Commands" htmlFor="tpl-commands" hint="One command per line">
<FormField label={t('template.form.field.commands')} htmlFor="tpl-commands" hint={t('template.form.field.commandsHint')}>
<TextArea
id="tpl-commands"
value={form.commands}
onChange={(e) => setForm({ ...form, commands: e.target.value })}
disabled={isPending}
placeholder="e.g. mimikatz.exe&#10;sekurlsa::logonpasswords"
placeholder={t('template.form.field.commandsPlaceholder')}
className="font-mono text-[14px]"
/>
</FormField>
<FormField label="Prerequisites" htmlFor="tpl-prereqs">
<FormField label={t('template.form.field.prerequisites')} htmlFor="tpl-prereqs">
<TextArea
id="tpl-prereqs"
value={form.prerequisites}
onChange={(e) => setForm({ ...form, prerequisites: e.target.value })}
disabled={isPending}
placeholder="e.g. Local admin access required"
placeholder={t('template.form.field.prerequisitesPlaceholder')}
/>
</FormField>
<div className="flex flex-col gap-sm">
<span className="text-[14px] font-medium text-ink">MITRE Techniques &amp; Tactics</span>
<span className="text-[14px] font-medium text-ink">{t('template.form.field.mitre')}</span>
{techniques.length === 0 && tactics.length === 0 ? (
<p className="text-[13px] text-graphite">No techniques selected</p>
<p className="text-[13px] text-graphite">{t('template.form.field.mitreEmpty')}</p>
) : (
<div className="flex flex-wrap gap-xs" data-testid="techniques-tag-list">
{tactics.map((t) => (
{tactics.map((tac) => (
<MitreTacticTag
key={t.id}
tactic={t}
onRemove={() => setTactics((prev) => prev.filter((x) => x.id !== t.id))}
key={tac.id}
tactic={tac}
onRemove={() => setTactics((prev) => prev.filter((x) => x.id !== tac.id))}
/>
))}
{techniques.map((t) => (
{techniques.map((tech) => (
<MitreTechniqueTag
key={t.id}
technique={t}
onRemove={() => setTechniques((prev) => prev.filter((x) => x.id !== t.id))}
key={tech.id}
technique={tech}
onRemove={() => setTechniques((prev) => prev.filter((x) => x.id !== tech.id))}
/>
))}
</div>
@@ -220,13 +222,13 @@ export function TemplateFormPage(): JSX.Element {
className="text-input h-9 text-[13px] text-graphite text-left cursor-text w-full"
onClick={() => setShowPicker(true)}
>
Search technique (e.g. T1059)…
{t('template.form.field.mitreSearch')}
</button>
)}
</div>
<button
type="button"
aria-label="Open MITRE matrix"
aria-label={t('template.form.field.mitreOpenMatrix')}
onClick={() => { setShowPicker(false); setShowMatrix(true); }}
className="flex-shrink-0 flex items-center justify-center w-9 h-9 rounded-none border border-steel text-graphite hover:text-ink hover:border-ink"
>
@@ -237,10 +239,10 @@ export function TemplateFormPage(): JSX.Element {
<div className="flex items-center gap-md pt-xs border-t border-hairline">
<button type="submit" className="btn-primary" disabled={isPending}>
<Save size={14} aria-hidden /> {isPending ? 'Saving…' : 'Save'}
<Save size={14} aria-hidden /> {isPending ? t('template.form.btn.saving') : t('template.form.btn.save')}
</button>
<Link to="/admin/templates" className="btn-outline-ink">
Cancel
{t('template.form.btn.cancel')}
</Link>
</div>
</form>
@@ -255,9 +257,10 @@ export function TemplateFormPage(): JSX.Element {
{showDeleteConfirm ? (
<ConfirmDialog
title="Delete template"
description={`Delete "${existing.data?.name ?? 'this template'}"? This cannot be undone. Simulations already created from it are unaffected.`}
confirmLabel="Delete"
title={t('template.form.deleteConfirm.title')}
description={t('template.form.deleteConfirm.desc')}
confirmLabel={t('template.form.deleteConfirm.confirm')}
cancelLabel={t('template.form.deleteConfirm.cancel')}
onConfirm={onDelete}
onCancel={() => setShowDeleteConfirm(false)}
destructive

66
frontend/src/pages/TemplatesListPage.tsx
View File

@@ -1,5 +1,6 @@
import { Link } from 'react-router-dom';
import { Plus } from 'lucide-react';
import { useTranslation } from 'react-i18next';
import { extractApiError } from '@/api/client';
import type { SimulationTemplate } from '@/api/types';
import { useDeleteTemplate, useTemplates } from '@/hooks/useTemplates';
@@ -7,28 +8,25 @@ import { useToast } from '@/hooks/useToast';
import { LoadingState } from '@/components/LoadingState';
import { ErrorState } from '@/components/ErrorState';
import { EmptyState } from '@/components/EmptyState';
import { formatDate } from '@/lib/format';
function mitreCount(t: SimulationTemplate): number {
return t.techniques.length + t.tactics.length;
}
function formatDate(value: string | null): string {
if (!value) return '—';
return value.slice(0, 10);
}
export function TemplatesListPage(): JSX.Element {
const { t } = useTranslation();
const { data, isLoading, isError, error, refetch } = useTemplates();
const deleteMutation = useDeleteTemplate();
const { push } = useToast();
const onDelete = async (t: SimulationTemplate) => {
if (!window.confirm(`Delete template "${t.name}"? This cannot be undone.`)) return;
const onDelete = async (template: SimulationTemplate) => {
if (!window.confirm(`${t('template.list.title')} « ${template.name} » ?`)) return;
try {
await deleteMutation.mutateAsync(t.id);
push('Template deleted', 'success');
await deleteMutation.mutateAsync(template.id);
push(t('template.form.toast.deleted'), 'success');
} catch (err) {
push(extractApiError(err, 'Could not delete template'), 'error');
push(extractApiError(err, t('template.form.errorDelete')), 'error');
}
};
@@ -36,32 +34,32 @@ export function TemplatesListPage(): JSX.Element {
<div className="flex flex-col gap-xl">
<header className="flex items-end justify-between gap-md">
<div>
<h1 className="text-[32px] font-medium leading-none">Templates</h1>
<h1 className="text-[32px] font-medium leading-none">{t('template.list.title')}</h1>
<p className="text-charcoal text-[16px] mt-sm">
Reusable simulation blueprints for red team operations.
{t('template.list.subtitle')}
</p>
</div>
<Link to="/admin/templates/new" className="btn-primary">
<Plus size={14} aria-hidden /> New
<Plus size={14} aria-hidden /> {t('template.list.new')}
</Link>
</header>
{isLoading ? <LoadingState label="Loading templates…" /> : null}
{isLoading ? <LoadingState label={t('common.loading')} /> : null}
{isError ? (
<ErrorState
message={extractApiError(error, 'Could not load templates')}
message={extractApiError(error, t('template.form.errorLoad'))}
onRetry={() => refetch()}
/>
) : null}
{!isLoading && !isError && data && data.length === 0 ? (
<EmptyState
title="No templates yet"
description="Create your first template to speed up simulation setup."
title={t('template.list.empty.title')}
description={t('template.list.empty.desc')}
action={
<Link to="/admin/templates/new" className="btn-primary">
<Plus size={14} aria-hidden /> New template
<Plus size={14} aria-hidden /> {t('template.list.new')}
</Link>
}
/>
@@ -72,41 +70,41 @@ export function TemplatesListPage(): JSX.Element {
<table className="table-compact w-full text-left">
<thead className="bg-cloud border-b border-hairline">
<tr>
<th>Name</th>
<th>MITRE</th>
<th>Created by</th>
<th>Updated</th>
<th className="text-right">Actions</th>
<th>{t('template.list.col.name')}</th>
<th>{t('template.list.col.mitre')}</th>
<th>{t('template.list.col.createdBy')}</th>
<th>{t('template.list.col.updated')}</th>
<th className="text-right">{t('engagement.list.col.actions')}</th>
</tr>
</thead>
<tbody>
{data.map((t) => (
<tr key={t.id}>
{data.map((template) => (
<tr key={template.id}>
<td>
<Link
to={`/admin/templates/${t.id}/edit`}
to={`/admin/templates/${template.id}/edit`}
className="text-ink font-medium hover:underline"
>
{t.name}
{template.name}
</Link>
</td>
<td className="text-charcoal">
{mitreCount(t) === 0 ? '—' : mitreCount(t)}
{mitreCount(template) === 0 ? '—' : mitreCount(template)}
</td>
<td className="text-charcoal">{t.created_by.username}</td>
<td className="text-charcoal font-mono">{formatDate(t.updated_at)}</td>
<td className="text-charcoal">{template.created_by.username}</td>
<td className="text-charcoal font-mono">{formatDate(template.updated_at)}</td>
<td className="text-right">
<div className="inline-flex gap-sm">
<Link to={`/admin/templates/${t.id}/edit`} className="btn-text-link">
Edit
<Link to={`/admin/templates/${template.id}/edit`} className="btn-text-link">
{t('template.list.edit')}
</Link>
<button
type="button"
className="btn-text-link text-bloom-deep"
onClick={() => onDelete(t)}
onClick={() => onDelete(template)}
disabled={deleteMutation.isPending}
>
Delete
{t('template.list.delete')}
</button>
</div>
</td>

38
frontend/tests/TemplateFormPage.test.tsx
View File

@@ -92,22 +92,20 @@ describe('TemplateFormPage — new mode', () => {
it('renders the form with name field in empty state', () => {
renderNew();
expect(screen.getByLabelText(/Name/i)).toBeInTheDocument();
expect(screen.getByLabelText(/Description/i)).toBeInTheDocument();
expect(screen.getByLabelText(/Commands/i)).toBeInTheDocument();
expect(screen.getByLabelText(/Prerequisites/i)).toBeInTheDocument();
// All inputs should be empty
expect(screen.getByLabelText(/Name/i)).toHaveValue('');
expect(screen.getByLabelText(/^Nom/i)).toBeInTheDocument();
expect(screen.getByLabelText(/^Description/i)).toBeInTheDocument();
expect(screen.getByLabelText(/^Commandes/i)).toBeInTheDocument();
expect(screen.getByLabelText(/^Prérequis/i)).toBeInTheDocument();
expect(screen.getByLabelText(/^Nom/i)).toHaveValue('');
});
it('shows validation error when name is empty on submit', async () => {
const user = userEvent.setup();
renderNew();
// Name field is empty by default — click Save directly
const saveBtn = screen.getByRole('button', { name: /Save/i });
const saveBtn = screen.getByRole('button', { name: /Enregistrer/i });
await user.click(saveBtn);
await waitFor(() => {
expect(screen.getByText('Name is required')).toBeInTheDocument();
expect(screen.getByText('Le nom est obligatoire')).toBeInTheDocument();
});
});
@@ -115,8 +113,8 @@ describe('TemplateFormPage — new mode', () => {
mock.onPost('/templates').reply(201, { ...TEMPLATE, id: 99 });
const user = userEvent.setup();
renderNew();
await user.type(screen.getByLabelText(/Name/i), 'My Template');
await user.click(screen.getByRole('button', { name: /Save/i }));
await user.type(screen.getByLabelText(/^Nom/i), 'My Template');
await user.click(screen.getByRole('button', { name: /Enregistrer/i }));
await waitFor(() => {
expect(mock.history.post.length).toBe(1);
});
@@ -128,8 +126,8 @@ describe('TemplateFormPage — new mode', () => {
mock.onPost('/templates').reply(409, { error: 'template name already exists' });
const user = userEvent.setup();
renderNew();
await user.type(screen.getByLabelText(/Name/i), 'Duplicate');
await user.click(screen.getByRole('button', { name: /Save/i }));
await user.type(screen.getByLabelText(/^Nom/i), 'Duplicate');
await user.click(screen.getByRole('button', { name: /Enregistrer/i }));
await waitFor(() => {
expect(screen.getByText('template name already exists')).toBeInTheDocument();
});
@@ -137,7 +135,7 @@ describe('TemplateFormPage — new mode', () => {
it('does not show Delete button in new mode', () => {
renderNew();
expect(screen.queryByText('Delete')).toBeNull();
expect(screen.queryByText('Supprimer')).toBeNull();
});
});
@@ -176,7 +174,7 @@ describe('TemplateFormPage — edit mode', () => {
await waitFor(() => {
expect(screen.getByDisplayValue('Mimikatz LSASS Dump')).toBeInTheDocument();
});
expect(screen.getByText('Delete')).toBeInTheDocument();
expect(screen.getByText('Supprimer')).toBeInTheDocument();
});
it('submits PATCH on save', async () => {
@@ -187,7 +185,7 @@ describe('TemplateFormPage — edit mode', () => {
await waitFor(() => {
expect(screen.getByDisplayValue('Mimikatz LSASS Dump')).toBeInTheDocument();
});
await user.click(screen.getByRole('button', { name: /Save/i }));
await user.click(screen.getByRole('button', { name: /Enregistrer/i }));
await waitFor(() => {
expect(mock.history.patch.length).toBe(1);
});
@@ -201,14 +199,14 @@ describe('TemplateFormPage — edit mode', () => {
const user = userEvent.setup();
renderEdit(5);
await waitFor(() => {
expect(screen.getByText('Delete')).toBeInTheDocument();
expect(screen.getByText('Supprimer')).toBeInTheDocument();
});
await user.click(screen.getByText('Delete'));
await user.click(screen.getByText('Supprimer'));
await waitFor(() => {
expect(screen.getByRole('dialog')).toBeInTheDocument();
});
// Click the Delete button inside the dialog
const dialogDeleteBtn = screen.getAllByText('Delete').find(
// Click the Supprimer button inside the dialog
const dialogDeleteBtn = screen.getAllByText('Supprimer').find(
(el) => el.tagName === 'BUTTON' && el.closest('[role="dialog"]')
) as HTMLElement;
await user.click(dialogDeleteBtn);

6
frontend/tests/TemplatePickerModal.test.tsx
View File

@@ -76,7 +76,7 @@ describe('TemplatePickerModal', () => {
await waitFor(() => {
expect(screen.getByTestId('empty-state')).toBeInTheDocument();
});
expect(screen.getByText(/No templates available/i)).toBeInTheDocument();
expect(screen.getByText(/Aucun template disponible/i)).toBeInTheDocument();
});
it('lists templates with name and MITRE count', async () => {
@@ -128,9 +128,9 @@ describe('TemplatePickerModal', () => {
/>
);
await waitFor(() => {
expect(screen.getByText('Cancel')).toBeInTheDocument();
expect(screen.getByText('Annuler')).toBeInTheDocument();
});
await user.click(screen.getByText('Cancel'));
await user.click(screen.getByText('Annuler'));
expect(onClose).toHaveBeenCalledOnce();
});

10
frontend/tests/TemplatesListPage.test.tsx
View File

@@ -100,7 +100,7 @@ describe('TemplatesListPage', () => {
await waitFor(() => {
expect(screen.getByText('Mimikatz LSASS Dump')).toBeInTheDocument();
});
expect(screen.getAllByText(/New/i).length).toBeGreaterThan(0);
expect(screen.getAllByText(/Nouveau/i).length).toBeGreaterThan(0);
});
it('shows Edit and Delete actions', async () => {
@@ -109,8 +109,8 @@ describe('TemplatesListPage', () => {
await waitFor(() => {
expect(screen.getByText('Mimikatz LSASS Dump')).toBeInTheDocument();
});
expect(screen.getAllByText('Edit').length).toBe(2);
expect(screen.getAllByText('Delete').length).toBe(2);
expect(screen.getAllByText('Modifier').length).toBe(2);
expect(screen.getAllByText('Supprimer').length).toBe(2);
});
it('calls delete endpoint on confirm', async () => {
@@ -124,10 +124,10 @@ describe('TemplatesListPage', () => {
renderWithProviders(<TemplatesListPage />);
await waitFor(() => {
expect(screen.getAllByText('Delete')[0]).toBeInTheDocument();
expect(screen.getAllByText('Supprimer')[0]).toBeInTheDocument();
});
const deleteButtons = screen.getAllByText('Delete');
const deleteButtons = screen.getAllByText('Supprimer');
await user.click(deleteButtons[0]);
await waitFor(() => {