dashboard: dynamic dashboard tabs + fix performance settings updating (#1253)

* [CI] chore: update flake

* Dashboard perf settings save, visibility on none enabled

* Dashboard heigh stutter fixed, persist current tab

* restore binding

* wrapper async=false

* ScriptModel, centralized tabs/panes, individual toggle

* fixes, missed mediaUpdateInterval, passing values

---------

Co-authored-by: github-actions <41898282+github-actions[bot]@users.noreply.github.com>

3 files changed, 88 insertions, 57 deletions

diff --git a/modules/dashboard/Content.qml b/modules/dashboard/Content.qml
index 1cc960a..bbb4272 100644
--- a/modules/dashboard/Content.qml
+++ b/modules/dashboard/Content.qml
@@ -14,6 +14,37 @@ Item {
     required property PersistentProperties visibilities
     required property PersistentProperties state
     required property FileDialog facePicker
+
+    readonly property var dashboardTabs: {
+        const allTabs = [
+            {
+                component: dashComponent,
+                iconName: "dashboard",
+                text: qsTr("Dashboard"),
+                enabled: Config.dashboard.showDashboard
+            },
+            {
+                component: mediaComponent,
+                iconName: "queue_music",
+                text: qsTr("Media"),
+                enabled: Config.dashboard.showMedia
+            },
+            {
+                component: performanceComponent,
+                iconName: "speed",
+                text: qsTr("Performance"),
+                enabled: Config.dashboard.showPerformance && (Config.dashboard.performance.showCpu || Config.dashboard.performance.showGpu || Config.dashboard.performance.showMemory || Config.dashboard.performance.showStorage || Config.dashboard.performance.showNetwork || Config.dashboard.performance.showBattery)
+            },
+            {
+                component: weatherComponent,
+                iconName: "cloud",
+                text: qsTr("Weather"),
+                enabled: Config.dashboard.showWeather
+            }
+        ];
+        return allTabs.filter(tab => tab.enabled);
+    }
+
     readonly property real nonAnimWidth: view.implicitWidth + viewWrapper.anchors.margins * 2
     readonly property real nonAnimHeight: tabs.implicitHeight + tabs.anchors.topMargin + view.implicitHeight + viewWrapper.anchors.margins * 2
 
@@ -31,6 +62,7 @@ Item {
 
         nonAnimWidth: root.nonAnimWidth - anchors.margins * 2
         state: root.state
+        tabs: root.dashboardTabs
     }
 
     ClippingRectangle {
@@ -86,33 +118,58 @@ Item {
             RowLayout {
                 id: row
 
-                Pane {
-                    index: 0
-                    sourceComponent: Dash {
-                        visibilities: root.visibilities
-                        state: root.state
-                        facePicker: root.facePicker
+                Repeater {
+                    model: ScriptModel {
+                        values: root.dashboardTabs
                     }
-                }
 
-                Pane {
-                    index: 1
-                    sourceComponent: Media {
-                        visibilities: root.visibilities
+                    delegate: Loader {
+                        id: paneLoader
+
+                        required property int index
+                        required property var modelData
+
+                        Layout.alignment: Qt.AlignTop
+
+                        sourceComponent: modelData.component
+
+                        Component.onCompleted: active = Qt.binding(() => {
+                            if (index === view.currentIndex)
+                                return true;
+                            const vx = Math.floor(view.visibleArea.xPosition * view.contentWidth);
+                            const vex = Math.floor(vx + view.visibleArea.widthRatio * view.contentWidth);
+                            return (vx >= x && vx <= x + implicitWidth) || (vex >= x && vex <= x + implicitWidth);
+                        })
                     }
                 }
+            }
 
-                Pane {
-                    index: 2
-                    sourceComponent: Performance {}
+            Component {
+                id: dashComponent
+                Dash {
+                    visibilities: root.visibilities
+                    state: root.state
+                    facePicker: root.facePicker
                 }
+            }
 
-                Pane {
-                    index: 3
-                    sourceComponent: Weather {}
+            Component {
+                id: mediaComponent
+                Media {
+                    visibilities: root.visibilities
                 }
             }
 
+            Component {
+                id: performanceComponent
+                Performance {}
+            }
+
+            Component {
+                id: weatherComponent
+                Weather {}
+            }
+
             Behavior on contentX {
                 Anim {}
             }
@@ -132,21 +189,4 @@ Item {
             easing.bezierCurve: Appearance.anim.curves.emphasized
         }
     }
-
-    component Pane: Loader {
-        id: pane
-
-        required property int index
-
-        Layout.alignment: Qt.AlignTop
-
-        Component.onCompleted: active = Qt.binding(() => {
-            // Always keep current tab loaded
-            if (pane.index === view.currentIndex)
-                return true;
-            const vx = Math.floor(view.visibleArea.xPosition * view.contentWidth);
-            const vex = Math.floor(vx + view.visibleArea.widthRatio * view.contentWidth);
-            return (vx >= x && vx <= x + implicitWidth) || (vex >= x && vex <= x + implicitWidth);
-        })
-    }
 }
diff --git a/modules/dashboard/Tabs.qml b/modules/dashboard/Tabs.qml
index 1d50d26..ed4613d 100644
--- a/modules/dashboard/Tabs.qml
+++ b/modules/dashboard/Tabs.qml
@@ -14,6 +14,8 @@ Item {
 
     required property real nonAnimWidth
     required property PersistentProperties state
+    required property var tabs
+
     readonly property alias count: bar.count
 
     implicitHeight: bar.implicitHeight + indicator.implicitHeight + indicator.anchors.topMargin + separator.implicitHeight
@@ -30,30 +32,18 @@ Item {
 
         onCurrentIndexChanged: root.state.currentTab = currentIndex
 
-        Tab {
-            iconName: "dashboard"
-            text: qsTr("Dashboard")
-        }
-
-        Tab {
-            iconName: "queue_music"
-            text: qsTr("Media")
-        }
+        Repeater {
+            model: ScriptModel {
+                values: root.tabs
+            }
 
-        Tab {
-            iconName: "speed"
-            text: qsTr("Performance")
-        }
+            delegate: Tab {
+                required property var modelData
 
-        Tab {
-            iconName: "cloud"
-            text: qsTr("Weather")
+                iconName: modelData.iconName
+                text: modelData.text
+            }
         }
-
-        // Tab {
-        //     iconName: "workspaces"
-        //     text: qsTr("Workspaces")
-        // }
     }
 
     Item {
@@ -62,11 +52,13 @@ Item {
         anchors.top: bar.bottom
         anchors.topMargin: 5
 
-        implicitWidth: bar.currentItem.implicitWidth
+        implicitWidth: bar.currentItem?.implicitWidth ?? 0
         implicitHeight: 3
 
         x: {
             const tab = bar.currentItem;
+            if (!tab)
+                return 0;
             const width = (root.nonAnimWidth - bar.spacing * (bar.count - 1)) / bar.count;
             return width * tab.TabBar.index + (width - tab.implicitWidth) / 2;
         }
diff --git a/modules/dashboard/Wrapper.qml b/modules/dashboard/Wrapper.qml
index 0e37909..81bfcd3 100644
--- a/modules/dashboard/Wrapper.qml
+++ b/modules/dashboard/Wrapper.qml
@@ -82,7 +82,6 @@ Item {
         running: true
         interval: Appearance.anim.durations.extraLarge
         onTriggered: {
-            content.active = Qt.binding(() => (root.visibilities.dashboard && Config.dashboard.enabled) || root.visible);
             content.visible = true;
         }
     }