diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/assets/icons/grey-purple-plus.svg | 5 | ||||
-rw-r--r-- | src/assets/icons/purple-plus.svg | 15 | ||||
-rw-r--r-- | src/components/profile/Cover.tsx | 108 | ||||
-rw-r--r-- | src/components/profile/TaggAvatar.tsx | 67 | ||||
-rw-r--r-- | src/utils/common.ts | 17 | ||||
-rw-r--r-- | src/utils/users.ts | 82 |
6 files changed, 18 insertions, 276 deletions
diff --git a/src/assets/icons/grey-purple-plus.svg b/src/assets/icons/grey-purple-plus.svg deleted file mode 100644 index 2053d4a7..00000000 --- a/src/assets/icons/grey-purple-plus.svg +++ /dev/null @@ -1,5 +0,0 @@ -<svg width="31" height="31" viewBox="0 0 31 31" fill="none" xmlns="http://www.w3.org/2000/svg"> -<circle cx="15.5" cy="15.5" r="15.5" fill="white"/> -<rect width="2.38462" height="16.6923" rx="1.19231" transform="matrix(-1 0 0 1 16.6934 7.15381)" fill="#8F00FF"/> -<rect width="2.38462" height="16.6923" rx="1.19231" transform="matrix(0.00550217 0.999985 0.999985 -0.00550217 7.1543 14.4004)" fill="#8F00FF"/> -</svg> diff --git a/src/assets/icons/purple-plus.svg b/src/assets/icons/purple-plus.svg deleted file mode 100644 index 20949b6d..00000000 --- a/src/assets/icons/purple-plus.svg +++ /dev/null @@ -1,15 +0,0 @@ -<svg width="23" height="23" viewBox="0 0 23 23" fill="none" xmlns="http://www.w3.org/2000/svg"> -<circle cx="11.5" cy="11.5" r="11.25" fill="url(#paint0_linear)" stroke="url(#paint1_linear)" stroke-width="0.5"/> -<rect width="1.76923" height="12.3846" rx="0.884615" transform="matrix(-1 0 0 1 12.3848 5.30762)" fill="white"/> -<rect width="1.76923" height="12.3846" rx="0.884615" transform="matrix(0.00550217 0.999985 0.999985 -0.00550217 5.30859 10.6841)" fill="white"/> -<defs> -<linearGradient id="paint0_linear" x1="11.5" y1="0" x2="10.9524" y2="30.119" gradientUnits="userSpaceOnUse"> -<stop stop-color="#8F01FF"/> -<stop offset="1" stop-color="#6EE7E7"/> -</linearGradient> -<linearGradient id="paint1_linear" x1="11.5" y1="0" x2="10.9524" y2="32.8571" gradientUnits="userSpaceOnUse"> -<stop stop-color="#8F01FF"/> -<stop offset="1" stop-color="#6EE7E7"/> -</linearGradient> -</defs> -</svg> diff --git a/src/components/profile/Cover.tsx b/src/components/profile/Cover.tsx index 5d5b4234..27777b64 100644 --- a/src/components/profile/Cover.tsx +++ b/src/components/profile/Cover.tsx @@ -1,93 +1,28 @@ -import React, {useState, useEffect} from 'react'; -import { - Image, - StyleSheet, - View, - TouchableOpacity, - Text, - ImageBackground, -} from 'react-native'; +import React from 'react'; +import {Image, StyleSheet, View} from 'react-native'; +import {useSelector} from 'react-redux'; import {COVER_HEIGHT, IMAGE_WIDTH} from '../../constants'; -import {ScreenType} from '../../types'; -import GreyPurplePlus from '../../assets/icons/grey-purple-plus.svg'; -import {useDispatch, useSelector} from 'react-redux'; -import {loadUserData, resetHeaderAndProfileImage} from '../../store/actions'; import {RootState} from '../../store/rootreducer'; -import {normalize, patchProfile, validateImageLink} from '../../utils'; +import {ScreenType} from '../../types'; interface CoverProps { userXId: string | undefined; screenType: ScreenType; } const Cover: React.FC<CoverProps> = ({userXId, screenType}) => { - const dispatch = useDispatch(); - const {cover, user} = useSelector((state: RootState) => + const {cover} = useSelector((state: RootState) => userXId ? state.userX[screenType][userXId] : state.user, ); - const [needsUpdate, setNeedsUpdate] = useState(false); - const [loading, setLoading] = useState(false); - const [validImage, setValidImage] = useState<boolean>(true); - - useEffect(() => { - checkAvatar(cover); - }, []); - - useEffect(() => { - if (needsUpdate) { - const userId = user.userId; - const username = user.username; - dispatch(resetHeaderAndProfileImage()); - dispatch(loadUserData({userId, username})); - } - }, [dispatch, needsUpdate]); - - const handleNewImage = async () => { - setLoading(true); - const result = await patchProfile('header', user.userId); - setLoading(true); - if (result) { - setNeedsUpdate(true); - } else { - setLoading(false); - } - }; - - const checkAvatar = async (url: string | undefined) => { - const valid = await validateImageLink(url); - if (valid !== validImage) { - setValidImage(valid); - } - }; - - if (!validImage && userXId === undefined && !loading) { - return ( - <View style={[styles.container]}> - <ImageBackground - style={styles.image} - defaultSource={require('../../assets/images/cover-placeholder.png')} - source={{uri: cover, cache: 'reload'}}> - <TouchableOpacity - accessible={true} - accessibilityLabel="ADD HEADER PICTURE" - onPress={() => handleNewImage()}> - <GreyPurplePlus style={styles.plus} /> - <Text style={styles.text}>Add Picture</Text> - </TouchableOpacity> - </ImageBackground> - </View> - ); - } else { - return ( - <View style={styles.container}> - <Image - style={styles.image} - defaultSource={require('../../assets/images/cover-placeholder.png')} - source={{uri: cover, cache: 'reload'}} - /> - </View> - ); - } + return ( + <View style={[styles.container]}> + <Image + style={styles.image} + defaultSource={require('../../assets/images/cover-placeholder.png')} + source={{uri: cover, cache: 'reload'}} + /> + </View> + ); }; const styles = StyleSheet.create({ @@ -98,20 +33,5 @@ const styles = StyleSheet.create({ width: IMAGE_WIDTH, height: COVER_HEIGHT, }, - plus: { - position: 'absolute', - top: 75, - right: 125, - }, - text: { - color: 'white', - position: 'absolute', - fontSize: normalize(16), - top: 80, - right: 20, - }, - touch: { - flex: 1, - }, }); export default Cover; diff --git a/src/components/profile/TaggAvatar.tsx b/src/components/profile/TaggAvatar.tsx index 304b9e3a..ea0bdb65 100644 --- a/src/components/profile/TaggAvatar.tsx +++ b/src/components/profile/TaggAvatar.tsx @@ -1,12 +1,9 @@ -import React, {useState, useEffect} from 'react'; -import {StyleSheet, TouchableOpacity} from 'react-native'; +import React from 'react'; +import {StyleSheet} from 'react-native'; +import {useSelector} from 'react-redux'; import {RootState} from '../../store/rootreducer'; import {ScreenType} from '../../types'; import {Avatar} from '../common'; -import {useDispatch, useSelector} from 'react-redux'; -import {loadUserData, resetHeaderAndProfileImage} from '../../store/actions'; -import PurplePlus from '../../assets/icons/purple-plus.svg'; -import {patchProfile, validateImageLink} from '../../utils'; const PROFILE_DIM = 100; @@ -23,59 +20,8 @@ const TaggAvatar: React.FC<TaggAvatarProps> = ({ const {avatar} = useSelector((state: RootState) => userXId ? state.userX[screenType][userXId] : state.user, ); - const dispatch = useDispatch(); - const [needsUpdate, setNeedsUpdate] = useState(false); - const [loading, setLoading] = useState(false); - const [validImage, setValidImage] = useState<boolean>(true); - const {user} = useSelector((state: RootState) => - userXId ? state.userX[screenType][userXId] : state.user, - ); - - useEffect(() => { - checkAvatar(avatar); - }, []); - - useEffect(() => { - if (needsUpdate) { - const userId = user.userId; - const username = user.username; - dispatch(resetHeaderAndProfileImage()); - dispatch(loadUserData({userId, username})); - } - }, [dispatch, needsUpdate]); - const handleNewImage = async () => { - setLoading(true); - const result = await patchProfile('profile', user.userId); - if (result) { - setNeedsUpdate(true); - } else { - setLoading(false); - } - }; - - const checkAvatar = async (url: string | undefined) => { - const valid = await validateImageLink(url); - if (valid !== validImage) { - setValidImage(valid); - } - }; - - if (!validImage && userXId === undefined && !loading) { - return ( - <> - <Avatar style={[styles.image, style]} uri={avatar} /> - <TouchableOpacity - accessible={true} - accessibilityLabel="ADD PROFILE PICTURE" - onPress={() => handleNewImage()}> - <PurplePlus style={styles.plus} /> - </TouchableOpacity> - </> - ); - } else { - return <Avatar style={[styles.image, style]} uri={avatar} />; - } + return <Avatar style={[styles.image, style]} uri={avatar} />; }; const styles = StyleSheet.create({ @@ -84,11 +30,6 @@ const styles = StyleSheet.create({ width: PROFILE_DIM, borderRadius: PROFILE_DIM / 2, }, - plus: { - position: 'absolute', - bottom: 35, - right: 0, - }, }); export default TaggAvatar; diff --git a/src/utils/common.ts b/src/utils/common.ts index 95e77f64..ce4ab7d1 100644 --- a/src/utils/common.ts +++ b/src/utils/common.ts @@ -180,20 +180,3 @@ const _crestIcon = (university: UniversityType) => { return require('../assets/images/bwbadges.png'); } }; - -export const validateImageLink = async (url: string | undefined) => { - if (!url) { - return false; - } - return fetch(url) - .then((res) => { - if (res.status === 200) { - return true; - } else { - return false; - } - }) - .catch((_) => { - return false; - }); -}; diff --git a/src/utils/users.ts b/src/utils/users.ts index 430c843f..334cb3c0 100644 --- a/src/utils/users.ts +++ b/src/utils/users.ts @@ -1,4 +1,3 @@ -import {Alert} from 'react-native'; import AsyncStorage from '@react-native-community/async-storage'; import {INTEGRATED_SOCIAL_LIST} from '../constants'; import {isUserBlocked, loadSocialPosts, removeBadgesService} from '../services'; @@ -25,8 +24,6 @@ import { UserType, UniversityBadge, } from './../types/types'; -import ImagePicker from 'react-native-image-crop-picker'; -import {patchEditProfile} from '../services'; const loadData = async (dispatch: AppDispatch, user: UserType) => { await Promise.all([ @@ -243,82 +240,3 @@ export const navigateToProfile = async ( screenType, }); }; - -export const patchProfile = async ( - title: 'profile' | 'header', - userId: string, -) => { - let imageSettings = {}; - let screenTitle: string; - let requestTitle: string; - let fileName: string; - switch (title) { - case 'header': - screenTitle = 'Select Header Picture'; - requestTitle = 'largeProfilePicture'; - fileName = 'large_profile_pic.jpg'; - imageSettings = { - smartAlbums: [ - 'Favorites', - 'RecentlyAdded', - 'SelfPortraits', - 'Screenshots', - 'UserLibrary', - ], - width: 580, - height: 580, - cropping: true, - cropperToolbarTitle: screenTitle, - mediaType: 'photo', - }; - break; - case 'profile': - screenTitle = 'Select Profile Picture'; - requestTitle = 'smallProfilePicture'; - fileName = 'small_profile_pic.jpg'; - imageSettings = { - smartAlbums: [ - 'Favorites', - 'RecentlyAdded', - 'SelfPortraits', - 'Screenshots', - 'UserLibrary', - ], - width: 580, - height: 580, - cropping: true, - cropperToolbarTitle: screenTitle, - mediaType: 'photo', - cropperCircleOverlay: true, - }; - break; - default: - screenTitle = ''; - requestTitle = ''; - fileName = ''; - } - - return await ImagePicker.openPicker(imageSettings) - .then((picture) => { - if ('path' in picture) { - const request = new FormData(); - request.append(requestTitle, { - uri: picture.path, - name: fileName, - type: 'image/jpg', - }); - - return patchEditProfile(request, userId) - .then((_) => { - return true; - }) - .catch((error) => { - Alert.alert(error); - return false; - }); - } - }) - .catch((_) => { - return false; - }); -}; |