@parhelia/core 0.3.12771 → 0.3.12788

package/dist/editor/client/EditorShell.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useState, useEffect, useLayoutEffect, useRef, useCallback, useMemo, startTransition, } from "react";
 import { toast } from "sonner";
 import { isPerfTraceActive, perfTracePaintStep, perfTraceStep, } from "../perfTrace";
@@ -18,6 +18,7 @@ import { executeFieldAction as executeFieldServerAction, connectSocket, getEditH
 import { emitAgentDocumentsChanged } from "../services/agentService";
 import { onSocketReconnect as onAgentSocketReconnect } from "../services/agentSubscriptionRegistry";
 import { useEditorWebSocket } from "./hooks/useEditorWebSocket";
+import { useClientInfoRegistration } from "./hooks/useClientInfoRegistration";
 import { getEditorRealtime } from "./realtime/realtimeTransport";
 import { createEditorSocketDiagnostics, } from "./socketDiagnostics";
 import { localStorageService } from "../services/localStorageService";
@@ -262,6 +263,16 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         suppressNextSelectionAutoScrollRef.current = false;
         return suppressed;
     }, []);
+    // Armed by the post-operation auto-focus below for the same reason as
+    // selectWithoutAutoScroll: a moved component's field still measures at its
+    // pre-move rect until the canvas refresh lands, so the focused-field
+    // auto-scroll must skip exactly that programmatic focus.
+    const suppressNextFocusedFieldAutoScrollRef = useRef(false);
+    const consumeNextFocusedFieldAutoScrollSuppression = useCallback(() => {
+        const suppressed = suppressNextFocusedFieldAutoScrollRef.current;
+        suppressNextFocusedFieldAutoScrollRef.current = false;
+        return suppressed;
+    }, []);
     const insertingHoldCleanupRef = useRef(null);
     // The drop operation's HTTP resolve only means the server accepted it — the
     // canvas re-render (fetch + DOM patch) lands seconds later. Keep the
@@ -537,10 +548,9 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
     // Keep a synchronous ref for "what is currently active" so callers can update it
     // before React state has applied (e.g. setActiveSlot -> loadItem).
     const activeSlotIdRef = useRef(activeSlotId);
-    useEffect(() => {
-        activeSlotIdRef.current = activeSlotId;
-    }, [activeSlotId]);
     const [slotContexts, setSlotContexts] = useState(() => new Map());
+    const slotContextsRef = useRef(slotContexts);
+    const lastActiveSlotContextRef = useRef(null);
     const fieldModificationStoresBySlotRef = useRef(new Map());
     const [fieldModificationStoreRegistryRevision, setFieldModificationStoreRegistryRevision,] = useState(0);
     const getFieldModificationStoreForSlot = useCallback((slotId) => {
@@ -597,15 +607,15 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
     // Don't persist editorSlots to localStorage - always start with 0 slots in a new window
     // Ensure we always have a valid activeSlotId when slots change
     useEffect(() => {
-        if (editorSlots.length === 0) {
-            setActiveSlotId(null);
+        const currentActiveSlotId = activeSlotIdRef.current;
+        const nextActiveSlotId = currentActiveSlotId &&
+            editorSlots.some((slot) => slot.slotId === currentActiveSlotId)
+            ? currentActiveSlotId
+            : (editorSlots[0]?.slotId ?? null);
+        if (currentActiveSlotId === nextActiveSlotId)
             return;
-        }
-        setActiveSlotId((prev) => {
-            if (prev && editorSlots.some((s) => s.slotId === prev))
-                return prev;
-            return editorSlots[0]?.slotId ?? null;
-        });
+        activeSlotIdRef.current = nextActiveSlotId;
+        setActiveSlotId(nextActiveSlotId);
     }, [editorSlots]);
     const currentItemRef = useRef(undefined);
     useEffect(() => {
@@ -725,6 +735,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
     const [centerPanelView, setCenterPanelView] = useState();
     const [timings, setTimings] = useState({});
     const [revision, setRevision] = useState();
+    const [fullReloadToken, setFullReloadToken] = useState(0);
     // moved into useWorkbox
     // Initialize tour state from URL parameter to survive navigation/remounts
     // Memoize to avoid triggering Router state updates during render
@@ -965,32 +976,29 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         });
     }, [itemsRepository, refreshParheliaSettings]);
     const registerSlotContext = useCallback((slotId, ctx) => {
-        setSlotContexts((prev) => {
-            if (prev.get(slotId) === ctx)
-                return prev;
-            const next = new Map(prev);
-            next.set(slotId, ctx);
-            return next;
-        });
+        const current = slotContextsRef.current;
+        if (current.get(slotId) === ctx)
+            return;
+        const next = new Map(current);
+        next.set(slotId, ctx);
+        slotContextsRef.current = next;
+        setSlotContexts(next);
     }, []);
     const unregisterSlotContext = useCallback((slotId) => {
-        setSlotContexts((prev) => {
-            if (!prev.has(slotId))
-                return prev;
-            if (slotId === activeSlotIdRef.current) {
-                const activeCtx = prev.get(slotId);
-                if (activeCtx) {
-                    lastActiveSlotContextRef.current = activeCtx;
-                }
+        const current = slotContextsRef.current;
+        if (!current.has(slotId))
+            return;
+        if (slotId === activeSlotIdRef.current) {
+            const activeCtx = current.get(slotId);
+            if (activeCtx) {
+                lastActiveSlotContextRef.current = activeCtx;
             }
-            const next = new Map(prev);
-            next.delete(slotId);
-            return next;
-        });
+        }
+        const next = new Map(current);
+        next.delete(slotId);
+        slotContextsRef.current = next;
+        setSlotContexts(next);
     }, []);
-    const slotContextsRef = useRef(slotContexts);
-    const lastActiveSlotContextRef = useRef(null);
-    slotContextsRef.current = slotContexts;
     const getActiveSlotContext = useCallback(() => {
         const activeId = activeSlotIdRef.current;
         if (!activeId)
@@ -1144,7 +1152,8 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
                 }
                 // Delay toast slightly to give user time to navigate if they're switching views
                 setTimeout(() => {
-                    toast(toastMessage, {
+                    const showBatchToast = errorJobs > 0 ? toast : toast.success;
+                    showBatchToast(toastMessage, {
                         duration: 5000, // Show for 5 seconds
                         id: `batch-${batchId}`, // Unique ID to prevent duplicates
                     });
@@ -1250,20 +1259,36 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         }
     }, [currentWorkspace]);
     const sendClientInfoImmediate = useCallback(async () => {
+        const itemAtSend = currentItemRef.current;
         const clientInfoMessage = {
             type: "client-info",
             sessionId: sessionId,
             url: window.location.href,
             userAgent: navigator.userAgent,
-            item: currentItemRef.current
+            item: itemAtSend
                 ? {
-                    ...currentItemRef.current.descriptor,
-                    name: currentItemRef.current.name,
+                    ...itemAtSend.descriptor,
+                    name: itemAtSend.name,
                 }
                 : null,
         };
         const url = "/parhelia/client";
-        await post(url, clientInfoMessage);
+        const result = await post(url, clientInfoMessage);
+        if (result.type !== "success" ||
+            !itemAtSend ||
+            !getEditorRealtime().isOpen()) {
+            return;
+        }
+        // /parhelia/client returns success only after ApplyClientInfo has
+        // synchronously registered the page topic. Treat that response as the
+        // authoritative acknowledgement instead of depending solely on the
+        // active-sessions broadcast making a round trip back to this tab.
+        const currentItem = currentItemRef.current;
+        if (currentItem?.descriptor.id === itemAtSend.descriptor.id &&
+            currentItem.descriptor.language === itemAtSend.descriptor.language &&
+            currentItem.descriptor.version === itemAtSend.descriptor.version) {
+            setIsClientInfoAcknowledged(true);
+        }
     }, [sessionId]);
     const debouncedSendClientInfo = useDebouncedCallback(() => {
         void sendClientInfoImmediate();
@@ -1602,6 +1627,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         const keepAliveUrl = "/parhelia/keepalive";
         const runSessionCheck = () => {
             fetch(keepAliveUrl + "?ts=" + Date.now(), {
+                method: "POST",
                 credentials: "include",
                 headers: { "Cache-Control": "no-cache" },
             })
@@ -1948,10 +1974,18 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         setRemovingComponentIds([]);
     }, [currentItemDescriptor, activePageViewContext.page?.item.id]);
     useEffect(() => {
-        // When the item changes, reset acknowledgment and re-send client info
+        // When the item changes, reset acknowledgment. Registration below sends
+        // immediately and keeps retrying until active-sessions confirms it.
         setIsClientInfoAcknowledged(false);
-        sendClientInfo();
     }, [currentItemDescriptor]);
+    useClientInfoRegistration({
+        itemKey: currentItemDescriptor
+            ? `${currentItemDescriptor.id}:${currentItemDescriptor.language}:${currentItemDescriptor.version}`
+            : null,
+        acknowledged: isClientInfoAcknowledged,
+        connectionVersion: socketConnectionVersion,
+        sendClientInfo: sendClientInfoImmediate,
+    });
     // Detect acknowledgment via presence of our session with matching item in active-sessions
     useEffect(() => {
         if (!currentItemDescriptor)
@@ -2486,6 +2520,16 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             setRevision(newRevision);
             globalThis.editorRefreshTimer = undefined;
         };
+        if (mode === "hard") {
+            // A pending soft refresh would land the same revision through the
+            // incremental path the caller is trying to bypass.
+            if (refreshTimer) {
+                clearTimeout(refreshTimer);
+            }
+            setFullReloadToken((token) => token + 1);
+            doRefresh();
+            return;
+        }
         if (mode === "immediate") {
             if (refreshTimer) {
                 clearTimeout(refreshTimer);
@@ -2507,9 +2551,15 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             return;
         // The previous item's comments don't speak for the new one.
         setCommentsLoaded(false);
+        // Loading feedback before client-info is acknowledged creates a gap: an
+        // update can arrive after this REST response but before the realtime page
+        // subscription exists. Once acknowledged, the snapshot and event stream
+        // form one continuous view of the server state.
+        if (!isClientInfoAcknowledged)
+            return;
         loadComments();
         loadSuggestedEdits();
-    }, [currentItemDescriptor]);
+    }, [currentItemDescriptor, isClientInfoAcknowledged]);
     // Track the previous history mode to detect mode changes
     const prevHistoryModeRef = useRef(historyMode);
     const historyInitialLoadDoneRef = useRef(false);
@@ -2619,6 +2669,10 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
                         f.type === "multi-line text" ||
                         f.type === "rich text"));
                 if (field) {
+                    // Programmatic focus: no user intent to see the field, and after a
+                    // move it still measures at its pre-move rect (the drag origin)
+                    // until the canvas refresh lands.
+                    suppressNextFocusedFieldAutoScrollRef.current = true;
                     setFocusedField(field.descriptor);
                     setFocusFieldComponentId(undefined);
                 }
@@ -2915,7 +2969,8 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             }
             // IMPORTANT: Only update global "current item" state when the affected slot is active.
             // Otherwise we'd change URL/tree/controls while loading into an inactive slot.
-            if (isExistingSlotActive) {
+            if (isExistingSlotActive &&
+                existingSlotForItem.slotId === activeSlotIdRef.current) {
                 setItem(loadedItem);
                 setSelection([]);
                 currentItemDescriptorRef.current = itemToLoad;
@@ -2984,6 +3039,14 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         //   slot the caller explicitly opened, do update.
         const isFirstSlot = editorSlots.length === 0;
         const isExplicitNewSlot = options?.openInNewSlot === true && !options?.targetSlotId;
+        // Focus follows a new-slot action immediately. Waiting for getItem() made
+        // an older, slow navigation able to reclaim focus after the user clicked
+        // another slot. Any subsequent activation now wins because the async
+        // completion below only updates global state while its target is active.
+        if (isFirstSlot || isExplicitNewSlot) {
+            activeSlotIdRef.current = targetSlotId;
+            setActiveSlotId(targetSlotId);
+        }
         const shouldUpdateGlobalCurrentItem = isFirstSlot ||
             isExplicitNewSlot ||
             targetSlotId === activeSlotIdRef.current;
@@ -2995,17 +3058,10 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             return undefined;
         }
         if (shouldUpdateGlobalCurrentItem &&
-            latestGlobalLoadKeyRef.current !== requestedItemKey) {
+            (targetSlotId !== activeSlotIdRef.current ||
+                latestGlobalLoadKeyRef.current !== requestedItemKey)) {
             return loadedItem;
         }
-        // Activate the new slot when this is either the initial first slot, or the
-        // caller explicitly opened the item in a new slot — focus follows the action so
-        // the user immediately sees what they just opened. Beyond that, slot focus is
-        // driven by mouse hover/click.
-        if (isFirstSlot || isExplicitNewSlot) {
-            activeSlotIdRef.current = targetSlotId;
-            setActiveSlotId(targetSlotId);
-        }
         if (shouldUpdateGlobalCurrentItem) {
             setItem(loadedItem);
             setSelection([]);
@@ -3035,7 +3091,11 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         ensureFieldModificationStoreRegistered,
     ]);
     const setActiveSlot = useCallback(async (slotId) => {
-        if (activeSlotId === slotId)
+        // Commands resolve their target through activeSlotIdRef so activation
+        // must use that same source of truth. React state can briefly lag behind
+        // the ref during rapid slot changes; comparing the stale render value
+        // could leave one slot highlighted while toolbar commands target another.
+        if (activeSlotIdRef.current === slotId)
             return;
         const slot = editorSlots.find((s) => s.slotId === slotId);
         if (!slot)
@@ -3062,7 +3122,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
                 targetSlotId: slotId,
             });
         }
-    }, [activeSlotId, editorSlots, loadItem]);
+    }, [editorSlots, loadItem]);
     const closeEditorSlot = useCallback((slotId) => {
         const currentActiveSlotId = activeSlotId;
         const isClosingActiveSlot = currentActiveSlotId === slotId;
@@ -3391,6 +3451,10 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         sessionId,
         onMessage: messageHandler,
         onOpen: async () => {
+            // The transport is open, but it is not subscribed to this page until the
+            // server acknowledges the client-info message sent immediately after
+            // this callback.
+            setIsClientInfoAcknowledged(false);
             // Clear concurrent user limit error on successful connection
             setConcurrentUserLimitError(null);
             // Startup WebSocket probe may have failed with a blocking error while seats were full.
@@ -4127,18 +4191,15 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
     }, [operationsContext.cleanup]);
     // Shared focused field setter with lock handling (used in both contexts)
     const setFocusedFieldWithLock = useCallback(async (field, requestLock) => {
-        logFieldValueDiagnostic("focused-field", "setFocusedField requested", {
-            field: summarizeFieldDescriptor(field),
-            requestLock,
-            ignoreBlur,
-            currentFocusedField: summarizeFieldDescriptor(focusedFieldRef.current),
-            lockedField: summarizeFieldDescriptor(lockedField),
-        });
         if (field) {
             setIgnoreBlur(true);
             setTimeout(() => {
                 setIgnoreBlur(false);
             }, 20);
+            // Selection follows the user's click independently of the asynchronous
+            // edit lock. Lock ownership controls whether editing may proceed, but a
+            // slow or rejected lock must not leave the form on the previous field.
+            setFocusedField({ ...field });
             if (requestLock) {
                 const lockResult = (await operations.ensureLock(field)) || false;
                 if (!lockResult) {
@@ -4148,19 +4209,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
                     });
                     return false;
                 }
-                setFocusedField({ ...field });
-                logFieldValueDiagnostic("focused-field", "focused field set", {
-                    field: summarizeFieldDescriptor(field),
-                    requestLock,
-                    lockResult,
-                });
-                return true;
             }
-            setFocusedField({ ...field });
-            logFieldValueDiagnostic("focused-field", "focused field set", {
-                field: summarizeFieldDescriptor(field),
-                requestLock,
-            });
         }
         else {
             // Keep the field selected when the blur was caused by clicking a User
@@ -4183,27 +4232,10 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
                 now: Date.now(),
             });
             if (!ignoreBlur && !focusMovedToShowMe && !focusMovedToAgentTerminal) {
-                logFieldValueDiagnostic("focused-field", "clearing focused field", {
-                    previousFocusedField: summarizeFieldDescriptor(focusedFieldRef.current),
-                    lockedField: summarizeFieldDescriptor(lockedField),
-                    sessionId,
-                });
                 setFocusedField(undefined);
                 setLockedField(undefined); // Clear client-side lock state
                 releaseFieldLocks(sessionId);
             }
-            else {
-                logFieldValueDiagnostic("focused-field", "clear skipped", {
-                    reason: ignoreBlur
-                        ? "ignoreBlur"
-                        : focusMovedToShowMe
-                            ? "manual show-me focus transfer"
-                            : "agent terminal focus transfer",
-                    previousFocusedField: summarizeFieldDescriptor(focusedFieldRef.current),
-                    focusMovedToShowMe,
-                    focusMovedToAgentTerminal,
-                });
-            }
         }
         return true;
     }, [operations, ignoreBlur, sessionId, lockedField]);
@@ -4721,6 +4753,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         },
         selectWithoutAutoScroll,
         consumeNextSelectionAutoScrollSuppression,
+        consumeNextFocusedFieldAutoScrollSuppression,
         contentTreeSelection,
         setContentTreeSelection,
         selectedForInsertion,
@@ -5160,6 +5193,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         closeEditorSlot,
         setActiveSlot,
         revision,
+        fullReloadToken,
         notifyPageModelReady,
         pageModelReadyToken,
         selectedComment,
@@ -5447,6 +5481,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         removingComponentIds,
         currentItemDescriptor,
         revision,
+        fullReloadToken,
         notifyPageModelReady,
         pageModelReadyToken,
         selectedComment,