v1.12.1: rich status indicator + server-side workspace pane sync
Status indicator (StatusDot): drops the flat amber pulse for a richer set of states — orbiting amber for streaming, spinning sky ring for tool_running, static violet for waiting_for_input, plus the existing idle/error. Backend chat_status frame widens from 'working|idle|error' to discriminate streaming vs tool execution vs paused for user input. Workspace pane sync: pane layout moves from per-device localStorage to server-side sessions.workspace_panes jsonb. PATCH /api/sessions/:id/workspace broadcasts session_workspace_updated on the user channel for cross-device live sync. Echo dedup via JSON comparison so the round-trip frame doesn't loop. Legacy localStorage seeds the server on first hydrate, then is deleted. Deprecated session_panes table dropped. Resilience: startup sweep marks any stale 'streaming' message older than 5 minutes as 'failed' so v1.12.0-style hung rows clear on container restart. useWorkspacePanes gains validatePanes() to prune dead chatId references from saved pane state when the chat list lands. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -4,9 +4,14 @@ import { toast } from 'sonner';
|
||||
import { api } from '@/api/client';
|
||||
import type { WorkspacePane } from '@/api/types';
|
||||
import { setActivePaneInfo, clearActivePane } from '@/hooks/useActivePane';
|
||||
import { sessionEvents } from '@/hooks/sessionEvents';
|
||||
|
||||
export const MAX_PANES = 5;
|
||||
const STORAGE_KEY = 'boocode.workspace.panes';
|
||||
// v1.12.1: legacy localStorage key. Read once on mount to seed the server
|
||||
// for sessions still on per-device state, then deleted. Server is now
|
||||
// authoritative via sessions.workspace_panes.
|
||||
const LEGACY_STORAGE_KEY = 'boocode.workspace.panes';
|
||||
const SAVE_DEBOUNCE_MS = 300;
|
||||
|
||||
function generateId(): string {
|
||||
return crypto.randomUUID();
|
||||
@@ -51,9 +56,11 @@ function nonSettingsCount(panes: WorkspacePane[]): number {
|
||||
return panes.reduce((n, p) => n + (p.kind === 'settings' ? 0 : 1), 0);
|
||||
}
|
||||
|
||||
function loadPanes(sessionId: string): WorkspacePane[] | null {
|
||||
// v1.12.1: read legacy per-device localStorage. If present, the caller seeds
|
||||
// the server then deletes the key. One-time migration per session.
|
||||
function readLegacyPanes(sessionId: string): WorkspacePane[] | null {
|
||||
try {
|
||||
const raw = localStorage.getItem(`${STORAGE_KEY}.${sessionId}`);
|
||||
const raw = localStorage.getItem(`${LEGACY_STORAGE_KEY}.${sessionId}`);
|
||||
if (!raw) return null;
|
||||
const parsed = JSON.parse(raw) as WorkspacePane[];
|
||||
if (!Array.isArray(parsed) || parsed.length === 0) return null;
|
||||
@@ -63,15 +70,6 @@ function loadPanes(sessionId: string): WorkspacePane[] | null {
|
||||
}
|
||||
}
|
||||
|
||||
function savePanes(sessionId: string, panes: WorkspacePane[]): void {
|
||||
try {
|
||||
localStorage.setItem(
|
||||
`${STORAGE_KEY}.${sessionId}`,
|
||||
JSON.stringify(persistablePanes(panes)),
|
||||
);
|
||||
} catch { /* quota or disabled */ }
|
||||
}
|
||||
|
||||
export interface UseWorkspacePanesResult {
|
||||
panes: WorkspacePane[];
|
||||
activePaneIdx: number;
|
||||
@@ -96,6 +94,7 @@ export interface UseWorkspacePanesResult {
|
||||
removePane: (idx: number) => void;
|
||||
removeChatFromPanes: (chatId: string) => void;
|
||||
initializeFirstChatIfEmpty: (chatId: string) => void;
|
||||
validatePanes: (validChatIds: Set<string>) => void;
|
||||
handlePaneDragStart: (idx: number) => (e: DragEvent<HTMLDivElement>) => void;
|
||||
handlePaneDragOver: (idx: number) => (e: DragEvent<HTMLDivElement>) => void;
|
||||
handlePaneDragLeave: () => void;
|
||||
@@ -106,15 +105,85 @@ export interface UseWorkspacePanesResult {
|
||||
}
|
||||
|
||||
export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
|
||||
const [panes, setPanes] = useState<WorkspacePane[]>(() => {
|
||||
return loadPanes(sessionId) ?? [emptyPane()];
|
||||
});
|
||||
const [panes, setPanes] = useState<WorkspacePane[]>(() => [emptyPane()]);
|
||||
const [activePaneIdx, setActivePaneIdx] = useState(0);
|
||||
const draggingIdxRef = useRef<number | null>(null);
|
||||
const [dragOverIdx, setDragOverIdx] = useState<number | null>(null);
|
||||
// v1.12.1: skip PATCH while hydrating from the server. Without this, the
|
||||
// initial [emptyPane()] would be saved over the server's real state before
|
||||
// the GET resolves.
|
||||
const hydratedRef = useRef(false);
|
||||
// Tracks the last value broadcast by another device (or this one's own
|
||||
// round-trip). If a PATCH would echo this exact payload, we skip the call.
|
||||
const lastRemoteJsonRef = useRef<string>('[]');
|
||||
|
||||
// v1.12.1: hydrate from server on mount, then subscribe to remote updates.
|
||||
useEffect(() => {
|
||||
savePanes(sessionId, panes);
|
||||
hydratedRef.current = false;
|
||||
let cancelled = false;
|
||||
void (async () => {
|
||||
try {
|
||||
const session = await api.sessions.get(sessionId);
|
||||
if (cancelled) return;
|
||||
let initial: WorkspacePane[] = Array.isArray(session.workspace_panes)
|
||||
? session.workspace_panes
|
||||
: [];
|
||||
// One-time migration: if server is empty but legacy localStorage has
|
||||
// a layout, seed the server and delete the local key.
|
||||
if (initial.length === 0) {
|
||||
const legacy = readLegacyPanes(sessionId);
|
||||
if (legacy && legacy.length > 0) {
|
||||
try {
|
||||
const updated = await api.sessions.updateWorkspacePanes(sessionId, legacy);
|
||||
if (cancelled) return;
|
||||
initial = updated.workspace_panes;
|
||||
localStorage.removeItem(`${LEGACY_STORAGE_KEY}.${sessionId}`);
|
||||
} catch {
|
||||
initial = legacy;
|
||||
}
|
||||
}
|
||||
}
|
||||
const next = initial.length > 0 ? initial : [emptyPane()];
|
||||
lastRemoteJsonRef.current = JSON.stringify(persistablePanes(next));
|
||||
setPanes(next);
|
||||
setActivePaneIdx(0);
|
||||
} finally {
|
||||
if (!cancelled) hydratedRef.current = true;
|
||||
}
|
||||
})();
|
||||
return () => { cancelled = true; };
|
||||
}, [sessionId]);
|
||||
|
||||
// v1.12.1: live cross-device sync. Replace local state when another device
|
||||
// (or our own write echo) lands a session_workspace_updated frame.
|
||||
useEffect(() => {
|
||||
return sessionEvents.subscribe((ev) => {
|
||||
if (ev.type !== 'session_workspace_updated') return;
|
||||
if (ev.session_id !== sessionId) return;
|
||||
const incoming = Array.isArray(ev.workspace_panes) ? ev.workspace_panes : [];
|
||||
const json = JSON.stringify(incoming);
|
||||
if (json === lastRemoteJsonRef.current) return;
|
||||
lastRemoteJsonRef.current = json;
|
||||
setPanes(incoming.length > 0 ? incoming : [emptyPane()]);
|
||||
setActivePaneIdx((prev) => Math.min(prev, Math.max(0, incoming.length - 1)));
|
||||
});
|
||||
}, [sessionId]);
|
||||
|
||||
// v1.12.1: debounced PATCH on every change. Settings panes are stripped
|
||||
// before saving (ephemeral per v1.9).
|
||||
useEffect(() => {
|
||||
if (!hydratedRef.current) return;
|
||||
const payload = persistablePanes(panes);
|
||||
const json = JSON.stringify(payload);
|
||||
if (json === lastRemoteJsonRef.current) return;
|
||||
const timer = setTimeout(() => {
|
||||
lastRemoteJsonRef.current = json;
|
||||
api.sessions.updateWorkspacePanes(sessionId, payload).catch(() => {
|
||||
// Non-fatal: next change retries. Persistent failures surface via
|
||||
// the network layer's existing reconnect toast.
|
||||
});
|
||||
}, SAVE_DEBOUNCE_MS);
|
||||
return () => clearTimeout(timer);
|
||||
}, [sessionId, panes]);
|
||||
|
||||
useEffect(() => {
|
||||
@@ -328,6 +397,23 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
|
||||
});
|
||||
}, []);
|
||||
|
||||
const validatePanes = useCallback((validChatIds: Set<string>) => {
|
||||
setPanes((prev) => {
|
||||
const cleaned = prev.map((pane) => {
|
||||
if (pane.kind !== 'chat' || pane.chatIds.length === 0) return pane;
|
||||
const nextIds = pane.chatIds.filter((id) => validChatIds.has(id));
|
||||
if (nextIds.length === pane.chatIds.length) return pane;
|
||||
if (nextIds.length === 0) {
|
||||
return { ...pane, kind: 'empty' as const, chatId: undefined, chatIds: [], activeChatIdx: -1 };
|
||||
}
|
||||
const nextActiveIdx = Math.min(pane.activeChatIdx, nextIds.length - 1);
|
||||
return { ...pane, chatIds: nextIds, activeChatIdx: nextActiveIdx, chatId: nextIds[nextActiveIdx] };
|
||||
});
|
||||
const unchanged = cleaned.every((p, i) => p === prev[i]);
|
||||
return unchanged ? prev : cleaned;
|
||||
});
|
||||
}, []);
|
||||
|
||||
const removeChatFromPanes = useCallback((chatId: string) => {
|
||||
setPanes((prev) => prev.map((p) => {
|
||||
const idx = p.chatIds.indexOf(chatId);
|
||||
@@ -411,6 +497,7 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
|
||||
removePane,
|
||||
removeChatFromPanes,
|
||||
initializeFirstChatIfEmpty,
|
||||
validatePanes,
|
||||
handlePaneDragStart,
|
||||
handlePaneDragOver,
|
||||
handlePaneDragLeave,
|
||||
|
||||
Reference in New Issue
Block a user