Fix code block for syntax highlighter

scm-ui/ui-components/src/markdown/MarkdownCodeRenderer.tsx

@@ -36,6 +36,8 @@ const MarkdownCodeRenderer: FC<Props> = props => {
   const binder = useBinder();
   const indexLinks = useIndexLinks();
   const { language } = props;
+  console.log("renderer", props);
+
   const extensionKey = `markdown-renderer.code.${language}`;
   if (binder.hasExtension(extensionKey, props)) {
     return <ExtensionPoint name={extensionKey} props={{ ...props, indexLinks }} />;

scm-ui/ui-components/src/markdown/createComponentList.ts

@@ -15,7 +15,7 @@ export const createComponentList = (
   const components: Record<string, any> = {};
 
   if (remarkRendererList.code) {
-    components.code = createRemark2RehypeCodeRendererAdapter(remarkRendererList.code);
+    components.pre = createRemark2RehypeCodeRendererAdapter(remarkRendererList.code);
   }
 
   if (remarkRendererList.link) {

scm-ui/ui-components/src/markdown/remarkToRehypeRendererAdapters.ts

@@ -1,7 +1,30 @@
+/*
+ * MIT License
+ *
+ * Copyright (c) 2020-present Cloudogu GmbH and Contributors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
 import React from "react";
 
 export const createRemark2RehypeCodeRendererAdapter = (remarkRenderer: any) => {
-  return ({ node, children }: any) => {
+  const codeBlock = ({ node, children }: any) => {
     children = children || [];
     const renderProps = {
       value: children[0],
@@ -9,6 +32,18 @@ export const createRemark2RehypeCodeRendererAdapter = (remarkRenderer: any) => {
     };
     return React.createElement(remarkRenderer, renderProps, ...children);
   };
+
+  return ({ node, children }: any) => {
+    children = children || [];
+
+    if (children.length === 1) {
+      const code = node.children[0];
+      if (code.tagName === "code") {
+        return codeBlock({ node: code, children: children[0].props.children });
+      }
+    }
+    return React.createElement(node.tagName, {}, ...children);
+  };
 };
 
 export const createRemark2RehypeLinkRendererAdapter = (remarkRenderer: any) => {

yarn.lock

@@ -5998,10 +5998,10 @@
     "@webassemblyjs/wast-parser" "1.9.0"
     "@xtuc/long" "4.2.2"
 
-"@wojtekmaj/enzyme-adapter-react-17@^0.4.1":
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/@wojtekmaj/enzyme-adapter-react-17/-/enzyme-adapter-react-17-0.4.1.tgz#a9d4a2873025c6de19e1142ca076661bac69f587"
-  integrity sha512-WZr8i4C6WVDV7Mb8sbm7GdlEPmk1f+xOMjUKThqrkWgwsfvu90zJyyX54wyAvsS91sjtKZ0JipGj2cJnEDaxPA==
+"@wojtekmaj/enzyme-adapter-react-17@^0.5.0":
+  version "0.5.0"
+  resolved "https://registry.yarnpkg.com/@wojtekmaj/enzyme-adapter-react-17/-/enzyme-adapter-react-17-0.5.0.tgz#678e9781b16bbec42bb062313f3d8d61a998fe7d"
+  integrity sha512-8wktaU7UZCi8vdH0oModzUt2iim5PsOlYabcJ88fAtzRraJJGjqU+JOshYJw4ug/LW8WKjPk5r/1J1EwcHeckw==
   dependencies:
     enzyme-adapter-utils "^1.14.0"
     enzyme-shallow-equal "^1.0.4"
@@ -6011,7 +6011,6 @@
     prop-types "^15.7.2"
     react-is "^17.0.0"
     react-test-renderer "^17.0.0"
-    semver "^5.7.0"
 
 "@xtuc/ieee754@^1.2.0":
   version "1.2.0"
@@ -18383,16 +18382,16 @@ react-redux@^5.0.7:
     react-is "^16.6.0"
     react-lifecycles-compat "^3.0.0"
 
+react-refresh@^0.10.0:
+  version "0.10.0"
+  resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.10.0.tgz#2f536c9660c0b9b1d500684d9e52a65e7404f7e3"
+  integrity sha512-PgidR3wST3dDYKr6b4pJoqQFpPGNKDSCDx4cZoshjXipw3LzO7mG1My2pwEzz2JVkF+inx3xRpDeQLFQGH/hsQ==
+
 react-refresh@^0.8.3:
   version "0.8.3"
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.3.tgz#721d4657672d400c5e3c75d063c4a85fb2d5d68f"
   integrity sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg==
 
-react-refresh@^0.9.0:
-  version "0.9.0"
-  resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.9.0.tgz#71863337adc3e5c2f8a6bfddd12ae3bfe32aafbf"
-  integrity sha512-Gvzk7OZpiqKSkxsQvO/mbTN1poglhmAV7gR/DdIrRrSMXraRQQlfikRJOr3Nb9GTMPC5kof948Zy6jJZIFtDvQ==
-
 react-router-dom@^5.1.2:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-5.2.0.tgz#9e65a4d0c45e13289e66c7b17c7e175d0ea15662"