remove stellar.expert usage for Custom networks

extension/src/helpers/stellar.ts

@@ -134,3 +134,11 @@ export const isActiveNetwork = (
   networkA: NetworkDetails,
   networkB: NetworkDetails,
 ) => isEqual(networkA, networkB);
+
+export const CUSTOM_NETWORK = "CUSTOM";
+
+export const isCustomNetwork = (networkDetails: NetworkDetails) => {
+  const { network } = networkDetails;
+
+  return network === CUSTOM_NETWORK;
+};

extension/src/popup/components/accountHistory/TransactionDetail/index.tsx

@@ -1,5 +1,6 @@
 import React from "react";
 import { useTranslation } from "react-i18next";
+import { useSelector } from "react-redux";
 
 import { Button } from "popup/basics/buttons/Button";
 
@@ -9,8 +10,9 @@ import { AssetNetworkInfo } from "popup/components/accountHistory/AssetNetworkIn
 
 import { emitMetric } from "helpers/metrics";
 import { openTab } from "popup/helpers/navigate";
-import { stroopToXlm } from "helpers/stellar";
+import { stroopToXlm, isCustomNetwork } from "helpers/stellar";
 import { useAssetDomain } from "popup/helpers/useAssetDomain";
+import { settingsNetworkDetailsSelector } from "popup/ducks/settings";
 
 import { METRIC_NAMES } from "popup/constants/metricsNames";
 
@@ -71,6 +73,7 @@ export const TransactionDetail = ({
   const { assetDomain } = useAssetDomain({
     assetIssuer,
   });
+  const networkDetails = useSelector(settingsNetworkDetailsSelector);
 
   return assetIssuer && !assetDomain ? null : (
     <div className="TransactionDetail">
@@ -142,16 +145,18 @@ export const TransactionDetail = ({
           </div>
         </div>
       </div>
-      <Button
-        fullWidth
-        onClick={() => {
-          emitMetric(METRIC_NAMES.historyOpenItem);
-          openTab(externalUrl);
-        }}
-        variant={Button.variant.tertiary}
-      >
-        {t("View on")} stellar.expert
-      </Button>
+      {!isCustomNetwork(networkDetails) ? (
+        <Button
+          fullWidth
+          onClick={() => {
+            emitMetric(METRIC_NAMES.historyOpenItem);
+            openTab(externalUrl);
+          }}
+          variant={Button.variant.tertiary}
+        >
+          {t("View on")} stellar.expert
+        </Button>
+      ) : null}
     </div>
   );
 };

extension/src/popup/components/manageAssets/SearchAsset/index.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useCallback, useRef, useState } from "react";
 import { useSelector } from "react-redux";
-import { Link } from "react-router-dom";
+import { Link, Redirect } from "react-router-dom";
 import { Formik, Form, Field, FieldProps } from "formik";
 import { Input, Loader } from "@stellar/design-system";
 import debounce from "lodash/debounce";
@@ -13,7 +13,7 @@ import { FormRows } from "popup/basics/Forms";
 import { ROUTES } from "popup/constants/routes";
 
 import { settingsNetworkDetailsSelector } from "popup/ducks/settings";
-import { isTestnet } from "helpers/stellar";
+import { isCustomNetwork, isTestnet } from "helpers/stellar";
 
 import { SubviewHeader } from "popup/components/SubviewHeader";
 
@@ -137,6 +137,10 @@ export const SearchAsset = ({ setErrorAsset }: SearchAssetProps) => {
     setHasNoResults(!assetRows.length);
   }, [assetRows]);
 
+  if (isCustomNetwork(networkDetails)) {
+    return <Redirect to={ROUTES.addAsset} />;
+  }
+
   return (
     <Formik initialValues={initialValues} onSubmit={() => {}}>
       {({ dirty }) => (

extension/src/popup/components/manageNetwork/NetworkForm/index.tsx

@@ -14,7 +14,7 @@ import { ROUTES } from "popup/constants/routes";
 
 import { navigateTo } from "popup/helpers/navigate";
 import { isNetworkUrlValid as isNetworkUrlValidHelper } from "popup/helpers/account";
-import { isActiveNetwork } from "helpers/stellar";
+import { CUSTOM_NETWORK, isActiveNetwork } from "helpers/stellar";
 
 import {
   addCustomNetwork,
@@ -33,8 +33,6 @@ import { NetworkModal } from "../NetworkModal";
 
 import "./styles.scss";
 
-const CUSTOM_NETWORK = "CUSTOM";
-
 interface FormValues {
   networkName: string;
   networkPassphrase: string;
@@ -104,6 +102,17 @@ export const NetworkForm = ({ isEditing }: NetworkFormProps) => {
     setInvalidUrl(networkUrl);
   };
 
+  const getCustomNetworkDetailsFromFormValues = (values: FormValues) => {
+    const { networkName, networkUrl, networkPassphrase } = values;
+
+    return {
+      network: CUSTOM_NETWORK,
+      networkName,
+      networkUrl,
+      networkPassphrase,
+    };
+  };
+
   const handleEditNetwork = async (values: FormValues) => {
     if (!isNetworkUrlValidHelper(values.networkUrl)) {
       showNetworkUrlInvalidModal(values.networkUrl);
@@ -115,7 +124,7 @@ export const NetworkForm = ({ isEditing }: NetworkFormProps) => {
     } else {
       const res = await dispatch(
         editCustomNetwork({
-          networkDetails: { ...values, network: CUSTOM_NETWORK },
+          networkDetails: getCustomNetworkDetailsFromFormValues(values),
           networkIndex,
         }),
       );
@@ -133,10 +142,7 @@ export const NetworkForm = ({ isEditing }: NetworkFormProps) => {
 
     const addCustomNetworkRes = await dispatch(
       addCustomNetwork({
-        networkDetails: {
-          ...values,
-          network: CUSTOM_NETWORK,
-        },
+        networkDetails: getCustomNetworkDetailsFromFormValues(values),
       }),
     );
 

extension/src/popup/components/sendPayment/SendConfirm/TransactionDetails/index.tsx

@@ -14,6 +14,7 @@ import {
   xlmToStroop,
   getConversionRate,
   truncatedFedAddress,
+  isCustomNetwork,
 } from "helpers/stellar";
 import { getStellarExpertUrl } from "popup/helpers/account";
 import { AssetIcons } from "@shared/api/types";
@@ -259,6 +260,21 @@ export const TransactionDetails = ({ goBack }: { goBack: () => void }) => {
 
   const showMemo = !isSwap && !isMuxedAccount(destination);
 
+  const StellarExpertButton = () =>
+    !isCustomNetwork(networkDetails) ? (
+      <Button
+        fullWidth
+        variant={Button.variant.tertiary}
+        onClick={() =>
+          openTab(
+            `${getStellarExpertUrl(networkDetails)}/tx/${transactionHash}`,
+          )
+        }
+      >
+        {t("View on")} Stellar.expert
+      </Button>
+    ) : null;
+
   return (
     <>
       {hwStatus === HwOverlayStatus.IN_PROGRESS && <LedgerSign />}
@@ -374,19 +390,7 @@ export const TransactionDetails = ({ goBack }: { goBack: () => void }) => {
               t("The final amount is approximate and may change")}
           </div>
           {submission.submitStatus === ActionStatus.SUCCESS ? (
-            <Button
-              fullWidth
-              variant={Button.variant.tertiary}
-              onClick={() =>
-                openTab(
-                  `${getStellarExpertUrl(
-                    networkDetails,
-                  )}/tx/${transactionHash}`,
-                )
-              }
-            >
-              {t("View on")} Stellar.expert
-            </Button>
+            <StellarExpertButton />
           ) : (
             <div className="TransactionDetails__bottom-wrapper__buttons">
               <Button

extension/src/popup/views/ViewPublicKey/index.tsx

@@ -10,7 +10,7 @@ import { PillButton } from "popup/basics/buttons/PillButton";
 import { Button } from "popup/basics/buttons/Button";
 
 import { emitMetric } from "helpers/metrics";
-import { truncatedPublicKey } from "helpers/stellar";
+import { truncatedPublicKey, isCustomNetwork } from "helpers/stellar";
 
 import { METRIC_NAMES } from "popup/constants/metricsNames";
 import { openTab } from "popup/helpers/navigate";
@@ -29,7 +29,7 @@ export const ViewPublicKey = () => {
   const publicKey = useSelector(publicKeySelector);
   const accountName = useSelector(accountNameSelector);
   const [isEditingName, setIsEditingName] = useState(false);
-  const { network } = useSelector(settingsNetworkDetailsSelector);
+  const networkDetails = useSelector(settingsNetworkDetailsSelector);
 
   const EditNameButton = () => {
     const { submitForm } = useFormikContext();
@@ -137,18 +137,20 @@ export const ViewPublicKey = () => {
           </div>
         </div>
         <div className="ViewPublicKey__external-link">
-          <Button
-            fullWidth
-            variant={Button.variant.tertiary}
-            onClick={() => {
-              openTab(
-                `https://stellar.expert/explorer/${network.toLowerCase()}/account/${publicKey}`,
-              );
-              emitMetric(METRIC_NAMES.viewPublicKeyClickedStellarExpert);
-            }}
-          >
-            {t("View on")} stellar.expert
-          </Button>
+          {!isCustomNetwork(networkDetails) ? (
+            <Button
+              fullWidth
+              variant={Button.variant.tertiary}
+              onClick={() => {
+                openTab(
+                  `https://stellar.expert/explorer/${networkDetails.network.toLowerCase()}/account/${publicKey}`,
+                );
+                emitMetric(METRIC_NAMES.viewPublicKeyClickedStellarExpert);
+              }}
+            >
+              {t("View on")} stellar.expert
+            </Button>
+          ) : null}
         </div>
       </div>
     </>