fix: improvements to drawer, auto show / hide on lower resolutions

desktop/datalake/structs.hpp

@@ -3,9 +3,6 @@
 #include <QList>
 #include <QString>
 #include <QUuid>
-#include <filesystem>
-
-namespace fs = std::filesystem;
 
 class KotoArtist;
 class KotoAlbum;

desktop/qml/Main.qml

@@ -6,15 +6,17 @@ import org.kde.kirigami as Kirigami
 
 Kirigami.ApplicationWindow {
     id: root
-    width: 1000
+
     height: 600
-    visible: true
     title: "Koto"
+    visible: true
+    width: 1000
+
+    globalDrawer: PrimaryNavigation {
+        windowRef: root
+    }
 
     // TODO: Implement an onboarding page
-    pageStack.initialPage: PrimaryNavigation {
-        Component.onCompleted: {
-            pageStack.push(Qt.createComponent("HomePage.qml"), {});
-        }
+    pageStack.initialPage: HomePage {
     }
 }

desktop/qml/PrimaryNavigation.qml

@@ -3,85 +3,100 @@ import QtQuick.Controls as Controls
 import QtQuick.Layouts
 import org.kde.kirigami as Kirigami
 
-// Kirigami.Page {
-//     ColumnLayout {
-//         Controls.TextArea {
-//             Layout.alignment: Qt.AlignTop
-//             id: searchEntry
-//             placeholderText: qsTr("Search")
-//         }
-//     }
-// }
-
 Kirigami.GlobalDrawer {
-    width: 200
-    height: parent.height
-    edge: Qt.LeftEdge
-    modal: false
+    id: primaryNavigation
 
-    header: Kirigami.SearchField {
-        id: searchEntry
-        placeholderText: qsTr("Search")
+    property Kirigami.ApplicationWindow windowRef
+
+    function isMobile(width) {
+        return width < 800;
     }
+    function onWindowSizeChanged(width) {
+        drawerOpen = !isMobile(width);
+        modal = isMobile(width);
+    }
+
+    collapseButtonVisible: false
+    drawerOpen: !isMobile()
+    edge: Qt.LeftEdge
+    height: parent.height
+    modal: isMobile()
 
     actions: [
         Kirigami.Action {
-                    text: "Home"
             icon.name: "go-home"
+            text: "Home"
+
             onTriggered: console.log("Home triggered")
         },
         Kirigami.Action {
-                    text: "Audiobooks"
             expandible: true
             icon.name: "bookmark"
+            text: "Audiobooks"
+
             onTriggered: console.log("Audiobooks triggered")
         },
         Kirigami.Action {
-                    text: "Music"
             expandible: true
             icon.name: "emblem-music-symbolic"
+            text: "Music"
+
             children: [
                 Kirigami.Action {
                     text: "Local Library"
+
                     onTriggered: console.log("Music Local Library triggered")
                 },
                 Kirigami.Action {
                     text: "Radio"
+
                     onTriggered: console.log("Music Radio triggered")
                 }
             ]
         },
         Kirigami.Action {
-                    text: "Podcasts"
             expandible: true
             icon.name: "application-rss+xml-symbolic"
+            text: "Podcasts"
+
             children: [
                 Kirigami.Action {
                     text: "Library"
+
                     onTriggered: console.log("Podcasts Library triggered")
                 },
                 Kirigami.Action {
                     text: "Find new podcasts"
+
                     onTriggered: console.log("Podcasts Find new podcasts triggered")
                 }
             ]
         },
         Kirigami.Action {
-                    text: "Playlists"
             expandible: true
             icon.name: "music-playlist-symbolic"
+            text: "Playlists"
+
             children: [
                 Kirigami.Action {
                     text: "Library"
+
                     onTriggered: console.log("Playlists Library triggered")
-                        },
-                        Kirigami.Action {
-                            text: "Find new playlists"
-                            onTriggered: console.log("Playlists Find new playlists triggered")
                 }
             ]
             // TODO: Generate list of playlists
         }
     ]
+    header: Kirigami.SearchField {
+        id: searchEntry
 
+        placeholderText: qsTr("Search")
+    }
+
+    Component.onCompleted: {
+        if (Kirigami.Settings.isMobile)
+            return;
+        if (windowRef)
+            windowRef.onWidthChanged.connect(() => onWindowSizeChanged(windowRef.width));
+    }
 }