From 63a743c8272cd4ddec1444ddae2370995a96fd80 Mon Sep 17 00:00:00 2001
From: Annabel Dunstone Gray <annabel.dunstone@gmail.com>
Date: Thu, 9 Mar 2023 12:11:55 -0700
Subject: [PATCH 1/6] Combine import, export, and subscribe options into
 dropdown

- This affects issues list, issues dashboard, merge requests, and
service desk

Changelog: changed
---
 .../components/csv_import_export_buttons.vue  | 64 ++++++-------------
 .../list/components/issues_list_app.vue       | 60 ++++++++++-------
 .../javascripts/issues/list/constants.js      |  1 +
 .../merge_requests/_nav_btns.html.haml        | 16 ++++-
 .../shared/issuable/_feed_buttons.html.haml   | 12 ++--
 .../project/merge_requests/reviews/index.md   |  2 +-
 ee/spec/features/groups/issues_spec.rb        |  2 +-
 qa/qa/page/project/issue/index.rb             | 11 ++--
 spec/features/issues/csv_spec.rb              |  1 +
 .../user_exports_as_csv_spec.rb               |  1 +
 .../list/components/issues_list_app_spec.js   |  4 +-
 .../features/rss_shared_examples.rb           |  4 ++
 12 files changed, 95 insertions(+), 83 deletions(-)

diff --git a/app/assets/javascripts/issuable/components/csv_import_export_buttons.vue b/app/assets/javascripts/issuable/components/csv_import_export_buttons.vue
index 2cc01c302ec07f..4c14e9e76a0204 100644
--- a/app/assets/javascripts/issuable/components/csv_import_export_buttons.vue
+++ b/app/assets/javascripts/issuable/components/csv_import_export_buttons.vue
@@ -1,12 +1,5 @@
 <script>
-import {
-  GlButtonGroup,
-  GlButton,
-  GlDropdown,
-  GlDropdownItem,
-  GlTooltipDirective,
-  GlModalDirective,
-} from '@gitlab/ui';
+import { GlDropdownItem, GlTooltipDirective, GlModalDirective } from '@gitlab/ui';
 import { TYPE_ISSUE } from '~/issues/constants';
 import { __ } from '~/locale';
 import CsvExportModal from './csv_export_modal.vue';
@@ -21,9 +14,6 @@ export default {
   },
   name: 'CsvImportExportButtons',
   components: {
-    GlButtonGroup,
-    GlButton,
-    GlDropdown,
     GlDropdownItem,
     CsvExportModal,
     CsvImportModal,
@@ -77,45 +67,29 @@ export default {
     importButtonTooltipText() {
       return this.showLabel ? null : this.$options.i18n.importIssuesText;
     },
-    importButtonIcon() {
-      return this.showLabel ? null : 'import';
-    },
   },
 };
 </script>
 
 <template>
-  <div :class="containerClass">
-    <gl-button-group class="gl-w-full">
-      <gl-button
-        v-if="showExportButton"
-        v-gl-tooltip="$options.i18n.exportAsCsvButtonText"
-        v-gl-modal="exportModalId"
-        icon="export"
-        :aria-label="$options.i18n.exportAsCsvButtonText"
-        data-qa-selector="export_as_csv_button"
-      />
-      <gl-dropdown
-        v-if="showImportButton"
-        v-gl-tooltip="importButtonTooltipText"
-        data-qa-selector="import_issues_dropdown"
-        :text="$options.i18n.importIssuesText"
-        :text-sr-only="!showLabel"
-        :icon="importButtonIcon"
-        class="gl-w-full gl-md-w-auto"
-      >
-        <gl-dropdown-item v-gl-modal="importModalId">
-          {{ $options.i18n.importCsvText }}
-        </gl-dropdown-item>
-        <gl-dropdown-item
-          v-if="canEdit"
-          :href="projectImportJiraPath"
-          data-qa-selector="import_from_jira_link"
-        >
-          {{ $options.i18n.importFromJiraText }}
-        </gl-dropdown-item>
-      </gl-dropdown>
-    </gl-button-group>
+  <div>
+    <gl-dropdown-item
+      v-if="showExportButton"
+      v-gl-modal="exportModalId"
+      data-qa-selector="export_as_csv_button"
+    >
+      {{ $options.i18n.exportAsCsvButtonText }}
+    </gl-dropdown-item>
+    <gl-dropdown-item v-if="showImportButton" v-gl-modal="importModalId">
+      {{ $options.i18n.importCsvText }}
+    </gl-dropdown-item>
+    <gl-dropdown-item
+      v-if="showImportButton && canEdit"
+      :href="projectImportJiraPath"
+      data-qa-selector="import_from_jira_link"
+    >
+      {{ $options.i18n.importFromJiraText }}
+    </gl-dropdown-item>
     <csv-export-modal
       v-if="showExportButton"
       :modal-id="exportModalId"
diff --git a/app/assets/javascripts/issues/list/components/issues_list_app.vue b/app/assets/javascripts/issues/list/components/issues_list_app.vue
index 5c4bf8f19e482f..a93ce0813d31d0 100644
--- a/app/assets/javascripts/issues/list/components/issues_list_app.vue
+++ b/app/assets/javascripts/issues/list/components/issues_list_app.vue
@@ -1,5 +1,12 @@
 <script>
-import { GlButton, GlFilteredSearchToken, GlTooltipDirective } from '@gitlab/ui';
+import {
+  GlButton,
+  GlFilteredSearchToken,
+  GlTooltipDirective,
+  GlDropdown,
+  GlDropdownItem,
+  GlDropdownDivider,
+} from '@gitlab/ui';
 import * as Sentry from '@sentry/browser';
 import fuzzaldrinPlus from 'fuzzaldrin-plus';
 import { isEmpty } from 'lodash';
@@ -9,8 +16,8 @@ import getIssuesQuery from 'ee_else_ce/issues/list/queries/get_issues.query.grap
 import getIssuesCountsQuery from 'ee_else_ce/issues/list/queries/get_issues_counts.query.graphql';
 import { createAlert, VARIANT_INFO } from '~/alert';
 import { TYPENAME_USER } from '~/graphql_shared/constants';
-import { convertToGraphQLId, getIdFromGraphQLId } from '~/graphql_shared/utils';
 import CsvImportExportButtons from '~/issuable/components/csv_import_export_buttons.vue';
+import { convertToGraphQLId, getIdFromGraphQLId } from '~/graphql_shared/utils';
 import IssuableByEmail from '~/issuable/components/issuable_by_email.vue';
 import {
   STATUS_ALL,
@@ -114,6 +121,9 @@ export default {
     EmptyStateWithAnyIssues,
     EmptyStateWithoutAnyIssues,
     GlButton,
+    GlDropdown,
+    GlDropdownDivider,
+    GlDropdownItem,
     IssuableByEmail,
     IssuableList,
     IssueCardStatistics,
@@ -801,26 +811,6 @@ export default {
       @page-size-change="handlePageSizeChange"
     >
       <template #nav-actions>
-        <gl-button
-          v-gl-tooltip
-          :href="rssPath"
-          icon="rss"
-          :title="$options.i18n.rssLabel"
-          :aria-label="$options.i18n.rssLabel"
-        />
-        <gl-button
-          v-gl-tooltip
-          :href="calendarPath"
-          icon="calendar"
-          :title="$options.i18n.calendarLabel"
-          :aria-label="$options.i18n.calendarLabel"
-        />
-        <csv-import-export-buttons
-          v-if="showCsvButtons"
-          class="gl-md-mr-3"
-          :export-csv-path="exportCsvPathWithQuery"
-          :issuable-count="currentTabCount"
-        />
         <gl-button
           v-if="canBulkUpdate"
           :disabled="isBulkEditButtonDisabled"
@@ -842,6 +832,32 @@ export default {
           :query-variables="newIssueDropdownQueryVariables"
           :extract-projects="extractProjects"
         />
+        <gl-dropdown
+          v-gl-tooltip.hover
+          v-gl-tooltip="$options.i18n.actionsLabel"
+          icon="ellipsis_v"
+          category="tertiary"
+          no-caret
+          :text="$options.i18n.actionsLabel"
+          text-sr-only
+          data-qa-selector="issues_list_more_actions_dropdown"
+        >
+          <csv-import-export-buttons
+            v-if="showCsvButtons"
+            class="gl-md-mr-3"
+            :export-csv-path="exportCsvPathWithQuery"
+            :issuable-count="currentTabCount"
+          />
+
+          <gl-dropdown-divider v-if="showCsvButtons" />
+
+          <gl-dropdown-item :href="rssPath">
+            {{ $options.i18n.rssLabel }}
+          </gl-dropdown-item>
+          <gl-dropdown-item :href="calendarPath">
+            {{ $options.i18n.calendarLabel }}
+          </gl-dropdown-item>
+        </gl-dropdown>
       </template>
 
       <template #timeframe="{ issuable = {} }">
diff --git a/app/assets/javascripts/issues/list/constants.js b/app/assets/javascripts/issues/list/constants.js
index f998033b7924bf..4304eafd3d2df2 100644
--- a/app/assets/javascripts/issues/list/constants.js
+++ b/app/assets/javascripts/issues/list/constants.js
@@ -85,6 +85,7 @@ export const i18n = {
   editIssues: __('Edit issues'),
   errorFetchingCounts: __('An error occurred while getting issue counts'),
   errorFetchingIssues: __('An error occurred while loading issues'),
+  exportCsvLabel: __('Export as CSV'),
   issueRepositioningMessage: __(
     'Issues are being rebalanced at the moment, so manual reordering is disabled.',
   ),
diff --git a/app/views/projects/merge_requests/_nav_btns.html.haml b/app/views/projects/merge_requests/_nav_btns.html.haml
index beb6de4698cb1d..07a2ddfdf8cbb6 100644
--- a/app/views/projects/merge_requests/_nav_btns.html.haml
+++ b/app/views/projects/merge_requests/_nav_btns.html.haml
@@ -1,12 +1,22 @@
 - issuable_type = 'merge_request'
 - notification_email = @current_user.present? ? @current_user.notification_email_or_default : nil
 
-= render 'shared/issuable/feed_buttons', show_calendar_button: false
-.js-csv-import-export-buttons{ data: { show_export_button: "true", issuable_type: issuable_type, issuable_count: issuables_count_for_state(issuable_type.to_sym, params[:state]), email: notification_email, export_csv_path: export_csv_project_merge_requests_path(@project, request.query_parameters), container_class: 'gl-mr-3' } }
-
 - if @can_bulk_update
   = render Pajamas::ButtonComponent.new(type: :submit, button_options: { class: 'gl-mr-3 js-bulk-update-toggle' }) do
     = _("Edit merge requests")
 - if merge_project
   = render Pajamas::ButtonComponent.new(href: new_merge_request_path, variant: :confirm) do
     = _("New merge request")
+
+.dropdown.gl-dropdown{ class: "gl-display-none! gl-md-display-flex!" }
+  = button_tag type: 'button', class: "btn dropdown-toggle btn-default btn-md gl-button gl-dropdown gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret has-tooltip", data: { toggle: 'dropdown', title: _('Actions'), testid: 'merge-request-list-actions', 'aria-label': _('Actions') } do
+    = sprite_icon "ellipsis_v", size: 16, css_class: "dropdown-icon gl-icon"
+  .dropdown-menu.dropdown-menu-right
+    .gl-dropdown-inner
+      .gl-dropdown-contents
+        %ul
+          .js-csv-import-export-buttons{ data: { show_export_button: "true", issuable_type: issuable_type, issuable_count: issuables_count_for_state(issuable_type.to_sym, params[:state]), email: notification_email, export_csv_path: export_csv_project_merge_requests_path(@project, request.query_parameters), container_class: 'gl-mr-3' } }
+          %li.gl-dropdown-divider
+            %hr.dropdown-divider
+            %li.gl-dropdown-item
+              = render 'shared/issuable/feed_buttons', show_calendar_button: false
diff --git a/app/views/shared/issuable/_feed_buttons.html.haml b/app/views/shared/issuable/_feed_buttons.html.haml
index e0f676021a127a..b5b33f4fc68898 100644
--- a/app/views/shared/issuable/_feed_buttons.html.haml
+++ b/app/views/shared/issuable/_feed_buttons.html.haml
@@ -1,8 +1,10 @@
 - show_calendar_button = local_assigns.fetch(:show_calendar_button, true)
 
-= render Pajamas::ButtonComponent.new(href: safe_params.merge(rss_url_options), button_options: { class: 'has-tooltip btn-icon', title: _('Subscribe to RSS feed'), 'aria-label': _('Subscribe to RSS feed'), data: { container: 'body', testid: 'rss-feed-link' } }) do
-  = sprite_icon('rss')
-
 - if show_calendar_button
-  = render Pajamas::ButtonComponent.new(href: safe_params.merge(calendar_url_options), button_options: { class: 'has-tooltip btn-icon', title: _('Subscribe to calendar'), 'aria-label': _('Subscribe to calendar'), data: { container: 'body' } }) do
-    = sprite_icon('calendar')
+  = link_to safe_params.merge(calendar_url_options), class: 'dropdown-item' do
+    .gl-dropdown-item-text-wrapper
+      = _("Subscribe to calendar")
+
+= link_to safe_params.merge(rss_url_options), class: 'dropdown-item', testid: 'rss-feed-link' do
+  .gl-dropdown-item-text-wrapper
+    = _("Subscribe to RSS feed")
diff --git a/doc/user/project/merge_requests/reviews/index.md b/doc/user/project/merge_requests/reviews/index.md
index 6718422865a844..1c28480882a6f4 100644
--- a/doc/user/project/merge_requests/reviews/index.md
+++ b/doc/user/project/merge_requests/reviews/index.md
@@ -234,7 +234,7 @@ When bulk-editing merge requests in a project, you can edit the following attrib
 To update multiple project merge requests at the same time:
 
 1. In a project, go to **Merge requests**.
-1. Select **Edit merge requests**. A sidebar on the right-hand side of your screen appears with
+1. Select **Edit requests**. A sidebar on the right-hand side of your screen appears with
    editable fields.
 1. Select the checkboxes next to each merge request you want to edit.
 1. Select the appropriate fields and their values from the sidebar.
diff --git a/ee/spec/features/groups/issues_spec.rb b/ee/spec/features/groups/issues_spec.rb
index acb44ef1cf7486..7a5cf6cee454c4 100644
--- a/ee/spec/features/groups/issues_spec.rb
+++ b/ee/spec/features/groups/issues_spec.rb
@@ -16,7 +16,7 @@
       visit issues_group_path(group)
     end
 
-    it 'shows sidebar when clicked on "Edit issues"' do
+    it 'shows sidebar when clicked on "Edit"' do
       click_button 'Edit issues'
 
       page.within('.js-right-sidebar') do
diff --git a/qa/qa/page/project/issue/index.rb b/qa/qa/page/project/issue/index.rb
index 7d162c6e48fd11..5cf7d668293a52 100644
--- a/qa/qa/page/project/issue/index.rb
+++ b/qa/qa/page/project/issue/index.rb
@@ -15,6 +15,10 @@ class Index < Page::Base
             element :avatar_counter_content
           end
 
+          view 'app/assets/javascripts/issues/list/components/issues_list_app.vue' do
+            element :issues_list_more_actions_dropdown
+          end
+
           view 'app/assets/javascripts/issuable/components/csv_export_modal.vue' do
             element :export_issuable_modal
           end
@@ -22,7 +26,6 @@ class Index < Page::Base
           view 'app/assets/javascripts/issuable/components/csv_import_export_buttons.vue' do
             element :export_as_csv_button
             element :import_from_jira_link
-            element :import_issues_dropdown
           end
 
           view 'app/assets/javascripts/vue_shared/issuable/list/components/issuable_tabs.vue' do
@@ -53,10 +56,10 @@ def click_import_from_jira_link
             click_element(:import_from_jira_link)
           end
 
-          def click_import_issues_dropdown
+          def click_more_issue_actions_dropdown
             # When there are no issues, the image that loads causes the buttons to jump
             has_loaded_all_images?
-            click_element(:import_issues_dropdown)
+            click_element(:more_issue_actions_dropdown)
           end
 
           def export_issues_modal
@@ -64,7 +67,7 @@ def export_issues_modal
           end
 
           def go_to_jira_import_form
-            click_import_issues_dropdown
+            click_more_issue_actions_dropdown
             click_import_from_jira_link
           end
 
diff --git a/spec/features/issues/csv_spec.rb b/spec/features/issues/csv_spec.rb
index 8629201459f8f0..21d5041b210f9b 100644
--- a/spec/features/issues/csv_spec.rb
+++ b/spec/features/issues/csv_spec.rb
@@ -16,6 +16,7 @@
 
   def request_csv(params = {})
     visit project_issues_path(project, params)
+    click_button 'Actions'
     click_button 'Export as CSV'
     click_on 'Export issues'
   end
diff --git a/spec/features/merge_requests/user_exports_as_csv_spec.rb b/spec/features/merge_requests/user_exports_as_csv_spec.rb
index 23ac1b264addb2..57d6ee69923530 100644
--- a/spec/features/merge_requests/user_exports_as_csv_spec.rb
+++ b/spec/features/merge_requests/user_exports_as_csv_spec.rb
@@ -14,6 +14,7 @@
 
   context 'button is clicked' do
     before do
+      click_button 'Actions'
       click_button 'Export as CSV'
     end
 
diff --git a/spec/frontend/issues/list/components/issues_list_app_spec.js b/spec/frontend/issues/list/components/issues_list_app_spec.js
index 15dde76f49baef..6c064328f81552 100644
--- a/spec/frontend/issues/list/components/issues_list_app_spec.js
+++ b/spec/frontend/issues/list/components/issues_list_app_spec.js
@@ -320,14 +320,14 @@ describe('CE IssuesListApp component', () => {
       it('renders when user has permissions', () => {
         wrapper = mountComponent({ provide: { showNewIssueLink: true }, mountFn: mount });
 
-        expect(findGlButtonAt(2).text()).toBe('New issue');
+        expect(findGlButtonAt(2).text()).toBe('New');
         expect(findGlButtonAt(2).attributes('href')).toBe(defaultProvide.newIssuePath);
       });
 
       it('does not render when user does not have permissions', () => {
         wrapper = mountComponent({ provide: { showNewIssueLink: false }, mountFn: mount });
 
-        expect(findGlButtons().filter((button) => button.text() === 'New issue')).toHaveLength(0);
+        expect(findGlButtons().filter((button) => button.text() === 'New')).toHaveLength(0);
       });
     });
 
diff --git a/spec/support/shared_examples/features/rss_shared_examples.rb b/spec/support/shared_examples/features/rss_shared_examples.rb
index 29ecbd0dc0e9e1..192a396acfe510 100644
--- a/spec/support/shared_examples/features/rss_shared_examples.rb
+++ b/spec/support/shared_examples/features/rss_shared_examples.rb
@@ -2,12 +2,14 @@
 
 RSpec.shared_examples "an autodiscoverable RSS feed with current_user's feed token" do
   it "has an RSS autodiscovery link tag with current_user's feed token" do
+    click_button 'Actions'
     expect(page).to have_css("link[type*='atom+xml'][href*='feed_token=#{user.feed_token}']", visible: false)
   end
 end
 
 RSpec.shared_examples "it has an RSS button with current_user's feed token" do
   it "shows the RSS button with current_user's feed token" do
+    click_button 'Actions'
     expect(page)
       .to have_css("a:has([data-testid='rss-icon'])[href*='feed_token=#{user.feed_token}']")
   end
@@ -21,12 +23,14 @@
 
 RSpec.shared_examples "an autodiscoverable RSS feed without a feed token" do
   it "has an RSS autodiscovery link tag without a feed token" do
+    click_button 'Actions'
     expect(page).to have_css("link[type*='atom+xml']:not([href*='feed_token'])", visible: false)
   end
 end
 
 RSpec.shared_examples "it has an RSS button without a feed token" do
   it "shows the RSS button without a feed token" do
+    click_button 'Actions'
     expect(page)
       .to have_css("a:has([data-testid='rss-icon']):not([href*='feed_token'])")
   end
-- 
GitLab


From 679172725a120643eebcb1afab27e298d08a5934 Mon Sep 17 00:00:00 2001
From: Coung Ngo <cngo@gitlab.com>
Date: Thu, 30 Mar 2023 16:56:19 +0100
Subject: [PATCH 2/6] Fix tests and tidy code

---
 .../components/csv_import_export_buttons.vue  |  19 +--
 app/assets/javascripts/issuable/index.js      |   4 -
 .../empty_state_without_any_issues.vue        |  17 ++-
 .../list/components/issues_list_app.vue       |   8 +-
 .../javascripts/issues/list/constants.js      |   2 +-
 .../issues/service_desk/_nav_btns.html.haml   |  23 ++-
 .../merge_requests/_nav_btns.html.haml        |  12 +-
 .../shared/empty_states/_issues.html.haml     |   2 +-
 .../shared/issuable/_feed_buttons.html.haml   |   2 +-
 .../project/merge_requests/reviews/index.md   |   2 +-
 ee/spec/features/groups/issues_spec.rb        |   2 +-
 qa/qa/page/project/issue/index.rb             |   2 +-
 spec/features/groups/issues_spec.rb           |   4 +
 spec/features/issues/rss_spec.rb              |   2 +
 spec/features/merge_requests/rss_spec.rb      |   4 +-
 .../csv_import_export_buttons_spec.js         |  86 +++--------
 .../empty_state_without_any_issues_spec.js    |   5 +-
 .../list/components/issues_list_app_spec.js   | 142 +++++++++---------
 .../features/rss_shared_examples.rb           |   5 +-
 19 files changed, 155 insertions(+), 188 deletions(-)

diff --git a/app/assets/javascripts/issuable/components/csv_import_export_buttons.vue b/app/assets/javascripts/issuable/components/csv_import_export_buttons.vue
index 4c14e9e76a0204..b492194d1cf496 100644
--- a/app/assets/javascripts/issuable/components/csv_import_export_buttons.vue
+++ b/app/assets/javascripts/issuable/components/csv_import_export_buttons.vue
@@ -1,5 +1,5 @@
 <script>
-import { GlDropdownItem, GlTooltipDirective, GlModalDirective } from '@gitlab/ui';
+import { GlDropdownItem, GlModalDirective } from '@gitlab/ui';
 import { TYPE_ISSUE } from '~/issues/constants';
 import { __ } from '~/locale';
 import CsvExportModal from './csv_export_modal.vue';
@@ -10,16 +10,13 @@ export default {
     exportAsCsvButtonText: __('Export as CSV'),
     importCsvText: __('Import CSV'),
     importFromJiraText: __('Import from Jira'),
-    importIssuesText: __('Import issues'),
   },
-  name: 'CsvImportExportButtons',
   components: {
     GlDropdownItem,
     CsvExportModal,
     CsvImportModal,
   },
   directives: {
-    GlTooltip: GlTooltipDirective,
     GlModal: GlModalDirective,
   },
   inject: {
@@ -32,18 +29,12 @@ export default {
     showImportButton: {
       default: false,
     },
-    containerClass: {
-      default: '',
-    },
     canEdit: {
       default: false,
     },
     projectImportJiraPath: {
       default: null,
     },
-    showLabel: {
-      default: false,
-    },
   },
   props: {
     exportCsvPath: {
@@ -64,15 +55,12 @@ export default {
     importModalId() {
       return `${this.issuableType}-import-modal`;
     },
-    importButtonTooltipText() {
-      return this.showLabel ? null : this.$options.i18n.importIssuesText;
-    },
   },
 };
 </script>
 
 <template>
-  <div>
+  <ul class="gl-display-contents">
     <gl-dropdown-item
       v-if="showExportButton"
       v-gl-modal="exportModalId"
@@ -90,6 +78,7 @@ export default {
     >
       {{ $options.i18n.importFromJiraText }}
     </gl-dropdown-item>
+
     <csv-export-modal
       v-if="showExportButton"
       :modal-id="exportModalId"
@@ -97,5 +86,5 @@ export default {
       :issuable-count="issuableCount"
     />
     <csv-import-modal v-if="showImportButton" :modal-id="importModalId" />
-  </div>
+  </ul>
 </template>
diff --git a/app/assets/javascripts/issuable/index.js b/app/assets/javascripts/issuable/index.js
index ed336deb2ed2d7..acc0161bf6a72a 100644
--- a/app/assets/javascripts/issuable/index.js
+++ b/app/assets/javascripts/issuable/index.js
@@ -36,11 +36,9 @@ export function initCsvImportExportButtons() {
     email,
     exportCsvPath,
     importCsvIssuesPath,
-    containerClass,
     canEdit,
     projectImportJiraPath,
     maxAttachmentSize,
-    showLabel,
   } = el.dataset;
 
   return new Vue({
@@ -52,11 +50,9 @@ export function initCsvImportExportButtons() {
       issuableType,
       email,
       importCsvIssuesPath,
-      containerClass,
       canEdit: parseBoolean(canEdit),
       projectImportJiraPath,
       maxAttachmentSize,
-      showLabel,
     },
     render: (createElement) =>
       createElement(CsvImportExportButtons, {
diff --git a/app/assets/javascripts/issues/list/components/empty_state_without_any_issues.vue b/app/assets/javascripts/issues/list/components/empty_state_without_any_issues.vue
index 652d4e0fb426b6..b3b51c730e0207 100644
--- a/app/assets/javascripts/issues/list/components/empty_state_without_any_issues.vue
+++ b/app/assets/javascripts/issues/list/components/empty_state_without_any_issues.vue
@@ -1,5 +1,5 @@
 <script>
-import { GlButton, GlEmptyState, GlLink, GlSprintf } from '@gitlab/ui';
+import { GlButton, GlDropdown, GlEmptyState, GlLink, GlSprintf } from '@gitlab/ui';
 import { helpPagePath } from '~/helpers/help_page_helper';
 import CsvImportExportButtons from '~/issuable/components/csv_import_export_buttons.vue';
 import NewResourceDropdown from '~/vue_shared/components/new_resource_dropdown/new_resource_dropdown.vue';
@@ -12,6 +12,7 @@ export default {
   components: {
     CsvImportExportButtons,
     GlButton,
+    GlDropdown,
     GlEmptyState,
     GlLink,
     GlSprintf,
@@ -71,12 +72,18 @@ export default {
         <gl-button v-if="showNewIssueLink" :href="newIssuePath" variant="confirm">
           {{ $options.i18n.newIssueLabel }}
         </gl-button>
-        <csv-import-export-buttons
+
+        <gl-dropdown
           v-if="showCsvButtons"
           class="gl-w-full gl-sm-w-auto gl-sm-mr-3"
-          :export-csv-path="exportCsvPathWithQuery"
-          :issuable-count="currentTabCount"
-        />
+          :text="$options.i18n.importIssues"
+        >
+          <csv-import-export-buttons
+            :export-csv-path="exportCsvPathWithQuery"
+            :issuable-count="currentTabCount"
+          />
+        </gl-dropdown>
+
         <new-resource-dropdown
           v-if="showNewIssueDropdown"
           class="gl-align-self-center"
diff --git a/app/assets/javascripts/issues/list/components/issues_list_app.vue b/app/assets/javascripts/issues/list/components/issues_list_app.vue
index a93ce0813d31d0..7d2ecf57ff1d07 100644
--- a/app/assets/javascripts/issues/list/components/issues_list_app.vue
+++ b/app/assets/javascripts/issues/list/components/issues_list_app.vue
@@ -833,18 +833,16 @@ export default {
           :extract-projects="extractProjects"
         />
         <gl-dropdown
-          v-gl-tooltip.hover
-          v-gl-tooltip="$options.i18n.actionsLabel"
-          icon="ellipsis_v"
+          v-gl-tooltip.hover="$options.i18n.actionsLabel"
           category="tertiary"
+          icon="ellipsis_v"
           no-caret
           :text="$options.i18n.actionsLabel"
           text-sr-only
-          data-qa-selector="issues_list_more_actions_dropdown"
+          data-qa-selector="more_issue_actions_dropdown"
         >
           <csv-import-export-buttons
             v-if="showCsvButtons"
-            class="gl-md-mr-3"
             :export-csv-path="exportCsvPathWithQuery"
             :issuable-count="currentTabCount"
           />
diff --git a/app/assets/javascripts/issues/list/constants.js b/app/assets/javascripts/issues/list/constants.js
index 4304eafd3d2df2..990ba1c062123b 100644
--- a/app/assets/javascripts/issues/list/constants.js
+++ b/app/assets/javascripts/issues/list/constants.js
@@ -85,7 +85,7 @@ export const i18n = {
   editIssues: __('Edit issues'),
   errorFetchingCounts: __('An error occurred while getting issue counts'),
   errorFetchingIssues: __('An error occurred while loading issues'),
-  exportCsvLabel: __('Export as CSV'),
+  importIssues: __('Import issues'),
   issueRepositioningMessage: __(
     'Issues are being rebalanced at the moment, so manual reordering is disabled.',
   ),
diff --git a/app/views/projects/issues/service_desk/_nav_btns.html.haml b/app/views/projects/issues/service_desk/_nav_btns.html.haml
index 818de77dc899ff..b430dab29bbbd6 100644
--- a/app/views/projects/issues/service_desk/_nav_btns.html.haml
+++ b/app/views/projects/issues/service_desk/_nav_btns.html.haml
@@ -6,15 +6,26 @@
 - notification_email = @current_user.present? ? @current_user.notification_email_or_default : nil
 
 .nav-controls.issues-nav-controls.gl-font-size-0
-  - if show_feed_buttons
-    = render 'shared/issuable/feed_buttons'
-
-  .js-csv-import-export-buttons{ data: { show_export_button: show_export_button.to_s, show_import_button: show_import_button.to_s, issuable_type: issuable_type, issuable_count: issuables_count_for_state(issuable_type.to_sym, params[:state]), email: notification_email, export_csv_path: export_csv_project_issues_path(@project, request.query_parameters), import_csv_issues_path: import_csv_namespace_project_issues_path, container_class: 'gl-mr-3', can_edit: can_edit.to_s, project_import_jira_path: project_import_jira_path(@project), max_attachment_size: number_to_human_size(Gitlab::CurrentSettings.max_attachment_size.megabytes) } }
-
   - if @can_bulk_update
     = button_tag _("Edit issues"), class: "gl-button btn btn-default gl-mr-3 js-bulk-update-toggle"
   - if show_new_issue_link?(@project)
     = link_to _("New issue"), new_project_issue_path(@project,
                                                   issue: { milestone_id: finder.milestones.first.try(:id) }),
-                                                  class: "gl-button btn btn-confirm",
+                                                  class: "gl-button btn btn-confirm gl-mr-3",
                                                   id: "new_issue_link"
+
+.dropdown.gl-dropdown
+  = button_tag type: 'button', class: "btn dropdown-toggle btn-default btn-md gl-button gl-dropdown gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret has-tooltip", data: { toggle: 'dropdown', title: _('Actions') } do
+    = sprite_icon "ellipsis_v", size: 16, css_class: "dropdown-icon gl-icon"
+    %span.gl-sr-only
+      = _('Actions')
+  .dropdown-menu.dropdown-menu-right
+    .gl-dropdown-inner
+      .gl-dropdown-contents
+        %ul
+          .js-csv-import-export-buttons{ data: { show_export_button: show_export_button.to_s, show_import_button: show_import_button.to_s, issuable_type: issuable_type, issuable_count: issuables_count_for_state(issuable_type.to_sym, params[:state]), email: notification_email, export_csv_path: export_csv_project_issues_path(@project, request.query_parameters), import_csv_issues_path: import_csv_namespace_project_issues_path, can_edit: can_edit.to_s, project_import_jira_path: project_import_jira_path(@project), max_attachment_size: number_to_human_size(Gitlab::CurrentSettings.max_attachment_size.megabytes) } }
+          %li.gl-dropdown-divider
+            %hr.dropdown-divider
+          %li.gl-dropdown-item
+            - if show_feed_buttons
+              = render 'shared/issuable/feed_buttons'
diff --git a/app/views/projects/merge_requests/_nav_btns.html.haml b/app/views/projects/merge_requests/_nav_btns.html.haml
index 07a2ddfdf8cbb6..17e7ff33345e76 100644
--- a/app/views/projects/merge_requests/_nav_btns.html.haml
+++ b/app/views/projects/merge_requests/_nav_btns.html.haml
@@ -8,15 +8,17 @@
   = render Pajamas::ButtonComponent.new(href: new_merge_request_path, variant: :confirm) do
     = _("New merge request")
 
-.dropdown.gl-dropdown{ class: "gl-display-none! gl-md-display-flex!" }
-  = button_tag type: 'button', class: "btn dropdown-toggle btn-default btn-md gl-button gl-dropdown gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret has-tooltip", data: { toggle: 'dropdown', title: _('Actions'), testid: 'merge-request-list-actions', 'aria-label': _('Actions') } do
+.dropdown.gl-dropdown
+  = button_tag type: 'button', class: "btn dropdown-toggle btn-default btn-md gl-button gl-dropdown gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret has-tooltip", data: { toggle: 'dropdown', title: _('Actions') } do
     = sprite_icon "ellipsis_v", size: 16, css_class: "dropdown-icon gl-icon"
+    %span.gl-sr-only
+      = _('Actions')
   .dropdown-menu.dropdown-menu-right
     .gl-dropdown-inner
       .gl-dropdown-contents
         %ul
-          .js-csv-import-export-buttons{ data: { show_export_button: "true", issuable_type: issuable_type, issuable_count: issuables_count_for_state(issuable_type.to_sym, params[:state]), email: notification_email, export_csv_path: export_csv_project_merge_requests_path(@project, request.query_parameters), container_class: 'gl-mr-3' } }
+          .js-csv-import-export-buttons{ data: { show_export_button: "true", issuable_type: issuable_type, issuable_count: issuables_count_for_state(issuable_type.to_sym, params[:state]), email: notification_email, export_csv_path: export_csv_project_merge_requests_path(@project, request.query_parameters) } }
           %li.gl-dropdown-divider
             %hr.dropdown-divider
-            %li.gl-dropdown-item
-              = render 'shared/issuable/feed_buttons', show_calendar_button: false
+          %li.gl-dropdown-item
+            = render 'shared/issuable/feed_buttons', show_calendar_button: false
diff --git a/app/views/shared/empty_states/_issues.html.haml b/app/views/shared/empty_states/_issues.html.haml
index ad6e5578878431..1ab9e288a9eed2 100644
--- a/app/views/shared/empty_states/_issues.html.haml
+++ b/app/views/shared/empty_states/_issues.html.haml
@@ -42,7 +42,7 @@
               = link_to _('New issue'), button_path, class: 'gl-button btn btn-confirm', id: 'new_issue_link'
 
             - if show_import_button
-              .js-csv-import-export-buttons{ data: { show_import_button: 'true', issuable_type: 'issue', import_csv_issues_path: import_csv_namespace_project_issues_path, can_edit: can_edit.to_s, project_import_jira_path: project_import_jira_path(@project), max_attachment_size: number_to_human_size(Gitlab::CurrentSettings.max_attachment_size.megabytes), container_class: 'gl-w-full gl-sm-w-auto gl-sm-mr-3 gl-display-inline-flex gl-vertical-align-middle', show_label: 'true' } }
+              .js-csv-import-export-buttons{ data: { show_import_button: 'true', issuable_type: 'issue', import_csv_issues_path: import_csv_namespace_project_issues_path, can_edit: can_edit.to_s, project_import_jira_path: project_import_jira_path(@project), max_attachment_size: number_to_human_size(Gitlab::CurrentSettings.max_attachment_size.megabytes) } }
         %hr
         %p.gl-text-center.gl-mb-0
           %strong
diff --git a/app/views/shared/issuable/_feed_buttons.html.haml b/app/views/shared/issuable/_feed_buttons.html.haml
index b5b33f4fc68898..1a9bbac6f05351 100644
--- a/app/views/shared/issuable/_feed_buttons.html.haml
+++ b/app/views/shared/issuable/_feed_buttons.html.haml
@@ -5,6 +5,6 @@
     .gl-dropdown-item-text-wrapper
       = _("Subscribe to calendar")
 
-= link_to safe_params.merge(rss_url_options), class: 'dropdown-item', testid: 'rss-feed-link' do
+= link_to safe_params.merge(rss_url_options), class: 'dropdown-item' do
   .gl-dropdown-item-text-wrapper
     = _("Subscribe to RSS feed")
diff --git a/doc/user/project/merge_requests/reviews/index.md b/doc/user/project/merge_requests/reviews/index.md
index 1c28480882a6f4..6718422865a844 100644
--- a/doc/user/project/merge_requests/reviews/index.md
+++ b/doc/user/project/merge_requests/reviews/index.md
@@ -234,7 +234,7 @@ When bulk-editing merge requests in a project, you can edit the following attrib
 To update multiple project merge requests at the same time:
 
 1. In a project, go to **Merge requests**.
-1. Select **Edit requests**. A sidebar on the right-hand side of your screen appears with
+1. Select **Edit merge requests**. A sidebar on the right-hand side of your screen appears with
    editable fields.
 1. Select the checkboxes next to each merge request you want to edit.
 1. Select the appropriate fields and their values from the sidebar.
diff --git a/ee/spec/features/groups/issues_spec.rb b/ee/spec/features/groups/issues_spec.rb
index 7a5cf6cee454c4..acb44ef1cf7486 100644
--- a/ee/spec/features/groups/issues_spec.rb
+++ b/ee/spec/features/groups/issues_spec.rb
@@ -16,7 +16,7 @@
       visit issues_group_path(group)
     end
 
-    it 'shows sidebar when clicked on "Edit"' do
+    it 'shows sidebar when clicked on "Edit issues"' do
       click_button 'Edit issues'
 
       page.within('.js-right-sidebar') do
diff --git a/qa/qa/page/project/issue/index.rb b/qa/qa/page/project/issue/index.rb
index 5cf7d668293a52..e1c408561cfba6 100644
--- a/qa/qa/page/project/issue/index.rb
+++ b/qa/qa/page/project/issue/index.rb
@@ -16,7 +16,7 @@ class Index < Page::Base
           end
 
           view 'app/assets/javascripts/issues/list/components/issues_list_app.vue' do
-            element :issues_list_more_actions_dropdown
+            element :more_issue_actions_dropdown
           end
 
           view 'app/assets/javascripts/issuable/components/csv_export_modal.vue' do
diff --git a/spec/features/groups/issues_spec.rb b/spec/features/groups/issues_spec.rb
index 9f6fa14697204d..6d0d768d356720 100644
--- a/spec/features/groups/issues_spec.rb
+++ b/spec/features/groups/issues_spec.rb
@@ -23,6 +23,10 @@
     context 'rss feed' do
       let(:access_level) { ProjectFeature::ENABLED }
 
+      before do
+        click_button 'Actions'
+      end
+
       context 'when signed in' do
         let(:user) do
           user_in_group.ensure_feed_token
diff --git a/spec/features/issues/rss_spec.rb b/spec/features/issues/rss_spec.rb
index 75e7cd03a65349..eb45d3c8d8bd78 100644
--- a/spec/features/issues/rss_spec.rb
+++ b/spec/features/issues/rss_spec.rb
@@ -23,6 +23,7 @@
     before do
       sign_in(user)
       visit path
+      click_button 'Actions'
     end
 
     it_behaves_like "it has an RSS link with current_user's feed token"
@@ -32,6 +33,7 @@
   context 'when signed out' do
     before do
       visit path
+      click_button 'Actions'
     end
 
     it_behaves_like "it has an RSS link without a feed token"
diff --git a/spec/features/merge_requests/rss_spec.rb b/spec/features/merge_requests/rss_spec.rb
index 9c9f46278f6ba9..5f697a4f79d114 100644
--- a/spec/features/merge_requests/rss_spec.rb
+++ b/spec/features/merge_requests/rss_spec.rb
@@ -25,7 +25,7 @@
       visit path
     end
 
-    it_behaves_like "it has an RSS button with current_user's feed token"
+    it_behaves_like "it has an RSS link with current_user's feed token"
     it_behaves_like "an autodiscoverable RSS feed with current_user's feed token"
   end
 
@@ -34,7 +34,7 @@
       visit path
     end
 
-    it_behaves_like "it has an RSS button without a feed token"
+    it_behaves_like "it has an RSS link without a feed token"
     it_behaves_like "an autodiscoverable RSS feed without a feed token"
   end
 
diff --git a/spec/frontend/issuable/components/csv_import_export_buttons_spec.js b/spec/frontend/issuable/components/csv_import_export_buttons_spec.js
index a861148abb6473..0e2f71fa3ee8db 100644
--- a/spec/frontend/issuable/components/csv_import_export_buttons_spec.js
+++ b/spec/frontend/issuable/components/csv_import_export_buttons_spec.js
@@ -1,5 +1,4 @@
-import { GlButton, GlDropdown } from '@gitlab/ui';
-import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
+import { createMockDirective } from 'helpers/vue_mock_directive';
 import { mountExtended } from 'helpers/vue_test_utils_helper';
 import CsvExportModal from '~/issuable/components/csv_export_modal.vue';
 import CsvImportExportButtons from '~/issuable/components/csv_import_export_buttons.vue';
@@ -33,8 +32,7 @@ describe('CsvImportExportButtons', () => {
     });
   }
 
-  const findExportCsvButton = () => wrapper.findComponent(GlButton);
-  const findImportDropdown = () => wrapper.findComponent(GlDropdown);
+  const findExportCsvButton = () => wrapper.findByRole('menuitem', { name: 'Export as CSV' });
   const findImportCsvButton = () => wrapper.findByRole('menuitem', { name: 'Import CSV' });
   const findImportFromJiraLink = () => wrapper.findByRole('menuitem', { name: 'Import from Jira' });
   const findExportCsvModal = () => wrapper.findComponent(CsvExportModal);
@@ -50,13 +48,6 @@ describe('CsvImportExportButtons', () => {
         expect(findExportCsvButton().exists()).toBe(true);
       });
 
-      it('export button has a tooltip', () => {
-        const tooltip = getBinding(findExportCsvButton().element, 'gl-tooltip');
-
-        expect(tooltip).toBeDefined();
-        expect(tooltip.value).toBe('Export as CSV');
-      });
-
       it('renders the export modal', () => {
         expect(findExportCsvModal().props()).toMatchObject({ exportCsvPath, issuableCount });
       });
@@ -64,7 +55,7 @@ describe('CsvImportExportButtons', () => {
       it('opens the export modal', () => {
         findExportCsvButton().trigger('click');
 
-        expect(glModalDirective).toHaveBeenCalledWith(wrapper.vm.exportModalId);
+        expect(glModalDirective).toHaveBeenCalled();
       });
     });
 
@@ -83,79 +74,38 @@ describe('CsvImportExportButtons', () => {
     });
 
     describe('when the showImportButton=true', () => {
-      beforeEach(() => {
+      it('renders the import csv menu item', () => {
         wrapper = createComponent({ showImportButton: true });
-      });
-
-      it('displays the import dropdown', () => {
-        expect(findImportDropdown().exists()).toBe(true);
-      });
 
-      it('renders the import csv menu item', () => {
         expect(findImportCsvButton().exists()).toBe(true);
       });
 
-      describe('when showLabel=false', () => {
-        beforeEach(() => {
-          wrapper = createComponent({ showImportButton: true, showLabel: false });
-        });
-
-        it('hides button text', () => {
-          expect(findImportDropdown().props()).toMatchObject({
-            text: 'Import issues',
-            textSrOnly: true,
-          });
-        });
-
-        it('import button has a tooltip', () => {
-          const tooltip = getBinding(findImportDropdown().element, 'gl-tooltip');
-
-          expect(tooltip).toBeDefined();
-          expect(tooltip.value).toBe('Import issues');
-        });
-      });
-
-      describe('when showLabel=true', () => {
-        beforeEach(() => {
-          wrapper = createComponent({ showImportButton: true, showLabel: true });
-        });
-
-        it('displays a button text', () => {
-          expect(findImportDropdown().props()).toMatchObject({
-            text: 'Import issues',
-            textSrOnly: false,
-          });
-        });
-
-        it('import button has no tooltip', () => {
-          const tooltip = getBinding(findImportDropdown().element, 'gl-tooltip');
-
-          expect(tooltip.value).toBe(null);
-        });
-      });
-
       it('renders the import modal', () => {
+        wrapper = createComponent({ showImportButton: true });
+
         expect(findImportCsvModal().exists()).toBe(true);
       });
 
       it('opens the import modal', () => {
+        wrapper = createComponent({ showImportButton: true });
+
         findImportCsvButton().trigger('click');
 
-        expect(glModalDirective).toHaveBeenCalledWith(wrapper.vm.importModalId);
+        expect(glModalDirective).toHaveBeenCalled();
       });
 
       describe('import from jira link', () => {
         const projectImportJiraPath = 'gitlab-org/gitlab-test/-/import/jira';
 
-        beforeEach(() => {
-          wrapper = createComponent({
-            showImportButton: true,
-            canEdit: true,
-            projectImportJiraPath,
+        describe('when canEdit=true', () => {
+          beforeEach(() => {
+            wrapper = createComponent({
+              showImportButton: true,
+              canEdit: true,
+              projectImportJiraPath,
+            });
           });
-        });
 
-        describe('when canEdit=true', () => {
           it('renders the import dropdown item', () => {
             expect(findImportFromJiraLink().exists()).toBe(true);
           });
@@ -182,8 +132,8 @@ describe('CsvImportExportButtons', () => {
         wrapper = createComponent({ showImportButton: false });
       });
 
-      it('does not display the import dropdown', () => {
-        expect(findImportDropdown().exists()).toBe(false);
+      it('does not render the import csv menu item', () => {
+        expect(findImportCsvButton().exists()).toBe(false);
       });
 
       it('does not render the import modal', () => {
diff --git a/spec/frontend/issues/list/components/empty_state_without_any_issues_spec.js b/spec/frontend/issues/list/components/empty_state_without_any_issues_spec.js
index 0a2e4e7c671688..4ea3a39f15bc76 100644
--- a/spec/frontend/issues/list/components/empty_state_without_any_issues_spec.js
+++ b/spec/frontend/issues/list/components/empty_state_without_any_issues_spec.js
@@ -1,4 +1,4 @@
-import { GlEmptyState, GlLink } from '@gitlab/ui';
+import { GlDropdown, GlEmptyState, GlLink } from '@gitlab/ui';
 import { mountExtended } from 'helpers/vue_test_utils_helper';
 import CsvImportExportButtons from '~/issuable/components/csv_import_export_buttons.vue';
 import EmptyStateWithoutAnyIssues from '~/issues/list/components/empty_state_without_any_issues.vue';
@@ -26,6 +26,7 @@ describe('EmptyStateWithoutAnyIssues component', () => {
   };
 
   const findCsvImportExportButtons = () => wrapper.findComponent(CsvImportExportButtons);
+  const findCsvImportExportDropdown = () => wrapper.findComponent(GlDropdown);
   const findGlEmptyState = () => wrapper.findComponent(GlEmptyState);
   const findGlLink = () => wrapper.findComponent(GlLink);
   const findIssuesHelpPageLink = () =>
@@ -135,6 +136,7 @@ describe('EmptyStateWithoutAnyIssues component', () => {
             it('renders', () => {
               mountComponent({ props: { showCsvButtons: true } });
 
+              expect(findCsvImportExportDropdown().props('text')).toBe('Import issues');
               expect(findCsvImportExportButtons().props()).toMatchObject({
                 exportCsvPath: defaultProps.exportCsvPathWithQuery,
                 issuableCount: 0,
@@ -146,6 +148,7 @@ describe('EmptyStateWithoutAnyIssues component', () => {
             it('does not render', () => {
               mountComponent({ props: { showCsvButtons: false } });
 
+              expect(findCsvImportExportDropdown().exists()).toBe(false);
               expect(findCsvImportExportButtons().exists()).toBe(false);
             });
           });
diff --git a/spec/frontend/issues/list/components/issues_list_app_spec.js b/spec/frontend/issues/list/components/issues_list_app_spec.js
index 6c064328f81552..978ba5e282fcf3 100644
--- a/spec/frontend/issues/list/components/issues_list_app_spec.js
+++ b/spec/frontend/issues/list/components/issues_list_app_spec.js
@@ -1,4 +1,4 @@
-import { GlButton } from '@gitlab/ui';
+import { GlButton, GlDropdown } from '@gitlab/ui';
 import * as Sentry from '@sentry/browser';
 import { mount, shallowMount } from '@vue/test-utils';
 import AxiosMockAdapter from 'axios-mock-adapter';
@@ -11,6 +11,7 @@ import getIssuesCountsQuery from 'ee_else_ce/issues/list/queries/get_issues_coun
 import createMockApollo from 'helpers/mock_apollo_helper';
 import setWindowLocation from 'helpers/set_window_location_helper';
 import { TEST_HOST } from 'helpers/test_constants';
+import { mountExtended } from 'helpers/vue_test_utils_helper';
 import waitForPromises from 'helpers/wait_for_promises';
 import {
   getIssuesCountsQueryResponse,
@@ -36,6 +37,7 @@ import IssuesListApp from '~/issues/list/components/issues_list_app.vue';
 import NewResourceDropdown from '~/vue_shared/components/new_resource_dropdown/new_resource_dropdown.vue';
 import {
   CREATED_DESC,
+  i18n,
   RELATIVE_POSITION,
   RELATIVE_POSITION_ASC,
   UPDATED_DESC,
@@ -126,12 +128,15 @@ describe('CE IssuesListApp component', () => {
   const mockIssuesQueryResponse = jest.fn().mockResolvedValue(defaultQueryResponse);
   const mockIssuesCountsQueryResponse = jest.fn().mockResolvedValue(getIssuesCountsQueryResponse);
 
+  const findCalendarButton = () => wrapper.findByRole('menuitem', { name: i18n.calendarLabel });
   const findCsvImportExportButtons = () => wrapper.findComponent(CsvImportExportButtons);
+  const findDropdown = () => wrapper.findComponent(GlDropdown);
   const findIssuableByEmail = () => wrapper.findComponent(IssuableByEmail);
+  const findGlButton = () => wrapper.findComponent(GlButton);
   const findGlButtons = () => wrapper.findAllComponents(GlButton);
-  const findGlButtonAt = (index) => findGlButtons().at(index);
   const findIssuableList = () => wrapper.findComponent(IssuableList);
   const findNewResourceDropdown = () => wrapper.findComponent(NewResourceDropdown);
+  const findRssButton = () => wrapper.findByRole('menuitem', { name: i18n.rssLabel });
 
   const findLabelsToken = () =>
     findIssuableList()
@@ -232,71 +237,11 @@ describe('CE IssuesListApp component', () => {
   });
 
   describe('header action buttons', () => {
-    it('renders rss button', async () => {
-      wrapper = mountComponent({ mountFn: mount });
-      await waitForPromises();
-
-      expect(findGlButtonAt(0).props('icon')).toBe('rss');
-      expect(findGlButtonAt(0).attributes()).toMatchObject({
-        href: defaultProvide.rssPath,
-        'aria-label': IssuesListApp.i18n.rssLabel,
-      });
-    });
-
-    it('renders calendar button', async () => {
-      wrapper = mountComponent({ mountFn: mount });
-      await waitForPromises();
-
-      expect(findGlButtonAt(1).props('icon')).toBe('calendar');
-      expect(findGlButtonAt(1).attributes()).toMatchObject({
-        href: defaultProvide.calendarPath,
-        'aria-label': IssuesListApp.i18n.calendarLabel,
-      });
-    });
-
-    describe('csv import/export component', () => {
-      describe('when user is signed in', () => {
-        beforeEach(() => {
-          setWindowLocation('?search=refactor&state=opened');
-
-          wrapper = mountComponent({
-            provide: { initialSortBy: CREATED_DESC, isSignedIn: true },
-            mountFn: mount,
-          });
-
-          return waitForPromises();
-        });
-
-        it('renders', () => {
-          expect(findCsvImportExportButtons().props()).toMatchObject({
-            exportCsvPath: `${defaultProvide.exportCsvPath}?search=refactor&state=opened`,
-            issuableCount: 1,
-          });
-        });
-      });
-
-      describe('when user is not signed in', () => {
-        it('does not render', () => {
-          wrapper = mountComponent({ provide: { isSignedIn: false }, mountFn: mount });
-
-          expect(findCsvImportExportButtons().exists()).toBe(false);
-        });
-      });
-
-      describe('when in a group context', () => {
-        it('does not render', () => {
-          wrapper = mountComponent({ provide: { isProject: false }, mountFn: mount });
-
-          expect(findCsvImportExportButtons().exists()).toBe(false);
-        });
-      });
-    });
-
     describe('bulk edit button', () => {
       it('renders when user has permissions', () => {
         wrapper = mountComponent({ provide: { canBulkUpdate: true }, mountFn: mount });
 
-        expect(findGlButtonAt(2).text()).toBe('Edit issues');
+        expect(findGlButton().text()).toBe('Edit issues');
       });
 
       it('does not render when user does not have permissions', () => {
@@ -309,7 +254,7 @@ describe('CE IssuesListApp component', () => {
         wrapper = mountComponent({ provide: { canBulkUpdate: true }, mountFn: mount });
         jest.spyOn(eventHub, '$emit');
 
-        findGlButtonAt(2).vm.$emit('click');
+        findGlButton().vm.$emit('click');
         await waitForPromises();
 
         expect(eventHub.$emit).toHaveBeenCalledWith('issuables:enableBulkEdit');
@@ -320,14 +265,14 @@ describe('CE IssuesListApp component', () => {
       it('renders when user has permissions', () => {
         wrapper = mountComponent({ provide: { showNewIssueLink: true }, mountFn: mount });
 
-        expect(findGlButtonAt(2).text()).toBe('New');
-        expect(findGlButtonAt(2).attributes('href')).toBe(defaultProvide.newIssuePath);
+        expect(findGlButton().text()).toBe('New issue');
+        expect(findGlButton().attributes('href')).toBe(defaultProvide.newIssuePath);
       });
 
       it('does not render when user does not have permissions', () => {
         wrapper = mountComponent({ provide: { showNewIssueLink: false }, mountFn: mount });
 
-        expect(findGlButtons().filter((button) => button.text() === 'New')).toHaveLength(0);
+        expect(findGlButtons().filter((button) => button.text() === 'New issue')).toHaveLength(0);
       });
     });
 
@@ -344,6 +289,69 @@ describe('CE IssuesListApp component', () => {
         expect(findNewResourceDropdown().exists()).toBe(true);
       });
     });
+
+    describe('actions dropdown', () => {
+      it('renders', () => {
+        wrapper = mountComponent({ mountFn: mount });
+
+        expect(findDropdown().props()).toMatchObject({
+          category: 'tertiary',
+          icon: 'ellipsis_v',
+          text: 'Actions',
+          textSrOnly: true,
+        });
+      });
+
+      describe('csv import/export buttons', () => {
+        describe('when user is signed in', () => {
+          beforeEach(() => {
+            setWindowLocation('?search=refactor&state=opened');
+
+            wrapper = mountComponent({
+              provide: { initialSortBy: CREATED_DESC, isSignedIn: true },
+              mountFn: mount,
+            });
+
+            return waitForPromises();
+          });
+
+          it('renders', () => {
+            expect(findCsvImportExportButtons().props()).toMatchObject({
+              exportCsvPath: `${defaultProvide.exportCsvPath}?search=refactor&state=opened`,
+              issuableCount: 1,
+            });
+          });
+        });
+
+        describe('when user is not signed in', () => {
+          it('does not render', () => {
+            wrapper = mountComponent({ provide: { isSignedIn: false }, mountFn: mount });
+
+            expect(findCsvImportExportButtons().exists()).toBe(false);
+          });
+        });
+
+        describe('when in a group context', () => {
+          it('does not render', () => {
+            wrapper = mountComponent({ provide: { isProject: false }, mountFn: mount });
+
+            expect(findCsvImportExportButtons().exists()).toBe(false);
+          });
+        });
+      });
+
+      it('renders RSS button link', () => {
+        wrapper = mountComponent({ mountFn: mountExtended });
+
+        expect(findRssButton().attributes('href')).toBe(defaultProvide.rssPath);
+      });
+
+      it('renders calendar button link', () => {
+        wrapper = mountComponent({ mountFn: mountExtended });
+
+        expect(findCalendarButton().attributes('href')).toBe(defaultProvide.calendarPath);
+      });
+    });
   });
 
   describe('initial url params', () => {
diff --git a/spec/support/shared_examples/features/rss_shared_examples.rb b/spec/support/shared_examples/features/rss_shared_examples.rb
index 192a396acfe510..f2eb985e9ae83f 100644
--- a/spec/support/shared_examples/features/rss_shared_examples.rb
+++ b/spec/support/shared_examples/features/rss_shared_examples.rb
@@ -2,14 +2,12 @@
 
 RSpec.shared_examples "an autodiscoverable RSS feed with current_user's feed token" do
   it "has an RSS autodiscovery link tag with current_user's feed token" do
-    click_button 'Actions'
     expect(page).to have_css("link[type*='atom+xml'][href*='feed_token=#{user.feed_token}']", visible: false)
   end
 end
 
 RSpec.shared_examples "it has an RSS button with current_user's feed token" do
   it "shows the RSS button with current_user's feed token" do
-    click_button 'Actions'
     expect(page)
       .to have_css("a:has([data-testid='rss-icon'])[href*='feed_token=#{user.feed_token}']")
   end
@@ -23,14 +21,12 @@
 
 RSpec.shared_examples "an autodiscoverable RSS feed without a feed token" do
   it "has an RSS autodiscovery link tag without a feed token" do
-    click_button 'Actions'
     expect(page).to have_css("link[type*='atom+xml']:not([href*='feed_token'])", visible: false)
   end
 end
 
 RSpec.shared_examples "it has an RSS button without a feed token" do
   it "shows the RSS button without a feed token" do
-    click_button 'Actions'
     expect(page)
       .to have_css("a:has([data-testid='rss-icon']):not([href*='feed_token'])")
   end
@@ -47,6 +43,7 @@
   it "for #{type}" do
     sign_in(user)
     visit path
+    click_button 'Actions'
 
     link = find_link('Subscribe to RSS feed')
     params = CGI.parse(URI.parse(link[:href]).query)
-- 
GitLab


From 306a2a2b096e40cbdfbf4ffc89dd5f34201a36b2 Mon Sep 17 00:00:00 2001
From: Coung Ngo <cngo@gitlab.com>
Date: Thu, 30 Mar 2023 20:43:07 +0100
Subject: [PATCH 3/6] Fix QA tests

---
 .../empty_state_without_any_issues.vue        |   1 +
 .../list/components/issues_list_app.vue       |   2 +-
 qa/qa/page/project/issue/index.rb             |  22 ++--
 .../2_plan/issue/export_as_csv_spec.rb        |   2 +
 .../list/components/issues_list_app_spec.js   | 112 +++++++++---------
 5 files changed, 75 insertions(+), 64 deletions(-)

diff --git a/app/assets/javascripts/issues/list/components/empty_state_without_any_issues.vue b/app/assets/javascripts/issues/list/components/empty_state_without_any_issues.vue
index b3b51c730e0207..98429f3ffd10bb 100644
--- a/app/assets/javascripts/issues/list/components/empty_state_without_any_issues.vue
+++ b/app/assets/javascripts/issues/list/components/empty_state_without_any_issues.vue
@@ -77,6 +77,7 @@ export default {
           v-if="showCsvButtons"
           class="gl-w-full gl-sm-w-auto gl-sm-mr-3"
           :text="$options.i18n.importIssues"
+          data-qa-selector="import_issues_dropdown"
         >
           <csv-import-export-buttons
             :export-csv-path="exportCsvPathWithQuery"
diff --git a/app/assets/javascripts/issues/list/components/issues_list_app.vue b/app/assets/javascripts/issues/list/components/issues_list_app.vue
index 7d2ecf57ff1d07..c6f39b93201734 100644
--- a/app/assets/javascripts/issues/list/components/issues_list_app.vue
+++ b/app/assets/javascripts/issues/list/components/issues_list_app.vue
@@ -839,7 +839,7 @@ export default {
           no-caret
           :text="$options.i18n.actionsLabel"
           text-sr-only
-          data-qa-selector="more_issue_actions_dropdown"
+          data-qa-selector="issues_list_more_actions_dropdown"
         >
           <csv-import-export-buttons
             v-if="showCsvButtons"
diff --git a/qa/qa/page/project/issue/index.rb b/qa/qa/page/project/issue/index.rb
index e1c408561cfba6..a4f4f6e3cf13e7 100644
--- a/qa/qa/page/project/issue/index.rb
+++ b/qa/qa/page/project/issue/index.rb
@@ -15,10 +15,6 @@ class Index < Page::Base
             element :avatar_counter_content
           end
 
-          view 'app/assets/javascripts/issues/list/components/issues_list_app.vue' do
-            element :more_issue_actions_dropdown
-          end
-
           view 'app/assets/javascripts/issuable/components/csv_export_modal.vue' do
             element :export_issuable_modal
           end
@@ -28,6 +24,14 @@ class Index < Page::Base
             element :import_from_jira_link
           end
 
+          view 'app/assets/javascripts/issues/list/components/issues_list_app.vue' do
+            element :issues_list_more_actions_dropdown
+          end
+
+          view 'app/assets/javascripts/issues/list/components/empty_state_without_any_issues.vue' do
+            element :import_issues_dropdown
+          end
+
           view 'app/assets/javascripts/vue_shared/issuable/list/components/issuable_tabs.vue' do
             element :closed_issuables_tab, ':data-qa-selector="`${tab.name}_issuables_tab`"' # rubocop:disable QA/ElementWithPattern
           end
@@ -56,10 +60,14 @@ def click_import_from_jira_link
             click_element(:import_from_jira_link)
           end
 
-          def click_more_issue_actions_dropdown
+          def click_import_issues_dropdown
             # When there are no issues, the image that loads causes the buttons to jump
             has_loaded_all_images?
-            click_element(:more_issue_actions_dropdown)
+            click_element(:import_issues_dropdown)
+          end
+
+          def click_issues_list_more_actions_dropdown
+            click_element(:issues_list_more_actions_dropdown)
           end
 
           def export_issues_modal
@@ -67,7 +75,7 @@ def export_issues_modal
           end
 
           def go_to_jira_import_form
-            click_more_issue_actions_dropdown
+            click_import_issues_dropdown
             click_import_from_jira_link
           end
 
diff --git a/qa/qa/specs/features/browser_ui/2_plan/issue/export_as_csv_spec.rb b/qa/qa/specs/features/browser_ui/2_plan/issue/export_as_csv_spec.rb
index 275f3a52f177a3..5e989cdb03f675 100644
--- a/qa/qa/specs/features/browser_ui/2_plan/issue/export_as_csv_spec.rb
+++ b/qa/qa/specs/features/browser_ui/2_plan/issue/export_as_csv_spec.rb
@@ -24,6 +24,8 @@ module QA
 
       it 'successfully exports issues list as CSV', testcase: 'https://gitlab.com/gitlab-org/gitlab/-/quality/test_cases/347968' do
         Page::Project::Issue::Index.perform do |index|
+          index.click_issues_list_more_actions_dropdown
+
           index.click_export_as_csv_button
 
           expect(index.export_issues_modal).to have_content('2 issues selected')
diff --git a/spec/frontend/issues/list/components/issues_list_app_spec.js b/spec/frontend/issues/list/components/issues_list_app_spec.js
index 978ba5e282fcf3..cfa09ebd6ba0bf 100644
--- a/spec/frontend/issues/list/components/issues_list_app_spec.js
+++ b/spec/frontend/issues/list/components/issues_list_app_spec.js
@@ -37,7 +37,6 @@ import IssuesListApp from '~/issues/list/components/issues_list_app.vue';
 import NewResourceDropdown from '~/vue_shared/components/new_resource_dropdown/new_resource_dropdown.vue';
 import {
   CREATED_DESC,
-  i18n,
   RELATIVE_POSITION,
   RELATIVE_POSITION_ASC,
   UPDATED_DESC,
@@ -128,7 +127,8 @@ describe('CE IssuesListApp component', () => {
   const mockIssuesQueryResponse = jest.fn().mockResolvedValue(defaultQueryResponse);
   const mockIssuesCountsQueryResponse = jest.fn().mockResolvedValue(getIssuesCountsQueryResponse);
 
-  const findCalendarButton = () => wrapper.findByRole('menuitem', { name: i18n.calendarLabel });
+  const findCalendarButton = () =>
+    wrapper.findByRole('menuitem', { name: IssuesListApp.i18n.calendarLabel });
   const findCsvImportExportButtons = () => wrapper.findComponent(CsvImportExportButtons);
   const findDropdown = () => wrapper.findComponent(GlDropdown);
   const findIssuableByEmail = () => wrapper.findComponent(IssuableByEmail);
@@ -136,7 +136,7 @@ describe('CE IssuesListApp component', () => {
   const findGlButtons = () => wrapper.findAllComponents(GlButton);
   const findIssuableList = () => wrapper.findComponent(IssuableList);
   const findNewResourceDropdown = () => wrapper.findComponent(NewResourceDropdown);
-  const findRssButton = () => wrapper.findByRole('menuitem', { name: i18n.rssLabel });
+  const findRssButton = () => wrapper.findByRole('menuitem', { name: IssuesListApp.i18n.rssLabel });
 
   const findLabelsToken = () =>
     findIssuableList()
@@ -237,59 +237,6 @@ describe('CE IssuesListApp component', () => {
   });
 
   describe('header action buttons', () => {
-    describe('bulk edit button', () => {
-      it('renders when user has permissions', () => {
-        wrapper = mountComponent({ provide: { canBulkUpdate: true }, mountFn: mount });
-
-        expect(findGlButton().text()).toBe('Edit issues');
-      });
-
-      it('does not render when user does not have permissions', () => {
-        wrapper = mountComponent({ provide: { canBulkUpdate: false }, mountFn: mount });
-
-        expect(findGlButtons().filter((button) => button.text() === 'Edit issues')).toHaveLength(0);
-      });
-
-      it('emits "issuables:enableBulkEdit" event to legacy bulk edit class', async () => {
-        wrapper = mountComponent({ provide: { canBulkUpdate: true }, mountFn: mount });
-        jest.spyOn(eventHub, '$emit');
-
-        findGlButton().vm.$emit('click');
-        await waitForPromises();
-
-        expect(eventHub.$emit).toHaveBeenCalledWith('issuables:enableBulkEdit');
-      });
-    });
-
-    describe('new issue button', () => {
-      it('renders when user has permissions', () => {
-        wrapper = mountComponent({ provide: { showNewIssueLink: true }, mountFn: mount });
-
-        expect(findGlButton().text()).toBe('New issue');
-        expect(findGlButton().attributes('href')).toBe(defaultProvide.newIssuePath);
-      });
-
-      it('does not render when user does not have permissions', () => {
-        wrapper = mountComponent({ provide: { showNewIssueLink: false }, mountFn: mount });
-
-        expect(findGlButtons().filter((button) => button.text() === 'New issue')).toHaveLength(0);
-      });
-    });
-
-    describe('new issue split dropdown', () => {
-      it('does not render in a project context', () => {
-        wrapper = mountComponent({ provide: { isProject: true }, mountFn: mount });
-
-        expect(findNewResourceDropdown().exists()).toBe(false);
-      });
-
-      it('renders in a group context', () => {
-        wrapper = mountComponent({ provide: { isProject: false }, mountFn: mount });
-
-        expect(findNewResourceDropdown().exists()).toBe(true);
-      });
-    });
-
     describe('actions dropdown', () => {
       it('renders', () => {
         wrapper = mountComponent({ mountFn: mount });
@@ -352,6 +299,59 @@ describe('CE IssuesListApp component', () => {
         expect(findCalendarButton().attributes('href')).toBe(defaultProvide.calendarPath);
       });
     });
+
+    describe('bulk edit button', () => {
+      it('renders when user has permissions', () => {
+        wrapper = mountComponent({ provide: { canBulkUpdate: true }, mountFn: mount });
+
+        expect(findGlButton().text()).toBe('Edit issues');
+      });
+
+      it('does not render when user does not have permissions', () => {
+        wrapper = mountComponent({ provide: { canBulkUpdate: false }, mountFn: mount });
+
+        expect(findGlButtons().filter((button) => button.text() === 'Edit issues')).toHaveLength(0);
+      });
+
+      it('emits "issuables:enableBulkEdit" event to legacy bulk edit class', async () => {
+        wrapper = mountComponent({ provide: { canBulkUpdate: true }, mountFn: mount });
+        jest.spyOn(eventHub, '$emit');
+
+        findGlButton().vm.$emit('click');
+        await waitForPromises();
+
+        expect(eventHub.$emit).toHaveBeenCalledWith('issuables:enableBulkEdit');
+      });
+    });
+
+    describe('new issue button', () => {
+      it('renders when user has permissions', () => {
+        wrapper = mountComponent({ provide: { showNewIssueLink: true }, mountFn: mount });
+
+        expect(findGlButton().text()).toBe('New issue');
+        expect(findGlButton().attributes('href')).toBe(defaultProvide.newIssuePath);
+      });
+
+      it('does not render when user does not have permissions', () => {
+        wrapper = mountComponent({ provide: { showNewIssueLink: false }, mountFn: mount });
+
+        expect(findGlButtons().filter((button) => button.text() === 'New issue')).toHaveLength(0);
+      });
+    });
+
+    describe('new issue split dropdown', () => {
+      it('does not render in a project context', () => {
+        wrapper = mountComponent({ provide: { isProject: true }, mountFn: mount });
+
+        expect(findNewResourceDropdown().exists()).toBe(false);
+      });
+
+      it('renders in a group context', () => {
+        wrapper = mountComponent({ provide: { isProject: false }, mountFn: mount });
+
+        expect(findNewResourceDropdown().exists()).toBe(true);
+      });
+    });
   });
 
   describe('initial url params', () => {
-- 
GitLab


From 9121f6532b591834bd73ced2ae36f49641ef7129 Mon Sep 17 00:00:00 2001
From: Annabel Dunstone Gray <annabel.dunstone@gmail.com>
Date: Mon, 3 Apr 2023 11:05:07 -0600
Subject: [PATCH 4/6] Add mobile actions dropdown

---
 app/views/projects/issues/service_desk/_nav_btns.html.haml   | 5 ++++-
 app/views/projects/merge_requests/_nav_btns.html.haml        | 5 ++++-
 spec/support/shared_examples/features/rss_shared_examples.rb | 2 +-
 3 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/app/views/projects/issues/service_desk/_nav_btns.html.haml b/app/views/projects/issues/service_desk/_nav_btns.html.haml
index b430dab29bbbd6..9b16dbe761fee1 100644
--- a/app/views/projects/issues/service_desk/_nav_btns.html.haml
+++ b/app/views/projects/issues/service_desk/_nav_btns.html.haml
@@ -15,10 +15,13 @@
                                                   id: "new_issue_link"
 
 .dropdown.gl-dropdown
-  = button_tag type: 'button', class: "btn dropdown-toggle btn-default btn-md gl-button gl-dropdown gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret has-tooltip", data: { toggle: 'dropdown', title: _('Actions') } do
+  = button_tag type: 'button', class: "btn dropdown-toggle btn-default btn-md gl-button gl-dropdown gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret has-tooltip gl-display-none! gl-md-display-inline-flex!", data: { toggle: 'dropdown', title: _('Actions') } do
     = sprite_icon "ellipsis_v", size: 16, css_class: "dropdown-icon gl-icon"
     %span.gl-sr-only
       = _('Actions')
+  = button_tag type: 'button', class: "btn dropdown-toggle btn-default btn-md btn-block gl-button gl-dropdown-toggle gl-md-display-none!", data: { 'toggle' => 'dropdown' } do
+    %span.gl-dropdown-button-text= _('Actions')
+    = sprite_icon "chevron-down", size: 16, css_class: "dropdown-icon gl-icon"
   .dropdown-menu.dropdown-menu-right
     .gl-dropdown-inner
       .gl-dropdown-contents
diff --git a/app/views/projects/merge_requests/_nav_btns.html.haml b/app/views/projects/merge_requests/_nav_btns.html.haml
index 17e7ff33345e76..6cb1eee01c4893 100644
--- a/app/views/projects/merge_requests/_nav_btns.html.haml
+++ b/app/views/projects/merge_requests/_nav_btns.html.haml
@@ -9,10 +9,13 @@
     = _("New merge request")
 
 .dropdown.gl-dropdown
-  = button_tag type: 'button', class: "btn dropdown-toggle btn-default btn-md gl-button gl-dropdown gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret has-tooltip", data: { toggle: 'dropdown', title: _('Actions') } do
+  = button_tag type: 'button', class: "btn dropdown-toggle btn-default btn-md gl-button gl-dropdown gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret has-tooltip gl-display-none! gl-md-display-inline-flex!", data: { toggle: 'dropdown', title: _('Actions') } do
     = sprite_icon "ellipsis_v", size: 16, css_class: "dropdown-icon gl-icon"
     %span.gl-sr-only
       = _('Actions')
+  = button_tag type: 'button', class: "btn dropdown-toggle btn-default btn-md btn-block gl-button gl-dropdown-toggle gl-md-display-none!", data: { 'toggle' => 'dropdown' } do
+    %span.gl-dropdown-button-text= _('Actions')
+    = sprite_icon "chevron-down", size: 16, css_class: "dropdown-icon gl-icon"
   .dropdown-menu.dropdown-menu-right
     .gl-dropdown-inner
       .gl-dropdown-contents
diff --git a/spec/support/shared_examples/features/rss_shared_examples.rb b/spec/support/shared_examples/features/rss_shared_examples.rb
index f2eb985e9ae83f..f6566214e32d8a 100644
--- a/spec/support/shared_examples/features/rss_shared_examples.rb
+++ b/spec/support/shared_examples/features/rss_shared_examples.rb
@@ -43,7 +43,7 @@
   it "for #{type}" do
     sign_in(user)
     visit path
-    click_button 'Actions'
+    click_button 'Actions', match: :first
 
     link = find_link('Subscribe to RSS feed')
     params = CGI.parse(URI.parse(link[:href]).query)
-- 
GitLab


From 99243394ef2dc439c6018091ef299c7aea363dbd Mon Sep 17 00:00:00 2001
From: Annabel Dunstone Gray <annabel.dunstone@gmail.com>
Date: Tue, 25 Apr 2023 12:08:51 -0600
Subject: [PATCH 5/6] Update list action documentation

---
 doc/user/project/import/jira.md               | 2 +-
 doc/user/project/issues/csv_import.md         | 2 +-
 doc/user/project/issues/due_dates.md          | 3 ++-
 doc/user/project/merge_requests/csv_export.md | 2 +-
 4 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/doc/user/project/import/jira.md b/doc/user/project/import/jira.md
index c8b717d0421232..0c1bae758c247d 100644
--- a/doc/user/project/import/jira.md
+++ b/doc/user/project/import/jira.md
@@ -59,7 +59,7 @@ Importing large projects may take several minutes depending on the size of the i
 
 To import Jira issues to a GitLab project:
 
-1. On the **{issues}** **Issues** page, select **Import Issues** (**{import}**) **> Import from Jira**.
+1. On the **{issues}** **Issues** page, select **{ellipsis_v}** **Actions** and then **Import from Jira**.
 
    ![Import issues from Jira button](img/jira/import_issues_from_jira_button_v12_10.png)
 
diff --git a/doc/user/project/issues/csv_import.md b/doc/user/project/issues/csv_import.md
index ac7d8c99fa8648..404bdac4c6e02e 100644
--- a/doc/user/project/issues/csv_import.md
+++ b/doc/user/project/issues/csv_import.md
@@ -36,7 +36,7 @@ To import issues:
 
 1. Go to your project's Issues list page.
 1. Open the import feature, depending if the project has issues:
-   - The project has existing issues: in the upper-right corner, next to **Edit issues**, select the import icon (**{import}**).
+   - The project has existing issues: in the upper-right corner, next to **Edit issues**, select **{ellipsis_v}** **Actions** and then **Import CSV**.
    - The project has no issues: in the middle of the page, select **Import CSV**.
 1. Select the file you want to import, and then select **Import issues**.
 
diff --git a/doc/user/project/issues/due_dates.md b/doc/user/project/issues/due_dates.md
index f41c90a74a5f98..11fc35688ef615 100644
--- a/doc/user/project/issues/due_dates.md
+++ b/doc/user/project/issues/due_dates.md
@@ -49,7 +49,8 @@ server's time zone.
 
 Issues with due dates can also be exported as an iCalendar feed. The URL of the
 feed can be added to calendar applications. The feed is accessible by selecting
-the **Subscribe to calendar** button on the following pages:
+the **Subscribe to calendar** option in the **{ellipsis_v}** **Actions** dropdown
+list on the following pages:
 
 - The **Assigned Issues** page linked on the right side of the GitLab header
 - The **Project Issues** page
diff --git a/doc/user/project/merge_requests/csv_export.md b/doc/user/project/merge_requests/csv_export.md
index 9028a9411ea1ef..48db47c6d9f6fd 100644
--- a/doc/user/project/merge_requests/csv_export.md
+++ b/doc/user/project/merge_requests/csv_export.md
@@ -16,7 +16,7 @@ To export merge requests to a CSV file:
 1. On the left sidebar, select **Merge requests** .
 1. Add any searches or filters. This can help you keep the size of the CSV file under the 15 MB limit. The limit ensures
    the file can be emailed to a variety of email providers.
-1. Select **Export as CSV** (**{export}**).
+1. Select **{ellipsis_v}** **Actions** and then **Export as CSV**.
 1. Confirm the correct number of merge requests are to be exported.
 1. Select **Export merge requests**.
 
-- 
GitLab


From 0173adb2d88960713e6126bcb8b959ea1929acf0 Mon Sep 17 00:00:00 2001
From: Coung Ngo <cngo@gitlab.com>
Date: Wed, 26 Apr 2023 11:14:23 +0100
Subject: [PATCH 6/6] Add docs reviewer changes

---
 doc/user/project/import/jira.md               | 2 +-
 doc/user/project/issues/csv_import.md         | 2 +-
 doc/user/project/issues/due_dates.md          | 2 +-
 doc/user/project/merge_requests/csv_export.md | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/doc/user/project/import/jira.md b/doc/user/project/import/jira.md
index 0c1bae758c247d..e9c016c5d2b924 100644
--- a/doc/user/project/import/jira.md
+++ b/doc/user/project/import/jira.md
@@ -59,7 +59,7 @@ Importing large projects may take several minutes depending on the size of the i
 
 To import Jira issues to a GitLab project:
 
-1. On the **{issues}** **Issues** page, select **{ellipsis_v}** **Actions** and then **Import from Jira**.
+1. On the **{issues}** **Issues** page, select  **Actions** (**{ellipsis_v}**) **> Import from Jira**.
 
    ![Import issues from Jira button](img/jira/import_issues_from_jira_button_v12_10.png)
 
diff --git a/doc/user/project/issues/csv_import.md b/doc/user/project/issues/csv_import.md
index 404bdac4c6e02e..a200849cdc01ef 100644
--- a/doc/user/project/issues/csv_import.md
+++ b/doc/user/project/issues/csv_import.md
@@ -36,7 +36,7 @@ To import issues:
 
 1. Go to your project's Issues list page.
 1. Open the import feature, depending if the project has issues:
-   - The project has existing issues: in the upper-right corner, next to **Edit issues**, select **{ellipsis_v}** **Actions** and then **Import CSV**.
+   - The project has existing issues: in the upper-right corner, next to **Edit issues**, select **Actions** (**{ellipsis_v}**) **> Import CSV**.
    - The project has no issues: in the middle of the page, select **Import CSV**.
 1. Select the file you want to import, and then select **Import issues**.
 
diff --git a/doc/user/project/issues/due_dates.md b/doc/user/project/issues/due_dates.md
index 11fc35688ef615..63b60e4538ffdc 100644
--- a/doc/user/project/issues/due_dates.md
+++ b/doc/user/project/issues/due_dates.md
@@ -49,7 +49,7 @@ server's time zone.
 
 Issues with due dates can also be exported as an iCalendar feed. The URL of the
 feed can be added to calendar applications. The feed is accessible by selecting
-the **Subscribe to calendar** option in the **{ellipsis_v}** **Actions** dropdown
+the **Subscribe to calendar** option in the  **Actions** (**{ellipsis_v}**) dropdown
 list on the following pages:
 
 - The **Assigned Issues** page linked on the right side of the GitLab header
diff --git a/doc/user/project/merge_requests/csv_export.md b/doc/user/project/merge_requests/csv_export.md
index 48db47c6d9f6fd..f40b82a62805e3 100644
--- a/doc/user/project/merge_requests/csv_export.md
+++ b/doc/user/project/merge_requests/csv_export.md
@@ -16,7 +16,7 @@ To export merge requests to a CSV file:
 1. On the left sidebar, select **Merge requests** .
 1. Add any searches or filters. This can help you keep the size of the CSV file under the 15 MB limit. The limit ensures
    the file can be emailed to a variety of email providers.
-1. Select **{ellipsis_v}** **Actions** and then **Export as CSV**.
+1. Select **Actions** (**{ellipsis_v}**) **> Export as CSV**.
 1. Confirm the correct number of merge requests are to be exported.
 1. Select **Export merge requests**.
 
-- 
GitLab