feat: use YHub activity timeline for yjs versioning

Wire the 13-versioning-yjs14 example to the YHub versioning adapter and
make YHub's /activity timeline the source of truth for versions.

- yhub.ts: fix v1/v2 update encoding mismatch (getContent converts
  v1->v2, create writes v1); list/create/restore now derive version
  identity from YHub activity timestamps; drop unused metaStore concept
  and updateSnapshotName
- Versioning.ts: make Yjs adapter applyRestore a no-op since YHub
  /rollback publishes the reverting update over live sync
- Snapshot.tsx: render version name as static text when
  updateSnapshotName is unsupported instead of a read-only input
- example: point websocket + versioning at YHub, load versions on mount,
  remove localStorage/named-filter scaffolding

Author: nperez0111

examples/07-collaboration/13-versioning-yjs14/src/App.tsx

@@ -1,30 +1,48 @@
 import "@blocknote/core/fonts/inter.css";
-import { withCollaboration } from "@blocknote/core/y";
+import {
+  createYHubVersioningEndpoints,
+  withCollaboration,
+} from "@blocknote/core/y";
 import { VersioningExtension } from "@blocknote/core/extensions";
-import { localStorageEndpoints } from "./localStorageEndpoints.js";
 import {
   BlockNoteViewEditor,
   useCreateBlockNote,
+  useExtension,
   useExtensionState,
 } from "@blocknote/react";
+import { useEffect } from "react";
 import { BlockNoteView } from "@blocknote/mantine";
 import "@blocknote/mantine/style.css";
 
 import * as Y from "@y/y";
 import { WebsocketProvider } from "@y/websocket";
 
-import { VersionHistorySidebar } from "./VersionHistorySidebar";
+import { VersionHistorySidebar } from "./VersionHistorySidebar.js";
 import "./style.css";
 
-const roomName = "blocknote-versioning-y-example";
+// YHub serves both real-time sync (over WebSocket) and version history (over
+// HTTP) for the same document, so the backend URL, org, and docId are shared.
+const yhubHost = "yhub-standalone-x9kss.ondigitalocean.app";
+const org = "blocknote-versioning-yjs14";
+const docId = "blocknote-versioning-y-example-4";
+
 const doc = new Y.Doc();
+// YHub expects clients to connect to `/ws/{org}/{docId}`. WebsocketProvider
+// joins its base URL and room with a slash, so the room is `{org}/{docId}`.
 const provider = new WebsocketProvider(
-  "wss://demos.yjs.dev/ws",
-  roomName,
+  `wss://${yhubHost}/ws`,
+  `${org}/${docId}`,
   doc,
-  { connect: false },
 );
-provider.connectBc();
+// provider.connectBc();
+
+// YHub-backed versioning endpoints. YHub stores continuous edit history and
+// exposes its activity timeline as versions through BlockNote's versioning UI.
+const versioningEndpoints = createYHubVersioningEndpoints({
+  baseUrl: `https://${yhubHost}`,
+  org,
+  docId,
+});
 
 export default function App() {
   const editor = useCreateBlockNote(
@@ -35,7 +53,7 @@ export default function App() {
         user: { color: "#ff0000", name: "User" },
         // Pass versioningEndpoints to the v14 CollaborationExtension which
         // automatically wires up the VersioningExtension with the Yjs adapter.
-        versioningEndpoints: localStorageEndpoints,
+        versioningEndpoints,
       },
     }),
   );
@@ -44,6 +62,14 @@ export default function App() {
     editor,
   });
 
+  // The versioning store starts empty on every page load, so fetch the list of
+  // versions from YHub once when the editor mounts. Without this, the sidebar
+  // only shows versions created during the current session.
+  const versioning = useExtension(VersioningExtension, { editor });
+  useEffect(() => {
+    void versioning.listSnapshots();
+  }, [versioning]);
+
   return (
     <div className="wrapper">
       <BlockNoteView

examples/07-collaboration/13-versioning-yjs14/src/SettingsSelect.tsx

@@ -1,33 +1,11 @@
 import { VersioningSidebar } from "@blocknote/react";
-import { useState } from "react";
-
-import { SettingsSelect } from "./SettingsSelect";
 
 export const VersionHistorySidebar = () => {
-  const [filter, setFilter] = useState<"named" | "all">("all");
-
+  // YHub's activity timeline is the source of truth for versions, and YHub has
+  // no concept of a custom/pinned name, so every version is shown ("all").
   return (
     <div className={"sidebar-section"}>
-      <div className={"settings"}>
-        <SettingsSelect
-          label={"Filter"}
-          items={[
-            {
-              text: "All",
-              icon: null,
-              onClick: () => setFilter("all"),
-              isSelected: filter === "all",
-            },
-            {
-              text: "Named",
-              icon: null,
-              onClick: () => setFilter("named"),
-              isSelected: filter === "named",
-            },
-          ]}
-        />
-      </div>
-      <VersioningSidebar filter={filter} />
+      <VersioningSidebar filter={"all"} />
     </div>
   );
 };

examples/07-collaboration/13-versioning-yjs14/src/VersionHistorySidebar.tsx

@@ -55,9 +55,17 @@ export function createYjsVersioningAdapter(
         editor.exec(configureYProsemirror({ ytype: fragment }));
       },
       applyRestore: (_snapshotContent: Uint8Array) => {
-        throw new Error(
-          "Restore is not yet implemented for Yjs versioning adapter.",
-        );
+        // For Yjs-backed versioning, restoration happens on the server (e.g.
+        // YHub's `/rollback` endpoint) which publishes a reverting update to
+        // the document's room. That update propagates back to this client over
+        // the live sync connection and updates `fragment` automatically, so
+        // there is nothing to apply locally — we only need to leave preview
+        // mode. `exitPreview` is already called by the base extension before
+        // this runs, so this is a no-op.
+        //
+        // Note: this assumes `endpoints.restore` performs the server-side
+        // restore. The default in-memory adapter has no server, which is why
+        // this is specific to the Yjs collaboration setup.
       },
     },
   };