fix(editor): SyncIndicator now reflects hero/settings/citation edits

The "Saving..." / "Saved" badge in the topbar used to listen only to
TipTap's editor.on('update') event. That event fires solely for
prosemirror document changes - i.e. when the article BODY is edited.

The hero (title/subtitle/authors/links/...), the per-article settings,
citations, embeds and the comment store all live in sibling Y.Maps on
the same Yjs document. Edits there don't round-trip through TipTap, so
they never triggered the indicator. Net effect for users: editing the
hero felt like a no-op - no "Saving..." feedback - and the natural
conclusion was "this isn't being saved", even though the backend's
Hocuspocus onChange handler was happily persisting the full ydoc on
every Yjs update.

Subscribe one layer lower, on ydoc.on('update', ...). That callback
fires for any Y.Map / Y.Array / Y.XmlFragment change in the document,
which exactly mirrors what the backend persists. The indicator now
flashes "Saving..." for every kind of edit and settles back to
"Saved" once the write debounce window closes.

Implementation notes:
- The Y.Doc is the same instance the editor passed to
HocuspocusProvider, accessible via provider.document. We resolve
it inside the existing provider-attach block so we tear listeners
down cleanly when the provider goes away.
- The update callback ignores events whose origin is the provider
itself. Hocuspocus emits Yjs updates with the provider as origin
when it APPLIES remote changes (i.e. someone else just edited),
and those are not saves we need to advertise - they're already
saved by their author. Without this filter, the indicator would
blink "Saving..." constantly while collaborating.
- editorInstance prop is kept for backwards compatibility (still
received by TopBar.tsx) but no longer used here; renamed to
_editorInstance to silence the unused-arg lint.

Co-authored-by: Cursor <cursoragent@cursor.com>

frontend/src/components/SyncIndicator.tsx

@@ -13,10 +13,23 @@ interface Props {
 
 /**
  * Tiny connection/saving indicator for the editor top bar. Listens to the
- * Hocuspocus provider (`connect` / `disconnect` / `synced`) and the TipTap
- * editor (`update`) to flip between "Saved", "Saving..." and "Offline".
+ * Hocuspocus provider (`connect` / `disconnect` / `synced`) for connection
+ * status, and to the underlying Yjs document (`update`) for change
+ * activity.
+ *
+ * Why ydoc.on('update') and not editor.on('update'):
+ *   TipTap's `update` event only fires for changes to the prosemirror
+ *   document (the article body). The hero (title/subtitle/authors/...)
+ *   and the article settings live in sibling Y.Maps on the same ydoc,
+ *   and edits there go straight to Yjs without round-tripping through
+ *   TipTap. Listening on the prosemirror editor would therefore miss
+ *   every hero / settings / citation / embed change and make the user
+ *   believe nothing is being saved - even though the backend's
+ *   Hocuspocus `onChange` handler is happily persisting the full ydoc
+ *   on every Yjs update. Subscribing at the Yjs layer fixes that: we
+ *   see every change the backend sees, in the same order it sees them.
  */
-export function SyncIndicator({ editorInstance, providerRef }: Props) {
+export function SyncIndicator({ editorInstance: _editorInstance, providerRef }: Props) {
   const [status, setStatus] = useState<SyncStatus>("disconnected");
   const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
@@ -56,10 +69,34 @@ export function SyncIndicator({ editorInstance, providerRef }: Props) {
       // and reconcile. Cheap and self-correcting.
       const reconcileId = setInterval(seedStatus, 1000);
 
+      // Listen at the Yjs layer for change activity. Hocuspocus
+      // stores the ydoc on `provider.document` (it's the same Y.Doc
+      // we passed in when constructing the provider). Filtering out
+      // updates whose origin is the provider itself avoids flashing
+      // "Saving..." every time we just RECEIVED collab updates from
+      // someone else - those don't need to be saved by us, they were
+      // saved by their author.
+      const ydoc = (p as any).document as
+        | { on: Function; off: Function }
+        | undefined;
+      const onYUpdate = (_update: Uint8Array, origin: unknown) => {
+        if (origin === p) return;
+        setStatus("syncing");
+        if (timerRef.current) clearTimeout(timerRef.current);
+        timerRef.current = setTimeout(() => {
+          const wsProvider = (p as any).configuration?.websocketProvider;
+          setStatus(
+            wsProvider?.status === "connected" ? "saved" : "disconnected",
+          );
+        }, 1500);
+      };
+      ydoc?.on?.("update", onYUpdate);
+
       return () => {
         p.off("connect", onConnect);
         p.off("disconnect", onDisconnect);
         p.off("synced", onSynced);
+        ydoc?.off?.("update", onYUpdate);
         clearInterval(reconcileId);
       };
     };
@@ -87,22 +124,6 @@ export function SyncIndicator({ editorInstance, providerRef }: Props) {
     };
   }, [providerRef]);
 
-  useEffect(() => {
-    const editor = editorInstance;
-    if (!editor) return;
-    const onUpdate = () => {
-      setStatus("syncing");
-      if (timerRef.current) clearTimeout(timerRef.current);
-      timerRef.current = setTimeout(() => {
-        const p = providerRef.current;
-        const wsProvider = (p as any)?.configuration?.websocketProvider;
-        setStatus(wsProvider?.status === "connected" ? "saved" : "disconnected");
-      }, 1500);
-    };
-    editor.on("update", onUpdate);
-    return () => { editor.off("update", onUpdate); };
-  }, [editorInstance, providerRef]);
-
   const label =
     status === "saved" ? "Saved" :
     status === "syncing" ? "Saving..." :