Add missing code from main into staging branch

ios/Podfile.lock

@@ -582,7 +582,7 @@ PODS:
     - Firebase/Performance (= 8.8.0)
     - React-Core
     - RNFBApp
-  - RNGestureHandler (2.5.0):
+  - RNGestureHandler (2.6.0):
     - React-Core
   - RNPermissions (3.6.1):
     - React-Core
@@ -1000,7 +1000,7 @@ SPEC CHECKSUMS:
   RNFBApp: 729c0666395b1953198dc4a1ec6deb8fbe1c302e
   RNFBCrashlytics: 2061ca863e8e2fa1aae9b12477d7dfa8e88ca0f9
   RNFBPerf: 389914cda4000fe0d996a752532a591132cbf3f9
-  RNGestureHandler: bad495418bcbd3ab47017a38d93d290ebd406f50
+  RNGestureHandler: 920eb17f5b1e15dae6e5ed1904045f8f90e0b11e
   RNPermissions: dcdb7b99796bbeda6975a6e79ad519c41b251b1c
   RNReactNativeHapticFeedback: 1e3efeca9628ff9876ee7cdd9edec1b336913f8c
   RNReanimated: 2cf7451318bb9cc430abeec8d67693f9cf4e039c

package.json

@@ -64,7 +64,7 @@
     "dom-serializer": "^0.2.2",
     "domhandler": "^4.3.0",
     "dotenv": "^8.2.0",
-    "expensify-common": "git+https://github.com/Expensify/expensify-common.git#e0ec0b9abca4d7b417ba0b016f8725856cfeeece",
+    "expensify-common": "git+https://github.com/Expensify/expensify-common.git#662e70f1f75ace4ab81365be312efbf28f16e0a3",
     "fbjs": "^3.0.2",
     "file-loader": "^6.0.0",
     "html-entities": "^1.3.1",

src/CONFIG.js

@@ -9,6 +9,8 @@ import CONST from './CONST';
 const ENVIRONMENT = lodashGet(Config, 'ENVIRONMENT', CONST.ENVIRONMENT.DEV);
 const newExpensifyURL = Url.addTrailingForwardSlash(lodashGet(Config, 'NEW_EXPENSIFY_URL', 'https://new.expensify.com/'));
 const expensifyURL = Url.addTrailingForwardSlash(lodashGet(Config, 'EXPENSIFY_URL', 'https://www.expensify.com/'));
+const stagingExpensifyURL = Url.addTrailingForwardSlash(lodashGet(Config, 'STAGING_EXPENSIFY_URL', 'https://staging.expensify.com/'));
+const stagingSecureExpensifyUrl = Url.addTrailingForwardSlash(lodashGet(Config, 'STAGING_SECURE_EXPENSIFY_URL', 'https://staging-secure.expensify.com/'));
 const ngrokURL = Url.addTrailingForwardSlash(lodashGet(Config, 'NGROK_URL', ''));
 const secureNgrokURL = Url.addTrailingForwardSlash(lodashGet(Config, 'SECURE_NGROK_URL', ''));
 const secureExpensifyUrl = Url.addTrailingForwardSlash(lodashGet(
@@ -46,12 +48,15 @@ export default {
         SECURE_EXPENSIFY_URL: secureURLRoot,
         NEW_EXPENSIFY_URL: newExpensifyURL,
         URL_API_ROOT: expensifyURLRoot,
+        STAGING_EXPENSIFY_URL: stagingExpensifyURL,
+        STAGING_SECURE_EXPENSIFY_URL: stagingSecureExpensifyUrl,
         PARTNER_NAME: lodashGet(Config, 'EXPENSIFY_PARTNER_NAME', 'chat-expensify-com'),
         PARTNER_PASSWORD: lodashGet(Config, 'EXPENSIFY_PARTNER_PASSWORD', 'e21965746fd75f82bb66'),
         EXPENSIFY_CASH_REFERER: 'ecash',
         CONCIERGE_URL: conciergeUrl,
     },
     IS_IN_PRODUCTION: Platform.OS === 'web' ? process.env.NODE_ENV === 'production' : !__DEV__,
+    IS_IN_STAGING: ENVIRONMENT === CONST.ENVIRONMENT.STAGING,
     IS_USING_LOCAL_WEB: useNgrok || expensifyURLRoot.includes('dev'),
     PUSHER: {
         APP_KEY: lodashGet(Config, 'PUSHER_APP_KEY', '268df511a204fbb60884'),

src/CONST.js

@@ -232,7 +232,6 @@ const CONST = {
     MANAGE_CARDS_URL: 'domain_companycards',
     FEES_URL: `${USE_EXPENSIFY_URL}/fees`,
     CFPB_PREPAID_URL: 'https://cfpb.gov/prepaid',
-    STAGING_SECURE_URL: 'https://staging-secure.expensify.com/',
     STAGING_NEW_EXPENSIFY_URL: 'https://staging.new.expensify.com',
 
     // Use Environment.getEnvironmentURL to get the complete URL with port number
@@ -351,6 +350,7 @@ const CONST = {
         SWITCH_REPORT: 'switch_report',
         SIDEBAR_LOADED: 'sidebar_loaded',
         PERSONAL_DETAILS_FORMATTED: 'personal_details_formatted',
+        SIDEBAR_LINKS_FILTER_REPORTS: 'sidebar_links_filter_reports',
         COLD: 'cold',
         REPORT_ACTION_ITEM_LAYOUT_DEBOUNCE_TIME: 1500,
         TOOLTIP_SENSE: 1000,

src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js

@@ -0,0 +1,69 @@
+import _ from 'underscore';
+import React from 'react';
+import {StyleSheet} from 'react-native';
+import lodashGet from 'lodash/get';
+import Str from 'expensify-common/lib/str';
+import Text from '../Text';
+import PressableWithSecondaryInteraction from '../PressableWithSecondaryInteraction';
+import * as ReportActionContextMenu from '../../pages/home/report/ContextMenu/ReportActionContextMenu';
+import * as ContextMenuActions from '../../pages/home/report/ContextMenu/ContextMenuActions';
+import Tooltip from '../Tooltip';
+import canUseTouchScreen from '../../libs/canUseTouchscreen';
+import styles from '../../styles/styles';
+import withWindowDimensions from '../withWindowDimensions';
+import {propTypes, defaultProps} from './anchorForCommentsOnlyPropTypes';
+
+/*
+ * This is a default anchor component for regular links.
+ */
+const BaseAnchorForCommentsOnly = (props) => {
+    let linkRef;
+    const rest = _.omit(props, _.keys(propTypes));
+    const linkProps = {};
+    if (_.isFunction(props.onPress)) {
+        linkProps.onPress = props.onPress;
+    } else {
+        linkProps.href = props.href;
+    }
+    const defaultTextStyle = canUseTouchScreen() || props.isSmallScreenWidth ? {} : styles.userSelectText;
+
+    return (
+        <PressableWithSecondaryInteraction
+            inline
+            onSecondaryInteraction={
+                (event) => {
+                    ReportActionContextMenu.showContextMenu(
+                        Str.isValidEmail(props.displayName) ? ContextMenuActions.CONTEXT_MENU_TYPES.EMAIL : ContextMenuActions.CONTEXT_MENU_TYPES.LINK,
+                        event,
+                        props.href,
+                        lodashGet(linkRef, 'current'),
+                    );
+                }
+            }
+        >
+            <Tooltip text={Str.isValidEmail(props.displayName) ? '' : props.href}>
+                <Text
+                    ref={el => linkRef = el}
+                    style={StyleSheet.flatten([props.style, defaultTextStyle])}
+                    accessibilityRole="link"
+                    hrefAttrs={{
+                        rel: props.rel,
+                        target: props.target,
+                    }}
+                    // eslint-disable-next-line react/jsx-props-no-spreading
+                    {...linkProps}
+                    // eslint-disable-next-line react/jsx-props-no-spreading
+                    {...rest}
+                >
+                    {props.children}
+                </Text>
+            </Tooltip>
+        </PressableWithSecondaryInteraction>
+    );
+};
+
+BaseAnchorForCommentsOnly.propTypes = propTypes;
+BaseAnchorForCommentsOnly.defaultProps = defaultProps;
+BaseAnchorForCommentsOnly.displayName = 'BaseAnchorForCommentsOnly';
+
+export default withWindowDimensions(BaseAnchorForCommentsOnly);

src/components/AnchorForCommentsOnly/anchorForCommentsOnlyPropTypes.js

@@ -0,0 +1,42 @@
+import PropTypes from 'prop-types';
+import stylePropTypes from '../../styles/stylePropTypes';
+import {windowDimensionsPropTypes} from '../withWindowDimensions';
+
+const propTypes = {
+    /** The URL to open */
+    href: PropTypes.string,
+
+    /** What headers to send to the linked page (usually noopener and noreferrer)
+        This is unused in native, but is here for parity with web */
+    rel: PropTypes.string,
+
+    /** Used to determine where to open a link ("_blank" is passed for a new tab)
+        This is unused in native, but is here for parity with web */
+    target: PropTypes.string,
+
+    /** Any children to display */
+    children: PropTypes.node,
+
+    /** Anchor text of URLs or emails. */
+    displayName: PropTypes.string,
+
+    /** Any additional styles to apply */
+    style: stylePropTypes,
+
+    /** Press handler for the link, when not passed, default href is used to create a link like behaviour */
+    onPress: PropTypes.func,
+
+    ...windowDimensionsPropTypes,
+};
+
+const defaultProps = {
+    href: '',
+    rel: '',
+    target: '',
+    children: null,
+    style: {},
+    displayName: '',
+    onPress: undefined,
+};
+
+export {propTypes, defaultProps};

src/components/AnchorForCommentsOnly/index.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import * as anchorForCommentsOnlyPropTypes from './anchorForCommentsOnlyPropTypes';
+import BaseAnchorForCommentsOnly from './BaseAnchorForCommentsOnly';
+
+// eslint-disable-next-line react/jsx-props-no-spreading
+const AnchorForCommentsOnly = props => <BaseAnchorForCommentsOnly {...props} />;
+AnchorForCommentsOnly.propTypes = anchorForCommentsOnlyPropTypes.propTypes;
+AnchorForCommentsOnly.defaultProps = anchorForCommentsOnlyPropTypes.defaultProps;
+AnchorForCommentsOnly.displayName = 'AnchorForCommentsOnly';
+
+export default AnchorForCommentsOnly;

src/components/AnchorForCommentsOnly/index.native.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import {Linking} from 'react-native';
+import _ from 'underscore';
+
+import * as anchorForCommentsOnlyPropTypes from './anchorForCommentsOnlyPropTypes';
+import BaseAnchorForCommentsOnly from './BaseAnchorForCommentsOnly';
+
+// eslint-disable-next-line react/jsx-props-no-spreading
+const AnchorForCommentsOnly = (props) => {
+    const onPress = () => (_.isFunction(props.onPress) ? props.onPress() : Linking.openURL(props.href));
+
+    // eslint-disable-next-line react/jsx-props-no-spreading
+    return <BaseAnchorForCommentsOnly {...props} onPress={onPress} />;
+};
+
+AnchorForCommentsOnly.propTypes = anchorForCommentsOnlyPropTypes.propTypes;
+AnchorForCommentsOnly.defaultProps = anchorForCommentsOnlyPropTypes.defaultProps;
+AnchorForCommentsOnly.displayName = 'AnchorForCommentsOnly';
+
+export default AnchorForCommentsOnly;

src/components/HTMLEngineProvider/HTMLRenderers/AnchorRenderer.js

@@ -85,7 +85,7 @@ const AnchorRenderer = (props) => {
             displayName={displayName}
 
             // Only pass the press handler for internal links, for public links fallback to default link handling
-            onPress={internalNewExpensifyPath || internalExpensifyPath ? navigateToLink : undefined}
+            onPress={(internalNewExpensifyPath || internalExpensifyPath) ? navigateToLink : undefined}
         >
             <TNodeChildrenRenderer tnode={props.tnode} />
         </AnchorForCommentsOnly>