feat: Adding support for i18n (closes #462) (#738)

Mara-Li

2024-02-04 dbbc672c67aa5ac0a915d22af5cf44c4e7011aae

 quartz/components/pages/FolderContent.tsx

@@ -7,6 +7,7 @@
import { Root } from "hast"
import { pluralize } from "../../util/lang"
import { htmlToJsx } from "../../util/jsx"
import { i18n } from "../../i18n/i18next"

interface FolderContentOptions {
  /**
@@ -23,7 +24,7 @@
  const options: FolderContentOptions = { ...defaultOptions, ...opts }

  function FolderContent(props: QuartzComponentProps) {
    const { tree, fileData, allFiles } = props
    const { tree, fileData, allFiles, cfg } = props
    const folderSlug = _stripSlashes(simplifySlug(fileData.slug!))
    const allPagesInFolder = allFiles.filter((file) => {
      const fileSlug = _stripSlashes(simplifySlug(file.slug!))
@@ -33,7 +34,8 @@
      const isDirectChild = fileParts.length === folderParts.length + 1
      return prefixed && isDirectChild
    })

    const cssClasses: string[] = fileData.frontmatter?.cssclasses ?? []
    const classes = ["popover-hint", ...cssClasses].join(" ")
    const listProps = {
      ...props,
      allFiles: allPagesInFolder,
@@ -45,15 +47,20 @@
        : htmlToJsx(fileData.filePath!, tree)

    return (
      <div class="popover-hint">
      <div class={classes}>
        <article>
          <p>{content}</p>
        </article>
        {options.showFolderCount && (
          <p>{pluralize(allPagesInFolder.length, "item")} under this folder.</p>
        )}
        <div>
          <PageList {...listProps} />
        <div class="page-listing">
          {options.showFolderCount && (
            <p>
              {pluralize(allPagesInFolder.length, i18n(cfg.locale, "common.item"))}{" "}
              {i18n(cfg.locale, "folderContent.underThisFolder")}.
            </p>
          )}
          <div>
            <PageList {...listProps} />
          </div>
        </div>
      </div>
    )