@teleporthq/teleport-plugin-next-data-source 0.43.54 → 0.43.57

package/src/transformations/ecommerce-product.ts

@@ -1,4 +1,20 @@
 import type { UIDLEcommerceCategory } from '@teleporthq/teleport-types'
+import { StorefrontTax } from '@teleporthq/teleport-shared'
+
+/**
+ * Everything the product transform needs baked in at export time, beyond the
+ * row itself. An options OBJECT rather than positional parameters: the list has
+ * already grown twice and every caller in the chain has to forward it verbatim.
+ */
+export interface EcommerceProductTransformOptions {
+  /** Category taxonomy — lives only in the UIDL, there is no DB table for it. */
+  categories?: UIDLEcommerceCategory[]
+  /**
+   * Percentage to ADD on top of every stored (NET) price for DISPLAY, or 0.
+   * Resolved by the caller through `StorefrontTax.resolveStorefrontTaxRate`.
+   */
+  storefrontTaxRate?: number
+}
 
 /**
  * Flattens the nested category tree (`ecommerceSettings.categories`, baked at
@@ -47,11 +63,16 @@ const flattenCategoriesById = (
  * that UIDL components expect.
  */
 export const generateEcommerceProductTransformationCode = (
-  categories?: UIDLEcommerceCategory[]
+  options: EcommerceProductTransformOptions = {}
 ): string => {
-  const categoriesByIdJson = JSON.stringify(flattenCategoriesById(categories))
+  const categoriesByIdJson = JSON.stringify(flattenCategoriesById(options.categories))
+  const taxHelperCode = StorefrontTax.generateStorefrontTaxHelperCode(
+    options.storefrontTaxRate ?? 0
+  )
 
   return `
+${taxHelperCode}
+
 // Category taxonomy (id -> {name, slug, translations}), baked in at export
 // time — see flattenCategoriesById in ecommerce-product.ts. Empty when the
 // store has no category taxonomy, or products.category_ids simply resolves
@@ -191,6 +212,12 @@ function buildEcommerceProduct(record, options) {
   // transformRecords and passed in via options.variantsByProductId, keyed by
   // product id. The storefront card/details read these to default-select the
   // first in-stock variant, disable dead options, and resolve the chosen id.
+  //
+  // NULL (not {}) means the lookup could not run — the table is missing, or the
+  // query failed. That is "combinations UNKNOWN", which is NOT "this product has
+  // none": a transient DB failure must never turn every variant product in the
+  // catalogue into an unbuyable one. See hasPurchasableVariant below.
+  var variantsResolved = options.variantsByProductId != null
   var variantsByProductId = options.variantsByProductId || {}
   var rawVariants = variantsByProductId[id] || []
   var variants = []
@@ -227,7 +254,12 @@ function buildEcommerceProduct(record, options) {
       assetMap: assetMap,
       currentLanguage: currentLang,
       mainLanguage: mainLang,
-      variantsByProductId: options.variantsByProductId || {},
+      // Passed through UNCOALESCED so a related product inherits the same
+      // known/unknown answer as its parent — \`|| {}\` here would tell the nested
+      // build "the lookup ran and found nothing" and strike out every related
+      // card's picker. The batched query includes the related ids for exactly
+      // this reason (see getTransformWrapperCode).
+      variantsByProductId: options.variantsByProductId,
     }
     for (var rp = 0; rp < relatedProductIds.length; rp++) {
       var relatedId = relatedProductIds[rp]
@@ -312,7 +344,7 @@ function buildEcommerceProduct(record, options) {
   var variantAxisKeys = []
   for (var ak = 0; ak < variantOptions.length; ak++) { variantAxisKeys.push(variantOptions[ak].key) }
   var firstVariant = pickFirstAvailableVariant(variants, variantAxisKeys)
-  var deadValueKeys = computeDeadVariantKeys(variants, variantOptions)
+  var deadValueKeys = computeDeadVariantKeys(variants, variantOptions, variantsResolved)
   for (var ai = 0; ai < variantOptions.length; ai++) {
     var vax = variantOptions[ai]
     for (var vj = 0; vj < vax.values.length; vj++) {
@@ -332,13 +364,63 @@ function buildEcommerceProduct(record, options) {
       vval.showSwatch = vax.type === 'color' && vval.color ? 'true' : 'false'
     }
   }
-  var defaultVariantId = firstVariant && isVariantInStock(firstVariant) ? firstVariant.id : ''
+  // The combination the picker auto-selects on first paint: the first in-stock
+  // one covering every axis. Absent means there is nothing the shopper could add
+  // without choosing — which is what gates the buy button below.
+  var hasInStockCombination = !!(firstVariant && isVariantInStock(firstVariant))
+  var defaultVariantId = hasInStockCombination ? firstVariant.id : ''
   var defaultVariantPrice = firstVariant ? formatVariantPrice(firstVariant.price, price) : ''
+  // Gross (tax-inclusive) counterparts of the three price fields the STOREFRONT
+  // renders. \`price\` / \`defaultVariantPrice\` / \`variantsJson\` deliberately stay
+  // NET: the same transform feeds the merchant's admin panel, and every write
+  // path (add-to-cart, checkout, the invoice route) re-reads the raw row and
+  // must keep seeing the price the merchant typed. Only these three are safe to
+  // gross, because nothing writes them back.
+  //
+  // MUST mirror packages/renderer/src/utils/ecommerce-products.ts.
+  var displayPrice = grossMoney(price)
+  var defaultVariantDisplayPrice = firstVariant
+    ? grossMoney(formatVariantPrice(firstVariant.price, price))
+    : ''
+  var variantsDisplay = []
+  for (var dv = 0; dv < variants.length; dv++) {
+    var dvRow = variants[dv]
+    variantsDisplay.push({
+      id: dvRow.id,
+      options: dvRow.options,
+      // A null variant price INHERITS the product price, so gross the RESOLVED
+      // value — otherwise an inheriting combination would fall back to the net
+      // base price in the picker while an overriding one showed gross.
+      price: applyStorefrontTax(dvRow.price == null ? price : dvRow.price),
+      quantity: dvRow.quantity,
+      image_url: dvRow.image_url,
+    })
+  }
+  // Can this product be added to the cart at all, before the shopper touches the
+  // picker? A STRING, same convention as outOfStock/requiresVariantSelection.
+  //
+  //   flat product         -> 'true'  (stock is governed by outOfStock)
+  //   combinations UNKNOWN -> 'true'  (the lookup could not run; a transient DB
+  //                                    failure must never make a whole catalogue
+  //                                    unbuyable — same permissive rule as
+  //                                    dead-marking)
+  //   otherwise            -> whether an in-stock combination covering every axis
+  //                           exists. 'false' therefore covers BOTH "every
+  //                           combination is sold out" AND "the axes have no
+  //                           combinations at all" — to a shopper those are the
+  //                           same thing: there is no size to pick.
+  //
+  // MUST mirror packages/renderer/src/utils/ecommerce-products.ts.
+  var hasPurchasableVariant =
+    (requiresVariantSelection !== 'true' || !variantsResolved || hasInStockCombination)
+      ? 'true'
+      : 'false'
   // Stringified companions: a data-* attr bound to an ARRAY renders
   // '[object Object]', so the picker's on-mount/click workflows read the
   // combinations + axes from these JSON strings via getAttribute.
   var variantOptionsJson = safeStringifyJson(variantOptions)
   var variantsJson = safeStringifyJson(variants)
+  var variantsDisplayJson = safeStringifyJson(variantsDisplay)
 
   return {
     id: id,
@@ -384,8 +466,12 @@ function buildEcommerceProduct(record, options) {
     variants: variants,
     variantOptionsJson: variantOptionsJson,
     variantsJson: variantsJson,
+    variantsDisplayJson: variantsDisplayJson,
     defaultVariantId: defaultVariantId,
     defaultVariantPrice: defaultVariantPrice,
+    displayPrice: displayPrice,
+    defaultVariantDisplayPrice: defaultVariantDisplayPrice,
+    hasPurchasableVariant: hasPurchasableVariant,
   }
 }
 
@@ -416,11 +502,14 @@ function pickFirstAvailableVariant(variants, axisKeys) {
 }
 // Map of composite "axisKey|valueKey" -> true for every value that appears in
 // NO in-stock combination (rendered as the Unavailable state).
-function computeDeadVariantKeys(variants, axes) {
-  // No combinations attached (flat product, zero-variant product, or editor
-  // preview) -> nothing is dead; every value stays selectable. Dead-marking is
-  // only meaningful relative to combinations that actually exist.
-  if (!Array.isArray(variants) || variants.length === 0) return {}
+//
+// variantsResolved is the whole subtlety: dead-marking is only meaningful
+// against combinations we actually LOOKED UP. When the lookup could not run,
+// nothing is dead — a missing table or a failed query must not grey out every
+// picker in the store. When it DID run, an empty list is a fact, not a gap:
+// every value is unbuyable and renders as Unavailable.
+function computeDeadVariantKeys(variants, axes, variantsResolved) {
+  if (!variantsResolved || !Array.isArray(variants)) return {}
   var alive = {}
   for (var i = 0; i < variants.length; i++) {
     var v = variants[i]
@@ -651,6 +740,10 @@ async function getRelatedProductsMap(getClientFn, records) {
   return map
 }
 
+// Combinations for every product on the page, keyed by product id. Returns NULL
+// when the lookup could not run, which the transform reads as "unknown" and
+// stays permissive with; an empty map means the query ran and this catalogue
+// simply has no combinations.
 async function getVariantsMap(getClientFn, productIds) {
   var map = {}
   if (!Array.isArray(productIds) || productIds.length === 0) return map
@@ -678,7 +771,10 @@ async function getVariantsMap(getClientFn, productIds) {
       }
     }
   } catch (e) {
-    // teleport_product_variants may not exist for a non-variant store.
+    // teleport_product_variants may not exist for a non-variant store, or the
+    // query may have failed. Either way the combinations are UNKNOWN — null
+    // keeps every picker selectable instead of declaring the catalogue unbuyable.
+    map = null
   } finally {
     if (client) {
       try { await client.end() } catch (e) { /* ignore */ }

package/src/transformations/index.ts

@@ -1,7 +1,28 @@
-import type { UIDLEcommerceCategory } from '@teleporthq/teleport-types'
+import type { GeneratorOptions } from '@teleporthq/teleport-types'
+import { StorefrontTax } from '@teleporthq/teleport-shared'
 import { generateSharedTransformationCode } from './shared-utils'
 import { generateBlogPostTransformationCode } from './blog-post'
-import { generateEcommerceProductTransformationCode } from './ecommerce-product'
+import {
+  generateEcommerceProductTransformationCode,
+  type EcommerceProductTransformOptions,
+} from './ecommerce-product'
+
+export type { EcommerceProductTransformOptions }
+
+/**
+ * Collects everything the product transform bakes in from the generator
+ * options, in ONE place so every fetcher-emitting call site stays in step.
+ *
+ * `storefrontTaxRate` is what turns a NET catalogue price into the price the
+ * shopper is quoted; `resolveStorefrontTaxRate` returns 0 (a no-op) for
+ * tax-inclusive or untaxed stores.
+ */
+export const buildProductTransformOptions = (
+  options: Pick<GeneratorOptions, 'ecommerceSettings' | 'invoiceSettings'>
+): EcommerceProductTransformOptions => ({
+  categories: options.ecommerceSettings?.categories,
+  storefrontTaxRate: StorefrontTax.resolveStorefrontTaxRate(options.invoiceSettings),
+})
 
 export type TransformationType = 'blog-post' | 'ecommerce-product' | null
 
@@ -51,7 +72,7 @@ export const detectTransformationType = (tableName: string): TransformationType
  */
 export const getTransformationCode = (
   tableName: string,
-  categories?: UIDLEcommerceCategory[]
+  options: EcommerceProductTransformOptions = {}
 ): string => {
   const type = detectTransformationType(tableName)
   if (!type) {
@@ -64,7 +85,7 @@ export const getTransformationCode = (
     case 'blog-post':
       return shared + generateBlogPostTransformationCode()
     case 'ecommerce-product':
-      return shared + generateEcommerceProductTransformationCode(categories)
+      return shared + generateEcommerceProductTransformationCode(options)
     default:
       return ''
   }
@@ -107,18 +128,38 @@ export const getTransformWrapperCode = (tableName: string): string => {
 
   // Products additionally get their purchasable variant combinations attached in
   // ONE batched query (keyed by product id). Blog posts have no such enrichment.
+  //
+  // ⛔ The map starts as NULL and stays null when the query cannot run. The
+  // transform reads null as "combinations unknown" and keeps every picker
+  // selectable; a `{}` would mean "the lookup ran and this catalogue has none",
+  // which strikes out every value and hides every buy button. A transient DB
+  // failure must not be able to say that.
+  //
+  // Runs AFTER the related-items lookup so the related rows — which the details
+  // page draws as real product cards, each with its own picker — get their
+  // combinations from the SAME query instead of transforming as variant-less.
   const variantEnrichment =
     type === 'ecommerce-product'
       ? `
-  var variantsByProductId = {}
+  var variantsByProductId = null
   try {
     var __variantPids = []
     for (var __i = 0; __i < records.length; __i++) {
       if (records[__i] && records[__i].id != null) __variantPids.push(records[__i].id)
     }
+    if (relatedProductsById) {
+      for (var __rk in relatedProductsById) {
+        if (!Object.prototype.hasOwnProperty.call(relatedProductsById, __rk)) continue
+        // The ROW's own id, not the map key: the key was stringified when the map
+        // was built, and a query parameter array of mixed types is one the driver
+        // cannot type against the product_id column.
+        var __rrow = relatedProductsById[__rk]
+        if (__rrow && __rrow.id != null) __variantPids.push(__rrow.id)
+      }
+    }
     variantsByProductId = await getVariantsMap(getClientFn, __variantPids)
   } catch (e) {
-    // Variant enrichment is best-effort; flat products keep variants: [].
+    // Leaves the map null — "unknown", never "none".
   }`
       : ''
 
@@ -155,7 +196,7 @@ async function transformRecords(records, getClientFn, reqQuery) {
     assetMap = await getAssetMap(getClientFn)
   } catch (e) {
     // Asset resolution is best-effort; continue without it
-  }${variantEnrichment}${relatedEnrichment}
+  }${relatedEnrichment}${variantEnrichment}
   var currentLanguage = (reqQuery && reqQuery.lang) || null
   var mainLanguage = (reqQuery && reqQuery.mainLang) || null
   var options = { assetMap: assetMap, currentLanguage: currentLanguage, mainLanguage: mainLanguage${variantOption}, ${relatedMapVar}: ${relatedMapVar} }

package/src/utils.ts

@@ -7,12 +7,12 @@ import {
   UIDLDataSource,
   DataSourceType,
   ChunkType,
-  UIDLEcommerceCategory,
 } from '@teleporthq/teleport-types'
 import * as types from '@babel/types'
 import { ASTUtils } from '@teleporthq/teleport-plugin-common'
 import { StringUtils } from '@teleporthq/teleport-shared'
 import { generateDataSourceFetcherWithCore } from './data-source-fetchers'
+import type { EcommerceProductTransformOptions } from './transformations'
 import { DATA_SOURCE_ISR_REVALIDATE_SECONDS } from './isr'
 
 const VALID_DATA_SOURCE_TYPES: DataSourceType[] = [
@@ -192,7 +192,7 @@ export const extractDataSourceIntoNextAPIFolder = (
   dataSources: Record<string, UIDLDataSource>,
   componentChunk: ChunkDefinition,
   extractedResources: GeneratorOptions['extractedResources'],
-  categories?: UIDLEcommerceCategory[]
+  transformOptions: EcommerceProductTransformOptions = {}
 ) => {
   try {
     // Validate node content structure
@@ -446,7 +446,12 @@ export default dataSourceModule.handler
     // Generate fetcher code for API route (exports just the handler)
     let fetcherCode: string
     try {
-      fetcherCode = generateDataSourceFetcherWithCore(dataSource, tableName || '', true, categories)
+      fetcherCode = generateDataSourceFetcherWithCore(
+        dataSource,
+        tableName || '',
+        true,
+        transformOptions
+      )
     } catch (error) {
       return
     }
@@ -896,7 +901,7 @@ export const extractDataSourceIntoGetStaticProps = (
   dependencies: Record<string, any>,
   dynamicRouteAttr?: string,
   folderPath?: string[],
-  categories?: UIDLEcommerceCategory[]
+  transformOptions: EcommerceProductTransformOptions = {}
 ): { success: boolean; chunk?: any } => {
   try {
     // Validate node content
@@ -1224,7 +1229,7 @@ export const extractDataSourceIntoGetStaticProps = (
         dataSource,
         tableName || '',
         false,
-        categories
+        transformOptions
       )
     } catch (error) {
       // tslint:disable-next-line:no-console