import clsx from "clsx";
import Link from "next/link";
import type { ElementType } from "react";

interface NovelCoverProps {
  component?: ElementType;
  className?: string;
  href?: string;
  title?: string;
  alt?: string;
  src?: string;
}

export default function NovelCover(props: NovelCoverProps) {
  let { component: Component = Link } = props;
  const { className, alt = "", src = "", ...other } = props;

  if (!other.href) {
    Component = "div";
  }

  return (
    <Component className={clsx("novel-cover", className)} {...other}>
      <img
        src={src}
        alt={alt || other.title || ""}
        draggable="false"
        loading="lazy"
      />
    </Component>
  );
}