diff --git a/src/components/Comments.js b/src/components/Comments.js
new file mode 100644
index 0000000..8410f6a
--- /dev/null
+++ b/src/components/Comments.js
@@ -0,0 +1,47 @@
+import React from 'react';
+import ReactMde from "react-mde";
+import ReactMarkdown from 'react-markdown';
+import { useSelector } from "react-redux";
+import { connect } from 'react-redux';
+import 'github-markdown-css'
+import "react-mde/lib/styles/css/react-mde-all.css"
+import { newComment } from '../actions';
+
+const Comment = (props) => {
+ const [content, setContent] = React.useState("");
+ const [selectedTab, setSelectedTab] = React.useState("write");
+ const username = useSelector(state => state.auth.username);
+ const submitComment = () => {
+ const payload = {
+ content: content
+ }
+ props.newComment(username, payload)
+ }
+ return (
+
+
+
Leave a comment!
+
+
+
+ Promise.resolve()}
+ />
+
+
+ )
+}
+const mapStateToProps = (state) => {
+ return {
+ user: state.auth
+ };
+}
+
+export default connect(
+ mapStateToProps,
+ { newComment },
+)(Comment);
diff --git a/src/components/Post.js b/src/components/Post.js
index d7af679..42c8f54 100644
--- a/src/components/Post.js
+++ b/src/components/Post.js
@@ -4,6 +4,8 @@ import 'github-markdown-css'
import { connect } from 'react-redux';
import { fetchPost,newComment } from '../actions';
import { Link } from 'react-router-dom';
+import Comment from './Comments';
+import { useSelector } from "react-redux";
class Post extends React.Component {
constructor (props) {
@@ -11,11 +13,12 @@ class Post extends React.Component {
this.state = {
isLoading: true
}
+ console.log(props)
}
componentDidMount() {
const { slug } = this.props.match.params
this.props.fetchPost(slug)
- .then(() => this.setState({isLoading: false}))
+ .then(() => this.setState({isLoading: false, slug: slug}))
}
renderComments(comments, parent_id) {
@@ -50,6 +53,7 @@ class Post extends React.Component {
+
{ this.renderComments(post.comments,post.id) }