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 {
+    pageStack.initialPage: HomePage {
-        Component.onCompleted: {
-            pageStack.push(Qt.createComponent("HomePage.qml"), {});
-        }
     }
 }

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
+    id: primaryNavigation
-    height: parent.height
-    edge: Qt.LeftEdge
-    modal: false
 
+    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 {
+            icon.name: "go-home"
+            text: "Home"
+
+            onTriggered: console.log("Home triggered")
+        },
+        Kirigami.Action {
+            expandible: true
+            icon.name: "bookmark"
+            text: "Audiobooks"
+
+            onTriggered: console.log("Audiobooks triggered")
+        },
+        Kirigami.Action {
+            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 {
+            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 {
+            expandible: true
+            icon.name: "music-playlist-symbolic"
+            text: "Playlists"
+
+            children: [
+                Kirigami.Action {
+                    text: "Library"
+
+                    onTriggered: console.log("Playlists Library triggered")
+                }
+            ]
+            // TODO: Generate list of playlists
+        }
+    ]
     header: Kirigami.SearchField {
         id: searchEntry
+
         placeholderText: qsTr("Search")
     }
 
-    actions: [
+    Component.onCompleted: {
-                Kirigami.Action {
+        if (Kirigami.Settings.isMobile)
-                    text: "Home"
+            return;
-                    icon.name: "go-home"
+        if (windowRef)
-                    onTriggered: console.log("Home triggered")
+            windowRef.onWidthChanged.connect(() => onWindowSizeChanged(windowRef.width));
-                },
+    }
-                Kirigami.Action {
-                    text: "Audiobooks"
-                    expandible: true
-                    icon.name: "bookmark"
-                    onTriggered: console.log("Audiobooks triggered")
-                },
-                Kirigami.Action {
-                    text: "Music"
-                    expandible: true
-                    icon.name: "emblem-music-symbolic"
-                    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"
-                    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"
-                    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
-                }
-            ]
-
 }