set header components in generateViewOptions

packages/app/src/services/renderer/growi-renderer.tsx

@@ -219,9 +219,6 @@ const generateCommonOptions: ReactMarkdownOptionsGenerator = (
     rehypePlugins: [slug],
     components: {
       a: NextLink,
-      h1: Header,
-      h2: Header,
-      h3: Header,
     },
   };
 };
@@ -232,14 +229,17 @@ export const generateViewOptions: ReactMarkdownOptionsGenerator = (
 
   const options = generateCommonOptions(growiRendererConfig, rendererSettings);
 
-  const { remarkPlugins, rehypePlugins } = options;
+  const { remarkPlugins, rehypePlugins, components } = options;
 
   // add remark plugins
-  remarkPlugins?.push(footnotes);
-  remarkPlugins?.push(emoji);
-  if (rendererSettings.isEnabledLinebreaks) {
-    remarkPlugins?.push(breaks);
+  if (remarkPlugins != null) {
+    remarkPlugins.push(footnotes);
+    remarkPlugins.push(emoji);
+    if (rendererSettings.isEnabledLinebreaks) {
+      remarkPlugins.push(breaks);
+    }
   }
+
   // add rehypePlugins
   // rehypePlugins.push([toc, {
   //   headings: ['h1', 'h2', 'h3'],
@@ -249,6 +249,13 @@ export const generateViewOptions: ReactMarkdownOptionsGenerator = (
   //   behavior: 'append',
   // }]);
 
+  // add components
+  if (components != null) {
+    components.h1 = Header;
+    components.h2 = Header;
+    components.h3 = Header;
+  }
+
   // // Add configurers for viewer
   // renderer.addConfigurers([
   //   new FooternoteConfigurer(),