From 5de44211bbadb451b5951eb3f77658d9bab42bc5 Mon Sep 17 00:00:00 2001 From: Ashm Walia <40498934+ashmgarv@users.noreply.github.com> Date: Mon, 7 Dec 2020 15:27:27 -0800 Subject: [TMA - 431] Make socials browsable (#134) * Open socials apart from twitter on browser * Revert "Open socials apart from twitter on browser" This reverts commit 5b6626811ab7cf9a944b22a1d1d5c4047fe47c64. * Open socials apart from twitter on browser * Fixed * make twitter round * Make some more placeholders browsable Co-authored-by: Ivan Chen --- src/components/taggs/SocialMediaInfo.tsx | 19 +++++++++++++++++-- src/components/taggs/TaggPost.tsx | 4 +++- src/components/taggs/TaggPostFooter.tsx | 9 +++++++-- src/components/taggs/TwitterTaggPost.tsx | 15 +++++++-------- 4 files changed, 34 insertions(+), 13 deletions(-) (limited to 'src/components') diff --git a/src/components/taggs/SocialMediaInfo.tsx b/src/components/taggs/SocialMediaInfo.tsx index a7ed6fe6..c25d0297 100644 --- a/src/components/taggs/SocialMediaInfo.tsx +++ b/src/components/taggs/SocialMediaInfo.tsx @@ -1,6 +1,7 @@ import React from 'react'; import {StyleSheet, Text, View} from 'react-native'; import {SocialIcon} from '..'; +import {handleOpenSocialUrlOnBrowser} from '../../utils'; interface SocialMediaInfoProps { fullname: string; @@ -16,14 +17,27 @@ const SocialMediaInfo: React.FC = ({ return ( {handle && type !== 'Facebook' ? ( - @{handle} + { + handleOpenSocialUrlOnBrowser(handle, type); + }}> + {' '} + @{handle}{' '} + ) : ( <> )} - {fullname} + { + handleOpenSocialUrlOnBrowser(handle, type); + }}> + {fullname} + ); @@ -47,6 +61,7 @@ const styles = StyleSheet.create({ icon: { width: 20, height: 20, + borderRadius: 20, }, row: { flexDirection: 'row', diff --git a/src/components/taggs/TaggPost.tsx b/src/components/taggs/TaggPost.tsx index f587506f..a7f851a5 100644 --- a/src/components/taggs/TaggPost.tsx +++ b/src/components/taggs/TaggPost.tsx @@ -8,8 +8,9 @@ import Hyperlink from 'react-native-hyperlink'; interface TaggPostProps { post: SimplePostType; + social: string; } -const TaggPost: React.FC = ({post}) => { +const TaggPost: React.FC = ({post, social}) => { if (post.media_type === 'photo') { // Post with image and footer that shows caption return ( @@ -32,6 +33,7 @@ const TaggPost: React.FC = ({post}) => { handle={post.username} caption={post.caption || ''} timestamp={post.timestamp} + social={social} /> ); diff --git a/src/components/taggs/TaggPostFooter.tsx b/src/components/taggs/TaggPostFooter.tsx index 8371a847..ae9d889d 100644 --- a/src/components/taggs/TaggPostFooter.tsx +++ b/src/components/taggs/TaggPostFooter.tsx @@ -1,6 +1,7 @@ import React from 'react'; -import {StyleSheet, View} from 'react-native'; +import {Linking, StyleSheet, View} from 'react-native'; import {Text} from 'react-native-animatable'; +import {handleOpenSocialUrlOnBrowser} from '../../utils'; import {DateLabel} from '../common'; interface TaggPostFooterProps { @@ -8,12 +9,14 @@ interface TaggPostFooterProps { handle?: string; caption: string; timestamp: string; + social: string; } const TaggPostFooter: React.FC = ({ likes, handle, caption, timestamp, + social, }) => { const handleText = handle ? handle : ''; return ( @@ -21,7 +24,9 @@ const TaggPostFooter: React.FC = ({ {likes ? {likes} likes : <>} - + handleOpenSocialUrlOnBrowser(handleText, social)}> {handleText} {caption} diff --git a/src/components/taggs/TwitterTaggPost.tsx b/src/components/taggs/TwitterTaggPost.tsx index fb4cbd0f..c971a82c 100644 --- a/src/components/taggs/TwitterTaggPost.tsx +++ b/src/components/taggs/TwitterTaggPost.tsx @@ -3,9 +3,13 @@ import {Image, Linking, StyleSheet, View} from 'react-native'; import {Text} from 'react-native-animatable'; import Hyperlink from 'react-native-hyperlink'; import LinearGradient from 'react-native-linear-gradient'; -import {AVATAR_DIM, TAGGS_GRADIENT, TAGG_TEXT_LIGHT_BLUE} from '../../constants'; +import { + AVATAR_DIM, + TAGGS_GRADIENT, + TAGG_TEXT_LIGHT_BLUE, +} from '../../constants'; import {TwitterPostType} from '../../types'; -import {SCREEN_WIDTH} from '../../utils'; +import {handleOpenSocialUrlOnBrowser, SCREEN_WIDTH} from '../../utils'; import {DateLabel, PostCarousel} from '../common'; interface TwitterTaggPostProps { @@ -16,11 +20,6 @@ const TwitterTaggPost: React.FC = ({ ownerHandle, post, }) => { - const openTwitterProfileLink = (handle?: string) => { - if (handle) { - Linking.openURL(`https://twitter.com/${handle}`); - } - }; return ( {/* Retweeted? */} @@ -41,7 +40,7 @@ const TwitterTaggPost: React.FC = ({ /> openTwitterProfileLink(post.handle)}> + onPress={() => handleOpenSocialUrlOnBrowser(post.handle, 'Twitter')}> @{post.handle} -- cgit v1.2.3-70-g09d2