Merge branch '53326-improve-issues-empty-state' into 'master'

Resolve "Improve issues list empty state when a filter is selected"

Closes #53326

See merge request gitlab-org/gitlab-ce!22775

app/helpers/issuables_helper.rb

@@ -362,6 +362,10 @@ module IssuablesHelper
     end
   end
 
+  def has_filter_bar_param?
+    finder.class.scalar_params.any? { |p| params[p].present? }
+  end
+
   private
 
   def sidebar_gutter_collapsed?

app/views/shared/empty_states/_issues.html.haml

@@ -8,7 +8,12 @@
       = image_tag 'illustrations/issues.svg'
   .col-12
     .text-content
-      - if current_user
+      - if has_filter_bar_param?
+        %h4.text-center
+          = _("Sorry, your filter produced no results")
+        %p.text-center
+          = _("To widen your search, change or remove filters above")
+      - elsif current_user
         %h4
           = _("The Issue Tracker is the place to add things that need to be improved or solved in a project")
         %p

app/views/shared/empty_states/_merge_requests.html.haml

@@ -8,16 +8,19 @@
       = image_tag 'illustrations/merge_requests.svg'
   .col-12
     .text-content
-      - if has_button
+      - if has_filter_bar_param?
+        %h4.text-center
+          = _("Sorry, your filter produced no results")
+        %p.text-center
+          = _("To widen your search, change or remove filters above")
+      - else
         %h4
           = _("Merge requests are a place to propose changes you've made to a project and discuss those changes with others")
         %p
           = _("Interested parties can even contribute by pushing commits if they want to.")
-        .text-center
-          - if project_select_button
-            = render 'shared/new_project_item_select', path: 'merge_requests/new', label: _('New merge request'), type: :merge_requests, with_feature_enabled: 'merge_requests'
-          - else
-            = link_to _('New merge request'), button_path, class: 'btn btn-success', title: _('New merge request'), id: 'new_merge_request_link'
-      - else
-        %h4.text-center
-          = _("There are no merge requests to show")
+        - if has_button
+          .text-center
+            - if project_select_button
+              = render 'shared/new_project_item_select', path: 'merge_requests/new', label: _('New merge request'), type: :merge_requests, with_feature_enabled: 'merge_requests'
+            - else
+              = link_to _('New merge request'), button_path, class: 'btn btn-success', title: _('New merge request'), id: 'new_merge_request_link'

changelogs/unreleased/53326-improve-issues-empty-state.yml

+---
+title: Show different empty state for filtered issues and MRs
+merge_request: 22775
+author: Heinrich Lee Yu
+type: changed

locale/gitlab.pot

@@ -5841,6 +5841,9 @@ msgstr ""
 msgid "Something went wrong. Please try again."
 msgstr ""
 
+msgid "Sorry, your filter produced no results"
+msgstr ""
+
 msgid "Sort by"
 msgstr ""
 
@@ -6296,9 +6299,6 @@ msgstr ""
 msgid "There are no labels yet"
 msgstr ""
 
-msgid "There are no merge requests to show"
-msgstr ""
-
 msgid "There are no projects shared with this group yet"
 msgstr ""
 
@@ -6723,6 +6723,9 @@ msgstr ""
 msgid "To validate your GitLab CI configurations, go to 'CI/CD → Pipelines' inside your project, and click on the 'CI Lint' button."
 msgstr ""
 
+msgid "To widen your search, change or remove filters above"
+msgstr ""
+
 msgid "Today"
 msgstr ""
 

spec/features/issues_spec.rb

@@ -8,6 +8,17 @@ describe 'Issues' do
   let(:user) { create(:user) }
   let(:project) { create(:project, :public) }
 
+  shared_examples_for 'empty state with filters' do
+    it 'user sees empty state with filters' do
+      create(:issue, author: user, project: project)
+
+      visit project_issues_path(project, milestone_title: "1.0")
+
+      expect(page).to have_content('Sorry, your filter produced no results')
+      expect(page).to have_content('To widen your search, change or remove filters above')
+    end
+  end
+
   describe 'while user is signed out' do
     describe 'empty state' do
       it 'user sees empty state' do
@@ -17,6 +28,8 @@ describe 'Issues' do
         expect(page).to have_content('The Issue Tracker is the place to add things that need to be improved or solved in a project.')
         expect(page).to have_content('You can register or sign in to create issues for this project.')
       end
+
+      it_behaves_like 'empty state with filters'
     end
   end
 
@@ -37,6 +50,8 @@ describe 'Issues' do
         expect(page).to have_content('Issues can be bugs, tasks or ideas to be discussed. Also, issues are searchable and filterable.')
         expect(page).to have_content('New issue')
       end
+
+      it_behaves_like 'empty state with filters'
     end
 
     describe 'Edit issue' do

spec/features/merge_request/user_sees_empty_state_spec.rb

@@ -19,12 +19,20 @@ describe 'Merge request > User sees empty state' do
   context 'if there are merge requests' do
     before do
       create(:merge_request, source_project: project)
-
-      visit project_merge_requests_path(project)
     end
 
     it 'does not show an empty state' do
+      visit project_merge_requests_path(project)
+
       expect(page).not_to have_selector('.empty-state')
     end
+
+    it 'shows empty state when filter results empty' do
+      visit project_merge_requests_path(project, milestone_title: "1.0")
+
+      expect(page).to have_selector('.empty-state')
+      expect(page).to have_content('Sorry, your filter produced no results')
+      expect(page).to have_content('To widen your search, change or remove filters above')
+    end
   end
 end