From a33fc66b15f9b1ca43b61298f5b15e656810d9db Mon Sep 17 00:00:00 2001
From: matt1432 <matt@nelim.org>
Date: Sat, 14 Dec 2024 22:14:56 -0500
Subject: [PATCH] fix(ags audio): misc fixes

---
 .../ags/config/widgets/audio/main.tsx         |  51 +++++--
 .../ags/config/widgets/audio/profiles.tsx     |  64 ++++----
 .../ags/config/widgets/audio/streams.tsx      | 137 +++++++++---------
 3 files changed, 140 insertions(+), 112 deletions(-)

diff --git a/nixosModules/ags/config/widgets/audio/main.tsx b/nixosModules/ags/config/widgets/audio/main.tsx
index 3a93d938..f0dde3ac 100644
--- a/nixosModules/ags/config/widgets/audio/main.tsx
+++ b/nixosModules/ags/config/widgets/audio/main.tsx
@@ -24,23 +24,44 @@ export default () => {
             transitionType={Gtk.StackTransitionType.SLIDE_LEFT_RIGHT}
         >
 
-            <scrollable name="outputs" hscroll={Gtk.PolicyType.NEVER}>
-                <box vertical>
-                    {bind(audio, 'speakers').as(Streams)}
-                </box>
-            </scrollable>
+            <scrollable
+                name="outputs"
+                hscroll={Gtk.PolicyType.NEVER}
 
-            <scrollable name="inputs" hscroll={Gtk.PolicyType.NEVER}>
-                <box vertical>
-                    {bind(audio, 'microphones').as(Streams)}
-                </box>
-            </scrollable>
+                setup={(self) => setTimeout(() => {
+                    self.add((
+                        <box vertical>
+                            {bind(audio, 'speakers').as(Streams)}
+                        </box>
+                    ));
+                }, 1000)}
+            />
 
-            <scrollable name="profiles" hscroll={Gtk.PolicyType.NEVER}>
-                <box vertical>
-                    {bind(audio, 'devices').as(Profiles)}
-                </box>
-            </scrollable>
+            <scrollable
+                name="inputs"
+                hscroll={Gtk.PolicyType.NEVER}
+
+                setup={(self) => setTimeout(() => {
+                    self.add((
+                        <box vertical>
+                            {bind(audio, 'microphones').as(Streams)}
+                        </box>
+                    ));
+                }, 1000)}
+            />
+
+            <scrollable
+                name="profiles"
+                hscroll={Gtk.PolicyType.NEVER}
+
+                setup={(self) => setTimeout(() => {
+                    self.add((
+                        <box vertical>
+                            {bind(audio, 'devices').as(Profiles)}
+                        </box>
+                    ));
+                }, 1000)}
+            />
 
         </stack>
     ) as Widget.Stack;
diff --git a/nixosModules/ags/config/widgets/audio/profiles.tsx b/nixosModules/ags/config/widgets/audio/profiles.tsx
index e9e14654..948b6515 100644
--- a/nixosModules/ags/config/widgets/audio/profiles.tsx
+++ b/nixosModules/ags/config/widgets/audio/profiles.tsx
@@ -5,40 +5,42 @@ import AstalWp from 'gi://AstalWp';
 import { ComboBoxText } from '../misc/subclasses';
 
 
-export default (devices: AstalWp.Device[]) => devices.map((device) => (
-    <box className="stream" vertical>
+export default (devices: AstalWp.Device[]) => devices
+    .sort((a, b) => a.description.localeCompare(b.description))
+    .map((device) => (
+        <box className="stream" vertical>
 
-        <label label={bind(device, 'description')} />
+            <label label={bind(device, 'description')} />
 
-        <ComboBoxText
-            setup={(self) => {
-                const profiles = (device.get_profiles() ?? []).sort((a, b) => {
-                    if (a.description === 'Off') {
-                        return 1;
-                    }
-                    else if (b.description === 'Off') {
-                        return -1;
-                    }
-                    else {
-                        return a.description.localeCompare(b.description);
-                    }
-                });
+            <ComboBoxText
+                setup={(self) => {
+                    const profiles = (device.get_profiles() ?? []).sort((a, b) => {
+                        if (a.description === 'Off') {
+                            return 1;
+                        }
+                        else if (b.description === 'Off') {
+                            return -1;
+                        }
+                        else {
+                            return a.description.localeCompare(b.description);
+                        }
+                    });
 
-                profiles.forEach((profile) => {
-                    self.append(profile.index.toString(), profile.description);
-                });
+                    profiles.forEach((profile) => {
+                        self.append(profile.index.toString(), profile.description);
+                    });
 
-                self.set_active(
-                    profiles.indexOf(
-                        device.get_profile(device.get_active_profile())!,
-                    ),
-                );
-            }}
+                    self.set_active(
+                        profiles.indexOf(
+                            device.get_profile(device.get_active_profile())!,
+                        ),
+                    );
+                }}
 
-            onChanged={(self) => {
-                device.set_active_profile(parseInt(self.activeId));
-            }}
-        />
+                onChanged={(self) => {
+                    device.set_active_profile(parseInt(self.activeId));
+                }}
+            />
 
-    </box>
-));
+        </box>
+    ));
diff --git a/nixosModules/ags/config/widgets/audio/streams.tsx b/nixosModules/ags/config/widgets/audio/streams.tsx
index e4487361..692f9ea7 100644
--- a/nixosModules/ags/config/widgets/audio/streams.tsx
+++ b/nixosModules/ags/config/widgets/audio/streams.tsx
@@ -10,82 +10,87 @@ import Separator from '../misc/separator';
 export default (streams: AstalWp.Endpoint[]) => {
     let group: RadioButton | undefined;
 
-    return streams.map((stream) => (
-        <box className="stream" vertical>
+    return streams
+        .sort((a, b) => a.description.localeCompare(b.description))
+        .map((stream) => (
+            <box className="stream" vertical>
 
-            <box className="title">
+                <box className="title">
 
-                <RadioButton
-                    cursor="pointer"
-                    css="margin-top: 1px;"
+                    <RadioButton
+                        cursor="pointer"
+                        css="margin-top: 1px;"
 
-                    active={bind(stream, 'isDefault')}
-
-                    onRealize={(self) => {
-                        if (!group) {
-                            group = self;
-                        }
-                        else {
-                            self.group = group;
-                        }
-                    }}
-
-                    onButtonReleaseEvent={() => {
-                        stream.isDefault = true;
-                    }}
-                />
-
-                <Separator size={8} />
-
-                <label label={bind(stream, 'description')} />
-
-            </box>
-
-            <Separator size={4} vertical />
-
-            <box className="body">
-
-                <button
-                    cursor="pointer"
-                    className="toggle"
-                    valign={Gtk.Align.END}
-
-                    onButtonReleaseEvent={() => {
-                        stream.mute = !stream.mute;
-                    }}
-                >
-                    <icon
-                        icon={bind(stream, 'mute').as((isMuted) => {
-                            if (stream.mediaClass === AstalWp.MediaClass.AUDIO_MICROPHONE) {
-                                return isMuted ?
-                                    'audio-input-microphone-muted-symbolic' :
-                                    'audio-input-microphone-symbolic';
+                        onRealize={(self) => {
+                            if (!group) {
+                                group = self;
                             }
                             else {
-                                return isMuted ?
-                                    'audio-volume-muted-symbolic' :
-                                    'audio-speakers-symbolic';
+                                self.group = group;
                             }
-                        })}
+
+                            self.active = stream.isDefault;
+                            self.hook(stream, 'notify::is-default', () => {
+                                self.active = stream.isDefault;
+                            });
+                        }}
+
+                        onButtonReleaseEvent={() => {
+                            stream.isDefault = true;
+                        }}
                     />
-                </button>
 
-                <Separator size={4} />
+                    <Separator size={8} />
 
-                <slider
-                    hexpand
-                    halign={Gtk.Align.FILL}
-                    drawValue
-                    cursor="pointer"
+                    <label label={bind(stream, 'description')} />
 
-                    value={bind(stream, 'volume')}
-                    onDragged={(self) => {
-                        stream.set_volume(self.value);
-                    }}
-                />
+                </box>
+
+                <Separator size={4} vertical />
+
+                <box className="body">
+
+                    <button
+                        cursor="pointer"
+                        className="toggle"
+                        valign={Gtk.Align.END}
+
+                        onButtonReleaseEvent={() => {
+                            stream.mute = !stream.mute;
+                        }}
+                    >
+                        <icon
+                            icon={bind(stream, 'mute').as((isMuted) => {
+                                if (stream.mediaClass === AstalWp.MediaClass.AUDIO_MICROPHONE) {
+                                    return isMuted ?
+                                        'audio-input-microphone-muted-symbolic' :
+                                        'audio-input-microphone-symbolic';
+                                }
+                                else {
+                                    return isMuted ?
+                                        'audio-volume-muted-symbolic' :
+                                        'audio-speakers-symbolic';
+                                }
+                            })}
+                        />
+                    </button>
+
+                    <Separator size={4} />
+
+                    <slider
+                        hexpand
+                        halign={Gtk.Align.FILL}
+                        drawValue
+                        cursor="pointer"
+
+                        value={bind(stream, 'volume')}
+                        onDragged={(self) => {
+                            stream.set_volume(self.value);
+                        }}
+                    />
+
+                </box>
 
             </box>
-
-        </box>
-    ));
+        ));
 };