Feat/web markdown UI updates#14214
Open
xjq123456 wants to merge 6 commits intoinfiniflow:mainfrom
Open
Conversation
Refactor markdown-related components and centralize remark/rehype plugin setup for document preview, chat widget, and search pages. Made-with: Cursor
…updates Made-with: Cursor
dosubot
Bot
added
the
size:L
Contributor
📝 WalkthroughWalkthroughCentralizes Markdown remark plugins into new shared constants, adds Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 inconclusive)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (2)
web/src/components/markdown-content/index.tsx (1)
13-13: Rename shared constant to PascalCase for guideline compliance.
markdownRemarkPluginsdoes not follow the repo’s constant naming rule. Please rename/export it asMarkdownRemarkPluginsand update call sites in this PR batch.As per coding guidelines,
web/**/*.{ts,tsx,js,jsx}: UsePascalCasefor constants and component names in TypeScript/JavaScript.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@web/src/components/markdown-content/index.tsx` at line 13, Import uses the shared constant named markdownRemarkPlugins which violates the repo constant naming rule; rename and export the constant as MarkdownRemarkPlugins and update all call sites in this PR batch (including the import in web/src/components/markdown-content/index.tsx) to use the new PascalCase name. Locate the original constant definition (export of markdownRemarkPlugins), change its export identifier to MarkdownRemarkPlugins, update any named imports/usages across the changed files to import/use MarkdownRemarkPlugins, and run a quick search to ensure no remaining references to markdownRemarkPlugins remain.web/src/components/next-markdown-content/index.module.less (1)
2-41: Consider extracting shared markdown typography rules to a reusable LESS mixin.This block duplicates the same heading/list/table rhythm rules used in
web/src/components/markdown-content/index.module.lessand may drift over time.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@web/src/components/next-markdown-content/index.module.less` around lines 2 - 41, Extract the duplicated heading/list/table rhythm into a reusable LESS mixin (e.g., .markdownTypography()) in a shared LESS file and replace the duplicated blocks in this file by including that mixin; specifically, move the shared rules for :global(h1), :global(h2), :global(h3), :global(h4)/:global(h5)/:global(h6), :global(p), :global(ul)/:global(ol), :global(li), and :global(table) into the mixin (parameterize spacing/font-size/line-height if needed) and then call the mixin from this module (and update the other module that currently duplicates the same rules to also include the mixin) so both components use the single source of truth for markdown typography.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@web/src/components/document-preview/md/index.tsx`:
- Around line 7-8: The document preview importer currently uses local plugins
(remarkGfm, remarkBreaks) while a shared constant markdownRemarkPlugins includes
remarkMath; decide whether this preview should render math and then implement
one of the three options: (1) create a new math-free constant (e.g.,
markdownRemarkPluginsBase = [remarkGfm, remarkBreaks]) and replace the local
imports with that constant, (2) leave the component's local plugins and add a
short comment in the document-preview index.tsx explaining the intentional
divergence from markdownRemarkPlugins, or (3) add remarkMath to this component
(by using markdownRemarkPlugins) if math rendering is required—ensure you
reference remarkGfm, remarkBreaks, remarkMath and the shared
markdownRemarkPlugins constant when making the change.
In `@web/src/constants/markdown-remark-plugins.ts`:
- Line 11: Rename the exported constant markdownRemarkPlugins to PascalCase
(e.g., MarkdownRemarkPlugins) and update all references and imports to use the
new name; change the export declaration (export const markdownRemarkPlugins =
[...]) to export const MarkdownRemarkPlugins = [...] and then search for and
update every usage/import of markdownRemarkPlugins to MarkdownRemarkPlugins
(including any default or named imports in components, pages, or plugin
registries) to keep types and tooling happy.
---
Nitpick comments:
In `@web/src/components/markdown-content/index.tsx`:
- Line 13: Import uses the shared constant named markdownRemarkPlugins which
violates the repo constant naming rule; rename and export the constant as
MarkdownRemarkPlugins and update all call sites in this PR batch (including the
import in web/src/components/markdown-content/index.tsx) to use the new
PascalCase name. Locate the original constant definition (export of
markdownRemarkPlugins), change its export identifier to MarkdownRemarkPlugins,
update any named imports/usages across the changed files to import/use
MarkdownRemarkPlugins, and run a quick search to ensure no remaining references
to markdownRemarkPlugins remain.
In `@web/src/components/next-markdown-content/index.module.less`:
- Around line 2-41: Extract the duplicated heading/list/table rhythm into a
reusable LESS mixin (e.g., .markdownTypography()) in a shared LESS file and
replace the duplicated blocks in this file by including that mixin;
specifically, move the shared rules for :global(h1), :global(h2), :global(h3),
:global(h4)/:global(h5)/:global(h6), :global(p), :global(ul)/:global(ol),
:global(li), and :global(table) into the mixin (parameterize
spacing/font-size/line-height if needed) and then call the mixin from this
module (and update the other module that currently duplicates the same rules to
also include the mixin) so both components use the single source of truth for
markdown typography.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 05b878cb-f2a2-4087-90c8-98ada2c7df92
⛔ Files ignored due to path filters (1)
web/package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (10)
web/package.jsonweb/src/components/document-preview/md/index.tsxweb/src/components/floating-chat-widget-markdown.tsxweb/src/components/highlight-markdown/index.tsxweb/src/components/markdown-content/index.module.lessweb/src/components/markdown-content/index.tsxweb/src/components/next-markdown-content/index.module.lessweb/src/components/next-markdown-content/index.tsxweb/src/constants/markdown-remark-plugins.tsweb/src/pages/next-search/markdown-content/index.tsx
…without math Addresses CodeRabbit: document preview stays GFM+breaks only; avoids pulling remark-math where rehype-katex is not configured. Made-with: Cursor
…DE.md Rename markdownRemarkPlugins* to MarkdownRemarkPlugins* and update imports. Made-with: Cursor
cike8899
approved these changes
Apr 30, 2026
Author
|
Conflicts resolved. Ready for merge. Appreciate your review! |
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
2 participants
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.
What problem does this PR solve?
LLM/chat and search UIs render Markdown in several places (document preview, floating chat widget, next-search, etc.). Plugin lists and behavior were duplicated or inconsistent, and single newlines in model output were not always rendered as visible line breaks, which hurts readability for chat-style content.
This PR centralizes shared remark/rehype configuration (including
remark-breaksfor newline handling) and wires the main Markdown surfaces to use it, so behavior is consistent and easier to maintain.**中文摘要：**统一多处 Markdown 的 remark/rehype 插件配置（含
remark-breaks处理换行），并更新文档预览、悬浮对话、检索等入口的渲染逻辑，提升一致性与可维护性。Type of change