import type { ContentItem, ContentView } from '../types';

/**
 * Parse {{field}} and {{x.field}} template syntax with actual data
 * @param {string} content - The template content
 * @param {Object} dataItem - The data item to bind
 * @returns {string} Parsed content with actual data values
 */
export const parseTemplateContent = (
  content: string,
  dataItem: Record<string, any> | null
): string => {
  if (!content || !dataItem) return content || '';

  // Replace {{field}} with actual data values (new syntax)
  let parsedContent = content.replace(
    /\{\{([^}]+)\}\}/g,
    (match, fieldName) => {
      const trimmedField = fieldName.trim();
      const value = dataItem[trimmedField];
      return value !== undefined && value !== null ? String(value) : match;
    }
  );

  // Also support legacy {{x.field}} syntax for backward compatibility
  parsedContent = parsedContent.replace(
    /\{\{(\w+)\.(\w+)\}\}/g,
    (match, _, fieldName) =>
      dataItem[fieldName] !== undefined ? String(dataItem[fieldName]) : match
  );

  return parsedContent;
};

/**
 * Get element content with data binding support
 * @param {ContentItem} element - The element to get content for
 * @param {Object} dataItem - The data item for binding
 * @returns {string} The resolved content
 */
export const getElementContent = (
  element: ContentItem,
  dataItem: Record<string, any>
): string => {
  const elementData = element.data as any;
  const properties = elementData.properties || {};

  return parseTemplateContent(
    properties.textContent || properties.buttonText || '',
    dataItem
  );
};

/**
 * Get element image URL with data binding support
 * @param {ContentItem} element - The element to get image URL for
 * @param {Object} dataItem - The data item for binding
 * @returns {string} The resolved image URL
 */
export const getElementImageUrl = (
  element: ContentItem,
  dataItem: Record<string, any>
): string => {
  const elementData = element.data as any;
  const properties = elementData.properties || {};

  return parseTemplateContent(properties.imageUrl || '', dataItem);
};

/**
 * Get element image alt text with data binding support
 * @param {ContentItem} element - The element to get image alt text for
 * @param {Object} dataItem - The data item for binding
 * @returns {string} The resolved image alt text
 */
export const getElementImageAltText = (
  element: ContentItem,
  dataItem: Record<string, any>
): string => {
  const elementData = element.data as any;
  const properties = elementData.properties || {};

  return parseTemplateContent(properties.imageAltText || 'Image', dataItem);
};

export const getChildren = (
  parentItemId?: string,
  contentView?: ContentView | null
) => {
  if (!contentView || !parentItemId) return [];

  return contentView.contents
    .filter((item) => item.isVisible && item.parentItemId === parentItemId)
    .sort((a, b) => a.order - b.order);
};