link config

src/components/HTMLEngineProvider/HTMLRenderers/AnchorRenderer.js

@@ -1,5 +1,4 @@
 import React from 'react';
-import {Linking} from 'react-native';
 import {TNodeChildrenRenderer} from 'react-native-render-html';
 import lodashGet from 'lodash/get';
 import htmlRendererPropTypes from './htmlRendererPropTypes';
@@ -59,7 +58,7 @@ function AnchorRenderer(props) {
             Link.openOldDotLink(internalExpensifyPath);
             return;
         }
-        Linking.openURL(attrHref);
+        Link.openExternalLink(attrHref);
     };
 
     if (!HTMLEngineUtils.isInsideComment(props.tnode)) {

src/components/TextLink.js

@@ -1,11 +1,11 @@
 import _ from 'underscore';
 import React from 'react';
 import PropTypes from 'prop-types';
-import {Linking} from 'react-native';
 import Text from './Text';
 import styles from '../styles/styles';
 import stylePropTypes from '../styles/stylePropTypes';
 import CONST from '../CONST';
+import * as Link from '../libs/actions/Link';
 
 const propTypes = {
     /** Link to open in new tab */
@@ -49,7 +49,7 @@ function TextLink(props) {
             return;
         }
 
-        Linking.openURL(props.href);
+        Link.openExternalLink(props.href);
     };
 
     /**

src/components/VideoChatButtonAndMenu/BaseVideoChatButtonAndMenu.js

@@ -1,6 +1,6 @@
 import _ from 'underscore';
 import React, {useState, useRef, useEffect, useCallback} from 'react';
-import {View, Dimensions, Linking} from 'react-native';
+import {View, Dimensions} from 'react-native';
 import PropTypes from 'prop-types';
 import Icon from '../Icon';
 import * as Expensicons from '../Icon/Expensicons';
@@ -18,6 +18,7 @@ import Tooltip from '../Tooltip';
 import {propTypes as videoChatButtonAndMenuPropTypes, defaultProps} from './videoChatButtonAndMenuPropTypes';
 import * as Session from '../../libs/actions/Session';
 import PressableWithoutFeedback from '../Pressable/PressableWithoutFeedback';
+import * as Link from '../../libs/actions/Link';
 
 const propTypes = {
     /** Link to open when user wants to create a new google meet meeting */
@@ -40,15 +41,15 @@ function BaseVideoChatButtonAndMenu(props) {
             text: props.translate('videoChatButtonAndMenu.zoom'),
             onPress: () => {
                 setIsVideoChatMenuActive(false);
-                Linking.openURL(CONST.NEW_ZOOM_MEETING_URL);
+                Link.openExternalLink(CONST.NEW_ZOOM_MEETING_URL);
             },
         },
         {
             icon: GoogleMeetIcon,
             text: props.translate('videoChatButtonAndMenu.googleMeet'),
             onPress: () => {
                 setIsVideoChatMenuActive(false);
-                Linking.openURL(props.googleMeetURL);
+                Link.openExternalLink(props.googleMeetURL);
             },
         },
     ];
@@ -93,7 +94,7 @@ function BaseVideoChatButtonAndMenu(props) {
 
                             // If this is the Concierge chat, we'll open the modal for requesting a setup call instead
                             if (props.isConcierge && props.guideCalendarLink) {
-                                Linking.openURL(props.guideCalendarLink);
+                                Link.openExternalLink(props.guideCalendarLink);
                                 return;
                             }
                             setIsVideoChatMenuActive((previousVal) => !previousVal);

src/libs/actions/Link.js

@@ -1,11 +1,7 @@
 import Onyx from 'react-native-onyx';
 import lodashGet from 'lodash/get';
-import {Linking} from 'react-native';
 import _ from 'underscore';
 import ONYXKEYS from '../../ONYXKEYS';
-import Growl from '../Growl';
-import * as Localize from '../Localize';
-import CONST from '../../CONST';
 import asyncOpenURL from '../asyncOpenURL';
 import * as API from '../API';
 import * as Environment from '../Environment/Environment';
@@ -23,16 +19,6 @@ Onyx.connect({
     callback: (val) => (currentUserEmail = lodashGet(val, 'email', '')),
 });
 
-/**
- * @returns {Boolean}
- */
-function showGrowlIfOffline() {
-    if (isNetworkOffline) {
-        Growl.show(Localize.translateLocal('session.offlineMessageRetry'), CONST.GROWL.WARNING);
-    }
-    return isNetworkOffline;
-}
-
 /**
  * @param {String} [url] the url path
  * @param {String} [shortLivedAuthToken]
@@ -56,12 +42,20 @@ function buildOldDotURL(url, shortLivedAuthToken) {
     });
 }
 
+/**
+ * @param {String} url
+ * @param {Boolean} shouldSkipCustomSafariLogic When true, we will use `Linking.openURL` even if the browser is Safari.
+ */
+function openExternalLink(url, shouldSkipCustomSafariLogic = false) {
+    asyncOpenURL(Promise.resolve(), url, shouldSkipCustomSafariLogic);
+}
+
 /**
  * @param {String} url the url path
  */
 function openOldDotLink(url) {
     if (isNetworkOffline) {
-        buildOldDotURL(url).then((oldDotURL) => Linking.openURL(oldDotURL));
+        buildOldDotURL(url).then((oldDotURL) => openExternalLink(oldDotURL));
         return;
     }
 
@@ -74,17 +68,4 @@ function openOldDotLink(url) {
         (oldDotURL) => oldDotURL,
     );
 }
-
-/**
- * @param {String} url
- * @param {Boolean} shouldSkipCustomSafariLogic When true, we will use `Linking.openURL` even if the browser is Safari.
- */
-function openExternalLink(url, shouldSkipCustomSafariLogic = false) {
-    if (showGrowlIfOffline()) {
-        return;
-    }
-
-    asyncOpenURL(Promise.resolve(), url, shouldSkipCustomSafariLogic);
-}
-
 export {buildOldDotURL, openOldDotLink, openExternalLink};

src/libs/fileDownload/index.js

@@ -1,5 +1,5 @@
-import {Linking} from 'react-native';
 import * as FileUtils from './FileUtils';
+import * as Link from '../actions/Link';
 
 /**
  * Downloading attachment in web, desktop
@@ -39,7 +39,7 @@ export default function fileDownload(url, fileName) {
             })
             .catch(() => {
                 // file could not be downloaded, open sourceURL in new tab
-                Linking.openURL(url);
+                Link.openExternalLink(url);
                 return resolve();
             });
     });

src/pages/GetAssistancePage.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import {View, ScrollView, Linking} from 'react-native';
+import {View, ScrollView} from 'react-native';
 import PropTypes from 'prop-types';
 import {withOnyx} from 'react-native-onyx';
 import lodashGet from 'lodash/get';
@@ -68,7 +68,7 @@ function GetAssistancePage(props) {
     if (guideCalendarLink) {
         menuItems.splice(1, 0, {
             title: props.translate('getAssistancePage.scheduleSetupCall'),
-            onPress: () => Linking.openURL(guideCalendarLink),
+            onPress: () => Link.openExternalLink(guideCalendarLink),
             icon: Expensicons.Phone,
             shouldShowRightIcon: true,
             iconRight: Expensicons.NewWindow,

src/pages/ReimbursementAccount/BankAccountStep.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import {View, ScrollView, Linking} from 'react-native';
+import {View, ScrollView} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import PropTypes from 'prop-types';
 import lodashGet from 'lodash/get';
@@ -27,6 +27,7 @@ import Button from '../../components/Button';
 import ScreenWrapper from '../../components/ScreenWrapper';
 import StepPropTypes from './StepPropTypes';
 import PressableWithoutFeedback from '../../components/Pressable/PressableWithoutFeedback';
+import * as Link from '../../libs/actions/Link';
 
 const propTypes = {
     ...StepPropTypes,
@@ -148,7 +149,7 @@ function BankAccountStep(props) {
                     <View style={[styles.mv0, styles.mh5, styles.flexRow, styles.justifyContentBetween]}>
                         <TextLink href="https://use.expensify.com/privacy">{props.translate('common.privacy')}</TextLink>
                         <PressableWithoutFeedback
-                            onPress={() => Linking.openURL('https://community.expensify.com/discussion/5677/deep-dive-how-expensify-protects-your-information/')}
+                            onPress={() => Link.openExternalLink('https://community.expensify.com/discussion/5677/deep-dive-how-expensify-protects-your-information/')}
                             style={[styles.flexRow, styles.alignItemsCenter]}
                             accessibilityLabel={props.translate('bankAccount.yourDataIsSecure')}
                         >

src/pages/settings/Payments/AddPayPalMePage.js

@@ -1,5 +1,5 @@
 import React, {useRef, useCallback} from 'react';
-import {View, Linking} from 'react-native';
+import {View} from 'react-native';
 import _ from 'underscore';
 import {withOnyx} from 'react-native-onyx';
 import lodashGet from 'lodash/get';
@@ -24,6 +24,7 @@ import * as Expensicons from '../../../components/Icon/Expensicons';
 import variables from '../../../styles/variables';
 import PressableWithoutFeedback from '../../../components/Pressable/PressableWithoutFeedback';
 import paypalMeDataPropTypes from '../../../components/paypalMeDataPropTypes';
+import * as Link from '../../../libs/actions/Link';
 
 const propTypes = {
     /** Account details for PayPal.Me */
@@ -97,7 +98,7 @@ function AddPayPalMePage(props) {
                         shouldUseAutoHitSlop={false}
                         accessibilityRole={CONST.ACCESSIBILITY_ROLE.LINK}
                         accessibilityLabel={props.translate('addPayPalMePage.supportedCurrencies')}
-                        onPress={() => Linking.openURL('https://developer.paypal.com/docs/reports/reference/paypal-supported-currencies')}
+                        onPress={() => Link.openExternalLink('https://developer.paypal.com/docs/reports/reference/paypal-supported-currencies')}
                     >
                         <View style={[styles.flexRow, styles.cursorPointer]}>
                             <TextLink