@livestore/livestore 0.3.0-dev.11 → 0.3.0-dev.5

package/src/store/store.ts

@@ -27,44 +27,19 @@ import {
 } from '@livestore/common/schema'
 import { assertNever, isDevEnv } from '@livestore/utils'
 import type { Scope } from '@livestore/utils/effect'
-import {
-  Cause,
-  Data,
-  Effect,
-  Inspectable,
-  MutableHashMap,
-  OtelTracer,
-  Runtime,
-  Schema,
-  Stream,
-} from '@livestore/utils/effect'
+import { Cause, Data, Effect, Inspectable, MutableHashMap, Runtime, Schema } from '@livestore/utils/effect'
 import { nanoid } from '@livestore/utils/nanoid'
 import * as otel from '@opentelemetry/api'
 import { type GraphQLSchema } from 'graphql'
 
-import type {
-  ILiveQueryRefDef,
-  LiveQuery,
-  LiveQueryDef,
-  ReactivityGraph,
-  ReactivityGraphContext,
-} from '../live-queries/base-class.js'
-import { makeReactivityGraph } from '../live-queries/base-class.js'
+import type { LiveQuery, QueryContext, ReactivityGraph } from '../live-queries/base-class.js'
 import type { Ref } from '../reactive.js'
 import { makeExecBeforeFirstRun } from '../row-query-utils.js'
-import { SqliteDbWrapper } from '../SqliteDbWrapper.js'
+import { SynchronousDatabaseWrapper } from '../SynchronousDatabaseWrapper.js'
 import { ReferenceCountedSet } from '../utils/data-structures.js'
 import { downloadBlob, exposeDebugUtils } from '../utils/dev.js'
 import { getDurationMsFromSpan } from '../utils/otel.js'
-import type { StackInfo } from '../utils/stack-info.js'
-import type {
-  BaseGraphQLContext,
-  RefreshReason,
-  StoreMutateOptions,
-  StoreOptions,
-  StoreOtel,
-  Unsubscribe,
-} from './store-types.js'
+import type { BaseGraphQLContext, RefreshReason, StoreMutateOptions, StoreOptions, StoreOtel } from './store-types.js'
 
 if (isDevEnv()) {
   exposeDebugUtils()
@@ -76,7 +51,7 @@ export class Store<
 > extends Inspectable.Class {
   readonly storeId: string
   reactivityGraph: ReactivityGraph
-  sqliteDbWrapper: SqliteDbWrapper
+  syncDbWrapper: SynchronousDatabaseWrapper
   clientSession: ClientSession
   schema: LiveStoreSchema
   graphQLSchema?: GraphQLSchema
@@ -86,7 +61,7 @@ export class Store<
    * Note we're using `Ref<null>` here as we don't care about the value but only about *that* something has changed.
    * This only works in combination with `equal: () => false` which will always trigger a refresh.
    */
-  tableRefs: { [key: string]: Ref<null, ReactivityGraphContext, RefreshReason> }
+  tableRefs: { [key: string]: Ref<null, QueryContext, RefreshReason> }
 
   private runtime: Runtime.Runtime<Scope.Scope>
 
@@ -99,13 +74,12 @@ export class Store<
   private syncProcessor: ClientSessionSyncProcessor
   readonly lifetimeScope: Scope.Scope
 
-  readonly boot: Effect.Effect<void, UnexpectedError, Scope.Scope>
-
   // #region constructor
-  constructor({
+  private constructor({
     clientSession,
     schema,
     graphQLOptions,
+    reactivityGraph,
     otelOptions,
     disableDevtools,
     batchUpdates,
@@ -119,27 +93,29 @@ export class Store<
     this.storeId = storeId
     this.unsyncedMutationEvents = unsyncedMutationEvents
 
-    this.sqliteDbWrapper = new SqliteDbWrapper({ otel: otelOptions, db: clientSession.sqliteDb })
+    this.syncDbWrapper = new SynchronousDatabaseWrapper({ otel: otelOptions, db: clientSession.syncDb })
     this.clientSession = clientSession
     this.schema = schema
 
     this.lifetimeScope = lifetimeScope
     this.runtime = runtime
 
-    const reactivityGraph = makeReactivityGraph()
-
     const syncSpan = otelOptions.tracer.startSpan('LiveStore:sync', {}, otelOptions.rootSpanContext)
 
     this.syncProcessor = makeClientSessionSyncProcessor({
       schema,
-      clientSession,
-      runtime,
+      initialLeaderHead: clientSession.leaderThread.mutations.initialMutationEventId,
+      // rebaseBehaviour: 'auto-rebase',
+      pushToLeader: (batch) =>
+        clientSession.leaderThread.mutations.push(batch).pipe(
+          // NOTE we don't want to shutdown in case of an invalid push error, since it will be retried
+          Effect.catchTag('InvalidPushError', Effect.ignoreLogged),
+          this.runEffectFork,
+        ),
+      pullFromLeader: clientSession.leaderThread.mutations.pull,
       applyMutation: (mutationEventDecoded, { otelContext, withChangeset }) => {
         const mutationDef = schema.mutations.get(mutationEventDecoded.mutation)!
-        const execArgsArr = getExecArgsFromMutation({
-          mutationDef,
-          mutationEvent: { decoded: mutationEventDecoded, encoded: undefined },
-        })
+        const execArgsArr = getExecArgsFromMutation({ mutationDef, mutationEventDecoded })
 
         const writeTablesForEvent = new Set<string>()
 
@@ -147,9 +123,9 @@ export class Store<
           for (const {
             statementSql,
             bindValues,
-            writeTables = this.sqliteDbWrapper.getTablesUsed(statementSql),
+            writeTables = this.syncDbWrapper.getTablesUsed(statementSql),
           } of execArgsArr) {
-            this.sqliteDbWrapper.execute(statementSql, bindValues, { otelContext, writeTables })
+            this.syncDbWrapper.execute(statementSql, bindValues, writeTables, { otelContext })
 
             // durationMsTotal += durationMs
             writeTables.forEach((table) => writeTablesForEvent.add(table))
@@ -158,7 +134,7 @@ export class Store<
 
         let sessionChangeset: Uint8Array | undefined
         if (withChangeset === true) {
-          sessionChangeset = this.sqliteDbWrapper.withChangeset(exec).changeset
+          sessionChangeset = this.syncDbWrapper.withChangeset(exec).changeset
         } else {
           exec()
         }
@@ -166,16 +142,16 @@ export class Store<
         return { writeTables: writeTablesForEvent, sessionChangeset }
       },
       rollback: (changeset) => {
-        this.sqliteDbWrapper.rollback(changeset)
+        this.syncDbWrapper.rollback(changeset)
       },
       refreshTables: (tables) => {
-        const tablesToUpdate = [] as [Ref<null, ReactivityGraphContext, RefreshReason>, null][]
+        const tablesToUpdate = [] as [Ref<null, QueryContext, RefreshReason>, null][]
         for (const tableName of tables) {
           const tableRef = this.tableRefs[tableName]
           assertNever(tableRef !== undefined, `No table ref found for ${tableName}`)
           tablesToUpdate.push([tableRef!, null])
         }
-        reactivityGraph.setRefs(tablesToUpdate)
+        this.reactivityGraph.setRefs(tablesToUpdate)
       },
       span: syncSpan,
     })
@@ -195,8 +171,6 @@ export class Store<
     this.reactivityGraph = reactivityGraph
     this.reactivityGraph.context = {
       store: this as unknown as Store<BaseGraphQLContext, LiveStoreSchema>,
-      liveQueryRCMap: new Map(),
-      reactivityGraph: new WeakRef(reactivityGraph),
       otelTracer: otelOptions.tracer,
       rootOtelContext: otelQueriesSpanContext,
       effectsWrapper: batchUpdates,
@@ -233,10 +207,10 @@ export class Store<
 
     if (graphQLOptions) {
       this.graphQLSchema = graphQLOptions.schema
-      this.graphQLContext = graphQLOptions.makeContext(this.sqliteDbWrapper, this.otel.tracer, clientSession.sessionId)
+      this.graphQLContext = graphQLOptions.makeContext(this.syncDbWrapper, this.otel.tracer, clientSession.sessionId)
     }
 
-    this.boot = Effect.gen(this, function* () {
+    Effect.gen(this, function* () {
       yield* Effect.addFinalizer(() =>
         Effect.sync(() => {
           // Remove all table refs from the reactivity graph
@@ -254,10 +228,24 @@ export class Store<
       )
 
       yield* this.syncProcessor.boot
-    })
+    }).pipe(this.runEffectFork)
   }
   // #endregion constructor
 
+  static createStore = <TGraphQLContext extends BaseGraphQLContext, TSchema extends LiveStoreSchema = LiveStoreSchema>(
+    storeOptions: StoreOptions<TGraphQLContext, TSchema>,
+    parentSpan: otel.Span,
+  ): Store<TGraphQLContext, TSchema> => {
+    const ctx = otel.trace.setSpan(otel.context.active(), parentSpan)
+    return storeOptions.otelOptions.tracer.startActiveSpan('LiveStore:createStore', {}, ctx, (span) => {
+      try {
+        return new Store(storeOptions)
+      } finally {
+        span.end()
+      }
+    })
+  }
+
   get sessionId(): string {
     return this.clientSession.sessionId
   }
@@ -265,66 +253,29 @@ export class Store<
   /**
    * Subscribe to the results of a query
    * Returns a function to cancel the subscription.
-   *
-   * @example
-   * ```ts
-   * const unsubscribe = store.subscribe(query$, { onUpdate: (result) => console.log(result) })
-   * ```
    */
   subscribe = <TResult>(
-    query: LiveQueryDef<TResult, any> | LiveQuery<TResult, any>,
-    options: {
-      /** Called when the query result has changed */
-      onUpdate: (value: TResult) => void
-      onSubscribe?: (query$: LiveQuery<TResult, any>) => void
-      /** Gets called after the query subscription has been removed */
-      onUnsubsubscribe?: () => void
-      label?: string
-      /**
-       * Skips the initial `onUpdate` callback
-       * @default false
-       */
-      skipInitialRun?: boolean
-      otelContext?: otel.Context
-      /** If provided, the stack info will be added to the `activeSubscriptions` set of the query */
-      stackInfo?: StackInfo
-    },
-  ): Unsubscribe =>
+    query$: LiveQuery<TResult, any>,
+    onNewValue: (value: TResult) => void,
+    onUnsubsubscribe?: () => void,
+    options?: { label?: string; otelContext?: otel.Context; skipInitialRun?: boolean } | undefined,
+  ): (() => void) =>
     this.otel.tracer.startActiveSpan(
       `LiveStore.subscribe`,
-      { attributes: { label: options?.label, queryLabel: query.label } },
+      { attributes: { label: options?.label, queryLabel: query$.label } },
       options?.otelContext ?? this.otel.queriesSpanContext,
       (span) => {
         // console.debug('store sub', query$.id, query$.label)
         const otelContext = otel.trace.setSpan(otel.context.active(), span)
 
-        const queryRcRef =
-          query._tag === 'def'
-            ? query.make(this.reactivityGraph.context!)
-            : {
-                value: query,
-                deref: () => {},
-              }
-        const query$ = queryRcRef.value
-
         const label = `subscribe:${options?.label}`
-        const effect = this.reactivityGraph.makeEffect(
-          (get, _otelContext, debugRefreshReason) =>
-            options.onUpdate(get(query$.results$, otelContext, debugRefreshReason)),
-          { label },
-        )
-
-        if (options?.stackInfo) {
-          query$.activeSubscriptions.add(options.stackInfo)
-        }
-
-        options?.onSubscribe?.(query$)
+        const effect = this.reactivityGraph.makeEffect((get) => onNewValue(get(query$.results$)), { label })
 
         this.activeQueries.add(query$ as LiveQuery<TResult>)
 
         // Running effect right away to get initial value (unless `skipInitialRun` is set)
-        if (options?.skipInitialRun !== true && !query$.isDestroyed) {
-          effect.doEffect(otelContext, { _tag: 'subscribe.initial', label: `subscribe-initial-run:${options?.label}` })
+        if (options?.skipInitialRun !== true) {
+          effect.doEffect(otelContext)
         }
 
         const unsubscribe = () => {
@@ -332,14 +283,7 @@ export class Store<
           try {
             this.reactivityGraph.destroyNode(effect)
             this.activeQueries.remove(query$ as LiveQuery<TResult>)
-
-            if (options?.stackInfo) {
-              query$.activeSubscriptions.delete(options.stackInfo)
-            }
-
-            queryRcRef.deref()
-
-            options?.onUnsubsubscribe?.()
+            onUnsubsubscribe?.()
           } finally {
             span.end()
           }
@@ -349,30 +293,6 @@ export class Store<
       },
     )
 
-  subscribeStream = <TResult>(
-    query$: LiveQueryDef<TResult, any>,
-    options?: { label?: string; skipInitialRun?: boolean } | undefined,
-  ): Stream.Stream<TResult> =>
-    Stream.asyncPush<TResult>((emit) =>
-      Effect.gen(this, function* () {
-        const otelSpan = yield* OtelTracer.currentOtelSpan.pipe(
-          Effect.catchTag('NoSuchElementException', () => Effect.succeed(undefined)),
-        )
-        const otelContext = otelSpan ? otel.trace.setSpan(otel.context.active(), otelSpan) : otel.context.active()
-
-        yield* Effect.acquireRelease(
-          Effect.sync(() =>
-            this.subscribe(query$, {
-              onUpdate: (result) => emit.single(result),
-              otelContext,
-              label: options?.label,
-            }),
-          ),
-          (unsub) => Effect.sync(() => unsub()),
-        )
-      }),
-    )
-
   /**
    * Synchronously queries the database without creating a LiveQuery.
    * This is useful for queries that don't need to be reactive.
@@ -388,15 +308,12 @@ export class Store<
    * ```
    */
   query = <TResult>(
-    query:
-      | QueryBuilder<TResult, any, any>
-      | LiveQuery<TResult, any>
-      | LiveQueryDef<TResult, any>
-      | { query: string; bindValues: ParamsObject },
-    options?: { otelContext?: otel.Context; debugRefreshReason?: RefreshReason },
+    query: QueryBuilder<TResult, any, any> | LiveQuery<TResult, any> | { query: string; bindValues: ParamsObject },
+    options?: { otelContext?: otel.Context },
   ): TResult => {
     if (typeof query === 'object' && 'query' in query && 'bindValues' in query) {
-      return this.sqliteDbWrapper.select(query.query, prepareBindValues(query.bindValues, query.query), {
+      return this.syncDbWrapper.select(query.query, {
+        bindValues: prepareBindValues(query.bindValues, query.query),
         otelContext: options?.otelContext,
       }) as any
     } else if (isQueryBuilder(query)) {
@@ -412,38 +329,17 @@ export class Store<
 
       const sqlRes = query.asSql()
       const schema = getResultSchema(query)
-      const rawRes = this.sqliteDbWrapper.select(sqlRes.query, sqlRes.bindValues as any as PreparedBindValues, {
+      const rawRes = this.syncDbWrapper.select(sqlRes.query, {
+        bindValues: sqlRes.bindValues as any as PreparedBindValues,
         otelContext: options?.otelContext,
         queriedTables: new Set([query[QueryBuilderAstSymbol].tableDef.sqliteDef.name]),
       })
       return Schema.decodeSync(schema)(rawRes)
-    } else if (query._tag === 'def') {
-      const query$ = query.make(this.reactivityGraph.context!)
-      const result = this.query(query$.value, options)
-      query$.deref()
-      return result
     } else {
-      return query.run({ otelContext: options?.otelContext, debugRefreshReason: options?.debugRefreshReason })
+      return query.run(options?.otelContext)
     }
   }
 
-  // makeLive: {
-  //   <T>(def: LiveQueryDef<T, any>): LiveQuery<T, any>
-  //   <T>(def: ILiveQueryRefDef<T>): ILiveQueryRef<T>
-  // } = (def: any) => {
-  //   if (def._tag === 'live-ref-def') {
-  //     return (def as ILiveQueryRefDef<any>).make(this.reactivityGraph.context!)
-  //   } else {
-  //     return (def as LiveQueryDef<any, any>).make(this.reactivityGraph.context!) as any
-  //   }
-  // }
-
-  setRef = <T>(refDef: ILiveQueryRefDef<T>, value: T): void => {
-    const ref = refDef.make(this.reactivityGraph.context!)
-    ref.value.set(value)
-    ref.deref()
-  }
-
   // #region mutate
   mutate: {
     <const TMutationArg extends ReadonlyArray<MutationEvent.PartialForSchema<TSchema>>>(...list: TMutationArg): void
@@ -471,6 +367,7 @@ export class Store<
 
     if (mutationsEvents.length === 0) return
 
+    const label = options?.label ?? 'mutate'
     const skipRefresh = options?.skipRefresh ?? false
 
     const mutationsSpan = otel.trace.getSpan(this.otel.mutationsSpanContext)!
@@ -484,39 +381,40 @@ export class Store<
 
     return this.otel.tracer.startActiveSpan(
       'LiveStore:mutate',
-      {
-        attributes: {
-          'livestore.mutationEventsCount': mutationsEvents.length,
-          'livestore.mutationEventTags': mutationsEvents.map((_) => _.mutation),
-          'livestore.mutateLabel': options?.label,
-        },
-        links: options?.spanLinks,
-      },
+      { attributes: { 'livestore.mutateLabel': label }, links: options?.spanLinks },
       options?.otelContext ?? this.otel.mutationsSpanContext,
       (span) => {
         const otelContext = otel.trace.setSpan(otel.context.active(), span)
 
         try {
-          const { writeTables } = (() => {
-            try {
-              const applyMutations = () => this.syncProcessor.push(mutationsEvents, { otelContext })
-
-              if (mutationsEvents.length > 1) {
-                // TODO: what to do about leader transaction here?
-                return this.sqliteDbWrapper.txn(applyMutations)
-              } else {
-                return applyMutations()
+          const { writeTables } = this.otel.tracer.startActiveSpan(
+            'LiveStore:mutate:applyMutations',
+            { attributes: { 'livestore.mutateLabel': label } },
+            otel.trace.setSpan(otel.context.active(), span),
+            (span) => {
+              try {
+                const otelContext = otel.trace.setSpan(otel.context.active(), span)
+                // 5
+
+                const applyMutations = () => this.syncProcessor.push(mutationsEvents, { otelContext })
+
+                if (mutationsEvents.length > 1) {
+                  // TODO: what to do about leader transaction here?
+                  return this.syncDbWrapper.txn(applyMutations)
+                } else {
+                  return applyMutations()
+                }
+              } catch (e: any) {
+                console.error(e)
+                span.setStatus({ code: otel.SpanStatusCode.ERROR, message: e.toString() })
+                throw e
+              } finally {
+                span.end()
               }
-            } catch (e: any) {
-              console.error(e)
-              span.setStatus({ code: otel.SpanStatusCode.ERROR, message: e.toString() })
-              throw e
-            } finally {
-              span.end()
-            }
-          })()
+            },
+          )
 
-          const tablesToUpdate = [] as [Ref<null, ReactivityGraphContext, RefreshReason>, null][]
+          const tablesToUpdate = [] as [Ref<null, QueryContext, RefreshReason>, null][]
           for (const tableName of writeTables) {
             const tableRef = this.tableRefs[tableName]
             assertNever(tableRef !== undefined, `No table ref found for ${tableName}`)
@@ -572,48 +470,41 @@ export class Store<
       meta: { liveStoreRefType: 'table' },
     })
 
-  /**
-   * Helper methods useful during development
-   *
-   * @internal
-   */
-  _dev = {
-    downloadDb: (source: 'local' | 'leader' = 'local') => {
-      Effect.gen(this, function* () {
-        const data = source === 'local' ? this.sqliteDbWrapper.export() : yield* this.clientSession.leaderThread.export
-        downloadBlob(data, `livestore-${Date.now()}.db`)
-      }).pipe(this.runEffectFork)
-    },
-
-    downloadMutationLogDb: () => {
-      Effect.gen(this, function* () {
-        const data = yield* this.clientSession.leaderThread.getMutationLogData
-        downloadBlob(data, `livestore-mutationlog-${Date.now()}.db`)
-      }).pipe(this.runEffectFork)
-    },
-
-    hardReset: (mode: 'all-data' | 'only-app-db' = 'all-data') => {
-      Effect.gen(this, function* () {
-        yield* this.clientSession.leaderThread.sendDevtoolsMessage(
-          Devtools.ResetAllDataReq.make({ liveStoreVersion, mode, requestId: nanoid() }),
-        )
-      }).pipe(this.runEffectFork)
-    },
-
-    syncStates: () => {
-      Effect.gen(this, function* () {
-        const session = this.syncProcessor.syncStateRef.current
-        console.log('Session sync state:', session.toJSON())
-        const leader = yield* this.clientSession.leaderThread.getSyncState
-        console.log('Leader sync state:', leader.toJSON())
-      }).pipe(this.runEffectFork)
-    },
-
-    shutdown: (cause?: Cause.Cause<UnexpectedError>) => {
-      this.clientSession
-        .shutdown(cause ?? Cause.fail(IntentionalShutdownCause.make({ reason: 'manual' })))
-        .pipe(Effect.tapCauseLogPretty, Effect.provide(this.runtime), Effect.runFork)
-    },
+  __devDownloadDb = (source: 'local' | 'leader' = 'local') => {
+    Effect.gen(this, function* () {
+      const data = source === 'local' ? this.syncDbWrapper.export() : yield* this.clientSession.leaderThread.export
+      downloadBlob(data, `livestore-${Date.now()}.db`)
+    }).pipe(this.runEffectFork)
+  }
+
+  __devDownloadMutationLogDb = () => {
+    Effect.gen(this, function* () {
+      const data = yield* this.clientSession.leaderThread.getMutationLogData
+      downloadBlob(data, `livestore-mutationlog-${Date.now()}.db`)
+    }).pipe(this.runEffectFork)
+  }
+
+  __devHardReset = (mode: 'all-data' | 'only-app-db' = 'all-data') => {
+    Effect.gen(this, function* () {
+      yield* this.clientSession.leaderThread.sendDevtoolsMessage(
+        Devtools.ResetAllDataReq.make({ liveStoreVersion, mode, requestId: nanoid() }),
+      )
+    }).pipe(this.runEffectFork)
+  }
+
+  __devSyncStates = () => {
+    Effect.gen(this, function* () {
+      const session = this.syncProcessor.syncStateRef.current
+      console.log('Session sync state:', session)
+      const leader = yield* this.clientSession.leaderThread.getSyncState
+      console.log('Leader sync state:', leader)
+    }).pipe(this.runEffectFork)
+  }
+
+  __devShutdown = (cause?: Cause.Cause<UnexpectedError>) => {
+    this.clientSession
+      .shutdown(cause ?? Cause.fail(IntentionalShutdownCause.make({ reason: 'manual' })))
+      .pipe(Effect.tapCauseLogPretty, Effect.provide(this.runtime), Effect.runFork)
   }
 
   // NOTE This is needed because when booting a Store via Effect it seems to call `toJSON` in the error path

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

@@ -46,7 +46,7 @@ Error
 
 it('Tracklist_ stacktrace', async () => {
   const stackTrace = `\
-Error
+stack Error
     at https://localhost:8081/@fs/Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/livestore/dist/react/useQuery.js?t=1701368568351:19:23
     at mountMemo (https://localhost:8081/node_modules/.vite-web/deps/chunk-YKTDXTVC.js?v=86daed82:12817:27)
     at Object.useMemo (https://localhost:8081/node_modules/.vite-web/deps/chunk-YKTDXTVC.js?v=86daed82:13141:24)
@@ -77,60 +77,3 @@ Error
     }
   `)
 })
-
-it('React 19', async () => {
-  const stackTrace = `\
-Error: 
-    at /Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/react/src/useQuery.ts:57:19
-    at mountMemo (/Users/schickling/Code/overtone/node_modules/.pnpm/react-dom@19.0.0_react@19.0.0/node_modules/react-dom/cjs/react-dom-client.development.js:6816:23)
-    at Object.useMemo (/Users/schickling/Code/overtone/node_modules/.pnpm/react-dom@19.0.0_react@19.0.0/node_modules/react-dom/cjs/react-dom-client.development.js:22757:18)
-    at Object.process.env.NODE_ENV.exports.useMemo (/Users/schickling/Code/overtone/node_modules/.pnpm/react@19.0.0/node_modules/react/cjs/react.development.js:1488:34)
-    at Module.useQueryRef (/Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/react/src/useQuery.ts:54:27)
-    at Module.useRow (/Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/react/src/useRow.ts:111:20)
-    at TestComponent (/Users/schickling/Code/overtone/node_modules/.pnpm/@testing-library+react@16.1.0_@testing-library+dom@10.4.0_@types+react-dom@19.0.3_@types+reac_2jaiibiag2sxou3wtzbuqx3r5a/node_modules/@testing-library/react/dist/pure.js:309:27)
-    at Object.react-stack-bottom-frame (/Users/schickling/Code/overtone/node_modules/.pnpm/react-dom@19.0.0_react@19.0.0/node_modules/react-dom/cjs/react-dom-client.development.js:22428:20)
-    at renderWithHooks (/Users/schickling/Code/overtone/node_modules/.pnpm/react-dom@19.0.0_react@19.0.0/node_modules/react-dom/cjs/react-dom-client.development.js:5757:22)
-  `
-
-  const stackInfo = extractStackInfoFromStackTrace(stackTrace)
-  expect(stackInfo).toMatchInlineSnapshot(`
-    {
-      "frames": [
-        {
-          "filePath": "/Users/schickling/Code/overtone/node_modules/.pnpm/@testing-library+react@16.1.0_@testing-library+dom@10.4.0_@types+react-dom@19.0.3_@types+reac_2jaiibiag2sxou3wtzbuqx3r5a/node_modules/@testing-library/react/dist/pure.js:309:27",
-          "name": "TestComponent",
-        },
-        {
-          "filePath": "/Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/react/src/useRow.ts:111:20",
-          "name": "useRow",
-        },
-      ],
-    }
-  `)
-})
-
-it('React 19 - skip react-stack-bottom-frame', async () => {
-  const stackTrace = `\
-Error: 
-    at /Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/react/src/useQuery.ts:57:19
-    at mountMemo (/Users/schickling/Code/overtone/node_modules/.pnpm/react-dom@19.0.0_react@19.0.0/node_modules/react-dom/cjs/react-dom-client.development.js:6816:23)
-    at Object.useMemo (/Users/schickling/Code/overtone/node_modules/.pnpm/react-dom@19.0.0_react@19.0.0/node_modules/react-dom/cjs/react-dom-client.development.js:22757:18)
-    at Object.process.env.NODE_ENV.exports.useMemo (/Users/schickling/Code/overtone/node_modules/.pnpm/react@19.0.0/node_modules/react/cjs/react.development.js:1488:34)
-    at Module.useQueryRef (/Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/react/src/useQuery.ts:54:27)
-    at Module.useRow (/Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/react/src/useRow.ts:111:20)
-    at Object.react-stack-bottom-frame (/Users/schickling/Code/overtone/node_modules/.pnpm/react-dom@19.0.0_react@19.0.0/node_modules/react-dom/cjs/react-dom-client.development.js:22428:20)
-    at renderWithHooks (/Users/schickling/Code/overtone/node_modules/.pnpm/react-dom@19.0.0_react@19.0.0/node_modules/react-dom/cjs/react-dom-client.development.js:5757:22)
-  `
-
-  const stackInfo = extractStackInfoFromStackTrace(stackTrace)
-  expect(stackInfo).toMatchInlineSnapshot(`
-    {
-      "frames": [
-        {
-          "filePath": "/Users/schickling/Code/overtone/submodules/livestore/packages/@livestore/react/src/useRow.ts:111:20",
-          "name": "useRow",
-        },
-      ],
-    }
-  `)
-})

package/src/utils/stack-info.ts

@@ -34,20 +34,15 @@ export const extractStackInfoFromStackTrace = (stackTrace: string): StackInfo =>
 
   while ((match = namePattern.exec(stackTrace)) !== null) {
     const [, name, filePath] = match as any as [string, string, string]
-    // console.debug(name, filePath)
 
     // NOTE No idea where this `Module.` comes from - possibly a Vite thing?
     if ((name.startsWith('use') || name.startsWith('Module.use')) && name.endsWith('QueryRef') === false) {
       hasReachedStart = true
-      // console.debug('hasReachedStart. adding one more frame.')
 
       frames.unshift({ name: name.replace(/^Module\./, ''), filePath })
     } else if (hasReachedStart) {
       // We've reached the end of the `use*` functions, so we're adding the component name and stop
-      // Unless it's `react-stack-bottom-frame`, which we skip
-      if (name !== 'Object.react-stack-bottom-frame') {
-        frames.unshift({ name, filePath })
-      }
+      frames.unshift({ name, filePath })
       break
     }
   }