69 lines
2.0 KiB
Plaintext
69 lines
2.0 KiB
Plaintext
---
|
|
import AppLayout from "components/AppLayout/AppLayout.astro";
|
|
import Lightbox from "components/Lightbox.astro";
|
|
import { getI18n } from "src/i18n/i18n";
|
|
import { payload } from "src/shared/payload/payload-sdk";
|
|
import { formatInlineTitle, formatRichTextToString } from "src/utils/format";
|
|
import { fetchOr404 } from "src/utils/responses";
|
|
|
|
const { id } = Astro.params;
|
|
const image = await fetchOr404(() => payload.getImageByID(id!));
|
|
if (image instanceof Response) {
|
|
return image;
|
|
}
|
|
|
|
const { getLocalizedMatch, formatDate, t } = await getI18n(Astro.locals.currentLocale);
|
|
const { filename, translations, tagGroups, credits, createdAt, updatedAt } = image;
|
|
|
|
const { pretitle, title, subtitle, description } =
|
|
translations.length > 0
|
|
? getLocalizedMatch(translations)
|
|
: { pretitle: undefined, title: filename, subtitle: undefined, description: undefined };
|
|
|
|
const tagsAndAttributes = [
|
|
...tagGroups,
|
|
...(filename && title !== filename
|
|
? [
|
|
{
|
|
title: t("global.media.attributes.filename"),
|
|
icon: "material-symbols:unknown-document-outline",
|
|
values: [filename],
|
|
withBorder: false,
|
|
},
|
|
]
|
|
: []),
|
|
{
|
|
title: t("global.media.attributes.createdAt"),
|
|
icon: "material-symbols:calendar-add-on-outline",
|
|
values: [formatDate(new Date(createdAt))],
|
|
withBorder: false,
|
|
},
|
|
{
|
|
title: t("global.media.attributes.updatedAt"),
|
|
icon: "material-symbols:edit-calendar",
|
|
values: [formatDate(new Date(updatedAt))],
|
|
withBorder: false,
|
|
},
|
|
];
|
|
---
|
|
|
|
{/* ------------------------------------------- HTML ------------------------------------------- */}
|
|
|
|
<AppLayout
|
|
openGraph={{
|
|
thumbnail: image,
|
|
description: description ? formatRichTextToString(description) : undefined,
|
|
title: formatInlineTitle({ pretitle, title, subtitle }),
|
|
}}>
|
|
<Lightbox
|
|
image={image}
|
|
pretitle={pretitle}
|
|
title={title}
|
|
subtitle={subtitle}
|
|
description={description}
|
|
filename={filename}
|
|
tagGroups={tagsAndAttributes}
|
|
credits={credits}
|
|
/>
|
|
</AppLayout>
|