From 5449b71393e70a4b7d3b3aad935c6ce5d0fdfd47 Mon Sep 17 00:00:00 2001
From: Jonathan <contact@grafikart.fr>
Date: Fri, 12 Jan 2024 12:59:20 +0100
Subject: [PATCH] fix: label on roster for loop

---
 .../__snapshots__/roster-for-loop.spec.tsx.snap        |  9 ++++++++-
 .../loop/roster-for-loop/roster-for-loop.tsx           | 10 ++++++----
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/components/loop/roster-for-loop/__snapshots__/roster-for-loop.spec.tsx.snap b/src/components/loop/roster-for-loop/__snapshots__/roster-for-loop.spec.tsx.snap
index ae4af48b6..5e7de0626 100644
--- a/src/components/loop/roster-for-loop/__snapshots__/roster-for-loop.spec.tsx.snap
+++ b/src/components/loop/roster-for-loop/__snapshots__/roster-for-loop.spec.tsx.snap
@@ -2,6 +2,13 @@
 
 exports[`RosterForLoop > renders the right number of columns 1`] = `
 <div>
+  <label
+    class="lunatic-label"
+    for="table"
+    id="label-table"
+  >
+    Ceci est un test
+  </label>
   <table
     class="lunatic-table"
     id="table-table"
@@ -77,7 +84,7 @@ exports[`RosterForLoop > renders the right number of columns 1`] = `
   <input
     class="button-lunatic"
     type="button"
-    value="Ceci est un test"
+    value="Add row"
   />
   <input
     class="button-lunatic"
diff --git a/src/components/loop/roster-for-loop/roster-for-loop.tsx b/src/components/loop/roster-for-loop/roster-for-loop.tsx
index cb0686f7f..21f25ab6c 100644
--- a/src/components/loop/roster-for-loop/roster-for-loop.tsx
+++ b/src/components/loop/roster-for-loop/roster-for-loop.tsx
@@ -5,7 +5,7 @@ import {
 	DeclarationsBeforeText,
 	DeclarationsDetachable,
 } from '../../declarations';
-import { createCustomizableLunaticField, Errors } from '../../commons';
+import { createCustomizableLunaticField, Errors, Label } from '../../commons';
 import { LoopButton } from '../loop-button';
 import D from '../../../i18n';
 import type { LunaticComponentProps } from '../../type';
@@ -30,11 +30,11 @@ export const RosterForLoop = createCustomizableLunaticField<
 		lines,
 		handleChange,
 		declarations,
-		label,
 		header,
 		iterations,
 		id,
 		getComponents,
+		label,
 		...otherProps // These props will be passed down to the child components
 	} = props;
 	const min = lines?.min || DEFAULT_MIN_ROWS;
@@ -65,9 +65,11 @@ export const RosterForLoop = createCustomizableLunaticField<
 	}
 
 	let cols = 0;
-
 	return (
 		<>
+			<Label htmlFor={id} id={`label-${id}`}>
+				{label}
+			</Label>
 			<DeclarationsBeforeText declarations={declarations} id={id} />
 			<DeclarationsAfterText declarations={declarations} id={id} />
 			<Table id={id}>
@@ -118,7 +120,7 @@ export const RosterForLoop = createCustomizableLunaticField<
 			{showButtons && (
 				<>
 					<LoopButton onClick={addRow} disabled={nbRows === max}>
-						{label || D.DEFAULT_BUTTON_ADD}
+						{D.DEFAULT_BUTTON_ADD}
 					</LoopButton>
 					<LoopButton onClick={removeRow} disabled={nbRows === min}>
 						{D.DEFAULT_BUTTON_REMOVE}