1 files changed, 59 insertions, 0 deletions
diff --git a/utils/Resource.qml b/utils/Resource.qml
new file mode 100644
index 0000000..2048e98
--- /dev/null
+++ b/utils/Resource.qml
@@ -0,0 +1,59 @@
+import QtQuick
+import QtQuick.Layouts
+import Quickshell
+import Quickshell.Io
+
+import qs.config
+
+Item {
+    id: root
+
+    required property string iconName
+    required property double percentage
+    property bool shown: true
+    clip: true
+    visible: width > 0 && height > 0
+    implicitWidth: resourceRowLayout.x < 0 ? 0 : childrenRect.width
+    implicitHeight: childrenRect.height
+
+    RowLayout {
+        id: resourceRowLayout
+        spacing: 4
+        x: root.shown ? 0 : -resourceRowLayout.width
+
+        CircularProgress {
+            Layout.alignment: Qt.AlignVCenter
+            lineWidth: 2
+            value: root.percentage
+            size: 26
+            // secondaryColor: Appearance.colors.colSecondaryContainer
+            // primaryColor: Appearance.m3colors.m3onSecondaryContainer
+
+            MaterialSymbol {
+                anchors.centerIn: parent
+                fill: 1
+                text: iconName
+                // iconSize: Appearance.font.pixelSize.normal
+                // color: Appearance.m3colors.m3onSecondaryContainer
+            }
+        }
+
+        Text {
+            Layout.alignment: Qt.AlignVCenter
+            // color: Appearance.colors.colOnLayer1
+            text: `${Math.round(percentage * 100)}`
+        }
+
+        Behavior on x {
+            animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
+        }
+    }
+
+    Behavior on implicitWidth {
+        NumberAnimation {
+            duration: Appearance.animation.elementMove.duration
+            easing.type: Appearance.animation.elementMove.type
+            easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
+        }
+    }
+}