Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
WalkthroughAdded a Tailwind class to the Markdown article element to apply whitespace-pre-line to paragraph descendants, preserving line breaks in rendered content. No logic, data, or control-flow changes. Changes
Estimated code review effort🎯 1 (Trivial) | ⏱️ ~2 minutes Possibly related PRs
Suggested reviewers
Poem
Tip 🔌 Remote MCP (Model Context Protocol) integration is now available!Pro plan users can now connect to remote MCP servers from the Integrations page. Connect with popular remote MCPs such as Notion and Linear to add more context to your reviews and chats. ✨ Finishing Touches
🧪 Generate unit tests
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. CodeRabbit Commands (Invoked using PR/Issue comments)Type Other keywords and placeholders
CodeRabbit Configuration File (
|
📝 추가 및 변경된 파일총 1개 파일 변경 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
mosu-app/src/entities/posts/ui/MarkDown.tsx (1)
11-11: Preserve newlines in more Markdown elements (optional).Good fix. To cover soft line breaks inside lists and tables too (common in user content), consider extending the selector beyond paragraphs.
-className={cn(props.className, "prose max-w-none [&>h1]:my-1 [&_p]:whitespace-pre-line")} +className={cn( + props.className, + "prose max-w-none [&>h1]:my-1 [&_p,&_li,&_td,&_th]:whitespace-pre-line" +)}
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (1)
mosu-app/src/entities/posts/ui/MarkDown.tsx(1 hunks)
🧰 Additional context used
🪛 ast-grep (0.38.6)
mosu-app/src/entities/posts/ui/MarkDown.tsx
[warning] 11-11: Usage of dangerouslySetInnerHTML detected. This bypasses React's built-in XSS protection. Always sanitize HTML content using libraries like DOMPurify before injecting it into the DOM to prevent XSS attacks.
Context: dangerouslySetInnerHTML
Note: [CWE-79] Improper Neutralization of Input During Web Page Generation [REFERENCES]
- https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml
- https://cwe.mitre.org/data/definitions/79.html
(react-unsafe-html-injection)
⏰ 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). (2)
- GitHub Check: Run Unit & Integration Tests
- GitHub Check: Run DangerJS
| {...props} | ||
| className={cn(props.className, "prose max-w-none [&>h1]:my-1")} | ||
| className={cn(props.className, "prose max-w-none [&>h1]:my-1 [&_p]:whitespace-pre-line")} | ||
| dangerouslySetInnerHTML={{ __html: content }} |
There was a problem hiding this comment.
Sanitize HTML before injection to prevent XSS.
dangerouslySetInnerHTML is high risk if content can include user input. Sanitize on the client (or ensure it’s sanitized server-side) to block script/style injection.
Apply this minimal change here:
- dangerouslySetInnerHTML={{ __html: content }}
+ dangerouslySetInnerHTML={{ __html: sanitized }}And add the supporting code (outside this hunk):
// imports
import { useMemo } from "react";
import DOMPurify from "isomorphic-dompurify";
// inside component
const sanitized = useMemo(
() =>
DOMPurify.sanitize(content, {
USE_PROFILES: { html: true }, // safe default; adjust allowlist if needed
}),
[content]
);🧰 Tools
🪛 Biome (2.1.2)
[error] 12-12: Avoid passing content using the dangerouslySetInnerHTML prop.
Setting content using code can expose users to cross-site scripting (XSS) attacks
(lint/security/noDangerouslySetInnerHtml)
🤖 Prompt for AI Agents
In mosu-app/src/entities/posts/ui/MarkDown.tsx around line 12, the component is
injecting raw HTML via dangerouslySetInnerHTML using content; sanitize content
first to prevent XSS by importing useMemo and DOMPurify (isomorphic-dompurify),
creating a memoized sanitized variable via DOMPurify.sanitize(content, {
USE_PROFILES: { html: true } }) with [content] as the dependency, and then pass
sanitized to dangerouslySetInnerHTML instead of raw content; also ensure
isomorphic-dompurify is added to package dependencies.
📚 Storybook이 Chromatic에 배포되었습니다!
|
1 participant
✅ Linked Issue
🔍 What I did
Summary by CodeRabbit