dock

Modules/Settings/Categories/Appearance.qml

@@ -5,12 +5,15 @@ import QtQuick.Layouts
 import qs.Components
 import qs.Modules as Modules
 import qs.Modules.Settings.Controls
+import qs.Modules.Settings.Categories.Appearance
 import qs.Config
 import qs.Helpers
 
-CustomRect {
+CustomFlickable {
 	id: root
 
+	contentHeight: clayout.implicitHeight
+
 	ColumnLayout {
 		id: clayout
 
@@ -108,17 +111,13 @@ CustomRect {
 			Layout.preferredHeight: idleLayout.implicitHeight + Appearance.padding.normal * 2
 			color: DynamicColors.tPalette.m3surfaceContainer
 
-			ColumnLayout {
+			Idle {
 				id: idleLayout
 
 				anchors.left: parent.left
 				anchors.margins: Appearance.padding.large
 				anchors.right: parent.right
 				anchors.verticalCenter: parent.verticalCenter
-
-				Settings {
-					name: "Idle"
-				}
 			}
 		}
 	}

Modules/Settings/Categories/Appearance/Idle.qml

@@ -0,0 +1,57 @@
+import QtQuick
+import QtQuick.Layouts
+import qs.Components
+import qs.Config
+import qs.Modules.Settings.Controls
+
+ColumnLayout {
+	id: root
+
+	function addTimeoutEntry() {
+		let list = [...Config.general.idle.timeouts];
+
+		list.push({
+			name: "New Entry",
+			timeout: 600,
+			idleAction: "lock"
+		});
+
+		Config.general.idle.timeouts = list;
+		Config.save();
+	}
+
+	function updateTimeoutEntry(i, key, value) {
+		const list = [...Config.general.idle.timeouts];
+		let entry = list[i];
+
+		entry[key] = value;
+		list[i] = entry;
+
+		Config.general.idle.timeouts = list;
+		Config.save();
+	}
+
+	Layout.fillWidth: true
+	spacing: Appearance.spacing.smaller
+
+	Repeater {
+		model: Config.general.idle.timeouts
+
+		SettingList {
+			Layout.fillWidth: true
+
+			onAddActiveActionRequested: {
+				root.updateTimeoutEntry(index, "activeAction", "");
+			}
+			onFieldEdited: function (key, value) {
+				root.updateTimeoutEntry(index, key, value);
+			}
+		}
+	}
+
+	CustomButton {
+		text: qsTr("Add timeout entry")
+
+		onClicked: root.addTimeoutEntry()
+	}
+}