refactor: use entries directly in bar object instead of nested components + various fixes and additions to settings

Modules/Settings/Pages/Panels/Bar/BarStatusIcons.qml

@@ -7,6 +7,12 @@ import qs.Modules.Settings.Common
 PageBase {
 	id: root
 
+	readonly property var builtinIcons: ({
+			audio: qsTr("Speakers"),
+			microphone: qsTr("Microphone"),
+			power: qsTr("Battery")
+		})
+
 	isSubPage: true
 	title: qsTr("System icons")
 
@@ -22,77 +28,89 @@ PageBase {
 			text: qsTr("Visible icons")
 		}
 
-		ToggleRow {
-			checked: Config.bar.tray.showAudio
+		ListEditor {
+			function labelFor(item: var): string {
+				const prettyName = root.builtinIcons[item.id];
+				if (prettyName)
+					return prettyName;
+				const label = item.id.replace(/([A-Z])/g, " $1");
+				return label.charAt(0).toUpperCase() + label.slice(1).toLowerCase();
+			}
+
+			function toggledFor(item: var): bool {
+				return item.enabled;
+			}
+
 			first: true
-			settingAnchor: "bar-status-speakers"
-			text: qsTr("Speakers")
+			values: Config.bar.tray.statusIcons.map(item => JSON.parse(JSON.stringify(item)))
+			z: 1
 
-			onToggled: Config.bar.tray.showAudio = checked
+			onItemMoved: (from, to) => {
+				const icons = Config.bar.tray.statusIcons.slice();
+				const [moved] = icons.splice(from, 1);
+				icons.splice(to, 0, moved);
+				Config.bar.tray.statusIcons = icons;
+			}
+			onItemRemoved: index => {
+				const icons = Config.bar.tray.statusIcons.slice();
+				icons.splice(index, 1);
+				Config.bar.tray.statusIcons = icons;
+			}
+			onItemToggled: (index, checked) => {
+				const icons = Config.bar.tray.statusIcons.slice();
+				icons[index] = Object.assign({}, icons[index], {
+					enabled: checked
+				});
+				Config.bar.tray.statusIcons = icons;
+			}
 		}
 
-		ToggleRow {
-			checked: Config.bar.tray.showMicrophone
-			settingAnchor: "bar-status-mic"
-			text: qsTr("Microphone")
+		DialogSelectButton {
+			id: addItemContainer
 
-			onToggled: Config.bar.tray.showMicrophone = checked
+			acceptLabel: qsTr("Add")
+			enabled: {
+				console.log(Object.keys(model).length);
+				return Object.keys(model).length > 0;
+			}
+			header: qsTr("Add new entry")
+			icon: "add"
+			label: qsTr("Add entry")
+			model: {
+				const present = new Set(Config.bar.tray.statusIcons.map(item => item.id));
+				return Object.keys(root.builtinIcons).filter(id => !present.has(id)).map(id => ({
+							id: id,
+							label: root.builtinIcons[id]
+						}));
+			}
+			rootParent: root.flickable
+
+			onAccepted: {
+				if (!selectedItem)
+					return;
+
+				const icons = Config.bar.tray.statusIcons.slice();
+				icons.push({
+					id: selectedItem,
+					enabled: true
+				});
+				Config.bar.tray.statusIcons = icons;
+			}
 		}
 
-		//////// FOR LATER:
-		// ToggleRow {
-		// 	checked: Config.bar.tray.showNetwork
-		// 	text: qsTr("Network")
-		//
-		// 	onToggled: Config.bar.tray.showNetwork = checked
-		// }
-		//
-		// ToggleRow {
-		// 	checked: Config.bar.tray.showWifi
-		// 	text: qsTr("Wi-Fi")
-		//
-		// 	onToggled: Config.bar.tray.showWifi = checked
-		// }
-		//
-		// ToggleRow {
-		// 	checked: Config.bar.tray.showBluetooth
-		// 	text: qsTr("Bluetooth")
-		//
-		// 	onToggled: Config.bar.tray.showBluetooth = checked
-		// }
-
-		ToggleRow {
-			checked: Config.bar.tray.showPower
-			last: true
-			settingAnchor: "bar-status-power"
-			text: qsTr("Battery")
-
-			onToggled: Config.bar.tray.showPower = checked
-		}
-
-		// Behaviour
+		// Behavior
 		SectionHeader {
 			text: qsTr("Behavior")
 		}
 
 		ToggleRow {
-			checked: Config.bar.popouts.audio
+			checked: Config.bar.popouts.statusIcons
 			first: true
-			settingAnchor: "bar-status-audio-popout"
-			subtext: qsTr("Show a details popout when hovering the audio icons")
-			text: qsTr("Audio popout on hover")
+			settingAnchor: "bar-status-popout-on-hover"
+			subtext: qsTr("Show a details popout when hovering the status icons")
+			text: qsTr("Popout on hover")
 
-			onToggled: Config.bar.popouts.audio = checked
-		}
-
-		ToggleRow {
-			checked: Config.bar.popouts.upower
-			last: true
-			settingAnchor: "bar-status-power-popout"
-			subtext: qsTr("Show a details popout when hovering the power icon")
-			text: qsTr("Power popout on hover")
-
-			onToggled: Config.bar.popouts.upower = checked
+			onToggled: Config.bar.popouts.statusIcons = checked
 		}
 	}
 }

Modules/Settings/Pages/Panels/Bar/BarTray.qml

@@ -28,8 +28,18 @@ PageBase {
 			onMoved: value => Config.bar.tray.trayIconSize = value
 		}
 
+		ToggleRow {
+			checked: Config.bar.popouts.tray
+			settingAnchor: "bar-tray-enable-tray-popouts"
+			subtext: Config.bar.popouts.tray ? qsTr("Enabled") : qsTr("Disabled")
+			text: qsTr("Enable tray menu popouts")
+
+			onToggled: Config.bar.popouts.tray = checked
+		}
+
 		ToggleRow {
 			checked: Config.bar.tray.showOnHover
+			enabled: Config.bar.popouts.tray
 			settingAnchor: "bar-tray-show-popout-on-hover"
 			subtext: Config.bar.tray.showOnHover ? qsTr("Will show context menu on hover") : qsTr("Will show context menu on right-click")
 			text: qsTr("Show popout on hover")