replace dangerouslysetinnerhtml by using react-markdown

2 files changed, 7 insertions, 9 deletions

diff --git a/frontend/src/components/ViewPaste.js b/frontend/src/components/ViewPaste.js
index ebdc950..2d69544 100644
--- a/frontend/src/components/ViewPaste.js
+++ b/frontend/src/components/ViewPaste.js
@@ -15,7 +15,7 @@ function fmtDateStr(dateString) {
 }
 
 const ViewPaste = (props) => {
-    const [title, setTitle] = useState('untitled paste');
+    const [title, setTitle] = useState('fetching paste...');
     const [content, setContent] = useState('');
     const [hasPass, setHasPass] = useState(false);
     const [enteredPass, setEnteredPass] = useState('');
@@ -64,8 +64,7 @@ const ViewPaste = (props) => {
     useEffect(() => {
         FetchPaste(props.hash)
             .then((response) => {
-                const data = response.data
-                setStateFromData(data)
+                setStateFromData(response.data)
             }).catch((error) => {
                 const resp = error.response
 
diff --git a/frontend/src/components/renderers/Markdown.js b/frontend/src/components/renderers/Markdown.js
index b1d7905..b9b9112 100644
--- a/frontend/src/components/renderers/Markdown.js
+++ b/frontend/src/components/renderers/Markdown.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import marked from 'marked';
+import ReactMarkdown from 'react-markdown';
 import styled from 'styled-components'
 
 const Content = styled.div`
@@ -9,11 +9,10 @@ const Content = styled.div`
         max-width: 100%;
     }
 `
-const Markdown = (props) => {
-    const dangerousHtml = {
-        __html: marked(props.content)
-    }
-    return <Content dangerouslySetInnerHTML={dangerousHtml} />;
+const Markdown = ({content}) => {
+    return <Content>
+        <ReactMarkdown source={content} />
+    </Content>;
 }
 
 export default Markdown
\ No newline at end of file