summaryrefslogtreecommitdiff
path: root/src/components/templates
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/templates')
-rw-r--r--src/components/templates/SimplePostList.astro91
1 files changed, 64 insertions, 27 deletions
diff --git a/src/components/templates/SimplePostList.astro b/src/components/templates/SimplePostList.astro
index 164b32b..6d05a1f 100644
--- a/src/components/templates/SimplePostList.astro
+++ b/src/components/templates/SimplePostList.astro
@@ -1,25 +1,45 @@
---
import Date from "@components/organisms/Date.astro";
import KeywordsList from "@components/organisms/KeywordsList.astro";
-import { getFirstUserID, getLastUpdate } from "@lib/collection/helpers";
-import type { Original } from "@lib/collection/schemas";
-import type { z } from "astro:content";
+import {
+ getFirstUserID,
+ getLastUpdate,
+ getTranslationOriginal,
+ isMicro,
+ isTranslation,
+} from "@lib/collection/helpers";
import type { CollectionEntry } from "astro:content";
interface Props {
- posts: (CollectionEntry<"blog"> & { data: z.infer<typeof Original> })[];
+ posts: CollectionEntry<"blog">[];
+ small?: boolean;
+ dateOptions?: Intl.DateTimeFormatOptions;
}
-const { posts } = Astro.props;
+const {
+ posts,
+ small = false,
+ dateOptions = { year: "numeric", month: "long", day: "numeric" },
+} = Astro.props;
---
-<ol>
+<ol class:list={{ "remove-nums": !small }}>
{
- await Promise.all(posts.map(async (post) => {
- const { id, data } = post;
- const { title, description, lang, keywords } = data;
- const { name, email, entity } = await getFirstUserID(post);
- const display = name ?? email ?? entity;
- return (
+ await Promise.all(
+ posts.map(
+ async (post) => {
+ const { id, data } = post;
+ const { title, lang } = data;
+ const description = isMicro(post)
+ ? post.rendered?.html
+ : ("description" in data ? data.description : undefined);
+ const keywords = isTranslation(post)
+ ? await getTranslationOriginal(post).then((x) =>
+ x?.data?.keywords
+ )
+ : ("keywords" in data ? data.keywords : undefined);
+ const { name, email, entity } = await getFirstUserID(post);
+ const display = name ?? email ?? entity;
+ return (
<li>
<article
itemprop="blogPost"
@@ -29,36 +49,39 @@ const { posts } = Astro.props;
<h3>
<a href={`/blog/read/${id}`} itemprop="headline name">{title}</a>
</h3>
- <div itemprop="abstract">
- {
- description &&
- description.split("\n\n").map((paragraph) => (
- <p class="small">{paragraph}</p>
- ))
- }
- </div>
+ {
+ description && (
+ <div itemprop="abstract">
+ {
+ isMicro(post)
+ ? <Fragment set:html={description} />
+ : description.split("\n\n").map((
+ paragraph,
+ ) => <p class:list={{ small }}>{paragraph}</p>)
+ }
+ </div>
+ )
+ }
<footer class="small">
<Date
date={getLastUpdate(post)}
locales={lang}
- options={{
- year: "numeric",
- month: "long",
- day: "numeric",
- }}
+ options={dateOptions}
itemprop="dateModified"
/><span
itemprop="author"
itemscope
itemtype="https://schema.org/Person"
><span itemprop="alternateName">{display}</span></span>
- <KeywordsList {keywords} />
+ {Array.isArray(keywords) && <KeywordsList {keywords} />}
</footer>
</article>
</li>
);
- }))
+ },
+ ),
+ )
}
</ol>
@@ -82,6 +105,20 @@ const { posts } = Astro.props;
}
}
}
+
+ & > li:not(:first-of-type) {
+ border-block-start: 1px solid var(--color-dark);
+ }
+ }
+
+ ol.remove-nums {
+ margin-inline-start: 0;
+ & > li {
+ margin-inline-end: calc(var(--size-7) * 1em);
+ & > article {
+ padding-inline-end: 0;
+ }
+ }
}
@media (width >= 40rem) {