diff --git a/app/assets/stylesheets/dsfr.scss b/app/assets/stylesheets/dsfr.scss index f1e0344d4..89e2e966b 100644 --- a/app/assets/stylesheets/dsfr.scss +++ b/app/assets/stylesheets/dsfr.scss @@ -164,3 +164,18 @@ button.fr-tag-bug { border: 2px solid var(--border-action-high-grey); } } + +// On restaure la visibilité des éléments .fr-search-bar .fr-label (en appliquant les valeurs par défaut des différentes propriétés) +// Et on utilise la classe .sr-only pour masquer les éléments souhaités au cas par cas +.fr-search-bar .fr-label { + position: initial; + width: initial; + height: initial; + padding: initial; + margin: initial; + overflow: initial; + clip: initial; + white-space: initial; + border: initial; + display: block; // Pour cette valeur spécifique, on récupère celle de .fr-label +} diff --git a/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.en.yml b/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.en.yml index d6e123c4a..8577aa87d 100644 --- a/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.en.yml +++ b/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.en.yml @@ -1,4 +1,5 @@ -fr: +en: procedures: - label: Filter by procedure - prompt: All procedures + label: Show files by procedure + prompt: Select a procedure + button: Show diff --git a/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.fr.yml b/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.fr.yml index ae421496a..5bad01303 100644 --- a/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.fr.yml +++ b/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.fr.yml @@ -1,4 +1,5 @@ fr: procedures: - label: Filtrer par démarche - prompt: Toutes les démarches + label: Afficher les dossiers par démarche + prompt: Sélectionner une démarche + button: Afficher diff --git a/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.html.haml b/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.html.haml index 570ec76ff..5dc7f9c04 100644 --- a/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.html.haml +++ b/app/components/dossiers/user_procedure_filter_component/user_procedure_filter_component.html.haml @@ -1,5 +1,7 @@ -= form_with(url: dossiers_path, method: :get, data: { controller: 'autosubmit' } ) do |f| += form_with(url: dossiers_path, method: :get ) do |f| = f.hidden_field :q, value: params[:q], id: nil - = f.label :procedure_id, t('.procedure.label'), class: 'sr-only' - .fr-input-group - = f.select :procedure_id, options_for_select(@procedures_for_select, params[:procedure_id]), { prompt: t('.procedures.prompt') }, class: 'fr-select' + = f.label :procedure_id, t('.procedures.label'), class: 'fr-label fr-mb-1w', for: 'procedure_select' + .flex + = f.select :procedure_id, options_for_select(@procedures_for_select, params[:procedure_id]), { prompt: t('.procedures.prompt') }, class: 'fr-select fr-mr-1w', id: 'procedure_select' + %button.fr-btn.fr-btn--sm{ 'aria-label': t('.procedures.label') } + = t('.procedures.button') diff --git a/app/components/procedure/groupes_search_component/groupes_search_component.html.haml b/app/components/procedure/groupes_search_component/groupes_search_component.html.haml index 7b5308e51..569e3f247 100644 --- a/app/components/procedure/groupes_search_component/groupes_search_component.html.haml +++ b/app/components/procedure/groupes_search_component/groupes_search_component.html.haml @@ -1,7 +1,7 @@ = form_with(url: admin_procedure_groupe_instructeurs_path(@procedure), method: :get) do #header-search.fr-search-bar.fr-mb-2w{ role: "search" } - = label_tag :q, 'Rechercher par nom', class: 'fr-label' + = label_tag :q, 'Rechercher par nom', class: 'sr-only' = text_field_tag :q, @query, class: 'fr-input', type: 'search', autocomplete: 'off', placeholder: 'Rechercher par nom' %button.fr-btn{ title: "Rechercher" } Rechercher - if @query.present? diff --git a/app/views/layouts/_search_dossiers_form.html.haml b/app/views/layouts/_search_dossiers_form.html.haml index f0aab616e..959616163 100644 --- a/app/views/layouts/_search_dossiers_form.html.haml +++ b/app/views/layouts/_search_dossiers_form.html.haml @@ -3,7 +3,7 @@ %button.fr-btn--close.fr-btn{ "aria-controls" => "search-modal", :title => t('close_modal', scope: [:layouts, :header]) }= t('close_modal', scope: [:layouts, :header]) #search-473.fr-search-bar.fr-search-bar--lg = form_tag recherche_index_path, method: :get, :role => "search", class: "flex width-100" do - = label_tag "q", t('views.users.dossiers.search.search_file'), class: 'fr-label' + = label_tag "q", t('views.users.dossiers.search.search_file'), class: 'sr-only' = text_field_tag "q", "#{@search_terms if @search_terms.present?}", placeholder: t('views.users.dossiers.search.search_file'), class: "fr-input" %button.fr-btn = t('views.users.dossiers.search.simple') diff --git a/app/views/users/dossiers/index.html.haml b/app/views/users/dossiers/index.html.haml index b481b94c3..9a50902c1 100644 --- a/app/views/users/dossiers/index.html.haml +++ b/app/views/users/dossiers/index.html.haml @@ -11,12 +11,13 @@ - if current_user.dossiers.count > 2 || current_user.dossiers_invites.count > 2 .fr-col #search-2.fr-search-bar - = form_tag dossiers_path, method: :get, :role => "search", class: "flex width-100 fr-mb-5w" do + = form_tag dossiers_path, method: :get, :role => "search", class: "width-100 fr-mb-5w" do = hidden_field_tag :procedure_id, params[:procedure_id] - = label_tag "q", t('views.users.dossiers.search.search_file'), class: 'fr-label' - = text_field_tag "q", "#{@search_terms if @search_terms.present?}", placeholder: t('views.users.dossiers.search.search_file'), class: "fr-input" - %button.fr-btn.fr-btn--sm - = t('views.users.dossiers.search.simple') + = label_tag "q", t('views.users.dossiers.search.label'), class: 'fr-label fr-mb-1w' + .flex + = text_field_tag "q", "#{@search_terms if @search_terms.present?}", placeholder: t('views.users.dossiers.search.prompt'), class: "fr-input" + %button.fr-btn.fr-btn--sm + = t('views.users.dossiers.search.label') - if @procedures_for_select.size > 1 .fr-col = render Dossiers::UserProcedureFilterComponent.new(procedures_for_select: @procedures_for_select) diff --git a/config/locales/en.yml b/config/locales/en.yml index ed95ea081..c8810859b 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -485,6 +485,8 @@ en: edit_dossier_title: "Edit my file - You can modify your file as long as it has not been sent for processing" search: search_file: Search a file (File number, keywords) + prompt: (File number, last name / first name, keywords) + label: Search a file simple: Search result_term_title: Search result for « %{search_terms} » result_procedure_title: and procedure « %{procedure_libelle} » diff --git a/config/locales/fr.yml b/config/locales/fr.yml index f9f16fcee..a86999cf0 100644 --- a/config/locales/fr.yml +++ b/config/locales/fr.yml @@ -488,6 +488,8 @@ fr: edit_dossier_title: "Modifier mon dossier - Vous pouvez modifier votre dossier tant qu’il n’est pas passé en instruction" search: search_file: Rechercher un dossier (N° de dossier, mots-clés) + prompt: (N° de dossier, nom / prénom, mots-clés) + label: Rechercher un dossier simple: Rechercher result_term_title: Résultat de la recherche pour « %{search_terms} » result_procedure_title: et pour la procédure « %{procedure_libelle} » diff --git a/spec/system/users/list_dossiers_spec.rb b/spec/system/users/list_dossiers_spec.rb index 5325c2cc0..1ca3277ce 100644 --- a/spec/system/users/list_dossiers_spec.rb +++ b/spec/system/users/list_dossiers_spec.rb @@ -280,6 +280,7 @@ describe 'user access to the list of their dossiers', js: true do it "can be filtered by procedure and display the result - one item" do select dossier_en_construction.procedure.libelle, from: 'procedure_id' + click_on 'Afficher' expect(page).to have_link(dossier_en_construction.procedure.libelle) expect(page).not_to have_link(dossier_with_champs.procedure.libelle) expect(page).to have_text("1 dossier") @@ -287,6 +288,7 @@ describe 'user access to the list of their dossiers', js: true do it "can be filtered by procedure and display the result - no item" do select dossier_brouillon.procedure.libelle, from: 'procedure_id' + click_on 'Afficher' expect(page).not_to have_link(String(dossier_en_construction.id)) expect(page).not_to have_link(String(dossier_with_champs.id)) expect(page).to have_content("Résultat de la recherche pour « #{dossier_en_construction.champs_public.first.value} » et pour la procédure « #{dossier_brouillon.procedure.libelle} » ") @@ -301,8 +303,9 @@ describe 'user access to the list of their dossiers', js: true do it "can filter by procedure" do expect(page).to have_text('7 en cours') expect(page).to have_text('3 traités') - expect(page).to have_select('procedure_id', selected: 'Toutes les démarches') + expect(page).to have_select('procedure_id', selected: 'Sélectionner une démarche') select dossier_brouillon.procedure.libelle, from: 'procedure_id' + click_on 'Afficher' expect(page).to have_text('1 en cours') end end