Merge pull request #204 from IvanIFChen/tma568-delete-comments

[TMA-568] Delete Comments

1 files changed, 10 insertions, 5 deletions

diff --git a/src/components/comments/CommentsContainer.tsx b/src/components/comments/CommentsContainer.tsx
index 0a19694b..d8134caf 100644
--- a/src/components/comments/CommentsContainer.tsx
+++ b/src/components/comments/CommentsContainer.tsx
@@ -1,9 +1,10 @@
-import React, {useRef, useEffect, useState} from 'react';
+import React, {useEffect, useRef, useState} from 'react';
 import {StyleSheet} from 'react-native';
 import {ScrollView} from 'react-native-gesture-handler';
-import {useDispatch} from 'react-redux';
+import {useDispatch, useSelector} from 'react-redux';
 import {CommentTile} from '.';
 import {getComments} from '../../services';
+import {RootState} from '../../store/rootReducer';
 import {CommentType, ScreenType, TypeOfComment} from '../../types';
 export type CommentsContainerProps = {
   screenType: ScreenType;
@@ -32,6 +33,9 @@ const CommentsContainer: React.FC<CommentsContainerProps> = ({
   setCommentObjectInFocus,
   commentObjectInFocus,
 }) => {
+  const {username: loggedInUsername} = useSelector(
+    (state: RootState) => state.user.user,
+  );
   const [commentsList, setCommentsList] = useState<CommentType[]>([]);
   const dispatch = useDispatch();
   const ref = useRef<ScrollView>(null);
@@ -79,6 +83,9 @@ const CommentsContainer: React.FC<CommentsContainerProps> = ({
             screenType={screenType}
             typeOfComment={typeOfComment}
             setCommentObjectInFocus={setCommentObjectInFocus}
+            newCommentsAvailable={newCommentsAvailable}
+            setNewCommentsAvailable={setNewCommentsAvailable}
+            canDelete={comment.commenter.username === loggedInUsername}
           />
         ))}
     </ScrollView>
@@ -86,9 +93,7 @@ const CommentsContainer: React.FC<CommentsContainerProps> = ({
 };
 
 const styles = StyleSheet.create({
-  scrollView: {
-    paddingHorizontal: 20,
-  },
+  scrollView: {},
   scrollViewContent: {
     justifyContent: 'center',
   },