feat: Ability to unmute muted conversations (#1319)

app/javascript/dashboard/components/widgets/conversation/MoreActions.vue

@@ -22,6 +22,15 @@
       >
         <span>{{ $t('CONTACT_PANEL.MUTE_CONTACT') }}</span>
       </button>
+
+      <button
+        v-else
+        class="button small clear row alert small-6 action--button"
+        @click="unmute"
+      >
+        <span>{{ $t('CONTACT_PANEL.UNMUTE_CONTACT') }}</span>
+      </button>
+
       <button
         class="button small clear row small-6 action--button"
         @click="toggleEmailActionsModal"
@@ -67,6 +76,11 @@ export default {
       this.showAlert(this.$t('CONTACT_PANEL.MUTED_SUCCESS'));
       this.toggleConversationActions();
     },
+    unmute() {
+      this.$store.dispatch('unmuteConversation', this.currentChat.id);
+      this.showAlert(this.$t('CONTACT_PANEL.UNMUTED_SUCCESS'));
+      this.toggleConversationActions();
+    },
     toggleEmailActionsModal() {
       this.showEmailActionsModal = !this.showEmailActionsModal;
       this.hideConversationActions();
@@ -129,6 +143,7 @@ export default {
   display: flex;
   align-items: center;
   width: 100%;
+  white-space: nowrap;
   padding: var(--space-small) var(--space-smaller);
   font-size: var(--font-size-small);
 

app/javascript/dashboard/components/widgets/conversation/specs/MoreActions.spec.js

@@ -0,0 +1,130 @@
+import { createLocalVue, mount } from '@vue/test-utils';
+import Vuex from 'vuex';
+import VueI18n from 'vue-i18n';
+
+import Button from 'dashboard/components/buttons/Button';
+import i18n from 'dashboard/i18n';
+
+import MoreActions from '../MoreActions';
+
+const localVue = createLocalVue();
+localVue.use(Vuex);
+localVue.use(VueI18n);
+localVue.locale('en', i18n.en);
+localVue.component('woot-button', Button);
+
+describe('MoveActions', () => {
+  let currentChat = { id: 8, muted: false };
+  let state = null;
+  let muteConversation = null;
+  let unmuteConversation = null;
+  let modules = null;
+  let getters = null;
+  let store = null;
+  let moreActions = null;
+
+  beforeEach(() => {
+    window.bus = {
+      $emit: jest.fn(),
+    };
+
+    state = {
+      authenticated: true,
+      currentChat,
+    };
+
+    muteConversation = jest.fn(() => Promise.resolve());
+    unmuteConversation = jest.fn(() => Promise.resolve());
+
+    modules = {
+      conversations: {
+        actions: {
+          muteConversation,
+          unmuteConversation,
+        },
+      },
+    };
+
+    getters = {
+      getSelectedChat: () => currentChat,
+    };
+
+    store = new Vuex.Store({
+      state,
+      modules,
+      getters,
+    });
+
+    moreActions = mount(MoreActions, { store, localVue });
+  });
+
+  it('opens the menu when user clicks "more"', async () => {
+    expect(moreActions.find('.dropdown-pane').exists()).toBe(false);
+
+    await moreActions.find('.more--button').trigger('click');
+
+    expect(moreActions.find('.dropdown-pane').exists()).toBe(true);
+  });
+
+  describe('muting discussion', () => {
+    it('triggers "muteConversation"', async () => {
+      await moreActions.find('.more--button').trigger('click');
+
+      await moreActions
+        .find('.dropdown-pane button:first-child')
+        .trigger('click');
+
+      expect(muteConversation).toBeCalledWith(
+        expect.any(Object),
+        currentChat.id,
+        undefined
+      );
+    });
+
+    it('shows alert', async () => {
+      await moreActions.find('.more--button').trigger('click');
+
+      await moreActions
+        .find('.dropdown-pane button:first-child')
+        .trigger('click');
+
+      expect(window.bus.$emit).toBeCalledWith(
+        'newToastMessage',
+        'This conversation is muted for 6 hours'
+      );
+    });
+  });
+
+  describe('unmuting discussion', () => {
+    beforeEach(() => {
+      currentChat.muted = true;
+    });
+
+    it('triggers "unmuteConversation"', async () => {
+      await moreActions.find('.more--button').trigger('click');
+
+      await moreActions
+        .find('.dropdown-pane button:first-child')
+        .trigger('click');
+
+      expect(unmuteConversation).toBeCalledWith(
+        expect.any(Object),
+        currentChat.id,
+        undefined
+      );
+    });
+
+    it('shows alert', async () => {
+      await moreActions.find('.more--button').trigger('click');
+
+      await moreActions
+        .find('.dropdown-pane button:first-child')
+        .trigger('click');
+
+      expect(window.bus.$emit).toBeCalledWith(
+        'newToastMessage',
+        'This conversation is unmuted'
+      );
+    });
+  });
+});