Make main drawer modal when expanded and the window is narrow

BUG: 459521

Signed-off-by: Claudio Cambra <claudio.cambra@gmail.com>

src/contents/ui/Drawers/MainDrawer.qml

@@ -25,12 +25,25 @@ Kirigami.OverlayDrawer {
     property alias toolbar: toolbar
     property var activeTags : Filter.tags
 
+    readonly property int collapsedWidth: menu.Layout.minimumWidth + Kirigami.Units.smallSpacing
+    readonly property int expandedWidth: Kirigami.Units.gridUnit * 16
+    property bool refuseModal: false
+
     Connections {
         target: applicationWindow()
         function onWidthChanged() {
-            if(!Kirigami.Settings.isMobile && !Config.forceCollapsedMainDrawer) {
-                mainDrawer.collapsed = applicationWindow().width < Kirigami.Units.gridUnit * 50
-            } // HACK: Workaround for incredibly glitchy behaviour caused by using wideScreen property
+            if(!Kirigami.Settings.isMobile) {
+                const prevCollapseState = mainDrawer.collapsed;
+
+                if(!Config.forceCollapsedMainDrawer) {
+                    mainDrawer.collapsed = applicationWindow().width < Kirigami.Units.gridUnit * 50
+                } // HACK: Workaround for incredibly glitchy behaviour caused by using wideScreen property
+
+                // We don't want to go into modal when we are resizing the window to narrow and the drawer is collapsing
+                if(prevCollapseState !== mainDrawer.collapsed) {
+                    refuseModal = true;
+                }
+            }
         }
     }
 
@@ -42,17 +55,29 @@ Kirigami.OverlayDrawer {
     }
 
     edge: Qt.application.layoutDirection === Qt.RightToLeft ? Qt.RightEdge : Qt.LeftEdge
-    modal: Kirigami.Settings.isMobile
+    // Modal when mobile, or when the window is narrow and the drawer is expanded/being expanded
+    modal: Kirigami.Settings.isMobile ||
+           (applicationWindow().width < Kirigami.Units.gridUnit * 50 && (!collapsed || width > collapsedWidth) && !refuseModal)
+    onDrawerOpenChanged: {
+        // We want the drawer to be open but collapsed if we close it when it is modal on desktop
+        if(!Kirigami.Settings.isMobile && !drawerOpen) {
+            drawerOpen = true;
+            collapsed = true;
+        }
+    }
+
     handleVisible: modal
     handleClosedIcon.source: null
     handleOpenIcon.source: null
-    width: mainDrawer.collapsed ? menu.Layout.minimumWidth + Kirigami.Units.smallSpacing : Kirigami.Units.gridUnit * 16
+    width: mainDrawer.collapsed ? collapsedWidth : expandedWidth
+    // Re-enable modal after the drawer has been collapsed after resizing the window to a narrow size
+    onWidthChanged: if(width === collapsedWidth) refuseModal = false
+    Behavior on width { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad } }
 
     Component.onCompleted: {
         collapsed = Config.forceCollapsedMainDrawer // Fix crashing caused by setting on load
         ContactManager.contactCollections; // Fix crashing because the contactCollections was created too late
     }
-    Behavior on width { NumberAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad } }
 
     Kirigami.Theme.colorSet: Kirigami.Theme.Window