simple dashboard

only has mpris

modules/drawers/Drawers.qml

@@ -0,0 +1,41 @@
+import "dashboard"
+import QtQuick
+import Quickshell
+import Quickshell.Wayland
+
+PanelWindow {
+    id: parentWindow
+
+    anchors.top: true
+    anchors.left: true
+    anchors.right: true
+    anchors.bottom: true
+
+    color: 'transparent'
+
+    // WlrLayershell.exclusionMode: ExclusionMode.Ignore
+    WlrLayershell.layer: WlrLayer.Top
+
+    mask: Region {
+        width: parentWindow.width
+        height: parentWindow.height
+        intersection: Intersection.Xor
+        regions: [
+            Region {
+                x: dashboard.x
+                y: dashboard.y
+                width: dashboard.width
+                height: dashboard.height
+                intersection: Intersection.Subtract
+            }
+        ]
+    }
+
+    Dashboard {
+        id: dashboard
+        x: parentWindow.width / 2 - dashboard.width / 2
+        edge: Qt.TopEdge
+        padding: 20
+        margins: 200
+    }
+}

modules/drawers/dashboard/Dashboard.qml

@@ -0,0 +1,63 @@
+pragma ComponentBehavior: Bound
+
+import qs.components
+import qs.config
+import qs.constants
+import qs.services
+import qs.widgets
+import QtQuick
+import QtQuick.Layouts
+
+StyledDrawer {
+    id: root
+
+    visible: Visibility.dashboard
+
+    margins: 20
+    contentItem: ColumnLayout {
+
+        RowLayout {
+            Layout.alignment: Qt.AlignHCenter
+
+            StyledButton {
+                id: previousPlayerButton
+                visible: Mpris.players.length > 1
+                content: LucideIcon {
+                    color: previousPlayerButton.containsMouse ? Theme.palette.primarycontent : Theme.palette.basecontent
+                    text: Icons.chevronLeft
+                }
+                onClicked: {
+                    Mpris.previousPlayer();
+                }
+            }
+
+            StyledText {
+                text: {
+                    if (Mpris.active?.identity) {
+                        const words = Mpris.active?.identity.split("-");
+                        const capitalized = words.map(val => String(val).charAt(0).toUpperCase() + String(val).slice(1));
+                        return capitalized.join(" ");
+                    }
+                    return Mpris.active?.desktopEntry ?? Mpris.active?.dbusName ?? "unknown";
+                }
+                font.pixelSize: 20
+            }
+
+            StyledButton {
+                id: nextPlayerButton
+                visible: Mpris.players.length > 1
+                content: LucideIcon {
+                    color: nextPlayerButton.containsMouse ? Theme.palette.primarycontent : Theme.palette.basecontent
+                    text: Icons.chevronRight
+                }
+                onClicked: {
+                    Mpris.nextPlayer();
+                }
+            }
+        }
+
+        MprisController {
+            player: Mpris.active
+        }
+    }
+}