Support array form params for requestSnapshot/fetchSnapshot in TypeScript client

packages/typescript-client/src/client.ts

@@ -183,6 +183,9 @@ export async function resolveValue<T>(
 async function toInternalParams(
   params: ExternalParamsRecord<Row>
 ): Promise<InternalParamsRecord> {
+  if (params.params) {
+    params = { ...params, params: convertWhereParamsToObj(params.params) }
+  }
   const entries = Object.entries(params)
   const resolvedEntries = await Promise.all(
     entries.map(async ([key, value]) => {
@@ -851,9 +854,7 @@ export class ShapeStream<T extends Row<unknown> = Row>
     // Resolve headers and params in parallel
     const [requestHeaders, params] = await Promise.all([
       resolveHeaders(this.options.headers),
-      this.options.params
-        ? toInternalParams(convertWhereParamsToObj(this.options.params))
-        : undefined,
+      this.options.params ? toInternalParams(this.options.params) : undefined,
     ])
 
     // Validate params after resolution
@@ -937,7 +938,7 @@ export class ShapeStream<T extends Row<unknown> = Row>
         // Serialize params as JSON to keep the parameter name constant for proxy configs
         fetchUrl.searchParams.set(
           SUBSET_PARAM_WHERE_PARAMS,
-          JSON.stringify(subsetParams.params)
+          JSON.stringify(convertWhereParamsToObj(subsetParams.params))
         )
       if (subsetParams.limit)
         setQueryParam(fetchUrl, SUBSET_PARAM_LIMIT, subsetParams.limit)
@@ -1758,13 +1759,10 @@ function setQueryParam(
 }
 
 function convertWhereParamsToObj(
-  allPgParams: ExternalParamsRecord<Row>
-): ExternalParamsRecord<Row> {
-  if (Array.isArray(allPgParams.params)) {
-    return {
-      ...allPgParams,
-      params: Object.fromEntries(allPgParams.params.map((v, i) => [i + 1, v])),
-    }
+  whereParams: Record<`${number}`, string> | string[]
+): Record<`${number}`, string> {
+  if (Array.isArray(whereParams)) {
+    return Object.fromEntries(whereParams.map((v, i) => [i + 1, v]))
   }
-  return allPgParams
+  return whereParams
 }

packages/typescript-client/src/types.ts

@@ -91,7 +91,7 @@ export type SubsetParams = {
   /** Legacy string format WHERE clause */
   where?: string
   /** Positional parameter values for WHERE clause */
-  params?: Record<string, string>
+  params?: Record<`${number}`, string> | string[]
   /** Maximum number of rows to return */
   limit?: number
   /** Number of rows to skip */

packages/typescript-client/test/client.test.ts

@@ -1743,6 +1743,33 @@ describe.for(fetchAndSse)(
       expect(titles).toEqual([`three`, `two`])
     })
 
+    it(`requestSnapshot supports parametrised where clause in array form`, async ({
+      issuesTableUrl,
+      insertIssues,
+      aborter,
+    }) => {
+      await insertIssues({ title: `one` }, { title: `two` }, { title: `three` })
+
+      const shapeStream = new ShapeStream({
+        url: `${BASE_URL}/v1/shape`,
+        params: { table: issuesTableUrl },
+        log: `changes_only`,
+        liveSse,
+        signal: aborter.signal,
+      })
+      const _shape = new Shape(shapeStream)
+      await waitForFetch(shapeStream)
+
+      const { data } = await shapeStream.requestSnapshot({
+        where: `title = $1 OR title = $2`,
+        params: [`two`, `three`],
+        orderBy: `title ASC`,
+        limit: 100,
+      })
+      const titles = data.map((m) => m.value.title).sort()
+      expect(titles).toEqual([`three`, `two`])
+    })
+
     it(`requestSnapshot supports orderBy + limit`, async ({
       issuesTableUrl,
       insertIssues,
@@ -2180,6 +2207,16 @@ describe.for(fetchAndSse)(
         const paramTitles = paramData.map((m) => m.value.title).sort()
         expect(paramTitles).toEqual([`A`, `C`])
 
+        // Test with parametrised where clause (array form)
+        const { data: paramArrayData } = await shapeStream.fetchSnapshot({
+          where: `title = $1 OR title = $2`,
+          params: [`A`, `C`],
+          orderBy: `title ASC`,
+          limit: 100,
+        })
+        const paramArrayTitles = paramArrayData.map((m) => m.value.title).sort()
+        expect(paramArrayTitles).toEqual([`A`, `C`])
+
         // Test with orderBy + limit
         const { data: limitedData } = await shapeStream.fetchSnapshot({
           orderBy: `title DESC`,