feat: Unifies article lists to have similar view styles.
All checks were successful
CI / release (push) Successful in 5m36s
All checks were successful
CI / release (push) Successful in 5m36s
This commit is contained in:
@@ -2,32 +2,24 @@ import Foundation
|
||||
import HTML
|
||||
import Saga
|
||||
|
||||
func renderArticles(context: ItemsRenderingContext<ArticleMetadata>) -> Node {
|
||||
func renderArticles(context: ItemsRenderingContext<ArticleMetadata>) -> NodeConvertible {
|
||||
let dateFormatter = DateFormatter()
|
||||
dateFormatter.dateFormat = "yyyy"
|
||||
|
||||
let articlesPerYear = Dictionary(grouping: context.items, by: { dateFormatter.string(from: $0.date) })
|
||||
let sortedByYearDescending = articlesPerYear.sorted { $0.key > $1.key }
|
||||
|
||||
return baseLayout(canocicalURL: "/articles/", section: .articles, title: "Articles", rssLink: "", extraHeader: "") {
|
||||
sortedByYearDescending.map { year, articles in
|
||||
div(class: "mt-8 mb-10 bg-slate-800 border border-slate-200 rounded-lg") {
|
||||
TagGrid(items: context.items)
|
||||
div(class: "border-b border-light pt-6 w-full") {
|
||||
div(class: "px-6 flex flex-row gap-4 ") {
|
||||
img(src: "/static/img/calendar.svg", width: "40")
|
||||
h1(class: "text-4xl font-extrabold pt-3") { year }
|
||||
}
|
||||
}
|
||||
div(class: "grid gap-10 mx-6 mb-16") {
|
||||
articles.map { renderArticleForGrid(article: $0, border: false) }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return ArticleGrid(
|
||||
articles: sortedByYearDescending,
|
||||
canocicalURL: "/articles/",
|
||||
title: "Articles",
|
||||
rssLink: "",
|
||||
extraHeader: "",
|
||||
header: yearHeader(_:)
|
||||
)
|
||||
}
|
||||
|
||||
func renderTag<T>(context: PartitionedRenderingContext<T, ArticleMetadata>) -> Node {
|
||||
func renderTag<T>(context: PartitionedRenderingContext<T, ArticleMetadata>) -> NodeConvertible {
|
||||
let extraHeader = link(
|
||||
href: "/articles/tag/\(context.key.slugified)/feed.xml",
|
||||
rel: "alternate",
|
||||
@@ -36,54 +28,67 @@ func renderTag<T>(context: PartitionedRenderingContext<T, ArticleMetadata>) -> N
|
||||
)
|
||||
|
||||
return baseRenderArticles(
|
||||
context.items,
|
||||
(context.key.slugified, context.items),
|
||||
canocicalURL: "/articles/tag/\(context.key.slugified)/",
|
||||
title: "Articles in \(context.key)",
|
||||
rssLink: "tag/\(context.key.slugified)/",
|
||||
extraHeader: extraHeader
|
||||
) {
|
||||
div(class: "border-b border-light grid lg:grid-cols-2 mb-12") {
|
||||
) { tag in
|
||||
div(class: "border-b border-light mb-12 px-6 pt-6") {
|
||||
a(href: "/articles") {
|
||||
div(class: "flex flex-row gap-2") {
|
||||
div(class: "flex flex-row gap-4") {
|
||||
img(src: "/static/img/tag.svg", width: "40")
|
||||
h1(class: "text-4xl font-extrabold") { "\(context.key)" }
|
||||
h1(class: "[&:hover]:border-b border-green text-2xl font-extrabold text-orange px-4") { "«" }
|
||||
h1(class: "text-4xl font-extrabold") { tag }
|
||||
h1(class: "text-2xl font-extrabold") { "«" }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
func renderYear<T>(context: PartitionedRenderingContext<T, ArticleMetadata>) -> Node {
|
||||
baseRenderArticles(context.items, canocicalURL: "/articles/\(context.key)/", title: "Articles in \(context.key)")
|
||||
func renderYear<T>(context: PartitionedRenderingContext<T, ArticleMetadata>) -> NodeConvertible {
|
||||
baseRenderArticles(
|
||||
(context.key.slugified, context.items),
|
||||
canocicalURL: "/articles/\(context.key)/",
|
||||
title: "Articles in \(context.key)",
|
||||
label: { year in
|
||||
div(class: "border-b border-light pt-6 w-full") {
|
||||
a(href: "/articles/") {
|
||||
div(class: "px-6 flex flex-row gap-4 ") {
|
||||
img(src: "/static/img/calendar.svg", width: "40")
|
||||
h1(class: "text-4xl font-extrabold pt-3") { year }
|
||||
h1(class: "text-2xl font-extrabold") { "«" }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
private func yearHeader(_ year: String) -> Node {
|
||||
div(class: "border-b border-light pt-6 w-full") {
|
||||
div(class: "px-6 flex flex-row gap-4 ") {
|
||||
img(src: "/static/img/calendar.svg", width: "40")
|
||||
h1(class: "text-4xl font-extrabold pt-3") { year }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private func baseRenderArticles(
|
||||
_ articles: [Item<ArticleMetadata>],
|
||||
_ articles: (key: String, value: [Item<ArticleMetadata>]),
|
||||
canocicalURL: String,
|
||||
title pageTitle: String,
|
||||
rssLink: String = "",
|
||||
extraHeader: NodeConvertible = Node.fragment([]),
|
||||
@NodeBuilder label: () -> Node = { Node.fragment([]) }
|
||||
) -> Node {
|
||||
return baseLayout(
|
||||
@NodeBuilder label: @escaping (String) -> Node = { _ in Node.fragment([]) }
|
||||
) -> NodeConvertible {
|
||||
ArticleGrid(
|
||||
articles: [articles],
|
||||
canocicalURL: canocicalURL,
|
||||
section: .articles,
|
||||
title: pageTitle,
|
||||
rssLink: rssLink,
|
||||
extraHeader: extraHeader
|
||||
) {
|
||||
label()
|
||||
articles.map { article in
|
||||
section {
|
||||
h1(class: "text-2xl font-bold") {
|
||||
a(class: "[&:hover]:border-b border-orange", href: article.url) { article.title }
|
||||
}
|
||||
renderArticleInfo(article)
|
||||
p {
|
||||
a(href: article.url) { article.summary }
|
||||
}
|
||||
}
|
||||
}
|
||||
) { key in
|
||||
label(key)
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user