refactor: ToggleButton Tooltips and DeviceList

1 files changed, 93 insertions, 83 deletions

diff --git a/modules/controlcenter/network/WirelessDetails.qml b/modules/controlcenter/network/WirelessDetails.qml
index 57c06c8..7f6a4aa 100644
--- a/modules/controlcenter/network/WirelessDetails.qml
+++ b/modules/controlcenter/network/WirelessDetails.qml
@@ -1,6 +1,7 @@
 pragma ComponentBehavior: Bound
 
 import ".."
+import "../components"
 import "."
 import qs.components
 import qs.components.controls
@@ -12,14 +13,13 @@ import qs.utils
 import QtQuick
 import QtQuick.Layouts
 
-Item {
+DeviceDetails {
     id: root
 
     required property Session session
     readonly property var network: session.network.active
 
-    implicitWidth: layout.implicitWidth
-    implicitHeight: layout.implicitHeight
+    device: network
 
     Component.onCompleted: {
         updateDeviceDetails();
@@ -102,110 +102,120 @@ Item {
         }
     }
 
-    ColumnLayout {
-        id: layout
-
-        anchors.left: parent.left
-        anchors.right: parent.right
-        anchors.top: parent.top
-        spacing: Appearance.spacing.normal
+    headerComponent: Component {
+        ConnectionHeader {
+            icon: root.network?.isSecure ? "lock" : "wifi"
+            title: root.network?.ssid ?? qsTr("Unknown")
+        }
+    }
 
-            ConnectionHeader {
-                icon: root.network?.isSecure ? "lock" : "wifi"
-                title: root.network?.ssid ?? qsTr("Unknown")
-            }
+    sections: [
+        Component {
+            ColumnLayout {
+                spacing: Appearance.spacing.normal
 
-            SectionHeader {
-                title: qsTr("Connection status")
-                description: qsTr("Connection settings for this network")
-            }
+                SectionHeader {
+                    title: qsTr("Connection status")
+                    description: qsTr("Connection settings for this network")
+                }
 
-            SectionContainer {
-                ToggleRow {
-                    label: qsTr("Connected")
-                    checked: root.network?.active ?? false
-                    toggle.onToggled: {
-                        if (checked) {
-                            NetworkConnection.handleConnect(root.network, root.session, null);
-                        } else {
-                            Nmcli.disconnectFromNetwork();
+                SectionContainer {
+                    ToggleRow {
+                        label: qsTr("Connected")
+                        checked: root.network?.active ?? false
+                        toggle.onToggled: {
+                            if (checked) {
+                                NetworkConnection.handleConnect(root.network, root.session, null);
+                            } else {
+                                Nmcli.disconnectFromNetwork();
+                            }
                         }
                     }
-                }
 
-                TextButton {
-                    Layout.fillWidth: true
-                    Layout.topMargin: Appearance.spacing.normal
-                    Layout.minimumHeight: Appearance.font.size.normal + Appearance.padding.normal * 2
-                    visible: {
-                        if (!root.network || !root.network.ssid) {
-                            return false;
+                    TextButton {
+                        Layout.fillWidth: true
+                        Layout.topMargin: Appearance.spacing.normal
+                        Layout.minimumHeight: Appearance.font.size.normal + Appearance.padding.normal * 2
+                        visible: {
+                            if (!root.network || !root.network.ssid) {
+                                return false;
+                            }
+                            return Nmcli.hasSavedProfile(root.network.ssid);
                         }
-                        return Nmcli.hasSavedProfile(root.network.ssid);
-                    }
-                    inactiveColour: Colours.palette.m3secondaryContainer
-                    inactiveOnColour: Colours.palette.m3onSecondaryContainer
-                    text: qsTr("Forget Network")
+                        inactiveColour: Colours.palette.m3secondaryContainer
+                        inactiveOnColour: Colours.palette.m3onSecondaryContainer
+                        text: qsTr("Forget Network")
 
-                    onClicked: {
-                        if (root.network && root.network.ssid) {
-                            if (root.network.active) {
-                                Nmcli.disconnectFromNetwork();
+                        onClicked: {
+                            if (root.network && root.network.ssid) {
+                                if (root.network.active) {
+                                    Nmcli.disconnectFromNetwork();
+                                }
+                                Nmcli.forgetNetwork(root.network.ssid);
                             }
-                            Nmcli.forgetNetwork(root.network.ssid);
                         }
                     }
                 }
             }
+        },
+        Component {
+            ColumnLayout {
+                spacing: Appearance.spacing.normal
 
-            SectionHeader {
-                title: qsTr("Network properties")
-                description: qsTr("Additional information")
-            }
+                SectionHeader {
+                    title: qsTr("Network properties")
+                    description: qsTr("Additional information")
+                }
 
-            SectionContainer {
-                contentSpacing: Appearance.spacing.small / 2
+                SectionContainer {
+                    contentSpacing: Appearance.spacing.small / 2
 
-                PropertyRow {
-                    label: qsTr("SSID")
-                    value: root.network?.ssid ?? qsTr("Unknown")
-                }
+                    PropertyRow {
+                        label: qsTr("SSID")
+                        value: root.network?.ssid ?? qsTr("Unknown")
+                    }
 
-                PropertyRow {
-                    showTopMargin: true
-                    label: qsTr("BSSID")
-                    value: root.network?.bssid ?? qsTr("Unknown")
-                }
+                    PropertyRow {
+                        showTopMargin: true
+                        label: qsTr("BSSID")
+                        value: root.network?.bssid ?? qsTr("Unknown")
+                    }
 
-                PropertyRow {
-                    showTopMargin: true
-                    label: qsTr("Signal strength")
-                    value: root.network ? qsTr("%1%").arg(root.network.strength) : qsTr("N/A")
-                }
+                    PropertyRow {
+                        showTopMargin: true
+                        label: qsTr("Signal strength")
+                        value: root.network ? qsTr("%1%").arg(root.network.strength) : qsTr("N/A")
+                    }
 
-                PropertyRow {
-                    showTopMargin: true
-                    label: qsTr("Frequency")
-                    value: root.network ? qsTr("%1 MHz").arg(root.network.frequency) : qsTr("N/A")
-                }
+                    PropertyRow {
+                        showTopMargin: true
+                        label: qsTr("Frequency")
+                        value: root.network ? qsTr("%1 MHz").arg(root.network.frequency) : qsTr("N/A")
+                    }
 
-                PropertyRow {
-                    showTopMargin: true
-                    label: qsTr("Security")
-                    value: root.network ? (root.network.isSecure ? root.network.security : qsTr("Open")) : qsTr("N/A")
+                    PropertyRow {
+                        showTopMargin: true
+                        label: qsTr("Security")
+                        value: root.network ? (root.network.isSecure ? root.network.security : qsTr("Open")) : qsTr("N/A")
+                    }
                 }
             }
+        },
+        Component {
+            ColumnLayout {
+                spacing: Appearance.spacing.normal
 
-            SectionHeader {
-                title: qsTr("Connection information")
-                description: qsTr("Network connection details")
-            }
+                SectionHeader {
+                    title: qsTr("Connection information")
+                    description: qsTr("Network connection details")
+                }
 
-            SectionContainer {
-                ConnectionInfoSection {
-                    deviceDetails: Nmcli.wirelessDeviceDetails
+                SectionContainer {
+                    ConnectionInfoSection {
+                        deviceDetails: Nmcli.wirelessDeviceDetails
+                    }
                 }
             }
-    }
-
+        }
+    ]
 }