@akinon/pz-theme 2.0.0-beta.21

package/src/utils/iterator-utils.ts

@@ -0,0 +1,617 @@
+import { Block } from '../theme-block';
+
+interface BindingContext {
+  sectionDataSource?: any;
+  pageContext?: Record<string, unknown> | null;
+  isDesigner?: boolean;
+}
+
+interface IteratorOptions extends BindingContext {
+  iteratorBlock: Block;
+  forceIteratorCount?: number;
+  forceIteratorOffset?: number;
+}
+
+const PAGE_CONTEXT_DATA_SOURCE_TYPE = 'page-context';
+
+const DEFAULT_BINDING_TARGETS: Record<string, string> = {
+  text: 'value',
+  image: 'value',
+  link: 'href',
+  button: 'value',
+  input: 'placeholder'
+};
+
+const isRecord = (value: unknown): value is Record<string, unknown> =>
+  typeof value === 'object' && value !== null && !Array.isArray(value);
+
+const getValueAtPath = (source: unknown, path: string): unknown => {
+  if (!path.trim()) return source;
+
+  const tokens = path.match(/[^.[\]]+|\[(\d+)\]/g) || [];
+  let value: unknown = source;
+
+  for (const token of tokens) {
+    if (value === undefined || value === null) {
+      return undefined;
+    }
+
+    if (token.startsWith('[') && token.endsWith(']')) {
+      const index = Number.parseInt(token.slice(1, -1), 10);
+      value = Array.isArray(value) ? value[index] : undefined;
+      continue;
+    }
+
+    value = (value as Record<string, unknown>)?.[token];
+  }
+
+  return value;
+};
+
+const getItemBindingTarget = (block: Block): string => {
+  const explicitTarget = block.properties?.dataBindingTarget;
+  if (typeof explicitTarget === 'string' && explicitTarget.trim()) {
+    return explicitTarget.trim();
+  }
+
+  if (block.properties?.tag === 'a') {
+    return 'href';
+  }
+
+  return DEFAULT_BINDING_TARGETS[block.type] || 'value';
+};
+
+const getCollectionBindingRoot = (
+  sectionDataSource: any,
+  isDesigner: boolean
+): Record<string, unknown> | null => {
+  if (!sectionDataSource?.details?.collection) {
+    return null;
+  }
+
+  const isEditorMode =
+    isDesigner && typeof window !== 'undefined' && window.parent !== window;
+  const collection = sectionDataSource.details.collection;
+  const candidates = isEditorMode
+    ? [collection?.products, collection?.data]
+    : [collection?.data, collection?.products];
+
+  for (const candidate of candidates) {
+    if (Array.isArray(candidate)) {
+      return {
+        products: candidate,
+        items: candidate,
+        data: candidate
+      };
+    }
+
+    if (isRecord(candidate)) {
+      return candidate;
+    }
+  }
+
+  return null;
+};
+
+const getStaticBindingRoot = (
+  sectionDataSource: any
+): Record<string, unknown> | null => {
+  const staticSource = sectionDataSource?.details?.static;
+  if (!staticSource) {
+    return null;
+  }
+
+  return {
+    items: staticSource.data || [],
+    data: staticSource.data || [],
+    name: staticSource.name
+  };
+};
+
+const getSectionBindingRoot = ({
+  sectionDataSource,
+  pageContext,
+  isDesigner = false
+}: BindingContext): Record<string, unknown> | null => {
+  if (
+    sectionDataSource?.type === PAGE_CONTEXT_DATA_SOURCE_TYPE &&
+    isRecord(pageContext)
+  ) {
+    return pageContext;
+  }
+
+  const collectionRoot = getCollectionBindingRoot(
+    sectionDataSource,
+    isDesigner
+  );
+  if (collectionRoot) {
+    return collectionRoot;
+  }
+
+  const staticRoot = getStaticBindingRoot(sectionDataSource);
+  if (staticRoot) {
+    return staticRoot;
+  }
+
+  return null;
+};
+
+const normalizeScalarValue = (
+  value: unknown,
+  target: string,
+  blockType: string
+): string | undefined => {
+  if (value == null) {
+    return undefined;
+  }
+
+  if (typeof value === 'string') {
+    return value;
+  }
+
+  if (typeof value === 'number' || typeof value === 'boolean') {
+    return String(value);
+  }
+
+  if (Array.isArray(value)) {
+    return undefined;
+  }
+
+  if (!isRecord(value)) {
+    return undefined;
+  }
+
+  if (target === 'href' || target === 'url' || blockType === 'image') {
+    const urlCandidate = [value.url, value.absolute_url, value.image].find(
+      (candidate) => typeof candidate === 'string'
+    );
+
+    if (typeof urlCandidate === 'string') {
+      return urlCandidate;
+    }
+  }
+
+  const scalarCandidate = [
+    value.title,
+    value.name,
+    value.label,
+    value.value,
+    value.alt,
+    value.description,
+    value.price,
+    value.retailPrice,
+    value.url,
+    value.absolute_url
+  ].find(
+    (candidate) =>
+      typeof candidate === 'string' ||
+      typeof candidate === 'number' ||
+      typeof candidate === 'boolean'
+  );
+
+  if (
+    typeof scalarCandidate === 'string' ||
+    typeof scalarCandidate === 'number' ||
+    typeof scalarCandidate === 'boolean'
+  ) {
+    return String(scalarCandidate);
+  }
+
+  return undefined;
+};
+
+const parsePriceValue = (value: unknown): number => {
+  if (typeof value === 'number' && Number.isFinite(value)) return value;
+  if (typeof value !== 'string') return 0;
+
+  const cleaned = value.trim().replace(/[^\d,.-]/g, '');
+  if (!cleaned) return 0;
+
+  let normalized = cleaned;
+  const hasComma = normalized.includes(',');
+  const hasDot = normalized.includes('.');
+
+  if (hasComma && hasDot) {
+    const lastComma = normalized.lastIndexOf(',');
+    const lastDot = normalized.lastIndexOf('.');
+    normalized =
+      lastComma > lastDot
+        ? normalized.replace(/\./g, '').replace(',', '.')
+        : normalized.replace(/,/g, '');
+  } else if (hasComma) {
+    const unsigned = normalized.replace(/^-/, '');
+    const isThousandsPattern = /^\d{1,3}(,\d{3})+$/.test(unsigned);
+    normalized = isThousandsPattern
+      ? normalized.replace(/,/g, '')
+      : normalized.replace(/,/g, '.');
+  }
+
+  const parsed = Number(normalized);
+  return Number.isFinite(parsed) ? parsed : 0;
+};
+
+const escapeHtml = (value: string): string =>
+  value
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;');
+
+const formatDisplayPrice = (value: unknown): string => {
+  if (typeof value === 'number' && Number.isFinite(value)) {
+    const hasDecimals = Math.abs(value % 1) > 0.00001;
+    return value.toLocaleString('tr-TR', {
+      minimumFractionDigits: hasDecimals ? 2 : 0,
+      maximumFractionDigits: 2
+    });
+  }
+
+  if (typeof value !== 'string') return '0';
+  const raw = value.trim();
+  if (!raw) return '0';
+  if (/[A-Za-z]/.test(raw)) return raw;
+
+  const parsed = parsePriceValue(raw);
+  const hasDecimals = Math.abs(parsed % 1) > 0.00001;
+  return parsed.toLocaleString('tr-TR', {
+    minimumFractionDigits: hasDecimals ? 2 : 0,
+    maximumFractionDigits: 2
+  });
+};
+
+const normalizeCurrencyLabel = (rawCurrency: unknown): string => {
+  if (typeof rawCurrency !== 'string') return 'TL';
+  const normalized = rawCurrency.trim().toUpperCase();
+  if (!normalized || normalized === 'TRY' || normalized === 'TL') return 'TL';
+  return normalized;
+};
+
+const getPriceWithCurrency = (value: unknown, currency: unknown): string => {
+  const amount = formatDisplayPrice(value);
+  const currencyLabel = normalizeCurrencyLabel(currency);
+
+  if (
+    amount.toUpperCase().includes(currencyLabel) ||
+    /[A-Za-z]{2,}/.test(amount)
+  ) {
+    return amount;
+  }
+
+  return `${amount} ${currencyLabel}`;
+};
+
+const buildProductPriceHtml = (
+  productData: Record<string, unknown>
+): string => {
+  const activePrice =
+    ((productData as any)?.active_price as
+      | Record<string, unknown>
+      | undefined) || {};
+  const currentRaw = activePrice?.price ?? (productData as any)?.price;
+  const retailRaw =
+    activePrice?.retail_price ?? (productData as any)?.retail_price;
+  const currency =
+    activePrice?.currency_type ??
+    (productData as any)?.currency_type ??
+    (productData as any)?.currency;
+
+  const currentNumeric = parsePriceValue(currentRaw);
+  const retailNumeric = parsePriceValue(retailRaw);
+
+  const currentText = escapeHtml(getPriceWithCurrency(currentRaw, currency));
+  const retailText = escapeHtml(getPriceWithCurrency(retailRaw, currency));
+
+  if (retailNumeric > 0 && retailNumeric > currentNumeric) {
+    return `<span style="display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;"><span style='color:#6b7280;text-decoration:line-through;font-weight:400;'>${retailText}</span><span style='font-weight:600;'>${currentText}</span></span>`;
+  }
+
+  return currentText;
+};
+
+const isPriceBinding = (dataBinding: string): boolean => {
+  const path = dataBinding.replace('item.', '');
+  return (
+    path === 'active_price.price' || path === 'price' || path === 'retail_price'
+  );
+};
+
+const applyResolvedBinding = (
+  block: Block,
+  resolvedValue: unknown,
+  bindingPath: string
+): Block => {
+  const target = getItemBindingTarget(block);
+  const nextBlock: Block = {
+    ...block,
+    properties: block.properties ? { ...block.properties } : block.properties
+  };
+
+  if (
+    target === 'value' &&
+    block.type === 'text' &&
+    bindingPath.startsWith('item.') &&
+    isPriceBinding(bindingPath) &&
+    isRecord(resolvedValue)
+  ) {
+    nextBlock.value = buildProductPriceHtml(resolvedValue);
+    return nextBlock;
+  }
+
+  const normalizedValue = normalizeScalarValue(
+    resolvedValue,
+    target,
+    block.type
+  );
+  if (normalizedValue === undefined) {
+    return nextBlock;
+  }
+
+  switch (target) {
+    case 'href':
+      nextBlock.properties = {
+        ...(nextBlock.properties || {}),
+        href: normalizedValue
+      };
+      return nextBlock;
+
+    case 'url':
+      nextBlock.properties = {
+        ...(nextBlock.properties || {}),
+        url: normalizedValue
+      };
+      return nextBlock;
+
+    case 'placeholder':
+      nextBlock.properties = {
+        ...(nextBlock.properties || {}),
+        placeholder: normalizedValue
+      };
+      return nextBlock;
+
+    case 'alt':
+      nextBlock.properties = {
+        ...(nextBlock.properties || {}),
+        alt: normalizedValue
+      };
+      return nextBlock;
+
+    default:
+      nextBlock.value = normalizedValue;
+      return nextBlock;
+  }
+};
+
+export const resolveBlockBindings = ({
+  block,
+  sectionDataSource,
+  pageContext,
+  isDesigner = false
+}: BindingContext & { block: Block }): Block => {
+  const bindingRoot = getSectionBindingRoot({
+    sectionDataSource,
+    pageContext,
+    isDesigner
+  });
+
+  const walk = (sourceBlock: Block): Block => {
+    const nextBlock: Block = {
+      ...sourceBlock,
+      properties: sourceBlock.properties
+        ? { ...sourceBlock.properties }
+        : sourceBlock.properties
+    };
+
+    const bindingPath =
+      typeof nextBlock.properties?.dataBinding === 'string'
+        ? nextBlock.properties.dataBinding.trim()
+        : '';
+
+    let resolvedBlock = nextBlock;
+    if (bindingRoot && bindingPath && !bindingPath.startsWith('item.')) {
+      const resolvedValue = getValueAtPath(bindingRoot, bindingPath);
+      if (resolvedValue !== undefined) {
+        resolvedBlock = applyResolvedBinding(
+          nextBlock,
+          resolvedValue,
+          bindingPath
+        );
+      }
+    }
+
+    if (resolvedBlock.blocks && resolvedBlock.blocks.length > 0) {
+      resolvedBlock.blocks = resolvedBlock.blocks.map(walk);
+    }
+
+    return resolvedBlock;
+  };
+
+  return walk(block);
+};
+
+const parsePositiveNumber = (value: unknown, fallback: number): number => {
+  if (typeof value === 'number' && Number.isFinite(value)) {
+    return Math.max(0, Math.floor(value));
+  }
+  if (typeof value === 'string') {
+    const parsed = Number(value);
+    if (Number.isFinite(parsed)) {
+      return Math.max(0, Math.floor(parsed));
+    }
+  }
+  return fallback;
+};
+
+const getIteratorItems = ({
+  sectionDataSource,
+  dataPath,
+  isDesigner = false,
+  pageContext
+}: BindingContext & { dataPath?: string }): Record<string, unknown>[] => {
+  const bindingRoot = getSectionBindingRoot({
+    sectionDataSource,
+    pageContext,
+    isDesigner
+  });
+
+  if (!bindingRoot) {
+    return [];
+  }
+
+  if (dataPath) {
+    const resolvedValue = getValueAtPath(bindingRoot, dataPath);
+    return Array.isArray(resolvedValue)
+      ? (resolvedValue as Record<string, unknown>[])
+      : [];
+  }
+
+  if (Array.isArray((bindingRoot as any).items)) {
+    return (bindingRoot as any).items;
+  }
+
+  if (Array.isArray((bindingRoot as any).products)) {
+    return (bindingRoot as any).products;
+  }
+
+  return [];
+};
+
+const replaceBlockValues = (
+  blockToReplace: Block,
+  itemData: Record<string, unknown>,
+  itemIndex: number
+): Block => {
+  const nextBlock: Block = {
+    ...blockToReplace,
+    properties: blockToReplace.properties
+      ? { ...blockToReplace.properties }
+      : blockToReplace.properties
+  };
+
+  const isPlaceholderMode = !itemData || Object.keys(itemData).length === 0;
+  const bindingPath =
+    typeof nextBlock.properties?.dataBinding === 'string'
+      ? nextBlock.properties.dataBinding.trim()
+      : '';
+
+  if (bindingPath && !isPlaceholderMode) {
+    const itemBindingPath = bindingPath.replace(/^item\./, '');
+    const resolvedValue = getValueAtPath(itemData, itemBindingPath);
+
+    if (resolvedValue !== undefined) {
+      if (
+        nextBlock.type === 'text' &&
+        bindingPath.startsWith('item.') &&
+        isPriceBinding(bindingPath)
+      ) {
+        nextBlock.value = buildProductPriceHtml(itemData);
+      } else {
+        return {
+          ...applyResolvedBinding(nextBlock, resolvedValue, bindingPath),
+          blocks: nextBlock.blocks?.map((childBlock) =>
+            replaceBlockValues(childBlock, itemData, itemIndex)
+          )
+        };
+      }
+    }
+  } else if (isPlaceholderMode && nextBlock.type === 'image') {
+    const placeholderImages = [
+      '/assets/images/product-placeholder-1.jpg',
+      '/assets/images/product-placeholder-2.jpg',
+      '/assets/images/product-placeholder-3.jpg',
+      '/assets/images/product-placeholder-4.jpg'
+    ];
+
+    const placeholderIndex = itemIndex % placeholderImages.length;
+
+    if (
+      nextBlock.value &&
+      typeof nextBlock.value === 'string' &&
+      nextBlock.value.includes('product-placeholder')
+    ) {
+      nextBlock.value = placeholderImages[placeholderIndex];
+    }
+  }
+
+  if (nextBlock.blocks && nextBlock.blocks.length > 0) {
+    nextBlock.blocks = nextBlock.blocks.map((childBlock) =>
+      replaceBlockValues(childBlock, itemData, itemIndex)
+    );
+  }
+
+  return nextBlock;
+};
+
+export const buildIteratorBlock = ({
+  iteratorBlock,
+  sectionDataSource,
+  pageContext,
+  isDesigner = false,
+  forceIteratorCount,
+  forceIteratorOffset
+}: IteratorOptions): Block => {
+  if (
+    !iteratorBlock.isIterator ||
+    !iteratorBlock.blocks ||
+    iteratorBlock.blocks.length === 0
+  ) {
+    return iteratorBlock;
+  }
+
+  const template = iteratorBlock.blocks[0];
+  const dataPath =
+    iteratorBlock.iteratorDataPath ||
+    iteratorBlock.properties?.iteratorDataPath;
+  const items = getIteratorItems({
+    sectionDataSource,
+    pageContext,
+    dataPath,
+    isDesigner
+  });
+
+  const useIteratorCount =
+    forceIteratorCount !== undefined
+      ? true
+      : iteratorBlock.properties?.useIteratorCount === true ||
+        iteratorBlock.properties?.useIteratorCount === 'true';
+  const iteratorCount =
+    forceIteratorCount !== undefined
+      ? Math.max(1, Math.floor(forceIteratorCount))
+      : parsePositiveNumber(iteratorBlock.properties?.iteratorCount, 1);
+  const iteratorOffset =
+    forceIteratorOffset !== undefined
+      ? Math.max(0, Math.floor(forceIteratorOffset))
+      : parsePositiveNumber(iteratorBlock.properties?.iteratorOffset, 0);
+
+  const displayItems =
+    items.length > 0
+      ? useIteratorCount
+        ? items.slice(iteratorOffset, iteratorOffset + iteratorCount)
+        : items
+      : [];
+
+  const actualCount =
+    displayItems.length > 0 ? displayItems.length : Math.max(iteratorCount, 1);
+
+  const clonedBlocks = Array.from({ length: actualCount }, (_, index) => {
+    const item = displayItems[index] || {};
+
+    const templateCopy: Block = {
+      ...template,
+      id: `${template.id}-clone-${index}`,
+      properties: template.properties
+        ? { ...template.properties }
+        : template.properties,
+      blocks: template.blocks
+        ? template.blocks.map((childBlock) => ({ ...childBlock }))
+        : undefined
+    };
+
+    return replaceBlockValues(templateCopy, item, index);
+  });
+
+  return {
+    ...iteratorBlock,
+    blocks: clonedBlocks
+  };
+};