fix: Clear search input which navigating to other tab/page (#2061)

app/javascript/dashboard/components/ChatList.vue

@@ -116,7 +116,7 @@ export default {
       return this.$store.getters['inboxes/getInbox'](this.activeInbox);
     },
     currentPage() {
-      return this.$store.getters['conversationPage/getCurrentPage'](
+      return this.$store.getters['conversationPage/getCurrentPageFilter'](
         this.activeAssigneeTab
       );
     },
@@ -199,6 +199,7 @@ export default {
     },
     updateAssigneeTab(selectedTab) {
       if (this.activeAssigneeTab !== selectedTab) {
+        bus.$emit('clearSearchInput');
         this.activeAssigneeTab = selectedTab;
         if (!this.currentPage) {
           this.fetchConversations();

app/javascript/dashboard/routes/dashboard/conversation/search/PopOverSearch.vue

@@ -82,6 +82,7 @@ export default {
     ...mapGetters({
       conversations: 'conversationSearch/getConversations',
       uiFlags: 'conversationSearch/getUIFlags',
+      currentPage: 'conversationPage/getCurrentPage',
     }),
     resultsCount() {
       return this.conversations.length;
@@ -111,10 +112,16 @@ export default {
         this.$store.dispatch('conversationSearch/get', { q: newValue });
       }, 1000);
     },
+    currentPage() {
+      this.clearSearchTerm();
+    },
   },
 
   mounted() {
     this.$store.dispatch('conversationSearch/get', { q: '' });
+    bus.$on('clearSearchInput', () => {
+      this.clearSearchTerm();
+    });
   },
 
   methods: {
@@ -124,6 +131,9 @@ export default {
     closeSearch() {
       this.showSearchBox = false;
     },
+    clearSearchTerm() {
+      this.searchTerm = '';
+    },
   },
 };
 </script>

app/javascript/dashboard/store/modules/conversationPage.js

@@ -18,9 +18,12 @@ export const getters = {
   getHasEndReached: $state => filter => {
     return $state.hasEndReached[filter];
   },
-  getCurrentPage: $state => filter => {
+  getCurrentPageFilter: $state => filter => {
     return $state.currentPage[filter];
   },
+  getCurrentPage: $state => {
+    return $state.currentPage;
+  },
 };
 
 export const actions = {

app/javascript/dashboard/store/modules/specs/conversationPage/getters.spec.js

@@ -9,12 +9,25 @@ describe('#getters', () => {
         all: 3,
       },
     };
-    expect(getters.getCurrentPage(state)('me')).toEqual(1);
+    expect(getters.getCurrentPage(state)).toHaveProperty('me');
-    expect(getters.getCurrentPage(state)('unassigned')).toEqual(2);
+    expect(getters.getCurrentPage(state)).toHaveProperty('unassigned');
-    expect(getters.getCurrentPage(state)('all')).toEqual(3);
+    expect(getters.getCurrentPage(state)).toHaveProperty('all');
   });
 
-  it('getCurrentPage', () => {
+  it('getCurrentPageFilter', () => {
+    const state = {
+      currentPage: {
+        me: 1,
+        unassigned: 2,
+        all: 3,
+      },
+    };
+    expect(getters.getCurrentPageFilter(state)('me')).toEqual(1);
+    expect(getters.getCurrentPageFilter(state)('unassigned')).toEqual(2);
+    expect(getters.getCurrentPageFilter(state)('all')).toEqual(3);
+  });
+
+  it('getHasEndReached', () => {
     const state = {
       hasEndReached: {
         me: false,