// Preprocess source markdown/MDX so Payload's convertMarkdownToLexical can pick up our blocks.
// - <ListCallout> is renamed to <Callout> (block slug `callout` is matched case-insensitively)
// - Markdown image references `![alt](/images/x.png)` become `<MediaBlock media="<id>" caption="alt" />`
// - HTML <img src="/images/x.png" alt="..."/> becomes the same MediaBlock JSX
// - <LinkPreview .../> and <Callout>...</Callout> JSX are passed through unchanged

const MD_IMAGE = /!\[([^\]]*)\]\((\/images\/[^)]+)\)/g
const HTML_IMG = /<img\b[^>]*\/?>/g

function escapeAttr(s: string): string {
  return s.replace(/"/g, '&quot;')
}

function mediaBlockTag(id: string | number, alt: string): string {
  const props = [`media="${id}"`]
  if (alt) props.push(`caption="${escapeAttr(alt)}"`)
  return `<MediaBlock ${props.join(' ')}/>`
}

export function preprocessMdx(
  source: string,
  imageMap?: Map<string, string | number>,
): string {
  let out = source
    .replace(/<ListCallout(\s|>)/g, '<Callout$1')
    .replace(/<\/ListCallout>/g, '</Callout>')

  if (imageMap && imageMap.size > 0) {
    out = out.replace(MD_IMAGE, (full, alt: string, src: string) => {
      const id = imageMap.get(src)
      return id === undefined ? full : mediaBlockTag(id, alt)
    })

    out = out.replace(HTML_IMG, (full) => {
      const src = full.match(/src=["']([^"']+)["']/)?.[1]
      if (!src) return full
      const id = imageMap.get(src)
      if (id === undefined) return full
      const alt = full.match(/alt=["']([^"']*)["']/)?.[1] ?? ''
      return mediaBlockTag(id, alt)
    })
  }

  return out
}