teamplay 0.4.0-alpha.1 → 0.4.0-alpha.2

package/index.d.ts

@@ -73,6 +73,8 @@ export function useBatchQueryDoc (collection: string, query: any, options?: any)
 export function useBatchQueryDoc$ (collection: string, query: any, options?: any): any
 export function useAsyncQueryDoc (collection: string, query: any, options?: any): [any, any]
 export function useAsyncQueryDoc$ (collection: string, query: any, options?: any): any
+export function useLocalDoc (collection: string, id: any): [any, any]
+export function useLocalDoc$ (collection: string, id: any): any
 export function emit (eventName: string, ...args: any[]): void
 export function useOn (
   eventName: 'change' | 'all',
@@ -82,6 +84,15 @@ export function useOn (
 ): void
 export function useOn (eventName: string, handler: (...args: any[]) => void, deps?: any[]): void
 export function useEmit (): (eventName: string, ...args: any[]) => void
+export function batch<T = any> (fn?: () => T): T | undefined
+export function batchModel<T = any> (fn?: () => T): T | undefined
+export function clone<T = any> (value: T): T
+export function initLocalCollection (name: string): any
+export function useApi (api: (...args: any[]) => any, args?: any[], options?: { debounce?: number }): [any, boolean, any]
+type EffectCleanup = (() => void) | undefined
+export function useDidUpdate (fn: () => EffectCleanup, deps?: any[]): void
+export function useOnce (condition: any, fn: () => EffectCleanup): void
+export function useSyncEffect (fn: () => EffectCleanup, deps?: any[]): void
 export { connection, setConnection, getConnection, fetchOnly, setFetchOnly, publicOnly, setPublicOnly } from './orm/connection.js'
 export { useId, useNow, useScheduleUpdate, useTriggerUpdate } from './react/helpers.js'
 export { GUID_PATTERN, hasMany, hasOne, hasManyFlags, belongsTo, pickFormFields } from '@teamplay/schema'

package/index.js

@@ -5,6 +5,7 @@
 //   In future, we might want to separate the plain JS and React APIs
 import { getRootSignal as _getRootSignal, GLOBAL_ROOT_ID } from './orm/Root.js'
 import universal$ from './react/universal$.js'
+import useApi from './react/useApi.js'
 
 export { default as Signal, SEGMENTS } from './orm/Signal.js'
 export { __DEBUG_SIGNALS_CACHE__, rawSignal, getSignalClass } from './orm/getSignal.js'
@@ -29,6 +30,8 @@ export {
   useModel,
   useLocal,
   useLocal$,
+  useLocalDoc,
+  useLocalDoc$,
   useSession,
   useSession$,
   usePage,
@@ -57,12 +60,50 @@ export {
   useAsyncQueryDoc$
 } from './orm/Compat/hooksCompat.js'
 export { emit, useOn, useEmit } from './orm/Compat/eventsCompat.js'
+export {
+  useDidUpdate,
+  useOnce,
+  useSyncEffect
+} from './react/helpers.js'
 export { connection, setConnection, getConnection, fetchOnly, setFetchOnly, publicOnly, setPublicOnly } from './orm/connection.js'
 export { useId, useNow, useScheduleUpdate, useTriggerUpdate } from './react/helpers.js'
 export { GUID_PATTERN, hasMany, hasOne, hasManyFlags, belongsTo, pickFormFields } from '@teamplay/schema'
 export { aggregation, aggregationHeader as __aggregationHeader } from '@teamplay/utils/aggregation'
 export { accessControl } from '@teamplay/utils/accessControl'
 
+export function batch (fn) {
+  return $.batch(fn)
+}
+
+export function batchModel (fn) {
+  return $.batch(fn)
+}
+
+export function clone (value) {
+  if (typeof globalThis.structuredClone === 'function') {
+    try {
+      return globalThis.structuredClone(value)
+    } catch {}
+  }
+  if (value == null) return value
+  return JSON.parse(JSON.stringify(value))
+}
+
+export function initLocalCollection (name) {
+  if (typeof name !== 'string') throw Error('initLocalCollection() expects a collection name')
+  if (!name) return
+  const segments = name.split('.').filter(Boolean)
+  if (!segments.length) return
+  let $cursor = $
+  for (const segment of segments) {
+    $cursor = $cursor[segment]
+  }
+  if ($cursor.get() == null) $cursor.set({})
+  return $cursor
+}
+
+export { useApi }
+
 export function getRootSignal (options) {
   return _getRootSignal({
     rootFunction: universal$,

package/orm/Compat/hooksCompat.js

@@ -44,6 +44,18 @@ export function useLocal (path) {
   return [$sig.get(), $sig]
 }
 
+export function useLocalDoc$ (collection, id) {
+  if (collection == null) throw Error('useLocalDoc() expects a collection name')
+  if (id == null) return undefined
+  return $root[collection][id]
+}
+
+export function useLocalDoc (collection, id) {
+  const $doc = useLocalDoc$(collection, id)
+  if (!$doc) return [undefined, undefined]
+  return [$doc.get(), $doc]
+}
+
 export function useSession$ (path) {
   return useLocal$(prefixLocalPath('_session', path))
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "teamplay",
-  "version": "0.4.0-alpha.1",
+  "version": "0.4.0-alpha.2",
   "description": "Full-stack signals ORM with multiplayer",
   "type": "module",
   "main": "index.js",
@@ -81,5 +81,5 @@
     ]
   },
   "license": "MIT",
-  "gitHead": "d50a0206ce8b90189b6529d0b46db2ca079cae19"
+  "gitHead": "ad790a31ac628c9ea5ac851572533620ac0b7602"
 }

package/react/helpers.js

@@ -1,4 +1,4 @@
-import { useContext, createContext, useRef, useEffect } from 'react'
+import { useContext, createContext, useRef, useEffect, useLayoutEffect } from 'react'
 
 export const ComponentMetaContext = createContext({})
 
@@ -69,6 +69,52 @@ export function useUnmount (fn) {
   )
 }
 
+export function useDidUpdate (fn, deps) {
+  const isFirst = useRef(true)
+  const stableDeps = useStableDeps(deps)
+  useEffect(() => {
+    if (isFirst.current) {
+      isFirst.current = false
+      return
+    }
+    return fn()
+  }, [fn, stableDeps])
+}
+
+export function useOnce (condition, fn) {
+  const fired = useRef(false)
+  useEffect(() => {
+    if (fired.current) return
+    if (!condition) return
+    fired.current = true
+    return fn()
+  }, [condition, fn])
+}
+
+export function useSyncEffect (fn, deps) {
+  const stableDeps = useStableDeps(deps)
+  useLayoutEffect(fn, [fn, stableDeps])
+}
+
+function useStableDeps (deps) {
+  const depsRef = useRef([])
+  const nextDeps = Array.isArray(deps) ? deps : []
+  if (!shallowEqualArrays(depsRef.current, nextDeps)) {
+    depsRef.current = nextDeps
+  }
+  return depsRef.current
+}
+
+function shallowEqualArrays (a, b) {
+  if (a === b) return true
+  if (!Array.isArray(a) || !Array.isArray(b)) return false
+  if (a.length !== b.length) return false
+  for (let i = 0; i < a.length; i++) {
+    if (!Object.is(a[i], b[i])) return false
+  }
+  return true
+}
+
 const ERRORS = {
   useTriggerUpdate: `
     useTriggerUpdate() can only be used inside a component wrapped with observer().

package/react/useApi.js

@@ -0,0 +1,63 @@
+import { useEffect, useRef, useState } from 'react'
+
+export default function useApi (api, args = [], options = {}) {
+  const { debounce = 0 } = options || {}
+  const [data, setData] = useState()
+  const [error, setError] = useState()
+  const [loading, setLoading] = useState(false)
+  const requestIdRef = useRef(0)
+  const stableArgs = useStableDeps(Array.isArray(args) ? args : [args])
+
+  useEffect(() => {
+    if (typeof api !== 'function') return
+    let cancelled = false
+    const requestId = ++requestIdRef.current
+    let timer
+
+    const run = async () => {
+      try {
+        setLoading(true)
+        const result = await api(...stableArgs)
+        if (cancelled || requestId !== requestIdRef.current) return
+        setData(result)
+        setError(undefined)
+      } catch (err) {
+        if (cancelled || requestId !== requestIdRef.current) return
+        setError(err)
+      } finally {
+        if (!cancelled && requestId === requestIdRef.current) setLoading(false)
+      }
+    }
+
+    if (debounce > 0) {
+      timer = setTimeout(run, debounce)
+    } else {
+      run()
+    }
+
+    return () => {
+      cancelled = true
+      if (timer) clearTimeout(timer)
+    }
+  }, [api, debounce, stableArgs])
+
+  return [data, loading, error]
+}
+
+function useStableDeps (deps) {
+  const depsRef = useRef([])
+  if (!shallowEqualArrays(depsRef.current, deps)) {
+    depsRef.current = deps
+  }
+  return depsRef.current
+}
+
+function shallowEqualArrays (a, b) {
+  if (a === b) return true
+  if (!Array.isArray(a) || !Array.isArray(b)) return false
+  if (a.length !== b.length) return false
+  for (let i = 0; i < a.length; i++) {
+    if (!Object.is(a[i], b[i])) return false
+  }
+  return true
+}