Use the new storage feature for the CollaborationCursor extension (#2096)
* extension-collaboration-cursor: make use of the new storage feature, deprecate users command and onUsers callback, clean up * docs: update the jobs page
This commit is contained in:
@@ -1,10 +1,17 @@
|
||||
import { Extension } from '@tiptap/core'
|
||||
import { yCursorPlugin } from 'y-prosemirror'
|
||||
|
||||
type CollaborationCursorStorage = {
|
||||
users: { clientId: number, [key: string]: any }[],
|
||||
}
|
||||
|
||||
export interface CollaborationCursorOptions {
|
||||
provider: any,
|
||||
user: Record<string, any>,
|
||||
render (user: Record<string, any>): HTMLElement,
|
||||
/**
|
||||
* @deprecated The "onUpdate" option is deprecated. Please use `editor.storage.collaborationCursor.users` instead. Read more: https://tiptap.dev/api/extensions/collaboration-cursor
|
||||
*/
|
||||
onUpdate: (users: { clientId: number, [key: string]: any }[]) => null,
|
||||
}
|
||||
|
||||
@@ -14,6 +21,12 @@ declare module '@tiptap/core' {
|
||||
/**
|
||||
* Update details of the current user
|
||||
*/
|
||||
updateUser: (attributes: Record<string, any>) => ReturnType,
|
||||
/**
|
||||
* Update details of the current user
|
||||
*
|
||||
* @deprecated The "user" command is deprecated. Please use "updateUser" instead. Read more: https://tiptap.dev/api/extensions/collaboration-cursor
|
||||
*/
|
||||
user: (attributes: Record<string, any>) => ReturnType,
|
||||
}
|
||||
}
|
||||
@@ -28,7 +41,9 @@ const awarenessStatesToArray = (states: Map<number, Record<string, any>>) => {
|
||||
})
|
||||
}
|
||||
|
||||
export const CollaborationCursor = Extension.create<CollaborationCursorOptions>({
|
||||
const defaultOnUpdate = () => null
|
||||
|
||||
export const CollaborationCursor = Extension.create<CollaborationCursorOptions, CollaborationCursorStorage>({
|
||||
name: 'collaborationCursor',
|
||||
|
||||
addOptions() {
|
||||
@@ -51,19 +66,36 @@ export const CollaborationCursor = Extension.create<CollaborationCursorOptions>(
|
||||
|
||||
return cursor
|
||||
},
|
||||
onUpdate: () => null,
|
||||
onUpdate: defaultOnUpdate,
|
||||
}
|
||||
},
|
||||
|
||||
onCreate() {
|
||||
if (this.options.onUpdate !== defaultOnUpdate) {
|
||||
console.warn('[tiptap warn]: DEPRECATED: The "onUpdate" option is deprecated. Please use `editor.storage.collaborationCursor.users` instead. Read more: https://tiptap.dev/api/extensions/collaboration-cursor')
|
||||
}
|
||||
},
|
||||
|
||||
addStorage() {
|
||||
return {
|
||||
users: [],
|
||||
}
|
||||
},
|
||||
|
||||
addCommands() {
|
||||
return {
|
||||
user: attributes => () => {
|
||||
updateUser: attributes => () => {
|
||||
this.options.user = attributes
|
||||
|
||||
this.options.provider.awareness.setLocalStateField('user', this.options.user)
|
||||
|
||||
return true
|
||||
},
|
||||
user: attributes => ({ editor }) => {
|
||||
console.warn('[tiptap warn]: DEPRECATED: The "user" command is deprecated. Please use "updateUser" instead. Read more: https://tiptap.dev/api/extensions/collaboration-cursor')
|
||||
|
||||
return editor.commands.updateUser(attributes)
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
@@ -72,22 +104,12 @@ export const CollaborationCursor = Extension.create<CollaborationCursorOptions>(
|
||||
yCursorPlugin((() => {
|
||||
this.options.provider.awareness.setLocalStateField('user', this.options.user)
|
||||
|
||||
this.options.provider.awareness.on('change', () => {
|
||||
this.options.onUpdate(awarenessStatesToArray(this.options.provider.awareness.states))
|
||||
})
|
||||
this.storage.users = awarenessStatesToArray(this.options.provider.awareness.states)
|
||||
|
||||
this.options.provider.awareness.on('update', () => {
|
||||
this.options.onUpdate(awarenessStatesToArray(this.options.provider.awareness.states))
|
||||
this.storage.users = awarenessStatesToArray(this.options.provider.awareness.states)
|
||||
})
|
||||
|
||||
this.options.provider.on('status', (event: { status: string }) => {
|
||||
if (event.status === 'connected') {
|
||||
this.options.provider.awareness.setLocalStateField('user', this.options.user)
|
||||
}
|
||||
})
|
||||
|
||||
this.options.onUpdate(awarenessStatesToArray(this.options.provider.awareness.states))
|
||||
|
||||
return this.options.provider.awareness
|
||||
})(),
|
||||
// @ts-ignore
|
||||
|
||||
Reference in New Issue
Block a user