From 4b6faadd4cc0a69b0aad5b44dfe6292635b39f6b Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Tue, 9 Feb 2021 17:11:03 -0800 Subject: changed insta icon + added extra prop for switch --- src/assets/socials/instagram-icon-white-bg.png | Bin 0 -> 531448 bytes src/components/common/SocialIcon.tsx | 8 +++++++- src/components/common/SocialLinkModal.tsx | 7 ++++++- src/components/moments/Moment.tsx | 2 +- src/components/moments/MomentTile.tsx | 2 +- src/components/onboarding/LinkSocialMedia.tsx | 8 ++++++-- src/components/onboarding/SocialMediaLinker.tsx | 8 ++++++-- src/components/search/RecentSearches.tsx | 2 +- src/components/taggs/SocialMediaInfo.tsx | 7 ++++++- src/screens/profile/EditProfile.tsx | 14 +++++++++++--- src/services/UserFriendsService.ts | 2 +- src/services/UserProfileService.ts | 3 +-- 12 files changed, 47 insertions(+), 16 deletions(-) create mode 100644 src/assets/socials/instagram-icon-white-bg.png (limited to 'src') diff --git a/src/assets/socials/instagram-icon-white-bg.png b/src/assets/socials/instagram-icon-white-bg.png new file mode 100644 index 00000000..2d6940ca Binary files /dev/null and b/src/assets/socials/instagram-icon-white-bg.png differ diff --git a/src/components/common/SocialIcon.tsx b/src/components/common/SocialIcon.tsx index 3c9deb6d..0cd5d2a7 100644 --- a/src/components/common/SocialIcon.tsx +++ b/src/components/common/SocialIcon.tsx @@ -1,9 +1,11 @@ import React from 'react'; import {Image} from 'react-native'; +import {ScreenType} from '../../types'; interface SocialIconProps { social: string; style: object; + screenType: ScreenType; } /** * An image component that returns the of the icon for a specific social media platform. @@ -11,10 +13,14 @@ interface SocialIconProps { const SocialIcon: React.FC = ({ social: social, style: style, + screenType, }) => { switch (social) { case 'Instagram': - var icon = require('../../assets/socials/instagram-icon.png'); + var icon = require('../../assets/socials/instagram-icon-white-bg.png'); + if (screenType === ScreenType.SuggestedPeople) { + icon = require('../../assets/socials/instagram-icon.png'); + } break; case 'Facebook': var icon = require('../../assets/socials/facebook-icon.png'); diff --git a/src/components/common/SocialLinkModal.tsx b/src/components/common/SocialLinkModal.tsx index d3bc3945..0bd5a0a5 100644 --- a/src/components/common/SocialLinkModal.tsx +++ b/src/components/common/SocialLinkModal.tsx @@ -1,6 +1,7 @@ import React from 'react'; import {Modal, StyleSheet, Text, TouchableOpacity, View} from 'react-native'; import {TextInput} from 'react-native-gesture-handler'; +import { ScreenType } from '../../types'; import {SocialIcon} from '.'; import CloseIcon from '../../assets/ionicons/close-outline.svg'; import {normalize, SCREEN_WIDTH} from '../../utils'; @@ -48,7 +49,11 @@ const SocialLinkModal: React.FC = ({ onPress={onClosePress}> - + {social} Insert your {social.toLowerCase()} username to link your{' '} diff --git a/src/components/moments/Moment.tsx b/src/components/moments/Moment.tsx index a6b553b1..10cf6070 100644 --- a/src/components/moments/Moment.tsx +++ b/src/components/moments/Moment.tsx @@ -5,7 +5,7 @@ import {Text} from 'react-native-animatable'; import {ScrollView, TouchableOpacity} from 'react-native-gesture-handler'; import ImagePicker from 'react-native-image-crop-picker'; import LinearGradient from 'react-native-linear-gradient'; -import {MomentType, ScreenType} from 'src/types'; +import {MomentType, ScreenType} from '../../types'; import DeleteIcon from '../../assets/icons/delete-logo.svg'; import DownIcon from '../../assets/icons/down_icon.svg'; import PlusIcon from '../../assets/icons/plus_icon-01.svg'; diff --git a/src/components/moments/MomentTile.tsx b/src/components/moments/MomentTile.tsx index 69701192..96eb35b6 100644 --- a/src/components/moments/MomentTile.tsx +++ b/src/components/moments/MomentTile.tsx @@ -1,7 +1,7 @@ import {useNavigation} from '@react-navigation/native'; import React from 'react'; import {StyleSheet, View, Image, TouchableOpacity} from 'react-native'; -import {MomentType, ScreenType} from 'src/types'; +import {MomentType, ScreenType} from '../../types'; interface MomentTileProps { moment: MomentType; diff --git a/src/components/onboarding/LinkSocialMedia.tsx b/src/components/onboarding/LinkSocialMedia.tsx index 8938b9a0..f3915752 100644 --- a/src/components/onboarding/LinkSocialMedia.tsx +++ b/src/components/onboarding/LinkSocialMedia.tsx @@ -18,7 +18,7 @@ import { handlePressForAuthBrowser, registerNonIntegratedSocialLink, } from '../../services'; -import {LinkerType} from '../../types'; +import {LinkerType, ScreenType} from '../../types'; import SocialIcon from '../common/SocialIcon'; interface SocialMediaLinkerProps extends TouchableOpacityProps { @@ -91,7 +91,11 @@ const SocialMediaLinker: React.FC = ({ activeOpacity={0.7} onPress={modelOrAuthBrowser} style={styles.container}> - + {label} {authenticated && ( = ({ activeOpacity={0.7} onPress={handlePress} style={styles.container}> - + {label} {state.socialLinked && ( = ({ )} - + { diff --git a/src/screens/profile/EditProfile.tsx b/src/screens/profile/EditProfile.tsx index 7d3ca581..56bed11f 100644 --- a/src/screens/profile/EditProfile.tsx +++ b/src/screens/profile/EditProfile.tsx @@ -38,7 +38,7 @@ import {HeaderHeight, SCREEN_HEIGHT} from '../../utils'; import {RootState} from '../../store/rootReducer'; import {useDispatch, useSelector} from 'react-redux'; import {loadUserData} from '../../store/actions'; -import {BackgroundGradientType} from '../../types'; +import {BackgroundGradientType, ScreenType} from '../../types'; import { ERROR_DOUBLE_CHECK_CONNECTION, ERROR_SOMETHING_WENT_WRONG_REFRESH, @@ -527,7 +527,11 @@ const EditProfile: React.FC = ({route, navigation}) => { /> {snapchat !== '' && ( - + = ({route, navigation}) => { )} {tiktok !== '' && ( - +