feat: implement client backend

This includes temporary AI-generated frontend scaffolding, none of this will be used in production. It was just used during development for the backend.
2026-10-09 19:46:02 +01:00
parent 88a64768a2
commit 5eb47e45ef
49 changed files with 3576 additions and 17 deletions
@@ -0,0 +1,95 @@
+/// TEMPORARY AI GENERATED FRONTEND \\\
+///   NOT TO BE USED IN PRODUCTION  \\\
+
+import { Theme } from "../theme.slint";
+import { Icons } from "../icons.slint";
+import { Icon } from "icon.slint";
+import { Avatar } from "avatar.slint";
+import { ToolButton } from "tool-button.slint";
+
+// Bottom-left "you" bar: avatar, name, mute / deafen / settings.
+export component UserPanel inherits Rectangle {
+    in property <string> name;
+    in property <string> user-id;
+    in property <string> initial;
+    in property <color> tint;
+    in-out property <bool> muted;
+    in-out property <bool> deafened;
+    callback open-settings();
+    callback logout();
+
+    height: 52px;
+    background: #232428;
+
+    Avatar {
+        initial: root.initial;
+        tint: root.tint;
+        diameter: 32px;
+        x: 8px;
+        y: (parent.height - self.height) / 2;
+    }
+
+    // Presence dot
+    Rectangle {
+        width: 12px;
+        height: 12px;
+        border-radius: 6px;
+        background: Theme.success;
+        border-width: 2px;
+        border-color: #232428;
+        x: 8px + 32px - 10px;
+        y: (parent.height - 32px) / 2 + 32px - 10px;
+    }
+
+    Text {
+        x: 48px;
+        y: 10px;
+        width: 100px;
+        height: 16px;
+        text: root.name;
+        color: Theme.text-header;
+        font-size: 13px;
+        font-weight: 600;
+        overflow: elide;
+    }
+
+    Text {
+        x: 48px;
+        y: 26px;
+        width: 100px;
+        height: 14px;
+        text: root.user-id;
+        color: Theme.text-muted;
+        font-size: 11px;
+        overflow: elide;
+    }
+
+    HorizontalLayout {
+        x: parent.width - self.preferred-width - 4px;
+        y: (parent.height - 28px) / 2;
+        spacing: 0px;
+        // Voice isn't wired yet: these only flip local state for now.
+        ToolButton {
+            glyph: Icons.mic;
+            tint: root.muted ? Theme.danger : Theme.text-muted;
+            clicked => {
+                root.muted = !root.muted;
+            }
+        }
+
+        ToolButton {
+            glyph: Icons.headphones;
+            tint: root.deafened ? Theme.danger : Theme.text-muted;
+            clicked => {
+                root.deafened = !root.deafened;
+            }
+        }
+
+        ToolButton {
+            glyph: Icons.logout;
+            clicked => {
+                root.logout();
+            }
+        }
+    }
+}