diff --git a/app/javascript/dashboard/components/ChatList.vue b/app/javascript/dashboard/components/ChatList.vue index dc18ddd66..8a44acecb 100644 --- a/app/javascript/dashboard/components/ChatList.vue +++ b/app/javascript/dashboard/components/ChatList.vue @@ -8,6 +8,7 @@ import { computed, watch, onMounted, + onUnmounted, defineEmits, } from 'vue'; import { useStore } from 'vuex'; @@ -42,7 +43,7 @@ import { useSnakeCase, } from 'dashboard/composables/useTransformKeys'; import { useEmitter } from 'dashboard/composables/emitter'; -import { useEventListener } from '@vueuse/core'; +import { useEventListener, useScrollLock } from '@vueuse/core'; import { emitter } from 'shared/helpers/mitt'; @@ -85,6 +86,12 @@ const store = useStore(); const conversationListRef = ref(null); const conversationDynamicScroller = ref(null); +const conversationListScrollableElement = computed( + () => conversationDynamicScroller.value?.$el +); +const conversationListScrollLock = useScrollLock( + conversationListScrollableElement +); const activeAssigneeTab = ref(wootConstants.ASSIGNEE_TYPE.ME); const activeStatus = ref(wootConstants.STATUS_TYPE.OPEN); @@ -738,6 +745,7 @@ function allSelectedConversationsStatus(status) { function onContextMenuToggle(state) { isContextMenuOpen.value = state; + conversationListScrollLock.value = state; } function toggleSelectAll(check) { @@ -761,6 +769,10 @@ onMounted(() => { } }); +onUnmounted(() => { + conversationListScrollLock.value = false; +}); + provide('selectConversation', selectConversation); provide('deSelectConversation', deSelectConversation); provide('assignAgent', onAssignAgent);