1 files changed, 71 insertions, 0 deletions
diff --git a/desktop/modules/kdeconnect/KdeConnectRow.qml b/desktop/modules/kdeconnect/KdeConnectRow.qml
new file mode 100644
index 0000000..45daae9
--- /dev/null
+++ b/desktop/modules/kdeconnect/KdeConnectRow.qml
@@ -0,0 +1,71 @@
+// Copyright (C) 2026 Danilo M. <danix@danix.xyz>
+//
+// This program is free software; you can redistribute it and/or modify
+// it under the terms of the GNU General Public License version 2 as
+// published by the Free Software Foundation.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+
+import QtQuick
+import "../.."
+
+// One KDE Connect device. The type glyph is the phone for anything that is
+// not a laptop or desktop, since the daemon's type strings are not a closed
+// set.
+Rectangle {
+    id: row
+
+    required property var mod
+    required property var device
+
+    implicitHeight: col.implicitHeight + 16
+    radius: 8
+    color: row.device.reachable ? Qt.alpha(Theme.accent, 0.10) : Qt.alpha(Theme.surface, 0.35)
+
+    Column {
+        id: col
+        anchors { left: parent.left; right: parent.right; top: parent.top; margins: 10 }
+        spacing: 8
+
+        Item {
+            width: parent.width
+            implicitHeight: Math.max(name.implicitHeight, glyph.implicitHeight)
+
+            Text {
+                id: glyph
+                anchors.verticalCenter: parent.verticalCenter
+                text: row.device.type === "desktop" ? "\uf109" : "\uf10b"
+                font { family: Theme.iconFamily; pixelSize: Theme.fontSize - 2 }
+                color: Theme.subtext
+            }
+
+            Text {
+                id: name
+                anchors { left: glyph.right; leftMargin: 8; right: parent.right; verticalCenter: parent.verticalCenter }
+                elide: Text.ElideRight
+                text: row.device.name || row.device.id
+                font { family: Theme.fontFamily; pixelSize: Theme.fontSize - 2; bold: row.device.reachable }
+                color: row.device.reachable ? Theme.accent : Theme.text
+            }
+        }
+
+        Text {
+            id: status
+            width: parent.width
+            text: {
+                let s = row.device.paired
+                    ? (row.device.reachable ? "Reachable" : "Not reachable")
+                    : (row.device.reachable ? "Found" : "Not reachable");
+                if (row.device.charge !== "")
+                    s += "  " + row.device.charge + "%" + (row.device.charging ? " charging" : "");
+                return s;
+            }
+            font { family: Theme.fontFamily; pixelSize: Theme.fontSize - 4 }
+            color: Theme.subtext
+            elide: Text.ElideRight
+        }
+    }
+}