import Link from "next/link";
import { CaseCover } from "./CaseCover";
import { getCaseMedia } from "./case-media";

/**
 * Capa do case dentro de um cartão: a imagem leva ao case, mas fica fora da leitura e da ordem de tabulação,
 * porque o link de texto do mesmo cartão já leva ao mesmo lugar. Sem captura gravada, não mostra nada.
 */
export function CaseCoverLink({
  id,
  title,
  demoUrl,
  sizes = "(min-width: 1024px) 560px, 100vw",
  priority = false,
  prefetch,
}: {
  id: string;
  title: string;
  demoUrl?: string | null;
  sizes?: string;
  priority?: boolean;
  prefetch?: boolean;
}) {
  if (!getCaseMedia(id, "desktop")) return null;

  return (
    <Link
      href={`/cases/${id}`}
      aria-hidden="true"
      tabIndex={-1}
      prefetch={prefetch}
      className="mb-sp-5 block"
    >
      <CaseCover
        id={id}
        title={title}
        demoUrl={demoUrl}
        sizes={sizes}
        priority={priority}
      />
    </Link>
  );
}