@cuboapp/crdt 1.0.14 → 1.0.16

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cuboapp/crdt",
-  "version": "1.0.14",
+  "version": "1.0.16",
   "description": "CRDT for CUBO",
   "main": "src/index.ts",
   "repository": {
@@ -19,7 +19,7 @@
   "dependencies": {
     "@cuboapp/types": "^2.0.14",
     "@cuboapp/utils": "1.0.12",
-    "@cuboapp/ws": "1.0.9",
+    "@cuboapp/ws": "1.0.10",
     "y-protocols": "^1.0.7",
     "yjs": "^13.6.31"
   },

package/src/client/index.ts

@@ -6,7 +6,11 @@ import { applyUpdate, Doc } from 'yjs'
 
 import { CUBO_CRDT_EVENT } from '../constants'
 import { CuboCrdtServerDocumentIncomingAction } from '../server'
-import { CuboCrdtKey } from '../types'
+import {
+  CuboCrdtKey,
+  CuboCrdtListSyncData,
+  CuboCrdtSubscriptionStatus
+} from '../types'
 
 import { AsyncSerialQueue } from './queue'
 import {
@@ -28,9 +32,30 @@ export class CuboCrdtClient<M> {
   private listeners: Map<string, Map<string, (ctx: CuboCrdtClientSubscribeEvent) => void | Promise<void>>> = new Map()
 
   // реестр активных подписок — нужен, чтобы переподписаться после реконнекта
-  private subscriptions = new Map<string, { entity: string; filters?: Record<string, any>; awareness?: boolean }>()
-  private connectedOnce = false
+  private subscriptions = new Map<
+    string,
+    {
+      entity: string
+      storeKey: string
+      filters?: Record<string, any>
+      awareness?: boolean
+      paginated?: boolean
+    }
+  >()
   private onReconnect = () => this.resubscribeAll()
+  private onDisconnect = () => {
+    for (const sub of this.subscriptions.values()) {
+      const state = this.store[sub.storeKey]?.state
+      if (!state) {
+        continue
+      }
+
+      state.subscribed = false
+      state.loading = true
+      state.status = 'loading'
+      state.error = undefined
+    }
+  }
 
   private eventQueue = new AsyncSerialQueue({
     errorMode: 'continue',
@@ -43,12 +68,9 @@ export class CuboCrdtClient<M> {
   }
 
   async start() {
-    // если сокет уже подключён к моменту старта — считаем текущий коннект «первым»,
-    // чтобы первое же событие CONNECTED (после обрыва) сработало как переподписка
-    this.connectedOnce = this.ws.connected
-
     // переподписываемся на все документы при (ре)коннекте сокета
     this.ws.ee.on(WsClientEvent.CONNECTED, this.onReconnect)
+    this.ws.ee.on(WsClientEvent.DISCONNECTED, this.onDisconnect)
 
     this.ws.registerHandler(CUBO_CRDT_EVENT.EVENT, ({ message }) => {
       this.eventQueue
@@ -83,12 +105,12 @@ export class CuboCrdtClient<M> {
 
   async stop() {
     this.ws.ee.off(WsClientEvent.CONNECTED, this.onReconnect)
+    this.ws.ee.off(WsClientEvent.DISCONNECTED, this.onDisconnect)
 
     this.ws.deleteHandler(CUBO_CRDT_EVENT.EVENT)
 
     this.listeners.clear()
     this.subscriptions.clear()
-    this.connectedOnce = false
   }
 
   /**
@@ -101,28 +123,59 @@ export class CuboCrdtClient<M> {
    * навешивать слушатели не нужно.
    */
   private resubscribeAll() {
-    // первый коннект — useList() уже сам отправил SUBSCRIBE, дублировать не нужно
-    if (!this.connectedOnce) {
-      this.connectedOnce = true
-      return
-    }
-
     if (this.debug) {
       console.log('[CRDT] reconnected, resubscribing', { count: this.subscriptions.size })
     }
 
     for (const [subscribe_id, sub] of this.subscriptions) {
-      try {
-        this.ws.request({
-          method: CUBO_CRDT_EVENT.SUBSCRIBE,
-          data: { subscribe_id, entity: sub.entity, filters: sub.filters, awareness: sub.awareness }
-        })
-      } catch (e) {
-        console.error('[CRDT] resubscribe failed', subscribe_id, e)
+      const state = this.store[sub.storeKey]?.state
+      if (state) {
+        state.subscribed = false
+        state.loading = true
+        state.status = 'loading'
+        state.error = undefined
       }
+
+      void this.ws
+        .request(
+          {
+            method: CUBO_CRDT_EVENT.SUBSCRIBE,
+            data: {
+              subscribe_id,
+              entity: sub.entity,
+              filters: sub.filters,
+              awareness: sub.awareness,
+              paginated: sub.paginated
+            }
+          },
+          { wait: true, timeout: 10_000 }
+        )
+        .catch((e) => {
+          const currentState = this.store[sub.storeKey]?.state
+          if (currentState) {
+            currentState.subscribed = false
+            currentState.loading = false
+            currentState.status = 'error'
+            currentState.error = e
+          }
+
+          if (this.debug) {
+            console.error('[CRDT] resubscribe failed', subscribe_id, e)
+          }
+        })
     }
   }
 
+  private resolvePaginated(filters?: Record<string, any>, explicit?: boolean) {
+    if (explicit !== undefined) {
+      return explicit
+    }
+
+    const page = Number(filters?.page)
+    const limit = Number(filters?.limit)
+    return Number.isFinite(page) && page > 0 && Number.isFinite(limit) && limit > 0
+  }
+
   public useComputedList<K extends Extract<keyof M, string>>(entity: K) {
     return computed(() => (this.store[entity]?.state.rows || []) as M[K][])
   }
@@ -146,7 +199,12 @@ export class CuboCrdtClient<M> {
     if (this.store[storeKey] === undefined) {
       const state = reactive({
         rows: [],
-        subscribed: false
+        subscribed: false,
+        loading: false,
+        status: 'idle' as CuboCrdtSubscriptionStatus,
+        error: undefined,
+        totals: {},
+        revision: 0
       })
 
       this.store[storeKey] = {
@@ -158,14 +216,18 @@ export class CuboCrdtClient<M> {
 
     // подписка
     const subscribe = (filters?: Record<string, any>) => {
-      if (this.store[storeKey]?.state.subscribed) {
+      const currentState = this.store[storeKey]?.state
+      if (currentState?.subscribed || currentState?.loading) {
         return
       }
 
-      // ставим сразу флаг, потому что не может быть ошибок (считаем так)
-      this.store[storeKey]!.state.subscribed = true
+      this.store[storeKey]!.state.subscribed = false
+      this.store[storeKey]!.state.loading = true
+      this.store[storeKey]!.state.status = 'loading'
+      this.store[storeKey]!.state.error = undefined
 
       filters = filters !== undefined ? filters : opts?.filters
+      const paginated = this.resolvePaginated(filters, opts?.paginated)
 
       if (this.debug) {
         console.log('[CRDT] subscribe', { entity, opts, filters })
@@ -189,15 +251,43 @@ export class CuboCrdtClient<M> {
       })
 
       // регистрируем подписку, чтобы переподписаться после реконнекта
-      this.subscriptions.set(subscribe_id, { entity: `${entity}`, filters, awareness: opts?.awareness })
+      this.subscriptions.set(subscribe_id, {
+        entity: `${entity}`,
+        storeKey,
+        filters,
+        awareness: opts?.awareness,
+        paginated
+      })
 
       // подписываемся на бэке (если сокет ещё не подключён — переподпишемся по событию CONNECTED)
-      try {
-        this.ws.request({ method: CUBO_CRDT_EVENT.SUBSCRIBE, data: { subscribe_id, entity, filters, awareness: opts?.awareness } })
-      } catch (e) {
-        if (this.debug) {
-          console.warn('[CRDT] subscribe deferred until reconnect', subscribe_id, e)
-        }
+      if (this.ws.connected) {
+        void this.ws
+          .request(
+            {
+              method: CUBO_CRDT_EVENT.SUBSCRIBE,
+              data: {
+                subscribe_id,
+                entity,
+                filters,
+                awareness: opts?.awareness,
+                paginated
+              }
+            },
+            { wait: true, timeout: 10_000 }
+          )
+          .catch((e) => {
+            const state = this.store[storeKey]?.state
+            if (state) {
+              state.subscribed = false
+              state.loading = false
+              state.status = 'error'
+              state.error = e
+            }
+
+            if (this.debug) {
+              console.warn('[CRDT] subscribe deferred until reconnect', subscribe_id, e)
+            }
+          })
       }
     }
 
@@ -211,18 +301,23 @@ export class CuboCrdtClient<M> {
       this.subscriptions.delete(subscribe_id)
 
       // отписываемся на бэке
-      try {
-        this.ws.request({ method: CUBO_CRDT_EVENT.UNSUBSCRIBE, data: { subscribe_id } })
-      } catch (e) {
-        if (this.debug) {
-          console.warn('[CRDT] unsubscribe request failed (socket down)', subscribe_id, e)
-        }
+      if (this.ws.connected) {
+        void this.ws
+          .request({ method: CUBO_CRDT_EVENT.UNSUBSCRIBE, data: { subscribe_id } })
+          .catch((e) => {
+            if (this.debug) {
+              console.warn('[CRDT] unsubscribe request failed (socket down)', subscribe_id, e)
+            }
+          })
       }
 
       // отписываемся на фронте
       this.listeners.get(entity)?.delete(subscribe_id)
 
       this.store[storeKey]!.state.subscribed = false
+      this.store[storeKey]!.state.loading = false
+      this.store[storeKey]!.state.status = 'idle'
+      this.store[storeKey]!.state.error = undefined
 
       // очищаем стор
       if (clear !== false) {
@@ -263,6 +358,12 @@ export class CuboCrdtClient<M> {
       docs: computed(() => this.store[storeKey]?.docs),
       awarenesses: opts?.awareness ? computed(() => this.store[storeKey]?.awarenesses) : undefined,
       subscribed: () => computed(() => this.store[storeKey]?.state.subscribed || false),
+      loading: () => computed(() => this.store[storeKey]?.state.loading || false),
+      ready: () => computed(() => this.store[storeKey]?.state.status === 'ready'),
+      status: () => computed(() => this.store[storeKey]?.state.status || 'idle'),
+      error: () => computed(() => this.store[storeKey]?.state.error),
+      totals: () => computed(() => this.store[storeKey]?.state.totals || {}),
+      revision: () => computed(() => this.store[storeKey]?.state.revision || 0),
       rows: () => computed(() => this.store[storeKey]?.state.rows as T[]),
       rowsById: () => computed(() => keyBy(this.store[storeKey]?.state.rows as T[], 'id' as keyof T))
     }
@@ -275,7 +376,20 @@ export class CuboCrdtClient<M> {
   ): CuboCrdtClientRow<T> {
     // console.log('store key', opts?.storeKey ?? `${entity}:${id}`)
 
-    const { subscribe_id, storeKey, docs, awarenesses, subscribe, upgrade, unsubscribe, subscribed } = this.useList(entity, {
+    const {
+      subscribe_id,
+      storeKey,
+      docs,
+      awarenesses,
+      subscribe,
+      upgrade,
+      unsubscribe,
+      subscribed,
+      loading,
+      ready,
+      status,
+      error
+    } = this.useList(entity, {
       ...opts,
       filters: opts?.filters ?? { id },
       storeKey: opts?.storeKey ?? `${entity}:${id}`
@@ -290,6 +404,10 @@ export class CuboCrdtClient<M> {
       upgrade,
       unsubscribe,
       subscribed,
+      loading,
+      ready,
+      status,
+      error,
       row: () => {
         return computed(() => {
           return (this.store[storeKey]?.state.rows?.[0] ?? null) as T
@@ -354,9 +472,39 @@ export class CuboCrdtClient<M> {
     const sub = this.subscriptions.get(subscribe_id)
     if (sub) {
       sub.filters = filters
+      sub.paginated = this.resolvePaginated(filters, sub.paginated)
+      const state = this.store[sub.storeKey]?.state
+      if (state) {
+        state.loading = true
+        state.status = 'loading'
+        state.error = undefined
+      }
     }
 
-    this.ws.request({ method: CUBO_CRDT_EVENT.UPGRADE, data: { subscribe_id, filters } })
+    if (!this.ws.connected) {
+      return
+    }
+
+    void this.ws
+      .request(
+        {
+          method: CUBO_CRDT_EVENT.UPGRADE,
+          data: { subscribe_id, filters, paginated: sub?.paginated }
+        },
+        { wait: true, timeout: 10_000 }
+      )
+      .catch((e) => {
+        const state = sub && this.store[sub.storeKey]?.state
+        if (state) {
+          state.loading = false
+          state.status = 'error'
+          state.error = e
+        }
+
+        if (this.debug) {
+          console.warn('[CRDT] upgrade deferred until reconnect', subscribe_id, e)
+        }
+      })
   }
 
   // апсертит строку в реактивное хранилище из текущего состояния yjs-документа
@@ -376,7 +524,12 @@ export class CuboCrdtClient<M> {
   }
 
   private async onDocumentCreate(ctx: CuboCrdtClientSubscribeEvent, opts: CuboCrdtClientDocUpdateOptions) {
-    const existing = this.store[opts.storeKey]?.docs.get(ctx.entity_id)
+    const entity_id = ctx.entity_id
+    if (entity_id === undefined) {
+      return
+    }
+
+    const existing = this.store[opts.storeKey]?.docs.get(entity_id)
     if (existing) {
       // документ уже есть локально (типичный кейс — повторный SUBSCRIBE после реконнекта).
       // вместо игнорирования вмёрживаем входящее состояние в существующий yjs-документ
@@ -386,7 +539,7 @@ export class CuboCrdtClient<M> {
       }
 
       applyUpdate(existing, new Uint8Array(ctx.data as any), { react: false })
-      this.applyRowJson(opts.storeKey, ctx.entity_id, existing)
+      this.applyRowJson(opts.storeKey, entity_id, existing)
       return
     }
 
@@ -410,9 +563,13 @@ export class CuboCrdtClient<M> {
         const data: CuboCrdtServerDocumentIncomingAction = {
           action: 'update',
           entity: ctx.entity,
-          entity_id: ctx.entity_id,
+          entity_id,
           data: Array.from(update),
           origin: {
+            // по умолчанию 'other' — исходную подписку исключаем (её yjs-документ уже
+            // применил изменение локально). Без этого апдейты от TipTap/y-prosemirror
+            // приходят без expose и сервер эхом шлёт их обратно самому автору.
+            expose: 'other',
             ...pick(origin || {}, ['store', 'keys', 'expose']),
             subscribe_id: opts?.subscribe_id
           }
@@ -426,14 +583,14 @@ export class CuboCrdtClient<M> {
     })
 
     // добавляем документ в хранилище документов
-    this.store[opts.storeKey]?.docs.set(ctx.entity_id, doc)
+    this.store[opts.storeKey]?.docs.set(entity_id, doc)
 
     // добавляем документ в реактивное хранилище
     const json: any = doc.getMap().toJSON()
-    const index = this.store[opts.storeKey]?.state.rows.findIndex((r: any) => r.id === ctx.entity_id)
+    const index = this.store[opts.storeKey]?.state.rows.findIndex((r: any) => r.id === entity_id)
     if (index !== undefined && index >= 0) {
       if (this.debug) {
-        console.warn('[CRDT] onDocumentCreate - row already exists: "' + ctx.entity_id + '"', { ctx, opts })
+        console.warn('[CRDT] onDocumentCreate - row already exists: "' + entity_id + '"', { ctx, opts })
       }
 
       this.store[opts.storeKey]!.state.rows[index] = json
@@ -446,7 +603,7 @@ export class CuboCrdtClient<M> {
     }
 
     if (opts?.awareness) {
-      let awareness = this.store[opts.storeKey]?.awarenesses.get(ctx.entity_id)
+      let awareness = this.store[opts.storeKey]?.awarenesses.get(entity_id)
 
       if (!awareness) {
         awareness = new Awareness(doc)
@@ -466,20 +623,26 @@ export class CuboCrdtClient<M> {
             data: {
               action: 'awareness',
               entity: ctx.entity,
-              entity_id: ctx.entity_id,
+              entity_id,
               data: Array.from(update),
-              origin: { subscribe_id: opts.subscribe_id }
+              // 'other' — не шлём свой же курсор обратно исходной подписке
+              origin: { expose: 'other', subscribe_id: opts.subscribe_id }
             }
           })
         })
 
-        this.store[opts.storeKey]?.awarenesses.set(ctx.entity_id, awareness)
+        this.store[opts.storeKey]?.awarenesses.set(entity_id, awareness)
       }
     }
   }
 
   private async onDocumentUpdate(ctx: CuboCrdtClientSubscribeEvent, opts: CuboCrdtClientDocUpdateOptions) {
-    const doc = this.store[opts.storeKey]?.docs.get(ctx.entity_id)
+    const entity_id = ctx.entity_id
+    if (entity_id === undefined) {
+      return
+    }
+
+    const doc = this.store[opts.storeKey]?.docs.get(entity_id)
     if (!doc) {
       console.warn('[CRDT] onDocumentUpdate: doc not exists', { ctx, opts })
       return
@@ -498,7 +661,7 @@ export class CuboCrdtClient<M> {
     applyUpdate(doc, update, { react: false })
 
     // обновляем документ в реактивном хранилище
-    this.applyRowJson(opts.storeKey, ctx.entity_id, doc)
+    this.applyRowJson(opts.storeKey, entity_id, doc)
 
     if (opts?.onAfterUpdate) {
       await opts.onAfterUpdate(doc, update, ctx, opts)
@@ -506,7 +669,12 @@ export class CuboCrdtClient<M> {
   }
 
   private async onDocumentDelete(ctx: CuboCrdtClientSubscribeEvent, opts: CuboCrdtClientDocUpdateOptions) {
-    const doc = this.store[opts.storeKey]?.docs.get(ctx.entity_id)
+    const entity_id = ctx.entity_id
+    if (entity_id === undefined) {
+      return
+    }
+
+    const doc = this.store[opts.storeKey]?.docs.get(entity_id)
     if (!doc) {
       console.warn('[CRDT] onDocumentDelete: doc not exists', { ctx, opts })
       return
@@ -522,9 +690,9 @@ export class CuboCrdtClient<M> {
     // console.log('onDocumentDelete', ctx, opts)
 
     doc.destroy()
-    this.store[opts.storeKey]?.docs.delete(ctx.entity_id)
+    this.store[opts.storeKey]?.docs.delete(entity_id)
 
-    const index = this.store[opts.storeKey]?.state.rows.findIndex((r: any) => r.id === ctx.entity_id)
+    const index = this.store[opts.storeKey]?.state.rows.findIndex((r: any) => r.id === entity_id)
     if (index !== undefined && index >= 0) {
       this.store[opts.storeKey]?.state.rows.splice(index, 1)
     } else {
@@ -533,12 +701,12 @@ export class CuboCrdtClient<M> {
       }
     }
 
-    const awareness = this.store[opts.storeKey]?.awarenesses.get(ctx.entity_id)
+    const awareness = this.store[opts.storeKey]?.awarenesses.get(entity_id)
     if (awareness) {
       removeAwarenessStates(awareness, [awareness.doc.clientID], 'unsubscribe')
 
       awareness.destroy()
-      this.store[opts.storeKey]?.awarenesses?.delete(ctx.entity_id)
+      this.store[opts.storeKey]?.awarenesses?.delete(entity_id)
     }
 
     if (opts?.onAfterDelete) {
@@ -561,11 +729,60 @@ export class CuboCrdtClient<M> {
       case 'awareness':
         await this.onAwarenessUpdate(ctx, opts)
         break
+      case 'sync':
+        this.onListSync(ctx, opts)
+        break
     }
   }
 
+  private onListSync(ctx: CuboCrdtClientSubscribeEvent, opts: CuboCrdtClientDocUpdateOptions) {
+    const data = ctx.data as CuboCrdtListSyncData | undefined
+    const item = this.store[opts.storeKey]
+    if (!data || Array.isArray(data) || !Array.isArray(data.ids) || !item) {
+      return
+    }
+
+    const ids = data.ids.filter((id) => Number.isFinite(id))
+    const idsSet = new Set(ids)
+
+    for (const [entity_id, doc] of item.docs) {
+      if (idsSet.has(entity_id)) {
+        continue
+      }
+
+      const awareness = item.awarenesses.get(entity_id)
+      if (awareness) {
+        removeAwarenessStates(awareness, [awareness.doc.clientID], 'sync')
+        awareness.setLocalState(null)
+        awareness.destroy()
+        item.awarenesses.delete(entity_id)
+      }
+
+      doc.destroy()
+      item.docs.delete(entity_id)
+    }
+
+    const rowsById = new Map(item.state.rows.map((row: any) => [Number(row.id), row]))
+    const orderedRows = ids
+      .map((id) => rowsById.get(id))
+      .filter((row) => row !== undefined)
+
+    item.state.rows.splice(0, item.state.rows.length, ...orderedRows)
+    item.state.totals = data.totals || {}
+    item.state.revision = data.revision
+    item.state.loading = false
+    item.state.status = 'ready'
+    item.state.error = undefined
+    item.state.subscribed = true
+  }
+
   private onAwarenessUpdate(ctx: CuboCrdtClientSubscribeEvent, opts: CuboCrdtClientDocUpdateOptions) {
-    const awareness = this.store[opts.storeKey]?.awarenesses?.get(ctx.entity_id)
+    const entity_id = ctx.entity_id
+    if (entity_id === undefined) {
+      return
+    }
+
+    const awareness = this.store[opts.storeKey]?.awarenesses?.get(entity_id)
     if (!awareness) {
       return
     }

package/src/client/types/index.ts

@@ -3,7 +3,12 @@ import { ComputedRef } from 'vue'
 import { Awareness } from 'y-protocols/awareness'
 import { type Doc } from 'yjs'
 
-import { CuboCrdtAction } from '../../types'
+import {
+  CuboCrdtAction,
+  CuboCrdtListSyncData,
+  CuboCrdtListTotals,
+  CuboCrdtSubscriptionStatus
+} from '../../types'
 
 import { CuboCrdtClientBaseOptions } from './utils'
 
@@ -21,14 +26,15 @@ export type CuboCrdtClientUseOptions = CuboCrdtClientBaseOptions & {
   storeKey?: string
   filters?: Record<string, any>
   awareness?: boolean
+  paginated?: boolean
 }
 
 export type CuboCrdtClientSubscribeEvent = {
   action: CuboCrdtAction
   entity: string
-  entity_id: number
+  entity_id?: number
   subscribe_id?: string
-  data?: number[]
+  data?: number[] | CuboCrdtListSyncData
 }
 
 export type CuboCrdtClientList<T> = {
@@ -40,6 +46,12 @@ export type CuboCrdtClientList<T> = {
   upgrade: (filters?: any) => void
   unsubscribe: (clear?: boolean) => void
   subscribed: () => ComputedRef<boolean>
+  loading: () => ComputedRef<boolean>
+  ready: () => ComputedRef<boolean>
+  status: () => ComputedRef<CuboCrdtSubscriptionStatus>
+  error: () => ComputedRef<unknown>
+  totals: () => ComputedRef<CuboCrdtListTotals>
+  revision: () => ComputedRef<number>
   rows: () => ComputedRef<T[]>
   rowsById: () => ComputedRef<Record<string, T>>
 }
@@ -53,5 +65,9 @@ export type CuboCrdtClientRow<T> = {
   upgrade: (filters?: any) => void
   unsubscribe: (clear?: boolean) => void
   subscribed: () => ComputedRef<boolean>
+  loading: () => ComputedRef<boolean>
+  ready: () => ComputedRef<boolean>
+  status: () => ComputedRef<CuboCrdtSubscriptionStatus>
+  error: () => ComputedRef<unknown>
   row: () => ComputedRef<T>
 }

package/src/client/types/store.ts

@@ -2,12 +2,21 @@ import { Reactive } from 'vue'
 import { Doc } from 'yjs'
 import { Awareness } from 'y-protocols/awareness'
 
-import { CuboCrdtKey } from '../../types'
+import {
+  CuboCrdtKey,
+  CuboCrdtListTotals,
+  CuboCrdtSubscriptionStatus
+} from '../../types'
 
 export type CuboCrdtClientStoreItem<T> = {
   state: Reactive<{
     rows: T[]
     subscribed: boolean
+    loading: boolean
+    status: CuboCrdtSubscriptionStatus
+    error?: unknown
+    totals: CuboCrdtListTotals
+    revision: number
   }>
   docs: Map<number, Doc>
   awarenesses: Map<number, Awareness>