@teleporthq/teleport-plugin-next-data-source 0.43.75 → 0.44.0

package/__tests__/null-filter-where.test.ts

@@ -0,0 +1,132 @@
+/* tslint:disable:function-constructor */
+import { generateDataSourceFetcherWithCore } from '../src/data-source-fetchers'
+
+/**
+ * A board's "No status" column lists the rows whose status is empty. The GUI
+ * sends that condition as `{ operand: '=', destination: null }` (and "has a
+ * status" as `'!='` + null), the one null shape every fetcher answers with
+ * `IS NULL` / `IS NOT NULL`. An operand the fetchers do not know is dropped
+ * with its null value — and a list whose only condition was dropped reads the
+ * whole table: every row in "No status", whose move button then overwrote the
+ * real statuses. Verdicts come from the SQL the executed route sends.
+ */
+
+interface Captured {
+  sql: string
+  params: unknown[]
+}
+
+const bootRoute = (type: 'teleport' | 'postgresql') => {
+  const dataSource = {
+    id: 'ds-1',
+    name: 'db',
+    type,
+    config:
+      type === 'teleport'
+        ? {
+            host: 'teleporthq.secrets.TELEPORT_DB_HOST',
+            port: 5432,
+            user: 'teleporthq.secrets.TELEPORT_DB_USER',
+            password: 'teleporthq.secrets.TELEPORT_DB_PASSWORD',
+            database: 'teleporthq.secrets.TELEPORT_DB_NAME',
+            selectedTables: {
+              team_events: { columns: [{ name: 'id' }, { name: 'priority' }] },
+            },
+          }
+        : { host: 'h', port: 5432, user: 'u', password: 'p', database: 'd' },
+  }
+  const code = generateDataSourceFetcherWithCore(dataSource as never, 'team_events', false, {})
+    .replace(
+      "import { Client, types as pgTypes } from 'pg'",
+      "const { Client, types: pgTypes } = require('pg')"
+    )
+    .replace(/^export default async function handler/m, 'async function handler')
+    .replace(/^export \{[^}]*\}\s*$/m, '')
+    .replace(/^export default \{[^}]*\}\s*$/m, '')
+    .concat('\nmodule.exports = { handler: handler }')
+
+  const captured: Captured[] = []
+  class FakeClient {
+    public async connect(): Promise<void> {
+      return
+    }
+    public async end(): Promise<void> {
+      return
+    }
+    public async query(sql: string, params: unknown[] = []): Promise<{ rows: any[] }> {
+      captured.push({ sql, params })
+      return { rows: [] }
+    }
+  }
+  const moduleObj: { exports: any } = { exports: {} }
+  new Function('require', 'module', 'exports', 'process', 'console', code)(
+    (name: string) => {
+      if (name === 'pg') {
+        return { Client: FakeClient }
+      }
+      throw new Error('unexpected require: ' + name)
+    },
+    moduleObj,
+    moduleObj.exports,
+    { env: {} },
+    { error: () => undefined, warn: () => undefined, log: () => undefined }
+  )
+
+  return async (filters: unknown): Promise<Captured> => {
+    captured.length = 0
+    let status = 0
+    const res = {
+      status(statusCode: number) {
+        status = statusCode
+        return this
+      },
+      json() {
+        return this
+      },
+      setHeader() {
+        return this
+      },
+    }
+    await moduleObj.exports.handler(
+      { method: 'GET', query: { filters: JSON.stringify(filters) }, headers: {} },
+      res
+    )
+    expect(status).toBe(200)
+    const select = captured.find((entry) => /FROM\s+"?team_events"?/i.test(entry.sql))
+    if (!select) {
+      throw new Error('the route never read team_events')
+    }
+    return select
+  }
+}
+
+// The domain → UIDL mapper's output for one condition in the inspector's group.
+const condition = (operand: string, destination: unknown = null) => [
+  {
+    type: 'group',
+    operator: 'and',
+    children: [{ type: 'condition', source: 'priority', destination, operand }],
+  },
+]
+
+describe.each(['teleport', 'postgresql'] as const)('the %s read route', (type) => {
+  const read = bootRoute(type)
+
+  it('answers "is empty" (= null) with IS NULL', async () => {
+    expect((await read(condition('='))).sql).toMatch(/WHERE\s+priority IS NULL/)
+  })
+
+  it('answers "is not empty" (!= null) with IS NOT NULL', async () => {
+    expect((await read(condition('!='))).sql).toMatch(/WHERE\s+priority IS NOT NULL/)
+  })
+
+  it('still binds a plain value as a parameter', async () => {
+    const select = await read(condition('=', 'high'))
+    expect(select.sql).toMatch(/WHERE\s+priority = \$1/)
+    expect(select.params).toEqual(expect.arrayContaining(['high']))
+  })
+
+  it('reads the whole table for an operand it does not know — why the mapper never sends one', async () => {
+    expect((await read(condition('is_null'))).sql).not.toMatch(/WHERE/)
+  })
+})

package/__tests__/pg-date-parser.test.ts

@@ -0,0 +1,73 @@
+/* tslint:disable:function-constructor */
+import { generateDataSourceFetcherWithCore } from '../src/data-source-fetchers'
+
+/**
+ * A Postgres DATE is a calendar day. node-pg reads it as midnight in the
+ * server's time zone, so a server east of UTC served `2026-10-09` as
+ * `2026-10-08T21:00:00.000Z`: the list showed the day before, and an edit form
+ * that loaded the row saved that day back. Every Postgres fetcher keeps the
+ * day as its own text; a stand-in driver without `types` still loads.
+ */
+
+type ParserSpy = Array<{ oid: number; parse: (value: string) => unknown }>
+
+const bootFetcher = (type: 'teleport' | 'postgresql', withTypes: boolean): ParserSpy => {
+  const dataSource = {
+    id: 'ds-1',
+    name: 'db',
+    type,
+    config:
+      type === 'teleport'
+        ? {
+            host: 'teleporthq.secrets.TELEPORT_DB_HOST',
+            port: 5432,
+            user: 'teleporthq.secrets.TELEPORT_DB_USER',
+            password: 'teleporthq.secrets.TELEPORT_DB_PASSWORD',
+            database: 'teleporthq.secrets.TELEPORT_DB_NAME',
+            selectedTables: { orders: { columns: [{ name: 'id' }, { name: 'due' }] } },
+          }
+        : { host: 'h', port: 5432, user: 'u', password: 'p', database: 'd' },
+  }
+  const code = generateDataSourceFetcherWithCore(dataSource as never, 'orders', false, {})
+  expect(code.startsWith("import { Client, types as pgTypes } from 'pg'")).toBe(true)
+  const runnable = code
+    .replace(
+      "import { Client, types as pgTypes } from 'pg'",
+      "const { Client, types: pgTypes } = require('pg')"
+    )
+    .replace(/^export default async function handler/m, 'async function handler')
+    .replace(/^export \{[^}]*\}\s*$/m, '')
+    .replace(/^export default \{[^}]*\}\s*$/m, '')
+  const registered: ParserSpy = []
+  const types = {
+    setTypeParser: (oid: number, parse: (value: string) => unknown) =>
+      registered.push({ oid, parse }),
+  }
+  new Function('require', 'module', 'exports', 'process', 'console', runnable)(
+    (name: string) => {
+      if (name === 'pg') {
+        return withTypes ? { Client: class {}, types } : { Client: class {} }
+      }
+      throw new Error('unexpected require: ' + name)
+    },
+    { exports: {} },
+    {},
+    { env: {} },
+    { error: () => undefined, warn: () => undefined, log: () => undefined }
+  )
+  return registered
+}
+
+describe.each(['teleport', 'postgresql'] as const)('%s fetcher DATE columns', (type) => {
+  it('keeps a DATE as the day it names', () => {
+    const registered = bootFetcher(type, true)
+    const date = registered.find(({ oid }) => oid === 1082)
+    expect(date).toBeDefined()
+    expect(date?.parse('2026-10-09')).toBe('2026-10-09')
+    expect(registered.map(({ oid }) => oid)).toEqual([1082])
+  })
+
+  it('loads with a driver that has no type registry', () => {
+    expect(bootFetcher(type, false)).toEqual([])
+  })
+})

package/__tests__/plain-list-sort.test.ts

@@ -182,7 +182,7 @@ describe('a plain list fetches with its repeater’s sort', () => {
   it('sends a sort bound to state, and refetches when the state changes', async () => {
     const code = squash(await runPlugin('state'))
     expect(code).toContain(
-      'sorts: JSON.stringify([{ field: sortBy.split("-")[0], order: sortBy.split("-")[1] }])'
+      'sorts: JSON.stringify([{ field: sortBy.split("-")?.[0], order: sortBy.split("-")?.[1] }])'
     )
     expect(code).toMatch(/\}\), \[sortBy\]\)\}/)
   })

package/__tests__/product-price-sort.ts

@@ -121,8 +121,8 @@ describe('the generated Postgres route', () => {
   it('keeps a plain-column ORDER BY to fall back to', () => {
     // If a database ever rejects the sub-select, the page must degrade to the
     // previous ordering rather than serve nothing.
-    expect(productsRoute).toContain('const usedDiscountAwareSort = orderBySql !== plainOrderBySql')
-    expect(productsRoute).toContain('if (!usedDiscountAwareSort) throw sortError')
+    expect(productsRoute).toContain('const usedRewrittenSort = orderBySql !== plainOrderBySql')
+    expect(productsRoute).toContain('if (!usedRewrittenSort) throw sortError')
     expect(productsRoute).toContain('baseSql + plainOrderBySql + sqlTail')
   })
 
@@ -227,6 +227,13 @@ describe('stable pagination', () => {
     expect(rowIdentityColumn({}, 'teleport_orders')).toBeNull()
   })
 
+  it('breaks ties on every listing a visitor sorts: the blog listing and the booking page too', () => {
+    // "Sort by reading time" ties every five-minute post, "by price" every
+    // item at the same price.
+    expect(rowIdentityColumn({}, 'teleport_blog_posts')).toBe('id')
+    expect(rowIdentityColumn({}, 'teleport_booking_items')).toBe('id')
+  })
+
   it('is applied to the real and the fallback ORDER BY, and to a single sort column', () => {
     for (const route of [
       generatePostgreSQLFetcher(PG_CONFIG, 'teleport_products'),
@@ -274,10 +281,8 @@ describe('the fetcher a generated storefront actually gets', () => {
   })
 
   it('keeps the plain-column fallback and the tiebreaker', () => {
-    expect(teleportProducts).toContain(
-      'const usedDiscountAwareSort = orderBySql !== plainOrderBySql'
-    )
-    expect(teleportProducts).toContain('if (!usedDiscountAwareSort) throw sortError')
+    expect(teleportProducts).toContain('const usedRewrittenSort = orderBySql !== plainOrderBySql')
+    expect(teleportProducts).toContain('if (!usedRewrittenSort) throw sortError')
     expect(teleportProducts).toContain('baseSql + plainOrderBySql + sqlTail')
     expect(teleportProducts).toContain('const rowOrderTiebreak = (fields, direction) =>')
     expect(teleportProducts).toMatch(/\$\{tiebreak\}/)

package/__tests__/range-control.test.ts

@@ -0,0 +1,159 @@
+import * as types from '@babel/types'
+import generator from '@babel/generator'
+import { ComponentStructure } from '@teleporthq/teleport-types'
+import { createNextArrayMapperPaginationPlugin } from '../src/pagination-plugin'
+import {
+  makeUidlNode,
+  makeWidgetComponentChunk,
+  RANGE_DRAWN_TEXT,
+  type RepeaterOptions,
+} from './_helpers/pagination-widget-fixture'
+
+type ControlOptions = Parameters<typeof makeWidgetComponentChunk>[0]
+
+const runPlugin = async (repeater: RepeaterOptions, controls: ControlOptions): Promise<string> => {
+  const chunk = makeWidgetComponentChunk(controls)
+  const structure: ComponentStructure = {
+    uidl: { name: 'TestComponent', node: makeUidlNode(repeater) },
+    chunks: [chunk],
+    dependencies: {},
+    options: { dataSources: {}, extractedResources: {} },
+  } as never
+  await createNextArrayMapperPaginationPlugin()(structure)
+  return generator(chunk.content as types.Node).code
+}
+
+const collapse = (code: string): string => code.replace(/\s+/g, ' ')
+
+const TOTAL_STATE = 'const [ds_0_total, setDs_0_total] = useState(null)'
+const DRAWN = `ds_0_total === null ? "${RANGE_DRAWN_TEXT}" :`
+const FROM_BY_PAGE = '(ds_0_total === 0 ? 0 : (ds_0_page - 1) * 20 + 1).toLocaleString("en-US")'
+const FROM_FIRST_ROW = '(ds_0_total === 0 ? 0 : 1).toLocaleString("en-US")'
+const TO = 'Math.min(ds_0_page * 20, ds_0_total).toLocaleString("en-US")'
+const TOTAL = 'ds_0_total.toLocaleString("en-US")'
+
+describe('pagination plugin — range control', () => {
+  it('fills the authored words with the page window in buttons mode', async () => {
+    const flat = collapse(await runPlugin({}, { controls: ['previous', 'range', 'next'] }))
+
+    // The total is a state of its own — `maxPages` cannot give it back — and
+    // the count effect fills both from the same response.
+    expect(flat).toContain(TOTAL_STATE)
+    expect(flat).toContain('setDs_0_maxPages(')
+    expect(flat).toContain('setDs_0_total(data.count)')
+
+    // The drawn text stays until the count has answered; then the template.
+    expect(flat).toContain(`${DRAWN} \`Showing \${${FROM_BY_PAGE}}–\${${TO}} of \${${TOTAL}}\``)
+    // The marker and template ride along, so the DOM carries the contract.
+    expect(flat).toContain('data-tq-pagination-control="range"')
+    expect(flat).toContain('data-tq-range-template=')
+  })
+
+  it('counts from the first row in an appending list and survives the mode pruning', async () => {
+    const flat = collapse(
+      await runPlugin(
+        { infiniteScroll: true, infiniteScrollLoadMore: true },
+        { controls: ['previous', 'range', 'load-more', 'next'] }
+      )
+    )
+
+    // Previous/Next are pruned for an appending list; the range is not.
+    expect(flat).not.toContain('thq-previous-elm')
+    expect(flat).not.toContain('thq-next-elm')
+    expect(flat).toContain('thq-load-more-elm')
+    expect(flat).toContain('data-tq-pagination-control="range"')
+
+    // Everything loaded so far: 1 .. min(pages × perPage, total).
+    expect(flat).toContain(`${DRAWN} \`Showing \${${FROM_FIRST_ROW}}–\${${TO}} of \${${TOTAL}}\``)
+    expect(flat).not.toContain(FROM_BY_PAGE)
+  })
+
+  it('is kept and wired beside a sentinel-driven infinite scroll too', async () => {
+    const flat = collapse(await runPlugin({ infiniteScroll: true }, { controls: ['range'] }))
+
+    expect(flat).toContain('ds_0_sentinelRef')
+    expect(flat).toContain(TOTAL_STATE)
+    expect(flat).toContain(FROM_FIRST_ROW)
+  })
+
+  it('survives numbered mode with the page window', async () => {
+    const flat = collapse(
+      await runPlugin(
+        { paginationMode: 'numbered' },
+        { controls: ['first', 'previous', 'pages', 'range', 'next', 'last'] }
+      )
+    )
+
+    expect(flat).toContain('ds_0_pageTokens.map(token =>')
+    expect(flat).toContain('data-tq-pagination-control="range"')
+    expect(flat).toContain(FROM_BY_PAGE)
+  })
+
+  it('reads the page off the combined state beside a search input', async () => {
+    const flat = collapse(
+      await runPlugin({ searchEnabled: true }, { controls: ['previous', 'range', 'next'] })
+    )
+
+    expect(flat).toContain(TOTAL_STATE)
+    expect(flat).toContain('setDs_0_total(data.count)')
+    expect(flat).toContain(
+      '(ds_0_total === 0 ? 0 : (ds_0_state.page - 1) * 20 + 1).toLocaleString("en-US")'
+    )
+    expect(flat).toContain('Math.min(ds_0_state.page * 20, ds_0_total).toLocaleString("en-US")')
+  })
+
+  it('reads a template the JSX printer escaped the braces of', async () => {
+    const flat = collapse(
+      await runPlugin(
+        {},
+        {
+          controls: ['range'],
+          rangeTemplate: 'Showing &#123;from&#125;–&#123;to&#125; of &#123;total&#125;',
+        }
+      )
+    )
+    expect(flat).not.toContain('`Showing &#123;')
+    expect(flat).toMatch(/`Showing \$\{[^`]*–\$\{[^`]*of \$\{[^`]*`/)
+  })
+
+  it('falls back to "{from}–{to} of {total}" when no template is authored', async () => {
+    const flat = collapse(await runPlugin({}, { controls: ['range'], rangeTemplate: null }))
+
+    expect(flat).not.toContain('data-tq-range-template')
+    expect(flat).toContain(`${DRAWN} \`\${${FROM_BY_PAGE}}–\${${TO}} of \${${TOTAL}}\``)
+  })
+
+  it('wires a range outside every widget to the mapper it names, wherever it sits', async () => {
+    // Placed BEFORE the provider — a toolbar above the list — so the
+    // container-ownership rule could never have reached it.
+    const flat = collapse(
+      await runPlugin(
+        { nodeId: 'mapper-1' },
+        { controls: ['previous', 'next'], standaloneRange: { forNodeId: 'mapper-1' } }
+      )
+    )
+
+    expect(flat).toContain('data-tq-pagination-for="mapper-1"')
+    expect(flat).toContain(TOTAL_STATE)
+    expect(flat).toContain(`${DRAWN} \`Showing \${${FROM_BY_PAGE}}–\${${TO}} of \${${TOTAL}}\``)
+  })
+
+  it('leaves a range naming a mapper this component does not render as drawn', async () => {
+    const flat = collapse(
+      await runPlugin(
+        { nodeId: 'mapper-1' },
+        { controls: ['previous', 'next'], standaloneRange: { forNodeId: 'someone-else' } }
+      )
+    )
+
+    expect(flat).toContain(`>${RANGE_DRAWN_TEXT}</div>`)
+    expect(flat).not.toContain('ds_0_total === null')
+  })
+
+  it('changes nothing for a component without a range control', async () => {
+    const flat = collapse(await runPlugin({}, { controls: ['previous', 'next'] }))
+
+    expect(flat).not.toContain('ds_0_total')
+    expect(flat).not.toContain('setDs_0_total')
+  })
+})

package/__tests__/search-input-marker.test.ts

@@ -0,0 +1,86 @@
+import * as types from '@babel/types'
+import generator from '@babel/generator'
+import { ComponentStructure } from '@teleporthq/teleport-types'
+import { createNextArrayMapperPaginationPlugin } from '../src/pagination-plugin'
+import {
+  makeMultiMapperUidl,
+  makeWidgetComponentChunk,
+  type RepeaterOptions,
+} from './_helpers/pagination-widget-fixture'
+
+type ControlOptions = Parameters<typeof makeWidgetComponentChunk>[0]
+
+/**
+ * A page's OWN search box, marked `data-tq-search-for` with its mapper's node
+ * id, is wired like the platform's `search-input`: controlled by the mapper's
+ * query state. It is paired by the id it names, never by its place among the
+ * platform inputs.
+ */
+
+const runPlugin = async (
+  repeaters: RepeaterOptions[],
+  controls: ControlOptions
+): Promise<string> => {
+  const chunk = makeWidgetComponentChunk(controls)
+  const structure: ComponentStructure = {
+    uidl: { name: 'TestComponent', node: makeMultiMapperUidl(repeaters) },
+    chunks: [chunk],
+    dependencies: {},
+    options: { dataSources: {}, extractedResources: {} },
+  } as never
+  await createNextArrayMapperPaginationPlugin()(structure)
+  return generator(chunk.content as types.Node).code
+}
+
+const collapse = (code: string): string => code.replace(/\s+/g, ' ')
+
+const wiredTo = (index: number): string =>
+  `onChange={e => setDs_${index}_searchQuery(e.target.value)} value={ds_${index}_searchQuery}`
+
+describe('pagination plugin — a page’s own search box', () => {
+  it('controls a marked input by the query of the mapper it names, and keeps Enter from submitting', async () => {
+    const flat = collapse(
+      await runPlugin([{ searchEnabled: true, nodeId: 'TQ_orders' }], {
+        controls: ['previous', 'next'],
+        standaloneSearch: [{ name: 'hm-search', forNodeId: 'TQ_orders' }],
+      })
+    )
+    expect(flat).toContain(`name="hm-search" data-tq-search-for="TQ_orders" ${wiredTo(0)}`)
+    expect(flat).toContain('onKeyDown={e => { if (e.key === "Enter") e.preventDefault(); }}')
+  })
+
+  it('pairs by the id named, whatever the order: the platform input keeps its place', async () => {
+    const flat = collapse(
+      await runPlugin(
+        [
+          { searchEnabled: true, nodeId: 'TQ_jobs' },
+          { searchEnabled: true, nodeId: 'TQ_orders' },
+        ],
+        {
+          controls: ['previous', 'next'],
+          mappers: 2,
+          standaloneSearch: [
+            { name: 'hm-search', forNodeId: 'TQ_orders' },
+            { name: 'platform-search' },
+          ],
+        }
+      )
+    )
+    // The marked box searches the second mapper; the platform box, first of its kind, the first.
+    expect(flat).toContain(`data-tq-search-for="TQ_orders" ${wiredTo(1)}`)
+    expect(flat).toContain(
+      `name="platform-search" className="products-list-search-input" ${wiredTo(0)}`
+    )
+  })
+
+  it('leaves a marked input alone when no search-enabled mapper carries its id', async () => {
+    const flat = collapse(
+      await runPlugin([{ searchEnabled: true, nodeId: 'TQ_orders' }], {
+        controls: ['previous', 'next'],
+        standaloneSearch: [{ name: 'hm-search', forNodeId: 'TQ_elsewhere' }],
+      })
+    )
+    expect(flat).toContain('name="hm-search" data-tq-search-for="TQ_elsewhere" />')
+    expect(flat).not.toContain('setDs_0_searchQuery(e.target.value)')
+  })
+})

package/__tests__/search-url-sync.test.ts

@@ -40,7 +40,7 @@ const makeComponentChunk = (): ChunkDefinition => {
 // A `data-source-list > cms-list-repeater` UIDL: a paginated + search-enabled
 // products list, optionally bound to a URL search-param key.
 // tslint:disable-next-line:no-any
-const makeUidlNode = (searchUrlParamKey?: string): any => ({
+const makeUidlNode = (searchUrlParamKey?: string, pageUrlParamKey?: string): any => ({
   type: 'data-source-list',
   content: {
     renderPropIdentifier: 'items',
@@ -60,6 +60,7 @@ const makeUidlNode = (searchUrlParamKey?: string): any => ({
           searchEnabled: true,
           searchDebounce: 300,
           ...(searchUrlParamKey ? { searchUrlParamKey } : {}),
+          ...(pageUrlParamKey ? { pageUrlParamKey } : {}),
           nodes: { list: { type: 'element', content: { elementType: 'div' } } },
         },
       },
@@ -67,10 +68,17 @@ const makeUidlNode = (searchUrlParamKey?: string): any => ({
   },
 })
 
-const runPlugin = async (searchUrlParamKey?: string, paginated = true): Promise<string> => {
+interface RunOptions {
+  paginated?: boolean
+  pageUrlParamKey?: string
+  infiniteScroll?: boolean
+}
+
+const runPlugin = async (searchUrlParamKey?: string, options: RunOptions = {}): Promise<string> => {
   const chunk = makeComponentChunk()
-  const node = makeUidlNode(searchUrlParamKey)
-  node.content.nodes.success.content.paginated = paginated
+  const node = makeUidlNode(searchUrlParamKey, options.pageUrlParamKey)
+  node.content.nodes.success.content.paginated = options.paginated ?? true
+  node.content.nodes.success.content.infiniteScroll = !!options.infiniteScroll
   const structure: ComponentStructure = {
     uidl: { name: 'TestComponent', node },
     chunks: [chunk],
@@ -108,19 +116,37 @@ describe('pagination plugin — search input URL two-way sync (searchUrlParamKey
     )
     expect(code).toContain('}, [ds_0_state.debouncedQuery, router.isReady])')
 
-    // Read-back (URL → input AND applied query at once, keeping the page),
-    // functional setState bail-out (loop-free), then the handshake flag.
+    // Read-back (URL → input AND applied query at once, from page 1: the page
+    // is not in the address), functional setState bail-out (loop-free), then
+    // the handshake flag.
     expect(code).toContain('const __urlValue = router.query.searchKeyword')
     expect(code).toContain('ds_0_adoptUrlSearch(prev => prev === __nextValue ? prev : __nextValue)')
     expect(code).toContain('ds_0_searchUrlAdopted.current = true')
     expect(code).toContain('}, [router.query.searchKeyword, router.isReady])')
     expect(code.replace(/\s+/g, ' ')).toContain(
-      'const ds_0_adoptUrlSearch = update => { setDs_0_searchQuery(update); setDs_0_state(state => { const next = update(state.debouncedQuery); return next === state.debouncedQuery ? state : { ...state, debouncedQuery: next }; }); };'
+      'const ds_0_adoptUrlSearch = update => { setDs_0_searchQuery(update); setDs_0_state(state => { const next = update(state.debouncedQuery); return next === state.debouncedQuery ? state : { ...state, page: 1, debouncedQuery: next }; }); };'
+    )
+  })
+
+  it('starts an appending list on page 1 when the address brings a query', async () => {
+    // The scroll sentinel has usually fetched page 2 before the router is
+    // ready: kept, the query's first answer was its page 2 — empty when only a
+    // few rows match.
+    const code = await runPlugin('q', { infiniteScroll: true })
+    expect(code.replace(/\s+/g, ' ')).toContain(
+      'return next === state.debouncedQuery ? state : { ...state, page: 1, debouncedQuery: next };'
+    )
+  })
+
+  it('keeps the page of a list whose page is in the address too', async () => {
+    const code = await runPlugin('searchKeyword', { pageUrlParamKey: 'page' })
+    expect(code.replace(/\s+/g, ' ')).toContain(
+      'return next === state.debouncedQuery ? state : { ...state, debouncedQuery: next };'
     )
   })
 
   it('adopts the address into both queries of a list without pages too', async () => {
-    const code = await runPlugin('searchKeyword', false)
+    const code = await runPlugin('searchKeyword', { paginated: false })
     expect(code).not.toContain('window.location.search')
     expect(code.replace(/\s+/g, ' ')).toContain(
       'const ds_0_adoptUrlSearch = update => { setDs_0_searchQuery(update); setDs_0_debouncedQuery(update); };'

package/__tests__/table-read-route-protected-tables.test.ts

@@ -62,7 +62,10 @@ function bootTableRoute(
   })
   // The route is an ES module; run it as a script with the same bindings.
   const code = esm
-    .replace("import { Client } from 'pg'", "const { Client } = require('pg')")
+    .replace(
+      "import { Client, types as pgTypes } from 'pg'",
+      "const { Client, types: pgTypes } = require('pg')"
+    )
     .replace(/^export default async function handler/m, 'async function handler')
     .replace(/^export \{[^}]*\}\s*$/m, '')
     .replace(/^export default \{[^}]*\}\s*$/m, '')
@@ -436,7 +439,7 @@ describe('buildProductTransformOptions — the roles reach the emitted module',
 })
 
 describe('resolveTrustedReaderRoles', () => {
-  it('reads the roles off the admin folder and the admin pages, and nothing else', () => {
+  it("reads the roles off the admin folder, never off one admin page's own roles", () => {
     const roles = TableAccess.resolveTrustedReaderRoles({
       enabled: true,
       dataSourceId: 'ds-1',
@@ -487,7 +490,34 @@ describe('resolveTrustedReaderRoles', () => {
       envKeys: {},
       customUserProperties: [],
     })
-    expect(roles).toEqual(['admin', 'staff'])
+    // `staff` opens `/admin/orders` only: a page's role is no reader of every
+    // protected table (an admin page may also admit staff).
+    expect(roles).toEqual(['admin'])
     expect(TableAccess.resolveTrustedReaderRoles(undefined)).toEqual([])
   })
+
+  it('refuses staff admitted to some admin pages the accounts table on its read route', async () => {
+    const staffPagesAuth: UIDLAuthentication = {
+      ...ADMIN_PANEL_AUTH,
+      roles: ['admin', 'staff', 'user'],
+      pageProtection: {
+        dashboard: {
+          requiresAuth: true,
+          allowedRoles: ['admin', 'staff'],
+          pageName: 'dashboard',
+          route: '/admin/dashboard',
+        },
+        tasks: {
+          requiresAuth: true,
+          allowedRoles: ['admin', 'staff'],
+          pageName: 'tasks',
+          route: '/admin/tasks',
+        },
+      },
+    }
+    const options = buildProductTransformOptions({ authentication: staffPagesAuth })
+    const users = bootTableRoute('users', options.trustedReaderRoles || [])
+    expect((await users({ handler: 'handler', session: { role: 'staff' } })).status).toBe(403)
+    expect((await users({ handler: 'handler', session: { role: 'admin' } })).status).toBe(200)
+  })
 })

package/dist/cjs/count-effect.d.ts

@@ -19,6 +19,12 @@ interface CountEffectOptions {
     perPage: number;
     /** Name of the `setDs_N_maxPages` setter. */
     setMaxPagesVar: string;
+    /**
+     * Name of the `setDs_N_total` setter, declared only when the component draws
+     * a `range` control ("Showing 1–8 of 12"): the page count alone cannot say
+     * how many rows there are.
+     */
+    setTotalVar?: string;
     /**
      * Params sent to the count endpoint: the search query (when the list has
      * one), `queryColumns`, and the filter array. Built by the caller because
@@ -38,7 +44,7 @@ interface CountEffectOptions {
 }
 /** `const ds_N_countSeq = useRef(0)` */
 export declare const buildCountSeqDeclaration: (countSeqRefVar: string) => types.Statement;
-export declare const buildCountFetchStatement: (options: Pick<CountEffectOptions, 'fileName' | 'perPage' | 'setMaxPagesVar' | 'urlParams' | 'countSeqRefVar'>) => types.Statement;
+export declare const buildCountFetchStatement: (options: Pick<CountEffectOptions, 'fileName' | 'perPage' | 'setMaxPagesVar' | 'setTotalVar' | 'urlParams' | 'countSeqRefVar'>) => types.Statement;
 /**
  * The whole `useEffect(...)` wrapper.
  *

package/dist/cjs/count-effect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"count-effect.d.ts","sourceRoot":"","sources":["../../src/count-effect.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,cAAc,CAAA;AAErC;;;;;;;;;;;;GAYG;AAEH,UAAU,kBAAkB;IAC1B,qDAAqD;IACrD,QAAQ,EAAE,MAAM,CAAA;IAChB,mEAAmE;IACnE,OAAO,EAAE,MAAM,CAAA;IACf,6CAA6C;IAC7C,cAAc,EAAE,MAAM,CAAA;IACtB;;;;OAIG;IACH,SAAS,EAAE,KAAK,CAAC,cAAc,EAAE,CAAA;IACjC,iDAAiD;IACjD,IAAI,EAAE,KAAK,CAAC,UAAU,EAAE,CAAA;IACxB;;;;;;OAMG;IACH,cAAc,EAAE,MAAM,CAAA;CACvB;AAED,wCAAwC;AACxC,eAAO,MAAM,wBAAwB,mBAAoB,MAAM,KAAG,MAAM,SAMpE,CAAA;AAqDJ,eAAO,MAAM,wBAAwB,YAC1B,KACP,kBAAkB,EAClB,UAAU,GAAG,SAAS,GAAG,gBAAgB,GAAG,WAAW,GAAG,gBAAgB,CAC3E,KACA,MAAM,SA2DN,CAAA;AAEH;;;;;;;GAOG;AACH,eAAO,MAAM,qBAAqB,YAAa,kBAAkB,KAAG,MAAM,mBAYvE,CAAA"}
+{"version":3,"file":"count-effect.d.ts","sourceRoot":"","sources":["../../src/count-effect.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,cAAc,CAAA;AAErC;;;;;;;;;;;;GAYG;AAEH,UAAU,kBAAkB;IAC1B,qDAAqD;IACrD,QAAQ,EAAE,MAAM,CAAA;IAChB,mEAAmE;IACnE,OAAO,EAAE,MAAM,CAAA;IACf,6CAA6C;IAC7C,cAAc,EAAE,MAAM,CAAA;IACtB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,SAAS,EAAE,KAAK,CAAC,cAAc,EAAE,CAAA;IACjC,iDAAiD;IACjD,IAAI,EAAE,KAAK,CAAC,UAAU,EAAE,CAAA;IACxB;;;;;;OAMG;IACH,cAAc,EAAE,MAAM,CAAA;CACvB;AAED,wCAAwC;AACxC,eAAO,MAAM,wBAAwB,mBAAoB,MAAM,KAAG,MAAM,SAMpE,CAAA;AA4EJ,eAAO,MAAM,wBAAwB,YAC1B,KACP,kBAAkB,EAClB,UAAU,GAAG,SAAS,GAAG,gBAAgB,GAAG,aAAa,GAAG,WAAW,GAAG,gBAAgB,CAC3F,KACA,MAAM,SAqDN,CAAA;AAEH;;;;;;;GAOG;AACH,eAAO,MAAM,qBAAqB,YAAa,kBAAkB,KAAG,MAAM,mBAYvE,CAAA"}