Skip to content

Conversation

@Simon-He95
Copy link
Collaborator

@Simon-He95 Simon-He95 commented Nov 25, 2025

This version fixes many bugs and introduces an optimized parser, which is now up to 1000 times faster in streaming scenarios.

Summary by CodeRabbit

  • New Features
    • Markdown rendering now includes dark theme support, adapting UI elements to match your theme preference across all components
    • Mermaid code blocks now render as visual diagrams instead of displaying as plain text

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

…rate theme support in NodeRenderer components
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Nov 25, 2025

Walkthrough

This PR upgrades the vue-renderer-markdown dependency and introduces dark theme support across markdown rendering components by integrating the theme store's isDark state into NodeRenderer and adding specialized MermaidBlockNode for mermaid diagram rendering.

Changes

Cohort / File(s) Summary
Dependency Update
package.json
Updated vue-renderer-markdown from 0.0.63-beta.0 to 0.0.63-beta.2
Theme Store Integration
src/renderer/settings/components/AboutUsSettings.vue, src/renderer/src/components/ui/UpdateDialog.vue
Added useThemeStore import and bound isDark prop to NodeRenderer for dark mode awareness
Markdown Renderer Enhancement
src/renderer/src/components/markdown/MarkdownRenderer.vue
Added isDark prop binding to NodeRenderer and introduced MermaidBlockNode import with conditional routing: mermaid code blocks render via MermaidBlockNode, others via CodeBlockNode
Think Content Theme & Mermaid Routing
src/renderer/src/components/think-content/ThinkContent.vue
Added useThemeStore and isDark binding to NodeRenderer; reworked code_block rendering to route mermaid blocks to PreCodeNode and other blocks to CodeBlockNode with extended visibility toggles

Sequence Diagram

sequenceDiagram
    participant Renderer
    participant ThemeStore as Theme Store
    participant NodeRenderer
    participant CodeBlockRouter as Code Block Router
    participant MermaidBlockNode
    participant CodeBlockNode
    
    Renderer->>ThemeStore: Get isDark state
    ThemeStore-->>Renderer: isDark (true/false)
    
    Renderer->>NodeRenderer: Render with isDark prop
    
    NodeRenderer->>CodeBlockRouter: Process code block
    
    alt Language is 'mermaid'
        CodeBlockRouter->>MermaidBlockNode: Route to MermaidBlockNode
        MermaidBlockNode-->>Renderer: Render mermaid diagram (themed)
    else Other languages
        CodeBlockRouter->>CodeBlockNode: Route to CodeBlockNode
        CodeBlockNode-->>Renderer: Render code block (themed)
    end
Loading

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

  • Majority of changes follow a consistent pattern: importing useThemeStore and binding isDark to NodeRenderer across 4 components
  • MermaidBlockNode conditional logic in MarkdownRenderer.vue and ThinkContent.vue is straightforward
  • Dependency update is trivial
  • Low logic density with repetitive structure reduces review complexity

Possibly related PRs

Suggested reviewers

  • zerob13

Poem

🐰 The markdown hops with darkened glee,
Mermaid diagrams themed to be,
Theme store flows through every pane,
Node renderers bloom again!
All the colors shift with care,
Dark and light dance everywhere. ✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title accurately describes the main changes: updating vue-renderer-markdown dependency and integrating theme support across NodeRenderer components.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
✨ Finishing touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment

Tip

📝 Customizable high-level summaries are now available in beta!

You can now customize how CodeRabbit generates the high-level summary in your pull requests — including its content, structure, tone, and formatting.

  • Provide your own instructions using the high_level_summary_instructions setting.
  • Format the summary however you like (bullet lists, tables, multi-section layouts, contributor stats, etc.).
  • Use high_level_summary_in_walkthrough to move the summary from the description to the walkthrough section.

Example instruction:

"Divide the high-level summary into five sections:

  1. 📝 Description — Summarize the main change in 50–60 words, explaining what was done.
  2. 📓 References — List relevant issues, discussions, documentation, or related PRs.
  3. 📦 Dependencies & Requirements — Mention any new/updated dependencies, environment variable changes, or configuration updates.
  4. 📊 Contributor Summary — Include a Markdown table showing contributions:
    | Contributor | Lines Added | Lines Removed | Files Changed |
  5. ✔️ Additional Notes — Add any extra reviewer context.
    Keep each section concise (under 200 words) and use bullet or numbered lists for clarity."

Note: This feature is currently in beta for Pro-tier users, and pricing will be announced later.


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

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

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Nitpick comments (1)
src/renderer/src/components/think-content/ThinkContent.vue (1)

29-37: ThinkContent theming and code_block override look reasonable; minor polish + verify mermaid mapping

  • The dark-theme wiring via useThemeStore and :isDark="themeStore.isDark" on NodeRenderer is consistent with the rest of the app.
  • The new code_block handler that special-cases language === 'mermaid' and otherwise delegates to CodeBlockNode (with all buttons disabled) is a sensible separation of mermaid vs. regular code for this “thinking” view.
  • You still have an explicit mermaid mapping returning PreCodeNode.vue; please double‑check against vue-renderer-markdown docs that having both code_block and mermaid handlers is the intended pattern with the new version and does not lead to duplicated handling or dead code.
  • The new comment // 对于 Mermaid 代码块,直接返回 MermaidNode 组件 should be rewritten in English to follow the project guideline that new comments/logs are English-only.

Example for the comment:

-      // 对于 Mermaid 代码块,直接返回 MermaidNode 组件
+      // For Mermaid code blocks, render the Mermaid node component directly

Also applies to: 48-69, 70-90

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 014bf0d and 3525e02.

📒 Files selected for processing (5)
  • package.json (1 hunks)
  • src/renderer/settings/components/AboutUsSettings.vue (2 hunks)
  • src/renderer/src/components/markdown/MarkdownRenderer.vue (4 hunks)
  • src/renderer/src/components/think-content/ThinkContent.vue (4 hunks)
  • src/renderer/src/components/ui/UpdateDialog.vue (2 hunks)
🧰 Additional context used
📓 Path-based instructions (15)
**/*.{ts,tsx,js,jsx,vue}

📄 CodeRabbit inference engine (CLAUDE.md)

Use English for logs and comments (Chinese text exists in legacy code, but new code should use English)

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/settings/components/AboutUsSettings.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
**/*.vue

📄 CodeRabbit inference engine (CLAUDE.md)

**/*.vue: Use Vue 3 Composition API for all components instead of Options API
Use Tailwind CSS with scoped styles for component styling

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/settings/components/AboutUsSettings.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/renderer/**/*.vue

📄 CodeRabbit inference engine (CLAUDE.md)

src/renderer/**/*.vue: All user-facing strings must use i18n keys via vue-i18n for internationalization
Ensure proper error handling and loading states in all UI components
Implement responsive design using Tailwind CSS utilities for all UI components

src/renderer/**/*.vue: Use composition API and declarative programming patterns; avoid options API
Structure files: exported component, composables, helpers, static content, types
Use PascalCase for component names (e.g., AuthWizard.vue)
Use Vue 3 with TypeScript, leveraging defineComponent and PropType
Use template syntax for declarative rendering
Use Shadcn Vue, Radix Vue, and Tailwind for components and styling
Implement responsive design with Tailwind CSS; use a mobile-first approach
Use Suspense for asynchronous components
Use <script setup> syntax for concise component definitions
Prefer 'lucide:' icon family as the primary choice for Iconify icons
Import Icon component from '@iconify/vue' and use with lucide icons following pattern '{collection}:{icon-name}'

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/settings/components/AboutUsSettings.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/renderer/src/**/*.{vue,ts,tsx}

📄 CodeRabbit inference engine (.cursor/rules/i18n.mdc)

src/renderer/src/**/*.{vue,ts,tsx}: All user-facing strings must use i18n keys with vue-i18n framework in the renderer
Import and use useI18n() composable with the t() function to access translations in Vue components and TypeScript files
Use the dynamic locale.value property to switch languages at runtime
Avoid hardcoding user-facing text and ensure all user-visible text uses the i18n translation system

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/**/*

📄 CodeRabbit inference engine (.cursor/rules/project-structure.mdc)

New features should be developed in the src directory

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/settings/components/AboutUsSettings.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/renderer/**/*.{vue,js,ts}

📄 CodeRabbit inference engine (.cursor/rules/project-structure.mdc)

Renderer process code should be placed in src/renderer (Vue 3 application)

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/settings/components/AboutUsSettings.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/renderer/src/**/*.{vue,ts,tsx,js,jsx}

📄 CodeRabbit inference engine (.cursor/rules/vue-best-practices.mdc)

src/renderer/src/**/*.{vue,ts,tsx,js,jsx}: Use the Composition API for better code organization and reusability in Vue.js applications
Implement proper state management with Pinia in Vue.js applications
Utilize Vue Router for navigation and route management in Vue.js applications
Leverage Vue's built-in reactivity system for efficient data handling

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/renderer/src/**/*.vue

📄 CodeRabbit inference engine (.cursor/rules/vue-best-practices.mdc)

Use scoped styles to prevent CSS conflicts between Vue components

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/renderer/**/*.{ts,tsx,vue}

📄 CodeRabbit inference engine (.cursor/rules/vue-shadcn.mdc)

src/renderer/**/*.{ts,tsx,vue}: Write concise, technical TypeScript code with accurate examples
Use descriptive variable names with auxiliary verbs (e.g., isLoading, hasError)
Avoid enums; use const objects instead
Use arrow functions for methods and computed properties
Avoid unnecessary curly braces in conditionals; use concise syntax for simple statements

Vue 3 app code in src/renderer/src should be organized into components/, stores/, views/, i18n/, lib/ directories with shell UI in src/renderer/shell/

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/settings/components/AboutUsSettings.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/renderer/**

📄 CodeRabbit inference engine (.cursor/rules/vue-shadcn.mdc)

Use lowercase with dashes for directories (e.g., components/auth-wizard)

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/settings/components/AboutUsSettings.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/renderer/**/*.{ts,vue}

📄 CodeRabbit inference engine (.cursor/rules/vue-shadcn.mdc)

src/renderer/**/*.{ts,vue}: Use useFetch and useAsyncData for data fetching
Leverage ref, reactive, and computed for reactive state management
Use provide/inject for dependency injection when appropriate
Use Iconify/Vue for icon implementation

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/settings/components/AboutUsSettings.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/renderer/src/**/*.{ts,tsx,vue}

📄 CodeRabbit inference engine (AGENTS.md)

src/renderer/src/**/*.{ts,tsx,vue}: Use TypeScript with Vue 3 Composition API for the renderer application
All user-facing strings must use vue-i18n keys in src/renderer/src/i18n

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/renderer/src/components/**/*.vue

📄 CodeRabbit inference engine (AGENTS.md)

src/renderer/src/components/**/*.vue: Use Tailwind for styles in Vue components
Vue component files must use PascalCase naming (e.g., ChatInput.vue)

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
src/**/*.{ts,tsx,vue,js,jsx}

📄 CodeRabbit inference engine (AGENTS.md)

Use Prettier with single quotes, no semicolons, and 100 character width

Files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/settings/components/AboutUsSettings.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
package.json

📄 CodeRabbit inference engine (.cursor/rules/development-setup.mdc)

package.json: Node.js >= 22 required
pnpm >= 9 required

Files:

  • package.json
🧠 Learnings (25)
📓 Common learnings
Learnt from: neoragex2002
Repo: ThinkInAIXYZ/deepchat PR: 807
File: src/renderer/src/components/markdown/MarkdownRenderer.vue:58-58
Timestamp: 2025-08-28T08:07:05.182Z
Learning: In src/renderer/src/components/markdown/MarkdownRenderer.vue, the unscoped <style> tag is intentionally used for global prose styles and the anchor .markdown-renderer fix, as confirmed by user neoragex2002.
📚 Learning: 2025-08-28T08:07:05.182Z
Learnt from: neoragex2002
Repo: ThinkInAIXYZ/deepchat PR: 807
File: src/renderer/src/components/markdown/MarkdownRenderer.vue:58-58
Timestamp: 2025-08-28T08:07:05.182Z
Learning: In src/renderer/src/components/markdown/MarkdownRenderer.vue, the unscoped <style> tag is intentionally used for global prose styles and the anchor .markdown-renderer fix, as confirmed by user neoragex2002.

Applied to files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/settings/components/AboutUsSettings.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
📚 Learning: 2025-11-25T05:28:04.439Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-11-25T05:28:04.439Z
Learning: Applies to src/renderer/**/*.vue : Use template syntax for declarative rendering

Applied to files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
📚 Learning: 2025-11-25T05:27:45.535Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-best-practices.mdc:0-0
Timestamp: 2025-11-25T05:27:45.535Z
Learning: Applies to src/renderer/src/**/*.{vue,ts,tsx,js,jsx} : Use the Composition API for better code organization and reusability in Vue.js applications

Applied to files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
📚 Learning: 2025-11-25T05:28:04.439Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-11-25T05:28:04.439Z
Learning: Applies to src/renderer/**/*.vue : Use Shadcn Vue, Radix Vue, and Tailwind for components and styling

Applied to files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • package.json
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/settings/components/AboutUsSettings.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
📚 Learning: 2025-11-25T05:28:04.440Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-11-25T05:28:04.440Z
Learning: Applies to src/renderer/**/*.{ts,vue} : Use Iconify/Vue for icon implementation

Applied to files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
📚 Learning: 2025-11-25T05:28:04.439Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-11-25T05:28:04.439Z
Learning: Applies to src/renderer/**/*.vue : Use <script setup> syntax for concise component definitions

Applied to files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
📚 Learning: 2025-11-25T05:26:43.498Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/i18n.mdc:0-0
Timestamp: 2025-11-25T05:26:43.498Z
Learning: Applies to src/renderer/src/**/*.{vue,ts,tsx} : Avoid hardcoding user-facing text and ensure all user-visible text uses the i18n translation system

Applied to files:

  • src/renderer/src/components/ui/UpdateDialog.vue
📚 Learning: 2025-11-25T05:26:43.498Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/i18n.mdc:0-0
Timestamp: 2025-11-25T05:26:43.498Z
Learning: Applies to src/renderer/src/**/*.{vue,ts,tsx} : Import and use useI18n() composable with the t() function to access translations in Vue components and TypeScript files

Applied to files:

  • src/renderer/src/components/ui/UpdateDialog.vue
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/settings/components/AboutUsSettings.vue
📚 Learning: 2025-11-25T05:26:15.918Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/development-setup.mdc:0-0
Timestamp: 2025-11-25T05:26:15.918Z
Learning: Applies to package.json : Node.js >= 22 required

Applied to files:

  • package.json
📚 Learning: 2025-11-25T05:28:20.500Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-11-25T05:28:20.500Z
Learning: Applies to src/renderer/src/**/*.{ts,tsx,vue} : Use TypeScript with Vue 3 Composition API for the renderer application

Applied to files:

  • package.json
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
📚 Learning: 2025-11-25T05:28:04.439Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-11-25T05:28:04.439Z
Learning: Applies to src/renderer/**/*.vue : Structure files: exported component, composables, helpers, static content, types

Applied to files:

  • package.json
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
📚 Learning: 2025-11-25T05:26:43.498Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/i18n.mdc:0-0
Timestamp: 2025-11-25T05:26:43.498Z
Learning: Applies to src/renderer/src/**/*.{vue,ts,tsx} : All user-facing strings must use i18n keys with vue-i18n framework in the renderer

Applied to files:

  • package.json
📚 Learning: 2025-10-12T00:58:06.513Z
Learnt from: zerob13
Repo: ThinkInAIXYZ/deepchat PR: 977
File: package.json:137-137
Timestamp: 2025-10-12T00:58:06.513Z
Learning: In this Electron project, renderer process dependencies (used only in src/renderer/) should be placed in devDependencies because they are bundled by electron-vite during the build process. Only main process dependencies (used in src/main/) need to be in the dependencies section.

Applied to files:

  • package.json
📚 Learning: 2025-11-25T05:28:20.500Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-11-25T05:28:20.500Z
Learning: Applies to test/**/*.{test,spec}.ts : Use Vitest and Vue Test Utils for testing with jsdom configuration

Applied to files:

  • package.json
📚 Learning: 2025-11-25T05:28:20.500Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-11-25T05:28:20.500Z
Learning: Applies to src/renderer/src/**/*.{ts,tsx,vue} : All user-facing strings must use vue-i18n keys in `src/renderer/src/i18n`

Applied to files:

  • package.json
📚 Learning: 2025-11-25T05:27:26.648Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/project-structure.mdc:0-0
Timestamp: 2025-11-25T05:27:26.648Z
Learning: Applies to src/renderer/**/*.{vue,js,ts} : Renderer process code should be placed in `src/renderer` (Vue 3 application)

Applied to files:

  • package.json
📚 Learning: 2025-11-25T05:28:04.439Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-11-25T05:28:04.439Z
Learning: Applies to src/renderer/**/*.vue : Use Vue 3 with TypeScript, leveraging defineComponent and PropType

Applied to files:

  • package.json
  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
📚 Learning: 2025-11-25T05:27:45.535Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-best-practices.mdc:0-0
Timestamp: 2025-11-25T05:27:45.535Z
Learning: Applies to src/renderer/src/**/*.{vue,ts,tsx,js,jsx} : Utilize Vue Router for navigation and route management in Vue.js applications

Applied to files:

  • package.json
📚 Learning: 2025-11-25T05:28:04.440Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-11-25T05:28:04.440Z
Learning: Applies to src/renderer/**/*.vue : Import Icon component from 'iconify/vue' and use with lucide icons following pattern '{collection}:{icon-name}'

Applied to files:

  • src/renderer/src/components/think-content/ThinkContent.vue
📚 Learning: 2025-11-25T05:28:04.440Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-11-25T05:28:04.440Z
Learning: Applies to src/renderer/**/*.vue : Prefer 'lucide:' icon family as the primary choice for Iconify icons

Applied to files:

  • src/renderer/src/components/think-content/ThinkContent.vue
📚 Learning: 2025-11-25T05:28:04.439Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-11-25T05:28:04.439Z
Learning: Applies to src/renderer/**/composables/*.ts : Use VueUse for common composables and utility functions

Applied to files:

  • src/renderer/src/components/think-content/ThinkContent.vue
  • src/renderer/src/components/markdown/MarkdownRenderer.vue
📚 Learning: 2025-11-25T05:28:04.439Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-11-25T05:28:04.439Z
Learning: Applies to src/renderer/**/stores/*.ts : Use Pinia for state management

Applied to files:

  • src/renderer/settings/components/AboutUsSettings.vue
📚 Learning: 2025-11-25T05:27:20.058Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/pinia-best-practices.mdc:0-0
Timestamp: 2025-11-25T05:27:20.058Z
Learning: Applies to src/renderer/src/stores/**/*.{vue,ts,tsx,js,jsx} : Use modules to organize related state and actions in Pinia stores

Applied to files:

  • src/renderer/settings/components/AboutUsSettings.vue
📚 Learning: 2025-11-25T05:27:20.058Z
Learnt from: CR
Repo: ThinkInAIXYZ/deepchat PR: 0
File: .cursor/rules/pinia-best-practices.mdc:0-0
Timestamp: 2025-11-25T05:27:20.058Z
Learning: Applies to src/renderer/src/stores/**/*.{vue,ts,tsx,js,jsx} : Keep Pinia stores focused on global state, not component-specific data

Applied to files:

  • src/renderer/settings/components/AboutUsSettings.vue
⏰ 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-check (x64)
🔇 Additional comments (5)
package.json (1)

175-175: vue-renderer-markdown bump and placement look good; verify API compatibility

The bump to vue-renderer-markdown@0.0.63-beta.2 in devDependencies matches the pattern for renderer-only libraries bundled by electron-vite. Please just confirm that this beta exposes MermaidBlockNode, getUseMonaco, and the isDark prop on NodeRenderer as used in the Vue files in this PR.

src/renderer/settings/components/AboutUsSettings.vue (1)

151-155: Theme store wiring into disclaimer NodeRenderer is correct and consistent

Importing useThemeStore and binding :isDark="themeStore.isDark" on NodeRenderer cleanly aligns this dialog with the rest of the app’s dark-mode behavior; nothing else to change here.

Also applies to: 190-194

src/renderer/src/components/ui/UpdateDialog.vue (1)

13-13: Dark-theme integration for release notes looks good

Passing :isDark="themeStore.isDark" to NodeRenderer via the new theme store import cleanly extends dark-mode support to the update dialog without altering existing logic.

Also applies to: 69-74

src/renderer/src/components/markdown/MarkdownRenderer.vue (2)

2-7: NodeRenderer template props updated correctly for dark mode

Binding debouncedContent and :isDark="themeStore.isDark" while preserving the copy emit is a clean way to make the markdown renderer theme-aware without changing its external behavior.


18-26: Library API usage (MermaidBlockNode, getUseMonaco, code_block override) looks coherent; please validate against vue-renderer-markdown 0.0.63-beta.2

  • Importing MermaidBlockNode and routing code_block nodes with language === 'mermaid' to it, while using CodeBlockNode for all others (with onPreviewCode driving artifactStore.showArtifact), is a clear split of responsibilities and should work well with the new dependency.
  • Calling getUseMonaco() once at module init to trigger any side effects required for Monaco integration is reasonable, but it depends on the library’s documented usage pattern.
  • The new useThemeStore import and themeStore instance are wired only into NodeRenderer’s isDark prop, which is consistent with other components in this PR.

Given this relies on new exports and behavior from vue-renderer-markdown@0.0.63-beta.2, please confirm against the library docs/examples that:

  • MermaidBlockNode is the recommended component for mermaid code blocks in this version, and
  • getUseMonaco() is intended to be invoked for side effects without using its return value in this context.

Also applies to: 29-39, 96-122

@zerob13 zerob13 merged commit 4275fa0 into ThinkInAIXYZ:dev Nov 25, 2025
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants