Merge pull request #372 from IvanIFChen/tma378-viewed-your-profile

[TMA-378] Viewed your profile

5 files changed, 76 insertions, 29 deletions

diff --git a/src/components/notifications/Notification.tsx b/src/components/notifications/Notification.tsx
index 8e008cf9..3cc1c7f1 100644
--- a/src/components/notifications/Notification.tsx
+++ b/src/components/notifications/Notification.tsx
@@ -208,6 +208,9 @@ const Notification: React.FC<NotificationProps> = (props) => {
 
   const isOwnProfile = id === loggedInUser.userId;
   const navigateToProfile = async () => {
+    if (notification_type === 'SYSTEM_MSG') {
+      return;
+    }
     if (!userXInStore(state, screenType, id)) {
       await fetchUserX(dispatch, {userId: id, username: username}, screenType);
     }
@@ -231,35 +234,47 @@ const Notification: React.FC<NotificationProps> = (props) => {
           }
         />
       </TouchableWithoutFeedback>
-      <View style={styles.contentContainer}>
-        <TouchableWithoutFeedback onPress={navigateToProfile}>
-          <Text style={styles.actorName}>
-            {first_name} {last_name}
-          </Text>
-        </TouchableWithoutFeedback>
-        <TouchableWithoutFeedback onPress={onNotificationTap}>
-          <Text>{verbage}</Text>
-        </TouchableWithoutFeedback>
-      </View>
-      {notification_type === 'FRD_REQ' && (
-        <View style={styles.buttonsContainer}>
-          <AcceptDeclineButtons
-            requester={{id, username, first_name, last_name}}
-            onAccept={handleAcceptRequest}
-            onReject={handleDeclineFriendRequest}
-          />
+      {notification_type === 'SYSTEM_MSG' ? (
+        // Only verbage
+        <View style={styles.contentContainer}>
+          <Text style={styles.actorName}>{verbage}</Text>
         </View>
+      ) : (
+        <>
+          {/* Text content: Actor name and verbage*/}
+          <View style={styles.contentContainer}>
+            <TouchableWithoutFeedback onPress={navigateToProfile}>
+              <Text style={styles.actorName}>
+                {first_name} {last_name}
+              </Text>
+            </TouchableWithoutFeedback>
+            <TouchableWithoutFeedback onPress={onNotificationTap}>
+              <Text>{verbage}</Text>
+            </TouchableWithoutFeedback>
+          </View>
+          {/* Friend request accept/decline button */}
+          {notification_type === 'FRD_REQ' && (
+            <View style={styles.buttonsContainer}>
+              <AcceptDeclineButtons
+                requester={{id, username, first_name, last_name}}
+                onAccept={handleAcceptRequest}
+                onReject={handleDeclineFriendRequest}
+              />
+            </View>
+          )}
+          {/* Moment Image Preview */}
+          {(notification_type === 'CMT' ||
+            notification_type === 'MOM_3+' ||
+            notification_type === 'MOM_FRIEND') &&
+            notification_object && (
+              <TouchableWithoutFeedback
+                style={styles.moment}
+                onPress={onNotificationTap}>
+                <Image style={styles.imageFlex} source={{uri: momentURI}} />
+              </TouchableWithoutFeedback>
+            )}
+        </>
       )}
-      {(notification_type === 'CMT' ||
-        notification_type === 'MOM_3+' ||
-        notification_type === 'MOM_FRIEND') &&
-        notification_object && (
-          <TouchableWithoutFeedback
-            style={styles.moment}
-            onPress={onNotificationTap}>
-            <Image style={styles.imageFlex} source={{uri: momentURI}} />
-          </TouchableWithoutFeedback>
-        )}
     </View>
   );
 
diff --git a/src/constants/api.ts b/src/constants/api.ts
index cb45b238..dd934f0e 100644
--- a/src/constants/api.ts
+++ b/src/constants/api.ts
@@ -16,6 +16,7 @@ export const EDIT_PROFILE_ENDPOINT: string = API_URL + 'edit-profile/';
 export const SEND_OTP_ENDPOINT: string = API_URL + 'send-otp/';
 export const VERIFY_OTP_ENDPOINT: string = API_URL + 'verify-otp/';
 export const USER_PROFILE_ENDPOINT: string = API_URL + 'profile/';
+export const USER_PROFILE_VISITED_ENDPOINT: string = API_URL + 'profile/visited/';
 export const PROFILE_INFO_ENDPOINT: string = API_URL + 'user-profile-info/';
 export const HEADER_PHOTO_ENDPOINT: string = API_URL + 'header-pic/';
 export const PROFILE_PHOTO_ENDPOINT: string = API_URL + 'profile-pic/';
diff --git a/src/screens/profile/ProfileScreen.tsx b/src/screens/profile/ProfileScreen.tsx
index 6d9ef020..3dd142e1 100644
--- a/src/screens/profile/ProfileScreen.tsx
+++ b/src/screens/profile/ProfileScreen.tsx
@@ -1,8 +1,9 @@
-import React from 'react';
+import React, {useEffect} from 'react';
 import {StatusBar} from 'react-native';
 import {Content, TabsGradient} from '../../components';
 import {RouteProp} from '@react-navigation/native';
 import {MainStackParams} from '../../routes/';
+import {visitedUserProfile} from '../../services';
 
 type ProfileScreenRouteProps = RouteProp<MainStackParams, 'Profile'>;
 
@@ -14,6 +15,12 @@ const ProfileScreen: React.FC<ProfileOnboardingProps> = ({route}) => {
   const {screenType} = route.params;
   let {userXId} = route.params;
 
+  useEffect(() => {
+    if (userXId) {
+      visitedUserProfile(userXId);
+    }
+  });
+
   return (
     <>
       <StatusBar barStyle="dark-content" />
diff --git a/src/services/UserProfileService.ts b/src/services/UserProfileService.ts
index 1ce1d0b5..a2237c94 100644
--- a/src/services/UserProfileService.ts
+++ b/src/services/UserProfileService.ts
@@ -16,6 +16,7 @@ import {
   SEND_OTP_ENDPOINT,
   TAGG_CUSTOMER_SUPPORT,
   USER_PROFILE_ENDPOINT,
+  USER_PROFILE_VISITED_ENDPOINT,
   VERIFY_OTP_ENDPOINT,
 } from '../constants';
 import {
@@ -412,3 +413,24 @@ export const patchEditProfile = async (form: FormData, userId: string) => {
     throw ERROR_DOUBLE_CHECK_CONNECTION;
   }
 };
+
+export const visitedUserProfile = async (userId: string) => {
+  try {
+    const token = await AsyncStorage.getItem('token');
+    const form = new FormData();
+    form.append('user_id', userId);
+    const response = await fetch(USER_PROFILE_VISITED_ENDPOINT, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'multipart/form-data',
+        Authorization: 'Token ' + token,
+      },
+      body: form,
+    });
+    if (response.status !== 200) {
+      console.error('Failed to submit a profile visit');
+    }
+  } catch (error) {
+    return undefined;
+  }
+};
diff --git a/src/types/types.ts b/src/types/types.ts
index 376c4be0..8d7f4aed 100644
--- a/src/types/types.ts
+++ b/src/types/types.ts
@@ -251,7 +251,9 @@ export type TypeOfNotification =
   // notification_object is MomentType
   | 'MOM_FRIEND'
   // notification_object is undefined
-  | 'INVT_ONBRD';
+  | 'INVT_ONBRD'
+  // notification_object is undefined
+  | 'SYSTEM_MSG';
 
 export type UniversityBadge = {
   id: number;