pragma ComponentBehavior: Bound import qs.config import qs.custom import qs.services import qs.util import Quickshell import QtQuick import QtQuick.Layouts ColumnLayout { id: root property string connectingToSsid: "" spacing: 5 width: 320 Toggle { label.text: qsTr("Wifi %1".arg(Network.wifiEnabled ? "Enabled" : "Disabled")) label.font.weight: 500 checked: Network.wifiEnabled toggle.onToggled: Network.enableWifi(checked) } CustomText { Layout.topMargin: 7 text: qsTr("%1 networks available").arg(Network.networks.length) color: Config.colors.primary font.pointSize: Config.font.size.small } CustomListView { id: list Layout.fillWidth: true Layout.preferredHeight: Math.min(contentHeight, 240) spacing: 5 clip: true CustomScrollBar.vertical: CustomScrollBar { flickable: list } model: ScriptModel { values: [...Network.networks].sort((a, b) => { if (a.active !== b.active) return b.active - a.active; return b.strength - a.strength; }) } delegate: RowLayout { id: networkItem required property Network.AccessPoint modelData readonly property bool isConnecting: root.connectingToSsid === modelData.ssid readonly property bool loading: networkItem.isConnecting readonly property color iconColor: networkItem.modelData.active ? Config.colors.primary : Config.colors.inactive width: list.width - 8 spacing: 5 MaterialIcon { text: Icons.getNetworkIcon(networkItem.modelData.strength) color: iconColor MouseArea { width: networkItem.width height: networkItem.height onClicked: { if (Network.wifiEnabled && !networkItem.loading) { if (networkItem.modelData.active) { Network.disconnectFromNetwork(); } else { root.connectingToSsid = networkItem.modelData.ssid; Network.connectToNetwork(networkItem.modelData.ssid, ""); } } } } } MaterialIcon { opacity: networkItem.modelData.isSecure ? 1 : 0 text: "lock" font.pointSize: Config.font.size.smaller color: iconColor } CustomText { Layout.fillWidth: true Layout.rightMargin: 10 text: networkItem.modelData.ssid elide: Text.ElideRight font.weight: networkItem.modelData.active ? 500 : 400 color: networkItem.modelData.active ? Config.colors.secondary : Config.colors.tertiary } CustomBusyIndicator { implicitWidth: implicitHeight implicitHeight: Config.font.size.normal running: opacity > 0 opacity: networkItem.loading ? 1 : 0 Behavior on opacity { Anim {} } } } add: Transition { Anim { property: "opacity" from: 0 to: 1 } Anim { property: "scale" from: 0.7 to: 1 } } remove: Transition { Anim { property: "opacity" from: 1 to: 0 } Anim { property: "scale" from: 1 to: 0.7 } } addDisplaced: Transition { Anim { property: "y" duration: Config.anim.durations.small } Anim { properties: "opacity,scale" to: 1 } } displaced: Transition { Anim { property: "y" } Anim { properties: "opacity,scale" to: 1 } } } // Rescan button CustomRect { Layout.topMargin: 8 Layout.fillWidth: true implicitHeight: rescanBtn.implicitHeight + 10 radius: 17 color: !Network.wifiEnabled ? Config.colors.inactive : Qt.alpha(Config.colors.network, Network.scanning ? 0.8 : 1) Behavior on color { CAnim { duration: Config.anim.durations.small } } StateLayer { id: layer anchors.fill: parent color: Config.colors.primaryDark disabled: Network.scanning || !Network.wifiEnabled function onClicked(): void { Network.rescanWifi(); } } Row { id: rescanBtn anchors.centerIn: parent spacing: 7 property color color: layer.disabled ? Config.colors.bg : Config.colors.primaryDark Behavior on color { CAnim { duration: Config.anim.durations.small } } MaterialIcon { id: scanIcon anchors.verticalCenter: parent.verticalCenter animate: true text: Network.scanning ? "refresh" : "wifi_find" color: parent.color RotationAnimation on rotation { running: Network.scanning loops: Animation.Infinite from: 0 to: 360 duration: 1000 } } CustomText { anchors.verticalCenter: parent.verticalCenter text: Network.scanning ? qsTr("Scanning...") : qsTr("Rescan networks") color: parent.color } } } // Reset connecting state when network changes Connections { target: Network function onActiveChanged(): void { if (Network.active && root.connectingToSsid === Network.active.ssid) { root.connectingToSsid = ""; } } function onScanningChanged(): void { if (!Network.scanning) scanIcon.rotation = 0; } } component Toggle: RowLayout { property alias checked: toggle.checked property alias label: label property alias toggle: toggle Layout.fillWidth: true Layout.rightMargin: 5 spacing: 15 CustomText { id: label Layout.fillWidth: true } CustomSwitch { id: toggle accent: Color.mute(Config.colors.network) } } }