import type { EntityLink } from "@/lib/catalog";

/** A record link. Glossary and preview render only when that optional data is present. */
export function RecordLink({ link }: { link: EntityLink }) {
  const anchor = link.href ? (
    <a className="underline" href={link.href}>{link.title}</a>
  ) : (
    <span>{link.title}</span>
  );
  return (
    <span className="record-link">
      {link.glossary ? (
        <span className="glossary" data-glossary={link.glossary}>
          {anchor}
          <span className="glossary-tip" role="tooltip">{link.glossary}</span>
        </span>
      ) : (
        anchor
      )}
      {link.preview ? (
        <span className="link-preview">
          <span className="preview-title">{link.preview.title}</span>
          <span className="preview-summary">{link.preview.summary}</span>
        </span>
      ) : null}
    </span>
  );
}