@gmickel/gno 2.5.1 → 2.7.0

package/src/serve/public/pages/DocumentEditor.tsx

@@ -73,6 +73,13 @@ import {
   loadLatestLocalHistory,
   type LocalHistoryEntry,
 } from "../lib/local-history";
+import {
+  clearRequestIntent,
+  type RequestIntent,
+  requestIdForIntent,
+} from "../lib/request-intent";
+
+const SAVE_INTENT_KEY = "gno:save-intent";
 import { getActiveWikiLinkQuery } from "../lib/wiki-link";
 
 interface PageProps {
@@ -123,6 +130,8 @@ interface UpdateDocResponse {
     sourceHash: string;
     modifiedAt?: string;
   };
+  /** Present when the save carried a request ID. */
+  request?: { replayed: boolean };
 }
 
 interface DocsAutocompleteResponse {
@@ -132,7 +141,7 @@ interface DocsAutocompleteResponse {
 type SaveStatus = "saved" | "saving" | "unsaved" | "error";
 
 function useDebouncedCallback<T extends unknown[]>(
-  callback: (...args: T) => void | Promise<void>,
+  callback: (...args: T) => unknown,
   delay: number
 ) {
   const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
@@ -198,8 +207,12 @@ export default function DocumentEditor({ navigate }: PageProps) {
   const [saveError, setSaveError] = useState<string | null>(null);
   const [creatingCopy, setCreatingCopy] = useState(false);
   const [copyError, setCopyError] = useState<string | null>(null);
-  const [externalChangeNotice, setExternalChangeNotice] = useState<
-    string | null
+  /**
+   * `outside`: the file changed under the editor. `unconfirmed`: a save's
+   * response was lost, so a change on disk may be that save's own commit.
+   */
+  const [changeNotice, setChangeNotice] = useState<
+    "outside" | "unconfirmed" | null
   >(null);
   const [historyEntries, setHistoryEntries] = useState<LocalHistoryEntry[]>([]);
   const [historyDialogOpen, setHistoryDialogOpen] = useState(false);
@@ -309,23 +322,58 @@ export default function DocumentEditor({ navigate }: PageProps) {
     }
   }, [syncScroll]);
 
-  // Save function
-  const saveDocument = useCallback(
-    async (contentToSave: string) => {
-      if (!doc) return;
+  // Autosave timers and Cmd+S run later than the render that scheduled them:
+  // read the current revision and last committed content from refs.
+  const docRef = useRef(doc);
+  const committedContentRef = useRef(originalContent);
+  const draftRef = useRef(content);
+  useEffect(() => {
+    docRef.current = doc;
+  }, [doc]);
+  useEffect(() => {
+    draftRef.current = content;
+  }, [content]);
+  // One request ID per (document revision, content) save intent: retrying a
+  // save whose response was lost replays it instead of reporting a conflict.
+  const saveIntentRef = useRef<RequestIntent | null>(null);
+  // Content of a save that is in flight or whose response was lost: its
+  // commit is unknown, so change events are held until a response says whose
+  // change they were. Retry save re-sends exactly this content.
+  const unknownSaveRef = useRef<string | null>(null);
+  const changedWhileUnknownRef = useRef(false);
+
+  /** Save `contentToSave`; resolves true once it is committed on disk. */
+  const persistContent = useCallback(
+    async (contentToSave: string): Promise<boolean> => {
+      const current = docRef.current;
+      if (!current) return false;
+      if (contentToSave === committedContentRef.current) {
+        setSaveStatus("saved");
+        return true;
+      }
 
       setSaveStatus("saving");
       setSaveError(null);
-
-      const { data, error: err } = await apiFetch<UpdateDocResponse>(
-        `/api/docs/${encodeURIComponent(doc.docid)}`,
+      unknownSaveRef.current = contentToSave;
+
+      const {
+        data,
+        error: err,
+        outcomeUnknown,
+      } = await apiFetch<UpdateDocResponse>(
+        `/api/docs/${encodeURIComponent(current.docid)}`,
         {
           method: "PUT",
           body: JSON.stringify({
             content: contentToSave,
-            expectedSourceHash: doc.source.sourceHash,
-            expectedModifiedAt: doc.source.modifiedAt,
-            uri: doc.uri,
+            expectedSourceHash: current.source.sourceHash,
+            expectedModifiedAt: current.source.modifiedAt,
+            uri: current.uri,
+            requestId: requestIdForIntent(
+              saveIntentRef,
+              `${current.uri}\u0000${current.source.sourceHash}\u0000${contentToSave}`,
+              SAVE_INTENT_KEY
+            ),
           }),
         }
       );
@@ -333,32 +381,71 @@ export default function DocumentEditor({ navigate }: PageProps) {
       if (err) {
         setSaveStatus("error");
         setSaveError(err);
-      } else {
-        ignoreDocEventsUntilRef.current = Date.now() + 5_000;
-        if (originalContent !== contentToSave) {
-          appendLocalHistory(doc.docid, originalContent);
-          refreshHistoryEntries(doc.docid);
+        if (outcomeUnknown) {
+          // Never downgrade a warning about a change from elsewhere.
+          setChangeNotice((notice) =>
+            notice === "outside" ? notice : "unconfirmed"
+          );
+          return false;
         }
-        setSaveStatus("saved");
-        setOriginalContent(contentToSave);
-        setLastSaved(new Date());
-        if (data) {
-          setDoc((currentDoc) =>
-            currentDoc
-              ? {
-                  ...currentDoc,
-                  source: {
-                    ...currentDoc.source,
-                    sourceHash: data.version.sourceHash,
-                    modifiedAt: data.version.modifiedAt,
-                  },
-                }
-              : currentDoc
+        // A definitive rejection: this save did not commit, so a change seen
+        // meanwhile came from elsewhere.
+        unknownSaveRef.current = null;
+        if (changedWhileUnknownRef.current) {
+          changedWhileUnknownRef.current = false;
+          setChangeNotice("outside");
+        } else {
+          setChangeNotice((notice) =>
+            notice === "unconfirmed" ? null : notice
           );
         }
+        return false;
+      }
+
+      unknownSaveRef.current = null;
+      changedWhileUnknownRef.current = false;
+      if (data?.request?.replayed) {
+        // A replay reports an earlier commit; disk may have moved on since.
+        // Only a read showing a different hash is evidence of another writer.
+        const { data: latest } = await apiFetch<DocData>(
+          `/api/doc?uri=${encodeURIComponent(current.uri)}`
+        );
+        setChangeNotice(
+          latest && latest.source.sourceHash !== data.version.sourceHash
+            ? "outside"
+            : null
+        );
+      } else {
+        // Written now against the loaded revision: the next change event is
+        // this save's own sync, and any earlier notice is stale.
+        ignoreDocEventsUntilRef.current = Date.now() + 5_000;
+        setChangeNotice(null);
       }
+      const previous = committedContentRef.current;
+      if (previous !== contentToSave) {
+        appendLocalHistory(current.docid, previous);
+        refreshHistoryEntries(current.docid);
+      }
+      clearRequestIntent(saveIntentRef, SAVE_INTENT_KEY);
+      committedContentRef.current = contentToSave;
+      setSaveStatus("saved");
+      setOriginalContent(contentToSave);
+      setLastSaved(new Date());
+      if (data) {
+        const next = {
+          ...current,
+          source: {
+            ...current.source,
+            sourceHash: data.version.sourceHash,
+            modifiedAt: data.version.modifiedAt,
+          },
+        };
+        docRef.current = next;
+        setDoc(next);
+      }
+      return true;
     },
-    [doc]
+    []
   );
 
   const handleCreateEditableCopy = useCallback(async () => {
@@ -476,16 +563,18 @@ export default function DocumentEditor({ navigate }: PageProps) {
   );
 
   // Debounced auto-save
-  const { debouncedFn: debouncedSave } = useDebouncedCallback(
-    saveDocument,
-    2000
-  );
+  const { debouncedFn: debouncedSave, cancel: cancelAutosave } =
+    useDebouncedCallback(persistContent, 2000);
 
   // Handle content changes
   const handleContentChange = useCallback(
     (newContent: string) => {
       setContent(newContent);
-      if (newContent !== originalContent) {
+      if (newContent === originalContent) {
+        // Back to the committed text: drop a pending autosave of a draft.
+        cancelAutosave();
+        setSaveStatus("saved");
+      } else {
         setSaveStatus("unsaved");
         debouncedSave(newContent);
       }
@@ -509,7 +598,7 @@ export default function DocumentEditor({ navigate }: PageProps) {
       setWikiLinkOpen(true);
       setWikiLinkActiveIndex(0);
     },
-    [originalContent, debouncedSave]
+    [cancelAutosave, originalContent, debouncedSave]
   );
 
   useEffect(() => {
@@ -530,55 +619,27 @@ export default function DocumentEditor({ navigate }: PageProps) {
     });
   }, [doc?.collection, wikiLinkOpen, wikiLinkQuery]);
 
-  // Force save (Cmd+S) - saves and triggers embedding
+  // Force save (Cmd+S) - supersedes a pending autosave, then triggers embedding
   const handleForceSave = useCallback(async () => {
-    if (!hasUnsavedChanges || !doc) return;
-
-    setSaveStatus("saving");
-    setSaveError(null);
-
-    // Save document
-    const { data, error: err } = await apiFetch<UpdateDocResponse>(
-      `/api/docs/${encodeURIComponent(doc.docid)}`,
-      {
-        method: "PUT",
-        body: JSON.stringify({
-          content,
-          expectedSourceHash: doc.source.sourceHash,
-          expectedModifiedAt: doc.source.modifiedAt,
-          uri: doc.uri,
-        }),
-      }
-    );
-
-    if (err) {
-      setSaveStatus("error");
-      setSaveError(err);
-      return;
+    cancelAutosave();
+    if (!hasUnsavedChanges) return;
+    if (await persistContent(content)) {
+      // Fire and forget - don't block on result
+      void apiFetch("/api/embed", { method: "POST" });
     }
-
-    ignoreDocEventsUntilRef.current = Date.now() + 5_000;
-    if (originalContent !== content) {
-      appendLocalHistory(doc.docid, originalContent);
-      refreshHistoryEntries(doc.docid);
+  }, [cancelAutosave, content, hasUnsavedChanges, persistContent]);
+
+  // Retry the unconfirmed save itself (same content, same request ID), even
+  // when the draft has since changed or returned to the loaded text; once it
+  // is confirmed, the draft as it is then is saved on top of it.
+  const retryUnconfirmedSave = useCallback(async () => {
+    const pending = unknownSaveRef.current;
+    if (pending === null) return;
+    cancelAutosave();
+    if (await persistContent(pending)) {
+      await persistContent(draftRef.current);
     }
-    setSaveStatus("saved");
-    setOriginalContent(content);
-    setLastSaved(new Date());
-    if (data) {
-      setDoc({
-        ...doc,
-        source: {
-          ...doc.source,
-          sourceHash: data.version.sourceHash,
-          modifiedAt: data.version.modifiedAt,
-        },
-      });
-    }
-
-    // Trigger embedding (fire and forget - don't block on result)
-    void apiFetch("/api/embed", { method: "POST" });
-  }, [hasUnsavedChanges, doc, content]);
+  }, [cancelAutosave, persistContent]);
 
   const loadDocument = useCallback(() => {
     const uri = currentTarget.uri;
@@ -599,6 +660,7 @@ export default function DocumentEditor({ navigate }: PageProps) {
           const docContent = data.content ?? "";
           setContent(docContent);
           setOriginalContent(docContent);
+          committedContentRef.current = docContent;
           refreshHistoryEntries(data.docid);
           // Ensure CodeMirror reflects content after async load
           requestAnimationFrame(() => {
@@ -617,20 +679,30 @@ export default function DocumentEditor({ navigate }: PageProps) {
     loadDocument();
   }, [loadDocument]);
 
+  // Judge each change event once; later doc updates must not re-raise it.
+  const handledDocEventRef = useRef<string | null>(null);
   useEffect(() => {
     if (!doc || latestDocEvent?.uri !== doc.uri) {
       return;
     }
+    if (handledDocEventRef.current === latestDocEvent.changedAt) {
+      return;
+    }
+    handledDocEventRef.current = latestDocEvent.changedAt;
+    if (unknownSaveRef.current !== null) {
+      changedWhileUnknownRef.current = true;
+      return;
+    }
     if (Date.now() < ignoreDocEventsUntilRef.current) {
       return;
     }
-    setExternalChangeNotice(
-      "This document changed on disk. Reload before continuing."
-    );
+    setChangeNotice("outside");
   }, [doc, latestDocEvent?.changedAt, latestDocEvent?.uri]);
 
   const reloadDocument = useCallback(() => {
-    setExternalChangeNotice(null);
+    unknownSaveRef.current = null;
+    changedWhileUnknownRef.current = false;
+    setChangeNotice(null);
     loadDocument();
   }, [loadDocument]);
 
@@ -752,7 +824,12 @@ export default function DocumentEditor({ navigate }: PageProps) {
 
   // Save and navigate
   const handleSaveAndNavigate = async () => {
-    await saveDocument(content);
+    cancelAutosave();
+    // A failed save keeps the editor (and its error) instead of losing the draft.
+    if (!(await persistContent(content))) {
+      setShowUnsavedDialog(false);
+      return;
+    }
     // Trigger embedding (fire and forget)
     void apiFetch("/api/embed", { method: "POST" });
     setShowUnsavedDialog(false);
@@ -793,9 +870,13 @@ export default function DocumentEditor({ navigate }: PageProps) {
       <TooltipProvider>
         <Tooltip>
           <TooltipTrigger asChild>
-            <div className="flex items-center gap-1.5 text-sm">
-              <Icon className={`size-4 ${className}`} />
-              <span className="hidden text-muted-foreground sm:inline">
+            <div
+              aria-label={text}
+              className="flex min-w-0 max-w-[16rem] shrink items-center gap-1.5 text-sm"
+              role="status"
+            >
+              <Icon className={`size-4 shrink-0 ${className}`} />
+              <span className="hidden truncate text-muted-foreground sm:inline">
                 {saveStatus === "saved" && lastSaved
                   ? formatTime(lastSaved)
                   : text}
@@ -907,7 +988,7 @@ export default function DocumentEditor({ navigate }: PageProps) {
     <div className="flex h-screen flex-col overflow-hidden">
       {/* Toolbar */}
       <header className="glass shrink-0 border-border/50 border-b">
-        <div className="flex items-center gap-3 px-4 py-2">
+        <div className="flex items-center gap-2 px-2 py-2 sm:gap-3 sm:px-4">
           {/* Home button - Scholarly Dusk brass accent */}
           <Button
             aria-label="Go to dashboard"
@@ -954,7 +1035,7 @@ export default function DocumentEditor({ navigate }: PageProps) {
           <Separator className="h-5" orientation="vertical" />
 
           {/* Document info */}
-          <div className="flex min-w-0 flex-1 items-center gap-2">
+          <div className="flex min-w-0 flex-1 items-center gap-2 overflow-hidden">
             <PenIcon className="size-4 shrink-0 text-muted-foreground" />
             <h1 className="truncate font-medium">{doc.title || doc.relPath}</h1>
             {currentTarget.lineStart && (
@@ -968,7 +1049,7 @@ export default function DocumentEditor({ navigate }: PageProps) {
             )}
             {hasUnsavedChanges && (
               <Badge
-                className="shrink-0 bg-yellow-500/20 text-yellow-500"
+                className="hidden shrink-0 bg-yellow-500/20 text-yellow-500 sm:inline-flex"
                 variant="outline"
               >
                 Unsaved
@@ -982,6 +1063,7 @@ export default function DocumentEditor({ navigate }: PageProps) {
           <Separator className="h-5" orientation="vertical" />
 
           <Button
+            className="hidden sm:inline-flex"
             onClick={() => {
               void navigator.clipboard.writeText(
                 `${window.location.origin}${buildEditDeepLink({
@@ -999,7 +1081,7 @@ export default function DocumentEditor({ navigate }: PageProps) {
 
           {/* Preview toggle */}
           <Select onValueChange={setInsertPresetId} value={insertPresetId}>
-            <SelectTrigger className="w-[180px]">
+            <SelectTrigger className="hidden w-[180px] md:flex">
               <SelectValue placeholder="Preset" />
             </SelectTrigger>
             <SelectContent>
@@ -1012,7 +1094,12 @@ export default function DocumentEditor({ navigate }: PageProps) {
               )}
             </SelectContent>
           </Select>
-          <Button onClick={handleInsertPreset} size="sm" variant="outline">
+          <Button
+            className="hidden md:inline-flex"
+            onClick={handleInsertPreset}
+            size="sm"
+            variant="outline"
+          >
             Insert preset
           </Button>
 
@@ -1047,7 +1134,7 @@ export default function DocumentEditor({ navigate }: PageProps) {
                     aria-label={
                       syncScroll ? "Disable scroll sync" : "Enable scroll sync"
                     }
-                    className="transition-all duration-200"
+                    className="hidden transition-all duration-200 sm:inline-flex"
                     onClick={() => setSyncScroll(!syncScroll)}
                     size="sm"
                     variant={syncScroll ? "secondary" : "ghost"}
@@ -1070,15 +1157,18 @@ export default function DocumentEditor({ navigate }: PageProps) {
 
           {/* Save button */}
           <Button
+            aria-label="History"
+            className="shrink-0"
             disabled={!hasLocalSnapshot}
             onClick={() => setHistoryDialogOpen(true)}
             size="sm"
             variant="outline"
           >
-            <HistoryIcon className="mr-1.5 size-4" />
-            History
+            <HistoryIcon className="size-4 sm:mr-1.5" />
+            <span className="hidden sm:inline">History</span>
           </Button>
           <Button
+            className="shrink-0"
             disabled={!hasUnsavedChanges || saveStatus === "saving"}
             onClick={handleForceSave}
             size="sm"
@@ -1093,10 +1183,40 @@ export default function DocumentEditor({ navigate }: PageProps) {
         </div>
       </header>
 
-      {externalChangeNotice && (
+      {saveStatus === "error" && saveError && (
+        <p
+          className="border-destructive/30 border-b bg-destructive/10 px-4 py-2 text-destructive text-sm sm:hidden"
+          role="alert"
+        >
+          {saveError}
+        </p>
+      )}
+
+      {changeNotice === "unconfirmed" && (
+        <div className="border-amber-500/30 border-b bg-amber-500/10 px-4 py-3">
+          <div className="flex flex-wrap items-center justify-between gap-3">
+            <p className="text-amber-500 text-sm">
+              The save may have completed, but its response was lost. Retry to
+              confirm it.
+            </p>
+            <Button
+              disabled={saveStatus === "saving"}
+              onClick={retryUnconfirmedSave}
+              size="sm"
+              variant="outline"
+            >
+              Retry save
+            </Button>
+          </div>
+        </div>
+      )}
+
+      {changeNotice === "outside" && (
         <div className="border-amber-500/30 border-b bg-amber-500/10 px-4 py-3">
           <div className="flex flex-wrap items-center justify-between gap-3">
-            <p className="text-amber-500 text-sm">{externalChangeNotice}</p>
+            <p className="text-amber-500 text-sm">
+              This document changed on disk. Reload before continuing.
+            </p>
             <Button onClick={reloadDocument} size="sm" variant="outline">
               Reload
             </Button>

package/src/serve/public/pages/Search.tsx

@@ -50,50 +50,10 @@ import {
   fetchServerCapabilities,
   type ServerCapabilities,
 } from "../lib/server-capabilities";
+import { renderSnippet } from "../lib/snippet";
 import { cn } from "../lib/utils";
 import { AIModelSelector, TagFacets } from "./search-page-widgets";
 
-/**
- * Render snippet with <mark> tags as highlighted spans.
- * Only allows mark tags - strips all other HTML for safety.
- */
-function renderSnippet(snippet: string): React.ReactNode {
-  const parts: React.ReactNode[] = [];
-  let remaining = snippet;
-  let key = 0;
-
-  while (remaining.length > 0) {
-    const markStart = remaining.indexOf("<mark>");
-    if (markStart === -1) {
-      parts.push(remaining);
-      break;
-    }
-
-    if (markStart > 0) {
-      parts.push(remaining.slice(0, markStart));
-    }
-
-    const markEnd = remaining.indexOf("</mark>", markStart);
-    if (markEnd === -1) {
-      parts.push(remaining.slice(markStart));
-      break;
-    }
-
-    const highlighted = remaining.slice(markStart + 6, markEnd);
-    parts.push(
-      <mark
-        className="rounded bg-primary/20 px-0.5 font-medium text-primary"
-        key={key++}
-      >
-        {highlighted}
-      </mark>
-    );
-    remaining = remaining.slice(markEnd + 7);
-  }
-
-  return parts;
-}
-
 interface PageProps {
   navigate: (to: string | number) => void;
 }