diff --git a/quartz/components/pages/FolderContent.tsx b/quartz/components/pages/FolderContent.tsx
index 765f8465..1acb98a8 100644
--- a/quartz/components/pages/FolderContent.tsx
+++ b/quartz/components/pages/FolderContent.tsx
@@ -8,40 +8,56 @@ import { Root } from "hast"
import { pluralize } from "../../util/lang"
import { htmlToJsx } from "../../util/jsx"
-function FolderContent(props: QuartzComponentProps) {
- const { tree, fileData, allFiles } = props
- const folderSlug = _stripSlashes(simplifySlug(fileData.slug!))
- const allPagesInFolder = allFiles.filter((file) => {
- const fileSlug = _stripSlashes(simplifySlug(file.slug!))
- const prefixed = fileSlug.startsWith(folderSlug) && fileSlug !== folderSlug
- const folderParts = folderSlug.split(path.posix.sep)
- const fileParts = fileSlug.split(path.posix.sep)
- const isDirectChild = fileParts.length === folderParts.length + 1
- return prefixed && isDirectChild
- })
-
- const listProps = {
- ...props,
- allFiles: allPagesInFolder,
- }
-
- const content =
- (tree as Root).children.length === 0
- ? fileData.description
- : htmlToJsx(fileData.filePath!, tree)
-
- return (
-
-
- {content}
-
-
{pluralize(allPagesInFolder.length, "item")} under this folder.
-
-
- )
+interface FolderContentOptions {
+ /**
+ * Whether to display number of folders
+ */
+ showFolderCount: boolean
}
-FolderContent.css = style + PageList.css
-export default (() => FolderContent) satisfies QuartzComponentConstructor
+const defaultOptions: FolderContentOptions = {
+ showFolderCount: true,
+}
+
+export default ((opts?: Partial) => {
+ // Merge options with defaults
+ const options: FolderContentOptions = { ...defaultOptions, ...opts }
+
+ function FolderContent(props: QuartzComponentProps) {
+ const { tree, fileData, allFiles } = props
+ const folderSlug = _stripSlashes(simplifySlug(fileData.slug!))
+ const allPagesInFolder = allFiles.filter((file) => {
+ const fileSlug = _stripSlashes(simplifySlug(file.slug!))
+ const prefixed = fileSlug.startsWith(folderSlug) && fileSlug !== folderSlug
+ const folderParts = folderSlug.split(path.posix.sep)
+ const fileParts = fileSlug.split(path.posix.sep)
+ const isDirectChild = fileParts.length === folderParts.length + 1
+ return prefixed && isDirectChild
+ })
+
+ const listProps = {
+ ...props,
+ allFiles: allPagesInFolder,
+ }
+
+ const content =
+ (tree as Root).children.length === 0
+ ? fileData.description
+ : htmlToJsx(fileData.filePath!, tree)
+
+ return (
+
+
+ {content}
+
+ {options.showFolderCount &&
{pluralize(allPagesInFolder.length, "item")} under this folder.
}
+
+
+ )
+ }
+
+ FolderContent.css = style + PageList.css
+ return FolderContent
+}) satisfies QuartzComponentConstructor