Markdown support in card description and comment, fixes for mobile devices, update dependencies

client/src/lib/custom-ui/components/Markdown/Markdown.jsx

@@ -0,0 +1,43 @@
+import React, { useCallback } from 'react';
+import PropTypes from 'prop-types';
+import ReactMarkdown from 'react-markdown';
+
+const Markdown = React.memo(({ linkStopPropagation, ...props }) => {
+  const handleLinkClick = useCallback((event) => {
+    event.stopPropagation();
+  }, []);
+
+  const linkRenderer = useCallback(
+    /* eslint-disable jsx-a11y/anchor-has-content,
+                      jsx-a11y/click-events-have-key-events,
+                      jsx-a11y/no-static-element-interactions,
+                      react/jsx-props-no-spreading */
+    (linkProps) => <a {...linkProps} onClick={handleLinkClick} />,
+    /* eslint-enable jsx-a11y/anchor-has-content,
+                     jsx-a11y/click-events-have-key-events,
+                     jsx-a11y/no-static-element-interactions,
+                     react/jsx-props-no-spreading */
+    [handleLinkClick],
+  );
+
+  let renderers;
+
+  if (linkStopPropagation) {
+    renderers = {
+      link: linkRenderer,
+    };
+  }
+
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  return <ReactMarkdown {...props} renderers={renderers} />;
+});
+
+Markdown.propTypes = {
+  linkStopPropagation: PropTypes.bool,
+};
+
+Markdown.defaultProps = {
+  linkStopPropagation: false,
+};
+
+export default Markdown;

client/src/lib/custom-ui/components/Markdown/index.js

@@ -0,0 +1,3 @@
+import Markdown from './Markdown';
+
+export default Markdown;

client/src/lib/custom-ui/index.js

@@ -1,5 +1,8 @@
 import Input from './components/Input';
 import Popup from './components/Popup';
+import Markdown from './components/Markdown';
 import DragScroller from './components/DragScroller';
 
-export { Input, Popup, DragScroller };
+export {
+  Input, Popup, Markdown, DragScroller,
+};