fix: browser tab url type

app/actions/browser/index.js

@@ -68,11 +68,13 @@ export function closeAllTabs() {
  * Creates a new tab
  *
  * @param {string} url - The website's url
+ * @param {string} linkType - optional link type
  */
-export function createNewTab(url) {
+export function createNewTab(url, linkType) {
   return {
     type: 'CREATE_NEW_TAB',
     url,
+    linkType,
     id: Date.now(),
   };
 }

app/components/UI/CollectibleModal/CollectibleModal.tsx

@@ -28,6 +28,7 @@ import { MetaMetricsEvents } from '../../../core/Analytics';
 import { selectChainId } from '../../../selectors/networkController';
 import { getDecimalChainId } from '../../../util/networks';
 import { Nft } from '@metamask/assets-controllers';
+import { EXTERNAL_LINK_TYPE } from '../../../constants/browser';
 
 const CollectibleModal = () => {
   const navigation = useNavigation();
@@ -92,6 +93,7 @@ const CollectibleModal = () => {
         screen: Routes.BROWSER_VIEW,
         params: {
           newTabUrl: url,
+          linkType: EXTERNAL_LINK_TYPE,
           timestamp: Date.now(),
         },
       });

app/components/Views/Browser/index.js

@@ -67,6 +67,7 @@ export const Browser = (props) => {
   const { trackEvent } = useMetrics();
   const { toastRef } = useContext(ToastContext);
   const browserUrl = props.route?.params?.url;
+  const linkType = props.route?.params?.linkType;
   const prevSiteHostname = useRef(browserUrl);
   const { accounts, ensByAccountAddress } = useAccounts();
   const accountAvatarType = useSelector((state) =>
@@ -114,8 +115,8 @@ export const Browser = (props) => {
     [navigation, route, colors],
   );
 
-  const newTab = (url) => {
-    createNewTab(url || AppConstants.HOMEPAGE_URL);
+  const newTab = (url, linkType) => {
+    createNewTab(url || AppConstants.HOMEPAGE_URL, linkType);
   };
 
   const updateTabInfo = (url, tabID) =>
@@ -222,15 +223,15 @@ export const Browser = (props) => {
     [tabs],
   );
 
-  // Handle deeplinks.
+  // Handle links with associated timestamp.
   useEffect(
     () => {
       const newTabUrl = route.params?.newTabUrl;
       const deeplinkTimestamp = route.params?.timestamp;
       const existingTabId = route.params?.existingTabId;
       if (newTabUrl && deeplinkTimestamp) {
-        // Open url from deeplink.
-        newTab(newTabUrl);
+        // Open url from link.
+        newTab(newTabUrl, linkType);
       } else if (existingTabId) {
         const existingTab = tabs.find((tab) => tab.id === existingTabId);
         if (existingTab) {
@@ -359,6 +360,7 @@ export const Browser = (props) => {
         id={tab.id}
         key={`tab_${tab.id}`}
         initialUrl={tab.url || AppConstants.HOMEPAGE_URL}
+        linkType={tab.linkType}
         updateTabInfo={updateTabInfo}
         showTabs={showTabs}
         newTab={newTab}
@@ -384,7 +386,7 @@ const mapStateToProps = (state) => ({
 });
 
 const mapDispatchToProps = (dispatch) => ({
-  createNewTab: (url) => dispatch(createNewTab(url)),
+  createNewTab: (url, linkType) => dispatch(createNewTab(url, linkType)),
   closeAllTabs: () => dispatch(closeAllTabs()),
   closeTab: (id) => dispatch(closeTab(id)),
   setActiveTab: (id) => dispatch(setActiveTab(id)),

app/components/Views/BrowserTab/index.js

@@ -1,4 +1,10 @@
-import React, { useState, useRef, useEffect, useCallback } from 'react';
+import React, {
+  useState,
+  useRef,
+  useEffect,
+  useCallback,
+  useMemo,
+} from 'react';
 import {
   Text,
   StyleSheet,
@@ -105,6 +111,7 @@ import { selectPermissionControllerState } from '../../../selectors/snaps/permis
 import { useIsFocused } from '@react-navigation/native';
 import handleWebViewFocus from '../../../util/browser/webViewFocus';
 import { isTest } from '../../../util/test/utils.js';
+import { EXTERNAL_LINK_TYPE } from '../../../constants/browser';
 
 const { HOMEPAGE_URL, NOTIFICATION_NAMES } = AppConstants;
 const HOMEPAGE_HOST = new URL(HOMEPAGE_URL)?.hostname;
@@ -1504,6 +1511,11 @@ export const BrowserTab = (props) => {
     </View>
   );
 
+  const isExternalLink = useMemo(
+    () => props.linkType === EXTERNAL_LINK_TYPE,
+    [props.linkType],
+  );
+
   /**
    * Main render
    */
@@ -1533,7 +1545,10 @@ export const BrowserTab = (props) => {
                 renderError={() => (
                   <WebviewError error={error} returnHome={returnHome} />
                 )}
-                source={{ uri: initialUrl }}
+                source={{
+                  uri: initialUrl,
+                  ...(isExternalLink ? { headers: { Cookie: '' } } : null),
+                }}
                 injectedJavaScriptBeforeContentLoaded={entryScriptWeb3}
                 style={styles.webview}
                 onLoadStart={onLoadStart}
@@ -1578,6 +1593,10 @@ BrowserTab.propTypes = {
    * InitialUrl
    */
   initialUrl: PropTypes.string,
+  /**
+   * linkType - type of link to open
+   */
+  linkType: PropTypes.string,
   /**
    * Protocol string to append to URLs that have none
    */

app/constants/browser.ts

@@ -0,0 +1 @@
+export const EXTERNAL_LINK_TYPE = 'external-link';

app/core/DeeplinkManager/Handlers/handleBrowserUrl.ts

@@ -1,6 +1,7 @@
 import Routes from '../../../constants/navigation/Routes';
 import { InteractionManager } from 'react-native';
 import DeeplinkManager from '../DeeplinkManager';
+import { EXTERNAL_LINK_TYPE } from '../../../constants/browser';
 
 function handleBrowserUrl({
   deeplinkManager,
@@ -19,6 +20,7 @@ function handleBrowserUrl({
         screen: Routes.BROWSER.VIEW,
         params: {
           newTabUrl: url,
+          linkType: EXTERNAL_LINK_TYPE,
           timestamp: Date.now(),
         },
       });

app/reducers/browser/index.js

@@ -51,7 +51,14 @@ const browserReducer = (state = initialState, action) => {
     case 'CREATE_NEW_TAB':
       return {
         ...state,
-        tabs: [...state.tabs, { url: action.url, id: action.id }],
+        tabs: [
+          ...state.tabs,
+          {
+            url: action.url,
+            ...(action.linkType && { linkType: action.linkType }),
+            id: action.id,
+          },
+        ],
       };
     case 'CLOSE_TAB':
       return {