---
import { t, astroI18n } from "astro-i18n";
astroI18n.init(Astro);

const { item } = Astro.props;

function formatDate(date) {
	const options = { year: "numeric", month: "long", day: "numeric" };
	return new Date(date).toLocaleDateString(astroI18n.langCode, options);
}

// Needed because browser will transform the value to a readable english date in 'datetime' if not forced
// see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/time#attr-datetime for valid formats
function rawDate(date) {
	return new Date(date).toISOString();
}
---

<div class="meta">
	{
		!!item.createdAt && (
			<p class="meta__date">
				{t("meta.publication")}&nbsp;:
				<time datetime={rawDate(item.createdAt)}>
					{formatDate(item.createdAt)}
				</time>
			</p>
		)
	}
	{
		formatDate(item.createdAt) != formatDate(item.updatedAt) &&
			!!item.createdAt &&
			!!item.updatedAt && (
				<p class="meta__date">
					{t("meta.modification")}&nbsp;:
					<time datetime={rawDate(item.updatedAt)}>
						{formatDate(item.updatedAt)}
					</time>
				</p>
			)
	}
	{
		!item.createdAt && !!item.updatedAt && (
			<p class="meta__date">
				{t("meta.modification")}&nbsp;:
				<time datetime={rawDate(item.updatedAt)}>
					{formatDate(item.updatedAt)}
				</time>
			</p>
		)
	}
</div>

<style>
	.meta {
		font-size: var(--size--1);
	}
	.meta__date {
		margin: var(--space-3xs) 0;
	}
</style>