improve window management and title bar

js/src/pages/streams-page.tsx

@@ -14,6 +14,7 @@ import { useAppStore } from "@/stores/app-store";
 import { useAuthStore } from "@/stores/auth-store";
 import { StreamList } from "@/features/streams/stream-list";
 import { CreateStreamDialog } from "@/features/streams/create-stream-dialog";
+import { WindowControls } from "@/components/window-controls";
 
 export function StreamsPage() {
   const networks = useAppStore((s) => s.networks);
@@ -28,13 +29,15 @@ export function StreamsPage() {
 
   return (
     <div className="flex h-screen flex-col">
-      {/* Top bar */}
-      <div className="flex items-center gap-3 border-b px-4 py-3">
+      {/* Top bar — draggable for frameless window */}
+      <div className="drag-region flex items-center gap-3 border-b px-4 py-3">
+        <WindowControls />
+
         <Select
           value={selectedNetworkId ?? undefined}
           onValueChange={(value) => setSelectedNetwork(value)}
         >
-          <SelectTrigger>
+          <SelectTrigger className="no-drag">
             <SelectValue placeholder="Select a network" />
           </SelectTrigger>
           <SelectContent>
@@ -67,7 +70,7 @@ export function StreamsPage() {
 
         {selectedNetworkId && (
           <CreateStreamDialog networkId={selectedNetworkId}>
-            <Button variant="outline" size="sm">
+            <Button variant="outline" size="sm" className="no-drag">
               <Plus className="mr-1.5 h-3.5 w-3.5" />
               New Stream
             </Button>
@@ -81,7 +84,7 @@ export function StreamsPage() {
         <Button
           variant="ghost"
           size="sm"
-          className="text-muted-foreground"
+          className="no-drag text-muted-foreground"
           onClick={signOut}
         >
           <LogOut className="h-3.5 w-3.5" />