1 files changed, 8 insertions, 7 deletions
diff --git a/app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions_widget.vue b/app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions_widget.vue
index e5bee4df9b8..99e7c825b72 100644
--- a/app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions_widget.vue
+++ b/app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions_widget.vue
@@ -1,6 +1,6 @@
 <script>
-import { GlIcon, GlLoadingIcon, GlToggle, GlTooltipDirective } from '@gitlab/ui';
-import createFlash from '~/flash';
+import { GlDropdownForm, GlIcon, GlLoadingIcon, GlToggle, GlTooltipDirective } from '@gitlab/ui';
+import { createAlert } from '~/flash';
 import { IssuableType } from '~/issues/constants';
 import { isLoggedIn } from '~/lib/utils/common_utils';
 import { __, sprintf } from '~/locale';
@@ -22,6 +22,7 @@ export default {
     GlTooltip: GlTooltipDirective,
   },
   components: {
+    GlDropdownForm,
     GlIcon,
     GlLoadingIcon,
     GlToggle,
@@ -73,7 +74,7 @@ export default {
         this.$emit('subscribedUpdated', data.workspace?.issuable?.subscribed);
       },
       error() {
-        createFlash({
+        createAlert({
           message: sprintf(
             __('Something went wrong while setting %{issuableType} notifications.'),
             {
@@ -137,7 +138,7 @@ export default {
             },
           }) => {
             if (errors.length) {
-              createFlash({
+              createAlert({
                 message: errors[0],
               });
             }
@@ -148,7 +149,7 @@ export default {
           },
         )
         .catch(() => {
-          createFlash({
+          createAlert({
             message: sprintf(
               __('Something went wrong while setting %{issuableType} notifications.'),
               {
@@ -181,7 +182,7 @@ export default {
 </script>
 
 <template>
-  <div v-if="isMergeRequest" class="gl-new-dropdown-item">
+  <gl-dropdown-form v-if="isMergeRequest" class="gl-new-dropdown-item">
     <div class="gl-px-5 gl-pb-2 gl-pt-1">
       <gl-toggle
         :value="subscribed"
@@ -192,7 +193,7 @@ export default {
         @change="toggleSubscribed"
       />
     </div>
-  </div>
+  </gl-dropdown-form>
   <sidebar-editable-item
     v-else
     ref="editable"