From f620102190629e0b6f180d3ce056d850b1db5aaa Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Sat, 21 Nov 2020 19:20:11 -0500 Subject: [TMA-356] Updated icons (#118) * updated icons * added small icons * fixed a bug * now using the correct assets, fixed a bug --- src/assets/navigationIcons/home-clicked.png | Bin 1577 -> 22071 bytes src/assets/navigationIcons/home-clicked@2x.png | Bin 17970 -> 0 bytes src/assets/navigationIcons/home-clicked@3x.png | Bin 28722 -> 84953 bytes src/assets/navigationIcons/home-new-clicked.png | Bin 2104 -> 0 bytes .../navigationIcons/home-new-large-clicked.png | Bin 673387 -> 0 bytes src/assets/navigationIcons/home-new-large.png | Bin 170704 -> 0 bytes src/assets/navigationIcons/home-new.png | Bin 2502 -> 0 bytes src/assets/navigationIcons/home.png | Bin 1745 -> 30618 bytes src/assets/navigationIcons/home@2x.png | Bin 32014 -> 0 bytes src/assets/navigationIcons/home@3x.png | Bin 53505 -> 127917 bytes .../navigationIcons/notifications-clicked.png | Bin 962 -> 11505 bytes .../navigationIcons/notifications-clicked@2x.png | Bin 10995 -> 0 bytes .../navigationIcons/notifications-clicked@3x.png | Bin 17720 -> 46401 bytes src/assets/navigationIcons/notifications.png | Bin 1324 -> 17867 bytes src/assets/navigationIcons/notifications@2x.png | Bin 19051 -> 0 bytes src/assets/navigationIcons/notifications@3x.png | Bin 30496 -> 68866 bytes src/assets/navigationIcons/profile-clicked.png | Bin 958 -> 12610 bytes src/assets/navigationIcons/profile-clicked@2x.png | Bin 12204 -> 0 bytes src/assets/navigationIcons/profile-clicked@3x.png | Bin 19693 -> 49879 bytes src/assets/navigationIcons/profile.png | Bin 1251 -> 19108 bytes src/assets/navigationIcons/profile@3x.png | Bin 0 -> 73087 bytes src/assets/navigationIcons/search-clicked.png | Bin 941 -> 13165 bytes src/assets/navigationIcons/search-clicked3x.png | Bin 19433 -> 0 bytes src/assets/navigationIcons/search-clicked@2x.png | Bin 12517 -> 0 bytes src/assets/navigationIcons/search-clicked@3x.png | Bin 0 -> 49891 bytes src/assets/navigationIcons/search.png | Bin 1278 -> 20825 bytes src/assets/navigationIcons/search@2x.png | Bin 20905 -> 0 bytes src/assets/navigationIcons/search@3x.png | Bin 33147 -> 79684 bytes src/assets/navigationIcons/upload-clicked.png | Bin 1529 -> 8177 bytes src/assets/navigationIcons/upload-clicked@3x.png | Bin 0 -> 32186 bytes .../navigationIcons/upload-large-clicked.png | Bin 138663 -> 0 bytes src/assets/navigationIcons/upload-large.png | Bin 261404 -> 0 bytes src/assets/navigationIcons/upload.png | Bin 2013 -> 13960 bytes src/assets/navigationIcons/upload@2x.png | Bin 13483 -> 0 bytes src/assets/navigationIcons/upload@3x.png | Bin 21684 -> 53513 bytes src/assets/socials/facebook-icon-small.png | Bin 0 -> 4500 bytes src/assets/socials/instagram-icon-small.png | Bin 0 -> 17783 bytes src/assets/socials/snapchat-icon-small.png | Bin 0 -> 8665 bytes src/assets/socials/spotify-icon-small.png | Bin 0 -> 17063 bytes src/assets/socials/tiktok-icon-small.png | Bin 0 -> 13741 bytes src/assets/socials/twitter-icon-small.png | Bin 0 -> 10239 bytes src/assets/socials/twitter-icon.png | Bin 9734 -> 9211 bytes src/assets/socials/twitter-icon_old.png | Bin 0 -> 9734 bytes src/assets/socials/youtube-icon-small.png | Bin 0 -> 2835 bytes src/components/common/NavigationIcon.tsx | 14 ++++-- src/components/common/SmallSocialIcon.tsx | 54 +++++++++++++++++++++ src/components/common/index.ts | 1 + src/components/taggs/Tagg.tsx | 44 ++++++++++++++--- src/constants/constants.ts | 8 +++ src/services/SocialLinkingService.ts | 7 +-- 50 files changed, 114 insertions(+), 14 deletions(-) delete mode 100644 src/assets/navigationIcons/home-clicked@2x.png delete mode 100644 src/assets/navigationIcons/home-new-clicked.png delete mode 100644 src/assets/navigationIcons/home-new-large-clicked.png delete mode 100644 src/assets/navigationIcons/home-new-large.png delete mode 100644 src/assets/navigationIcons/home-new.png delete mode 100644 src/assets/navigationIcons/home@2x.png delete mode 100644 src/assets/navigationIcons/notifications-clicked@2x.png delete mode 100644 src/assets/navigationIcons/notifications@2x.png delete mode 100644 src/assets/navigationIcons/profile-clicked@2x.png create mode 100644 src/assets/navigationIcons/profile@3x.png delete mode 100644 src/assets/navigationIcons/search-clicked3x.png delete mode 100644 src/assets/navigationIcons/search-clicked@2x.png create mode 100644 src/assets/navigationIcons/search-clicked@3x.png delete mode 100644 src/assets/navigationIcons/search@2x.png create mode 100644 src/assets/navigationIcons/upload-clicked@3x.png delete mode 100644 src/assets/navigationIcons/upload-large-clicked.png delete mode 100644 src/assets/navigationIcons/upload-large.png delete mode 100644 src/assets/navigationIcons/upload@2x.png create mode 100644 src/assets/socials/facebook-icon-small.png create mode 100644 src/assets/socials/instagram-icon-small.png create mode 100644 src/assets/socials/snapchat-icon-small.png create mode 100755 src/assets/socials/spotify-icon-small.png create mode 100644 src/assets/socials/tiktok-icon-small.png create mode 100755 src/assets/socials/twitter-icon-small.png mode change 100755 => 100644 src/assets/socials/twitter-icon.png create mode 100755 src/assets/socials/twitter-icon_old.png create mode 100755 src/assets/socials/youtube-icon-small.png create mode 100644 src/components/common/SmallSocialIcon.tsx (limited to 'src') diff --git a/src/assets/navigationIcons/home-clicked.png b/src/assets/navigationIcons/home-clicked.png index 8b6e9766..a9f7253b 100644 Binary files a/src/assets/navigationIcons/home-clicked.png and b/src/assets/navigationIcons/home-clicked.png differ diff --git a/src/assets/navigationIcons/home-clicked@2x.png b/src/assets/navigationIcons/home-clicked@2x.png deleted file mode 100644 index 51a80de7..00000000 Binary files a/src/assets/navigationIcons/home-clicked@2x.png and /dev/null differ diff --git a/src/assets/navigationIcons/home-clicked@3x.png b/src/assets/navigationIcons/home-clicked@3x.png index 17010413..43dded74 100644 Binary files a/src/assets/navigationIcons/home-clicked@3x.png and b/src/assets/navigationIcons/home-clicked@3x.png differ diff --git a/src/assets/navigationIcons/home-new-clicked.png b/src/assets/navigationIcons/home-new-clicked.png deleted file mode 100644 index 9bf31927..00000000 Binary files a/src/assets/navigationIcons/home-new-clicked.png and /dev/null differ diff --git a/src/assets/navigationIcons/home-new-large-clicked.png b/src/assets/navigationIcons/home-new-large-clicked.png deleted file mode 100644 index d19cc167..00000000 Binary files a/src/assets/navigationIcons/home-new-large-clicked.png and /dev/null differ diff --git a/src/assets/navigationIcons/home-new-large.png b/src/assets/navigationIcons/home-new-large.png deleted file mode 100644 index 0531fb9b..00000000 Binary files a/src/assets/navigationIcons/home-new-large.png and /dev/null differ diff --git a/src/assets/navigationIcons/home-new.png b/src/assets/navigationIcons/home-new.png deleted file mode 100644 index c94dceed..00000000 Binary files a/src/assets/navigationIcons/home-new.png and /dev/null differ diff --git a/src/assets/navigationIcons/home.png b/src/assets/navigationIcons/home.png index ac20c3c1..a8975ccd 100644 Binary files a/src/assets/navigationIcons/home.png and b/src/assets/navigationIcons/home.png differ diff --git a/src/assets/navigationIcons/home@2x.png b/src/assets/navigationIcons/home@2x.png deleted file mode 100644 index 02564b85..00000000 Binary files a/src/assets/navigationIcons/home@2x.png and /dev/null differ diff --git a/src/assets/navigationIcons/home@3x.png b/src/assets/navigationIcons/home@3x.png index 4a6c9cba..0a15a4c5 100644 Binary files a/src/assets/navigationIcons/home@3x.png and b/src/assets/navigationIcons/home@3x.png differ diff --git a/src/assets/navigationIcons/notifications-clicked.png b/src/assets/navigationIcons/notifications-clicked.png index 0e72b0d5..d2357db1 100644 Binary files a/src/assets/navigationIcons/notifications-clicked.png and b/src/assets/navigationIcons/notifications-clicked.png differ diff --git a/src/assets/navigationIcons/notifications-clicked@2x.png b/src/assets/navigationIcons/notifications-clicked@2x.png deleted file mode 100644 index 29ce7fbf..00000000 Binary files a/src/assets/navigationIcons/notifications-clicked@2x.png and /dev/null differ diff --git a/src/assets/navigationIcons/notifications-clicked@3x.png b/src/assets/navigationIcons/notifications-clicked@3x.png index 611f3221..cc3a9a0a 100644 Binary files a/src/assets/navigationIcons/notifications-clicked@3x.png and b/src/assets/navigationIcons/notifications-clicked@3x.png differ diff --git a/src/assets/navigationIcons/notifications.png b/src/assets/navigationIcons/notifications.png index 5dd46fba..5a59852d 100644 Binary files a/src/assets/navigationIcons/notifications.png and b/src/assets/navigationIcons/notifications.png differ diff --git a/src/assets/navigationIcons/notifications@2x.png b/src/assets/navigationIcons/notifications@2x.png deleted file mode 100644 index 85760ebb..00000000 Binary files a/src/assets/navigationIcons/notifications@2x.png and /dev/null differ diff --git a/src/assets/navigationIcons/notifications@3x.png b/src/assets/navigationIcons/notifications@3x.png index 101c7f8a..02a72bf7 100644 Binary files a/src/assets/navigationIcons/notifications@3x.png and b/src/assets/navigationIcons/notifications@3x.png differ diff --git a/src/assets/navigationIcons/profile-clicked.png b/src/assets/navigationIcons/profile-clicked.png index add50faf..c5b5a052 100644 Binary files a/src/assets/navigationIcons/profile-clicked.png and b/src/assets/navigationIcons/profile-clicked.png differ diff --git a/src/assets/navigationIcons/profile-clicked@2x.png b/src/assets/navigationIcons/profile-clicked@2x.png deleted file mode 100644 index 7c1fc99d..00000000 Binary files a/src/assets/navigationIcons/profile-clicked@2x.png and /dev/null differ diff --git a/src/assets/navigationIcons/profile-clicked@3x.png b/src/assets/navigationIcons/profile-clicked@3x.png index ab0d194f..8ebc2009 100644 Binary files a/src/assets/navigationIcons/profile-clicked@3x.png and b/src/assets/navigationIcons/profile-clicked@3x.png differ diff --git a/src/assets/navigationIcons/profile.png b/src/assets/navigationIcons/profile.png index e79b8547..9ab9a43c 100644 Binary files a/src/assets/navigationIcons/profile.png and b/src/assets/navigationIcons/profile.png differ diff --git a/src/assets/navigationIcons/profile@3x.png b/src/assets/navigationIcons/profile@3x.png new file mode 100644 index 00000000..5e4c9a8e Binary files /dev/null and b/src/assets/navigationIcons/profile@3x.png differ diff --git a/src/assets/navigationIcons/search-clicked.png b/src/assets/navigationIcons/search-clicked.png index 8fc8fa5a..7020eb53 100644 Binary files a/src/assets/navigationIcons/search-clicked.png and b/src/assets/navigationIcons/search-clicked.png differ diff --git a/src/assets/navigationIcons/search-clicked3x.png b/src/assets/navigationIcons/search-clicked3x.png deleted file mode 100644 index 54290168..00000000 Binary files a/src/assets/navigationIcons/search-clicked3x.png and /dev/null differ diff --git a/src/assets/navigationIcons/search-clicked@2x.png b/src/assets/navigationIcons/search-clicked@2x.png deleted file mode 100644 index 56b5cb6b..00000000 Binary files a/src/assets/navigationIcons/search-clicked@2x.png and /dev/null differ diff --git a/src/assets/navigationIcons/search-clicked@3x.png b/src/assets/navigationIcons/search-clicked@3x.png new file mode 100644 index 00000000..726ba9fa Binary files /dev/null and b/src/assets/navigationIcons/search-clicked@3x.png differ diff --git a/src/assets/navigationIcons/search.png b/src/assets/navigationIcons/search.png index bf02835d..3bfe624b 100644 Binary files a/src/assets/navigationIcons/search.png and b/src/assets/navigationIcons/search.png differ diff --git a/src/assets/navigationIcons/search@2x.png b/src/assets/navigationIcons/search@2x.png deleted file mode 100644 index d079844c..00000000 Binary files a/src/assets/navigationIcons/search@2x.png and /dev/null differ diff --git a/src/assets/navigationIcons/search@3x.png b/src/assets/navigationIcons/search@3x.png index 73453cad..a42b1998 100644 Binary files a/src/assets/navigationIcons/search@3x.png and b/src/assets/navigationIcons/search@3x.png differ diff --git a/src/assets/navigationIcons/upload-clicked.png b/src/assets/navigationIcons/upload-clicked.png index 083f289d..434e384c 100644 Binary files a/src/assets/navigationIcons/upload-clicked.png and b/src/assets/navigationIcons/upload-clicked.png differ diff --git a/src/assets/navigationIcons/upload-clicked@3x.png b/src/assets/navigationIcons/upload-clicked@3x.png new file mode 100644 index 00000000..c07d1a1e Binary files /dev/null and b/src/assets/navigationIcons/upload-clicked@3x.png differ diff --git a/src/assets/navigationIcons/upload-large-clicked.png b/src/assets/navigationIcons/upload-large-clicked.png deleted file mode 100644 index 74fe647c..00000000 Binary files a/src/assets/navigationIcons/upload-large-clicked.png and /dev/null differ diff --git a/src/assets/navigationIcons/upload-large.png b/src/assets/navigationIcons/upload-large.png deleted file mode 100644 index 4d7cb7b7..00000000 Binary files a/src/assets/navigationIcons/upload-large.png and /dev/null differ diff --git a/src/assets/navigationIcons/upload.png b/src/assets/navigationIcons/upload.png index 839aaebc..0d4ff362 100644 Binary files a/src/assets/navigationIcons/upload.png and b/src/assets/navigationIcons/upload.png differ diff --git a/src/assets/navigationIcons/upload@2x.png b/src/assets/navigationIcons/upload@2x.png deleted file mode 100644 index 66ab56b5..00000000 Binary files a/src/assets/navigationIcons/upload@2x.png and /dev/null differ diff --git a/src/assets/navigationIcons/upload@3x.png b/src/assets/navigationIcons/upload@3x.png index ca51c710..61d239a6 100644 Binary files a/src/assets/navigationIcons/upload@3x.png and b/src/assets/navigationIcons/upload@3x.png differ diff --git a/src/assets/socials/facebook-icon-small.png b/src/assets/socials/facebook-icon-small.png new file mode 100644 index 00000000..d06707be Binary files /dev/null and b/src/assets/socials/facebook-icon-small.png differ diff --git a/src/assets/socials/instagram-icon-small.png b/src/assets/socials/instagram-icon-small.png new file mode 100644 index 00000000..74ce771c Binary files /dev/null and b/src/assets/socials/instagram-icon-small.png differ diff --git a/src/assets/socials/snapchat-icon-small.png b/src/assets/socials/snapchat-icon-small.png new file mode 100644 index 00000000..608d6539 Binary files /dev/null and b/src/assets/socials/snapchat-icon-small.png differ diff --git a/src/assets/socials/spotify-icon-small.png b/src/assets/socials/spotify-icon-small.png new file mode 100755 index 00000000..0c8d5147 Binary files /dev/null and b/src/assets/socials/spotify-icon-small.png differ diff --git a/src/assets/socials/tiktok-icon-small.png b/src/assets/socials/tiktok-icon-small.png new file mode 100644 index 00000000..3167ff71 Binary files /dev/null and b/src/assets/socials/tiktok-icon-small.png differ diff --git a/src/assets/socials/twitter-icon-small.png b/src/assets/socials/twitter-icon-small.png new file mode 100755 index 00000000..33903b1f Binary files /dev/null and b/src/assets/socials/twitter-icon-small.png differ diff --git a/src/assets/socials/twitter-icon.png b/src/assets/socials/twitter-icon.png old mode 100755 new mode 100644 index 203a30cf..9810d5a1 Binary files a/src/assets/socials/twitter-icon.png and b/src/assets/socials/twitter-icon.png differ diff --git a/src/assets/socials/twitter-icon_old.png b/src/assets/socials/twitter-icon_old.png new file mode 100755 index 00000000..203a30cf Binary files /dev/null and b/src/assets/socials/twitter-icon_old.png differ diff --git a/src/assets/socials/youtube-icon-small.png b/src/assets/socials/youtube-icon-small.png new file mode 100755 index 00000000..8dce3e33 Binary files /dev/null and b/src/assets/socials/youtube-icon-small.png differ diff --git a/src/components/common/NavigationIcon.tsx b/src/components/common/NavigationIcon.tsx index 8bf8b4a0..8fff18f4 100644 --- a/src/components/common/NavigationIcon.tsx +++ b/src/components/common/NavigationIcon.tsx @@ -17,8 +17,8 @@ const NavigationIcon = (props: NavigationIconProps) => { switch (props.tab) { case 'Home': imgSrc = props.disabled - ? require('../../assets/navigationIcons/home-new.png') - : require('../../assets/navigationIcons/home-new-clicked.png'); + ? require('../../assets/navigationIcons/home.png') + : require('../../assets/navigationIcons/home-clicked.png'); break; case 'Search': imgSrc = props.disabled @@ -44,16 +44,16 @@ const NavigationIcon = (props: NavigationIconProps) => { imgSrc = null; } return ( - + - + ); }; const styles = StyleSheet.create({ - icon: { + container: { flex: 1, justifyContent: 'center', shadowColor: '#000000', @@ -64,6 +64,10 @@ const styles = StyleSheet.create({ shadowRadius: 2, shadowOpacity: 0.4, }, + icon: { + height: 30, + width: 30, + }, }); export default NavigationIcon; diff --git a/src/components/common/SmallSocialIcon.tsx b/src/components/common/SmallSocialIcon.tsx new file mode 100644 index 00000000..d7d175d5 --- /dev/null +++ b/src/components/common/SmallSocialIcon.tsx @@ -0,0 +1,54 @@ +import React from 'react'; +import {Image} from 'react-native'; + +interface SmallSocialIconProps { + social: string; + style: object; +} +/** + * An image component that returns the of the icon for a specific social media platform. + */ +const SmallSocialIcon: React.FC = ({ + social: social, + style: style, +}) => { + switch (social) { + case 'Instagram': + var icon = require('../../assets/socials/instagram-icon-small.png'); + break; + case 'Facebook': + var icon = require('../../assets/socials/facebook-icon-small.png'); + break; + case 'Twitter': + var icon = require('../../assets/socials/twitter-icon-small.png'); + break; + // TODO: Missing icon assets + // case 'Twitch': + // var icon = require('../../assets/socials/twitch-icon-small.png'); + // break; + // case 'Pinterest': + // var icon = require('../../assets/socials/pinterest-icon-small.png'); + // break; + // case 'Whatsapp': + // var icon = require('../../assets/socials/whatsapp-icon-small.png'); + // break; + // case 'Linkedin': + // var icon = require('../../assets/socials/linkedin-icon-small.png'); + // break; + case 'Snapchat': + var icon = require('../../assets/socials/snapchat-icon-small.png'); + break; + case 'Youtube': + var icon = require('../../assets/socials/youtube-icon-small.png'); + break; + case 'TikTok': + var icon = require('../../assets/socials/tiktok-icon-small.png'); + break; + default: + var icon = require('../../assets/socials/logo.png'); + break; + } + return ; +}; + +export default SmallSocialIcon; diff --git a/src/components/common/index.ts b/src/components/common/index.ts index 883dae61..0feeaab8 100644 --- a/src/components/common/index.ts +++ b/src/components/common/index.ts @@ -5,6 +5,7 @@ export {default as RadioCheckbox} from './RadioCheckbox'; export {default as NavigationIcon} from './NavigationIcon'; export {default as GradientBackground} from './GradientBackground'; export {default as SocialIcon} from './SocialIcon'; +export {default as SmallSocialIcon} from './SmallSocialIcon'; export {default as TabsGradient} from './TabsGradient'; export {default as RecentSearches} from '../search/RecentSearches'; export {default as LoadingIndicator} from './LoadingIndicator'; diff --git a/src/components/taggs/Tagg.tsx b/src/components/taggs/Tagg.tsx index d9c35b27..9f8fafd1 100644 --- a/src/components/taggs/Tagg.tsx +++ b/src/components/taggs/Tagg.tsx @@ -7,6 +7,7 @@ import RingPlus from '../../assets/icons/ring+.svg'; import Ring from '../../assets/icons/ring.svg'; import { INTEGRATED_SOCIAL_LIST, + SOCIAL_ICON_SIZE_ADJUSTMENT, TAGG_ICON_DIM, TAGG_RING_DIM, } from '../../constants'; @@ -15,7 +16,7 @@ import { handlePressForAuthBrowser, registerNonIntegratedSocialLink, } from '../../services'; -import {SocialIcon, SocialLinkModal} from '../common'; +import {SmallSocialIcon, SocialIcon, SocialLinkModal} from '../common'; import {AuthContext, ProfileContext} from '../../routes'; interface TaggProps { @@ -129,17 +130,33 @@ const Tagg: React.FC = ({ {isProfileView && !isLinked ? ( ) : ( - + <> - - {pickTheRightRingHere()} + + + {pickTheRightRingHere()} + + + + - + )} ); @@ -151,12 +168,27 @@ const styles = StyleSheet.create({ alignItems: 'center', marginHorizontal: 15, }, - image: { + iconTap: { + justifyContent: 'center', + alignItems: 'center', + }, + icon: { width: TAGG_ICON_DIM, height: TAGG_ICON_DIM, borderRadius: TAGG_ICON_DIM / 2, position: 'absolute', }, + smallIconContainer: { + height: 35, + width: 35, + position: 'absolute', + justifyContent: 'center', + alignItems: 'center', + bottom: -35, + }, + smallIcon: { + borderRadius: 1000, + }, }); export default Tagg; diff --git a/src/constants/constants.ts b/src/constants/constants.ts index c2003fb4..4b76a1e0 100644 --- a/src/constants/constants.ts +++ b/src/constants/constants.ts @@ -37,6 +37,14 @@ export const SOCIAL_LIST: string[] = [ // 'Youtube', ]; +export const SOCIAL_ICON_SIZE_ADJUSTMENT: {[social: string]: number} = { + Instagram: 25, + Facebook: 20, + Twitter: 23, + Snapchat: 25, + TikTok: 20, +}; + export const INSTAGRAM_FONT_COLOR: string = '#FF97DE'; export const FACEBOOK_FONT_COLOR: string = '#6697FD'; export const TWITTER_FONT_COLOR: string = '#74C9FD'; diff --git a/src/services/SocialLinkingService.ts b/src/services/SocialLinkingService.ts index c9ffcedf..4a01ee50 100644 --- a/src/services/SocialLinkingService.ts +++ b/src/services/SocialLinkingService.ts @@ -170,6 +170,8 @@ export const handlePressForAuthBrowser: ( } Alert.alert(`Successfully linked ${socialType} 🎉`); return true; + } else if (response.type === 'cancel') { + return false; } else { throw 'Error from Oauth API'; } @@ -200,11 +202,10 @@ export const getLinkedSocials: (user_id: string) => Promise = async ( Authorization: 'Token ' + user_token, }, }); - const body = await response.json(); if (response.status !== 200) { - console.log(body); - throw 'Unable to fetch from server'; + throw 'Unable to fetch linked socials from server'; } + const body = await response.json(); return body.linked_socials || []; } catch (error) { console.log(error); -- cgit v1.2.3-70-g09d2