From 85a737b4ee72fb4dba12e1aacbd87d1636cfc30e Mon Sep 17 00:00:00 2001
From: Xinyang Yu <47915643+xy-241@users.noreply.github.com>
Date: Sun, 24 Mar 2024 16:33:53 +0000
Subject: [PATCH] docs: Update showcase.md (#1031)
---
quartz/components/RecentNotes.tsx | 29 ++++++++++++++++++-----------
1 files changed, 18 insertions(+), 11 deletions(-)
diff --git a/quartz/components/RecentNotes.tsx b/quartz/components/RecentNotes.tsx
index cb14b33..d99878d 100644
--- a/quartz/components/RecentNotes.tsx
+++ b/quartz/components/RecentNotes.tsx
@@ -1,13 +1,15 @@
-import { QuartzComponentConstructor, QuartzComponentProps } from "./types"
+import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } from "./types"
import { FullSlug, SimpleSlug, resolveRelative } from "../util/path"
import { QuartzPluginData } from "../plugins/vfile"
import { byDateAndAlphabetical } from "./PageList"
import style from "./styles/recentNotes.scss"
import { Date, getDate } from "./Date"
import { GlobalConfiguration } from "../cfg"
+import { i18n } from "../i18n"
+import { classNames } from "../util/lang"
interface Options {
- title: string
+ title?: string
limit: number
linkToMore: SimpleSlug | false
filter: (f: QuartzPluginData) => boolean
@@ -15,7 +17,6 @@
}
const defaultOptions = (cfg: GlobalConfiguration): Options => ({
- title: "Recent Notes",
limit: 3,
linkToMore: false,
filter: () => true,
@@ -23,17 +24,21 @@
})
export default ((userOpts?: Partial<Options>) => {
- function RecentNotes(props: QuartzComponentProps) {
- const { allFiles, fileData, displayClass, cfg } = props
+ const RecentNotes: QuartzComponent = ({
+ allFiles,
+ fileData,
+ displayClass,
+ cfg,
+ }: QuartzComponentProps) => {
const opts = { ...defaultOptions(cfg), ...userOpts }
const pages = allFiles.filter(opts.filter).sort(opts.sort)
const remaining = Math.max(0, pages.length - opts.limit)
return (
- <div class={`recent-notes ${displayClass}`}>
- <h3>{opts.title}</h3>
+ <div class={classNames(displayClass, "recent-notes")}>
+ <h3>{opts.title ?? i18n(cfg.locale).components.recentNotes.title}</h3>
<ul class="recent-ul">
{pages.slice(0, opts.limit).map((page) => {
- const title = page.frontmatter?.title
+ const title = page.frontmatter?.title ?? i18n(cfg.locale).propertyDefaults.title
const tags = page.frontmatter?.tags ?? []
return (
@@ -48,7 +53,7 @@
</div>
{page.dates && (
<p class="meta">
- <Date date={getDate(cfg, page)!} />
+ <Date date={getDate(cfg, page)!} locale={cfg.locale} />
</p>
)}
<ul class="tags">
@@ -58,7 +63,7 @@
class="internal tag-link"
href={resolveRelative(fileData.slug!, `tags/${tag}` as FullSlug)}
>
- #{tag}
+ {tag}
</a>
</li>
))}
@@ -70,7 +75,9 @@
</ul>
{opts.linkToMore && remaining > 0 && (
<p>
- <a href={resolveRelative(fileData.slug!, opts.linkToMore)}>See {remaining} more →</a>
+ <a href={resolveRelative(fileData.slug!, opts.linkToMore)}>
+ {i18n(cfg.locale).components.recentNotes.seeRemainingMore({ remaining })}
+ </a>
</p>
)}
</div>
--
Gitblit v1.10.0