refactor: Remove unnecessary flex classes from CodeBlock component

This commit is contained in:
n4ze3m 2024-06-03 15:55:12 +05:30
parent 56b7121922
commit 4a5713d6e4
2 changed files with 6 additions and 18 deletions

View File

@ -1,6 +1,6 @@
import { Tooltip } from "antd"
import { CheckIcon, ClipboardIcon } from "lucide-react"
import { FC, memo, useState } from "react"
import { FC, useState } from "react"
import { useTranslation } from "react-i18next"
import { Prism as SyntaxHighlighter } from "react-syntax-highlighter"
import { coldarkDark } from "react-syntax-highlighter/dist/cjs/styles/prism"
@ -10,7 +10,7 @@ interface Props {
value: string
}
export const CodeBlock: FC<Props> = memo(({ language, value }) => {
export const CodeBlock: FC<Props> =({ language, value }) => {
const [isBtnPressed, setIsBtnPressed] = useState(false)
const { t } = useTranslation("common")
return (
@ -63,4 +63,4 @@ export const CodeBlock: FC<Props> = memo(({ language, value }) => {
</div>
</>
)
})
}

View File

@ -1,28 +1,16 @@
import remarkGfm from "remark-gfm"
import remarkMath from "remark-math"
import ReactMarkdown, { Options } from "react-markdown"
import ReactMarkdown from "react-markdown"
import "property-information"
import React from "react"
import { Tooltip } from "antd"
import { CheckIcon, ClipboardIcon } from "lucide-react"
import { useTranslation } from "react-i18next"
import { FC, memo } from "react"
import { CodeBlock } from "./CodeBlock"
export const MemoizedReactMarkdown: FC<Options> = memo(
ReactMarkdown,
(prevProps, nextProps) =>
prevProps.children === nextProps.children &&
prevProps.className === nextProps.className
)
export default function Markdown({ message }: { message: string }) {
return (
<React.Fragment>
<MemoizedReactMarkdown
<ReactMarkdown
className="prose break-words dark:prose-invert prose-p:leading-relaxed prose-pre:p-0 dark:prose-dark"
remarkPlugins={[remarkGfm, remarkMath]}
components={{
@ -55,7 +43,7 @@ export default function Markdown({ message }: { message: string }) {
}
}}>
{message}
</MemoizedReactMarkdown>
</ReactMarkdown>
</React.Fragment>
)
}