From 2a300bd5e09e44832699a0bcd449de5a35368706 Mon Sep 17 00:00:00 2001 From: Justin Shillingford Date: Mon, 17 Aug 2020 11:17:31 -0400 Subject: [TMA-19*] Abstracted out Social Icon logic (#32) * Basic mostly functional implementation Need to figure out why API is being called so much * Hey it works now! Without a million API calls! * Fixed bug where app would crash upon login Also updated property names to be more appropriate * Added post datetime and social icon * Updated error message * Fixed typecheck errors I don't know that these fixes are the best since I don't think they're generalizable * Formatted datetime in PostHeader * Abstracted out social icon switching logic * Basic mostly functional implementation Need to figure out why API is being called so much * Hey it works now! Without a million API calls! * Fixed bug where app would crash upon login Also updated property names to be more appropriate * Added post datetime and social icon * Updated error message * Fixed typecheck errors I don't know that these fixes are the best since I don't think they're generalizable * Abstracted out social icon switching logic --- src/components/onboarding/SocialMediaLinker.tsx | 13 ++----------- 1 file changed, 2 insertions(+), 11 deletions(-) (limited to 'src/components/onboarding') diff --git a/src/components/onboarding/SocialMediaLinker.tsx b/src/components/onboarding/SocialMediaLinker.tsx index f1da8186..fc823979 100644 --- a/src/components/onboarding/SocialMediaLinker.tsx +++ b/src/components/onboarding/SocialMediaLinker.tsx @@ -8,6 +8,7 @@ import { } from 'react-native'; import {LinkerType} from 'src/types'; import {SOCIAL_FONT_COLORS} from '../../constants/constants'; +import SocialIcon from '../common/SocialIcon'; interface SocialMediaLinkerProps extends TouchableOpacityProps { social: LinkerType; @@ -29,43 +30,33 @@ const SocialMediaLinker: React.FC = ({ switch (label) { case 'Instagram': - var icon = require('../../assets/images/instagram-icon.png'); var font_color = SOCIAL_FONT_COLORS.INSTAGRAM; break; case 'Facebook': - var icon = require('../../assets/images/facebook-icon.png'); var font_color = SOCIAL_FONT_COLORS.FACEBOOK; break; case 'Twitter': - var icon = require('../../assets/images/twitter-icon.png'); var font_color = SOCIAL_FONT_COLORS.TWITTER; break; case 'Twitch': - var icon = require('../../assets/images/twitch-icon.png'); var font_color = SOCIAL_FONT_COLORS.TWITCH; break; case 'Pinterest': - var icon = require('../../assets/images/pinterest-icon.png'); var font_color = SOCIAL_FONT_COLORS.PINTEREST; break; case 'Whatsapp': - var icon = require('../../assets/images/whatsapp-icon.png'); var font_color = SOCIAL_FONT_COLORS.WHATSAPP; break; case 'Linkedin': - var icon = require('../../assets/images/linkedin-icon.png'); var font_color = SOCIAL_FONT_COLORS.LINKEDIN; break; case 'Snapchat': - var icon = require('../../assets/images/snapchat-icon.png'); var font_color = SOCIAL_FONT_COLORS.SNAPCHAT; break; case 'Youtube': - var icon = require('../../assets/images/youtube-icon.png'); var font_color = SOCIAL_FONT_COLORS.YOUTUBE; break; default: - var icon = require('../../assets/images/logo.png'); var font_color = '#fff'; } @@ -74,7 +65,7 @@ const SocialMediaLinker: React.FC = ({ activeOpacity={0.7} onPress={handlePress} style={styles.container}> - + {label} {state.authenticated && (