merge from main, settings window wifi updates, component creation, remove known network window

Modules/Settings/Pages/NetworkPage.qml

@@ -15,6 +15,9 @@ PageBase {
 
 	title: qsTr("Network")
 
+	Component.onCompleted: Network.active = true
+	Component.onDestruction: Network.active = false
+
 	ColumnLayout {
 		id: networkContent
 
@@ -60,6 +63,13 @@ PageBase {
 					}
 				}
 
+				DelegateChoice {
+					roleValue: false
+
+					delegate: KnownNetworkManager {
+					}
+				}
+
 				DelegateChoice {
 					delegate: NetworkItem {
 						list: rows
@@ -85,7 +95,11 @@ PageBase {
 									isDivider: true,
 									type: "known"
 								},
-								...kNetworks.sort(byStrengthName)] : []), ...(uNetworks.length > 0 ? [
+								...kNetworks.sort(byStrengthName),
+								{
+									isDivider: false
+								}
+							] : []), ...(uNetworks.length > 0 ? [
 								{
 									isDivider: true,
 									type: "unknown"
@@ -118,28 +132,33 @@ PageBase {
 			}
 		}
 
-		KNetworkList {
-			acceptLabel: qsTr("Remove")
-			enabled: Object.keys(model).length > 0
-			header: qsTr("Manage known networks")
-			icon: "Network_Manage"
-			label: qsTr("Show all known networks")
-			model: Network.networks.filter(n => n.known && !n.connected).map(n => ({
-						id: n.id,
-						label: n.name
-					}))
-			rootParent: root.flickable
-
-			onAccepted: {
-				if (!selectedItem)
-					return;
-
-				Network.forgetNetworks(Network.networks.find(n => n.id === selectedItem));
-			}
+		NetworkOverlay {
+			anchors.centerIn: parent
 		}
 	}
 
-	component KNetworkList: DialogRowButton {
+	component KnownNetworkManager: NetworkSelect {
+		acceptLabel: qsTr("Remove")
+		enabled: Object.keys(model).length > 0
+		header: qsTr("Manage known networks")
+		icon: "Network_Manage"
+		label: qsTr("Manage known networks")
+		model: Network.networks.filter(n => n.known && !n.connected).map(n => ({
+					id: n.name,
+					label: n.name
+				}))
+		rootParent: root.flickable
+		width: rows.width
+
+		onAccepted: {
+			if (!selectedItem)
+				return;
+
+			const networkToForget = Network.networks.find(n => n.name === selectedItem);
+			Network.forgetNetwork(networkToForget);
+		}
+	}
+	component NetworkSelect: DialogRowButton {
 		id: klist
 
 		required property var model
@@ -154,7 +173,7 @@ PageBase {
 		}
 
 		acceptAllowed: !!selectedItem
-		horizontalContentMargin: -Tokens.padding.small
+		horizontalContentMargin: -Tokens.padding.extraSmall
 		separateContent: true
 
 		content: Component {
@@ -174,8 +193,8 @@ PageBase {
 					anchors.margins: 1 // Gets cut off for some reason without this
 					anchors.right: ListView.view.contentItem.right
 					color: Qt.alpha(Colors.palette.m3tertiaryContainer, selected ? 1 : 0)
-					implicitHeight: label.implicitHeight + Tokens.padding.normal * 2
-					radius: stateLayer.pressed ? Tokens.rounding.extraSmall : selected ? Tokens.rounding.large : Tokens.rounding.normal
+					implicitHeight: label.implicitHeight + Tokens.padding.small * 2
+					radius: stateLayer.pressed ? Tokens.rounding.extraSmall : selected ? Tokens.rounding.largeIncreased : Tokens.rounding.medium
 
 					Behavior on radius {
 						Anim {
@@ -195,7 +214,7 @@ PageBase {
 						anchors.left: parent.left
 						anchors.margins: Tokens.padding.large
 						anchors.right: item.selected ? checkIcon.left : parent.right
-						anchors.rightMargin: item.selected ? Tokens.spacing.normal : anchors.margins
+						anchors.rightMargin: item.selected ? Tokens.spacing.medium : anchors.margins
 						anchors.verticalCenter: parent.verticalCenter
 						color: item.selected ? Colors.palette.m3onTertiaryContainer : Colors.palette.m3onSurface
 						elide: Text.ElideRight
@@ -210,7 +229,7 @@ PageBase {
 						anchors.right: parent.right
 						anchors.verticalCenter: parent.verticalCenter
 						color: Colors.palette.m3onTertiaryContainer
-						font.pointSize: Tokens.font.size.medium
+						font.pointSize: Tokens.font.size.normal
 						opacity: item.selected ? 1 : 0
 						text: "check"