import React from 'react';

const MD_LINK_REGEX = /\[([^\]\r\n]+)\]\((https?:\/\/[^\s)]+|\/[^\s)]+)\)/;

const parseCache = new Map<string, React.ReactNode[]>();

function parseMarkdownLinks(text: string): React.ReactNode[] {
  if (!text) return [];
  if (parseCache.has(text)) return parseCache.get(text)!;

  const parts = text.split(MD_LINK_REGEX);
  const elements: React.ReactNode[] = [];

  for (let i = 0; i < parts.length; i += 3) {
    if (parts[i]) {
      elements.push(parts[i]);
    }

    if (i + 1 < parts.length) {
      const label = parts[i + 1];
      const url = parts[i + 2];

      elements.push(
        <a
          key={`link-${i}`}
          href={url}
          target="_blank"
          rel="noopener noreferrer"
          className="inline-flex items-center gap-[2px] font-semibold focus:text-current hover:text-current border-b-px border-current/10"
        >
          {label}
          {<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" className="min-w-3 max-w-3 min-h-3 max-h-3">
  <path fillRule="evenodd" d="M5.22 14.78a.75.75 0 0 0 1.06 0l7.22-7.22v5.69a.75.75 0 0 0 1.5 0v-7.5a.75.75 0 0 0-.75-.75h-7.5a.75.75 0 0 0 0 1.5h5.69l-7.22 7.22a.75.75 0 0 0 0 1.06Z" clipRule="evenodd" />
</svg>
}
        </a>
      );
    }
  }

  parseCache.set(text, elements);
  return elements;
}

export const InlineLinkText = React.memo(function InlineLinkText({ text }: { text: string }) {
  return <>{parseMarkdownLinks(text)}</>;
});