[Kitenite]

Summary

• Add token rules for markdown syntax highlighting in the Monaco diff viewer
• Headings and link text use blue, URLs use cyan, inline code uses green
• Bold, italic, and strikethrough get proper font styles

Test plan

• Open a markdown file diff in the desktop app
• Verify headings, links, code blocks, and formatting are highlighted

🤖 Generated with Claude Code

Summary by CodeRabbit

• Bug Fixes
  • Markdown syntax highlighting in the editor now properly applies custom theme colors to tokens, improving visual consistency with your selected theme.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Walkthrough

This change adds custom Markdown token styling support to the Monaco editor theme by introducing a createTokenRules() function that generates token styling rules from the current theme, replacing a previously empty rules array in toMonacoTheme().

Changes

Cohort / File(s)	Summary
Monaco Theme Token Rules apps/desktop/src/renderer/stores/theme/utils/monaco-theme.ts	Added createTokenRules(theme) function to generate Monaco token styling rules for Markdown tokens using theme colors and font styles; updated toMonacoTheme() to populate rules array instead of leaving it empty; introduced local hex helper for color conversion.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

• Single file change with straightforward logic
• New utility function follows existing patterns for theme processing
• Color-to-hex conversion is a simple inline helper
• Verify token rule structure matches Monaco's expected format

Possibly related PRs

• Use vscode theme defaults #362: Reintroduces custom Monaco token rule generation in the same file after a prior change removed it in favor of default/empty rules.

Poem

🐰 Monaco tokens dance in colored light,
Theme rules crafted just right,
Markdown styling, now complete,
A bunny's refactor, bittersweet! 🎨✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning, 1 inconclusive)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.
Description check	❓ Inconclusive	The description covers the key changes but lacks formal structure. It's missing sections like 'Related Issues' and 'Type of Change' that are in the template.	Complete the template by adding 'Related Issues', selecting the appropriate 'Type of Change' checkbox (New feature), and expanding 'Testing' with actual test steps.

✅ Passed checks (1 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main change: adding markdown syntax highlighting to the Monaco editor in the desktop app.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch roasted-thrush-e7b10b

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[github-actions]

🧹 Preview Cleanup Complete

The following preview resources have been cleaned up:

Service	Status
Database (Neon)	✅

Thank you for your contribution! 🎉

---

Preview resources have been processed for cleanup

[coderabbitai]

Actionable comments posted: 1

📜 Review details

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 1952fd5 and 7170f98.

📒 Files selected for processing (1)

• apps/desktop/src/renderer/stores/theme/utils/monaco-theme.ts (1 hunks)

🧰 Additional context used

📓 Path-based instructions (5)

apps/desktop/**/*.{ts,tsx,js,jsx}

📄 CodeRabbit inference engine (apps/desktop/AGENTS.md)

apps/desktop/**/*.{ts,tsx,js,jsx}: For Electron interprocess communication, ALWAYS use trpc as defined in src/lib/trpc
Use alias as defined in tsconfig.json when possible
Prefer zustand for state management if it makes sense. Do not use effect unless absolutely necessary.

Files:

• apps/desktop/src/renderer/stores/theme/utils/monaco-theme.ts

**/*.{ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

Avoid using any type in TypeScript - maintain type safety unless absolutely necessary

Files:

• apps/desktop/src/renderer/stores/theme/utils/monaco-theme.ts

**/*.{ts,tsx,js,jsx}

📄 CodeRabbit inference engine (AGENTS.md)

Run Biome for formatting, linting, import organization, and safe fixes at the root level using bun run lint:fix

Files:

• apps/desktop/src/renderer/stores/theme/utils/monaco-theme.ts

apps/desktop/src/renderer/**/*.{ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

Never import Node.js modules in renderer process or shared code - use only in main process (src/main/)

Files:

• apps/desktop/src/renderer/stores/theme/utils/monaco-theme.ts

apps/desktop/src/{main,renderer,preload}/**/*.{ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

Use type-safe IPC communication - define channel types in apps/desktop/src/shared/ipc-channels.ts before implementing handlers

Files:

• apps/desktop/src/renderer/stores/theme/utils/monaco-theme.ts

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

• GitHub Check: Build

🔇 Additional comments (1)

apps/desktop/src/renderer/stores/theme/utils/monaco-theme.ts (1)

86-86: Clean integration of token rules.

The integration correctly replaces the empty rules array with the new createTokenRules(theme) function, enabling the markdown syntax highlighting feature.

[coderabbitai]

⚠️ Potential issue | 🔴 Critical

🧩 Analysis chain

🏁 Script executed:

find . -name "monaco-theme.ts" -o -name "*theme*" -type f | head -20

Repository: superset-sh/superset

Length of output: 403

---

🏁 Script executed:

find . -name "*markdown*" -type f | grep -E "\.(ts|js|json)$" | head -10

Repository: superset-sh/superset

Length of output: 46

---

🏁 Script executed:

cat -n apps/desktop/src/renderer/stores/theme/utils/monaco-theme.ts | head -100

Repository: superset-sh/superset

Length of output: 4147

---

Token names in createTokenRules will not apply styling to markdown in Monaco Editor.

The token names defined for markdown styling (lines 71-77) do not match tokens generated by Monaco's built-in markdown language. Tokens like markup.bold, markup.italic, and markup.strike are TextMate grammar scopes, not Monaco Monarch tokens. The rules for string.link.md, variable.md, variable.source.md, markup.bold.md, markup.italic.md, and markup.strikethrough.md will have no effect because Monaco's markdown tokenizer does not generate these token names.

Only keyword.md (line 70) aligns with Monaco's actual markdown token output. To fix this, verify the actual token names using Monaco's Inspect Tokens tool in the editor (search via command palette), then update the rules to match.

🤖 Prompt for AI Agents

In apps/desktop/src/renderer/stores/theme/utils/monaco-theme.ts around lines
64–79, the token names used for markdown (e.g. string.link.md, variable.md,
markup.bold.md, markup.italic.md, markup.strikethrough.md) are TextMate scopes
and will not be emitted by Monaco's markdown tokenizer; replace them with the
actual Monaco token names (remove the .md suffix and use Monaco's tokens such as
`link`, `strong`/`bold`/`heading`/`emphasis`/`strike` or whatever your Monaco
Inspect Tokens tool reports) so the styles apply: open the editor, run “Inspect
Tokens” to confirm exact token names Monaco emits for links, bold, italic,
strikethrough, etc., then update each rule key to the matching Monaco token
(keeping the hex(...) foreground/fontStyle logic) and remove or rename any rules
that don’t match Monaco tokens.