import { Card } from "@components/Card.tsx";
import { Movie } from "@lib/resource/movies.ts";
import { Series } from "@lib/resource/series.ts";

export function MovieCard({ movie }: { movie: Movie }) {
  const { meta: { image = "/placeholder.svg" } = {} } = movie;

  const imageUrl = image?.startsWith("Media/movies/")
    ? `/api/images?image=${image}&width=200&height=200`
    : image;

  return (
    <Card
      title={movie.name}
      image={imageUrl}
      link={`/movies/${movie.id}`}
    />
  );
}

export function SeriesCard({ series }: { series: Series }) {
  const { meta: { image = "/placeholder.svg" } = {} } = series;

  const imageUrl = image?.startsWith("Media/series/")
    ? `/api/images?image=${image}&width=200&height=200`
    : image;

  return (
    <Card
      title={series.name}
      image={imageUrl}
      link={`/series/${series.id}`}
    />
  );
}
