rendering comments on time

c2siorg · Apr 1, 2024 · cebd301 · cebd301
1 parent 3b0952c
commit cebd301
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/src/components/TutorialPage/components/Commnets/CommentBox.jsx b/src/components/TutorialPage/components/Commnets/CommentBox.jsx
@@ -35,22 +35,25 @@ const CommentBox = ({ commentsArray, tutorialId }) => {
   const dispatch = useDispatch();
   const [comments, setComments] = useState([]);
   const [currCommentCount, setCurrCommentCount] = useState(3);
-  const handleSubmit = comment => {
+  const handleSubmit = async(comment) => {
     const commentData = {
       content: comment,
       replyTo: tutorialId,
       tutorial_id: tutorialId,
       createdAt: firestore.FieldValue.serverTimestamp(),
       userId: "codelabzuser"
     };
-    addComment(commentData)(firebase, firestore, dispatch);
+    let x=await addComment(commentData)(firebase, firestore, dispatch);
+    console.log("new id ",x);
+    setComments(prevComments => [...prevComments, x])
   };
 
   useEffect(() => {
     setComments(commentsArray?.slice(0, currCommentCount));
+
   }, [currCommentCount, commentsArray]);
 
-  console.log(commentsArray, comments, currCommentCount);
+  console.log(commentsArray,comments, currCommentCount);
 
   const increaseCommentCount = () => {
     setCurrCommentCount(state => state + 3);

diff --git a/src/store/actions/tutorialPageActions.js b/src/store/actions/tutorialPageActions.js
@@ -195,10 +195,13 @@ export const getCommentReply =
 export const addComment = comment => async (firebase, firestore, dispatch) => {
   try {
     dispatch({ type: actions.ADD_COMMENT_START });
+    let x=""
     await firestore
       .collection("cl_comments")
       .add(comment)
       .then(docref => {
+        x=docref.id;
+        console.log("docref", docref.id);
         firestore.collection("cl_comments").doc(docref.id).update({
           comment_id: docref.id
         });
@@ -213,7 +216,9 @@ export const addComment = comment => async (firebase, firestore, dispatch) => {
       })
       .then(() => {
         dispatch({ type: actions.ADD_COMMENT_SUCCESS });
+        return x ;
       });
+      return x;
   } catch (e) {
     dispatch({ type: actions.ADD_COMMENT_FAILED, payload: e.message });
   }