Give Sound the whole story, and keep the buttons inside the card

Claude-Session: https://claude.ai/code/session_01Ms2FbjQy31TVf3CEvQhGM8
2026-08-24 11:39:16 -04:00
parent 9bc68ba358
commit b58371bb35
38 changed files with 3884 additions and 213 deletions
@@ -0,0 +1,103 @@
+// The alert sound, chosen from the sound themes installed on the machine.
+//
+// A theme name means nothing on paper -- "freedesktop" and "Yaru" are two words
+// that sound like nothing -- so the row carries a Preview beside the value and
+// plays the theme that is set right now. It is the same shape as PickerRow,
+// which cannot take a second trailing control.
+
+import QtQuick
+import qs.config
+import qs.services
+
+Column {
+    id: root
+
+    property bool expanded: false
+    property bool divider: true
+
+    // [{ name, directory }] -- the display name from index.theme, and the
+    // directory name, which is what the gsettings key actually stores.
+    readonly property var themes: SoundFeedback.themes ?? []
+    readonly property string current: String(SoundFeedback.soundTheme ?? "")
+
+    readonly property var currentTheme:
+        root.themes.find(theme => String(theme.directory ?? theme.name) === root.current) ?? null
+    readonly property string currentLabel: root.currentTheme
+        ? String(root.currentTheme.name ?? root.currentTheme.directory)
+        : root.current
+
+    width: parent ? parent.width : 620
+    spacing: 0
+
+    SettingRow {
+        id: headline
+
+        width: parent.width
+        label: "Alert sound"
+        detail: "Played by notifications — Panama's own included — and by applications that ask for attention"
+        activatable: root.themes.length > 0
+        divider: root.divider && !root.expanded
+        controlWidth: Math.max(210, trailingControls.implicitWidth + 8)
+        onActivated: root.expanded = !root.expanded
+
+        Row {
+            id: trailingControls
+
+            anchors.right: parent.right
+            anchors.verticalCenter: parent.verticalCenter
+            spacing: 9
+
+            SettingsButton {
+                anchors.verticalCenter: parent.verticalCenter
+                text: "Preview"
+                enabled: !SoundFeedback.busy
+                onClicked: SoundFeedback.previewAlert()
+            }
+
+            Text {
+                anchors.verticalCenter: parent.verticalCenter
+                text: root.currentLabel
+                color: Theme.fgDim
+                font.family: Theme.fontFamily
+                font.pixelSize: Theme.fontSize
+                elide: Text.ElideRight
+            }
+
+            Text {
+                anchors.verticalCenter: parent.verticalCenter
+                visible: root.themes.length > 0
+                text: root.expanded ? "▴" : "▾"
+                color: Theme.fgMuted
+                font.family: Theme.fontFamily
+                font.pixelSize: Theme.fontSizeSmall
+            }
+        }
+    }
+
+    Column {
+        width: parent.width
+        visible: root.expanded
+
+        Repeater {
+            model: root.themes
+
+            TextRow {
+                required property var modelData
+                required property int index
+
+                readonly property string directory: String(modelData.directory ?? modelData.name)
+
+                width: parent.width
+                label: String(modelData.name ?? modelData.directory)
+                value: directory === root.current ? "Current" : ""
+                controlWidth: 90
+                divider: index < root.themes.length - 1
+                activatable: directory !== root.current
+                onActivated: {
+                    SoundFeedback.setSoundTheme(directory);
+                    root.expanded = false;
+                }
+            }
+        }
+    }
+}