1 files changed, 34 insertions, 3 deletions
diff --git a/src/screens/profile/IndividualMoment.tsx b/src/screens/profile/IndividualMoment.tsx
index 1b0c7c2b..0cfbce28 100644
--- a/src/screens/profile/IndividualMoment.tsx
+++ b/src/screens/profile/IndividualMoment.tsx
@@ -5,6 +5,7 @@ import {FlatList, Keyboard, ViewToken} from 'react-native';
 import {useSelector} from 'react-redux';
 import {MomentPost, TabsGradient} from '../../components';
 import {MainStackParams} from '../../routes';
+import {increaseMomentViewCount} from '../../services';
 import {RootState} from '../../store/rootreducer';
 import {MomentPostType} from '../../types';
 import {SCREEN_HEIGHT} from '../../utils';
@@ -38,9 +39,16 @@ const IndividualMoment: React.FC<IndividualMomentProps> = ({route}) => {
     userXId ? state.userX[screenType][userXId] : state.moments,
   );
   const scrollRef = useRef<FlatList<MomentPostType>>(null);
-  const momentData = moments.filter(
-    (m) => m.moment_category === moment_category,
-  );
+  const [momentData, setMomentData] = useState<MomentPostType[]>([]);
+
+  useEffect(() => {
+    const extractedMoments = moments.filter(
+      (m) => m.moment_category === moment_category,
+    );
+    setMomentData(extractedMoments);
+    console.log('momentData: ', momentData);
+  }, [moments]);
+
   const initialIndex = momentData.findIndex((m) => m.moment_id === moment_id);
   const [keyboardVisible, setKeyboardVisible] = useState(false);
   const [currentVisibleMomentId, setCurrentVisibleMomentId] = useState<
@@ -75,6 +83,28 @@ const IndividualMoment: React.FC<IndividualMomentProps> = ({route}) => {
     };
   }, []);
 
+  const updateMomentViewCount = () => {
+    if (currentVisibleMomentId) {
+      increaseMomentViewCount(currentVisibleMomentId)
+        .then((updatedViewCount) => {
+          const updatedMomentData = momentData.map((x) => {
+            return x.moment_id === currentVisibleMomentId
+              ? {...x, view_count: updatedViewCount}
+              : x;
+          });
+          setMomentData(updatedMomentData);
+        })
+        .catch(() => console.log('Error updating view count!'));
+    }
+  };
+
+  /*
+   *  Increments view count when user swipes up or down on Flatlist
+   */
+  useEffect(() => {
+    updateMomentViewCount();
+  }, [currentVisibleMomentId]);
+
   return (
     <MomentContext.Provider
       value={{
@@ -90,6 +120,7 @@ const IndividualMoment: React.FC<IndividualMomentProps> = ({route}) => {
             moment={item}
             userXId={userXId}
             screenType={screenType}
+            updateMomentViewCount={updateMomentViewCount}
           />
         )}
         keyboardShouldPersistTaps={'handled'}