using s3 url instead of image passed from backend

12 files changed, 42 insertions, 71 deletions

diff --git a/src/assets/images/avatar-placeholder.png b/src/assets/images/avatar-placeholder.png
index 313f384e..d038441e 100644
--- a/src/assets/images/avatar-placeholder.png
+++ b/src/assets/images/avatar-placeholder.png
diff --git a/src/assets/images/avatar-placeholder@2x.png b/src/assets/images/avatar-placeholder@2x.png
deleted file mode 100644
index d038441e..00000000
--- a/src/assets/images/avatar-placeholder@2x.png
+++ /dev/null
diff --git a/src/assets/images/avatar-placeholder@3x.png b/src/assets/images/avatar-placeholder@3x.png
deleted file mode 100644
index 814472ec..00000000
--- a/src/assets/images/avatar-placeholder@3x.png
+++ /dev/null
diff --git a/src/assets/images/cover-placeholder.png b/src/assets/images/cover-placeholder.png
index 141167d1..402ac1fe 100644
--- a/src/assets/images/cover-placeholder.png
+++ b/src/assets/images/cover-placeholder.png
diff --git a/src/assets/images/cover-placeholder@2x.png b/src/assets/images/cover-placeholder@2x.png
deleted file mode 100644
index 402ac1fe..00000000
--- a/src/assets/images/cover-placeholder@2x.png
+++ /dev/null
diff --git a/src/assets/images/cover-placeholder@3x.png b/src/assets/images/cover-placeholder@3x.png
deleted file mode 100644
index be87023d..00000000
--- a/src/assets/images/cover-placeholder@3x.png
+++ /dev/null
diff --git a/src/components/profile/Avatar.tsx b/src/components/profile/Avatar.tsx
index ba4ec36c..5d677983 100644
--- a/src/components/profile/Avatar.tsx
+++ b/src/components/profile/Avatar.tsx
@@ -19,11 +19,8 @@ const Avatar: React.FC<AvatarProps> = ({style, screenType, userXId}) => {
   return (
     <Image
       style={[styles.image, style]}
-      source={
-        avatar
-          ? {uri: avatar}
-          : require('../../assets/images/avatar-placeholder.png')
-      }
+      defaultSource={require('../../assets/images/avatar-placeholder.png')}
+      source={{uri: avatar}}
     />
   );
 };
diff --git a/src/components/profile/Cover.tsx b/src/components/profile/Cover.tsx
index a03ef123..b7502cff 100644
--- a/src/components/profile/Cover.tsx
+++ b/src/components/profile/Cover.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import {Image, StyleSheet, View} from 'react-native';
-import {IMAGE_WIDTH, COVER_HEIGHT, IMAGE_HEIGHT} from '../../constants';
 import {useSelector} from 'react-redux';
+import {COVER_HEIGHT, IMAGE_WIDTH} from '../../constants';
 import {RootState} from '../../store/rootreducer';
 import {ScreenType} from '../../types';
 
@@ -10,7 +10,7 @@ interface CoverProps {
   screenType: ScreenType;
 }
 const Cover: React.FC<CoverProps> = ({userXId, screenType}) => {
-  const {cover = ''} = userXId
+  const {cover} = userXId
     ? useSelector((state: RootState) => state.userX[screenType][userXId])
     : useSelector((state: RootState) => state.user);
 
@@ -18,11 +18,8 @@ const Cover: React.FC<CoverProps> = ({userXId, screenType}) => {
     <View style={[styles.container]}>
       <Image
         style={styles.image}
-        source={
-          cover
-            ? {uri: cover}
-            : require('../../assets/images/cover-placeholder.png')
-        }
+        defaultSource={require('../../assets/images/cover-placeholder.png')}
+        source={{uri: cover}}
       />
     </View>
   );
diff --git a/src/services/UserProfileService.ts b/src/services/UserProfileService.ts
index dd77db9f..05fd5f82 100644
--- a/src/services/UserProfileService.ts
+++ b/src/services/UserProfileService.ts
@@ -77,43 +77,22 @@ export const loadProfileInfo = async (token: string, userId: string) => {
   }
 };
 
-export const loadAvatar = async (userId: string, thumbnail: boolean) => {
-  try {
-    const token = await AsyncStorage.getItem('token');
-    const url = thumbnail
-      ? PROFILE_PHOTO_THUMBNAIL_ENDPOINT
-      : PROFILE_PHOTO_ENDPOINT;
-    const response = await RNFetchBlob.config({
-      fileCache: true,
-      appendExt: 'jpg',
-    }).fetch('GET', url + `${userId}/`, {
-      Authorization: 'Token ' + token,
-    });
-    const status = response.info().status;
-    if (status === 200) {
-      return response.path();
-    } else {
-      return '';
-    }
-  } catch (error) {
-    console.log(error);
-    return '';
-  }
-};
-
-export const loadCover = async (token: string, userId: string) => {
+export const getProfilePic = async (
+  token: string,
+  userId: string,
+  type: 'large' | 'small',
+) => {
   try {
-    let response = await RNFetchBlob.config({
-      fileCache: true,
-      appendExt: 'jpg',
-    }).fetch('GET', HEADER_PHOTO_ENDPOINT + `${userId}/`, {
-      Authorization: 'Token ' + token,
+    const url =
+      type === 'small' ? PROFILE_PHOTO_ENDPOINT : HEADER_PHOTO_ENDPOINT;
+    const response = await fetch(url + `${userId}/`, {
+      method: 'GET',
+      headers: {
+        Authorization: 'Token ' + token,
+      },
     });
-    const status = response.info().status;
-    if (status === 200) {
-      return response.path();
-    } else {
-      return '';
+    if (response.status === 200) {
+      return (await response.json()).url;
     }
   } catch (error) {
     console.log(error);
diff --git a/src/store/actions/user.ts b/src/store/actions/user.ts
index 4f1da47c..aae38d94 100644
--- a/src/store/actions/user.ts
+++ b/src/store/actions/user.ts
@@ -1,7 +1,6 @@
 import {Action, ThunkAction} from '@reduxjs/toolkit';
 import {
-  loadAvatar,
-  loadCover,
+  getProfilePic,
   loadProfileInfo,
   sendSuggestedPeopleLinked,
 } from '../../services';
@@ -43,8 +42,8 @@ export const loadUserData = (
     const token = await getTokenOrLogout(dispatch);
     const [profile, avatar, cover] = await Promise.all([
       loadProfileInfo(token, user.userId),
-      loadAvatar(user.userId, false),
-      loadCover(token, user.userId),
+      getProfilePic(token, user.userId, 'small'),
+      getProfilePic(token, user.userId, 'large'),
     ]);
     dispatch({
       type: userDetailsFetched.type,
diff --git a/src/store/actions/userX.ts b/src/store/actions/userX.ts
index 07bea678..325c7568 100644
--- a/src/store/actions/userX.ts
+++ b/src/store/actions/userX.ts
@@ -1,28 +1,27 @@
-import {userXInStore} from './../../utils/';
-import {getTokenOrLogout, loadAllSocialsForUser} from './../../utils';
-import {UserType, ScreenType} from '../../types/types';
-import {RootState} from '../rootReducer';
 import {Action, ThunkAction} from '@reduxjs/toolkit';
 import {
-  userXRequested,
+  getProfilePic,
+  loadFriends,
+  loadMomentCategories,
+  loadMoments,
+  loadProfileInfo,
+} from '../../services';
+import {ScreenType, UserType} from '../../types/types';
+import {
+  resetScreen,
   userXAvatarFetched,
-  userXFriendsFetched,
   userXCoverFetched,
+  userXFriendsFetched,
+  userXMomentCategoriesFetched,
   userXMomentsFetched,
   userXProfileFetched,
+  userXRequested,
   userXSocialsFetched,
   userXUserFetched,
-  userXMomentCategoriesFetched,
-  resetScreen,
 } from '../reducers';
-import {
-  loadProfileInfo,
-  loadAvatar,
-  loadCover,
-  loadFriends,
-  loadMomentCategories,
-  loadMoments,
-} from '../../services';
+import {RootState} from '../rootReducer';
+import {getTokenOrLogout, loadAllSocialsForUser} from './../../utils';
+import {userXInStore} from './../../utils/';
 
 export const loadUserX = (
   user: UserType,
@@ -50,13 +49,13 @@ export const loadUserX = (
         payload: {screenType, userId, data},
       }),
     );
-    loadAvatar(userId, false).then((data) =>
+    getProfilePic(token, userId, 'small').then((data) =>
       dispatch({
         type: userXAvatarFetched.type,
         payload: {screenType, userId, data},
       }),
     );
-    loadCover(token, userId).then((data) =>
+    getProfilePic(token, userId, 'large').then((data) =>
       dispatch({
         type: userXCoverFetched.type,
         payload: {screenType, userId, data},
diff --git a/src/store/initialStates.ts b/src/store/initialStates.ts
index b43e4a1d..275664cc 100644
--- a/src/store/initialStates.ts
+++ b/src/store/initialStates.ts
@@ -42,8 +42,8 @@ export const EMPTY_PROFILE_PREVIEW_LIST = <ProfilePreviewType[]>[];
 export const NO_USER_DATA = {
   user: <UserType>NO_USER,
   profile: <ProfileType>NO_PROFILE,
-  avatar: <string | null>'',
-  cover: <string | null>'',
+  avatar: <string | undefined>'',
+  cover: <string | undefined>'',
   isOnboardedUser: false,
   newVersionAvailable: false,
   newNotificationReceived: false,