fix: If desktop view is false then the view not getting updated (#6214)

* fix: Desktop view is false then the view not getting updated

* chore: Handle sidebar in small screen

* fix: Scroll issue in touch screens

app/javascript/dashboard/assets/scss/widgets/_conversation-view.scss

@@ -81,8 +81,12 @@
   }
 
   .conversations-list {
-    @include scroll-on-hover;
+    overflow-y: auto;
     flex: 1 1;
+
+    @include breakpoint(large up) {
+      @include scroll-on-hover;
+    }
   }
 
   .chat-list__top {

app/javascript/dashboard/constants.js

@@ -23,6 +23,6 @@ export default {
   },
   DOCS_URL: '//www.chatwoot.com/docs/product/',
   TESTIMONIAL_URL: 'https://testimonials.cdn.chatwoot.com/content.json',
-  SMALL_SCREEN_BREAKPOINT: 992,
+  SMALL_SCREEN_BREAKPOINT: 1024,
 };
 export const DEFAULT_REDIRECT_URL = '/app/';

app/javascript/dashboard/routes/dashboard/Dashboard.vue

@@ -62,13 +62,12 @@ export default {
   mixins: [uiSettingsMixin],
   data() {
     return {
-      isOnDesktop: true,
       showAccountModal: false,
       showCreateAccountModal: false,
       showAddLabelModal: false,
       showShortcutModal: false,
       isNotificationPanel: false,
-      isDesktopView: false,
+      displayLayoutType: '',
     };
   },
   computed: {
@@ -85,14 +84,25 @@ export default {
       } = this.uiSettings;
       return conversationDisplayType;
     },
+    previouslyUsedSidebarView() {
+      const {
+        previously_used_sidebar_view: showSecondarySidebar,
+      } = this.uiSettings;
+      return showSecondarySidebar;
+    },
   },
   watch: {
-    isDesktopView() {
+    displayLayoutType() {
       const { LAYOUT_TYPES } = wootConstants;
       this.updateUISettings({
-        conversation_display_type: !this.isDesktopView
-          ? LAYOUT_TYPES.EXPANDED
-          : this.previouslyUsedDisplayType,
+        conversation_display_type:
+          this.displayLayoutType === LAYOUT_TYPES.EXPANDED
+            ? LAYOUT_TYPES.EXPANDED
+            : this.previouslyUsedDisplayType,
+        show_secondary_sidebar:
+          this.displayLayoutType === LAYOUT_TYPES.EXPANDED
+            ? false
+            : this.previouslyUsedSidebarView,
       });
     },
   },
@@ -108,7 +118,7 @@ export default {
 
   methods: {
     handleResize() {
-      const { SMALL_SCREEN_BREAKPOINT } = wootConstants;
+      const { SMALL_SCREEN_BREAKPOINT, LAYOUT_TYPES } = wootConstants;
       let throttled = false;
       const delay = 150;
 
@@ -120,15 +130,16 @@ export default {
       setTimeout(() => {
         throttled = false;
         if (window.innerWidth <= SMALL_SCREEN_BREAKPOINT) {
-          this.isDesktopView = false;
+          this.displayLayoutType = LAYOUT_TYPES.EXPANDED;
         } else {
-          this.isDesktopView = true;
+          this.displayLayoutType = LAYOUT_TYPES.CONDENSED;
         }
       }, delay);
     },
     toggleSidebar() {
       this.updateUISettings({
         show_secondary_sidebar: !this.isSidebarOpen,
+        previously_used_sidebar_view: !this.isSidebarOpen,
       });
     },
     openCreateAccountModal() {