refactor: rename some flake attr directories

modules/ags/config/widgets/audio/streams.tsx

@@ -0,0 +1,96 @@
+import { bind } from 'astal';
+import { Gtk } from 'astal/gtk3';
+
+import AstalWp from 'gi://AstalWp';
+
+import { RadioButton } from '../misc/subclasses';
+import Separator from '../misc/separator';
+
+
+export default (streams: AstalWp.Endpoint[]) => {
+    let group: RadioButton | undefined;
+
+    return streams
+        .sort((a, b) => a.description.localeCompare(b.description))
+        .map((stream) => (
+            <box className="stream" vertical>
+
+                <box className="title">
+
+                    <RadioButton
+                        cursor="pointer"
+                        css="margin-top: 1px;"
+
+                        onRealize={(self) => {
+                            if (!group) {
+                                group = self;
+                            }
+                            else {
+                                self.group = group;
+                            }
+
+                            self.active = stream.isDefault;
+                            self.hook(stream, 'notify::is-default', () => {
+                                self.active = stream.isDefault;
+                            });
+                        }}
+
+                        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';
+                                }
+                                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>
+        ));
+};