Add latest changes from gitlab-org/gitlab@15-3-stable-eev15.3.0-rc42

49 files changed, 110 insertions, 444 deletions

diff --git a/app/assets/javascripts/sidebar/components/assignees/assignees.vue b/app/assets/javascripts/sidebar/components/assignees/assignees.vue
index 3602b5ec4f6..29ea390a81d 100644
--- a/app/assets/javascripts/sidebar/components/assignees/assignees.vue
+++ b/app/assets/javascripts/sidebar/components/assignees/assignees.vue
@@ -39,9 +39,6 @@ export default {
     assignSelf() {
       this.$emit('assign-self');
     },
-    toggleAttentionRequested(data) {
-      this.$emit('toggle-attention-requested', data);
-    },
   },
 };
 </script>
@@ -66,12 +63,7 @@ export default {
         </template>
       </span>
 
-      <uncollapsed-assignee-list
-        v-else
-        :users="sortedAssigness"
-        :issuable-type="issuableType"
-        @toggle-attention-requested="toggleAttentionRequested"
-      />
+      <uncollapsed-assignee-list v-else :users="sortedAssigness" :issuable-type="issuableType" />
     </div>
   </div>
 </template>
diff --git a/app/assets/javascripts/sidebar/components/assignees/issuable_assignees.vue b/app/assets/javascripts/sidebar/components/assignees/issuable_assignees.vue
index 59a4eb54bbe..a94dd128a1a 100644
--- a/app/assets/javascripts/sidebar/components/assignees/issuable_assignees.vue
+++ b/app/assets/javascripts/sidebar/components/assignees/issuable_assignees.vue
@@ -32,11 +32,6 @@ export default {
       return this.users.length === 0;
     },
   },
-  methods: {
-    toggleAttentionRequested(data) {
-      this.$emit('toggle-attention-requested', data);
-    },
-  },
 };
 </script>
 
@@ -66,7 +61,6 @@ export default {
       :users="users"
       :issuable-type="issuableType"
       class="gl-text-gray-800 hide-collapsed"
-      @toggle-attention-requested="toggleAttentionRequested"
     />
   </div>
 </template>
diff --git a/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.vue b/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.vue
index e596d6292bf..18b26c7d8bd 100644
--- a/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.vue
+++ b/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.vue
@@ -125,9 +125,6 @@ export default {
         availability: this.assigneeAvailabilityStatus[username] || '',
       }));
     },
-    toggleAttentionRequested(data) {
-      this.mediator.toggleAttentionRequested('assignee', data);
-    },
   },
 };
 </script>
@@ -155,7 +152,6 @@ export default {
       :editable="store.editable"
       :issuable-type="issuableType"
       @assign-self="assignSelf"
-      @toggle-attention-requested="toggleAttentionRequested"
     />
   </div>
 </template>
diff --git a/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees_widget.vue b/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees_widget.vue
index 14f6c9d3a15..5c432ca0e03 100644
--- a/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees_widget.vue
+++ b/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees_widget.vue
@@ -149,6 +149,9 @@ export default {
     signedIn() {
       return this.currentUser.username !== undefined;
     },
+    issuableAuthor() {
+      return this.issuable?.author;
+    },
   },
   watch: {
     iid(_, oldIid) {
@@ -266,6 +269,7 @@ export default {
           :current-user="currentUser"
           :issuable-type="issuableType"
           :is-editing="edit"
+          :issuable-author="issuableAuthor"
           class="gl-w-full dropdown-menu-user gl-mt-n3"
           @toggle="collapseWidget"
           @error="showError"
diff --git a/app/assets/javascripts/sidebar/components/assignees/sidebar_participant.vue b/app/assets/javascripts/sidebar/components/assignees/sidebar_participant.vue
index e9c68008143..0ed40f56bea 100644
--- a/app/assets/javascripts/sidebar/components/assignees/sidebar_participant.vue
+++ b/app/assets/javascripts/sidebar/components/assignees/sidebar_participant.vue
@@ -1,5 +1,5 @@
 <script>
-import { GlAvatarLabeled, GlAvatarLink, GlIcon } from '@gitlab/ui';
+import { GlAvatarLabeled, GlIcon } from '@gitlab/ui';
 import { IssuableType } from '~/issues/constants';
 import { s__, sprintf } from '~/locale';
 
@@ -11,7 +11,6 @@ const AVAILABILITY_STATUS = {
 export default {
   components: {
     GlAvatarLabeled,
-    GlAvatarLink,
     GlIcon,
   },
   props: {
@@ -47,23 +46,21 @@ export default {
 </script>
 
 <template>
-  <gl-avatar-link>
-    <gl-avatar-labeled
-      :size="32"
-      :label="userLabel"
-      :sub-label="`@${user.username}`"
-      :src="user.avatarUrl || user.avatar || user.avatar_url"
-      class="gl-align-items-center gl-relative"
-    >
-      <template #meta>
-        <gl-icon
-          v-if="hasCannotMergeIcon"
-          name="warning-solid"
-          aria-hidden="true"
-          class="merge-icon"
-          :size="12"
-        />
-      </template>
-    </gl-avatar-labeled>
-  </gl-avatar-link>
+  <gl-avatar-labeled
+    :size="32"
+    :label="userLabel"
+    :sub-label="`@${user.username}`"
+    :src="user.avatarUrl || user.avatar || user.avatar_url"
+    class="gl-align-items-center gl-relative sidebar-participant"
+  >
+    <template #meta>
+      <gl-icon
+        v-if="hasCannotMergeIcon"
+        name="warning-solid"
+        aria-hidden="true"
+        class="merge-icon gl-left-6 gl-bottom-0"
+        :size="12"
+      />
+    </template>
+  </gl-avatar-labeled>
 </template>
diff --git a/app/assets/javascripts/sidebar/components/assignees/uncollapsed_assignee_list.vue b/app/assets/javascripts/sidebar/components/assignees/uncollapsed_assignee_list.vue
index b6260418837..0e4d4c74160 100644
--- a/app/assets/javascripts/sidebar/components/assignees/uncollapsed_assignee_list.vue
+++ b/app/assets/javascripts/sidebar/components/assignees/uncollapsed_assignee_list.vue
@@ -2,7 +2,6 @@
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import { IssuableType } from '~/issues/constants';
 import { __, sprintf } from '~/locale';
-import AttentionRequestedToggle from '../attention_requested_toggle.vue';
 import AssigneeAvatarLink from './assignee_avatar_link.vue';
 import UserNameWithStatus from './user_name_with_status.vue';
 
@@ -10,7 +9,6 @@ const DEFAULT_RENDER_COUNT = 5;
 
 export default {
   components: {
-    AttentionRequestedToggle,
     AssigneeAvatarLink,
     UserNameWithStatus,
   },
@@ -46,10 +44,6 @@ export default {
       return this.users.length - DEFAULT_RENDER_COUNT;
     },
     uncollapsedUsers() {
-      if (this.showVerticalList) {
-        return this.users;
-      }
-
       const uncollapsedLength = this.showLess
         ? Math.min(this.users.length, DEFAULT_RENDER_COUNT)
         : this.users.length;
@@ -58,9 +52,6 @@ export default {
     username() {
       return `@${this.firstUser.username}`;
     },
-    showVerticalList() {
-      return this.glFeatures.mrAttentionRequests && this.isMergeRequest;
-    },
     isMergeRequest() {
       return this.issuableType === IssuableType.MergeRequest;
     },
@@ -75,9 +66,6 @@ export default {
       }
       return u?.status?.availability || '';
     },
-    toggleAttentionRequested(data) {
-      this.$emit('toggle-attention-requested', data);
-    },
   },
 };
 </script>
@@ -96,7 +84,7 @@ export default {
         <assignee-avatar-link
           :user="user"
           :issuable-type="issuableType"
-          :tooltip-has-name="!showVerticalList"
+          :tooltip-has-name="!isMergeRequest"
           class="gl-word-break-word"
           data-css-area="user"
         >
@@ -107,14 +95,6 @@ export default {
             <user-name-with-status :name="user.name" :availability="userAvailability(user)" />
           </div>
         </assignee-avatar-link>
-        <attention-requested-toggle
-          v-if="showVerticalList"
-          :user="user"
-          type="assignee"
-          class="gl-mr-2"
-          data-css-area="attention"
-          @toggle-attention-requested="toggleAttentionRequested"
-        />
       </div>
     </div>
     <div v-if="renderShowMoreSection" class="user-list-more gl-hover-text-blue-800">
diff --git a/app/assets/javascripts/sidebar/components/attention_requested_toggle.vue b/app/assets/javascripts/sidebar/components/attention_requested_toggle.vue
deleted file mode 100644
index 974ad189f32..00000000000
--- a/app/assets/javascripts/sidebar/components/attention_requested_toggle.vue
+++ /dev/null
@@ -1,105 +0,0 @@
-<script>
-import { GlButton, GlTooltipDirective } from '@gitlab/ui';
-import { __ } from '~/locale';
-import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
-
-export default {
-  i18n: {
-    addAttentionRequest: __('Add attention request'),
-    removeAttentionRequest: __('Remove attention request'),
-    attentionRequestedNoPermission: __('Attention requested'),
-    noAttentionRequestedNoPermission: __('No attention request'),
-  },
-  components: {
-    GlButton,
-  },
-  directives: {
-    GlTooltip: GlTooltipDirective,
-  },
-  props: {
-    type: {
-      type: String,
-      required: true,
-    },
-    user: {
-      type: Object,
-      required: true,
-    },
-  },
-  data() {
-    return {
-      loading: false,
-    };
-  },
-  computed: {
-    tooltipTitle() {
-      if (this.user.attention_requested) {
-        if (this.user.can_update_merge_request) {
-          return this.$options.i18n.removeAttentionRequest;
-        }
-
-        return this.$options.i18n.attentionRequestedNoPermission;
-      }
-
-      if (this.user.can_update_merge_request) {
-        return this.$options.i18n.addAttentionRequest;
-      }
-
-      return this.$options.i18n.noAttentionRequestedNoPermission;
-    },
-    request() {
-      const state = {
-        selected: false,
-        icon: 'attention',
-        direction: 'add',
-      };
-
-      if (this.user.attention_requested) {
-        Object.assign(state, {
-          selected: true,
-          icon: 'attention-solid',
-          direction: 'remove',
-        });
-      }
-
-      return state;
-    },
-  },
-  methods: {
-    toggleAttentionRequired() {
-      if (this.loading || !this.user.can_update_merge_request) return;
-
-      this.$root.$emit(BV_HIDE_TOOLTIP);
-      this.loading = true;
-      this.$emit('toggle-attention-requested', {
-        user: this.user,
-        callback: this.toggleAttentionRequiredComplete,
-        direction: this.request.direction,
-      });
-    },
-    toggleAttentionRequiredComplete() {
-      this.loading = false;
-    },
-  },
-};
-</script>
-
-<template>
-  <div>
-    <span
-      v-gl-tooltip.left.viewport="tooltipTitle"
-      class="gl-display-inline-block js-attention-request-toggle"
-    >
-      <gl-button
-        :loading="loading"
-        :selected="request.selected"
-        :icon="request.icon"
-        :aria-label="tooltipTitle"
-        :class="{ 'gl-pointer-events-none': !user.can_update_merge_request }"
-        size="small"
-        category="tertiary"
-        @click="toggleAttentionRequired"
-      />
-    </span>
-  </div>
-</template>
diff --git a/app/assets/javascripts/sidebar/components/confidential/sidebar_confidentiality_form.vue b/app/assets/javascripts/sidebar/components/confidential/sidebar_confidentiality_form.vue
index c44ce8b0057..336c291d4f1 100644
--- a/app/assets/javascripts/sidebar/components/confidential/sidebar_confidentiality_form.vue
+++ b/app/assets/javascripts/sidebar/components/confidential/sidebar_confidentiality_form.vue
@@ -88,7 +88,10 @@ export default {
         .then(
           ({
             data: {
-              issuableSetConfidential: { errors },
+              issuableSetConfidential: {
+                issuable: { confidential },
+                errors,
+              },
             },
           }) => {
             if (errors.length) {
@@ -96,7 +99,7 @@ export default {
                 message: errors[0],
               });
             } else {
-              this.$emit('closeForm');
+              this.$emit('closeForm', { confidential });
             }
           },
         )
diff --git a/app/assets/javascripts/sidebar/components/confidential/sidebar_confidentiality_widget.vue b/app/assets/javascripts/sidebar/components/confidential/sidebar_confidentiality_widget.vue
index f234c5ea3c9..eec083f23f3 100644
--- a/app/assets/javascripts/sidebar/components/confidential/sidebar_confidentiality_widget.vue
+++ b/app/assets/javascripts/sidebar/components/confidential/sidebar_confidentiality_widget.vue
@@ -95,10 +95,10 @@ export default {
     confidentialWidget.setConfidentiality = null;
   },
   methods: {
-    closeForm() {
+    closeForm({ confidential } = {}) {
       this.$refs.editable.collapse();
       this.$el.dispatchEvent(hideDropdownEvent);
-      this.$emit('closeForm');
+      this.$emit('closeForm', { confidential });
     },
     // synchronizing the quick action with the sidebar widget
     // this is a temporary solution until we have confidentiality real-time updates
diff --git a/app/assets/javascripts/sidebar/components/reviewers/collapsed_reviewer_list.vue b/app/assets/javascripts/sidebar/components/reviewers/collapsed_reviewer_list.vue
index 9502b2e78b3..6f82178b6fd 100644
--- a/app/assets/javascripts/sidebar/components/reviewers/collapsed_reviewer_list.vue
+++ b/app/assets/javascripts/sidebar/components/reviewers/collapsed_reviewer_list.vue
@@ -33,7 +33,7 @@ export default {
       return this.users.length > 2;
     },
     allReviewersCanMerge() {
-      return this.users.every((user) => user.can_merge);
+      return this.users.every((user) => user.mergeRequestInteraction?.canMerge);
     },
     sidebarAvatarCounter() {
       if (this.users.length > DEFAULT_MAX_COUNTER) {
@@ -48,7 +48,7 @@ export default {
       return this.users.slice(0, collapsedLength);
     },
     tooltipTitleMergeStatus() {
-      const mergeLength = this.users.filter((u) => u.can_merge).length;
+      const mergeLength = this.users.filter((u) => u.mergeRequestInteraction?.canMerge).length;
 
       if (mergeLength === this.users.length) {
         return '';
diff --git a/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar.vue b/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar.vue
index 7961b7cd679..a7db3b3d09f 100644
--- a/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar.vue
+++ b/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar.vue
@@ -23,10 +23,10 @@ export default {
       return sprintf(__("%{userName}'s avatar"), { userName: this.user.name });
     },
     avatarUrl() {
-      return this.user.avatar || this.user.avatar_url || gon.default_avatar_url;
+      return this.user.avatarUrl || this.user.avatar_url || gon.default_avatar_url;
     },
     hasMergeIcon() {
-      return !this.user.can_merge;
+      return !this.user.mergeRequestInteraction?.canMerge;
     },
   },
 };
diff --git a/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar_link.vue b/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar_link.vue
index c9b0a4ae2b3..f69c027e201 100644
--- a/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar_link.vue
+++ b/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar_link.vue
@@ -40,7 +40,7 @@ export default {
   },
   computed: {
     cannotMerge() {
-      return this.issuableType === 'merge_request' && !this.user.can_merge;
+      return this.issuableType === 'merge_request' && !this.user.mergeRequestInteraction?.canMerge;
     },
     tooltipTitle() {
       if (this.cannotMerge && this.tooltipHasName) {
@@ -59,7 +59,7 @@ export default {
       };
     },
     reviewerUrl() {
-      return this.user.web_url;
+      return this.user.webUrl;
     },
   },
 };
diff --git a/app/assets/javascripts/sidebar/components/reviewers/reviewers.vue b/app/assets/javascripts/sidebar/components/reviewers/reviewers.vue
index b07fd944ff9..5e1172ad835 100644
--- a/app/assets/javascripts/sidebar/components/reviewers/reviewers.vue
+++ b/app/assets/javascripts/sidebar/components/reviewers/reviewers.vue
@@ -36,8 +36,8 @@ export default {
       return !this.users.length;
     },
     sortedReviewers() {
-      const canMergeUsers = this.users.filter((user) => user.can_merge);
-      const canNotMergeUsers = this.users.filter((user) => !user.can_merge);
+      const canMergeUsers = this.users.filter((user) => user.mergeRequestInteraction?.canMerge);
+      const canNotMergeUsers = this.users.filter((user) => !user.mergeRequestInteraction?.canMerge);
 
       return [...canMergeUsers, ...canNotMergeUsers];
     },
@@ -49,9 +49,6 @@ export default {
     requestReview(data) {
       this.$emit('request-review', data);
     },
-    toggleAttentionRequested(data) {
-      this.$emit('toggle-attention-requested', data);
-    },
   },
 };
 </script>
@@ -73,7 +70,6 @@ export default {
         :root-path="rootPath"
         :issuable-type="issuableType"
         @request-review="requestReview"
-        @toggle-attention-requested="toggleAttentionRequested"
       />
     </div>
   </div>
diff --git a/app/assets/javascripts/sidebar/components/reviewers/sidebar_reviewers.vue b/app/assets/javascripts/sidebar/components/reviewers/sidebar_reviewers.vue
index 2ea63219e92..b0d820ddd15 100644
--- a/app/assets/javascripts/sidebar/components/reviewers/sidebar_reviewers.vue
+++ b/app/assets/javascripts/sidebar/components/reviewers/sidebar_reviewers.vue
@@ -1,15 +1,23 @@
 <script>
 // NOTE! For the first iteration, we are simply copying the implementation of Assignees
 // It will soon be overhauled in Issue https://gitlab.com/gitlab-org/gitlab/-/issues/233736
+import Vue from 'vue';
 import { refreshUserMergeRequestCounts } from '~/commons/nav/user_merge_requests';
 import createFlash from '~/flash';
 import { __ } from '~/locale';
 import eventHub from '~/sidebar/event_hub';
 import Store from '~/sidebar/stores/sidebar_store';
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
+import getMergeRequestReviewersQuery from '~/vue_shared/components/sidebar/queries/get_merge_request_reviewers.query.graphql';
 import ReviewerTitle from './reviewer_title.vue';
 import Reviewers from './reviewers.vue';
 
+export const state = Vue.observable({
+  issuable: {},
+  loading: false,
+  initialLoading: true,
+});
+
 export default {
   name: 'SidebarReviewers',
   components: {
@@ -40,18 +48,49 @@ export default {
       required: true,
     },
   },
+  apollo: {
+    issuable: {
+      query: getMergeRequestReviewersQuery,
+      variables() {
+        return {
+          iid: this.issuableIid,
+          fullPath: this.projectPath,
+        };
+      },
+      update(data) {
+        return data.workspace?.issuable;
+      },
+      result() {
+        this.initialLoading = false;
+      },
+      error() {
+        createFlash({ message: __('An error occurred while fetching reviewers.') });
+      },
+    },
+  },
   data() {
-    return {
-      store: new Store(),
-      loading: false,
-    };
+    return state;
   },
   computed: {
     relativeUrlRoot() {
       return gon.relative_url_root ?? '';
     },
+    reviewers() {
+      return this.issuable.reviewers?.nodes || [];
+    },
+    graphqlFetching() {
+      return this.$apollo.queries.issuable.loading;
+    },
+    isLoading() {
+      return this.loading || this.$apollo.queries.issuable.loading;
+    },
+    canUpdate() {
+      return this.issuable.userPermissions?.updateMergeRequest || false;
+    },
   },
   created() {
+    this.store = new Store();
+
     this.removeReviewer = this.store.removeReviewer.bind(this.store);
     this.addReviewer = this.store.addReviewer.bind(this.store);
     this.removeAllReviewers = this.store.removeAllReviewers.bind(this.store);
@@ -77,6 +116,7 @@ export default {
         .then(() => {
           this.loading = false;
           refreshUserMergeRequestCounts();
+          this.$apollo.queries.issuable.refetch();
         })
         .catch(() => {
           this.loading = false;
@@ -88,9 +128,6 @@ export default {
     requestReview(data) {
       this.mediator.requestReview(data);
     },
-    toggleAttentionRequested(data) {
-      this.mediator.toggleAttentionRequested('reviewer', data);
-    },
   },
 };
 </script>
@@ -98,18 +135,17 @@ export default {
 <template>
   <div>
     <reviewer-title
-      :number-of-reviewers="store.reviewers.length"
-      :loading="loading || store.isFetching.reviewers"
-      :editable="store.editable"
+      :number-of-reviewers="reviewers.length"
+      :loading="isLoading"
+      :editable="canUpdate"
     />
     <reviewers
-      v-if="!store.isFetching.reviewers"
+      v-if="!initialLoading"
       :root-path="relativeUrlRoot"
-      :users="store.reviewers"
-      :editable="store.editable"
+      :users="reviewers"
+      :editable="canUpdate"
       :issuable-type="issuableType"
       @request-review="requestReview"
-      @toggle-attention-requested="toggleAttentionRequested"
     />
   </div>
 </template>
diff --git a/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue b/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue
index 2f58e11c00f..217ca2e2548 100644
--- a/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue
+++ b/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue
@@ -1,8 +1,6 @@
 <script>
 import { GlButton, GlTooltipDirective, GlIcon } from '@gitlab/ui';
-import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import { __, sprintf, s__ } from '~/locale';
-import AttentionRequestedToggle from '../attention_requested_toggle.vue';
 import ReviewerAvatarLink from './reviewer_avatar_link.vue';
 
 const LOADING_STATE = 'loading';
@@ -16,12 +14,10 @@ export default {
     GlButton,
     GlIcon,
     ReviewerAvatarLink,
-    AttentionRequestedToggle,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
   },
-  mixins: [glFeatureFlagsMixin()],
   props: {
     users: {
       type: Array,
@@ -80,9 +76,6 @@ export default {
         this.loadingStates[userId] = null;
       }
     },
-    toggleAttentionRequested(data) {
-      this.$emit('toggle-attention-requested', data);
-    },
   },
   LOADING_STATE,
   SUCCESS_STATE,
@@ -96,7 +89,6 @@ export default {
       :key="user.id"
       :class="{
         'gl-mb-3': index !== users.length - 1,
-        'attention-requests': glFeatures.mrAttentionRequests,
       }"
       class="gl-display-grid gl-align-items-center reviewer-grid gl-mr-2"
       data-testid="reviewer"
@@ -112,16 +104,8 @@ export default {
           {{ user.name }}
         </div>
       </reviewer-avatar-link>
-      <attention-requested-toggle
-        v-if="glFeatures.mrAttentionRequests"
-        :user="user"
-        type="reviewer"
-        class="gl-mr-2"
-        data-css-area="attention"
-        @toggle-attention-requested="toggleAttentionRequested"
-      />
       <gl-icon
-        v-if="user.approved"
+        v-if="user.mergeRequestInteraction.approved"
         v-gl-tooltip.left
         :size="16"
         :title="approvedByTooltipTitle(user)"
@@ -137,9 +121,7 @@ export default {
         data-testid="re-request-success"
       />
       <gl-button
-        v-else-if="
-          user.can_update_merge_request && user.reviewed && !glFeatures.mrAttentionRequests
-        "
+        v-else-if="user.mergeRequestInteraction.canUpdate && user.mergeRequestInteraction.reviewed"
         v-gl-tooltip.left
         :title="$options.i18n.reRequestReview"
         :aria-label="$options.i18n.reRequestReview"
diff --git a/app/assets/javascripts/sidebar/components/severity/severity.vue b/app/assets/javascripts/sidebar/components/severity/severity.vue
index 0db856543d0..776dab98f01 100644
--- a/app/assets/javascripts/sidebar/components/severity/severity.vue
+++ b/app/assets/javascripts/sidebar/components/severity/severity.vue
@@ -37,10 +37,10 @@ export default {
     <gl-icon
       :size="iconSize"
       :name="`severity-${severity.icon}`"
-      :class="[`icon-${severity.icon}`, { 'gl-mr-3': !iconOnly }]"
+      :class="[`icon-${severity.icon}`, { 'gl-mr-3 gl-flex-shrink-0': !iconOnly }]"
     />
-    <tooltip-on-truncate v-if="!iconOnly" :title="severity.label" class="gl-text-truncate">{{
-      severity.label
-    }}</tooltip-on-truncate>
+    <tooltip-on-truncate v-if="!iconOnly" :title="severity.label" class="gl-text-truncate">
+      {{ severity.label }}
+    </tooltip-on-truncate>
   </div>
 </template>
diff --git a/app/assets/javascripts/sidebar/components/severity/sidebar_severity.vue b/app/assets/javascripts/sidebar/components/severity/sidebar_severity.vue
index 86e46016534..bf4ba715f85 100644
--- a/app/assets/javascripts/sidebar/components/severity/sidebar_severity.vue
+++ b/app/assets/javascripts/sidebar/components/severity/sidebar_severity.vue
@@ -149,23 +149,25 @@ export default {
     </div>
 
     <div class="hide-collapsed">
-      <p
-        class="gl-line-height-20 gl-mb-2 gl-text-gray-900 gl-display-flex gl-justify-content-space-between"
+      <div
+        class="gl-display-flex gl-align-items-center gl-line-height-20 gl-text-gray-900 gl-font-weight-bold"
       >
         {{ $options.i18n.SEVERITY }}
         <gl-button
           v-if="canUpdate"
           category="tertiary"
           size="small"
+          class="gl-ml-auto hide-collapsed gl-mr-n2"
           data-testid="editButton"
           @click="toggleFormDropdown"
           @keydown.esc="hideDropdown"
         >
           {{ $options.i18n.EDIT }}
         </gl-button>
-      </p>
+      </div>
 
       <gl-dropdown
+        class="gl-mt-3"
         :class="dropdownClass"
         block
         :header-text="__('Assign severity')"
diff --git a/app/assets/javascripts/sidebar/mount_sidebar.js b/app/assets/javascripts/sidebar/mount_sidebar.js
index 3f82fe5ce87..fec4d0e346d 100644
--- a/app/assets/javascripts/sidebar/mount_sidebar.js
+++ b/app/assets/javascripts/sidebar/mount_sidebar.js
@@ -27,8 +27,6 @@ import trackShowInviteMemberLink from '~/sidebar/track_invite_members';
 import { DropdownVariant } from '~/vue_shared/components/sidebar/labels_select_vue/constants';
 import LabelsSelectWidget from '~/vue_shared/components/sidebar/labels_select_widget/labels_select_root.vue';
 import { LabelType } from '~/vue_shared/components/sidebar/labels_select_widget/constants';
-import eventHub from '~/sidebar/event_hub';
-import { refreshUserMergeRequestCounts } from '~/commons/nav/user_merge_requests';
 import Translate from '../vue_shared/translate';
 import SidebarAssignees from './components/assignees/sidebar_assignees.vue';
 import CopyEmailToClipboard from './components/copy_email_to_clipboard.vue';
@@ -41,6 +39,7 @@ import SidebarTimeTracking from './components/time_tracking/sidebar_time_trackin
 import { IssuableAttributeType } from './constants';
 import SidebarMoveIssue from './lib/sidebar_move_issue';
 import CrmContacts from './components/crm_contacts/crm_contacts.vue';
+import SidebarEventHub from './event_hub';
 
 Vue.use(Translate);
 Vue.use(VueApollo);
@@ -361,6 +360,13 @@ function mountConfidentialComponent() {
               ? IssuableType.Issue
               : IssuableType.MergeRequest,
         },
+        on: {
+          closeForm({ confidential }) {
+            if (confidential !== undefined) {
+              SidebarEventHub.$emit('confidentialityUpdated', confidential);
+            }
+          },
+        },
       }),
   });
 }
@@ -652,13 +658,6 @@ export function mountSidebar(mediator, store) {
   mountSeverityComponent();
 
   mountEscalationStatusComponent();
-
-  if (window.gon?.features?.mrAttentionRequests) {
-    eventHub.$on('removeCurrentUserAttentionRequested', () => {
-      mediator.removeCurrentUserAttentionRequested();
-      refreshUserMergeRequestCounts();
-    });
-  }
 }
 
 export { getSidebarOptions };
diff --git a/app/assets/javascripts/sidebar/queries/epic_confidential.query.graphql b/app/assets/javascripts/sidebar/queries/epic_confidential.query.graphql
index 4998b2af666..a9d7e9878c6 100644
--- a/app/assets/javascripts/sidebar/queries/epic_confidential.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/epic_confidential.query.graphql
@@ -1,9 +1,7 @@
 query epicConfidential($fullPath: ID!, $iid: ID) {
   workspace: group(fullPath: $fullPath) {
-    __typename
     id
     issuable: epic(iid: $iid) {
-      __typename
       id
       confidential
     }
diff --git a/app/assets/javascripts/sidebar/queries/epic_due_date.query.graphql b/app/assets/javascripts/sidebar/queries/epic_due_date.query.graphql
index 00529042e92..45c15a86961 100644
--- a/app/assets/javascripts/sidebar/queries/epic_due_date.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/epic_due_date.query.graphql
@@ -1,9 +1,7 @@
 query epicDueDate($fullPath: ID!, $iid: ID) {
   workspace: group(fullPath: $fullPath) {
-    __typename
     id
     issuable: epic(iid: $iid) {
-      __typename
       id
       dueDate
       dueDateIsFixed
diff --git a/app/assets/javascripts/sidebar/queries/epic_participants.query.graphql b/app/assets/javascripts/sidebar/queries/epic_participants.query.graphql
index dada7ffc034..d665ca1e084 100644
--- a/app/assets/javascripts/sidebar/queries/epic_participants.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/epic_participants.query.graphql
@@ -3,10 +3,8 @@
 
 query epicParticipants($fullPath: ID!, $iid: ID) {
   workspace: group(fullPath: $fullPath) {
-    __typename
     id
     issuable: epic(iid: $iid) {
-      __typename
       id
       participants {
         nodes {
diff --git a/app/assets/javascripts/sidebar/queries/epic_reference.query.graphql b/app/assets/javascripts/sidebar/queries/epic_reference.query.graphql
index f35ca896ef8..76d570a0f16 100644
--- a/app/assets/javascripts/sidebar/queries/epic_reference.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/epic_reference.query.graphql
@@ -1,9 +1,7 @@
 query epicReference($fullPath: ID!, $iid: ID) {
   workspace: group(fullPath: $fullPath) {
-    __typename
     id
     issuable: epic(iid: $iid) {
-      __typename
       id
       reference(full: true)
     }
diff --git a/app/assets/javascripts/sidebar/queries/epic_start_date.query.graphql b/app/assets/javascripts/sidebar/queries/epic_start_date.query.graphql
index 85fc7de8d02..c85ede07fde 100644
--- a/app/assets/javascripts/sidebar/queries/epic_start_date.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/epic_start_date.query.graphql
@@ -1,9 +1,7 @@
 query epicStartDate($fullPath: ID!, $iid: ID) {
   workspace: group(fullPath: $fullPath) {
-    __typename
     id
     issuable: epic(iid: $iid) {
-      __typename
       id
       startDate
       startDateIsFixed
diff --git a/app/assets/javascripts/sidebar/queries/epic_subscribed.query.graphql b/app/assets/javascripts/sidebar/queries/epic_subscribed.query.graphql
index a8fe6b8ddc3..b1973075d48 100644
--- a/app/assets/javascripts/sidebar/queries/epic_subscribed.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/epic_subscribed.query.graphql
@@ -1,10 +1,8 @@
 query epicSubscribed($fullPath: ID!, $iid: ID) {
   workspace: group(fullPath: $fullPath) {
-    __typename
     id
     emailsDisabled
     issuable: epic(iid: $iid) {
-      __typename
       id
       subscribed
     }
diff --git a/app/assets/javascripts/sidebar/queries/epic_todo.query.graphql b/app/assets/javascripts/sidebar/queries/epic_todo.query.graphql
index b0ba724e727..3c035bcc6db 100644
--- a/app/assets/javascripts/sidebar/queries/epic_todo.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/epic_todo.query.graphql
@@ -1,9 +1,7 @@
 query epicTodos($fullPath: ID!, $iid: ID) {
   workspace: group(fullPath: $fullPath) {
-    __typename
     id
     issuable: epic(iid: $iid) {
-      __typename
       id
       currentUserTodos(state: pending) {
         nodes {
diff --git a/app/assets/javascripts/sidebar/queries/group_milestones.query.graphql b/app/assets/javascripts/sidebar/queries/group_milestones.query.graphql
index dceab61ed26..6b15fcda2e8 100644
--- a/app/assets/javascripts/sidebar/queries/group_milestones.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/group_milestones.query.graphql
@@ -2,7 +2,6 @@
 
 query groupMilestones($fullPath: ID!, $title: String, $state: MilestoneStateEnum) {
   workspace: group(fullPath: $fullPath) {
-    __typename
     id
     attributes: milestones(
       searchTitle: $title
diff --git a/app/assets/javascripts/sidebar/queries/issue_confidential.query.graphql b/app/assets/javascripts/sidebar/queries/issue_confidential.query.graphql
index e578cf3bda5..fcdc84c5a06 100644
--- a/app/assets/javascripts/sidebar/queries/issue_confidential.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/issue_confidential.query.graphql
@@ -1,9 +1,7 @@
 query issueConfidential($fullPath: ID!, $iid: String) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     issuable: issue(iid: $iid) {
-      __typename
       id
       confidential
     }
diff --git a/app/assets/javascripts/sidebar/queries/issue_due_date.query.graphql b/app/assets/javascripts/sidebar/queries/issue_due_date.query.graphql
index 48cbff252b3..4369104704a 100644
--- a/app/assets/javascripts/sidebar/queries/issue_due_date.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/issue_due_date.query.graphql
@@ -1,9 +1,7 @@
 query issueDueDate($fullPath: ID!, $iid: String) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     issuable: issue(iid: $iid) {
-      __typename
       id
       dueDate
     }
diff --git a/app/assets/javascripts/sidebar/queries/issue_reference.query.graphql b/app/assets/javascripts/sidebar/queries/issue_reference.query.graphql
index c3128d6d961..2c69cc04429 100644
--- a/app/assets/javascripts/sidebar/queries/issue_reference.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/issue_reference.query.graphql
@@ -1,9 +1,7 @@
 query issueReference($fullPath: ID!, $iid: String) {
   workspace: project(fullPath: $fullPath) {
     id
-    __typename
     issuable: issue(iid: $iid) {
-      __typename
       id
       reference(full: true)
     }
diff --git a/app/assets/javascripts/sidebar/queries/issue_subscribed.query.graphql b/app/assets/javascripts/sidebar/queries/issue_subscribed.query.graphql
index e2722fc86a4..419036ee15d 100644
--- a/app/assets/javascripts/sidebar/queries/issue_subscribed.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/issue_subscribed.query.graphql
@@ -1,9 +1,7 @@
 query issueSubscribed($fullPath: ID!, $iid: String) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     issuable: issue(iid: $iid) {
-      __typename
       id
       subscribed
       emailsDisabled
diff --git a/app/assets/javascripts/sidebar/queries/issue_time_tracking.query.graphql b/app/assets/javascripts/sidebar/queries/issue_time_tracking.query.graphql
index 059361dd370..f4d0e9b5deb 100644
--- a/app/assets/javascripts/sidebar/queries/issue_time_tracking.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/issue_time_tracking.query.graphql
@@ -1,9 +1,7 @@
 query issueTimeTracking($fullPath: ID!, $iid: String) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     issuable: issue(iid: $iid) {
-      __typename
       id
       humanTimeEstimate
       humanTotalTimeSpent
diff --git a/app/assets/javascripts/sidebar/queries/issue_todo.query.graphql b/app/assets/javascripts/sidebar/queries/issue_todo.query.graphql
index 5cd5d81c439..3211ded66ae 100644
--- a/app/assets/javascripts/sidebar/queries/issue_todo.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/issue_todo.query.graphql
@@ -1,9 +1,7 @@
 query issueTodos($fullPath: ID!, $iid: String!) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     issuable: issue(iid: $iid) {
-      __typename
       id
       currentUserTodos(state: pending) {
         nodes {
diff --git a/app/assets/javascripts/sidebar/queries/merge_request_milestone.query.graphql b/app/assets/javascripts/sidebar/queries/merge_request_milestone.query.graphql
index b0a16677cf2..26bf901babf 100644
--- a/app/assets/javascripts/sidebar/queries/merge_request_milestone.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/merge_request_milestone.query.graphql
@@ -2,10 +2,8 @@
 
 query mergeRequestMilestone($fullPath: ID!, $iid: String!) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     issuable: mergeRequest(iid: $iid) {
-      __typename
       id
       attribute: milestone {
         ...MilestoneFragment
diff --git a/app/assets/javascripts/sidebar/queries/merge_request_reference.query.graphql b/app/assets/javascripts/sidebar/queries/merge_request_reference.query.graphql
index 7c78f812b67..e42e50ba861 100644
--- a/app/assets/javascripts/sidebar/queries/merge_request_reference.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/merge_request_reference.query.graphql
@@ -1,9 +1,7 @@
 query mergeRequestReference($fullPath: ID!, $iid: String!) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     issuable: mergeRequest(iid: $iid) {
-      __typename
       id
       reference(full: true)
     }
diff --git a/app/assets/javascripts/sidebar/queries/merge_request_subscribed.query.graphql b/app/assets/javascripts/sidebar/queries/merge_request_subscribed.query.graphql
index d5e27ca7b69..d29f4d512c5 100644
--- a/app/assets/javascripts/sidebar/queries/merge_request_subscribed.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/merge_request_subscribed.query.graphql
@@ -1,9 +1,7 @@
 query mergeRequestSubscribed($fullPath: ID!, $iid: String!) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     issuable: mergeRequest(iid: $iid) {
-      __typename
       id
       subscribed
     }
diff --git a/app/assets/javascripts/sidebar/queries/merge_request_time_tracking.query.graphql b/app/assets/javascripts/sidebar/queries/merge_request_time_tracking.query.graphql
index d480ff3d5ba..5d05cb2f34c 100644
--- a/app/assets/javascripts/sidebar/queries/merge_request_time_tracking.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/merge_request_time_tracking.query.graphql
@@ -1,9 +1,7 @@
 query mergeRequestTimeTracking($fullPath: ID!, $iid: String!) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     issuable: mergeRequest(iid: $iid) {
-      __typename
       id
       humanTimeEstimate
       humanTotalTimeSpent
diff --git a/app/assets/javascripts/sidebar/queries/merge_request_todo.query.graphql b/app/assets/javascripts/sidebar/queries/merge_request_todo.query.graphql
index 65b9ef45260..906bfcdf9cd 100644
--- a/app/assets/javascripts/sidebar/queries/merge_request_todo.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/merge_request_todo.query.graphql
@@ -1,9 +1,7 @@
 query mergeRequestTodos($fullPath: ID!, $iid: String!) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     issuable: mergeRequest(iid: $iid) {
-      __typename
       id
       currentUserTodos(state: pending) {
         nodes {
diff --git a/app/assets/javascripts/sidebar/queries/project_issue_milestone.mutation.graphql b/app/assets/javascripts/sidebar/queries/project_issue_milestone.mutation.graphql
index 721a71bef63..507221946fa 100644
--- a/app/assets/javascripts/sidebar/queries/project_issue_milestone.mutation.graphql
+++ b/app/assets/javascripts/sidebar/queries/project_issue_milestone.mutation.graphql
@@ -2,10 +2,8 @@ mutation projectIssueMilestoneMutation($fullPath: ID!, $iid: String!, $attribute
   issuableSetAttribute: updateIssue(
     input: { projectPath: $fullPath, iid: $iid, milestoneId: $attributeId }
   ) {
-    __typename
     errors
     issuable: issue {
-      __typename
       id
       attribute: milestone {
         title
diff --git a/app/assets/javascripts/sidebar/queries/project_issue_milestone.query.graphql b/app/assets/javascripts/sidebar/queries/project_issue_milestone.query.graphql
index c7f3adc9aca..bcb055d4f0f 100644
--- a/app/assets/javascripts/sidebar/queries/project_issue_milestone.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/project_issue_milestone.query.graphql
@@ -2,10 +2,8 @@
 
 query projectIssueMilestone($fullPath: ID!, $iid: String!) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     issuable: issue(iid: $iid) {
-      __typename
       id
       attribute: milestone {
         ...MilestoneFragment
diff --git a/app/assets/javascripts/sidebar/queries/project_milestones.query.graphql b/app/assets/javascripts/sidebar/queries/project_milestones.query.graphql
index d9eab18628d..b75c2138525 100644
--- a/app/assets/javascripts/sidebar/queries/project_milestones.query.graphql
+++ b/app/assets/javascripts/sidebar/queries/project_milestones.query.graphql
@@ -2,7 +2,6 @@
 
 query projectMilestones($fullPath: ID!, $title: String, $state: MilestoneStateEnum) {
   workspace: project(fullPath: $fullPath) {
-    __typename
     id
     attributes: milestones(
       searchTitle: $title
diff --git a/app/assets/javascripts/sidebar/queries/remove_attention_request.mutation.graphql b/app/assets/javascripts/sidebar/queries/remove_attention_request.mutation.graphql
deleted file mode 100644
index d9b9c04fd63..00000000000
--- a/app/assets/javascripts/sidebar/queries/remove_attention_request.mutation.graphql
+++ /dev/null
@@ -1,7 +0,0 @@
-mutation mergeRequestRemoveAttentionRequest($projectPath: ID!, $iid: String!, $userId: UserID!) {
-  mergeRequestRemoveAttentionRequest(
-    input: { projectPath: $projectPath, iid: $iid, userId: $userId }
-  ) {
-    errors
-  }
-}
diff --git a/app/assets/javascripts/sidebar/queries/request_attention.mutation.graphql b/app/assets/javascripts/sidebar/queries/request_attention.mutation.graphql
deleted file mode 100644
index 99a86e4fe5c..00000000000
--- a/app/assets/javascripts/sidebar/queries/request_attention.mutation.graphql
+++ /dev/null
@@ -1,5 +0,0 @@
-mutation mergeRequestRequestAttention($projectPath: ID!, $iid: String!, $userId: UserID!) {
-  mergeRequestRequestAttention(input: { projectPath: $projectPath, iid: $iid, userId: $userId }) {
-    errors
-  }
-}
diff --git a/app/assets/javascripts/sidebar/queries/todo_create.mutation.graphql b/app/assets/javascripts/sidebar/queries/todo_create.mutation.graphql
index 4675db9153e..51d461989e4 100644
--- a/app/assets/javascripts/sidebar/queries/todo_create.mutation.graphql
+++ b/app/assets/javascripts/sidebar/queries/todo_create.mutation.graphql
@@ -1,6 +1,5 @@
 mutation issuableTodoCreate($input: TodoCreateInput!) {
   todoMutation: todoCreate(input: $input) {
-    __typename
     todo {
       id
     }
diff --git a/app/assets/javascripts/sidebar/queries/todo_mark_done.mutation.graphql b/app/assets/javascripts/sidebar/queries/todo_mark_done.mutation.graphql
index 8253e5e82bc..4a91147c246 100644
--- a/app/assets/javascripts/sidebar/queries/todo_mark_done.mutation.graphql
+++ b/app/assets/javascripts/sidebar/queries/todo_mark_done.mutation.graphql
@@ -1,6 +1,5 @@
 mutation issuableTodoMarkDone($input: TodoMarkDoneInput!) {
   todoMutation: todoMarkDone(input: $input) {
-    __typename
     todo {
       id
     }
diff --git a/app/assets/javascripts/sidebar/queries/update_merge_request_milestone.mutation.graphql b/app/assets/javascripts/sidebar/queries/update_merge_request_milestone.mutation.graphql
index 938953ccfb2..2714d815bcd 100644
--- a/app/assets/javascripts/sidebar/queries/update_merge_request_milestone.mutation.graphql
+++ b/app/assets/javascripts/sidebar/queries/update_merge_request_milestone.mutation.graphql
@@ -2,10 +2,8 @@ mutation mergeRequestSetMilestone($fullPath: ID!, $iid: String!, $attributeId: M
   issuableSetAttribute: mergeRequestSetMilestone(
     input: { projectPath: $fullPath, iid: $iid, milestoneId: $attributeId }
   ) {
-    __typename
     errors
     issuable: mergeRequest {
-      __typename
       id
       attribute: milestone {
         title
diff --git a/app/assets/javascripts/sidebar/services/sidebar_service.js b/app/assets/javascripts/sidebar/services/sidebar_service.js
index 05268a5c89c..beacdeb559c 100644
--- a/app/assets/javascripts/sidebar/services/sidebar_service.js
+++ b/app/assets/javascripts/sidebar/services/sidebar_service.js
@@ -5,8 +5,6 @@ import createGqClient, { fetchPolicies } from '~/lib/graphql';
 import axios from '~/lib/utils/axios_utils';
 import reviewerRereviewMutation from '../queries/reviewer_rereview.mutation.graphql';
 import sidebarDetailsMRQuery from '../queries/sidebar_details_mr.query.graphql';
-import requestAttentionMutation from '../queries/request_attention.mutation.graphql';
-import removeAttentionRequestMutation from '../queries/remove_attention_request.mutation.graphql';
 
 const queries = {
   merge_request: sidebarDetailsMRQuery,
@@ -93,25 +91,4 @@ export default class SidebarService {
       },
     });
   }
-
-  requestAttention(userId) {
-    return gqClient.mutate({
-      mutation: requestAttentionMutation,
-      variables: {
-        userId: convertToGraphQLId(TYPE_USER, `${userId}`),
-        projectPath: this.fullPath,
-        iid: this.iid.toString(),
-      },
-    });
-  }
-  removeAttentionRequest(userId) {
-    return gqClient.mutate({
-      mutation: removeAttentionRequestMutation,
-      variables: {
-        userId: convertToGraphQLId(TYPE_USER, `${userId}`),
-        projectPath: this.fullPath,
-        iid: this.iid.toString(),
-      },
-    });
-  }
 }
diff --git a/app/assets/javascripts/sidebar/sidebar_bundle.js b/app/assets/javascripts/sidebar/sidebar_bundle.js
index 74ab65e4e04..1be670f7590 100644
--- a/app/assets/javascripts/sidebar/sidebar_bundle.js
+++ b/app/assets/javascripts/sidebar/sidebar_bundle.js
@@ -3,17 +3,7 @@ import Mediator from './sidebar_mediator';
 
 export default (store) => {
   const mediator = new Mediator(getSidebarOptions());
-  mediator
-    .fetch()
-    .then(() => {
-      if (window.gon?.features?.mrAttentionRequests) {
-        return import('~/attention_requests');
-      }
-
-      return null;
-    })
-    .then((module) => module?.initSideNavPopover())
-    .catch(() => {});
+  mediator.fetch();
 
   mountSidebar(mediator, store);
 };
diff --git a/app/assets/javascripts/sidebar/sidebar_mediator.js b/app/assets/javascripts/sidebar/sidebar_mediator.js
index 4df00903ab6..f7c93b6903c 100644
--- a/app/assets/javascripts/sidebar/sidebar_mediator.js
+++ b/app/assets/javascripts/sidebar/sidebar_mediator.js
@@ -1,8 +1,7 @@
 import Store from '~/sidebar/stores/sidebar_store';
 import createFlash from '~/flash';
-import { __, sprintf } from '~/locale';
+import { __ } from '~/locale';
 import toast from '~/vue_shared/plugins/global_toast';
-import { refreshUserMergeRequestCounts } from '~/commons/nav/user_merge_requests';
 import { visitUrl } from '../lib/utils/url_utility';
 import Service from './services/sidebar_service';
 
@@ -42,7 +41,6 @@ export default class SidebarMediator {
     const data = { assignee_ids: assignees };
 
     try {
-      const { currentUserHasAttention } = this.store;
       const res = await this.service.update(field, data);
 
       this.store.overwrite('assignees', res.data.assignees);
@@ -51,10 +49,6 @@ export default class SidebarMediator {
         this.store.overwrite('reviewers', res.data.reviewers);
       }
 
-      if (currentUserHasAttention && this.store.isAddingAssignee) {
-        toast(__('Assigned user(s). Your attention request was removed.'));
-      }
-
       return Promise.resolve(res);
     } catch (e) {
       return Promise.reject(e);
@@ -70,16 +64,11 @@ export default class SidebarMediator {
     const data = { reviewer_ids: reviewers };
 
     try {
-      const { currentUserHasAttention } = this.store;
       const res = await this.service.update(field, data);
 
       this.store.overwrite('reviewers', res.data.reviewers);
       this.store.overwrite('assignees', res.data.assignees);
 
-      if (currentUserHasAttention && this.store.isAddingAssignee) {
-        toast(__('Requested review. Your attention request was removed.'));
-      }
-
       return Promise.resolve(res);
     } catch (e) {
       return Promise.reject();
@@ -97,80 +86,6 @@ export default class SidebarMediator {
       .catch(() => callback(userId, false));
   }
 
-  removeCurrentUserAttentionRequested() {
-    const currentUserId = gon.current_user_id;
-
-    const currentUserReviewer = this.store.findReviewer({ id: currentUserId });
-    const currentUserAssignee = this.store.findAssignee({ id: currentUserId });
-
-    if (currentUserReviewer?.attention_requested || currentUserAssignee?.attention_requested) {
-      // Update current users attention_requested state
-      this.store.updateReviewer(currentUserId, 'attention_requested');
-      this.store.updateAssignee(currentUserId, 'attention_requested');
-    }
-  }
-
-  async toggleAttentionRequested(type, { user, callback, direction }) {
-    const mutations = {
-      add: (id) => this.service.requestAttention(id),
-      remove: (id) => this.service.removeAttentionRequest(id),
-    };
-
-    try {
-      const isReviewer = type === 'reviewer';
-      const reviewerOrAssignee = isReviewer
-        ? this.store.findReviewer(user)
-        : this.store.findAssignee(user);
-
-      await mutations[direction]?.(user.id);
-
-      if (reviewerOrAssignee.attention_requested) {
-        toast(
-          sprintf(__('Removed attention request from @%{username}'), {
-            username: user.username,
-          }),
-        );
-      } else {
-        const currentUserId = gon.current_user_id;
-        const { currentUserHasAttention } = this.store;
-
-        if (currentUserId !== user.id) {
-          this.removeCurrentUserAttentionRequested();
-        }
-
-        toast(
-          currentUserHasAttention && currentUserId !== user.id
-            ? sprintf(
-                __(
-                  'Requested attention from @%{username}. Your own attention request was removed.',
-                ),
-                { username: user.username },
-              )
-            : sprintf(__('Requested attention from @%{username}'), { username: user.username }),
-        );
-      }
-
-      this.store.updateReviewer(user.id, 'attention_requested');
-      this.store.updateAssignee(user.id, 'attention_requested');
-
-      refreshUserMergeRequestCounts();
-      callback();
-    } catch (error) {
-      callback();
-      createFlash({
-        message: sprintf(__('Updating the attention request for %{username} failed.'), {
-          username: user.username,
-        }),
-        error,
-        captureError: true,
-        actionConfig: {
-          title: __('Try again'),
-          clickHandler: () => this.toggleAttentionRequired(type, { user, callback, direction }),
-        },
-      });
-    }
-  }
-
   setMoveToProjectId(projectId) {
     this.store.setMoveToProjectId(projectId);
   }
diff --git a/app/assets/javascripts/sidebar/stores/sidebar_store.js b/app/assets/javascripts/sidebar/stores/sidebar_store.js
index 971e2a15c68..e2581a8f30e 100644
--- a/app/assets/javascripts/sidebar/stores/sidebar_store.js
+++ b/app/assets/javascripts/sidebar/stores/sidebar_store.js
@@ -19,9 +19,7 @@ export default class SidebarStore {
     this.humanTimeSpent = '';
     this.timeTrackingLimitToHours = timeTrackingLimitToHours;
     this.assignees = [];
-    this.addingAssignees = [];
     this.reviewers = [];
-    this.addingReviewers = [];
     this.isFetching = {
       assignees: true,
       reviewers: true,
@@ -77,20 +75,12 @@ export default class SidebarStore {
     if (!this.findAssignee(assignee)) {
       this.changing = true;
       this.assignees.push(assignee);
-
-      if (assignee.id !== this.currentUser.id) {
-        this.addingAssignees.push(assignee.id);
-      }
     }
   }
 
   addReviewer(reviewer) {
     if (!this.findReviewer(reviewer)) {
       this.reviewers.push(reviewer);
-
-      if (reviewer.id !== this.currentUser.id) {
-        this.addingReviewers.push(reviewer.id);
-      }
     }
   }
 
@@ -126,14 +116,12 @@ export default class SidebarStore {
     if (assignee) {
       this.changing = true;
       this.assignees = this.assignees.filter(({ id }) => id !== assignee.id);
-      this.addingAssignees = this.addingAssignees.filter(({ id }) => id !== assignee.id);
     }
   }
 
   removeReviewer(reviewer) {
     if (reviewer) {
       this.reviewers = this.reviewers.filter(({ id }) => id !== reviewer.id);
-      this.addingReviewers = this.addingReviewers.filter(({ id }) => id !== reviewer.id);
     }
   }
 
@@ -161,26 +149,4 @@ export default class SidebarStore {
   setMoveToProjectId(moveToProjectId) {
     this.moveToProjectId = moveToProjectId;
   }
-
-  get currentUserHasAttention() {
-    if (!window.gon?.features?.mrAttentionRequests || !this.isMergeRequest) return false;
-
-    const currentUserId = this.currentUser.id;
-    const currentUserReviewer = this.findReviewer({ id: currentUserId });
-    const currentUserAssignee = this.findAssignee({ id: currentUserId });
-
-    return currentUserReviewer?.attention_requested || currentUserAssignee?.attention_requested;
-  }
-
-  get isAddingAssignee() {
-    return this.addingAssignees.length > 0;
-  }
-
-  get isAddingReviewer() {
-    return this.addingReviewers.length > 0;
-  }
-
-  get isMergeRequest() {
-    return this.issuableType === 'merge_request';
-  }
 }