Skip to content

Commit aff9891

Browse files
codeyomacodeyoma
committed
Quartz sync: May 20, 2025, 4:30 PM
1 parent e2a0d43 commit aff9891

File tree

7 files changed

+191
-158
lines changed

7 files changed

+191
-158
lines changed

‎content/index.md‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
description: This blog is an excerpt from my Obsidian notes.
33
title: Hello Again!
44
created: 2025-05-18
5-
modified: 2025-05-19
5+
modified: 2025-05-20
66
comments: "false"
77
---
88

@@ -20,7 +20,6 @@ comments: "false"
2020
- [[- Note Taking]]
2121
- [[- Philosophy]]
2222
- #moc
23-
2423
# Basic Guide
2524
- prefix of `🗺️`
2625
- MOC file

‎quartz.layout.ts‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,8 @@ export const defaultContentPageLayout: PageLayout = {
5454
],
5555
}),
5656
Component.Explorer({
57-
folderClickBehavior: "collapse",
57+
folderClickBehavior: "link",
58+
useSavedState: false,
5859
sortFn: (a, b) => {
5960
if (!a.isFolder && a.slug === 'About')
6061
return -99
@@ -107,7 +108,8 @@ export const defaultListPageLayout: PageLayout = {
107108
],
108109
}),
109110
Component.Explorer({
110-
folderClickBehavior: "collapse",
111+
folderClickBehavior: "link",
112+
useSavedState: false,
111113
sortFn: (a, b) => {
112114
if (!a.isFolder && a.slug === 'About')
113115
return -99

‎quartz/components/PageList.tsx‎

Lines changed: 67 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ import { QuartzPluginData } from "../plugins/vfile"
33
import { Date, getDate } from "./Date"
44
import { QuartzComponent, QuartzComponentProps } from "./types"
55
import { GlobalConfiguration } from "../cfg"
6+
import { Fragment } from 'preact';
7+
68

79
export type SortFn = (f1: QuartzPluginData, f2: QuartzPluginData) => number
810

@@ -64,42 +66,70 @@ export const PageList: QuartzComponent = ({ cfg, fileData, allFiles, limit, sort
6466
list = list.slice(0, limit)
6567
}
6668

69+
const new_list = [
70+
{
71+
list: list.filter((page) => page.slug?.endsWith("/index")),
72+
title: "Folders",
73+
},
74+
{
75+
list: list.filter((page) => page.frontmatter?.title?.startsWith("🗺️")),
76+
title: "MOC",
77+
},
78+
{
79+
list: list.filter((page) => !page.slug?.endsWith("/index") && !page.frontmatter?.title?.startsWith("🗺️")),
80+
title: "Files",
81+
},
82+
]
83+
6784
return (
6885
<ul class="section-ul">
69-
{list.map((page) => {
70-
const title = page.frontmatter?.title
71-
const tags = page.frontmatter?.tags ?? []
86+
{
87+
new_list.map(({ list: sectionList, title }) => {
88+
if (sectionList?.length === 0) return null
7289

73-
return (
74-
<li class="section-li">
75-
<div class="section">
76-
<p class="meta">
77-
{page.dates && <Date date={getDate(cfg, page)!} locale={cfg.locale} />}
78-
</p>
79-
<div class="desc">
80-
<h3>
81-
<a href={resolveRelative(fileData.slug!, page.slug!)} class="internal">
82-
{title}
83-
</a>
84-
</h3>
85-
</div>
86-
<ul class="tags">
87-
{tags.map((tag) => (
88-
<li>
89-
<a
90-
class="internal tag-link"
91-
href={resolveRelative(fileData.slug!, `tags/${tag}` as FullSlug)}
92-
>
93-
{tag}
94-
</a>
95-
</li>
96-
))}
97-
</ul>
98-
</div>
99-
</li>
100-
)
101-
})}
102-
</ul>
90+
return (
91+
<Fragment key={title}>
92+
{<hr />}
93+
{<h5 class="page-list-title">{title}</h5>}
94+
{
95+
sectionList.map((page) => {
96+
const title = page.frontmatter?.title
97+
const tags = page.frontmatter?.tags ?? []
98+
return (
99+
<li class="section-li">
100+
<div class="section">
101+
<div class="desc">
102+
<h3>
103+
<a href={resolveRelative(fileData.slug!, page.slug!)} class="internal">
104+
{title}
105+
</a>
106+
</h3>
107+
</div>
108+
<p class="meta">
109+
{page.dates && <Date date={getDate(cfg, page)!} locale={cfg.locale} />}
110+
</p>
111+
<ul class="tags">
112+
{tags.map((tag) => (
113+
<li>
114+
<a
115+
class="internal tag-link"
116+
href={resolveRelative(fileData.slug!, `tags/${tag}` as FullSlug)}
117+
>
118+
{tag}
119+
</a>
120+
</li>
121+
))}
122+
</ul>
123+
</div>
124+
</li>
125+
)
126+
})
127+
}
128+
</Fragment>
129+
)
130+
})
131+
}
132+
</ul >
103133
)
104134
}
105135

@@ -111,4 +141,8 @@ PageList.css = `
111141
.section > .tags {
112142
margin: 0;
113143
}
144+
145+
.page-list-title {
146+
opacity: 0.5;
147+
}
114148
`

‎quartz/components/pages/FolderContent.tsx‎

Lines changed: 96 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -11,116 +11,116 @@ import { concatenateResources } from "../../util/resources"
1111
import { trieFromAllFiles } from "../../util/ctx"
1212

1313
interface FolderContentOptions {
14-
/**
15-
* Whether to display number of folders
16-
*/
17-
showFolderCount: boolean
18-
showSubfolders: boolean
19-
sort?: SortFn
14+
/**
15+
* Whether to display number of folders
16+
*/
17+
showFolderCount: boolean
18+
showSubfolders: boolean
19+
sort?: SortFn
2020
}
2121

2222
const defaultOptions: FolderContentOptions = {
23-
showFolderCount: true,
24-
showSubfolders: true,
23+
showFolderCount: false,
24+
showSubfolders: true,
2525
}
2626

2727
export default ((opts?: Partial<FolderContentOptions>) => {
28-
const options: FolderContentOptions = { ...defaultOptions, ...opts }
28+
const options: FolderContentOptions = { ...defaultOptions, ...opts }
2929

30-
const FolderContent: QuartzComponent = (props: QuartzComponentProps) => {
31-
const { tree, fileData, allFiles, cfg } = props
30+
const FolderContent: QuartzComponent = (props: QuartzComponentProps) => {
31+
const { tree, fileData, allFiles, cfg } = props
3232

33-
const trie = (props.ctx.trie ??= trieFromAllFiles(allFiles))
34-
const folder = trie.findNode(fileData.slug!.split("/"))
35-
if (!folder) {
36-
return null
37-
}
38-
39-
const allPagesInFolder: QuartzPluginData[] =
40-
folder.children
41-
.map((node) => {
42-
// regular file, proceed
43-
if (node.data) {
44-
return node.data
45-
}
33+
const trie = (props.ctx.trie ??= trieFromAllFiles(allFiles))
34+
const folder = trie.findNode(fileData.slug!.split("/"))
35+
if (!folder) {
36+
return null
37+
}
4638

47-
if (node.isFolder && options.showSubfolders) {
48-
// folders that dont have data need synthetic files
49-
const getMostRecentDates = (): QuartzPluginData["dates"] => {
50-
let maybeDates: QuartzPluginData["dates"] | undefined = undefined
51-
for (const child of node.children) {
52-
if (child.data?.dates) {
53-
// compare all dates and assign to maybeDates if its more recent or its not set
54-
if (!maybeDates) {
55-
maybeDates = { ...child.data.dates }
56-
} else {
57-
if (child.data.dates.created > maybeDates.created) {
58-
maybeDates.created = child.data.dates.created
39+
const allPagesInFolder: QuartzPluginData[] =
40+
folder.children
41+
.map((node) => {
42+
// regular file, proceed
43+
if (node.data) {
44+
return node.data
5945
}
6046

61-
if (child.data.dates.modified > maybeDates.modified) {
62-
maybeDates.modified = child.data.dates.modified
63-
}
47+
if (node.isFolder && options.showSubfolders) {
48+
// folders that dont have data need synthetic files
49+
const getMostRecentDates = (): QuartzPluginData["dates"] => {
50+
let maybeDates: QuartzPluginData["dates"] | undefined = undefined
51+
for (const child of node.children) {
52+
if (child.data?.dates) {
53+
// compare all dates and assign to maybeDates if its more recent or its not set
54+
if (!maybeDates) {
55+
maybeDates = { ...child.data.dates }
56+
} else {
57+
if (child.data.dates.created > maybeDates.created) {
58+
maybeDates.created = child.data.dates.created
59+
}
6460

65-
if (child.data.dates.published > maybeDates.published) {
66-
maybeDates.published = child.data.dates.published
67-
}
68-
}
69-
}
70-
}
71-
return (
72-
maybeDates ?? {
73-
created: new Date(),
74-
modified: new Date(),
75-
published: new Date(),
76-
}
77-
)
78-
}
61+
if (child.data.dates.modified > maybeDates.modified) {
62+
maybeDates.modified = child.data.dates.modified
63+
}
7964

80-
return {
81-
slug: node.slug,
82-
dates: getMostRecentDates(),
83-
frontmatter: {
84-
title: node.displayName,
85-
tags: [],
86-
},
87-
}
88-
}
89-
})
90-
.filter((page) => page !== undefined) ?? []
91-
const cssClasses: string[] = fileData.frontmatter?.cssclasses ?? []
92-
const classes = cssClasses.join(" ")
93-
const listProps = {
94-
...props,
95-
sort: options.sort,
96-
allFiles: allPagesInFolder,
97-
}
65+
if (child.data.dates.published > maybeDates.published) {
66+
maybeDates.published = child.data.dates.published
67+
}
68+
}
69+
}
70+
}
71+
return (
72+
maybeDates ?? {
73+
created: new Date(),
74+
modified: new Date(),
75+
published: new Date(),
76+
}
77+
)
78+
}
79+
80+
return {
81+
slug: node.slug,
82+
dates: getMostRecentDates(),
83+
frontmatter: {
84+
title: node.displayName,
85+
tags: [],
86+
},
87+
}
88+
}
89+
})
90+
.filter((page) => page !== undefined) ?? []
91+
const cssClasses: string[] = fileData.frontmatter?.cssclasses ?? []
92+
const classes = cssClasses.join(" ")
93+
const listProps = {
94+
...props,
95+
sort: options.sort,
96+
allFiles: allPagesInFolder,
97+
}
9898

99-
const content = (
100-
(tree as Root).children.length === 0
101-
? fileData.description
102-
: htmlToJsx(fileData.filePath!, tree)
103-
) as ComponentChildren
99+
const content = (
100+
(tree as Root).children.length === 0
101+
? fileData.description
102+
: htmlToJsx(fileData.filePath!, tree)
103+
) as ComponentChildren
104104

105-
return (
106-
<div class="popover-hint">
107-
<article class={classes}>{content}</article>
108-
<div class="page-listing">
109-
{options.showFolderCount && (
110-
<p>
111-
{i18n(cfg.locale).pages.folderContent.itemsUnderFolder({
112-
count: allPagesInFolder.length,
113-
})}
114-
</p>
115-
)}
116-
<div>
117-
<PageList {...listProps} />
118-
</div>
119-
</div>
120-
</div>
121-
)
122-
}
105+
return (
106+
<div class="popover-hint">
107+
<article class={classes}>{content}</article>
108+
<div class="page-listing">
109+
{options.showFolderCount && (
110+
<p>
111+
{i18n(cfg.locale).pages.folderContent.itemsUnderFolder({
112+
count: allPagesInFolder.length,
113+
})}
114+
</p>
115+
)}
116+
<div>
117+
<PageList {...listProps} />
118+
</div>
119+
</div>
120+
</div>
121+
)
122+
}
123123

124-
FolderContent.css = concatenateResources(style, PageList.css)
125-
return FolderContent
124+
FolderContent.css = concatenateResources(style, PageList.css)
125+
return FolderContent
126126
}) satisfies QuartzComponentConstructor

0 commit comments

Comments
 (0)