---
import GenericPreview from "components/Previews/GenericPreview.astro";
import { getI18n } from "src/i18n/i18n";
import type { EndpointImage } from "src/shared/payload/payload-sdk";

interface Props {
  image: EndpointImage;
}

const { getLocalizedMatch, getLocalizedUrl, t } = await getI18n(Astro.locals.currentLocale);

const {
  image: thumbnail,
  image: { id, translations, tagGroups, filename },
} = Astro.props;

const { pretitle, title, subtitle } =
  translations.length > 0
    ? getLocalizedMatch(translations)
    : { pretitle: undefined, title: filename, subtitle: undefined };
---

{/* ------------------------------------------- HTML ------------------------------------------- */}

<GenericPreview
  pretitle={pretitle}
  title={title}
  subtitle={subtitle}
  thumbnail={thumbnail}
  href={getLocalizedUrl(`/images/${id}`)}
  tagGroups={tagGroups}
  icon="material-symbols:imagesmode"
  iconHoverLabel={t("global.previewTypes.image")}
  smallTitle={title === filename}
/>