summaryrefslogtreecommitdiff
path: root/src/components/widgets/BlogLatestPosts.astro
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/widgets/BlogLatestPosts.astro')
-rw-r--r--src/components/widgets/BlogLatestPosts.astro63
1 files changed, 63 insertions, 0 deletions
diff --git a/src/components/widgets/BlogLatestPosts.astro b/src/components/widgets/BlogLatestPosts.astro
new file mode 100644
index 0000000..28f66d4
--- /dev/null
+++ b/src/components/widgets/BlogLatestPosts.astro
@@ -0,0 +1,63 @@
+---
+import { APP_BLOG } from 'astrowind:config';
+
+import Grid from '~/components/blog/Grid.astro';
+
+import { getBlogPermalink } from '~/utils/permalinks';
+import { findLatestPosts } from '~/utils/blog';
+import WidgetWrapper from '~/components/ui/WidgetWrapper.astro';
+import type { Widget } from '~/types';
+import Button from '~/components/ui/Button.astro';
+
+export interface Props extends Widget {
+ title?: string;
+ linkText?: string;
+ linkUrl?: string | URL;
+ information?: string;
+ count?: number;
+}
+
+const {
+ title = await Astro.slots.render('title'),
+ linkText = 'View all posts',
+ linkUrl = getBlogPermalink(),
+ information = await Astro.slots.render('information'),
+ count = 4,
+
+ id,
+ isDark = false,
+ classes = {},
+ bg = await Astro.slots.render('bg'),
+} = Astro.props;
+
+const posts = APP_BLOG.isEnabled ? await findLatestPosts({ count }) : [];
+---
+
+{
+ APP_BLOG.isEnabled ? (
+ <WidgetWrapper id={id} isDark={isDark} containerClass={classes?.container as string} bg={bg}>
+ <div class="flex flex-col lg:justify-between lg:flex-row mb-8">
+ {title && (
+ <div class="md:max-w-sm">
+ <h2
+ class="text-3xl font-bold tracking-tight sm:text-4xl sm:leading-none group font-heading mb-2"
+ set:html={title}
+ />
+ {APP_BLOG.list.isEnabled && linkText && linkUrl && (
+ <Button variant="link" href={linkUrl}>
+ {' '}
+ {linkText} ยป
+ </Button>
+ )}
+ </div>
+ )}
+
+ {information && <p class="text-muted dark:text-slate-400 lg:text-sm lg:max-w-md" set:html={information} />}
+ </div>
+
+ <Grid posts={posts} />
+ </WidgetWrapper>
+ ) : (
+ <Fragment />
+ )
+}