feat(ui): action columns with collapsible groups

2026-06-11 21:32:13 -05:00
parent 08d186f42e
commit bbded8a266
6 changed files with 241 additions and 114 deletions
@@ -0,0 +1,23 @@
+import type { ActionGroupView } from '../state/viewModel';
+import { ActionGroup } from './ActionGroup';
+
+interface ActionColumnProps {
+  label: string;
+  groups: ActionGroupView[];
+  actionKind: string;
+}
+
+export function ActionColumn({ label, groups, actionKind }: ActionColumnProps) {
+  return (
+    <div className="w-80 min-w-80 shrink-0 flex flex-col gap-4 bg-slate-900/40 rounded-xl p-4 border border-slate-800/60">
+      <h2 className="font-bold text-slate-200 text-sm uppercase tracking-widest border-b border-slate-800 pb-2 select-none">
+        {label}
+      </h2>
+      <div className="flex flex-col gap-3">
+        {groups.map((group) => (
+          <ActionGroup key={group.id} group={group} actionKind={actionKind} />
+        ))}
+      </div>
+    </div>
+  );
+}