Add LazyLoader to the hover popup, add env to wal theme folder, fix a bug in popup calendar text

Common/Theme.qml

@@ -18,7 +18,7 @@ Singleton {
     // Colors
     FileView {
         id: walColors
-        path: Qt.resolvedUrl("/home/amaro/.cache/wal/colors")
+        path: Qt.resolvedUrl(Quickshell.env("XDG_CACHE_HOME")+"/wal/colors")
         blockLoading: true
         watchChanges: true
         onFileChanged: this.reload()
@@ -44,24 +44,4 @@ Singleton {
     readonly property color foregroundColorBright: walColorsText[15]
 
     readonly property color textColor: foregroundColorBright
-// background "#0e1721"
-// color2     "#463e44"
-// color3     "#7b4834"
-// color4     "#735148"
-// color5     "#896451"
-// color6     "#9d7057"
-// color7     "#595563"
-// foreground "#91959b"
-// "#5d6772"
-// "#5E535B"
-// "#A56046"
-// "#9A6C60"
-// "#B7866C"
-// "#D29674"
-// "#777285"
-// "#c2c5c7"
-
-
-
-
 }

Services/PopUpHover.qml

@@ -10,6 +10,9 @@ import qs.Common.Styled
 import qs.Services
 
 Singleton {
+    id: root
+
+    property bool showWindow: false
 
     function start(component, type) {
         HoverMediator.component = component;
@@ -19,122 +22,7 @@ Singleton {
 
     function exit() {
         hoverTimer.stop();
-        hoverPopUp.visible = false;
+        root.showWindow = false;
-    }
-
-    PopupWindow {
-        id: hoverPopUp
-
-        anchor.item: HoverMediator.component
-        property bool initialized: false
-        anchor.rect.y: HoverMediator.y
-        anchor.rect.x: (HoverMediator.x - this.implicitWidth) / 2
-        implicitHeight: wsPopUp.implicitHeight
-        implicitWidth: wsPopUp.implicitWidth
-
-        color: "transparent"
-
-        Component {
-            id: stub
-            StyledText {
-                text: "stub"
-            }
-        }
-
-        Component {
-            id: systray
-            StyledText {
-                text: {
-                    if (!HoverMediator.component?.model)
-                        return "";
-                    if (HoverMediator.component.model.tooltipTitle)
-                        return HoverMediator.component.model.tooltipTitle;
-                    if (HoverMediator.component.model.title)
-                        return HoverMediator.component.model.title;
-                    else
-                        return "";
-                }
-            }
-        }
-
-        Component {
-            id: time
-            StyledText {
-                property string calendar: (HoverMediator.component.calendar) ? HoverMediator.component.calendar : ""
-
-                text: calendar
-                font.family: Theme.fontFamilyMono
-            }
-        }
-
-        Component {
-            id: audio
-            StyledText {
-                property string sinkDescription: (HoverMediator.component.sink) ? HoverMediator.component.sink.description : ""
-                text: sinkDescription
-            }
-        }
-
-        Component {
-            id: workspaceComponent
-
-            RowLayout {
-                id: wsPopUpRow
-
-                property int workspaceIndexAlign: HoverMediator.component.workspaceIndexAlign || 0
-
-                Repeater {
-
-                    property var modelo: HyprlandService.sortedDesktopApplications.get(parent.workspaceIndexAlign)
-
-                    model: modelo
-                    delegate: IconImage {
-
-                        required property var modelData
-
-                        width: 30
-                        height: 30
-                        source: (modelData && modelData.icon) ? Quickshell.iconPath(modelData.icon, 1) : ""
-                    }
-                }
-            }
-        }
-
-        BackgroundRectangle {
-            id: wsPopUp
-
-            MarginWrapperManager {
-                leftMargin: (Theme.gaps * 2)
-                rightMargin: (Theme.gaps * 2)
-                topMargin: Theme.gaps
-                bottomMargin: Theme.gaps
-            }
-            color: Theme.backgroudColor
-            radius: 25
-            opacity: 1
-            Behavior on opacity {
-                NumberAnimation {
-                    property: "opacity"
-                    duration: Theme.animationDuration
-                }
-            }
-
-            Loader {
-                id: hoverLoader
-                sourceComponent: {
-                    if (!HoverMediator.type)
-                        return stub;
-                    if (HoverMediator.type === "workspace")
-                        return workspaceComponent;
-                    if (HoverMediator.type === "audio")
-                        return audio;
-                    if (HoverMediator.type === "time")
-                        return time;
-                    if (HoverMediator.type === "systray")
-                        return systray;
-                }
-            }
-        }
     }
 
     Timer {
@@ -143,7 +31,129 @@ Singleton {
         interval: 300
         onTriggered: {
             // wsPopUp.opacity = 1
-            hoverPopUp.visible = true;
+            root.showWindow = true;
         }
     }
+
+    LazyLoader {
+        active: root.showWindow
+        component: PopupWindow {
+            id: hoverPopUp
+
+            anchor.item: HoverMediator.component
+            property bool initialized: false
+            anchor.rect.y: HoverMediator.y
+            anchor.rect.x: (HoverMediator.x - this.implicitWidth) / 2
+            implicitHeight: wsPopUp.implicitHeight
+            implicitWidth: wsPopUp.implicitWidth
+            visible: true
+
+            color: "transparent"
+
+            Component {
+                id: stub
+                StyledText {
+                    text: "stub"
+                }
+            }
+
+            Component {
+                id: systray
+                StyledText {
+                    text: {
+                        if (!HoverMediator.component?.model)
+                        return "";
+                        if (HoverMediator.component.model.tooltipTitle)
+                        return HoverMediator.component.model.tooltipTitle;
+                        if (HoverMediator.component.model.title)
+                        return HoverMediator.component.model.title;
+                        else
+                        return "";
+                    }
+                }
+            }
+
+            Component {
+                id: time
+                StyledText {
+                    property string calendar: (HoverMediator.component.calendar) ? HoverMediator.component.calendar : ""
+
+                    text: calendar
+
+                    textFormat: Text.AutoText
+                    font.family: Theme.fontFamilyMono
+                }
+            }
+
+            Component {
+                id: audio
+                StyledText {
+                    property string sinkDescription: (HoverMediator.component.sink) ? HoverMediator.component.sink.description : ""
+                    text: sinkDescription
+                }
+            }
+
+            Component {
+                id: workspaceComponent
+
+                RowLayout {
+                    id: wsPopUpRow
+
+                    property int workspaceIndexAlign: HoverMediator.component.workspaceIndexAlign || 0
+
+                    Repeater {
+
+                        property var modelo: HyprlandService.sortedDesktopApplications.get(parent.workspaceIndexAlign)
+
+                        model: modelo
+                        delegate: IconImage {
+
+                            required property var modelData
+
+                            width: 30
+                            height: 30
+                            source: (modelData && modelData.icon) ? Quickshell.iconPath(modelData.icon, 1) : ""
+                        }
+                    }
+                }
+            }
+
+            BackgroundRectangle {
+                id: wsPopUp
+
+                MarginWrapperManager {
+                    leftMargin: (Theme.gaps * 2)
+                    rightMargin: (Theme.gaps * 2)
+                    topMargin: Theme.gaps
+                    bottomMargin: Theme.gaps
+                }
+                color: Theme.backgroudColor
+                radius: 25
+                opacity: 1
+                Behavior on opacity {
+                    NumberAnimation {
+                        property: "opacity"
+                        duration: Theme.animationDuration
+                    }
+                }
+
+                Loader {
+                    id: hoverLoader
+                    sourceComponent: {
+                        if (!HoverMediator.type)
+                        return stub;
+                        if (HoverMediator.type === "workspace")
+                        return workspaceComponent;
+                        if (HoverMediator.type === "audio")
+                        return audio;
+                        if (HoverMediator.type === "time")
+                        return time;
+                        if (HoverMediator.type === "systray")
+                        return systray;
+                    }
+                }
+            }
+        }
+
+    }
 }

Workspaces.qml

@@ -129,6 +129,7 @@ WrapperMouseArea {
                         }
                         ;
                         Hyprland.dispatch("workspace " + workspacesRectangle.workspace.id);
+                        PopUpHover.exit();
                     }
                 }
             }