diff --git a/controllers/comment.js b/controllers/comment.js index 55fe7272..53944ade 100644 --- a/controllers/comment.js +++ b/controllers/comment.js @@ -40,7 +40,7 @@ async function getComment(req, res) { async function createComment(req, res) { try { - const { comment_id, name, email, comment, markdown, user_id } = req.body; + const { comment_id, name, email, comment, markdown, user_id, avatar } = req.body; console.log(req.body) const com = await Comments.findOne({ comment_id }); @@ -52,7 +52,7 @@ async function createComment(req, res) { const newComment = new Comments({ comment_id, name, email, comment, markdown, user_id, - blog: req.params.id + blog: req.params.id, avatar }) await newComment.save() diff --git a/models/article.js b/models/article.js index 88c9e37d..701bdf4d 100755 --- a/models/article.js +++ b/models/article.js @@ -13,10 +13,10 @@ const articleSchema = new mongoose.Schema({ trim: true, unique: true }, - // postedBy: { - // type: mongoose.Schema.Types.ObjectId, - // ref: 'Users' - // }, + postedBy: { + type: mongoose.Schema.Types.ObjectId, + ref: 'Users' + }, title: { type: String, required: true, diff --git a/models/comment.js b/models/comment.js index d6300d4c..69c7003c 100644 --- a/models/comment.js +++ b/models/comment.js @@ -9,6 +9,10 @@ const commentSchema = new mongoose.Schema({ type:String, required: "this field is required" }, + avatar: { + type: Object, + default: "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcT0k6I8WItSjK0JTttL3FwACOA6yugI29xvLw&usqp=CAU" + }, comment:{ type:String, required:"this filed is required" diff --git a/src/Components/Article/MainContainer.jsx b/src/Components/Article/MainContainer.jsx index aa4ee45c..7dd9124d 100644 --- a/src/Components/Article/MainContainer.jsx +++ b/src/Components/Article/MainContainer.jsx @@ -65,7 +65,7 @@ const MainContainer = (props) => {

- + {/* { +const RightColumn = (props) => { const history = useHistory(); // const uri = window.location.pathname; const state = useContext(GlobalState); + const [currentUser, setCurrentUser] = useState(props.user); const [isLoggedIn] = state.userAPI.isLoggedIn; const [search, setSearch] = useState('') - const [viewComment, setViewComment] = useState(true) const [comments, setComments] = useState({comments: []}) const param = useParams() const shuffleArray = (arr) => arr.sort(() => 0.5 - Math.random()); - const recentPosts = shuffleArray(articles) + const recentPosts = shuffleArray(props.articles) .filter((article) => { // article._id !== uri.split('/')[2] return article.title.toLowerCase().indexOf( @@ -61,9 +62,9 @@ const RightColumn = ({user, articles}) => { return ( <> { - viewComment ? + props.viewComment ? - +
@@ -72,19 +73,42 @@ const RightColumn = ({user, articles}) => {
- + props.setViewComment(false)} style={{fontSize: '2.5rem'}}/>
-
- -

Name

- - - -
- + + +
+ : +
+
+ Anonymous User +

Anonymous

+
+ +
+ + +
+
+ + } +
@@ -93,21 +117,37 @@ const RightColumn = ({user, articles}) => { comments.comments.length !== 0 ? <> {comments.comments.map(comment => { + const date1 = new Date(); + const date2 = new Date(comment.createdAt); + const Difference_In_Time = date2.getTime() - date1.getTime(); + let Difference_In_Days = `${Math.round(Difference_In_Time / (1000 * 3600 * 24) * -1)} days`; + if (Difference_In_Days === "0 days") Difference_In_Days = `${Math.round(Difference_In_Time / (1000 * 3600 * 24) * -100)} hours` + if (Difference_In_Days === "1 days") Difference_In_Days = `${Math.round(Difference_In_Time / (1000 * 3600 * 24) * -1)} day` return (
-
- -

{comment.name}

Reference towards the blog writer -

minutes ago

-
-
- Settings Icon +
+ {`${comment.name}-avatar`} +
+
+

+ {comment.name}   + AUTHOR +

+

{Difference_In_Days} ago

+
+
+ +
+
{comment.comment}
-
- +
+
@@ -126,7 +166,7 @@ const RightColumn = ({user, articles}) => { Sign In : -

Welcome, {user.name.split(' ')[0]}

+

Welcome, {currentUser.name.split(' ')[0]}

} @@ -137,9 +177,9 @@ const RightColumn = ({user, articles}) => { onChange={updateSearch}/> - - {user.name || "Will Smith"} + {currentUser.name || "Will Smith"} 119 Followers Software Engineer | Python Programmer | Java Programmer | Tech Enthusiast | JavaScript Programmer | React Lover | Mobile Developer diff --git a/src/Components/Sticky/StickyFooter.jsx b/src/Components/Sticky/StickyFooter.jsx index 0b510233..ebe8b519 100644 --- a/src/Components/Sticky/StickyFooter.jsx +++ b/src/Components/Sticky/StickyFooter.jsx @@ -11,7 +11,7 @@ import {RiShareCircleFill} from 'react-icons/ri'; import {TiSocialLinkedinCircular} from 'react-icons/ti'; import './StickyState.css'; -const StickyFooter = ({id, likes}) => { +const StickyFooter = ({id, likes, setViewComment, viewComment}) => { const [postLikes, setPostLikes] = useState(likes) useEffect(() => { @@ -36,7 +36,7 @@ const StickyFooter = ({id, likes}) => {   {postLikes}   -   1 + setViewComment(true)}/>   1 diff --git a/src/Pages/Articles/Article/Article.jsx b/src/Pages/Articles/Article/Article.jsx index 56fa7599..dac40e47 100755 --- a/src/Pages/Articles/Article/Article.jsx +++ b/src/Pages/Articles/Article/Article.jsx @@ -13,6 +13,7 @@ const ArticleItem = () => { const [user] = state.userAPI.user; const [articles] = state.articlesAPI.articles const [detailArticle, setdetailArticle] = useState([]) + const [viewComment, setViewComment] = useState(false) useEffect(() => { if (params.id) { @@ -37,8 +38,8 @@ const ArticleItem = () => { user.name !== "" && } - - + + ) diff --git a/src/Pages/Articles/LikeButton.jsx b/src/Pages/Articles/LikeButton.jsx deleted file mode 100755 index b899ac1c..00000000 --- a/src/Pages/Articles/LikeButton.jsx +++ /dev/null @@ -1,24 +0,0 @@ -import React, { Component } from 'react'; - -const e = React.createElement; - -class LikeButton extends Component { - constructor(props) { - super(props); - this.state = { liked: false }; - } - - render() { - if (this.state.liked) { - return 'You liked this.'; - } - - return e( - 'button', - { onClick: () => this.setState({ liked: true }) }, - 'Like' - ); - } -} - -export default LikeButton; \ No newline at end of file