From b93f66295f64cc228668e73b8ca4f32fe14a4eef Mon Sep 17 00:00:00 2001 From: "David P. Novakovic" Date: Fri, 6 Dec 2024 10:15:15 +1000 Subject: [PATCH 1/4] fix: options allow a byo provider, but overwrite it during plugin config. --- packages/yjs/src/lib/BaseYjsPlugin.ts | 35 +++++++++++++++++++++++---- 1 file changed, 30 insertions(+), 5 deletions(-) diff --git a/packages/yjs/src/lib/BaseYjsPlugin.ts b/packages/yjs/src/lib/BaseYjsPlugin.ts index 4f8235fa3d..1d0c222729 100644 --- a/packages/yjs/src/lib/BaseYjsPlugin.ts +++ b/packages/yjs/src/lib/BaseYjsPlugin.ts @@ -1,4 +1,8 @@ -import type { HocuspocusProviderConfiguration } from '@hocuspocus/provider'; +import type { + HocuspocusProviderConfiguration, + onDisconnectParameters, + onSyncedParameters, +} from '@hocuspocus/provider'; import type { WithCursorsOptions } from '@slate-yjs/core'; import { HocuspocusProvider } from '@hocuspocus/provider'; @@ -44,11 +48,32 @@ export const BaseYjsPlugin = createTSlatePlugin({ options: { isConnected: false, isSynced: false, - provider: {} as any, }, }).extend(({ getOptions, setOption }) => { - const { hocuspocusProviderOptions } = getOptions(); + const { hocuspocusProviderOptions, provider } = getOptions(); + if (provider) { + provider.setConfiguration({ + onAwarenessChange() {}, + onConnect() { + setOption('isConnected', true); + provider.onConnect(); + }, + onDisconnect(data: onDisconnectParameters) { + setOption('isConnected', false); + setOption('isSynced', false); + provider.onDisconnect(data); + }, + onSynced(data: onSyncedParameters) { + setOption('isSynced', true); + provider.onSynced(data); + }, + }); + + return { + options: { provider }, + }; + } if (!hocuspocusProviderOptions) { throw new Error('HocuspocusProvider configuration is required'); } @@ -58,7 +83,7 @@ export const BaseYjsPlugin = createTSlatePlugin({ * connected ydoc, is not destroyed, the changes will be synced to other * clients via the connected server. */ - const provider = new HocuspocusProvider({ + const defaultProvider = new HocuspocusProvider({ ...hocuspocusProviderOptions, onAwarenessChange() {}, onConnect() { @@ -77,6 +102,6 @@ export const BaseYjsPlugin = createTSlatePlugin({ }); return { - options: { provider }, + options: { provider: defaultProvider }, }; }); From 079b13f95117a6a5027be65c060dfff3cd28f618 Mon Sep 17 00:00:00 2001 From: "David P. Novakovic" Date: Fri, 6 Dec 2024 10:26:06 +1000 Subject: [PATCH 2/4] doc: update collab docs and include changeset. --- .changeset/itchy-swans-kick.md | 5 +++++ apps/www/content/docs/collaboration.mdx | 7 +++++-- 2 files changed, 10 insertions(+), 2 deletions(-) create mode 100644 .changeset/itchy-swans-kick.md diff --git a/.changeset/itchy-swans-kick.md b/.changeset/itchy-swans-kick.md new file mode 100644 index 0000000000..b0c01a8b42 --- /dev/null +++ b/.changeset/itchy-swans-kick.md @@ -0,0 +1,5 @@ +--- +'@udecode/plate-yjs': patch +--- + +Allow BYO provider instead of plate hocuspocus setup. diff --git a/apps/www/content/docs/collaboration.mdx b/apps/www/content/docs/collaboration.mdx index 04793a286f..351ea7aa9a 100644 --- a/apps/www/content/docs/collaboration.mdx +++ b/apps/www/content/docs/collaboration.mdx @@ -35,8 +35,8 @@ const editor = createPlateEditor({ YjsPlugin.configure({ options: { hocuspocusProviderOptions: { - url: "https://hocuspocus.test/hocuspocus", - name: "test", + url: 'https://hocuspocus.test/hocuspocus', + name: 'test', }, }, }), @@ -44,6 +44,9 @@ const editor = createPlateEditor({ }); ``` +As an alternative to allowing plate to create the provider, you may want to pass it yourself. +This can be passed as the `provider` field to `options`. + ## Backend Follow the backend instructions in [Hocuspocus docs](https://tiptap.dev/hocuspocus/getting-started). From 73ff489a10446555c03c9961a3a0229fa540b469 Mon Sep 17 00:00:00 2001 From: "David P. Novakovic" Date: Thu, 12 Dec 2024 10:12:06 +1000 Subject: [PATCH 3/4] wip: doco --- apps/www/content/docs/collaboration.mdx | 9 +++++++++ packages/yjs/src/lib/BaseYjsPlugin.ts | 4 ++-- 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/apps/www/content/docs/collaboration.mdx b/apps/www/content/docs/collaboration.mdx index 351ea7aa9a..98598f34ff 100644 --- a/apps/www/content/docs/collaboration.mdx +++ b/apps/www/content/docs/collaboration.mdx @@ -72,6 +72,15 @@ Configuration for the Hocuspocus provider. - [HocuspocusProviderConfiguration API](https://tiptap.dev/hocuspocus/provider/configuration). + + +If you have a provider instance already pass it here instead of using `hocuspocusProviderOptions` + +- [HocuspocusProvider API](https://tiptap.dev/hocuspocus/provider/). + Optional configuration for the Yjs integration. These options are passed to diff --git a/packages/yjs/src/lib/BaseYjsPlugin.ts b/packages/yjs/src/lib/BaseYjsPlugin.ts index 1d0c222729..5193d4e3dd 100644 --- a/packages/yjs/src/lib/BaseYjsPlugin.ts +++ b/packages/yjs/src/lib/BaseYjsPlugin.ts @@ -23,18 +23,18 @@ export type YjsPluginOptions< isSynced: boolean; - provider: HocuspocusProvider; - /** WithCursors options */ cursorOptions?: WithCursorsOptions; disableCursors?: boolean; + /** * HocuspocusProvider configuration * * @required */ hocuspocusProviderOptions?: HocuspocusProviderConfiguration; + provider?: HocuspocusProvider; /** WithYjs options */ yjsOptions?: WithYjsOptions; From af73b178fe83e3cbb972b5abccfbea07ec17f7bd Mon Sep 17 00:00:00 2001 From: "David P. Novakovic" Date: Mon, 17 Mar 2025 21:46:30 +1000 Subject: [PATCH 4/4] Use regular event handlers if the provider already exists. --- packages/yjs/src/lib/BaseYjsPlugin.ts | 32 +++++++++------------------ packages/yjs/src/lib/withPlateYjs.ts | 3 +++ yarn.lock | 4 ++-- 3 files changed, 16 insertions(+), 23 deletions(-) diff --git a/packages/yjs/src/lib/BaseYjsPlugin.ts b/packages/yjs/src/lib/BaseYjsPlugin.ts index 637b5ac97c..d6ec783576 100644 --- a/packages/yjs/src/lib/BaseYjsPlugin.ts +++ b/packages/yjs/src/lib/BaseYjsPlugin.ts @@ -1,8 +1,4 @@ -import type { - HocuspocusProviderConfiguration, - onDisconnectParameters, - onSyncedParameters, -} from '@hocuspocus/provider'; +import type { HocuspocusProviderConfiguration } from '@hocuspocus/provider'; import type { WithCursorsOptions } from '@slate-yjs/core'; import { HocuspocusProvider } from '@hocuspocus/provider'; @@ -17,7 +13,7 @@ export type YjsConfig = PluginConfig< { isConnected: boolean; isSynced: boolean; - provider: HocuspocusProvider; + provider?: HocuspocusProvider; /** WithCursors options */ cursorOptions?: WithCursorsOptions; disableCursors?: boolean; @@ -43,21 +39,15 @@ export const BaseYjsPlugin = createTSlatePlugin({ const { hocuspocusProviderOptions, provider } = getOptions(); if (provider) { - provider.setConfiguration({ - onAwarenessChange() { }, - onConnect() { - setOption('isConnected', true); - provider.onConnect(); - }, - onDisconnect(data: onDisconnectParameters) { - setOption('isConnected', false); - setOption('isSynced', false); - provider.onDisconnect(data); - }, - onSynced(data: onSyncedParameters) { - setOption('isSynced', true); - provider.onSynced(data); - }, + provider.on('connect', () => { + setOption('isConnected', true); + }); + provider.on('disconnect', () => { + setOption('isConnected', false); + setOption('isSynced', false); + }); + provider.on('synced', () => { + setOption('isSynced', true); }); return { diff --git a/packages/yjs/src/lib/withPlateYjs.ts b/packages/yjs/src/lib/withPlateYjs.ts index 3f511af0f0..eb291d9956 100644 --- a/packages/yjs/src/lib/withPlateYjs.ts +++ b/packages/yjs/src/lib/withPlateYjs.ts @@ -17,6 +17,9 @@ export const withPlateYjs: ExtendEditor = ({ // not reactive const { cursorOptions, disableCursors, provider, yjsOptions } = getOptions(); + if (!provider) + throw new Error('HocuspocusProvider configuration is required'); + const sharedType = provider.document.get( 'content', Y.XmlText diff --git a/yarn.lock b/yarn.lock index a8c5023f85..40a064e9e3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6360,7 +6360,7 @@ __metadata: resolution: "@udecode/plate-ai@workspace:packages/ai" dependencies: "@udecode/plate-combobox": "npm:44.0.0" - "@udecode/plate-markdown": "npm:46.0.3" + "@udecode/plate-markdown": "npm:46.0.8" "@udecode/plate-selection": "npm:46.0.4" ai: "npm:^3.4.33" lodash: "npm:^4.17.21" @@ -6832,7 +6832,7 @@ __metadata: languageName: unknown linkType: soft -"@udecode/plate-markdown@npm:46.0.3, @udecode/plate-markdown@workspace:^, @udecode/plate-markdown@workspace:packages/markdown": +"@udecode/plate-markdown@npm:46.0.8, @udecode/plate-markdown@workspace:^, @udecode/plate-markdown@workspace:packages/markdown": version: 0.0.0-use.local resolution: "@udecode/plate-markdown@workspace:packages/markdown" dependencies: