@livestore/livestore 0.1.0-dev.9 → 0.2.0-dev.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@livestore/livestore",
-  "version": "0.1.0-dev.9",
+  "version": "0.2.0-dev.0",
   "type": "module",
   "sideEffects": false,
   "exports": {
@@ -31,9 +31,9 @@
   "dependencies": {
     "@graphql-typed-document-node/core": "^3.2.0",
     "@opentelemetry/api": "^1.9.0",
-    "@livestore/common": "0.1.0-dev.9",
-    "@livestore/utils": "0.1.0-dev.9",
-    "@livestore/db-schema": "0.1.0-dev.9"
+    "@livestore/common": "0.2.0-dev.0",
+    "@livestore/db-schema": "0.2.0-dev.0",
+    "@livestore/utils": "0.2.0-dev.0"
   },
   "devDependencies": {
     "@opentelemetry/sdk-trace-base": "1.27.0",
@@ -41,7 +41,7 @@
     "typescript": "5.5.4",
     "vite": "5.4.10",
     "vitest": "^2.1.4",
-    "@livestore/web": "0.1.0-dev.9"
+    "@livestore/web": "0.2.0-dev.0"
   },
   "peerDependencies": {
     "graphql": "16.x"

package/src/global-state.ts

@@ -13,7 +13,7 @@
 
 import { GlobalValue } from '@livestore/utils/effect'
 
-import { makeReactivityGraph } from './reactiveQueries/base-class.js'
+import { makeReactivityGraph } from './live-queries/base-class.js'
 
 export const globalReactivityGraph = GlobalValue.globalValue('livestore-global-reactivityGraph', () =>
   makeReactivityGraph(),

package/src/index.ts

@@ -25,9 +25,9 @@ export type {
   Ref,
   Effect,
 } from './reactive.js'
-export { LiveStoreJSQuery, computed } from './reactiveQueries/computed.js'
-export { LiveStoreSQLQuery, querySQL } from './reactiveQueries/sql.js'
-export { LiveStoreGraphQLQuery, queryGraphQL } from './reactiveQueries/graphql.js'
+export { LiveStoreComputedQuery, computed } from './live-queries/computed.js'
+export { LiveStoreDbQuery, queryDb } from './live-queries/db.js'
+export { LiveStoreGraphQLQuery, queryGraphQL } from './live-queries/graphql.js'
 export {
   type GetAtomResult,
   type ReactivityGraph,
@@ -35,11 +35,11 @@ export {
   type LiveQuery,
   type GetResult,
   type LiveQueryAny,
-} from './reactiveQueries/base-class.js'
+} from './live-queries/base-class.js'
 
 export { globalReactivityGraph } from './global-state.js'
 
-export { type RowResult, type RowResultEncoded, rowQuery, deriveColQuery } from './row-query.js'
+export { deriveColQuery } from './row-query-utils.js'
 
 export * from '@livestore/common/schema'
 export {
@@ -52,6 +52,9 @@ export {
   prepareBindValues,
   type Bindable,
   type PreparedBindValues,
+  type QueryBuilderAst,
+  type QueryBuilder,
+  type RowQuery,
 } from '@livestore/common'
 
 export { SqliteAst, SqliteDsl } from '@livestore/db-schema'

package/src/live-queries/__snapshots__/db.test.ts.snap

@@ -0,0 +1,301 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`otel > otel 3`] = `
+{
+  "_name": "test",
+  "children": [
+    {
+      "_name": "livestore.in-memory-db:execute",
+      "attributes": {
+        "sql.query": "
+      PRAGMA page_size=32768;
+      PRAGMA cache_size=10000;
+      PRAGMA journal_mode='MEMORY'; -- we don't flush to disk before committing a write
+      PRAGMA synchronous='OFF';
+      PRAGMA temp_store='MEMORY';
+      PRAGMA foreign_keys='ON'; -- we want foreign key constraints to be enforced
+    ",
+      },
+    },
+    {
+      "_name": "LiveStore:mutations",
+      "children": [
+        {
+          "_name": "LiveStore:mutate",
+          "attributes": {
+            "livestore.mutateLabel": "mutate",
+          },
+          "children": [
+            {
+              "_name": "LiveStore:processWrites",
+              "attributes": {
+                "livestore.mutateLabel": "mutate",
+              },
+              "children": [
+                {
+                  "_name": "LiveStore:mutateWithoutRefresh",
+                  "attributes": {
+                    "livestore.args": "{
+  "sql": "INSERT INTO todos (id, text, completed) VALUES ('t1', 'buy milk', 0)"
+}",
+                    "livestore.mutation": "livestore.RawSql",
+                  },
+                  "children": [
+                    {
+                      "_name": "livestore.in-memory-db:execute",
+                      "attributes": {
+                        "sql.query": "INSERT INTO todos (id, text, completed) VALUES ('t1', 'buy milk', 0)",
+                      },
+                    },
+                  ],
+                },
+              ],
+            },
+          ],
+        },
+      ],
+    },
+    {
+      "_name": "LiveStore:queries",
+      "children": [
+        {
+          "_name": "db:select * from todos",
+          "attributes": {
+            "sql.query": "select * from todos",
+            "sql.rowsCount": 0,
+          },
+          "children": [
+            {
+              "_name": "sql-in-memory-select",
+              "attributes": {
+                "sql.cached": false,
+                "sql.query": "select * from todos",
+                "sql.rowsCount": 0,
+              },
+            },
+          ],
+        },
+        {
+          "_name": "db:select * from todos",
+          "attributes": {
+            "sql.query": "select * from todos",
+            "sql.rowsCount": 1,
+          },
+          "children": [
+            {
+              "_name": "sql-in-memory-select",
+              "attributes": {
+                "sql.cached": false,
+                "sql.query": "select * from todos",
+                "sql.rowsCount": 1,
+              },
+            },
+          ],
+        },
+      ],
+    },
+  ],
+}
+`;
+
+exports[`otel > with thunks 3`] = `
+{
+  "_name": "test",
+  "children": [
+    {
+      "_name": "livestore.in-memory-db:execute",
+      "attributes": {
+        "sql.query": "
+      PRAGMA page_size=32768;
+      PRAGMA cache_size=10000;
+      PRAGMA journal_mode='MEMORY'; -- we don't flush to disk before committing a write
+      PRAGMA synchronous='OFF';
+      PRAGMA temp_store='MEMORY';
+      PRAGMA foreign_keys='ON'; -- we want foreign key constraints to be enforced
+    ",
+      },
+    },
+    {
+      "_name": "LiveStore:mutations",
+      "children": [
+        {
+          "_name": "LiveStore:mutate",
+          "attributes": {
+            "livestore.mutateLabel": "mutate",
+          },
+          "children": [
+            {
+              "_name": "LiveStore:processWrites",
+              "attributes": {
+                "livestore.mutateLabel": "mutate",
+              },
+              "children": [
+                {
+                  "_name": "LiveStore:mutateWithoutRefresh",
+                  "attributes": {
+                    "livestore.args": "{
+  "sql": "INSERT INTO todos (id, text, completed) VALUES ('t1', 'buy milk', 0)"
+}",
+                    "livestore.mutation": "livestore.RawSql",
+                  },
+                  "children": [
+                    {
+                      "_name": "livestore.in-memory-db:execute",
+                      "attributes": {
+                        "sql.query": "INSERT INTO todos (id, text, completed) VALUES ('t1', 'buy milk', 0)",
+                      },
+                    },
+                  ],
+                },
+              ],
+            },
+          ],
+        },
+      ],
+    },
+    {
+      "_name": "LiveStore:queries",
+      "children": [
+        {
+          "_name": "db:select * from todos where completed = 0",
+          "attributes": {
+            "sql.query": "select * from todos where completed = 0",
+            "sql.rowsCount": 0,
+          },
+          "children": [
+            {
+              "_name": "js:where-filter",
+            },
+            {
+              "_name": "sql-in-memory-select",
+              "attributes": {
+                "sql.cached": false,
+                "sql.query": "select * from todos where completed = 0",
+                "sql.rowsCount": 0,
+              },
+            },
+          ],
+        },
+        {
+          "_name": "db:select * from todos where completed = 0",
+          "attributes": {
+            "sql.query": "select * from todos where completed = 0",
+            "sql.rowsCount": 1,
+          },
+          "children": [
+            {
+              "_name": "sql-in-memory-select",
+              "attributes": {
+                "sql.cached": false,
+                "sql.query": "select * from todos where completed = 0",
+                "sql.rowsCount": 1,
+              },
+            },
+          ],
+        },
+      ],
+    },
+  ],
+}
+`;
+
+exports[`otel > with thunks with query builder and without labels 3`] = `
+{
+  "_name": "test",
+  "children": [
+    {
+      "_name": "livestore.in-memory-db:execute",
+      "attributes": {
+        "sql.query": "
+      PRAGMA page_size=32768;
+      PRAGMA cache_size=10000;
+      PRAGMA journal_mode='MEMORY'; -- we don't flush to disk before committing a write
+      PRAGMA synchronous='OFF';
+      PRAGMA temp_store='MEMORY';
+      PRAGMA foreign_keys='ON'; -- we want foreign key constraints to be enforced
+    ",
+      },
+    },
+    {
+      "_name": "LiveStore:mutations",
+      "children": [
+        {
+          "_name": "LiveStore:mutate",
+          "attributes": {
+            "livestore.mutateLabel": "mutate",
+          },
+          "children": [
+            {
+              "_name": "LiveStore:processWrites",
+              "attributes": {
+                "livestore.mutateLabel": "mutate",
+              },
+              "children": [
+                {
+                  "_name": "LiveStore:mutateWithoutRefresh",
+                  "attributes": {
+                    "livestore.args": "{
+  "sql": "INSERT INTO todos (id, text, completed) VALUES ('t1', 'buy milk', 0)"
+}",
+                    "livestore.mutation": "livestore.RawSql",
+                  },
+                  "children": [
+                    {
+                      "_name": "livestore.in-memory-db:execute",
+                      "attributes": {
+                        "sql.query": "INSERT INTO todos (id, text, completed) VALUES ('t1', 'buy milk', 0)",
+                      },
+                    },
+                  ],
+                },
+              ],
+            },
+          ],
+        },
+      ],
+    },
+    {
+      "_name": "LiveStore:queries",
+      "children": [
+        {
+          "_name": "db:SELECT * FROM 'todos' WHERE completed = ? LIMIT ?",
+          "attributes": {
+            "sql.query": "SELECT * FROM 'todos' WHERE completed = ? LIMIT ?",
+            "sql.rowsCount": 0,
+          },
+          "children": [
+            {
+              "_name": "js:() => ({ completed: false })",
+            },
+            {
+              "_name": "sql-in-memory-select",
+              "attributes": {
+                "sql.cached": false,
+                "sql.query": "SELECT * FROM 'todos' WHERE completed = ? LIMIT ?",
+                "sql.rowsCount": 0,
+              },
+            },
+          ],
+        },
+        {
+          "_name": "db:SELECT * FROM 'todos' WHERE completed = ? LIMIT ?",
+          "attributes": {
+            "sql.query": "SELECT * FROM 'todos' WHERE completed = ? LIMIT ?",
+            "sql.rowsCount": 1,
+          },
+          "children": [
+            {
+              "_name": "sql-in-memory-select",
+              "attributes": {
+                "sql.cached": false,
+                "sql.query": "SELECT * FROM 'todos' WHERE completed = ? LIMIT ?",
+                "sql.rowsCount": 1,
+              },
+            },
+          ],
+        },
+      ],
+    },
+  ],
+}
+`;

package/src/{reactiveQueries → live-queries}/base-class.ts

@@ -1,4 +1,4 @@
-import type { QueryInfo, QueryInfoNone } from '@livestore/common'
+import type { QueryInfo } from '@livestore/common'
 import type * as otel from '@opentelemetry/api'
 
 import { type Atom, type GetAtom, ReactiveGraph, throwContextNotSetError, type Thunk } from '../reactive.js'
@@ -27,9 +27,13 @@ let queryIdCounter = 0
 
 export type LiveQueryAny = LiveQuery<any, QueryInfo>
 
-export interface LiveQuery<TResult, TQueryInfo extends QueryInfo = QueryInfoNone> {
+export const TypeId = Symbol.for('LiveQuery')
+export type TypeId = typeof TypeId
+
+export interface LiveQuery<TResult, TQueryInfo extends QueryInfo = QueryInfo.None> {
   id: number
-  _tag: 'computed' | 'sql' | 'graphql'
+  _tag: 'computed' | 'db' | 'graphql'
+  [TypeId]: TypeId
 
   /** This should only be used on a type-level and doesn't hold any value during runtime */
   '__result!': TResult
@@ -64,8 +68,9 @@ export abstract class LiveStoreQueryBase<TResult, TQueryInfo extends QueryInfo>
   implements LiveQuery<TResult, TQueryInfo>
 {
   '__result!'!: TResult
-  id = queryIdCounter++
-  abstract _tag: 'computed' | 'sql' | 'graphql'
+  id = queryIdCounter++;
+  [TypeId]: TypeId = TypeId
+  abstract _tag: 'computed' | 'db' | 'graphql'
 
   /** Human-readable label for the query for debugging */
   abstract label: string

package/src/{reactiveQueries → live-queries}/computed.ts

@@ -1,4 +1,4 @@
-import type { QueryInfo, QueryInfoNone } from '@livestore/common'
+import type { QueryInfo } from '@livestore/common'
 import * as otel from '@opentelemetry/api'
 
 import { globalReactivityGraph } from '../global-state.js'
@@ -8,7 +8,7 @@ import { getDurationMsFromSpan } from '../utils/otel.js'
 import type { GetAtomResult, LiveQuery, QueryContext, ReactivityGraph } from './base-class.js'
 import { LiveStoreQueryBase, makeGetAtomResult } from './base-class.js'
 
-export const computed = <TResult, TQueryInfo extends QueryInfo = QueryInfoNone>(
+export const computed = <TResult, TQueryInfo extends QueryInfo = QueryInfo.None>(
   fn: (get: GetAtomResult) => TResult,
   options?: {
     label: string
@@ -16,14 +16,14 @@ export const computed = <TResult, TQueryInfo extends QueryInfo = QueryInfoNone>(
     queryInfo?: TQueryInfo
   },
 ): LiveQuery<TResult, TQueryInfo> =>
-  new LiveStoreJSQuery<TResult, TQueryInfo>({
+  new LiveStoreComputedQuery<TResult, TQueryInfo>({
     fn,
     label: options?.label ?? fn.toString(),
     reactivityGraph: options?.reactivityGraph,
     queryInfo: options?.queryInfo,
   })
 
-export class LiveStoreJSQuery<TResult, TQueryInfo extends QueryInfo = QueryInfoNone> extends LiveStoreQueryBase<
+export class LiveStoreComputedQuery<TResult, TQueryInfo extends QueryInfo = QueryInfo.None> extends LiveStoreQueryBase<
   TResult,
   TQueryInfo
 > {
@@ -38,31 +38,19 @@ export class LiveStoreJSQuery<TResult, TQueryInfo extends QueryInfo = QueryInfoN
 
   queryInfo: TQueryInfo
 
-  /**
-   * 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({
     fn,
     label,
-    onDestroy,
     reactivityGraph,
     queryInfo,
   }: {
     label: string
     fn: (get: GetAtomResult) => TResult
-    /** Currently only used for "nested destruction" of piped queries */
-    onDestroy?: () => void
     reactivityGraph?: ReactivityGraph
     queryInfo?: TQueryInfo
   }) {
     super()
 
-    this.onDestroy = onDestroy
     this.label = label
 
     this.reactivityGraph = reactivityGraph ?? globalReactivityGraph
@@ -86,23 +74,11 @@ export class LiveStoreJSQuery<TResult, TQueryInfo extends QueryInfo = QueryInfoN
 
           return res
         }),
-      { label: queryLabel, meta: { liveStoreThunkType: 'jsResults' } },
+      { label: queryLabel, meta: { liveStoreThunkType: 'computedResults' } },
     )
   }
 
-  // pipe = <U>(fn: (result: TResult, get: GetAtomResult) => U): LiveStoreJSQuery<U> =>
-  //   new LiveStoreJSQuery({
-  //     fn: (get) => {
-  //       const results = get(this.results$)
-  //       return fn(results, get)
-  //     },
-  //     label: `${this.label}:js`,
-  //     onDestroy: () => this.destroy(),
-  //     reactivityGraph: this.reactivityGraph,
-  //   })
-
   destroy = () => {
     this.reactivityGraph.destroyNode(this.results$)
-    this.onDestroy?.()
   }
 }

package/src/live-queries/db.test.ts

@@ -0,0 +1,153 @@
+import { Effect, Schema } from '@livestore/utils/effect'
+import * as otel from '@opentelemetry/api'
+import { BasicTracerProvider, InMemorySpanExporter, SimpleSpanProcessor } from '@opentelemetry/sdk-trace-base'
+import { describe, expect, it } from 'vitest'
+
+import { computed, queryDb, rawSqlMutation, sql } from '../index.js'
+import { makeTodoMvc, tables } from '../utils/tests/fixture.js'
+import { getSimplifiedRootSpan } from '../utils/tests/otel.js'
+
+/*
+TODO write tests for:
+
+- sql queries without and with `map` (incl. callback and schemas)
+- optional and explicit `queriedTables` argument
+*/
+
+describe('otel', () => {
+  let cachedProvider: BasicTracerProvider | undefined
+
+  const makeQuery = Effect.gen(function* () {
+    const exporter = new InMemorySpanExporter()
+
+    const provider = cachedProvider ?? new BasicTracerProvider()
+    cachedProvider = provider
+    provider.addSpanProcessor(new SimpleSpanProcessor(exporter))
+    provider.register()
+
+    const otelTracer = otel.trace.getTracer('test')
+
+    const span = otelTracer.startSpan('test')
+    const otelContext = otel.trace.setSpan(otel.context.active(), span)
+
+    const { store } = yield* makeTodoMvc({ otelTracer, otelContext })
+
+    return {
+      store,
+      otelTracer,
+      exporter,
+      span,
+      provider,
+    }
+  })
+
+  it('otel', async () => {
+    const { exporter } = await Effect.gen(function* () {
+      const { store, exporter, span } = yield* makeQuery
+
+      const query$ = queryDb({
+        query: `select * from todos`,
+        schema: Schema.Array(tables.todos.schema),
+        queriedTables: new Set(['todos']),
+      })
+      expect(query$.run()).toMatchInlineSnapshot('[]')
+
+      store.mutate(rawSqlMutation({ sql: sql`INSERT INTO todos (id, text, completed) VALUES ('t1', 'buy milk', 0)` }))
+
+      expect(query$.run()).toMatchInlineSnapshot(`
+      [
+        {
+          "completed": false,
+          "id": "t1",
+          "text": "buy milk",
+        },
+      ]
+    `)
+
+      query$.destroy()
+      span.end()
+
+      return { exporter }
+    }).pipe(Effect.scoped, Effect.tapCauseLogPretty, Effect.runPromise)
+
+    expect(getSimplifiedRootSpan(exporter)).toMatchSnapshot()
+  })
+
+  it('with thunks', async () => {
+    const { exporter } = await Effect.gen(function* () {
+      const { store, exporter, span } = yield* makeQuery
+
+      const defaultTodo = { id: '', text: '', completed: false }
+
+      const filter = computed(() => `where completed = 0`, { label: 'where-filter' })
+      const query$ = queryDb(
+        (get) => ({
+          query: `select * from todos ${get(filter)}`,
+          schema: Schema.Array(tables.todos.schema).pipe(Schema.headOrElse(() => defaultTodo)),
+        }),
+        { label: 'all todos' },
+      )
+
+      expect(query$.run()).toMatchInlineSnapshot(`
+      {
+        "completed": false,
+        "id": "",
+        "text": "",
+      }
+    `)
+
+      store.mutate(rawSqlMutation({ sql: sql`INSERT INTO todos (id, text, completed) VALUES ('t1', 'buy milk', 0)` }))
+
+      expect(query$.run()).toMatchInlineSnapshot(`
+      {
+        "completed": false,
+        "id": "t1",
+        "text": "buy milk",
+      }
+    `)
+
+      query$.destroy()
+      span.end()
+
+      return { exporter }
+    }).pipe(Effect.scoped, Effect.tapCauseLogPretty, Effect.runPromise)
+
+    expect(getSimplifiedRootSpan(exporter)).toMatchSnapshot()
+  })
+
+  it('with thunks with query builder and without labels', async () => {
+    const { exporter } = await Effect.gen(function* () {
+      const { store, exporter, span } = yield* makeQuery
+
+      const defaultTodo = { id: '', text: '', completed: false }
+
+      const filter = computed(() => ({ completed: false }))
+      const query$ = queryDb((get) => tables.todos.query.where(get(filter)).first({ fallback: () => defaultTodo }))
+
+      expect(query$.run()).toMatchInlineSnapshot(`
+      {
+        "completed": false,
+        "id": "",
+        "text": "",
+      }
+    `)
+
+      store.mutate(rawSqlMutation({ sql: sql`INSERT INTO todos (id, text, completed) VALUES ('t1', 'buy milk', 0)` }))
+
+      expect(query$.run()).toMatchInlineSnapshot(`
+      {
+        "completed": false,
+        "id": "t1",
+        "text": "buy milk",
+      }
+    `)
+
+      query$.destroy()
+      span.end()
+
+      return { exporter }
+    }).pipe(Effect.scoped, Effect.tapCauseLogPretty, Effect.runPromise)
+
+    expect(getSimplifiedRootSpan(exporter)).toMatchSnapshot()
+  })
+})