From b0750506cf82a9b4b6295a6b3a24a17511a60c65 Mon Sep 17 00:00:00 2001
From: end-4 <97237370+end-4@users.noreply.github.com>
Date: Wed, 9 Jul 2025 09:40:59 +0700
Subject: [PATCH] give CustomIcon colorization

---
 .config/quickshell/modules/bar/Bar.qml               |  6 +-----
 .../quickshell/modules/common/widgets/CustomIcon.qml | 12 ++++++++++++
 .../modules/sidebarLeft/aiChat/AiMessage.qml         |  7 ++-----
 3 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/.config/quickshell/modules/bar/Bar.qml b/.config/quickshell/modules/bar/Bar.qml
index 5540db5e3..a46779e9e 100644
--- a/.config/quickshell/modules/bar/Bar.qml
+++ b/.config/quickshell/modules/bar/Bar.qml
@@ -206,11 +206,7 @@ Scope {
                                     width: 19.5
                                     height: 19.5
                                     source: Config.options.bar.topLeftIcon == 'distro' ? SystemInfo.distroIcon : "spark-symbolic"
-                                }
-
-                                ColorOverlay {
-                                    anchors.fill: distroIcon
-                                    source: distroIcon
+                                    colorize: true
                                     color: Appearance.colors.colOnLayer0
                                 }
                             }
diff --git a/.config/quickshell/modules/common/widgets/CustomIcon.qml b/.config/quickshell/modules/common/widgets/CustomIcon.qml
index 8905b0715..285196156 100644
--- a/.config/quickshell/modules/common/widgets/CustomIcon.qml
+++ b/.config/quickshell/modules/common/widgets/CustomIcon.qml
@@ -1,10 +1,13 @@
 import QtQuick
 import Quickshell
 import Quickshell.Widgets
+import Qt5Compat.GraphicalEffects
 
 Item {
     id: root
     
+    property bool colorize: false
+    property color color
     property string source: ""
     property string iconFolder: "root:/assets/icons"  // The folder to check first
     width: 30
@@ -21,4 +24,13 @@ Item {
         }
         implicitSize: root.height
     }
+
+    Loader {
+        active: root.colorize
+        anchors.fill: iconImage
+        sourceComponent: ColorOverlay {
+            source: iconImage
+            color: root.color
+        }
+    }
 }
diff --git a/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml b/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml
index 3e5b96d3d..a483dd8a8 100644
--- a/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml
+++ b/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml
@@ -121,11 +121,8 @@ Rectangle {
                             height: Appearance.font.pixelSize.large
                             source: messageData?.role == 'assistant' ? Ai.models[messageData?.model].icon :
                                 messageData?.role == 'user' ? 'linux-symbolic' : 'desktop-symbolic'
-                        }
-                        ColorOverlay {
-                            visible: modelIcon.visible
-                            anchors.fill: modelIcon
-                            source: modelIcon
+
+                            colorize: true
                             color: Appearance.m3colors.m3onSecondaryContainer
                         }