[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

1 files changed, 2 insertions, 33 deletions

diff --git a/src/components/common/post/PostHeader.tsx b/src/components/common/post/PostHeader.tsx
index a07efd10..0e9c708b 100644
--- a/src/components/common/post/PostHeader.tsx
+++ b/src/components/common/post/PostHeader.tsx
@@ -2,6 +2,7 @@ import React from 'react';
 import {UserType, InstagramPostType} from '../../../types';
 import {View, StyleSheet, Image, Text} from 'react-native';
 import {AuthContext} from '../../../routes/authentication';
+import SocialIcon from '../SocialIcon';
 import moment from 'moment';
 
 const AVATAR_DIM = 35;
@@ -16,38 +17,6 @@ const PostHeader: React.FC<PostHeaderProps> = ({
   social,
 }) => {
   const {avatar} = React.useContext(AuthContext);
-  switch (social) {
-    case 'Instagram':
-      var icon = require('../../../assets/images/instagram-icon.png');
-      break;
-    case 'Facebook':
-      var icon = require('../../../assets/images/facebook-icon.png');
-      break;
-    case 'Twitter':
-      var icon = require('../../../assets/images/twitter-icon.png');
-      break;
-    case 'Twitch':
-      var icon = require('../../../assets/images/twitch-icon.png');
-      break;
-    case 'Pinterest':
-      var icon = require('../../../assets/images/pinterest-icon.png');
-      break;
-    case 'Whatsapp':
-      var icon = require('../../../assets/images/whatsapp-icon.png');
-      break;
-    case 'Linkedin':
-      var icon = require('../../../assets/images/linkedin-icon.png');
-      break;
-    case 'Snapchat':
-      var icon = require('../../../assets/images/snapchat-icon.png');
-      break;
-    case 'Youtube':
-      var icon = require('../../../assets/images/youtube-icon.png');
-      break;
-    default:
-      var icon = require('../../../assets/images/logo.png');
-      break;
-  }
 
   return (
     <View style={styles.container}>
@@ -61,7 +30,7 @@ const PostHeader: React.FC<PostHeaderProps> = ({
           }
         />
         <Text style={styles.username}>{username}</Text>
-        {post && <Image style={styles.icon} source={icon} />}
+        {post && <SocialIcon style={styles.icon} social={social} />}
       </View>
       {post && (
         <Text style={styles.timestamp}>