diff --git a/scm-ui/ui-components/src/MarkdownView.stories.tsx b/scm-ui/ui-components/src/MarkdownView.stories.tsx index c8704c155d..a7e71aac2b 100644 --- a/scm-ui/ui-components/src/MarkdownView.stories.tsx +++ b/scm-ui/ui-components/src/MarkdownView.stories.tsx @@ -5,6 +5,7 @@ import styled from "styled-components"; import { MemoryRouter } from "react-router-dom"; import TestPage from "./__resources__/test-page.md"; +import MarkdownWithoutLang from "./__resources__/markdown-without-lang.md"; const Spacing = styled.div` padding: 2em; @@ -16,4 +17,9 @@ storiesOf("MarkdownView", module) + )) + .add("Code without Lang", () => ( + + + )); diff --git a/scm-ui/ui-components/src/SyntaxHighlighter.tsx b/scm-ui/ui-components/src/SyntaxHighlighter.tsx index c50ee3f559..8544f3db01 100644 --- a/scm-ui/ui-components/src/SyntaxHighlighter.tsx +++ b/scm-ui/ui-components/src/SyntaxHighlighter.tsx @@ -5,14 +5,29 @@ import { LightAsync as ReactSyntaxHighlighter } from "react-syntax-highlighter"; import { arduinoLight } from "react-syntax-highlighter/dist/cjs/styles/hljs"; type Props = { - language: string; + language?: string; value: string; }; +const defaultLanguage = "text"; + class SyntaxHighlighter extends React.Component { + static defaultProps: Partial = { + language: defaultLanguage + }; + + getLanguage = () => { + const { language } = this.props; + if (language) { + return language; + } + return defaultLanguage; + }; + render() { + const language = this.getLanguage(); return ( - + {this.props.value} ); diff --git a/scm-ui/ui-components/src/__resources__/markdown-without-lang.md.ts b/scm-ui/ui-components/src/__resources__/markdown-without-lang.md.ts new file mode 100644 index 0000000000..684db74c66 --- /dev/null +++ b/scm-ui/ui-components/src/__resources__/markdown-without-lang.md.ts @@ -0,0 +1,7 @@ +export default ` +Here is markdown with code, but without Language. + +\`\`\` +Code without Language! +\`\`\` +`; diff --git a/scm-ui/ui-components/src/__snapshots__/storyshots.test.ts.snap b/scm-ui/ui-components/src/__snapshots__/storyshots.test.ts.snap index ad62118912..05823fa7bb 100644 --- a/scm-ui/ui-components/src/__snapshots__/storyshots.test.ts.snap +++ b/scm-ui/ui-components/src/__snapshots__/storyshots.test.ts.snap @@ -484,6 +484,39 @@ exports[`Storyshots Logo Default 1`] = ` `; +exports[`Storyshots MarkdownView Code without Lang 1`] = ` +
+
+
+

+ Here is markdown with code, but without Language. +

+
+        
+          Code without Language!
+        
+      
+
+
+
+`; + exports[`Storyshots MarkdownView Default 1`] = `