bar: use loaders

Use loaders for all optional components
e.g. workspace windows and occupied background
Fix bar preset loader usage
Fix occupied group
Change text on active ws colour
Tray no extension for paths (use qt auto resolution)

modules/bar/Bar.qml

@@ -39,14 +39,12 @@ Variants {
 
         Preset {
             presetName: "pills"
-
+            sourceComponent: Pills {}
-            Pills {}
         }
 
         Preset {
             presetName: "panel"
-
+            sourceComponent: Panel {}
-            Panel {}
         }
     }
 

modules/bar/components/TrayItem.qml

@@ -38,7 +38,7 @@ MouseArea {
             let icon = root.modelData.icon;
             if (icon.includes("?path=")) {
                 const [name, path] = icon.split("?path=");
-                icon = `file://${path}/${name.slice(name.lastIndexOf("/") + 1)}.png`;
+                icon = `file://${path}/${name.slice(name.lastIndexOf("/") + 1)}`;
             }
             return icon;
         }

modules/bar/components/workspaces/ActiveIndicator.qml

@@ -36,7 +36,7 @@ Rectangle {
 
         visible: false
         anchors.fill: parent
-        color: Appearance.colours.m3inverseOnSurface
+        color: Appearance.on(root.color)
 
         Behavior on color {
             ColorAnimation {

modules/bar/components/workspaces/OccupiedBg.qml

@@ -38,10 +38,6 @@ Item {
             pills.splice(count, pills.length - count);
     }
 
-    anchors.fill: parent
-    opacity: BarConfig.workspaces.occupiedBg ? 1 : 0
-    z: -1
-
     Repeater {
         model: ScriptModel {
             values: root.pills.filter(p => p)
@@ -52,8 +48,8 @@ Item {
 
             required property var modelData
 
-            property Workspace start: root.workspaces[modelData.start - 1] ?? null
+            readonly property Workspace start: root.workspaces[modelData.start - 1 - root.groupOffset] ?? null
-            property Workspace end: root.workspaces[modelData.end - 1] ?? null
+            readonly property Workspace end: root.workspaces[modelData.end - 1 - root.groupOffset] ?? null
 
             color: Appearance.alpha(Appearance.colours.m3surfaceContainerHigh, true)
             radius: BarConfig.workspaces.rounded ? Appearance.rounding.full : 0
@@ -93,10 +89,6 @@ Item {
         }
     }
 
-    Behavior on opacity {
-        Anim {}
-    }
-
     component Anim: NumberAnimation {
         duration: Appearance.anim.durations.normal
         easing.type: Easing.BezierSpline

modules/bar/components/workspaces/Workspace.qml

@@ -16,14 +16,14 @@ Item {
 
     readonly property bool isWorkspace: true // Flag for finding workspace children
     // Unanimated prop for others to use as reference
-    readonly property real size: childrenRect[vertical ? "height" : "width"] + (shouldPad ? Appearance.padding.normal : 0)
+    readonly property real size: childrenRect[vertical ? "height" : "width"] + (hasWindows ? Appearance.padding.normal : 0)
 
     readonly property int ws: groupOffset + index + 1
     readonly property bool isOccupied: occupied[ws] ?? false
-    readonly property bool shouldPad: isOccupied && BarConfig.workspaces.showWindows
+    readonly property bool hasWindows: isOccupied && BarConfig.workspaces.showWindows
 
-    Layout.preferredWidth: childrenRect.width + (shouldPad && !vertical ? Appearance.padding.normal : 0)
+    Layout.preferredWidth: childrenRect.width + (hasWindows && !vertical ? Appearance.padding.normal : 0)
-    Layout.preferredHeight: childrenRect.height + (shouldPad && vertical ? Appearance.padding.normal : 0)
+    Layout.preferredHeight: childrenRect.height + (hasWindows && vertical ? Appearance.padding.normal : 0)
 
     StyledText {
         id: indicator
@@ -42,22 +42,30 @@ Item {
         height: BarConfig.sizes.innerHeight
     }
 
-    Box {
+    Loader {
-        anchors.left: vertical ? undefined : indicator.right
+        active: BarConfig.workspaces.showWindows
-        anchors.top: vertical ? indicator.bottom : undefined
+        asynchronous: true
-        anchors.verticalCenter: vertical ? undefined : indicator.verticalCenter
-        anchors.horizontalCenter: vertical ? indicator.horizontalCenter : undefined
 
-        Repeater {
+        anchors.left: root.vertical ? undefined : indicator.right
-            model: ScriptModel {
+        anchors.top: root.vertical ? indicator.bottom : undefined
-                values: BarConfig.workspaces.showWindows ? Hyprland.clients.filter(c => c.workspace?.id === root.ws) : []
+        anchors.verticalCenter: root.vertical ? undefined : indicator.verticalCenter
-            }
+        anchors.horizontalCenter: root.vertical ? indicator.horizontalCenter : undefined
 
-            MaterialIcon {
+        sourceComponent: Box {
-                required property Hyprland.Client modelData
+            anchors.horizontalCenter: root.vertical ? parent.horizontalCenter : undefined
+            anchors.verticalCenter: root.vertical ? undefined : parent.verticalCenter
 
-                text: Icons.getAppCategoryIcon(modelData.wmClass, "terminal")
+            Repeater {
-                color: Appearance.colours.m3onSurfaceVariant
+                model: ScriptModel {
+                    values: Hyprland.clients.filter(c => c.workspace?.id === root.ws)
+                }
+
+                MaterialIcon {
+                    required property Hyprland.Client modelData
+
+                    text: Icons.getAppCategoryIcon(modelData.wmClass, "terminal")
+                    color: Appearance.colours.m3onSurfaceVariant
+                }
             }
         }
     }

modules/bar/components/workspaces/Workspaces.qml

@@ -9,7 +9,7 @@ Item {
     property alias vertical: layout.vertical
     property color colour: Appearance.colours.mauve
 
-    readonly property list<Workspace> workspaces: layout.children.filter(c => c.isWorkspace)
+    readonly property list<Workspace> workspaces: layout.children.filter(c => c.isWorkspace).sort((w1, w2) => w1.ws - w2.ws)
     readonly property var occupied: Hyprland.workspaces.values.reduce((acc, curr) => {
         acc[curr.id] = curr.lastIpcObject.windows > 0;
         return acc;
@@ -35,11 +35,19 @@ Item {
         }
     }
 
-    OccupiedBg {
+    Loader {
-        vertical: root.vertical
+        active: BarConfig.workspaces.occupiedBg
-        workspaces: root.workspaces
+        asynchronous: true
-        occupied: root.occupied
+
-        groupOffset: root.groupOffset
+        z: -1
+        anchors.fill: parent
+
+        sourceComponent: OccupiedBg {
+            vertical: root.vertical
+            workspaces: root.workspaces
+            occupied: root.occupied
+            groupOffset: root.groupOffset
+        }
     }
 
     ActiveIndicator {

run.fish

@@ -5,6 +5,7 @@ set -l hypr 'invalid nullptr parameter'  # Error that always pops up on Hyprland
 set -l intercept '^qsintercept:.*(:[0-9]+){2}$'  # Empty qsintercept lines
 set -l loop 'Binding loop detected'  # Binding loops
 set -l icons 'Searching custom icon paths is not yet supported'  # Error for system tray icons
-set -l process 'QProcess: Destroyed while process'
+set -l process 'QProcess: Destroyed while process'  # Long running processes on reload
+set -l asyncLoader 'items in the process of being created at engine destruction'  # Async loaders on reload
 
-qs -c caelestia --log-rules $dbus | grep -vE -e $hypr -e $intercept -e $loop -e $icons -e $process
+qs -c caelestia --log-rules $dbus | grep -vE -e $hypr -e $intercept -e $loop -e $icons -e $process -e $asyncLoader