replace GrommetMarkdown component with markdown-to-jsx v7.1.8 to fix markdown styling issue in firefox

Author: pramodreddysareddy

package.json

@@ -43,6 +43,7 @@
     "grommet-icons": "^4.11.0",
     "grommet-theme-hpe": "2.0.2",
     "jest-styled-components": "^7.2.0",
+    "markdown-to-jsx": "7.1.8",
     "netlify-cms-app": "^2.15.72",
     "netlify-cms-media-library-cloudinary": "^1.3.10",
     "prismjs": "^1.29.0",

src/components/Header/UserMenu.js

@@ -4,8 +4,6 @@ import { LinkNext } from 'grommet-icons';
 import PropTypes from 'prop-types';
 import { ButtonLink } from '..';
 
-// const { GATSBY_HPE_SIGNOUT } = process.env;
-// const { GATSBY_REDIRECT_URI } = process.env;
 
 function getInitials(name) {
   if (!name) {

src/components/Header/index.js

@@ -17,9 +17,6 @@ import { ButtonLink } from '..';
 import { UserMenu } from './UserMenu';
 
 
-// const { GATSBY_CLIENT_ID } = process.env;
-// const { GATSBY_CLIENT_OAUTH } = process.env;
-
 const TextAlignLeft = styled(Box)`
   & > a {
     text-align: left;

src/components/Markdown/index.js

@@ -7,14 +7,14 @@ import {
   Button,
   Heading,
   Image as GrommetImage,
-  Markdown as GrommetMarkdown,
   Paragraph,
 } from 'grommet';
 import { Download, Github } from 'grommet-icons';
 import PropTypes from 'prop-types';
 import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
 import { deepMerge } from 'grommet/utils';
 import codestyle from './markdownTheme';
+import MarkdownToJSX from 'markdown-to-jsx';
 
 class Image extends React.Component {
   render() {
@@ -158,13 +158,13 @@ export const titleComponents = deepMerge(cardComponents, {
 });
 
 export const Markdown = (props) => (
-  <GrommetMarkdown components={components} {...props} />
+  <MarkdownToJSX components={components} {...props} />
 );
 export const CardMarkdown = (props) => (
-  <GrommetMarkdown components={cardComponents} {...props} />
+  <MarkdownToJSX components={cardComponents} {...props} />
 );
 export const TitleMarkdown = (props) => (
-  <GrommetMarkdown components={titleComponents} {...props} />
+  <MarkdownToJSX components={titleComponents} {...props} />
 );
 
 export default Markdown;

yarn.lock

@@ -9686,10 +9686,15 @@ markdown-table@^2.0.0:
   dependencies:
     repeat-string "^1.0.0"
 
+[email protected]:
+  version "7.1.8"
+  resolved "https://registry.yarnpkg.com/markdown-to-jsx/-/markdown-to-jsx-7.1.8.tgz#49c3bb3c122aa714324034142c8829b93c889338"
+  integrity sha512-rRSa1aFmFnpDRFAhv5vIkWM4nPaoB9vnzIjuIKa1wGupfn2hdCNeaQHKpu4/muoc8n8J7yowjTP2oncA4/Rbgg==
+
 markdown-to-jsx@^7.2.0:
-  version "7.4.0"
-  resolved "https://registry.yarnpkg.com/markdown-to-jsx/-/markdown-to-jsx-7.4.0.tgz#4606c5c549a6f6cb87604c35f5ee4f42959ffb6b"
-  integrity sha512-zilc+MIkVVXPyTb4iIUTIz9yyqfcWjszGXnwF9K/aiBWcHXFcmdEMTkG01/oQhwSCH7SY1BnG6+ev5BzWmbPrg==
+  version "7.4.1"
+  resolved "https://registry.yarnpkg.com/markdown-to-jsx/-/markdown-to-jsx-7.4.1.tgz#1ed6a60f8f9cd944bec39d9923fbbc8d3d60dcb9"
+  integrity sha512-GbrbkTnHp9u6+HqbPRFJbObi369AgJNXi/sGqq5HRsoZW063xR1XDCaConqq+whfEIAlzB1YPnOgsPc7B7bc/A==
 
 material-colors@^1.2.1:
   version "1.2.6"