@electric-sql/client 1.2.1 → 1.3.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@electric-sql/client",
   "description": "Postgres everywhere - your data, in sync, wherever you need it.",
-  "version": "1.2.1",
+  "version": "1.3.0",
   "author": "ElectricSQL team and contributors.",
   "bugs": {
     "url": "https://github.com/electric-sql/electric/issues"

package/src/client.ts

@@ -7,9 +7,14 @@ import {
   GetExtensions,
   ChangeMessage,
   SnapshotMetadata,
+  SubsetParams,
 } from './types'
 import { MessageParser, Parser, TransformFunction } from './parser'
-import { ColumnMapper, encodeWhereClause } from './column-mapper'
+import {
+  ColumnMapper,
+  encodeWhereClause,
+  quoteIdentifier,
+} from './column-mapper'
 import { getOffset, isUpToDateMessage, isChangeMessage } from './helpers'
 import {
   FetchError,
@@ -128,14 +133,6 @@ export type ExternalParamsRecord<T extends Row<unknown> = Row> = {
   [K in string]: ParamValue | undefined
 } & Partial<PostgresParams<T>> & { [K in ReservedParamKeys]?: never }
 
-export type SubsetParams = {
-  where?: string
-  params?: Record<string, string>
-  limit?: number
-  offset?: number
-  orderBy?: string
-}
-
 type ReservedParamKeys =
   | typeof LIVE_CACHE_BUSTER_QUERY_PARAM
   | typeof SHAPE_HANDLE_QUERY_PARAM
@@ -727,7 +724,6 @@ export class ShapeStream<T extends Row<unknown> = Row>
   async #requestShape(): Promise<void> {
     if (this.#state === `pause-requested`) {
       this.#state = `paused`
-
       return
     }
 
@@ -855,8 +851,27 @@ export class ShapeStream<T extends Row<unknown> = Row>
         )
         setQueryParam(fetchUrl, WHERE_QUERY_PARAM, encodedWhere)
       }
-      if (params.columns)
-        setQueryParam(fetchUrl, COLUMNS_QUERY_PARAM, params.columns)
+      if (params.columns) {
+        // Get original columns array from options (before toInternalParams converted to string)
+        const originalColumns = await resolveValue(this.options.params?.columns)
+        if (Array.isArray(originalColumns)) {
+          // Apply columnMapper encoding if present
+          let encodedColumns = originalColumns.map(String)
+          if (this.options.columnMapper) {
+            encodedColumns = encodedColumns.map(
+              this.options.columnMapper.encode
+            )
+          }
+          // Quote each column name to handle special characters (commas, etc.)
+          const serializedColumns = encodedColumns
+            .map(quoteIdentifier)
+            .join(`,`)
+          setQueryParam(fetchUrl, COLUMNS_QUERY_PARAM, serializedColumns)
+        } else {
+          // Fallback: columns was already a string
+          setQueryParam(fetchUrl, COLUMNS_QUERY_PARAM, params.columns)
+        }
+      }
       if (params.replica) setQueryParam(fetchUrl, REPLICA_PARAM, params.replica)
       if (params.params)
         setQueryParam(fetchUrl, WHERE_PARAMS_PARAM, params.params)
@@ -1236,6 +1251,13 @@ export class ShapeStream<T extends Row<unknown> = Row>
       this.#started &&
       (this.#state === `paused` || this.#state === `pause-requested`)
     ) {
+      // Don't resume if the user's signal is already aborted
+      // This can happen if the signal was aborted while we were paused
+      // (e.g., TanStack DB collection was GC'd)
+      if (this.options.signal?.aborted) {
+        return
+      }
+
       // If we're resuming from pause-requested state, we need to set state back to active
       // to prevent the pause from completing
       if (this.#state === `pause-requested`) {
@@ -1457,6 +1479,7 @@ export class ShapeStream<T extends Row<unknown> = Row>
 
       const dataWithEndBoundary = (data as Array<Message<T>>).concat([
         { headers: { control: `snapshot-end`, ...metadata } },
+        { headers: { control: `subset-end`, ...opts } },
       ])
 
       this.#snapshotTracker.addSnapshot(

package/src/column-mapper.ts

@@ -3,6 +3,31 @@ import { Schema } from './types'
 type DbColumnName = string
 type AppColumnName = string
 
+/**
+ * Quote a PostgreSQL identifier for safe use in query parameters.
+ *
+ * Wraps the identifier in double quotes and escapes any internal
+ * double quotes by doubling them. This ensures identifiers with
+ * special characters (commas, spaces, etc.) are handled correctly.
+ *
+ * @param identifier - The identifier to quote
+ * @returns The quoted identifier
+ *
+ * @example
+ * ```typescript
+ * quoteIdentifier('user_id')        // '"user_id"'
+ * quoteIdentifier('foo,bar')        // '"foo,bar"'
+ * quoteIdentifier('has"quote')      // '"has""quote"'
+ * ```
+ *
+ * @internal
+ */
+export function quoteIdentifier(identifier: string): string {
+  // Escape internal double quotes by doubling them
+  const escaped = identifier.replace(/"/g, `""`)
+  return `"${escaped}"`
+}
+
 /**
  * A bidirectional column mapper that handles transforming column **names**
  * between database format (e.g., snake_case) and application format (e.g., camelCase).

package/src/fetch.ts

@@ -221,7 +221,7 @@ export function createFetchWithChunkBuffer(
 ): typeof fetch {
   const { maxChunksToPrefetch } = prefetchOptions
 
-  let prefetchQueue: PrefetchQueue
+  let prefetchQueue: PrefetchQueue | undefined
 
   const prefetchClient = async (...args: Parameters<typeof fetchClient>) => {
     const url = args[0].toString()
@@ -233,7 +233,10 @@ export function createFetchWithChunkBuffer(
       return prefetchedRequest
     }
 
+    // Clear the prefetch queue after aborting to prevent returning
+    // stale/aborted requests on future calls with the same URL
     prefetchQueue?.abort()
+    prefetchQueue = undefined
 
     // perform request and fire off prefetch queue if request is eligible
     const response = await fetchClient(...args)
@@ -340,16 +343,24 @@ class PrefetchQueue {
 
   abort(): void {
     this.#prefetchQueue.forEach(([_, aborter]) => aborter.abort())
+    this.#prefetchQueue.clear()
   }
 
   consume(...args: Parameters<typeof fetch>): Promise<Response> | void {
     const url = args[0].toString()
 
-    const request = this.#prefetchQueue.get(url)?.[0]
+    const entry = this.#prefetchQueue.get(url)
     // only consume if request is in queue and is the queue "head"
     // if request is in the queue but not the head, the queue is being
     // consumed out of order and should be restarted
-    if (!request || url !== this.#queueHeadUrl) return
+    if (!entry || url !== this.#queueHeadUrl) return
+
+    const [request, aborter] = entry
+    // Don't return aborted requests - they will reject with AbortError
+    if (aborter.signal.aborted) {
+      this.#prefetchQueue.delete(url)
+      return
+    }
     this.#prefetchQueue.delete(url)
 
     // fire off new prefetch since request has been consumed

package/src/helpers.ts

@@ -66,11 +66,9 @@ export function isUpToDateMessage<T extends Row<unknown> = Row>(
  * If we are not in SSE mode this function will return undefined.
  */
 export function getOffset(message: ControlMessage): Offset | undefined {
+  if (message.headers.control != `up-to-date`) return
   const lsn = message.headers.global_last_seen_lsn
-  if (!lsn) {
-    return
-  }
-  return `${lsn}_0` as Offset
+  return lsn ? (`${lsn}_0` as Offset) : undefined
 }
 
 /**

package/src/types.ts

@@ -68,6 +68,14 @@ export type MoveTag = string
  */
 export type MoveOutPattern = { pos: number; value: string }
 
+export type SubsetParams = {
+  where?: string
+  params?: Record<string, string>
+  limit?: number
+  offset?: number
+  orderBy?: string
+}
+
 export type ControlMessage = {
   headers:
     | (Header & {
@@ -75,6 +83,7 @@ export type ControlMessage = {
         global_last_seen_lsn?: string
       })
     | (Header & { control: `snapshot-end` } & PostgresSnapshot)
+    | (Header & { control: `subset-end` } & SubsetParams)
 }
 
 export type EventMessage = {