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

interface Props {
  page: EndpointPage;
}

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

const {
  page: { slug, translations, thumbnail, attributes, updatedAt },
} = Astro.props;

const { title, pretitle, subtitle } = getLocalizedMatch(translations);

const metaAttributes: Attribute[] = [
  {
    title: t("global.media.attributes.updatedAt"),
    icon: "material-symbols:edit-calendar",
    values: [{ name: formatDate(new Date(updatedAt)) }],
    withBorder: false,
  },
];
---

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

<GenericPreview
  title={title}
  pretitle={pretitle}
  subtitle={subtitle}
  thumbnail={thumbnail}
  href={getLocalizedUrl(`/pages/${slug}`)}
  attributes={[...attributes, ...metaAttributes]}
  icon="material-symbols:docs"
  iconHoverLabel={t("global.previewTypes.page")}
/>