@livestore/livestore 0.0.54-dev.22 → 0.0.54-dev.24

package/src/global-state.ts

@@ -11,10 +11,6 @@
  *
  */
 
-import type { DbSchema } from '@livestore/common/schema'
-
 import { makeReactivityGraph } from './reactiveQueries/base-class.js'
 
 export const globalReactivityGraph = makeReactivityGraph()
-
-export const dynamicallyRegisteredTables: Map<string, DbSchema.TableDef> = new Map()

package/src/index.ts

@@ -27,7 +27,7 @@ export {
   type LiveQuery,
 } from './reactiveQueries/base-class.js'
 
-export { globalReactivityGraph, dynamicallyRegisteredTables } from './global-state.js'
+export { globalReactivityGraph } from './global-state.js'
 
 export { type RowResult, type RowResultEncoded, rowQuery, deriveColQuery } from './row-query.js'
 
@@ -35,6 +35,7 @@ export * from '@livestore/common/schema'
 export {
   sql,
   type BootDb,
+  type BootStatus,
   type InMemoryDatabase,
   type DebugInfo,
   type MutableDebugInfo,

package/src/react/LiveStoreContext.ts

@@ -11,5 +11,9 @@ export const useStore = (): LiveStoreContext_ => {
     throw new Error(`useStore can only be used inside StoreContext.Provider`)
   }
 
+  if (storeContext.stage !== 'running') {
+    throw new Error(`useStore can only be used after the store is running`)
+  }
+
   return storeContext
 }

package/src/react/LiveStoreProvider.test.tsx

@@ -37,7 +37,12 @@ describe('LiveStoreProvider', () => {
       // eslint-disable-next-line react-hooks/exhaustive-deps
       const adapterMemo = React.useMemo(() => makeInMemoryAdapter(), [forceUpdate])
       return (
-        <LiveStoreProvider schema={schema} fallback={<div>Loading LiveStore</div>} adapter={adapterMemo} boot={bootCb}>
+        <LiveStoreProvider
+          schema={schema}
+          renderLoading={(status) => <div>Loading LiveStore: {status.stage}</div>}
+          adapter={adapterMemo}
+          boot={bootCb}
+        >
           <App />
         </LiveStoreProvider>
       )
@@ -47,14 +52,14 @@ describe('LiveStoreProvider', () => {
 
     expect(renderCount).toBe(0)
 
-    await waitForElementToBeRemoved(() => screen.getByText('Loading LiveStore'))
+    await waitForElementToBeRemoved(() => screen.getByText((_) => _.startsWith('Loading LiveStore')))
 
     expect(renderCount).toBe(1)
 
     rerender(<Root forceUpdate={2} />)
 
-    await waitFor(() => screen.getByText('Loading LiveStore'))
-    await waitForElementToBeRemoved(() => screen.getByText('Loading LiveStore'))
+    await waitFor(() => screen.getByText('Loading LiveStore: loading'))
+    await waitForElementToBeRemoved(() => screen.getByText((_) => _.startsWith('Loading LiveStore')))
 
     expect(renderCount).toBe(2)
 

package/src/react/LiveStoreProvider.tsx

@@ -1,4 +1,4 @@
-import type { BootDb, StoreAdapterFactory } from '@livestore/common'
+import type { BootDb, BootStatus, StoreAdapterFactory } from '@livestore/common'
 import type { LiveStoreSchema } from '@livestore/common/schema'
 import { shouldNeverHappen } from '@livestore/utils'
 import type * as otel from '@opentelemetry/api'
@@ -16,14 +16,14 @@ interface LiveStoreProviderProps<GraphQLContext> {
   boot?: (db: BootDb, parentSpan: otel.Span) => unknown | Promise<unknown>
   graphQLOptions?: GraphQLOptions<GraphQLContext>
   otelOptions?: OtelOptions
-  fallback: ReactElement
+  renderLoading: (status: BootStatus) => ReactElement
   adapter: StoreAdapterFactory
   batchUpdates?: (run: () => void) => void
   disableDevtools?: boolean
 }
 
 export const LiveStoreProvider = <GraphQLContext extends BaseGraphQLContext>({
-  fallback,
+  renderLoading,
   graphQLOptions,
   otelOptions,
   children,
@@ -43,8 +43,8 @@ export const LiveStoreProvider = <GraphQLContext extends BaseGraphQLContext>({
     disableDevtools,
   })
 
-  if (storeCtx === undefined) {
-    return fallback
+  if (storeCtx.stage !== 'running') {
+    return <div>{renderLoading(storeCtx)}</div>
   }
 
   window.__debugLiveStore = storeCtx.store
@@ -62,7 +62,7 @@ const useCreateStore = <GraphQLContext extends BaseGraphQLContext>({
   disableDevtools,
 }: LiveStoreCreateStoreOptions<GraphQLContext>) => {
   const [_, rerender] = React.useState(0)
-  const ctxValueRef = React.useRef<StoreContext_ | undefined>(undefined)
+  const ctxValueRef = React.useRef<StoreContext_ | BootStatus>({ stage: 'loading' })
   const inputPropsCacheRef = React.useRef({
     schema,
     graphQLOptions,
@@ -89,9 +89,11 @@ const useCreateStore = <GraphQLContext extends BaseGraphQLContext>({
       adapter,
       batchUpdates,
     }
-    ctxValueRef.current?.store.destroy()
-    oldStoreAlreadyDestroyedRef.current = true
-    ctxValueRef.current = undefined
+    if (ctxValueRef.current.stage === 'running') {
+      ctxValueRef.current.store.destroy()
+      oldStoreAlreadyDestroyedRef.current = true
+      ctxValueRef.current = { stage: 'loading' }
+    }
   }
 
   React.useEffect(() => {
@@ -107,8 +109,13 @@ const useCreateStore = <GraphQLContext extends BaseGraphQLContext>({
           adapter,
           batchUpdates,
           disableDevtools,
+          onBootStatus: (status) => {
+            if (ctxValueRef.current.stage === 'running') return
+            ctxValueRef.current = status
+            rerender((c) => c + 1)
+          },
         })
-        ctxValueRef.current = { store }
+        ctxValueRef.current = { stage: 'running', store }
         oldStoreAlreadyDestroyedRef.current = false
         rerender((c) => c + 1)
       } catch (e) {

package/src/row-query.ts

@@ -1,18 +1,16 @@
-import type { InMemoryDatabase, QueryInfoCol, QueryInfoNone, QueryInfoRow } from '@livestore/common'
-import { migrateTable, sql } from '@livestore/common'
-import { DbSchema, SCHEMA_META_TABLE } from '@livestore/common/schema'
+import type { QueryInfoCol, QueryInfoNone, QueryInfoRow } from '@livestore/common'
+import { sql } from '@livestore/common'
+import { DbSchema } from '@livestore/common/schema'
 import type { GetValForKey } from '@livestore/utils'
 import { shouldNeverHappen } from '@livestore/utils'
-import { Effect, Schema, TreeFormatter } from '@livestore/utils/effect'
+import { Schema, TreeFormatter } from '@livestore/utils/effect'
 import type * as otel from '@opentelemetry/api'
 import type { SqliteDsl } from 'effect-db-schema'
-import { SqliteAst } from 'effect-db-schema'
 
-import type { Ref } from './reactive.js'
 import type { LiveQuery, LiveQueryAny, QueryContext, ReactivityGraph } from './reactiveQueries/base-class.js'
 import { computed } from './reactiveQueries/js.js'
 import { LiveStoreSQLQuery } from './reactiveQueries/sql.js'
-import type { RefreshReason, Store } from './store.js'
+import type { Store } from './store.js'
 
 export type RowQueryOptions = {
   otelContext?: otel.Context
@@ -81,7 +79,6 @@ export const rowQuery: MakeRowQuery = <TTableDef extends DbSchema.TableDef>(
     execBeforeFirstRun: makeExecBeforeFirstRun({
       otelContext: options?.otelContext,
       table,
-      tableName,
       defaultValues,
       id,
       skipInsertDefaultRow: options?.skipInsertDefaultRow,
@@ -136,59 +133,16 @@ const makeExecBeforeFirstRun =
     skipInsertDefaultRow,
     otelContext: otelContext_,
     table,
-    tableName,
   }: {
     id?: string
     defaultValues?: any
     skipInsertDefaultRow?: boolean
     otelContext?: otel.Context
-    tableName: string
     table: DbSchema.TableDef
   }) =>
   ({ store }: QueryContext) => {
     const otelContext = otelContext_ ?? store.otel.queriesSpanContext
 
-    // TODO we can remove this codepath again when Devtools v2 has landed
-    if (store.tableRefs[tableName] === undefined) {
-      const schemaHash = SqliteAst.hash(table.sqliteDef.ast)
-      const res = store.mainDbWrapper.select<{ schemaHash: number }>(
-        sql`SELECT schemaHash FROM ${SCHEMA_META_TABLE} WHERE tableName = '${tableName}'`,
-      )
-      if (res.length === 0 || res[0]!.schemaHash !== schemaHash) {
-        const db = {
-          ...store.adapter.mainDb,
-          prepare: (query) => {
-            const mainStmt = store.adapter.mainDb.prepare(query)
-            return {
-              ...mainStmt,
-              execute: (bindValues) => {
-                const getRowsChanged = mainStmt.execute(bindValues)
-                store.adapter.coordinator.execute(query, bindValues).pipe(Effect.tapCauseLogPretty, Effect.runFork)
-                return getRowsChanged
-              },
-            }
-          },
-        } satisfies InMemoryDatabase
-
-        migrateTable({
-          db,
-          tableAst: table.sqliteDef.ast,
-          otelContext,
-          schemaHash,
-          behaviour: 'create-if-not-exists',
-        })
-      }
-
-      const label = `tableRef:${tableName}`
-
-      // TODO find a better implementation for this
-      const existingTableRefFromGraph = Array.from(store.reactivityGraph.atoms.values()).find(
-        (_) => _._tag === 'ref' && _.label === label,
-      ) as Ref<null, QueryContext, RefreshReason> | undefined
-
-      store.tableRefs[tableName] = existingTableRefFromGraph ?? store.makeTableRef(tableName)
-    }
-
     if (skipInsertDefaultRow !== true && table.options.isSingleton === false) {
       insertRowWithDefaultValuesOrIgnore({
         store,