From b640cf1e6cede6905dfbe177ed335fe42895d706 Mon Sep 17 00:00:00 2001
From: Pujan <shahpujan1992@gmail.com>
Date: Fri, 17 Mar 2023 10:27:26 +0530
Subject: [PATCH] update Social links with the TextLink

---
 src/pages/signin/Socials.js | 30 ++++++++++++++++--------------
 1 file changed, 16 insertions(+), 14 deletions(-)

diff --git a/src/pages/signin/Socials.js b/src/pages/signin/Socials.js
index a8f81e9e251e..a8dad2ca4821 100644
--- a/src/pages/signin/Socials.js
+++ b/src/pages/signin/Socials.js
@@ -1,6 +1,5 @@
 import React from 'react';
 import _ from 'underscore';
-import {Pressable, Linking} from 'react-native';
 import Icon from '../../components/Icon';
 import Text from '../../components/Text';
 import * as Expensicons from '../../components/Icon/Expensicons';
@@ -8,6 +7,8 @@ import themeColors from '../../styles/themes/default';
 import styles from '../../styles/styles';
 import variables from '../../styles/variables';
 import CONST from '../../CONST';
+import Hoverable from '../../components/Hoverable';
+import TextLink from '../../components/TextLink';
 
 const socialsList = [
     {
@@ -35,22 +36,23 @@ const socialsList = [
 const Socials = () => (
     <Text>
         {_.map(socialsList, social => (
-            <Pressable
-                onPress={() => {
-                    Linking.openURL(social.link);
-                }}
-                style={styles.pr1}
+            <Hoverable
                 key={social.link}
             >
-                {({hovered}) => (
-                    <Icon
-                        src={social.iconURL}
-                        height={variables.iconSizeLarge}
-                        width={variables.iconSizeLarge}
-                        fill={hovered ? themeColors.link : themeColors.textLight}
-                    />
+                {hovered => (
+                    <TextLink
+                        style={styles.pr1}
+                        href={social.link}
+                    >
+                        <Icon
+                            src={social.iconURL}
+                            height={variables.iconSizeLarge}
+                            width={variables.iconSizeLarge}
+                            fill={hovered ? themeColors.link : themeColors.textLight}
+                        />
+                    </TextLink>
                 )}
-            </Pressable>
+            </Hoverable>
         ))}
     </Text>
 );