import FavoriteBtn from "@/common/components/FavoriteBtn";
import ImgCard from "@/common/components/ImgCard";
import Link from "next/link";
import { primaryBtn } from "../classes";

interface IMovieCardProps {
  movie: IMovieSearch;
}

export default function MovieCard({ movie }: IMovieCardProps) {
  return (
    <ImgCard
      classNames={`w-full  h-full flex flex-col justify-between`}
      width={140}
      height={160}
      src={movie.Poster !== "N/A" ? movie.Poster : ""}
      alt={`${movie.Title} Movie Poster`}
    >
      <div className="flex flex-col gap-4">
        <h3 className=" text-lg font-semibold">{movie.Title}</h3>
        <p data-testid='MovieCard-Year' className=" text-sm text-gray-700">Circa: {movie.Year}</p>

        <div className="flex gap-3  justify-around">
          <Link href={`/Movie?i=${movie.imdbID}`}>
            <button className={primaryBtn}>Movie Details</button>
          </Link>
          <FavoriteBtn movie={movie} />
        </div>
      </div>
    </ImgCard>
  );
}