From 5d5cb7830061661a83d9ee30a24727104212f789 Mon Sep 17 00:00:00 2001
From: Shravya Ramesh <shravs1208@gmail.com>
Date: Thu, 17 Jun 2021 23:01:42 -0700
Subject: Add comment count component

---
 src/components/comments/CommentsCount.tsx | 47 +++++++++++++++++++++++++++++++
 src/components/moments/MomentPost.tsx     | 15 +++++-----
 2 files changed, 55 insertions(+), 7 deletions(-)
 create mode 100644 src/components/comments/CommentsCount.tsx

(limited to 'src')

diff --git a/src/components/comments/CommentsCount.tsx b/src/components/comments/CommentsCount.tsx
new file mode 100644
index 00000000..cb30fe76
--- /dev/null
+++ b/src/components/comments/CommentsCount.tsx
@@ -0,0 +1,47 @@
+import {useNavigation} from '@react-navigation/core';
+import React from 'react';
+import {Text} from 'react-native';
+import {TouchableOpacity} from 'react-native-gesture-handler';
+import CommentsIcon from '../../assets/icons/moment-comment-icon.svg';
+import {MomentPostType, ScreenType} from '../../types';
+import {normalize} from '../../utils';
+
+interface CommentsCountProps {
+  moment: MomentPostType;
+  screenType: ScreenType;
+}
+
+const CommentsCount: React.FC<CommentsCountProps> = ({moment, screenType}) => {
+  const navigation = useNavigation();
+  return (
+    <TouchableOpacity
+      style={{
+        minWidth: 50,
+        flexDirection: 'column',
+        justifyContent: 'center',
+        alignItems: 'center',
+      }}
+      onPress={() =>
+        navigation.navigate('MomentCommentsScreen', {
+          moment_id: moment.moment_id,
+          screenType,
+        })
+      }>
+      <CommentsIcon width={25} height={25} />
+      <Text
+        style={{
+          fontWeight: '500',
+          fontSize: normalize(11),
+          lineHeight: normalize(13),
+          letterSpacing: normalize(0.05),
+          textAlign: 'center',
+          color: 'white',
+          marginTop: normalize(5),
+        }}>
+        {moment.comments_count}
+      </Text>
+    </TouchableOpacity>
+  );
+};
+
+export default CommentsCount;
diff --git a/src/components/moments/MomentPost.tsx b/src/components/moments/MomentPost.tsx
index d87028e3..60cb16fa 100644
--- a/src/components/moments/MomentPost.tsx
+++ b/src/components/moments/MomentPost.tsx
@@ -83,13 +83,14 @@ const MomentPost: React.FC<MomentPostProps> = ({
         moment={moment}
         tags={tags}
       />
-      <MomentPostContent
-        style={styles.postContent}
-        moment={moment}
-        screenType={screenType}
-        momentTags={tags}
-        index={index}
-      />
+              <View
+                style={{
+                  position: 'absolute',
+                  right: '2%',
+                  bottom: SCREEN_HEIGHT * 0.12,
+                }}>
+                <CommentsCount moment={moment} screenType={screenType} />
+              </View>
     </>
   );
 };
-- 
cgit v1.2.3-70-g09d2