Skip to content

feat: add syntax highlighting for AI code responses #122 - #207

Merged
Aharshi3614 merged 2 commits into
Aharshi3614:mainfrom
Aryanbuha890:issue-122-syntax-highlighting
Aug 4, 2026
Merged

feat: add syntax highlighting for AI code responses #122#207
Aharshi3614 merged 2 commits into
Aharshi3614:mainfrom
Aryanbuha890:issue-122-syntax-highlighting

Conversation

@Aryanbuha890

Copy link
Copy Markdown
Contributor

Summary

This PR adds theme-aware, automated syntax highlighting to all AI code blocks within the application, closing #122.

Changes

  • prismjs Integration: Integrated prismjs as a dependency on the frontend.
  • Shared Markdown Component: Created a shared Markdown formatting component in Markdown.jsx that replaces duplicated formatting logic in ResponseOutput.jsx and HistoryPanel.jsx.
  • Auto-Language Detection: Added a heuristic language detector fallback inside the Markdown component to automatically detect code language blocks missing an explicit specifier.
  • Light/Dark Syntax Theme: Defined custom CSS variables in index.css for both light mode (:root) and dark mode ([data-theme="dark"]) matching PrismJS highlight classes. This allows code token colors to adapt seamlessly and match the application theme dynamically.

Closes #122

@Aharshi3614
Aharshi3614 merged commit 258fcb4 into Aharshi3614:main Aug 4, 2026
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add Syntax Highlighting for AI Code Responses

2 participants