Emit `toggleSubscription` event on component instead of eventHub

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

@@ -3,7 +3,6 @@
   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';
@@ -48,7 +47,7 @@
     },
     methods: {
       toggleSubscription() {
-        eventHub.$emit('toggleSubscription', this.id);
+        this.$emit('toggleSubscription', this.id);
       },
     },
   };

spec/javascripts/sidebar/subscriptions_spec.js

@@ -39,4 +39,12 @@ 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));
+  });
 });