diff --git a/.config/quickshell/modules/common/widgets/Favicon.qml b/.config/quickshell/modules/common/widgets/Favicon.qml
new file mode 100644
index 00000000..c7133b08
--- /dev/null
+++ b/.config/quickshell/modules/common/widgets/Favicon.qml
@@ -0,0 +1,59 @@
+import "root:/modules/common"
+import "root:/modules/common/widgets"
+import "root:/services"
+import "root:/modules/common/functions/string_utils.js" as StringUtils
+import "root:/modules/common/functions/file_utils.js" as FileUtils
+import Qt5Compat.GraphicalEffects
+import Qt.labs.platform
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import Quickshell.Io
+import Quickshell.Widgets
+import Quickshell.Hyprland
+
+IconImage {
+    id: root
+    property string url
+
+    property real size: 32
+    property string downloadUserAgent: ConfigOptions?.networking.userAgent ?? ""
+    property string faviconDownloadPath: FileUtils.trimFileProtocol(`${XdgDirectories.cache}/media/favicons`)
+    property string domainName: url.includes("vertexaisearch") ? displayText : StringUtils.getBaseUrl(url)
+    property string faviconUrl: `https://www.google.com/s2/favicons?domain=${domainName}&sz=32`
+    property string fileName: `${domainName}.ico`
+    property string faviconFilePath: `${faviconDownloadPath}/${fileName}`
+
+    Process {
+        id: faviconDownloadProcess
+        running: false
+        command: ["bash", "-c", `[ -f ${faviconFilePath} ] || curl -s '${root.faviconUrl}' -o '${faviconFilePath}' -L -H 'User-Agent: ${downloadUserAgent}'`]
+        onExited: (exitCode, exitStatus) => {
+            console.log("Favicon download process exited with code:", exitCode, "and status:", exitStatus)
+            console.log("Favicon file path:", faviconFilePath)
+            root.faviconUrl = root.faviconFilePath
+        }
+    }
+
+    Component.onCompleted: {
+        console.log("faviconDownloadPath: ", faviconDownloadPath)
+        console.log("faviconFilePath: ", faviconFilePath)
+        console.log("faviconUrl: ", root.faviconUrl)
+        console.log("domainName: ", root.domainName)
+        console.log("fileName: ", root.fileName)
+        console.log("downloading to ", faviconFilePath, "from", root.faviconUrl)
+        faviconDownloadProcess.running = true
+    }
+
+    source: Qt.resolvedUrl(root.faviconUrl)
+    implicitSize: root.size
+
+    layer.enabled: true
+    layer.effect: OpacityMask {
+        maskSource: Rectangle {
+            width: root.implicitSize
+            height: root.implicitSize
+            radius: Appearance.rounding.full
+        }
+    }
+}
\ No newline at end of file
diff --git a/.config/quickshell/modules/sidebarLeft/AiChat.qml b/.config/quickshell/modules/sidebarLeft/AiChat.qml
index 440f4424..0bac7203 100644
--- a/.config/quickshell/modules/sidebarLeft/AiChat.qml
+++ b/.config/quickshell/modules/sidebarLeft/AiChat.qml
@@ -19,7 +19,6 @@ Item {
     property var panelWindow
     property var inputField: messageInputField
     property string commandPrefix: "/"
-    property string faviconDownloadPath: FileUtils.trimFileProtocol(`${XdgDirectories.cache}/media/favicons`)
 
     property var suggestionQuery: ""
     property var suggestionList: []
@@ -203,7 +202,6 @@ int main(int argc, char* argv[]) {
                         Ai.messageByID[modelData]
                     }
                     messageInputField: root.inputField
-                    faviconDownloadPath: root.faviconDownloadPath
                 }
             }
 
diff --git a/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml b/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml
index 9d8f1ae0..1122406a 100644
--- a/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml
+++ b/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml
@@ -20,7 +20,6 @@ Rectangle {
     property int messageIndex
     property var messageData
     property var messageInputField
-    property string faviconDownloadPath
 
     property real messagePadding: 7
     property real contentSpacing: 3
@@ -282,7 +281,6 @@ Rectangle {
                 model: root.messageData?.annotationSources
                 delegate: AnnotationSourceButton {
                     id: annotationButton
-                    faviconDownloadPath: root.faviconDownloadPath
                     displayText: modelData.text
                     url: modelData.url
                 }
diff --git a/.config/quickshell/modules/sidebarLeft/aiChat/AnnotationSourceButton.qml b/.config/quickshell/modules/sidebarLeft/aiChat/AnnotationSourceButton.qml
index 1c279edd..a92b92ee 100644
--- a/.config/quickshell/modules/sidebarLeft/aiChat/AnnotationSourceButton.qml
+++ b/.config/quickshell/modules/sidebarLeft/aiChat/AnnotationSourceButton.qml
@@ -16,13 +16,6 @@ RippleButton {
     property string displayText
     property string url
 
-    property string downloadUserAgent: ConfigOptions.networking.userAgent
-    property string faviconDownloadPath
-    property string domainName: url.includes("vertexaisearch") ? displayText : StringUtils.getBaseUrl(url)
-    property string faviconUrl: `https://www.google.com/s2/favicons?domain=${domainName}&sz=32`
-    property string fileName: `${domainName}.ico`
-    property string faviconFilePath: `${faviconDownloadPath}/${fileName}`
-
     property real faviconSize: 20
     implicitHeight: 30
     leftPadding: (implicitHeight - faviconSize) / 2
@@ -32,19 +25,6 @@ RippleButton {
     colBackgroundHover: Appearance.colors.colSurfaceContainerHighestHover
     colRipple: Appearance.colors.colSurfaceContainerHighestActive
 
-    Process {
-        id: faviconDownloadProcess
-        running: false
-        command: ["bash", "-c", `[ -f ${faviconFilePath} ] || curl -s '${root.faviconUrl}' -o '${faviconFilePath}' -L -H 'User-Agent: ${downloadUserAgent}'`]
-        onExited: (exitCode, exitStatus) => {
-            root.faviconUrl = root.faviconFilePath
-        }
-    }
-
-    Component.onCompleted: {
-        faviconDownloadProcess.running = true
-    }
-
     PointingHandInteraction {}
     onClicked: {
         if (url) {
@@ -53,27 +33,25 @@ RippleButton {
         }
     }
 
-    contentItem: RowLayout {
-        spacing: 5
-        IconImage {
-            id: iconImage
-            source: Qt.resolvedUrl(root.faviconUrl)
-            implicitSize: root.faviconSize
-
-            layer.enabled: true
-            layer.effect: OpacityMask {
-                maskSource: Rectangle {
-                    width: iconImage.implicitSize
-                    height: iconImage.implicitSize
-                    radius: Appearance.rounding.full
-                }
+    contentItem: Item {
+        anchors.centerIn: parent
+        implicitWidth: rowLayout.implicitWidth
+        implicitHeight: rowLayout.implicitHeight
+        RowLayout {
+            id: rowLayout
+            anchors.fill: parent
+            spacing: 5
+            Favicon {
+                Layout.alignment: Qt.AlignVCenter
+                url: root.url
+                size: root.faviconSize
+            }
+            StyledText {
+                id: text
+                horizontalAlignment: Text.AlignHCenter
+                text: displayText
+                color: Appearance.m3colors.m3onSurface
             }
-        }
-        StyledText {
-            id: text
-            horizontalAlignment: Text.AlignHCenter
-            text: displayText
-            color: Appearance.m3colors.m3onSurface
         }
     }
 }