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

interface Props {
  audio: EndpointAudioPreview;
}

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

const {
  audio: { id, translations, attributes, filename, thumbnail, duration },
} = Astro.props;

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

const attributesWithMeta = [
  ...attributes,
  {
    title: t("global.media.attributes.duration"),
    icon: "material-symbols:hourglass-empty",
    values: [{ name: formatDuration(duration) }],
  },
];
---

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

<GenericPreview
  pretitle={pretitle}
  title={title}
  subtitle={subtitle}
  lang={language}
  thumbnail={thumbnail}
  href={getLocalizedUrl(`/audios/${id}`)}
  attributes={attributesWithMeta}
  icon="material-symbols:music-note"
  iconHoverLabel={t("global.collections.audios", { count: 1 })}
  smallTitle={title === filename}
/>