@akinon/pz-theme 2.0.39-rc.0 → 2.0.39

package/src/utils/iterator-utils.ts

@@ -2,6 +2,7 @@
 // a value import of the block module would close that loop at runtime.
 import type { Block } from '../theme-block';
 import { devWarn } from './dev-warn';
+import { isMoneyPath } from './field-semantics';
 import { isVisibleForItem, readRowVisibility } from './row-visibility';
 
 interface BindingContext {
@@ -14,6 +15,19 @@ interface BindingContext {
    * running in en-GB got Turkish grouping in every repeated row.
    */
   locale?: string;
+  /**
+   * Storefront currency, the last resort when a bound money value carries no
+   * currency of its own. Commerce publishes a currency per basket line, so an
+   * empty basket has none to read.
+   */
+  currency?: string;
+  /**
+   * Lets the page context stand in as the binding root when the section has no
+   * data source of its own. Opt-in rather than automatic: the same root feeds
+   * the iterator lookup, and a repeat with no data path would otherwise start
+   * reading `items` / `products` off the page context.
+   */
+  allowPageContextFallback?: boolean;
 }
 
 interface IteratorOptions extends BindingContext {
@@ -218,7 +232,8 @@ const getStaticBindingRoot = (
 const getSectionBindingRoot = ({
   sectionDataSource,
   pageContext,
-  isDesigner = false
+  isDesigner = false,
+  allowPageContextFallback = false
 }: BindingContext): Record<string, unknown> | null => {
   if (
     sectionDataSource?.type === PAGE_CONTEXT_DATA_SOURCE_TYPE &&
@@ -240,6 +255,14 @@ const getSectionBindingRoot = ({
     return staticRoot;
   }
 
+  // The page's own commerce data is the root a designer means when they bind
+  // `basket.totalAmount` on the basket page. Creating a data source first is
+  // the step nobody discovers, so a section without one falls back to it —
+  // for value bindings only, never for the iterator lookup.
+  if (allowPageContextFallback && isRecord(pageContext)) {
+    return pageContext;
+  }
+
   return null;
 };
 
@@ -483,10 +506,52 @@ const isPriceBinding = (dataBinding: string): boolean => {
   );
 };
 
+/**
+ * A bound total used to print "799.90" beside a built-in block printing
+ * "1.299,90 TL", because formatting was reached only from the row-scoped
+ * product path. Which fields are money is decided in one place — the same one
+ * the editor labels its picker from, so the two cannot disagree.
+ */
+const isPageMoneyBinding = (bindingPath: string): boolean =>
+  Boolean(bindingPath) &&
+  !bindingPath.startsWith('item.') &&
+  isMoneyPath(bindingPath);
+
+/**
+ * The currency that belongs to the bound value: the one its own root publishes
+ * (`basket.currency`), then the first row that carries one (an empty basket
+ * has no rows), then the storefront's.
+ */
+const readContextCurrency = (
+  bindingRoot: Record<string, unknown> | null,
+  bindingPath: string,
+  fallback?: string
+): string | undefined => {
+  const rootKey = bindingPath.split('.')[0];
+  const scopeValue = isRecord(bindingRoot) ? bindingRoot[rootKey] : undefined;
+  const scope = isRecord(scopeValue) ? scopeValue : null;
+
+  if (scope) {
+    const own = scope.currency;
+    if (typeof own === 'string' && own.trim()) return own.trim();
+
+    const rows = Array.isArray(scope.items) ? scope.items : [];
+    for (const row of rows) {
+      const rowCurrency = isRecord(row) ? row.currency : undefined;
+      if (typeof rowCurrency === 'string' && rowCurrency.trim()) {
+        return rowCurrency.trim();
+      }
+    }
+  }
+
+  return fallback && fallback.trim() ? fallback.trim() : undefined;
+};
+
 const applyResolvedBinding = (
   block: Block,
   resolvedValue: unknown,
-  bindingPath: string
+  bindingPath: string,
+  moneyCurrency?: string
 ): Block => {
   const target = getItemBindingTarget(block);
   const nextBlock: Block = {
@@ -505,6 +570,17 @@ const applyResolvedBinding = (
     return nextBlock;
   }
 
+  if (
+    target === 'value' &&
+    isPageMoneyBinding(bindingPath) &&
+    (typeof resolvedValue === 'string' || typeof resolvedValue === 'number')
+  ) {
+    nextBlock.value = escapeHtml(
+      getPriceWithCurrency(resolvedValue, moneyCurrency)
+    );
+    return nextBlock;
+  }
+
   const normalizedValue = normalizeScalarValue(
     resolvedValue,
     target,
@@ -553,12 +629,17 @@ export const resolveBlockBindings = ({
   block,
   sectionDataSource,
   pageContext,
-  isDesigner = false
+  isDesigner = false,
+  currency
 }: BindingContext & { block: Block }): Block => {
   const bindingRoot = getSectionBindingRoot({
     sectionDataSource,
     pageContext,
-    isDesigner
+    isDesigner,
+    // Value bindings resolve against the page context when the section has no
+    // data source. The iterator lookup deliberately does not — see
+    // getSectionBindingRoot.
+    allowPageContextFallback: true
   });
 
   const walk = (sourceBlock: Block): Block => {
@@ -592,7 +673,8 @@ export const resolveBlockBindings = ({
           resolvedBlock = applyResolvedBinding(
             nextBlock,
             interpolated,
-            bindingPath
+            bindingPath,
+            readContextCurrency(bindingRoot, bindingPath, currency)
           );
         }
       } else {
@@ -601,7 +683,8 @@ export const resolveBlockBindings = ({
           resolvedBlock = applyResolvedBinding(
             nextBlock,
             resolvedValue,
-            bindingPath
+            bindingPath,
+            readContextCurrency(bindingRoot, bindingPath, currency)
           );
         }
       }

package/src/utils/page-context-binding.test.ts

@@ -0,0 +1,136 @@
+import { buildIteratorBlock, resolveBlockBindings } from './iterator-utils';
+
+/**
+ * The page a designer is editing is itself a data source: on the basket page
+ * `basket.totalAmount` must resolve without the designer creating a data
+ * source first, and it must read as money rather than as a raw API string.
+ */
+
+const textBlock = (props: Record<string, unknown>, id = 'b') =>
+  ({
+    id,
+    type: 'text',
+    label: id,
+    value: '',
+    properties: {},
+    styles: {},
+    order: 0,
+    hidden: false,
+    ...props
+  } as any);
+
+const basketContext = (overrides: Record<string, unknown> = {}) => ({
+  page: { type: 'basket', title: 'Basket', path: '/basket' },
+  basket: {
+    isEmpty: false,
+    itemCount: 1,
+    totalQuantity: 2,
+    totalAmount: '1299.90',
+    totalDiscountAmount: '100.00',
+    voucherCode: 'WELCOME',
+    currency: 'TRY',
+    items: [{ title: 'Spring Sneaker', currency: 'TRY', totalAmount: '649.95' }],
+    ...overrides
+  }
+});
+
+describe('page context as an implicit binding root', () => {
+  it('resolves a basket binding on a section that has NO data source', () => {
+    const result = resolveBlockBindings({
+      block: textBlock({
+        value: 'Total',
+        properties: { dataBinding: 'basket.totalAmount' }
+      }),
+      pageContext: basketContext()
+    });
+
+    expect(result.value).toBe('1.299,90 TL');
+  });
+
+  it('keeps the authored value when the path is not on the page', () => {
+    const result = resolveBlockBindings({
+      block: textBlock({
+        value: 'Fallback',
+        properties: { dataBinding: 'basket.shippingAmount' }
+      }),
+      pageContext: basketContext()
+    });
+
+    expect(result.value).toBe('Fallback');
+  });
+
+  it('resolves a token template mixed with literal text', () => {
+    const result = resolveBlockBindings({
+      block: textBlock({
+        value: '',
+        properties: {
+          dataBinding: '{{basket.totalQuantity}} items, {{basket.voucherCode}}'
+        }
+      }),
+      pageContext: basketContext()
+    });
+
+    expect(result.value).toBe('2 items, WELCOME');
+  });
+
+  it('does not let a source-less iterator read the page context', () => {
+    // The fallback is opt-in for value bindings only. A repeat with no data
+    // path must not start iterating whatever the page happens to publish.
+    const iterator = buildIteratorBlock({
+      iteratorBlock: {
+        id: 'group',
+        type: 'group',
+        label: 'Rows',
+        value: undefined,
+        properties: {},
+        styles: {},
+        order: 0,
+        hidden: false,
+        isIterator: true,
+        blocks: []
+      } as any,
+      pageContext: { items: [{ title: 'A' }, { title: 'B' }] }
+    });
+
+    expect(iterator.blocks).toHaveLength(0);
+  });
+});
+
+describe('money formatting for page-scoped bindings', () => {
+  it('formats with the currency the basket publishes', () => {
+    const result = resolveBlockBindings({
+      block: textBlock({ properties: { dataBinding: 'basket.totalAmount' } }),
+      pageContext: basketContext({ currency: 'EUR', items: [] })
+    });
+
+    expect(result.value).toBe('1.299,90 EUR');
+  });
+
+  it('falls back to the storefront currency for an empty basket', () => {
+    const result = resolveBlockBindings({
+      block: textBlock({ properties: { dataBinding: 'basket.totalAmount' } }),
+      pageContext: basketContext({ currency: '', items: [], isEmpty: true }),
+      currency: 'GBP'
+    });
+
+    expect(result.value).toBe('1.299,90 GBP');
+  });
+
+  it('leaves a non-money field alone', () => {
+    const result = resolveBlockBindings({
+      block: textBlock({ properties: { dataBinding: 'basket.voucherCode' } }),
+      pageContext: basketContext()
+    });
+
+    expect(result.value).toBe('WELCOME');
+  });
+
+  it('formats a money field on any page root, not just the basket', () => {
+    const result = resolveBlockBindings({
+      block: textBlock({ properties: { dataBinding: 'product.price' } }),
+      pageContext: { product: { price: '499.5', currency: 'TRY' } }
+    });
+
+    expect(result.value).toBe('499,50 TL');
+  });
+});

package/src/utils/page-context-discovery.ts

@@ -1,3 +1,5 @@
+import { FieldSemantic, readFieldSemantic } from './field-semantics';
+
 type DiscoveryValueType =
   | 'string'
   | 'number'
@@ -10,6 +12,12 @@ export interface PageContextDiscoveryEntry {
   path: string;
   kind: 'scalar' | 'array';
   valueType: DiscoveryValueType;
+  /**
+   * What the field means, which is what a designer needs and what `valueType`
+   * cannot tell them: commerce publishes money, an image URL and a product
+   * title as three indistinguishable strings.
+   */
+  semantic: FieldSemantic;
   sample?: string;
 }
 
@@ -113,6 +121,7 @@ export const createPageContextDiscovery = (
         path,
         kind: 'array',
         valueType: 'array',
+        semantic: readFieldSemantic(path, 'array'),
         sample: formatSample(value)
       });
 
@@ -136,10 +145,13 @@ export const createPageContextDiscovery = (
       return;
     }
 
+    const valueType = getValueType(value);
+
     pushEntry({
       path,
       kind: 'scalar',
-      valueType: getValueType(value),
+      valueType,
+      semantic: readFieldSemantic(path, valueType),
       sample: formatSample(value)
     });
   };