| | |
| | | import style from "./styles/recentNotes.scss" |
| | | import { Date, getDate } from "./Date" |
| | | import { GlobalConfiguration } from "../cfg" |
| | | import { i18n } from "../i18n/i18next" |
| | | import { classNames } from "../util/lang" |
| | | |
| | | interface Options { |
| | | title: string |
| | |
| | | }) |
| | | |
| | | export default ((userOpts?: Partial<Options>) => { |
| | | function RecentNotes(props: QuartzComponentProps) { |
| | | const { allFiles, fileData, displayClass, cfg } = props |
| | | function RecentNotes({ 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}`}> |
| | | <div class={classNames(displayClass, "recent-notes")}> |
| | | <h3>{opts.title}</h3> |
| | | <ul class="recent-ul"> |
| | | {pages.slice(0, opts.limit).map((page) => { |
| | |
| | | </div> |
| | | {page.dates && ( |
| | | <p class="meta"> |
| | | <Date date={getDate(cfg, page)!} /> |
| | | <Date date={getDate(cfg, page)!} locale={cfg.locale} /> |
| | | </p> |
| | | )} |
| | | <ul class="tags"> |
| | |
| | | </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, "recentNotes.seeRemainingMore", { |
| | | remaining: remaining.toString(), |
| | | })}{" "} |
| | | → |
| | | </a> |
| | | </p> |
| | | )} |
| | | </div> |