fix: resolve authors rendering as [object Object]

src/components/AuthorCard/index.astro

@@ -1,6 +1,5 @@
 ---
-import { getEntry } from 'astro:content';
-
+import { getAuthor } from '../../utils/authors.js';
 import Avatar from '../Avatar/index.astro';
 
 import './styles.css';
@@ -13,9 +12,8 @@ const { author } = Astro.props;
 
 const BLOG_URL = Astro.site?.href;
 
-// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-const { data: { avatar, avatarAlt, name, pronouns }, render } = (await getEntry('authors', author))!;
-const description = await render();
+const { data: { avatar, avatarAlt, name, pronouns }, render } = await getAuthor(author);
+const { Content } = await render();
 ---
 <div class="author-card" itemprop="author" itemscope itemtype="https://schema.org/Person">
 	<a class="author-picture" href={`${BLOG_URL}authors/${author}`}>
@@ -30,7 +28,6 @@ const description = await render();
 	</div>
 
 	<div class="author-bio">
-		{/* eslint-disable-next-line astro/no-set-html-directive */}
-		<Fragment set:html={description} />
+		<Content />
 	</div>
 </div>

src/pages/authors/[author].astro

@@ -1,6 +1,6 @@
 ---
 import type { GetStaticPaths, InferGetStaticPropsType } from 'astro';
-import { getCollection } from 'astro:content';
+import { listAllAuthors } from '../../utils/authors.js';
 
 import Avatar from '../../components/Avatar/index.astro';
 import InternalPageLayout from '../../layouts/InternalPage/index.astro';
@@ -10,7 +10,7 @@ import '../../styles/authors.css';
 // eslint-disable-next-line @typescript-eslint/no-use-before-define
 type Props = InferGetStaticPropsType<typeof getStaticPaths>;
 
-export const getStaticPaths = (async () => (await getCollection('authors')).map(((author) => ({
+export const getStaticPaths = (async () => (await listAllAuthors()).map(((author) => ({
 	params: { author: author.slug },
 	props: { ...author.data, render: author.render, slug: author.slug }
 })))) satisfies GetStaticPaths;
@@ -22,7 +22,7 @@ const {
 	pronouns,
 	socialMedia
 } = Astro.props;
-const description = await render();
+const { Content } = await render();
 
 ---
 <InternalPageLayout
@@ -57,8 +57,7 @@ const description = await render();
 	<meta itemprop="name" content={name} />
 
 	<article id="author-bio">
-		{/* eslint-disable-next-line astro/no-set-html-directive */}
-		<Fragment set:html={description} />
+		<Content />
 	</article>
 </div>
 </InternalPageLayout>

src/utils/authors.ts

@@ -0,0 +1,12 @@
+import { type CollectionEntry, getCollection, getEntry } from 'astro:content';
+
+export async function listAllAuthors() {
+	const authorEntries = await getCollection('authors');
+	const authors = authorEntries.sort((first, second) => first.data.name.localeCompare(second.data.name, 'en-US', { usage: 'sort' }));
+
+	return authors as unknown as CollectionEntry<'authors'>[];
+}
+
+export async function getAuthor(authorId: string) {
+	return getEntry('authors', authorId) as unknown as Promise<CollectionEntry<'authors'> | undefined>;
+}