@teleporthq/teleport-plugin-next-data-source 0.43.42 → 0.43.46

package/src/data-source-fetchers.ts

@@ -1,4 +1,4 @@
-import { DataSourceType, UIDLDataSource } from '@teleporthq/teleport-types'
+import { DataSourceType, UIDLDataSource, UIDLEcommerceCategory } from '@teleporthq/teleport-types'
 import {
   generatePostgreSQLFetcher,
   generateMySQLFetcher,
@@ -78,7 +78,11 @@ export const getDataSourceDependencies = (
   return dependencyMap[type]
 }
 
-export function generateDataSourceFetcher(dataSource: UIDLDataSource, tableName: string): string {
+export function generateDataSourceFetcher(
+  dataSource: UIDLDataSource,
+  tableName: string,
+  categories?: UIDLEcommerceCategory[]
+): string {
   if (!dataSource || typeof dataSource !== 'object') {
     throw new Error('Invalid data source: data source must be a valid object')
   }
@@ -233,7 +237,7 @@ export function generateDataSourceFetcher(dataSource: UIDLDataSource, tableName:
         if (!validation.isValid) {
           throw new Error(`Teleport config validation failed: ${validation.error}`)
         }
-        return generateTeleportFetcher(config, tableName)
+        return generateTeleportFetcher(config, tableName, categories)
       }
 
       default:
@@ -253,9 +257,10 @@ export function generateDataSourceFetcher(dataSource: UIDLDataSource, tableName:
 export function generateDataSourceFetcherWithCore(
   dataSource: UIDLDataSource,
   tableName: string,
-  isApiRoute: boolean = false
+  isApiRoute: boolean = false,
+  categories?: UIDLEcommerceCategory[]
 ): string {
-  const apiHandler = generateDataSourceFetcher(dataSource, tableName)
+  const apiHandler = generateDataSourceFetcher(dataSource, tableName, categories)
 
   // Extract the handler function body from the API route
   // The API route is structured as: export default async function handler(req, res) { ... }

package/src/fetchers/postgresql.ts

@@ -75,6 +75,12 @@ const processFilters = (filters, conditions, queryParams, paramIndex) => {
       
       if (Array.isArray(value)) {
         if (value.length === 0) return
+        if (operand === 'array_overlap') {
+          conditions.push(\`jsonb_exists_any(NULLIF(\${field}, '')::jsonb, $\${paramIndex}::text[])\`)
+          queryParams.push(value.map((entry) => String(entry)))
+          paramIndex++
+          return
+        }
         const placeholders = value.map(() => \`$\${paramIndex++}\`)
         queryParams.push(...value)
         if (operand === '!=') {
@@ -83,6 +89,17 @@ const processFilters = (filters, conditions, queryParams, paramIndex) => {
           conditions.push(\`\${field} IN (\${placeholders.join(', ')})\`)
         }
       } else {
+        if (operand === 'array_overlap') {
+          if (value === '' || value === null || value === undefined) return
+          // A single comma-joined string (the multi-select Category Filter's
+          // ?categoryFilter=a,b,c) expands to multiple ids; one id stays one.
+          const overlapValues = String(value).split(',').map((entry) => entry.trim()).filter(Boolean)
+          if (overlapValues.length === 0) return
+          conditions.push(\`jsonb_exists_any(NULLIF(\${field}, '')::jsonb, $\${paramIndex}::text[])\`)
+          queryParams.push(overlapValues)
+          paramIndex++
+          return
+        }
         if (value === null) {
           if (operand === '=') {
             conditions.push(\`\${field} IS NULL\`)

package/src/fetchers/teleport.ts

@@ -1,3 +1,4 @@
+import type { UIDLEcommerceCategory } from '@teleporthq/teleport-types'
 import {
   replaceSecretReference,
   generateDateFormatterCode,
@@ -50,7 +51,8 @@ export const validateTeleportConfig = (
 
 export const generateTeleportFetcher = (
   config: Record<string, unknown>,
-  tableName: string
+  tableName: string,
+  categories?: UIDLEcommerceCategory[]
 ): string => {
   const dbConfig = config as TeleportDBConfig
   const schema = dbConfig.options?.schema
@@ -140,7 +142,7 @@ const getClient = () => {
 ${generateSafeJSONParseCode()}
 
 ${generateSearchEscapeHelpersCode()}
-${getTransformationCode(tableName)}
+${getTransformationCode(tableName, categories)}
 ${getTransformWrapperCode(tableName)}
 const processFilters = (filters, conditions, queryParams, paramIndex) => {
   if (!filters) return paramIndex
@@ -157,6 +159,15 @@ const processFilters = (filters, conditions, queryParams, paramIndex) => {
       
       if (Array.isArray(value)) {
         if (value.length === 0) return
+        if (operand === 'array_overlap') {
+          // Row column is a JSON array (e.g. category_ids). Match when it
+          // shares any element with the destination set. jsonb ?| (function
+          // form) avoids the '?' placeholder-token ambiguity some drivers hit.
+          conditions.push(\`jsonb_exists_any(NULLIF(\${field}, '')::jsonb, $\${paramIndex}::text[])\`)
+          queryParams.push(value.map((entry) => String(entry)))
+          paramIndex++
+          return
+        }
         const placeholders = value.map(() => \`$\${paramIndex++}\`)
         queryParams.push(...value)
         if (operand === '!=') {
@@ -165,6 +176,17 @@ const processFilters = (filters, conditions, queryParams, paramIndex) => {
           conditions.push(\`\${field} IN (\${placeholders.join(', ')})\`)
         }
       } else {
+        if (operand === 'array_overlap') {
+          if (value === '' || value === null || value === undefined) return
+          // A single comma-joined string (the multi-select Category Filter's
+          // ?categoryFilter=a,b,c) expands to multiple ids; one id stays one.
+          const overlapValues = String(value).split(',').map((entry) => entry.trim()).filter(Boolean)
+          if (overlapValues.length === 0) return
+          conditions.push(\`jsonb_exists_any(NULLIF(\${field}, '')::jsonb, $\${paramIndex}::text[])\`)
+          queryParams.push(overlapValues)
+          paramIndex++
+          return
+        }
         if (value === null) {
           if (operand === '=') {
             conditions.push(\`\${field} IS NULL\`)
@@ -364,9 +386,22 @@ export default async function handler(req, res) {
         : ''
     }
 
+    // Stamp each row with a globally-correct 1-based \`__rowNumber\` (the page
+    // offset is applied server-side above), so list index columns keep counting
+    // across pages instead of restarting at 1. Renderer-internal field — it is
+    // filtered from ordinary field bindings and only read by the index column.
+    const __finalData = ${getTransformExpression(tableName) ? 'transformedData' : 'safeData'}
+    const __rowNumberStart = (typeof offsetValue === 'number' && !isNaN(offsetValue)) ? offsetValue : 0
+    const __numberedData = Array.isArray(__finalData)
+      ? __finalData.map((__row, __i) =>
+          __row && typeof __row === 'object' && !Array.isArray(__row)
+            ? Object.assign({}, __row, { __rowNumber: __rowNumberStart + __i + 1 })
+            : __row)
+      : __finalData
+
     return res.status(200).json({
       success: true,
-      data: ${getTransformExpression(tableName) ? 'transformedData' : 'safeData'},
+      data: __numberedData,
       timestamp: Date.now()
     })
   } catch (error) {

package/src/filter-utils.ts

@@ -12,27 +12,54 @@ const buildFilterEntry = (
     types.objectProperty(types.identifier('operand'), types.stringLiteral(operand)),
   ])
 
-// Predicate `(__f) => __f.destination !== '' && __f.destination !== null && __f.destination !== undefined`
+// Predicate:
+//   (__f) => __f.destination !== '' && __f.destination !== null &&
+//            __f.destination !== undefined &&
+//            !(Array.isArray(__f.destination) && __f.destination.filter(Boolean).length === 0)
 // Used at runtime to drop filter conditions whose destination resolves to an
 // empty value. Keeps the page generic: state-bound filters (e.g.
 // `selectedCategory === ''` after picking "All Categories") and url-bound
 // filters (e.g. no `?categoryFilter=` in URL → `router?.query?.categoryFilter`
 // is `undefined`) both fall away cleanly instead of being sent to the API as
 // `destination: ''`, which the SQL backend interprets as a literal empty
-// string and returns zero rows.
+// string and returns zero rows. The array clause covers array-overlap filters
+// (e.g. category `CATEGORY_DESCENDANTS[selectedCategory] || []`) whose "All"
+// reset resolves to `[]` — an empty overlap set must mean "no filter", not
+// "match nothing".
 const buildNonEmptyDestinationPredicate = (): types.ArrowFunctionExpression => {
   const f = types.identifier('__f')
   const dest = types.memberExpression(f, types.identifier('destination'))
+  const isEmptyArray = types.logicalExpression(
+    '&&',
+    types.callExpression(
+      types.memberExpression(types.identifier('Array'), types.identifier('isArray')),
+      [dest]
+    ),
+    types.binaryExpression(
+      '===',
+      types.memberExpression(
+        types.callExpression(types.memberExpression(dest, types.identifier('filter')), [
+          types.identifier('Boolean'),
+        ]),
+        types.identifier('length')
+      ),
+      types.numericLiteral(0)
+    )
+  )
   return types.arrowFunctionExpression(
     [f],
     types.logicalExpression(
       '&&',
       types.logicalExpression(
         '&&',
-        types.binaryExpression('!==', dest, types.stringLiteral('')),
-        types.binaryExpression('!==', dest, types.nullLiteral())
+        types.logicalExpression(
+          '&&',
+          types.binaryExpression('!==', dest, types.stringLiteral('')),
+          types.binaryExpression('!==', dest, types.nullLiteral())
+        ),
+        types.binaryExpression('!==', dest, types.identifier('undefined'))
       ),
-      types.binaryExpression('!==', dest, types.identifier('undefined'))
+      types.unaryExpression('!', isEmptyArray)
     )
   )
 }

package/src/index.ts

@@ -606,7 +606,8 @@ export const createNextPagesDataSourcePlugin: ComponentPluginFactory<{}> = () =>
           options.extractedResources,
           dependencies,
           dynamicRouteAttr,
-          uidl.outputOptions?.folderPath
+          uidl.outputOptions?.folderPath,
+          options.ecommerceSettings?.categories
         )
 
         if (result.success && result.chunk) {
@@ -643,7 +644,8 @@ export const createNextPagesDataSourcePlugin: ComponentPluginFactory<{}> = () =>
           dataSourceNode,
           dataSources,
           componentChunk,
-          options.extractedResources
+          options.extractedResources,
+          options.ecommerceSettings?.categories
         )
       }
     })
@@ -1253,7 +1255,8 @@ export const createNextComponentDataSourcePlugin: ComponentPluginFactory<{}> = (
         dataSourceNode,
         dataSources,
         componentChunk,
-        options.extractedResources
+        options.extractedResources,
+        options.ecommerceSettings?.categories
       )
     })
 
@@ -1337,7 +1340,9 @@ export const createNextComponentDataSourcePlugin: ComponentPluginFactory<{}> = (
           try {
             const fetcherCode = generateDataSourceFetcherWithCore(
               dataSource,
-              firstDataSourceInfo.tableName
+              firstDataSourceInfo.tableName,
+              false,
+              options.ecommerceSettings?.categories
             )
             options.extractedResources[`utils/${fileName}`] = {
               fileName,

package/src/pagination-plugin.ts

@@ -3,6 +3,7 @@ import {
   ComponentPluginFactory,
   ChunkType,
   FileType,
+  UIDLEcommerceCategory,
 } from '@teleporthq/teleport-types'
 import * as types from '@babel/types'
 import { parseExpression } from '@babel/parser'
@@ -642,7 +643,6 @@ function getStateVarsForUsage(usage: DataSourceUsage): {
   combinedStateVar: string
   setCombinedStateVar: string
   skipDebounceRefVar: string
-  skipCountFetchRefVar: string
   propsPrefix: string
 } {
   const idx = usage.index
@@ -659,7 +659,6 @@ function getStateVarsForUsage(usage: DataSourceUsage): {
     combinedStateVar: `ds_${idx}_state`,
     setCombinedStateVar: `setDs_${idx}_state`,
     skipDebounceRefVar: `ds_${idx}_skipDebounce`,
-    skipCountFetchRefVar: `ds_${idx}_skipCountFetch`,
     propsPrefix: `${usage.dataSourceIdentifier}_ds_${idx}`,
   }
 }
@@ -843,19 +842,6 @@ export const createNextArrayMapperPaginationPlugin: ComponentPluginFactory<{}> =
           ])
         )
 
-        // Only add skipCountFetchRef for pages (where we have server-side count)
-        // For components, we need to fetch count on mount
-        if (isPage) {
-          stateDeclarations.push(
-            types.variableDeclaration('const', [
-              types.variableDeclarator(
-                types.identifier(vars.skipCountFetchRefVar),
-                types.callExpression(types.identifier('useRef'), [types.booleanLiteral(true)])
-              ),
-            ])
-          )
-        }
-
         // maxPages state
         const maxPagesInit = isPage
           ? types.logicalExpression(
@@ -1049,30 +1035,14 @@ export const createNextArrayMapperPaginationPlugin: ComponentPluginFactory<{}> =
         // Build the count fetch effect body
         const countFetchEffectBody: types.Statement[] = []
 
-        // Only add skip-on-mount check for pages (where we have server-side count)
-        if (isPage) {
-          countFetchEffectBody.push(
-            types.ifStatement(
-              types.memberExpression(
-                types.identifier(vars.skipCountFetchRefVar),
-                types.identifier('current')
-              ),
-              types.blockStatement([
-                types.expressionStatement(
-                  types.assignmentExpression(
-                    '=',
-                    types.memberExpression(
-                      types.identifier(vars.skipCountFetchRefVar),
-                      types.identifier('current')
-                    ),
-                    types.booleanLiteral(false)
-                  )
-                ),
-                types.returnStatement(),
-              ])
-            )
-          )
-        }
+        // Refresh the count on mount (no skip-on-mount guard). Pages seed maxPages
+        // from the build-time `getStaticProps` count, but that snapshot goes stale:
+        // rows added AFTER the build (e.g. the normalized product_variants table,
+        // which is seeded/grows past one page during store generation) are not
+        // reflected, so a frozen maxPages of 0/1 leaves "Next" permanently disabled
+        // on data-heavy tables. Re-fetching the live count on mount corrects
+        // maxPages so pagination tracks the real row count. The effect still runs
+        // when the search query or a filter changes (see deps below).
 
         // Add the fetch call
         countFetchEffectBody.push(
@@ -1568,7 +1538,12 @@ export const createNextArrayMapperPaginationPlugin: ComponentPluginFactory<{}> =
       }
 
       // Create API route for all categories (including 'plain' for components)
-      ensureAPIRouteExists(options.extractedResources, usage, options.dataSources)
+      ensureAPIRouteExists(
+        options.extractedResources,
+        usage,
+        options.dataSources,
+        options.ecommerceSettings?.categories
+      )
     })
 
     // STEP 3.5: Handle DataProviders WITHOUT repeaters (data-source-item type)
@@ -2700,7 +2675,8 @@ function wirePaginationButtons(
 function ensureAPIRouteExists(
   extractedResources: any,
   usage: DataSourceUsage,
-  dataSources: Record<string, any>
+  dataSources: Record<string, any>,
+  categories?: UIDLEcommerceCategory[]
 ): void {
   // Generate file name for the API route
   const fileName = generateSafeFileName(
@@ -2718,7 +2694,9 @@ function ensureAPIRouteExists(
         // Generate the utils file with fetchData, fetchCount, handler, and getCount
         const fetcherCode = generateDataSourceFetcherWithCore(
           dataSource,
-          usage.resourceDefinition.tableName || 'data'
+          usage.resourceDefinition.tableName || 'data',
+          false,
+          categories
         )
 
         extractedResources[`utils/${fileName}`] = {