feat(Champ.repetition): hide destroy button of first repetition row when the repetition is mandatory

app/assets/stylesheets/forms.scss

@@ -413,6 +413,10 @@
         margin-bottom: 2 * $default-padding;
       }
     }
+
+    .utils-repetition-required .row:first-child .utils-repetition-required-destroy-button {
+      display: none;
+    }
   }
 
   .editable-champ-titre_identite { // scss-lint:disable SelectorFormat

app/components/editable_champ/repetition_component/repetition_component.html.haml

@@ -4,7 +4,7 @@
     .notice{ notice_params }= render SimpleFormatComponent.new(@champ.description, allow_a: true)
 
 
-  .repetition{ id: dom_id(@champ, :rows) }
+  .repetition{ id: dom_id(@champ, :rows), class: class_names('utils-repetition-required' => @champ.mandatory?) }
     - @champ.row_ids.each.with_index(1) do |row_id, row_number|
       = render EditableChamp::RepetitionRowComponent.new(form: @form, dossier: @champ.dossier, type_de_champ: @champ.type_de_champ, row_id:, row_number:, seen_at: @seen_at)
 

app/components/editable_champ/repetition_row_component/repetition_row_component.html.haml

@@ -7,5 +7,5 @@
     = render section_component
 
   .flex.row-reverse
-    = render NestedForms::OwnedButtonComponent.new(formaction: champs_repetition_path(@dossier, @type_de_champ.stable_id, row_id:), http_method: :delete, opt: { class: "fr-btn fr-btn--sm fr-btn--tertiary fr-text-action-high--red-marianne", title: t(".delete_title", row_number:)}) do
+    = render NestedForms::OwnedButtonComponent.new(formaction: champs_repetition_path(@dossier, @type_de_champ.stable_id, row_id:), http_method: :delete, opt: { class: "fr-btn fr-btn--sm fr-btn--tertiary fr-text-action-high--red-marianne utils-repetition-required-destroy-button", title: t(".delete_title", row_number:)}) do
       = t(".delete")

spec/system/users/brouillon_spec.rb

@@ -131,8 +131,15 @@ describe 'The user' do
     fill_in('sub type de champ', with: 'super texte')
     expect(page).to have_field('sub type de champ', with: 'super texte')
 
+    # first repetition have a destroy hidden
+    expect(page).to have_selector(".repetition .row .utils-repetition-required-destroy-button", count: 1, visible: false)
+    expect(page).to have_selector(".repetition .row", count: 1)
+
+    # adding an element means we can ddestroy last item
     click_on 'Ajouter un élément pour'
-    expect(page).to have_content('Supprimer', count: 2)
+    expect(page).to have_selector(".repetition .row:first-child .utils-repetition-required-destroy-button", count: 1, visible: false)
+    expect(page).to have_selector(".repetition .row", count: 2)
+    expect(page).to have_selector(".repetition .row:last-child .utils-repetition-required-destroy-button", count: 1, visible: true)
 
     within '.repetition .row:first-child' do
       fill_in('sub type de champ', with: 'un autre texte')
@@ -140,10 +147,12 @@ describe 'The user' do
     end
 
     expect do
-      within '.repetition .row:first-child' do
+      within '.repetition .row:last-child' do
         click_on 'Supprimer l’élément'
       end
-      expect(page).to have_content('Supprimer', count: 1)
+      wait_until { page.all(".row").size == 1 }
+      # removing a repetition means one child only, thus its button destroy is not visible
+      expect(page).to have_selector(".repetition .row:first-child .utils-repetition-required-destroy-button", count: 1, visible: false)
     end.to change { Champ.count }
   end