@teleporthq/teleport-plugin-next-workflows 0.43.75 → 0.44.0

package/src/page-arrival.ts

@@ -0,0 +1,115 @@
+import {
+  ComponentUIDL,
+  UIDLElement,
+  UIDLNode,
+  UIDLWorkflow,
+  UIDLWorkflows,
+} from '@teleporthq/teleport-types'
+import { UIDLUtils } from '@teleporthq/teleport-shared'
+import { getRelevantWorkflows, resolveLifecycleTriggerElementId } from './workflow-scope'
+
+/**
+ * Lifecycle triggers that fire because the page appeared. They run when the
+ * page or component carrying them mounts, so the page has to remount on every
+ * arrival (see `PageArrival.remountPageOnArrival`).
+ */
+const PAGE_ARRIVAL_TRIGGER_TYPES = new Set([
+  'event-page-loaded',
+  'event-element-visible',
+  'event-component-loaded',
+])
+
+export const isPageArrivalWorkflow = (workflow: UIDLWorkflow): boolean =>
+  PAGE_ARRIVAL_TRIGGER_TYPES.has(workflow.trigger.type)
+
+/** Every static `id` in a node tree — the ids an element-visible trigger can observe. */
+const collectStaticElementIds = (node: UIDLNode): Set<string> => {
+  const ids = new Set<string>()
+  UIDLUtils.traverseElements(node, (element) => {
+    const id = element.attrs?.id
+    if (id?.type === 'static' && typeof id.content === 'string') {
+      ids.add(id.content)
+    }
+  })
+  return ids
+}
+
+/**
+ * The project component a node renders. Local dependencies are resolved before
+ * the pages are generated, which rewrites `semanticType` to the component's
+ * class name — the original key still matches a component that was not renamed.
+ */
+const findRenderedComponent = (
+  element: UIDLElement,
+  projectComponents: Record<string, ComponentUIDL>
+): ComponentUIDL | undefined => {
+  if (element.dependency?.type !== 'local') {
+    return undefined
+  }
+  const reference = element.semanticType || element.elementType
+  return (
+    projectComponents[reference] ||
+    Object.values(projectComponents).find(
+      (component) => UIDLUtils.getComponentClassName(component) === reference
+    )
+  )
+}
+
+/** The components a node tree renders, directly or through other components. */
+const collectRenderedComponents = (
+  node: UIDLNode,
+  projectComponents: Record<string, ComponentUIDL>,
+  rendered: Set<ComponentUIDL>
+): Set<ComponentUIDL> => {
+  UIDLUtils.traverseElements(node, (element) => {
+    const component = findRenderedComponent(element, projectComponents)
+    if (component && !rendered.has(component)) {
+      rendered.add(component)
+      collectRenderedComponents(component.node, projectComponents, rendered)
+    }
+  })
+  return rendered
+}
+
+/**
+ * Mirrors what the workflow plugin emits into the component: the workflows it
+ * finds relevant, with an element-visible trigger kept only when the observed
+ * element is rendered by the component itself.
+ */
+const componentRunsOnArrival = (component: ComponentUIDL, workflows: UIDLWorkflows): boolean => {
+  const arrivalWorkflows = getRelevantWorkflows(workflows, component, false).filter(
+    isPageArrivalWorkflow
+  )
+  if (arrivalWorkflows.length === 0) {
+    return false
+  }
+  const elementIds = collectStaticElementIds(component.node)
+  return arrivalWorkflows.some((workflow) => {
+    const targetId = resolveLifecycleTriggerElementId(
+      workflow.trigger.type,
+      (workflow.trigger.config || {}) as Record<string, unknown>
+    )
+    return (
+      workflow.trigger.type !== 'event-element-visible' ||
+      (targetId !== null && elementIds.has(targetId))
+    )
+  })
+}
+
+/**
+ * True when a component the page renders runs a workflow when it appears — an
+ * element-visible trigger on one of its elements, a component-loaded trigger.
+ * The component mounts again only when the page around it does, so such a page
+ * remounts on every arrival even when it has no arrival trigger of its own.
+ */
+export const pageRendersArrivalComponent = (
+  pageNode: UIDLNode,
+  workflows: UIDLWorkflows,
+  projectComponents?: Record<string, ComponentUIDL>
+): boolean => {
+  if (!projectComponents) {
+    return false
+  }
+  const rendered = collectRenderedComponents(pageNode, projectComponents, new Set())
+  return Array.from(rendered).some((component) => componentRunsOnArrival(component, workflows))
+}

package/src/payments/index.ts

@@ -2,6 +2,7 @@ import {
   FileType,
   ProjectPluginStructure,
   ProjectUIDL,
+  UIDLEcommercePaymentProvider,
   UIDLWorkflows,
 } from '@teleporthq/teleport-types'
 import { generatePaymentCoreCode } from './payment-core-code'
@@ -63,6 +64,18 @@ export const isPaymentWebhookConfig = (webhookConfig: unknown): boolean =>
   ((webhookConfig || {}) as { signatureAlgorithm?: unknown }).signatureAlgorithm ===
     PAYMENT_DRIVER_SIGNATURE_ALGORITHM
 
+/**
+ * The providers the site is paid through: the store's (`ecommerceSettings`),
+ * or — on a site that takes payments without a store, for its bookings —
+ * `paymentSettings`'.
+ */
+export const readUidlPaymentProviders = (
+  uidl: Pick<ProjectUIDL, 'ecommerceSettings' | 'paymentSettings'> | undefined
+): UIDLEcommercePaymentProvider[] =>
+  (uidl?.ecommerceSettings
+    ? uidl.ecommerceSettings.paymentProviders
+    : uidl?.paymentSettings?.paymentProviders) || []
+
 /**
  * The providers this store needs a driver for: every provider its checkout
  * offers, every provider a payment webhook verifies through, and Stripe +
@@ -71,11 +84,11 @@ export const isPaymentWebhookConfig = (webhookConfig: unknown): boolean =>
  * payment, in which case no driver module is written.
  */
 export const resolveStorePaymentDriverIds = (
-  uidl: Pick<ProjectUIDL, 'ecommerceSettings'> & { workflows?: UIDLWorkflows },
+  uidl: Pick<ProjectUIDL, 'ecommerceSettings' | 'paymentSettings'> & { workflows?: UIDLWorkflows },
   usedNodeTypes: Iterable<string>
 ): PaymentDriverId[] => {
   const wanted = new Set<PaymentDriverId>()
-  for (const provider of uidl.ecommerceSettings?.paymentProviders || []) {
+  for (const provider of readUidlPaymentProviders(uidl)) {
     const id = String(provider?.type || '').toLowerCase()
     if (isPaymentDriverId(id)) {
       wanted.add(id)
@@ -98,13 +111,13 @@ const ENV_NAME_PATTERN = /^[A-Za-z_][A-Za-z0-9_]*$/
 
 /**
  * The secret the merchant saved each live provider credential under, as the
- * editor exported it (`ecommerceSettings.paymentProviders[].credentials`).
+ * editor exported it (`paymentProviders[].credentials` of either block).
  */
 export const readDeclaredPaymentCredentials = (
-  uidl: Pick<ProjectUIDL, 'ecommerceSettings'> | undefined
+  uidl: Pick<ProjectUIDL, 'ecommerceSettings' | 'paymentSettings'> | undefined
 ): DeclaredPaymentCredentials => {
   const declared: DeclaredPaymentCredentials = {}
-  for (const provider of uidl?.ecommerceSettings?.paymentProviders || []) {
+  for (const provider of readUidlPaymentProviders(uidl)) {
     const id = String(provider?.type || '').toLowerCase()
     if (!isPaymentDriverId(id)) {
       continue

package/src/workflow-component-plugin.ts

@@ -12,7 +12,7 @@ import {
   UIDLCustomWorkflowNode,
 } from '@teleporthq/teleport-types'
 import * as types from '@babel/types'
-import { GenericUtils, JSIdentifiers, StringUtils } from '@teleporthq/teleport-shared'
+import { GenericUtils, JSIdentifiers, PageArrival, StringUtils } from '@teleporthq/teleport-shared'
 import {
   splitIntoSegments,
   resolveNodeExecutionEnv,
@@ -34,6 +34,8 @@ import { elementVisibleObserverCode } from './element-visible-trigger'
 import { restoreControlledSelectValue } from './controlled-select'
 import { resolveScrollPoint } from './scroll-points'
 import { findFormStateKeyForHydration } from './admin-form-hydration'
+import { getRelevantWorkflows, resolveLifecycleTriggerElementId } from './workflow-scope'
+import { isPageArrivalWorkflow, pageRendersArrivalComponent } from './page-arrival'
 
 interface WorkflowPluginConfig {
   isPage?: boolean
@@ -85,29 +87,6 @@ const DOM_TO_REACT_EVENT: Record<string, string> = {
   drag: 'onDrag',
 }
 
-/**
- * Trigger types that run as LIFECYCLE code (no React event prop) but are still
- * bound to ONE element, so the workflow only belongs on the page that renders
- * it. Returns the DOM id to prune against, or null when the trigger is not
- * element-scoped.
- *
- * Same fallback chain as the element-trigger branch: the HTML id first, the
- * project-document node id only as a last resort.
- */
-const resolveLifecycleTriggerElementId = (
-  triggerType: string,
-  config: Record<string, unknown>
-): string | null => {
-  if (
-    triggerType !== 'event-element-visible' &&
-    triggerType !== 'event-chapter-reached' &&
-    triggerType !== 'event-scene-scrolled-past'
-  ) {
-    return null
-  }
-  return ((config.elementHtmlId || config.nodeId) as string) || null
-}
-
 const getReactEventProp = (triggerType: string, config: Record<string, unknown>): string | null => {
   switch (triggerType) {
     case 'event-element-clicked':
@@ -229,6 +208,12 @@ export const createNextWorkflowPlugin: ComponentPluginFactory<WorkflowPluginConf
       return structure
     }
 
+    // Decided before the page's own workflows: a page can have none and still
+    // render a component that runs one when it appears.
+    if (isPage && pageRendersArrivalComponent(uidl.node, workflows, options.projectComponents)) {
+      PageArrival.remountPageOnArrival(structure)
+    }
+
     const relevantWorkflows = getRelevantWorkflows(workflows, uidl, isPage)
 
     if (relevantWorkflows.length === 0) {
@@ -533,6 +518,13 @@ export const createNextWorkflowPlugin: ComponentPluginFactory<WorkflowPluginConf
         globalStateChangeWorkflows
       )
 
+      const runsOnPageArrival = lifecycleWorkflows.some(
+        (wf) => activeWorkflowIds.has(wf.id) && isPageArrivalWorkflow(wf)
+      )
+      if (isPage && runsOnPageArrival) {
+        PageArrival.remountPageOnArrival(structure)
+      }
+
       // For update/detail pages: initialize form state from props
       const initialPropsData = uidl.outputOptions?.initialPropsData
       if (initialPropsData?.exposeAs?.name && formDataStateKeyForHydration) {
@@ -2047,13 +2039,18 @@ const generateElementHandler = (et: ElementTriggerInfo): string => {
         (preventDefault ? '    event.preventDefault();\n' : '') +
         (stopPropagation ? '    event.stopPropagation();\n' : '') +
         `    const __te = event.currentTarget || event.target;\n` +
+        // The control that fired is `event.target`, which differs from the
+        // bound element when the event bubbled: a radio group's wrapper
+        // listens for `change` and the chosen radio is the target.
         // `formControlPropertyReads(...)` injects `value`, `checked`, `files`
-        // so dropdown/input/checkbox/file-picker `change` events surface the
-        // user's choice as `triggerContext.value` (etc.) — without this every
+        // from THAT control so `change` events surface the user's choice as
+        // `triggerContext.value` (etc.) — without this every
         // `state-update-local-state` node bound to `Trigger.value` writes
-        // `undefined` and the picker becomes a no-op.
-        `    const triggerContext = { elementId: '${elementId}', eventType: '${eventType}', triggerElement: __te, element: __te, timestamp: Date.now(), clientX: event.clientX, clientY: event.clientY, offsetX: event.offsetX, offsetY: event.offsetY, button: event.button, deltaX: event.deltaX, deltaY: event.deltaY, deltaMode: event.deltaMode, key: event.key, ${formControlPropertyReads(
-          '__te'
+        // `undefined` and the picker becomes a no-op; and `target` carries
+        // the control itself (its name, id, dataset) for delegated handlers.
+        `    const __tt = event.target || __te;\n` +
+        `    const triggerContext = { elementId: '${elementId}', eventType: '${eventType}', triggerElement: __te, element: __te, target: __tt, currentTarget: __te, timestamp: Date.now(), clientX: event.clientX, clientY: event.clientY, offsetX: event.offsetX, offsetY: event.offsetY, button: event.button, deltaX: event.deltaX, deltaY: event.deltaY, deltaMode: event.deltaMode, key: event.key, ${formControlPropertyReads(
+          '__tt'
         )} };\n` +
         (isDropEvent
           ? '    if (event.dataTransfer && event.dataTransfer.files) { triggerContext.files = Array.from(event.dataTransfer.files); }\n'
@@ -2147,6 +2144,21 @@ const normalizeKeyName = (key: string): string => {
   return keyMap[key] || key
 }
 
+/**
+ * The run of a page/component-loaded trigger. A delayed run is cancelled when
+ * the triggers are torn down: by then its page has unmounted, or has remounted
+ * for a new arrival that schedules a run of its own.
+ */
+const generateLoadedTriggerRun = (
+  execCall: string,
+  delay: number | undefined,
+  safeId: string
+): string =>
+  delay
+    ? `      const __delay_${safeId} = setTimeout(function() { ${execCall}; }, ${delay});\n` +
+      `      cleanups.push(function() { clearTimeout(__delay_${safeId}); });\n`
+    : `      ${execCall};\n`
+
 const generateLifecycleTrigger = (wf: UIDLWorkflow, safeId: string): string => {
   const trigger = wf.trigger
   const config = (trigger.config || {}) as Record<string, unknown>
@@ -2159,9 +2171,7 @@ const generateLifecycleTrigger = (wf: UIDLWorkflow, safeId: string): string => {
         `    // Page loaded (${wf.name || wf.id})\n` +
         `    {\n` +
         `      const triggerContext = { url: window.location.href, timestamp: Date.now(), referrer: document.referrer };\n` +
-        (delay
-          ? `      setTimeout(function() { ${execCall}; }, ${delay});\n`
-          : `      ${execCall};\n`) +
+        generateLoadedTriggerRun(execCall, delay, safeId) +
         `    }`
       )
     }
@@ -2174,9 +2184,7 @@ const generateLifecycleTrigger = (wf: UIDLWorkflow, safeId: string): string => {
         `    // Component loaded (${wf.name || wf.id})\n` +
         `    {\n` +
         `      const triggerContext = { componentId: '${componentId}', componentName: '${componentName}', url: window.location.href, timestamp: Date.now() };\n` +
-        (delay
-          ? `      setTimeout(function() { ${execCall}; }, ${delay});\n`
-          : `      ${execCall};\n`) +
+        generateLoadedTriggerRun(execCall, delay, safeId) +
         `    }`
       )
     }
@@ -2778,156 +2786,3 @@ const generateRealtimeUnsubscribeCode = (
       return ''
   }
 }
-
-// Component-scope triggers match by emitted component name. The GUI stamps the
-// name at export time, but generators may re-case or strip spaces during
-// resolution, so equality is checked case/separator-insensitively.
-const normalizeComponentName = (name: string): string =>
-  (name || '').toLowerCase().replace(/[^a-z0-9]/g, '')
-
-const getRelevantWorkflows = (
-  workflows: UIDLWorkflows,
-  uidl: any,
-  isPage: boolean
-): UIDLWorkflow[] => {
-  const relevant: UIDLWorkflow[] = []
-  const pageId = uidl.outputOptions?.pageId || uidl.outputOptions?.fileName || uidl.name || ''
-
-  const allWorkflows = Object.values(workflows.workflows) as UIDLWorkflow[]
-  allWorkflows.forEach((wf: UIDLWorkflow) => {
-    const trigger = wf.trigger
-
-    if (trigger.type === 'event-cron-triggered') {
-      return
-    }
-
-    if (trigger.type === 'event-webhook-received') {
-      return
-    }
-
-    if (trigger.type === 'event-state-change') {
-      const cfg = trigger.config || {}
-      const stateDefs = cfg.stateDefinitions as
-        | Array<{
-            pageOrComponentId?: string
-            pageOrComponentName?: string
-            name?: string
-            stateDefinitionId?: string
-          }>
-        | undefined
-
-      let boundContainerType = cfg.boundContainerType as string | undefined
-      if (!boundContainerType) {
-        if (stateDefs?.some((s) => s.pageOrComponentName)) {
-          boundContainerType = 'component'
-        } else if (!isPage && stateDefs && stateDefs.length > 0) {
-          boundContainerType = 'component'
-        } else {
-          boundContainerType = 'page'
-        }
-      }
-
-      const matchesContainer = boundContainerType === 'page' ? isPage : !isPage
-      if (!matchesContainer) {
-        return
-      }
-
-      const boundFromConfig = cfg.boundPageOrComponentId as string | undefined
-      const matchesByName =
-        !!stateDefs &&
-        stateDefs.some((sd) => sd.pageOrComponentName && sd.pageOrComponentName === uidl.name)
-      const matchesById =
-        boundFromConfig === pageId ||
-        (!!stateDefs && stateDefs.some((sd) => sd.pageOrComponentId === pageId))
-
-      if (matchesByName || matchesById) {
-        relevant.push(wf)
-      }
-      return
-    }
-
-    if (trigger.type === 'event-global-state-change') {
-      if (!isPage) {
-        return
-      }
-      const selectedPages = trigger.config.selectedPages as Array<{ id: string }> | undefined
-      if (
-        selectedPages &&
-        selectedPages.length > 0 &&
-        !selectedPages.some((p) => p.id === pageId)
-      ) {
-        return
-      }
-      relevant.push(wf)
-      return
-    }
-
-    if (trigger.scope === 'global') {
-      return
-    }
-
-    if (trigger.scope === 'component') {
-      if (isPage) {
-        return
-      }
-      const cfg = trigger.config || {}
-      const cfgName = (cfg.componentName as string) || ''
-      const cfgId = (cfg.componentId as string) || ''
-      const matches =
-        (cfgName &&
-          (cfgName === uidl.name ||
-            normalizeComponentName(cfgName) === normalizeComponentName(uidl.name))) ||
-        (cfgId && cfgId === pageId)
-      if (matches) {
-        relevant.push(wf)
-      }
-      return
-    }
-
-    if (trigger.scope === 'page' && isPage) {
-      const triggerPageId = trigger.config.pageId as string
-      const selectedPages = trigger.config.selectedPages as Array<{ id: string }> | undefined
-
-      if (trigger.type === 'event-page-loaded') {
-        const allPages = trigger.config.allPages === true
-        if (allPages) {
-          relevant.push(wf)
-          return
-        }
-        // Unscoped page-loaded workflows are SKIPPED, not injected everywhere.
-        // Silently fanning out to every page masks mis-scoped workflows whose
-        // state target lives in a component (the setter no-ops on pages).
-        if (!triggerPageId && (!selectedPages || selectedPages.length === 0)) {
-          return
-        }
-      }
-
-      if (triggerPageId && triggerPageId !== pageId) {
-        return
-      }
-
-      if (selectedPages && !selectedPages.some((p) => p.id === pageId)) {
-        return
-      }
-
-      relevant.push(wf)
-      return
-    }
-
-    if (trigger.scope === 'element') {
-      // If the element-scoped trigger specifies which pages it belongs to, filter by page.
-      // This prevents including ALL element-scoped workflows on every page (massive bloat).
-      const elementSelectedPages = trigger.config.selectedPages as Array<{ id: string }> | undefined
-      if (isPage && elementSelectedPages && elementSelectedPages.length > 0) {
-        if (!elementSelectedPages.some((p) => p.id === pageId)) {
-          return
-        }
-      }
-
-      relevant.push(wf)
-      return
-    }
-  })
-
-  return relevant
-}

package/src/workflow-project-plugin.ts

@@ -98,6 +98,7 @@ import {
 import { rewriteLowStockCustomHandlers } from './ecommerce-customhandler-rewriter'
 import { assertWorkflowsAreSecure } from './security-scanner'
 import { parameterizeAllWorkflowRawSql } from './raw-sql-param-binding'
+import { generateBookingCalendarFeedFiles } from './booking-calendar-feed-route-generator'
 
 // Resolves the auth IDENTITY (users) table from the UIDL auth tables. Getting
 // this wrong is a security hole (the /api/data guard only protects this table),
@@ -351,6 +352,10 @@ export class NextWorkflowProjectPlugin implements ProjectPlugin {
       this.generateAuthFiles(uidl.authentication, structure)
     }
 
+    // The bookings' calendar feeds do not depend on any workflow, so they are
+    // emitted before the early return for a project without workflows.
+    generateBookingCalendarFeedFiles(structure)
+
     if (!uidl.workflows || !uidl.workflows.workflows) {
       if (uidl.invoiceSettings?.enabled) {
         const { dataSourceType, dataSourceConfig } = resolveInvoiceDataSource(structure)
@@ -1616,11 +1621,14 @@ async function customNode_${safeId}(outerContext, parameters, nodeHandlers) {
 
   // The custom node returns its last executed node's output. A fire-and-forget
   // node is excluded: it always stores \`null\`, so if it happens to be last it
-  // would turn the whole custom node's result into null for every caller.
+  // would turn the whole custom node's result into null for every caller. So is
+  // a node of a branch not taken: whatever a segment answered for it must never
+  // stand in for the terminal of the branch that ran.
   var __returnableNodes = nodes
     .slice()
     .sort(function(a, b) { return a.stepNumber - b.stepNumber; })
-    .filter(function(n) { return !__utils.isFireAndForgetNode(n); });
+    .filter(function(n) { return !__utils.isFireAndForgetNode(n); })
+    .filter(function(n) { return !(context.__skippedNodes && context.__skippedNodes[n.id]); });
   var lastNodeId = null;
   for (var __ri = __returnableNodes.length - 1; __ri >= 0; __ri--) {
     if (context[__returnableNodes[__ri].id] !== undefined) { lastNodeId = __returnableNodes[__ri].id; break; }
@@ -1682,11 +1690,14 @@ async function customNode_${safeId}(outerContext, parameters, nodeHandlers) {
 
   // The custom node returns its last executed node's output. A fire-and-forget
   // node is excluded: it always stores \`null\`, so if it happens to be last it
-  // would turn the whole custom node's result into null for every caller.
+  // would turn the whole custom node's result into null for every caller. So is
+  // a node of a branch not taken: whatever a segment answered for it must never
+  // stand in for the terminal of the branch that ran.
   var __returnableNodes = nodes
     .slice()
     .sort(function(a, b) { return a.stepNumber - b.stepNumber; })
-    .filter(function(n) { return !__utils.isFireAndForgetNode(n); });
+    .filter(function(n) { return !__utils.isFireAndForgetNode(n); })
+    .filter(function(n) { return !(context.__skippedNodes && context.__skippedNodes[n.id]); });
   var lastNodeId = null;
   for (var __ri = __returnableNodes.length - 1; __ri >= 0; __ri--) {
     if (context[__returnableNodes[__ri].id] !== undefined) { lastNodeId = __returnableNodes[__ri].id; break; }