split inilnecode in codeblock

apps/app/src/components/ReactMarkdownComponents/CodeBlock.tsx

@@ -1,6 +1,5 @@
 import type { ReactNode } from 'react';
 
-import type { CodeComponent, CodeProps } from 'react-markdown/lib/ast-to-react';
 import { PrismAsyncLight } from 'react-syntax-highlighter';
 import { oneDark } from 'react-syntax-highlighter/dist/cjs/styles/prism';
 
@@ -67,11 +66,11 @@ function CodeBlockSubstance({ lang, children }: { lang: string, children: ReactN
   );
 }
 
-export const CodeBlock: CodeComponent = ({ inline, className, children }: CodeProps) => {
+export const InlineCodeBlock = ({ className, children }: { className: string, children: JSX.Element}): JSX.Element => {
+  return <code className={`code-inline ${className ?? ''}`}>{children}</code>;
+};
 
-  if (inline) {
-    return <code className={`code-inline ${className ?? ''}`}>{children}</code>;
-  }
+export const CodeBlock = ({ className, children }: {className: string, children: JSX.Element}): JSX.Element => {
 
   // TODO: set border according to the value of 'customize:highlightJsStyleBorder'
 

apps/app/src/services/renderer/renderer.tsx

@@ -14,7 +14,7 @@ import deepmerge from 'ts-deepmerge';
 import type { Pluggable, PluginTuple } from 'unified';
 
 
-import { CodeBlock } from '~/components/ReactMarkdownComponents/CodeBlock';
+import { InlineCodeBlock, CodeBlock } from '~/components/ReactMarkdownComponents/CodeBlock';
 import { NextLink } from '~/components/ReactMarkdownComponents/NextLink';
 import type { RendererOptions } from '~/interfaces/renderer-options';
 import { RehypeSanitizeType } from '~/interfaces/services/rehype-sanitize';
@@ -111,6 +111,7 @@ export const generateCommonOptions = (pagePath: string|undefined): RendererOptio
     ],
     components: {
       a: NextLink,
+      inlinecode: InlineCodeBlock,
       code: CodeBlock,
     },
   };
@@ -137,7 +138,7 @@ export const generateSSRViewOptions = (
     remarkPlugins.push(breaks);
   }
 
-  const rehypeSanitizePlugin: Pluggable<any[]> | (() => void) = config.isEnabledXssPrevention
+  const rehypeSanitizePlugin: Pluggable | (() => void) = config.isEnabledXssPrevention
     ? [sanitize, deepmerge(
       getCommonSanitizeOption(config),
     )]