@livestore/livestore 0.0.24 → 0.0.25

package/src/react/useComponentState.ts

@@ -11,7 +11,7 @@ import { v4 as uuid } from 'uuid'
 import type { ComponentKey } from '../componentKey.js'
 import { labelForKey, tableNameForComponentKey } from '../componentKey.js'
 import { migrateTable } from '../migrations.js'
-import { LiveStoreJSQuery } from '../reactiveQueries/js.js'
+import type { LiveStoreJSQuery } from '../reactiveQueries/js.js'
 import { LiveStoreSQLQuery } from '../reactiveQueries/sql.js'
 import { SCHEMA_META_TABLE } from '../schema.js'
 import type { BaseGraphQLContext, LiveStoreQuery, Store } from '../store.js'
@@ -25,9 +25,9 @@ export interface QueryDefinitions {
 }
 
 export type UseComponentStateProps<TStateColumns extends ComponentColumns> = {
-  schema?: SqliteDsl.TableDefinition<string, TStateColumns>
-  reactDeps?: React.DependencyList
+  schema: SqliteDsl.TableDefinition<string, TStateColumns>
   componentKey: ComponentKeyConfig
+  reactDeps?: React.DependencyList
 }
 
 export type ComponentKeyConfig = {
@@ -91,7 +91,7 @@ export const useComponentState = <TStateColumns extends ComponentColumns>({
   // TODO validate schema to make sure each column has a default value
   // TODO we should clean up the state schema handling to remove this special handling for the `id` column
   const stateSchema = React.useMemo(
-    () => (stateSchema_ ? { ...stateSchema_, columns: omit(stateSchema_.columns, 'id' as any) } : undefined),
+    () => ({ ...stateSchema_, columns: omit(stateSchema_.columns, 'id' as any) }),
     [stateSchema_],
   )
 
@@ -135,9 +135,7 @@ export const useComponentState = <TStateColumns extends ComponentColumns>({
   )
 
   const defaultComponentState = React.useMemo(() => {
-    const defaultState = (
-      stateSchema === undefined ? {} : mapValues(stateSchema.columns, (c) => c.default)
-    ) as TComponentState
+    const defaultState = mapValues(stateSchema.columns, (c) => c.default) as TComponentState
 
     // @ts-expect-error TODO fix typing
     defaultState.id = componentKeyConfig.id
@@ -145,54 +143,43 @@ export const useComponentState = <TStateColumns extends ComponentColumns>({
     return defaultState
   }, [componentKeyConfig.id, stateSchema])
 
-  const componentStateEffectSchema = React.useMemo(
-    () => (stateSchema ? SqliteDsl.structSchemaForTable(stateSchema) : Schema.any),
-    [stateSchema],
-  )
+  const componentStateEffectSchema = React.useMemo(() => SqliteDsl.structSchemaForTable(stateSchema), [stateSchema])
 
+  // create state query
   const state$ = React.useMemo(() => {
-    // create state query
-    if (stateSchema === undefined) {
-      // TODO don't set up a query if there's no state schema (keeps the graph more clean)
-      return new LiveStoreJSQuery({
-        fn: () => ({}) as TComponentState,
-        label: 'empty-component-state',
-        // otelContext,
-        // otelTracer: store.otel.tracer,
-      })
-    } else {
-      const componentTableName = tableNameForComponentKey(componentKey)
-      const whereClause = componentKey._tag === 'singleton' ? '' : `where id = '${componentKey.id}'`
-
-      // TODO find a better solution for this
-      if (store.tableRefs[componentTableName] === undefined) {
-        const schemaHash = SqliteAst.hash(stateSchema.ast)
-        const res = store.inMemoryDB.select<{ schemaHash: number }>(
-          sql`SELECT schemaHash FROM ${SCHEMA_META_TABLE} WHERE tableName = '${componentTableName}'`,
-        )
-        if (res.length === 0 || res[0]!.schemaHash !== schemaHash) {
-          migrateTable({ db: store._proxyDb, tableDef: stateSchema.ast, otelContext, schemaHash })
-        }
-
-        store.tableRefs[componentTableName] = store.graph.makeRef(null, {
-          equal: () => false,
-          label: componentTableName,
-          meta: { liveStoreRefType: 'table' },
-        })
+    const componentTableName = tableNameForComponentKey(componentKey)
+    const whereClause = componentKey._tag === 'singleton' ? '' : `where id = '${componentKey.id}'`
+
+    // TODO find a better solution for this
+    if (store.tableRefs[componentTableName] === undefined) {
+      const schemaHash = SqliteAst.hash(stateSchema.ast)
+      const res = store.inMemoryDB.select<{ schemaHash: number }>(
+        sql`SELECT schemaHash FROM ${SCHEMA_META_TABLE} WHERE tableName = '${componentTableName}'`,
+      )
+      if (res.length === 0 || res[0]!.schemaHash !== schemaHash) {
+        migrateTable({ db: store._proxyDb, tableDef: stateSchema.ast, otelContext, schemaHash })
       }
 
-      return (
-        new LiveStoreSQLQuery({
-          label: `localState:query:${componentKeyLabel}`,
-          genQueryString: () => sql`select * from ${componentTableName} ${whereClause} limit 1`,
-          queriedTables: [componentTableName],
-        })
-          // TODO consider to instead of just returning the default value, to write the default component state to the DB
-          .pipe<TComponentState>((results) =>
-            results.length === 1 ? Schema.parseSync(componentStateEffectSchema)(results[0]!) : defaultComponentState,
-          )
-      )
+      store.tableRefs[componentTableName] = store.graph.makeRef(null, {
+        equal: () => false,
+        label: componentTableName,
+        meta: { liveStoreRefType: 'table' },
+      })
     }
+
+    return (
+      new LiveStoreSQLQuery({
+        label: `localState:query:${componentKeyLabel}`,
+        genQueryString: () => sql`select * from ${componentTableName} ${whereClause} limit 1`,
+        queriedTables: new Set([componentTableName]),
+      })
+        // TODO consider to instead of just returning the default value, to write the default component state to the DB
+        .pipe<TComponentState>((results) =>
+          results.length === 1
+            ? (Schema.parseSync(componentStateEffectSchema)(results[0]!) as TComponentState)
+            : defaultComponentState,
+        )
+    )
   }, [
     componentKey,
     componentKeyLabel,
@@ -214,28 +201,24 @@ export const useComponentState = <TStateColumns extends ComponentColumns>({
   // we can set up our useState calls w/ a default value populated...
   const [componentStateRef, setComponentState_] = useStateRefWithReactiveInput<TComponentState>(initialComponentState)
 
-  const setState = (
-    stateSchema === undefined
-      ? {}
-      : // TODO: do we have a better type for the values that can go in SQLite?
-        mapValues(stateSchema.columns, (column, columnName) => (value: string | number) => {
-          // Don't update the state if it's the same as the value already seen in the component
-          // @ts-expect-error TODO fix typing
-          if (componentStateRef.current[columnName] === value) return
+  const setState = // TODO: do we have a better type for the values that can go in SQLite?
+    mapValues(stateSchema.columns, (column, columnName) => (value: string | number) => {
+      // Don't update the state if it's the same as the value already seen in the component
+      // @ts-expect-error TODO fix typing
+      if (componentStateRef.current[columnName] === value) return
 
-          const encodedValue = Schema.encodeSync(column.type.codec)(value)
+      const encodedValue = Schema.encodeSync(column.type.codec)(value)
 
-          if (['componentKey', 'columnNames'].includes(columnName)) {
-            shouldNeverHappen(`Can't use reserved column name ${columnName}`)
-          }
+      if (['componentKey', 'columnNames'].includes(columnName)) {
+        shouldNeverHappen(`Can't use reserved column name ${columnName}`)
+      }
 
-          return store.applyEvent('updateComponentState', {
-            componentKey,
-            columnNames: [columnName],
-            [columnName]: encodedValue,
-          })
-        })
-  ) as Setters<TComponentState>
+      return store.applyEvent('updateComponentState', {
+        componentKey,
+        columnNames: [columnName],
+        [columnName]: encodedValue,
+      })
+    }) as Setters<TComponentState>
 
   setState.setMany = (columnValues: Partial<TComponentState>) => {
     // TODO use hashing instead
@@ -261,9 +244,7 @@ export const useComponentState = <TStateColumns extends ComponentColumns>({
         const unsubs: (() => void)[] = []
 
         const otelContext = otel.trace.setSpan(otel.context.active(), span)
-        if (stateSchema !== undefined) {
-          insertRowForComponentInstance({ store, componentKey, stateSchema, otelContext })
-        }
+        insertRowForComponentInstance({ store, componentKey, stateSchema, otelContext })
 
         state$.activeSubscriptions.add(stackInfo)
 

package/src/react/useQuery.ts

@@ -67,7 +67,7 @@ export const useQuery = <TResult>(query: ILiveStoreQuery<TResult>): TResult => {
   // Subscribe to future updates for this query
   React.useEffect(() => {
     query.activeSubscriptions.add(stackInfo)
-    const unsub = store.subscribe(
+    const unsubFromStore = store.subscribe(
       query,
       (newValue) => {
         // NOTE: we return a reference to the result object within LiveStore;
@@ -82,7 +82,7 @@ export const useQuery = <TResult>(query: ILiveStoreQuery<TResult>): TResult => {
     )
     return () => {
       query.activeSubscriptions.delete(stackInfo)
-      unsub()
+      unsubFromStore()
     }
   }, [stackInfo, query, setValue, store, valueRef, otelContext, span])
 

package/src/react/utils/stack-info.ts

@@ -57,7 +57,6 @@ export const useStackInfo = (): StackInfo =>
     Error.stackTraceLimit = 10
     // eslint-disable-next-line unicorn/error-message
     const stack = new Error().stack!
-    console.log('stack', stack)
     Error.stackTraceLimit = originalStackLimit
     return extractStackInfoFromStackTrace(stack)
   }, [])

package/src/reactive.ts

@@ -36,7 +36,7 @@ export type NOT_REFRESHED_YET = typeof NOT_REFRESHED_YET
 
 export type GetAtom = <T>(atom: Atom<T, any, any>, otelContext?: otel.Context) => T
 
-export type Ref<T, TContext, TDebugRefreshReason extends Taggable> = {
+export type Ref<T, TContext, TDebugRefreshReason extends DebugRefreshReason> = {
   _tag: 'ref'
   id: string
   isDirty: false
@@ -50,14 +50,11 @@ export type Ref<T, TContext, TDebugRefreshReason extends Taggable> = {
   equal: (a: T, b: T) => boolean
 }
 
-export type Thunk<TResult, TContext, TDebugRefreshReason extends Taggable> = {
+export type Thunk<TResult, TContext, TDebugRefreshReason extends DebugRefreshReason> = {
   _tag: 'thunk'
   id: string
   isDirty: boolean
-  computeResult: (
-    otelContext?: otel.Context,
-    debugRefreshReason?: RefreshReasonWithGenericReasons<TDebugRefreshReason>,
-  ) => TResult
+  computeResult: (otelContext?: otel.Context, debugRefreshReason?: TDebugRefreshReason) => TResult
   previousResult: TResult | NOT_REFRESHED_YET
   sub: Set<Atom<any, TContext, TDebugRefreshReason>>
   super: Set<Atom<any, TContext, TDebugRefreshReason> | Effect>
@@ -70,7 +67,7 @@ export type Thunk<TResult, TContext, TDebugRefreshReason extends Taggable> = {
   __getResult: any
 }
 
-export type Atom<T, TContext, TDebugRefreshReason extends Taggable> =
+export type Atom<T, TContext, TDebugRefreshReason extends DebugRefreshReason> =
   | Ref<T, TContext, TDebugRefreshReason>
   | Thunk<T, TContext, TDebugRefreshReason>
 
@@ -82,13 +79,23 @@ export type Effect = {
   label?: string
 }
 
-export type Taggable<T extends string = string> = { _tag: T }
-
 export type DebugThunkInfo<T extends string = string> = {
   _tag: T
   durationMs: number
 }
 
+export type DebugRefreshReasonBase =
+  /** Usually in response to some `applyEvent`/`applyEvents` with `skipRefresh: true` */
+  | {
+      _tag: 'runDeferredEffects'
+      originalRefreshReasons?: ReadonlyArray<DebugRefreshReasonBase>
+      manualRefreshReason?: DebugRefreshReasonBase
+    }
+  | { _tag: 'makeThunk'; label?: string }
+  | { _tag: 'unknown' }
+
+export type DebugRefreshReason<T extends string = string> = DebugRefreshReasonBase | { _tag: T }
+
 export type ReactiveGraphOptions = {
   effectsWrapper?: (runEffects: () => void) => void
 }
@@ -100,7 +107,7 @@ export type AtomDebugInfo<TDebugThunkInfo extends DebugThunkInfo> = {
 }
 
 // TODO possibly find a better name for "refresh"
-export type RefreshDebugInfo<TDebugRefreshReason extends Taggable, TDebugThunkInfo extends DebugThunkInfo> = {
+export type RefreshDebugInfo<TDebugRefreshReason extends DebugRefreshReason, TDebugThunkInfo extends DebugThunkInfo> = {
   /** Currently only used for easier handling in React (e.g. as key) */
   id: string
   reason: TDebugRefreshReason
@@ -112,15 +119,7 @@ export type RefreshDebugInfo<TDebugRefreshReason extends Taggable, TDebugThunkIn
   graphSnapshot: ReactiveGraphSnapshot
 }
 
-export type RefreshReasonWithGenericReasons<T extends Taggable> =
-  | T
-  | {
-      _tag: 'makeThunk'
-      label?: string
-    }
-  | { _tag: 'unknown' }
-
-export const unknownRefreshReason = () => {
+const unknownRefreshReason = () => {
   // debugger
   return { _tag: 'unknown' as const }
 }
@@ -128,34 +127,29 @@ export const unknownRefreshReason = () => {
 export type SerializedAtom = Readonly<
   PrettifyFlat<
     Pick<Atom<unknown, unknown, any>, '_tag' | 'id' | 'label' | 'meta'> & {
-      sub: string[]
-      super: string[]
+      sub: ReadonlyArray<string>
+      super: ReadonlyArray<string>
     }
   >
 >
 
-export type SerializedEffect = Readonly<PrettifyFlat<Pick<Effect, '_tag' | 'id'>>>
-
 type ReactiveGraphSnapshot = {
-  readonly atoms: SerializedAtom[]
-  // readonly effects: SerializedEffect[]
-  /** IDs of atoms and effects that are dirty */
-  // readonly dirtyNodes: string[]
+  readonly atoms: ReadonlyArray<SerializedAtom>
+  /** IDs of deferred effects */
+  readonly deferredEffects: ReadonlyArray<string>
 }
 
 const uniqueNodeId = () => uniqueId('node-')
 const uniqueRefreshInfoId = () => uniqueId('refresh-info-')
 
 const serializeAtom = (atom: Atom<any, unknown, any>): SerializedAtom => ({
-  ...pick(atom, ['_tag', 'id', 'label', 'meta']),
+  ...pick(atom, ['_tag', 'id', 'label', 'meta', 'isDirty']),
   sub: Array.from(atom.sub).map((a) => a.id),
   super: Array.from(atom.super).map((a) => a.id),
 })
 
-// const serializeEffect = (effect: Effect): SerializedEffect => pick(effect, ['_tag', 'id'])
-
 export class ReactiveGraph<
-  TDebugRefreshReason extends Taggable,
+  TDebugRefreshReason extends DebugRefreshReason,
   TDebugThunkInfo extends DebugThunkInfo,
   TContext = {},
 > {
@@ -164,11 +158,13 @@ export class ReactiveGraph<
 
   context: TContext | undefined
 
-  debugRefreshInfos: BoundArray<
-    RefreshDebugInfo<RefreshReasonWithGenericReasons<TDebugRefreshReason>, TDebugThunkInfo>
-  > = new BoundArray(5000)
+  debugRefreshInfos: BoundArray<RefreshDebugInfo<TDebugRefreshReason, TDebugThunkInfo>> = new BoundArray(5000)
+
+  private currentDebugRefresh:
+    | { refreshedAtoms: AtomDebugInfo<TDebugThunkInfo>[]; startMs: DOMHighResTimeStamp }
+    | undefined
 
-  currentDebugRefresh: { refreshedAtoms: AtomDebugInfo<TDebugThunkInfo>[]; startMs: DOMHighResTimeStamp } | undefined
+  private deferredEffects: Map<Effect, Set<TDebugRefreshReason>> = new Map()
 
   constructor(options: ReactiveGraphOptions) {
     this.effectsWrapper = options?.effectsWrapper ?? ((runEffects: () => void) => runEffects())
@@ -208,8 +204,6 @@ export class ReactiveGraph<
           label?: string
           meta?: any
           equal?: (a: T, b: T) => boolean
-          /** Debug info for initializing the thunk (i.e. running it the first time) */
-          // debugRefreshReason?: RefreshReasonWithGenericReasons<TDebugRefreshReason>
         }
       | undefined,
   ): Thunk<T, TContext, TDebugRefreshReason> {
@@ -264,16 +258,15 @@ export class ReactiveGraph<
             const durationMs = performance.now() - this.currentDebugRefresh!.startMs
             this.currentDebugRefresh = undefined
 
-            const refreshDebugInfo = {
+            this.debugRefreshInfos.push({
               id: uniqueRefreshInfoId(),
-              reason: debugRefreshReason ?? { _tag: 'makeThunk', label: options?.label },
+              reason: debugRefreshReason ?? ({ _tag: 'makeThunk', label: options?.label } as TDebugRefreshReason),
               skippedRefresh: false,
               refreshedAtoms,
               durationMs,
               completedTimestamp: Date.now(),
               graphSnapshot: this.getSnapshot(),
-            }
-            this.debugRefreshInfos.push(refreshDebugInfo)
+            })
           }
 
           return result
@@ -308,7 +301,9 @@ export class ReactiveGraph<
       this.removeEdge(node, subComp)
     }
 
-    if (node._tag !== 'effect') {
+    if (node._tag === 'effect') {
+      this.deferredEffects.delete(node)
+    } else {
       this.atoms.delete(node)
     }
   }
@@ -345,23 +340,20 @@ export class ReactiveGraph<
     val: T,
     options?:
       | {
+          skipRefresh?: boolean
           debugRefreshReason?: TDebugRefreshReason
           otelContext?: otel.Context
         }
       | undefined,
   ) {
-    ref.previousResult = val
-
-    const effectsToRefresh = new Set<Effect>()
-    markSuperCompDirtyRec(ref, effectsToRefresh)
-
-    this.runEffects(effectsToRefresh, options)
+    this.setRefs([[ref, val]], options)
   }
 
   setRefs<T>(
     refs: [Ref<T, TContext, TDebugRefreshReason>, T][],
     options?:
       | {
+          skipRefresh?: boolean
           debugRefreshReason?: TDebugRefreshReason
           otelContext?: otel.Context
         }
@@ -374,17 +366,30 @@ export class ReactiveGraph<
       markSuperCompDirtyRec(ref, effectsToRefresh)
     }
 
-    this.runEffects(effectsToRefresh, options)
+    if (options?.skipRefresh) {
+      for (const effect of effectsToRefresh) {
+        if (this.deferredEffects.has(effect) === false) {
+          this.deferredEffects.set(effect, new Set())
+        }
+
+        if (options?.debugRefreshReason !== undefined) {
+          this.deferredEffects.get(effect)!.add(options.debugRefreshReason)
+        }
+      }
+    } else {
+      this.runEffects(effectsToRefresh, {
+        debugRefreshReason: options?.debugRefreshReason ?? (unknownRefreshReason() as TDebugRefreshReason),
+        otelContext: options?.otelContext,
+      })
+    }
   }
 
   private runEffects = (
     effectsToRefresh: Set<Effect>,
-    options?:
-      | {
-          debugRefreshReason?: TDebugRefreshReason
-          otelContext?: otel.Context
-        }
-      | undefined,
+    options: {
+      debugRefreshReason: TDebugRefreshReason
+      otelContext?: otel.Context
+    },
   ) => {
     this.effectsWrapper(() => {
       this.currentDebugRefresh = { refreshedAtoms: [], startMs: performance.now() }
@@ -399,7 +404,7 @@ export class ReactiveGraph<
 
       const refreshDebugInfo: RefreshDebugInfo<TDebugRefreshReason, TDebugThunkInfo> = {
         id: uniqueRefreshInfoId(),
-        reason: options?.debugRefreshReason ?? (unknownRefreshReason() as TDebugRefreshReason),
+        reason: options.debugRefreshReason,
         skippedRefresh: false,
         refreshedAtoms,
         durationMs,
@@ -410,6 +415,22 @@ export class ReactiveGraph<
     })
   }
 
+  runDeferredEffects = (options?: { debugRefreshReason?: TDebugRefreshReason; otelContext?: otel.Context }) => {
+    // TODO improve how refresh reasons are propagated for deferred effect execution
+    // TODO also improve "batching" of running deferred effects (i.e. in a single `this.runEffects` call)
+    // but need to be careful to not overwhelm the main thread
+    for (const [effect, debugRefreshReasons] of this.deferredEffects) {
+      this.runEffects(new Set([effect]), {
+        debugRefreshReason: {
+          _tag: 'runDeferredEffects',
+          originalRefreshReasons: Array.from(debugRefreshReasons) as ReadonlyArray<DebugRefreshReasonBase>,
+          manualRefreshReason: options?.debugRefreshReason,
+        } as TDebugRefreshReason,
+        otelContext: options?.otelContext,
+      })
+    }
+  }
+
   addEdge(
     superComp: Atom<any, TContext, TDebugRefreshReason> | Effect,
     subComp: Atom<any, TContext, TDebugRefreshReason>,
@@ -426,17 +447,12 @@ export class ReactiveGraph<
     subComp.super.delete(superComp)
   }
 
-  private getSnapshot = (): ReactiveGraphSnapshot => ({
+  getSnapshot = (): ReactiveGraphSnapshot => ({
     atoms: Array.from(this.atoms).map(serializeAtom),
-    // effects: Array.from(this.effects).map(serializeEffect),
-    // dirtyNodes: Array.from(this.dirtyNodes).map((a) => a.id),
+    deferredEffects: Array.from(this.deferredEffects.keys()).map((_) => _.id),
   })
 }
 
-// const isAtom = <T, TContext>(a: Atom<T, TContext> | Effect): a is Atom<T, TContext> =>
-//   a._tag === 'ref' || a._tag === 'thunk'
-// const isEffect = <T, TContext>(a: Atom<T, TContext> | Effect): a is Effect => a._tag === 'effect'
-
 const compute = <T>(atom: Atom<T, unknown, any>, otelContext: otel.Context): T => {
   // const __getResult = atom._tag === 'thunk' ? atom.__getResult.toString() : ''
   if (atom.isDirty) {
@@ -462,6 +478,6 @@ const markSuperCompDirtyRec = <T>(atom: Atom<T, unknown, any>, effectsToRefresh:
   }
 }
 
-const throwContextNotSetError = (): never => {
+export const throwContextNotSetError = (): never => {
   throw new Error(`LiveStore Error: \`context\` not set on ReactiveGraph`)
 }

package/src/reactiveQueries/base-class.ts

@@ -1,7 +1,7 @@
 import type * as otel from '@opentelemetry/api'
 
 import type { StackInfo } from '../react/utils/stack-info.js'
-import type { Atom, GetAtom, RefreshReasonWithGenericReasons, Thunk } from '../reactive.js'
+import { type Atom, type GetAtom, throwContextNotSetError, type Thunk } from '../reactive.js'
 import type { RefreshReason } from '../store.js'
 import { type DbContext, dbGraph } from './graph.js'
 import type { LiveStoreJSQuery } from './js.js'
@@ -18,7 +18,7 @@ export interface ILiveStoreQuery<TResult> {
 
   label: string
 
-  run: (otelContext?: otel.Context, debugRefreshReason?: RefreshReasonWithGenericReasons<RefreshReason>) => TResult
+  run: (otelContext?: otel.Context, debugRefreshReason?: RefreshReason) => TResult
 
   destroy(): void
 
@@ -41,13 +41,10 @@ export abstract class LiveStoreQueryBase<TResult> implements ILiveStoreQuery<TRe
 
   abstract destroy: () => void
 
-  run = (otelContext?: otel.Context, debugRefreshReason?: RefreshReasonWithGenericReasons<RefreshReason>): TResult =>
+  run = (otelContext?: otel.Context, debugRefreshReason?: RefreshReason): TResult =>
     this.results$.computeResult(otelContext, debugRefreshReason)
 
-  runAndDestroy = (
-    otelContext?: otel.Context,
-    debugRefreshReason?: RefreshReasonWithGenericReasons<RefreshReason>,
-  ): TResult => {
+  runAndDestroy = (otelContext?: otel.Context, debugRefreshReason?: RefreshReason): TResult => {
     const result = this.run(otelContext, debugRefreshReason)
     this.destroy()
     return result
@@ -57,7 +54,8 @@ export abstract class LiveStoreQueryBase<TResult> implements ILiveStoreQuery<TRe
     onNewValue: (value: TResult) => void,
     onUnsubsubscribe?: () => void,
     options?: { label?: string; otelContext?: otel.Context } | undefined,
-  ): (() => void) => dbGraph.context!.store.subscribe(this, onNewValue, onUnsubsubscribe, options)
+  ): (() => void) =>
+    dbGraph.context?.store.subscribe(this, onNewValue, onUnsubsubscribe, options) ?? throwContextNotSetError()
 }
 
 export type GetAtomResult = <T>(atom: Atom<T, any, RefreshReason> | LiveStoreJSQuery<T>) => T

package/src/reactiveQueries/js.ts

@@ -18,7 +18,12 @@ export class LiveStoreJSQuery<TResult> extends LiveStoreQueryBase<TResult> {
 
   label: string
 
-  /** Currently only used for "nested destruction" of piped queries */
+  /**
+   * Currently only used for "nested destruction" of piped queries
+   *
+   * i.e. when doing something like `const q = querySQL(...).pipe(...)`
+   * we need to also destory the SQL query when the JS query `q` is destroyed
+   */
   private onDestroy: (() => void) | undefined
 
   constructor({

package/src/reactiveQueries/sql.ts

@@ -19,7 +19,7 @@ export const querySQL = <Row>(
      *
      * NOTE In the future we want to do this automatically at build time
      */
-    queriedTables?: ReadonlyArray<string>
+    queriedTables?: Set<string>
     bindValues?: Bindable
     label?: string
   },
@@ -51,7 +51,7 @@ export class LiveStoreSQLQuery<Row> extends LiveStoreQueryBase<ReadonlyArray<Row
   }: {
     label?: string
     genQueryString: string | ((get: GetAtomResult) => string)
-    queriedTables?: ReadonlyArray<string>
+    queriedTables?: Set<string>
     bindValues?: Bindable
   }) {
     super()
@@ -150,7 +150,7 @@ export class LiveStoreSQLQuery<Row> extends LiveStoreQueryBase<ReadonlyArray<Row
         if (results.length === 0 && args?.defaultValue === undefined) {
           // const queryLabel = this._tag === 'sql' ? this.queryString$!.computeResult(otelContext) : this.label
           const queryLabel = this.label
-          throw new Error(`Expected query ${queryLabel} to return at least one result`)
+          return shouldNeverHappen(`Expected query ${queryLabel} to return at least one result`)
         }
         return results[0] ?? args!.defaultValue!
       },