/
page.js
79 lines (74 loc) · 2.03 KB
/
page.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
import { html } from 'uhtml-isomorphic'
import { dirname, basename } from 'node:path'
/**
* @template T
* @typedef {import('top-bun').PageFunction<T>} PageFunction
*/
export const vars = {
title: 'Recent Blog Posts',
layout: 'blog-index',
noindex: true
}
/**
* @type {PageFunction<{
* siteName: string,
* description: string,
* siteUrl: string,
* authorName: string,
* authorUrl: string,
* authorImgUrl: string
* layout: string,
* publishDate: string
* title: string
* published?: boolean
* }>}
*/
export default async function blogIndex2023 ({
pages,
page
}) {
const blogPosts = pages
.filter(page => ['article', 'book-review'].includes(page.vars.layout) && page.vars.published !== false)
// @ts-ignore
.sort((a, b) => new Date(b.vars.publishDate) - new Date(a.vars.publishDate))
.slice(0, 100)
const folderPages = pages.filter(folderPage => {
const dir = dirname(folderPage.pageInfo.path)
const path = page.path
return dir === path
})
return html`
<ul class="blog-index-list">
${blogPosts.map(p => {
const publishDate = p.vars.publishDate ? new Date(p.vars.publishDate) : null
return html`
<li class="blog-entry h-entry">
<a class="blog-entry-link u-url u-uid p-name" href="/${p.pageInfo.path}/">${p.vars.title}</a>
${
publishDate
? html`<time class="blog-entry-date dt-published" datetime="${publishDate.toISOString()}">
${publishDate.toISOString().split('T')[0]}
</time>`
: null
}
</li>`
})}
</ul>
<footer class="blog-index-footer">
<h4>Archive</h4>
<ul class="archive-list">
${folderPages.map(p => {
return html`<li>
<a href="/${p.pageInfo.path}/">${basename(p.pageInfo.path)}</a>
</li>`
})}
<li>
<a href="/projects/">projects</a>
</li>
<li>
<a href="/jobs/">jobs</a>
</li>
<ul>
</footer>
`
}