fix: render YAML frontmatter as a metadata card in markdown preview - #391
Open
RizzoTho wants to merge 1 commit into
Open
fix: render YAML frontmatter as a metadata card in markdown preview#391RizzoTho wants to merge 1 commit into
RizzoTho wants to merge 1 commit into
Conversation
react-markdown has no frontmatter support, so a leading `---` block was parsed as CommonMark instead: the opening `---` became an <hr> and the closing `---` turned the YAML lines into a setext heading, leaking raw metadata like `title: My Doc` into the rendered preview between two horizontal rules (and letting remark-math mangle any $ inside it). - Add remark-frontmatter (yaml only) to both render pipelines so the block parses as a `yaml` node and disappears from the rendered output. - Add parseFrontmatter() (lib/markdown.ts) backed by js-yaml, and a FrontmatterCard that renders the metadata above the preview body: `title` as a heading, `tags`/`categories`/`keywords` as chips, remaining keys as a key/value table with http(s)/mailto values as links. - Malformed YAML shows no card but is still hidden by the remark plugin; documents without frontmatter render exactly as before. Verified with tsc --noEmit and eslint; the parse pipeline was also checked with unified directly (frontmatter yields no output, and the setext-trap / mid-document `---` cases still parse as CommonMark).
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
The markdown file preview (and chat messages) render YAML frontmatter as broken CommonMark: the opening
---becomes an<hr>, and the closing---is read as a setext heading underline, so the raw YAML (title: My Doc, …) shows up as a giant bold heading between two horizontal rules in the preview.Change
lib/markdown.ts— addedremark-frontmatter(yaml only) to both render pipelines. The block now parses as ayamlnode and is dropped during mdast→hast conversion, so raw metadata never leaks into chat or preview output (this also stopsremark-mathfrom interpreting$inside the metadata).lib/markdown.ts— newparseFrontmatter()helper: a leading----regex that mirrors whatremark-frontmatter(["yaml"])recognizes, plus ajs-yamlparse.components/FrontmatterCard.tsx(new) — renders the metadata as a card above the preview body:titleas a heading,tags/categories/keywordsas chips, remaining keys as a key/value table withhttp(s)/mailtovalues as links.components/FileViewer.tsx— renders the card in preview mode.app/globals.css— card styles built on existing CSS variables (light/dark aware).Behavior:
<hr>leak).Verification
tsc --noEmitcleaneslintclean---\ntitle: …\n---now yields ayamlnode that produces zero output; the setext-trap case and---appearing mid-document still parse as CommonMark (verified with a matrix of 5 cases).mdfile with frontmatter in the file preview (title + tags + key/value rows render as a card), and a file without frontmatter (unchanged)