From 9afff14debaee28ef6a86d307cd3183cbcfebbd4 Mon Sep 17 00:00:00 2001
From: Shravya Ramesh <shravs1208@gmail.com>
Date: Thu, 17 Jun 2021 23:10:05 -0700
Subject: Move moment post content to legacy

---
 src/components/moments/MomentPostContent.tsx       | 190 --------------------
 src/components/moments/index.ts                    |   1 -
 .../moments/legacy/MomentPostContent.tsx           | 193 +++++++++++++++++++++
 3 files changed, 193 insertions(+), 191 deletions(-)
 delete mode 100644 src/components/moments/MomentPostContent.tsx
 create mode 100644 src/components/moments/legacy/MomentPostContent.tsx

(limited to 'src')

diff --git a/src/components/moments/MomentPostContent.tsx b/src/components/moments/MomentPostContent.tsx
deleted file mode 100644
index aca2999c..00000000
--- a/src/components/moments/MomentPostContent.tsx
+++ /dev/null
@@ -1,190 +0,0 @@
-import {useNavigation} from '@react-navigation/native';
-import React, {useContext, useEffect, useRef, useState} from 'react';
-import {Image, StyleSheet, Text, View, ViewProps} from 'react-native';
-import {TouchableWithoutFeedback} from 'react-native-gesture-handler';
-import Animated, {EasingNode} from 'react-native-reanimated';
-import {useDispatch, useStore} from 'react-redux';
-import {MomentContext} from '../../screens/profile/IndividualMoment';
-import {RootState} from '../../store/rootReducer';
-import {
-  MomentCommentPreviewType,
-  MomentPostType,
-  MomentTagType,
-  ScreenType,
-  UserType,
-} from '../../types';
-import {
-  getLoggedInUserAsProfilePreview,
-  getTimePosted,
-  navigateToProfile,
-  normalize,
-  SCREEN_WIDTH,
-} from '../../utils';
-import {mentionPartTypes, renderTextWithMentions} from '../../utils/comments';
-import {AddComment} from '../comments';
-import {MomentTags} from '../common';
-import MomentCommentPreview from './MomentCommentPreview';
-
-interface MomentPostContentProps extends ViewProps {
-  screenType: ScreenType;
-  moment: MomentPostType;
-  momentTags: MomentTagType[];
-  index: number;
-}
-const MomentPostContent: React.FC<MomentPostContentProps> = ({
-  screenType,
-  moment,
-  style,
-  momentTags,
-  index,
-}) => {
-  const [tags, setTags] = useState<MomentTagType[]>(momentTags);
-  const state: RootState = useStore().getState();
-  const navigation = useNavigation();
-  const dispatch = useDispatch();
-  const imageRef = useRef(null);
-  const [visible, setVisible] = useState(false);
-  const [fadeValue, setFadeValue] = useState<Animated.Value<number>>(
-    new Animated.Value(0),
-  );
-  const [commentCount, setCommentCount] = useState<number>(
-    moment.comments_count,
-  );
-  const [commentPreview, setCommentPreview] =
-    useState<MomentCommentPreviewType | null>(moment.comment_preview);
-  const {keyboardVisible, scrollTo} = useContext(MomentContext);
-  const [hideText, setHideText] = useState(false);
-
-  useEffect(() => {
-    setTags(momentTags);
-  }, [momentTags]);
-
-  useEffect(() => {
-    const fade = async () => {
-      Animated.timing(fadeValue, {
-        toValue: 1,
-        duration: 250,
-        easing: EasingNode.linear,
-      }).start();
-    };
-    fade();
-  }, [fadeValue]);
-
-  useEffect(() => {
-    if (!keyboardVisible && hideText) {
-      setHideText(false);
-    }
-  }, [keyboardVisible, hideText]);
-
-  return (
-    <View style={[styles.container, style]}>
-      <TouchableWithoutFeedback
-        onPress={() => {
-          setVisible(!visible);
-          setFadeValue(new Animated.Value(0));
-        }}>
-        <Image
-          ref={imageRef}
-          style={styles.image}
-          source={{uri: moment.moment_url}}
-          resizeMode={'cover'}
-        />
-        {tags.length > 0 && (
-          <Image
-            source={require('../../assets/icons/tag_indicate.png')}
-            style={styles.tagIcon}
-          />
-        )}
-      </TouchableWithoutFeedback>
-      {visible && (
-        <Animated.View style={[styles.tapTag, {opacity: fadeValue}]}>
-          <MomentTags
-            editing={false}
-            tags={tags}
-            setTags={() => null}
-            imageRef={imageRef}
-          />
-        </Animated.View>
-      )}
-      {!hideText && (
-        <>
-          {moment.caption !== '' &&
-            renderTextWithMentions({
-              value: moment.caption,
-              styles: styles.captionText,
-              partTypes: mentionPartTypes('white'),
-              onPress: (user: UserType) =>
-                navigateToProfile(
-                  state,
-                  dispatch,
-                  navigation,
-                  screenType,
-                  user,
-                ),
-            })}
-          <MomentCommentPreview
-            momentId={moment.moment_id}
-            commentsCount={commentCount}
-            commentPreview={commentPreview}
-            screenType={screenType}
-          />
-        </>
-      )}
-      <AddComment
-        placeholderText={'Add a comment here!'}
-        momentId={moment.moment_id}
-        callback={(message) => {
-          setCommentPreview({
-            commenter: getLoggedInUserAsProfilePreview(state),
-            comment: message,
-          });
-          setCommentCount(commentCount + 1);
-        }}
-        onFocus={() => {
-          setHideText(true);
-          scrollTo(index);
-        }}
-        isKeyboardAvoiding={false}
-        theme={'dark'}
-      />
-      <Text style={styles.text}>{getTimePosted(moment.date_created)}</Text>
-    </View>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {},
-  image: {
-    width: SCREEN_WIDTH,
-    aspectRatio: 1,
-    marginBottom: '3%',
-  },
-  text: {
-    marginHorizontal: '5%',
-    color: 'white',
-    fontWeight: '500',
-    textAlign: 'right',
-    marginTop: 5,
-  },
-  captionText: {
-    position: 'relative',
-    marginHorizontal: '5%',
-    color: '#ffffff',
-    fontWeight: '500',
-    fontSize: normalize(13),
-    lineHeight: normalize(15.51),
-    letterSpacing: normalize(0.6),
-    marginBottom: normalize(18),
-  },
-  tapTag: {
-    position: 'absolute',
-  },
-  tagIcon: {
-    width: normalize(30),
-    height: normalize(30),
-    position: 'absolute',
-    bottom: '7%',
-    left: normalize(20),
-  },
-});
-export default MomentPostContent;
diff --git a/src/components/moments/index.ts b/src/components/moments/index.ts
index c1419cfd..743b78b0 100644
--- a/src/components/moments/index.ts
+++ b/src/components/moments/index.ts
@@ -1,7 +1,6 @@
 export {default as IndividualMomentTitleBar} from './IndividualMomentTitleBar';
 export {default as CaptionScreenHeader} from './CaptionScreenHeader';
 export {default as MomentPostHeader} from './MomentPostHeader';
-export {default as MomentPostContent} from './MomentPostContent';
 export {default as Moment} from './Moment';
 export {default as TagFriendsFooter} from './TagFriendsFoooter';
 export {default as MomentPost} from './MomentPost';
diff --git a/src/components/moments/legacy/MomentPostContent.tsx b/src/components/moments/legacy/MomentPostContent.tsx
new file mode 100644
index 00000000..6388be27
--- /dev/null
+++ b/src/components/moments/legacy/MomentPostContent.tsx
@@ -0,0 +1,193 @@
+import {useNavigation} from '@react-navigation/native';
+import React, {useContext, useEffect, useRef, useState} from 'react';
+import {Image, StyleSheet, Text, View, ViewProps} from 'react-native';
+import {TouchableWithoutFeedback} from 'react-native-gesture-handler';
+import Animated, {EasingNode} from 'react-native-reanimated';
+import {useDispatch, useStore} from 'react-redux';
+import {MomentContext} from '../../../screens/profile/IndividualMoment';
+import {RootState} from '../../../store/rootReducer';
+import {
+  MomentCommentPreviewType,
+  MomentPostType,
+  MomentTagType,
+  ScreenType,
+  UserType,
+} from '../../../types';
+import {
+  getLoggedInUserAsProfilePreview,
+  getTimePosted,
+  navigateToProfile,
+  normalize,
+  SCREEN_WIDTH,
+} from '../../../utils';
+import {
+  mentionPartTypes,
+  renderTextWithMentions,
+} from '../../../utils/comments';
+import {AddComment} from '../../comments';
+import {MomentTags} from '../../common';
+import MomentCommentPreview from '../MomentCommentPreview';
+
+interface MomentPostContentProps extends ViewProps {
+  screenType: ScreenType;
+  moment: MomentPostType;
+  momentTags: MomentTagType[];
+  index: number;
+}
+const MomentPostContent: React.FC<MomentPostContentProps> = ({
+  screenType,
+  moment,
+  style,
+  momentTags,
+  index,
+}) => {
+  const [tags, setTags] = useState<MomentTagType[]>(momentTags);
+  const state: RootState = useStore().getState();
+  const navigation = useNavigation();
+  const dispatch = useDispatch();
+  const imageRef = useRef(null);
+  const [visible, setVisible] = useState(false);
+  const [fadeValue, setFadeValue] = useState<Animated.Value<number>>(
+    new Animated.Value(0),
+  );
+  const [commentCount, setCommentCount] = useState<number>(
+    moment.comments_count,
+  );
+  const [commentPreview, setCommentPreview] =
+    useState<MomentCommentPreviewType | null>(moment.comment_preview);
+  const {keyboardVisible, scrollTo} = useContext(MomentContext);
+  const [hideText, setHideText] = useState(false);
+
+  useEffect(() => {
+    setTags(momentTags);
+  }, [momentTags]);
+
+  useEffect(() => {
+    const fade = async () => {
+      Animated.timing(fadeValue, {
+        toValue: 1,
+        duration: 250,
+        easing: EasingNode.linear,
+      }).start();
+    };
+    fade();
+  }, [fadeValue]);
+
+  useEffect(() => {
+    if (!keyboardVisible && hideText) {
+      setHideText(false);
+    }
+  }, [keyboardVisible, hideText]);
+
+  return (
+    <View style={[styles.container, style]}>
+      <TouchableWithoutFeedback
+        onPress={() => {
+          setVisible(!visible);
+          setFadeValue(new Animated.Value(0));
+        }}>
+        <Image
+          ref={imageRef}
+          style={styles.image}
+          source={{uri: moment.moment_url}}
+          resizeMode={'cover'}
+        />
+        {tags.length > 0 && (
+          <Image
+            source={require('../../assets/icons/tag_indicate.png')}
+            style={styles.tagIcon}
+          />
+        )}
+      </TouchableWithoutFeedback>
+      {visible && (
+        <Animated.View style={[styles.tapTag, {opacity: fadeValue}]}>
+          <MomentTags
+            editing={false}
+            tags={tags}
+            setTags={() => null}
+            imageRef={imageRef}
+          />
+        </Animated.View>
+      )}
+      {!hideText && (
+        <>
+          {moment.caption !== '' &&
+            renderTextWithMentions({
+              value: moment.caption,
+              styles: styles.captionText,
+              partTypes: mentionPartTypes('white'),
+              onPress: (user: UserType) =>
+                navigateToProfile(
+                  state,
+                  dispatch,
+                  navigation,
+                  screenType,
+                  user,
+                ),
+            })}
+          <MomentCommentPreview
+            momentId={moment.moment_id}
+            commentsCount={commentCount}
+            commentPreview={commentPreview}
+            screenType={screenType}
+          />
+        </>
+      )}
+      <AddComment
+        placeholderText={'Add a comment here!'}
+        momentId={moment.moment_id}
+        callback={(message) => {
+          setCommentPreview({
+            commenter: getLoggedInUserAsProfilePreview(state),
+            comment: message,
+          });
+          setCommentCount(commentCount + 1);
+        }}
+        onFocus={() => {
+          setHideText(true);
+          scrollTo(index);
+        }}
+        isKeyboardAvoiding={false}
+        theme={'dark'}
+      />
+      <Text style={styles.text}>{getTimePosted(moment.date_created)}</Text>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {},
+  image: {
+    width: SCREEN_WIDTH,
+    aspectRatio: 1,
+    marginBottom: '3%',
+  },
+  text: {
+    marginHorizontal: '5%',
+    color: 'white',
+    fontWeight: '500',
+    textAlign: 'right',
+    marginTop: 5,
+  },
+  captionText: {
+    position: 'relative',
+    marginHorizontal: '5%',
+    color: '#ffffff',
+    fontWeight: '500',
+    fontSize: normalize(13),
+    lineHeight: normalize(15.51),
+    letterSpacing: normalize(0.6),
+    marginBottom: normalize(18),
+  },
+  tapTag: {
+    position: 'absolute',
+  },
+  tagIcon: {
+    width: normalize(30),
+    height: normalize(30),
+    position: 'absolute',
+    bottom: '7%',
+    left: normalize(20),
+  },
+});
+export default MomentPostContent;
-- 
cgit v1.2.3-70-g09d2