MVP: Go daemon, password auth, persistent PTY terminals, React/xterm UI, PWA

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
2026-09-17 10:25:35 -07:00
parent 190604247f
commit 436732dac0
35 changed files with 3576 additions and 0 deletions
@@ -0,0 +1,49 @@
+import { useState } from 'react'
+import { Term } from './api'
+
+export interface Group { id: string; label: string; icon: string; soon?: boolean }
+
+interface Props {
+  groups: Group[]; terms: Term[]; active: string | null
+  onSelect: (id: string) => void; onNew: () => void
+  onRename: (t: Term) => void; onClose: (t: Term) => void
+}
+
+export default function Rail({ groups, terms, active, onSelect, onNew, onRename, onClose }: Props) {
+  const [open, setOpen] = useState<string>('terminal')
+  return (
+    <nav className="rail">
+      {groups.map((g) => {
+        const expanded = open === g.id
+        return (
+          <div key={g.id} className={'group' + (expanded ? ' open' : '') + (g.soon ? ' soon' : '')}>
+            <button className="group-head" onClick={() => !g.soon && setOpen(expanded ? '' : g.id)} disabled={g.soon}>
+              <span className="chev">{expanded ? '▾' : '▸'}</span>
+              <span className="gicon">{g.icon}</span>
+              <span>{g.label}</span>
+              {g.soon && <span className="badge">soon</span>}
+            </button>
+            {expanded && g.id === 'terminal' && (
+              <div className="leaves">
+                {terms.map((t) => (
+                  <div key={t.id} className={'leaf' + (t.id === active ? ' active' : '') + (t.running ? '' : ' exited')}
+                    onClick={() => onSelect(t.id)}>
+                    <span className={'sdot' + (t.running ? ' run' : '')} />
+                    <span className="lname" title={t.name}>{t.name}</span>
+                    {t.id === active && (
+                      <span className="leaf-actions">
+                        <button className="icon-btn" title="rename" onClick={(e) => { e.stopPropagation(); onRename(t) }}>✎</button>
+                        <button className="icon-btn" title="close" onClick={(e) => { e.stopPropagation(); onClose(t) }}>✕</button>
+                      </span>
+                    )}
+                  </div>
+                ))}
+                <button className="leaf new" onClick={onNew}>+ New Terminal</button>
+              </div>
+            )}
+          </div>
+        )
+      })}
+    </nav>
+  )
+}