-
-
Notifications
You must be signed in to change notification settings - Fork 2.8k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(nbstore): add awareness frontend
- Loading branch information
Showing
20 changed files
with
538 additions
and
64 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,70 @@ | ||
| import { nanoid } from 'nanoid'; | ||
| import { | ||
| applyAwarenessUpdate, | ||
| type Awareness, | ||
| encodeAwarenessUpdate, | ||
| } from 'y-protocols/awareness.js'; | ||
|
|
||
| import type { AwarenessRecord } from '../storage/awareness'; | ||
| import type { AwarenessSync } from '../sync/awareness'; | ||
|
|
||
| type AwarenessChanges = Record<'added' | 'updated' | 'removed', number[]>; | ||
|
|
||
| export class AwarenessFrontend { | ||
| constructor(private readonly sync: AwarenessSync) {} | ||
|
|
||
| connect(awareness: Awareness) { | ||
| const uniqueId = nanoid(); | ||
| const handleAwarenessUpdate = ( | ||
| changes: AwarenessChanges, | ||
| origin: string | ||
| ) => { | ||
| if (origin === uniqueId) { | ||
| return; | ||
| } | ||
| const changedClients = Object.values(changes).reduce((res, cur) => | ||
| res.concat(cur) | ||
| ); | ||
|
|
||
| const update = encodeAwarenessUpdate(awareness, changedClients); | ||
|
|
||
| this.sync | ||
| .update( | ||
| { | ||
| docId: awareness.doc.guid, | ||
| bin: update, | ||
| }, | ||
| uniqueId | ||
| ) | ||
| .catch(error => { | ||
| console.error('update awareness error', error); | ||
| }); | ||
| }; | ||
|
|
||
| awareness.on('update', handleAwarenessUpdate); | ||
| const handleSyncUpdate = (update: AwarenessRecord, origin?: string) => { | ||
| if (origin === uniqueId) { | ||
| // skip self update | ||
| return; | ||
| } | ||
|
|
||
| applyAwarenessUpdate(awareness, update.bin, origin); | ||
| }; | ||
| const handleSyncCollect = () => { | ||
| return { | ||
| docId: awareness.doc.guid, | ||
| bin: encodeAwarenessUpdate(awareness, [awareness.clientID]), | ||
| }; | ||
| }; | ||
| const unsubscribe = this.sync.subscribeUpdate( | ||
| awareness.doc.guid, | ||
| handleSyncUpdate, | ||
| handleSyncCollect | ||
| ); | ||
|
|
||
| return () => { | ||
| awareness.off('update', handleAwarenessUpdate); | ||
| unsubscribe(); | ||
| }; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
128 changes: 128 additions & 0 deletions
128
packages/common/nbstore/src/impls/broadcast-channel/awareness.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,128 @@ | ||
| import { nanoid } from 'nanoid'; | ||
|
|
||
| import { | ||
| type AwarenessRecord, | ||
| AwarenessStorage, | ||
| } from '../../storage/awareness'; | ||
| import { BroadcastChannelConnection } from './channel'; | ||
|
|
||
| type ChannelMessage = | ||
| | { | ||
| type: 'awareness-update'; | ||
| docId: string; | ||
| bin: Uint8Array; | ||
| origin?: string; | ||
| } | ||
| | { | ||
| type: 'awareness-collect'; | ||
| docId: string; | ||
| collectId: string; | ||
| } | ||
| | { | ||
| type: 'awareness-collect-fallback'; | ||
| docId: string; | ||
| bin: Uint8Array; | ||
| collectId: string; | ||
| }; | ||
|
|
||
| export class BroadcastChannelAwarenessStorage extends AwarenessStorage { | ||
| override readonly storageType = 'awareness'; | ||
| override readonly connection = new BroadcastChannelConnection(this.options); | ||
| get channel() { | ||
| return this.connection.inner; | ||
| } | ||
|
|
||
| private readonly subscriptions = new Map< | ||
| string, | ||
| Set<{ | ||
| onUpdate: (update: AwarenessRecord, origin?: string) => void; | ||
| onCollect: () => AwarenessRecord; | ||
| }> | ||
| >(); | ||
|
|
||
| override update(record: AwarenessRecord, origin?: string): Promise<void> { | ||
| const subscribers = this.subscriptions.get(record.docId); | ||
| if (subscribers) { | ||
| subscribers.forEach(subscriber => subscriber.onUpdate(record, origin)); | ||
| } | ||
| this.channel.postMessage({ | ||
| type: 'awareness-update', | ||
| docId: record.docId, | ||
| bin: record.bin, | ||
| origin, | ||
| } satisfies ChannelMessage); | ||
| return Promise.resolve(); | ||
| } | ||
|
|
||
| override subscribeUpdate( | ||
| id: string, | ||
| onUpdate: (update: AwarenessRecord, origin?: string) => void, | ||
| onCollect: () => AwarenessRecord | ||
| ): () => void { | ||
| const subscribers = this.subscriptions.get(id) ?? new Set(); | ||
| subscribers.forEach(subscriber => { | ||
| const fallback = subscriber.onCollect(); | ||
| onUpdate(fallback); | ||
| }); | ||
|
|
||
| const collectUniqueId = nanoid(); | ||
|
|
||
| const onChannelMessage = (message: MessageEvent<ChannelMessage>) => { | ||
| if ( | ||
| message.data.type === 'awareness-update' && | ||
| message.data.docId === id | ||
| ) { | ||
| onUpdate( | ||
| { | ||
| docId: message.data.docId, | ||
| bin: message.data.bin, | ||
| }, | ||
| message.data.origin | ||
| ); | ||
| } | ||
| if ( | ||
| message.data.type === 'awareness-collect' && | ||
| message.data.docId === id | ||
| ) { | ||
| const fallback = onCollect(); | ||
| if (fallback) { | ||
| this.channel.postMessage({ | ||
| type: 'awareness-collect-fallback', | ||
| docId: message.data.docId, | ||
| bin: fallback.bin, | ||
| collectId: collectUniqueId, | ||
| } satisfies ChannelMessage); | ||
| } | ||
| } | ||
| if ( | ||
| message.data.type === 'awareness-collect-fallback' && | ||
| message.data.docId === id && | ||
| message.data.collectId === collectUniqueId | ||
| ) { | ||
| onUpdate({ | ||
| docId: message.data.docId, | ||
| bin: message.data.bin, | ||
| }); | ||
| } | ||
| }; | ||
|
|
||
| this.channel.addEventListener('message', onChannelMessage); | ||
| this.channel.postMessage({ | ||
| type: 'awareness-collect', | ||
| docId: id, | ||
| collectId: collectUniqueId, | ||
| } satisfies ChannelMessage); | ||
|
|
||
| const subscriber = { | ||
| onUpdate, | ||
| onCollect, | ||
| }; | ||
| subscribers.add(subscriber); | ||
| this.subscriptions.set(id, subscribers); | ||
|
|
||
| return () => { | ||
| subscribers.delete(subscriber); | ||
| this.channel.removeEventListener('message', onChannelMessage); | ||
| }; | ||
| } | ||
| } |
23 changes: 23 additions & 0 deletions
23
packages/common/nbstore/src/impls/broadcast-channel/channel.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| import { Connection } from '../../connection'; | ||
| import type { StorageOptions } from '../../storage'; | ||
|
|
||
| export class BroadcastChannelConnection extends Connection<BroadcastChannel> { | ||
| readonly channelName = `channel:${this.opts.peer}:${this.opts.type}:${this.opts.id}`; | ||
|
|
||
| constructor(private readonly opts: StorageOptions) { | ||
| super(); | ||
| } | ||
|
|
||
| override async doConnect() { | ||
| return new BroadcastChannel(this.channelName); | ||
| } | ||
|
|
||
| override async doDisconnect() { | ||
| this.close(); | ||
| } | ||
|
|
||
| private close(error?: Error) { | ||
| this.maybeConnection?.close(); | ||
| this.setStatus('closed', error); | ||
| } | ||
| } |
Oops, something went wrong.