Merge branch 'revert-75f6e91f' into 'master'

app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions.vue

 <script>
 import Store from '../../stores/sidebar_store';
+import eventHub from '../../event_hub';
 import Flash from '../../../flash';
 import { __ } from '../../../locale';
 import subscriptions from './subscriptions.vue';
@@ -19,6 +20,12 @@ export default {
       store: new Store(),
     };
   },
+  created() {
+    eventHub.$on('toggleSubscription', this.onToggleSubscription);
+  },
+  beforeDestroy() {
+    eventHub.$off('toggleSubscription', this.onToggleSubscription);
+  },
   methods: {
     onToggleSubscription() {
       this.mediator.toggleSubscription()
@@ -35,7 +42,6 @@ export default {
     <subscriptions
       :loading="store.isFetching.subscriptions"
       :subscribed="store.subscribed"
-      @toggleSubscription="onToggleSubscription"
     />
   </div>
 </template>

app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue

@@ -3,6 +3,7 @@
   import icon from '~/vue_shared/components/icon.vue';
   import toggleButton from '~/vue_shared/components/toggle_button.vue';
   import tooltip from '~/vue_shared/directives/tooltip';
+  import eventHub from '../../event_hub';
 
   const ICON_ON = 'notifications';
   const ICON_OFF = 'notifications-off';
@@ -47,7 +48,7 @@
     },
     methods: {
       toggleSubscription() {
-        this.$emit('toggleSubscription', this.id);
+        eventHub.$emit('toggleSubscription', this.id);
       },
     },
   };

spec/javascripts/sidebar/sidebar_subscriptions_spec.js

@@ -3,6 +3,7 @@ import sidebarSubscriptions from '~/sidebar/components/subscriptions/sidebar_sub
 import SidebarMediator from '~/sidebar/sidebar_mediator';
 import SidebarService from '~/sidebar/services/sidebar_service';
 import SidebarStore from '~/sidebar/stores/sidebar_store';
+import eventHub from '~/sidebar/event_hub';
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
 import Mock from './mock_data';
 
@@ -31,7 +32,7 @@ describe('Sidebar Subscriptions', function () {
       mediator,
     });
 
-    vm.onToggleSubscription();
+    eventHub.$emit('toggleSubscription');
 
     expect(mediator.toggleSubscription).toHaveBeenCalled();
   });

spec/javascripts/sidebar/subscriptions_spec.js

@@ -39,12 +39,4 @@ describe('Subscriptions', function () {
 
     expect(vm.$refs.toggleButton.$el.querySelector('.project-feature-toggle')).toHaveClass('is-checked');
   });
-
-  it('toggleSubscription method emits `toggleSubscription` event on component', () => {
-    vm = mountComponent(Subscriptions, { subscribed: true });
-    spyOn(vm, '$emit');
-
-    vm.toggleSubscription();
-    expect(vm.$emit).toHaveBeenCalledWith('toggleSubscription', jasmine.any(Object));
-  });
 });