From eed4472aeecdcb0f2b233df69884f03bd45fc293 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Wed, 23 Aug 2023 19:18:50 +0000
Subject: [PATCH] fix: use proper full base for links.ts
---
quartz/components/PageList.tsx | 80 +++++++++++++++++++++++++++------------
1 files changed, 55 insertions(+), 25 deletions(-)
diff --git a/quartz/components/PageList.tsx b/quartz/components/PageList.tsx
index da1bf9f..c55b534 100644
--- a/quartz/components/PageList.tsx
+++ b/quartz/components/PageList.tsx
@@ -1,9 +1,9 @@
-import { CanonicalSlug, canonicalizeServer, resolveRelative } from "../path"
+import { FullSlug, resolveRelative } from "../util/path"
import { QuartzPluginData } from "../plugins/vfile"
import { Date } from "./Date"
import { QuartzComponentProps } from "./types"
-function byDateAndAlphabetical(f1: QuartzPluginData, f2: QuartzPluginData): number {
+export function byDateAndAlphabetical(f1: QuartzPluginData, f2: QuartzPluginData): number {
if (f1.dates && f2.dates) {
// sort descending by last modified
return f2.dates.modified.getTime() - f1.dates.modified.getTime()
@@ -17,36 +17,66 @@
// otherwise, sort lexographically by title
const f1Title = f1.frontmatter?.title.toLowerCase() ?? ""
const f2Title = f2.frontmatter?.title.toLowerCase() ?? ""
- return f1Title.localeCompare(f2Title)
+ return f1Title.localeCompare(f2Title)
}
-export function PageList({ fileData, allFiles }: QuartzComponentProps) {
- const slug = canonicalizeServer(fileData.slug!)
- return <ul class="section-ul">
- {allFiles.sort(byDateAndAlphabetical).map(page => {
- const title = page.frontmatter?.title
- const pageSlug = canonicalizeServer(page.slug!)
- const tags = page.frontmatter?.tags ?? []
+type Props = {
+ limit?: number
+} & QuartzComponentProps
- return <li class="section-li">
- <div class="section">
- {page.dates && <p class="meta">
- <Date date={page.dates.modified} />
- </p>}
- <div class="desc">
- <h3><a href={resolveRelative(slug, pageSlug)} class="internal">{title}</a></h3>
- </div>
- <ul class="tags">
- {tags.map(tag => <li><a class="internal" href={resolveRelative(slug, `tags/${tag}` as CanonicalSlug)}>#{tag}</a></li>)}
- </ul>
- </div>
- </li>
- })}
- </ul>
+export function PageList({ fileData, allFiles, limit }: Props) {
+ let list = allFiles.sort(byDateAndAlphabetical)
+ if (limit) {
+ list = list.slice(0, limit)
+ }
+
+ return (
+ <ul class="section-ul">
+ {list.map((page) => {
+ const title = page.frontmatter?.title
+ const tags = page.frontmatter?.tags ?? []
+
+ return (
+ <li class="section-li">
+ <div class="section">
+ {page.dates && (
+ <p class="meta">
+ <Date date={page.dates.modified} />
+ </p>
+ )}
+ <div class="desc">
+ <h3>
+ <a href={resolveRelative(fileData.slug!, page.slug!)} class="internal">
+ {title}
+ </a>
+ </h3>
+ </div>
+ <ul class="tags">
+ {tags.map((tag) => (
+ <li>
+ <a
+ class="internal tag-link"
+ href={resolveRelative(fileData.slug!, `tags/${tag}` as FullSlug)}
+ >
+ #{tag}
+ </a>
+ </li>
+ ))}
+ </ul>
+ </div>
+ </li>
+ )
+ })}
+ </ul>
+ )
}
PageList.css = `
.section h3 {
margin: 0;
}
+
+.section > .tags {
+ margin: 0;
+}
`
--
Gitblit v1.10.0