add network

config/Dimensions.qml

@@ -12,6 +12,7 @@ Singleton {
     property Mpris mpris: Mpris {}
     property Clock clock: Clock {}
     property Pipewire pipewire: Pipewire {}
+    property Network network: Network {}
     property Storage storage: Storage {}
     property Memory memory: Memory {}
     property Cpu cpu: Cpu {}
@@ -52,6 +53,14 @@ Singleton {
         property int verticalPadding: 6
     }
 
+    component Network: QtObject {
+        property int iconSize: 14
+        property int fontSize: 14
+        property int height: 30
+        property int horizontalPadding: 8
+        property int verticalPadding: 6
+    }
+
     component Storage: QtObject {
         property int iconSize: 14
         property int fontSize: 14
@@ -74,9 +83,9 @@ Singleton {
         property int height: 30
         property int horizontalPadding: 8
         property int verticalPadding: 6
-      }
+    }
 
-      component Gpu: QtObject {
+    component Gpu: QtObject {
         property int iconSize: 14
         property int fontSize: 14
         property int height: 30

constants/Icons.qml

@@ -9,6 +9,10 @@ Singleton {
     property string gpu: "\u{E66f}"
     property string hardDrive: "\u{E0f1}"
     property string memoryStick: "\u{E44a}"
+    property string wifiOff: "\u{E1af}"
+    property string wifiLow: "\u{E5fd}"
+    property string wifiHigh: "\u{E5fc}"
+    property string wifi: "\u{E1ae}"
     property string triangle: "\u{E192}"
     property string triangleDashed: "\u{E642}"
 }

modules/bar/Bar.qml

@@ -104,6 +104,10 @@ Scope {
                     anchors.verticalCenter: parent.verticalCenter
                 }
 
+                Network {
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
                 Storage {
                     anchors.verticalCenter: parent.verticalCenter
                 }
@@ -114,9 +118,9 @@ Scope {
 
                 Cpu {
                     anchors.verticalCenter: parent.verticalCenter
-                  }
+                }
 
-                  Gpu {
+                Gpu {
                     anchors.verticalCenter: parent.verticalCenter
                 }
 

modules/bar/components/Network.qml

@@ -0,0 +1,78 @@
+import QtQuick
+import Quickshell
+import "../../../config/"
+import "../../../constants/"
+import "../../../services/"
+import "../../../styled/"
+import "../../../utils/"
+
+StyledLabel {
+    id: root
+
+    implicitWidth: row.width
+    implicitHeight: Dimensions.network.height
+
+    Ref {
+        id: ref
+        service: NetworkService
+    }
+
+    Row {
+        id: row
+        StyledText {
+            id: icon
+
+            font.family: Theme.lucide.font.family
+            font.pixelSize: Dimensions.network.iconSize
+            font.bold: true
+            text: Icons.wifiOff
+
+            anchors.verticalCenter: parent.verticalCenter
+            topPadding: Dimensions.network.verticalPadding
+            bottomPadding: Dimensions.network.verticalPadding
+            leftPadding: Dimensions.network.horizontalPadding
+
+            states: [
+                State {
+                    name: "high"
+                    when: NetworkService.active?.strength > 50
+                    PropertyChanges {
+                        icon {
+                            text: Icons.wifi
+                        }
+                    }
+                },
+                State {
+                    name: "medium"
+                    when: NetworkService.active?.strength > 25
+                    PropertyChanges {
+                        icon {
+                            text: Icons.wifiHigh
+                        }
+                    }
+                },
+                State {
+                    name: "low"
+                    when: NetworkService.active?.strength > 0
+                    PropertyChanges {
+                        icon {
+                            text: Icons.wifiLow
+                        }
+                    }
+                }
+            ]
+        }
+
+        StyledText {
+            id: text
+            anchors.verticalCenter: parent.verticalCenter
+            topPadding: Dimensions.network.verticalPadding
+            bottomPadding: Dimensions.network.verticalPadding
+            rightPadding: Dimensions.network.horizontalPadding
+
+            font.pixelSize: Dimensions.network.fontSize
+
+            text: ` ${(NetworkService.active?.strength ?? 0).toFixed()}%`
+        }
+    }
+}

services/NetworkService.qml

@@ -0,0 +1,81 @@
+pragma Singleton
+
+import Quickshell
+import Quickshell.Io
+import QtQuick
+
+Singleton {
+    id: root
+
+    readonly property list<AccessPoint> networks: []
+    readonly property AccessPoint active: networks.find(n => n.active) ?? null
+
+    reloadableId: "network"
+
+    Process {
+        running: true
+        command: ["nmcli", "m"]
+        stdout: SplitParser {
+            onRead: getNetworks.running = true
+        }
+    }
+
+    Process {
+        id: getNetworks
+        running: true
+        command: ["nmcli", "-g", "ACTIVE,SIGNAL,FREQ,SSID,BSSID", "d", "w"]
+        environment: ({
+                LANG: "C",
+                LC_ALL: "C"
+            })
+        stdout: StdioCollector {
+            onStreamFinished: {
+                const PLACEHOLDER = "STRINGWHICHHOPEFULLYWONTBEUSED";
+                const rep = new RegExp("\\\\:", "g");
+                const rep2 = new RegExp(PLACEHOLDER, "g");
+
+                const networks = text.trim().split("\n").map(n => {
+                    const net = n.replace(rep, PLACEHOLDER).split(":");
+                    return {
+                        active: net[0] === "yes",
+                        strength: parseInt(net[1]),
+                        frequency: parseInt(net[2]),
+                        ssid: net[3],
+                        bssid: net[4]?.replace(rep2, ":") ?? ""
+                    };
+                });
+                const rNetworks = root.networks;
+
+                const destroyed = rNetworks.filter(rn => !networks.find(n => n.frequency === rn.frequency && n.ssid === rn.ssid && n.bssid === rn.bssid));
+                for (const network of destroyed)
+                    rNetworks.splice(rNetworks.indexOf(network), 1).forEach(n => n.destroy());
+
+                for (const network of networks) {
+                    const match = rNetworks.find(n => n.frequency === network.frequency && n.ssid === network.ssid && n.bssid === network.bssid);
+                    if (match) {
+                        match.lastIpcObject = network;
+                    } else {
+                        rNetworks.push(apComp.createObject(root, {
+                            lastIpcObject: network
+                        }));
+                    }
+                }
+            }
+        }
+    }
+
+    component AccessPoint: QtObject {
+        required property var lastIpcObject
+        readonly property string ssid: lastIpcObject.ssid
+        readonly property string bssid: lastIpcObject.bssid
+        readonly property int strength: lastIpcObject.strength
+        readonly property int frequency: lastIpcObject.frequency
+        readonly property bool active: lastIpcObject.active
+    }
+
+    Component {
+        id: apComp
+
+        AccessPoint {}
+    }
+}