chore: Yet more cleanup of dead code / cruft

README.md

@@ -18,7 +18,12 @@ See [CUSTOMIZE.md](./CUSTOMIZE.md) for details about adjusting the tokens and br
 
 ### Setup
 
+#### Configure
+
+You need a `projectId` from the WalletConnect Cloud to run the Hyperlane Warp Route UI. Sign up to [WalletConnect Cloud](https://cloud.walletconnect.com) to create a new project.
+
 #### Build
+
 ```sh
 # Install dependencies
 yarn
@@ -27,22 +32,14 @@ yarn
 yarn build
 ```
 
-#### Configure
-
-You need a `projectId` from the WalletConnect Cloud to run the Hyperlane Warp Route UI successfully. 
-Sign up to [WalletConnect Cloud](https://cloud.walletconnect.com/), create 
-new project with AppKit and Next.js and copy the `projectId` from there.
-
 ### Run
 
 You can add `.env.local` file next to `.env.example` where you set `projectId` copied from WalletConnect Cloud.
+
 ```sh
 # Start the Next dev server
 yarn dev
-```
-
-Or you can set the WalletConnect Cloud `projectId` to use as follows:
-```
+# Or with a custom projectId
 NEXT_PUBLIC_WALLET_CONNECT_ID=<projectId> yarn dev
 ```
 

package.json

@@ -22,7 +22,6 @@
     "@hyperlane-xyz/utils": "7.1.0",
     "@hyperlane-xyz/widgets": "7.1.0",
     "@interchain-ui/react": "^1.23.28",
-    "@metamask/jazzicon": "https://github.com/jmrossy/jazzicon#7a8df28974b4e81129bfbe3cab76308b889032a6",
     "@metamask/post-message-stream": "6.1.2",
     "@metamask/providers": "10.2.1",
     "@rainbow-me/rainbowkit": "^2.2.0",

src/consts/config.ts

@@ -6,17 +6,14 @@ const version = process?.env?.NEXT_PUBLIC_VERSION || '0.0.0';
 const registryUrl = process?.env?.NEXT_PUBLIC_REGISTRY_URL || undefined;
 const registryBranch = process?.env?.NEXT_PUBLIC_REGISTRY_BRANCH || undefined;
 const registryProxyUrl = process?.env?.NEXT_PUBLIC_GITHUB_PROXY || 'https://proxy.hyperlane.xyz';
-const explorerApiKeys = JSON.parse(process?.env?.EXPLORER_API_KEYS || '{}');
 const walletConnectProjectId = process?.env?.NEXT_PUBLIC_WALLET_CONNECT_ID || '';
-const withdrawalWhitelist = process?.env?.NEXT_PUBLIC_BLOCK_WITHDRAWAL_WHITELIST || '';
 const transferBlacklist = process?.env?.NEXT_PUBLIC_TRANSFER_BLACKLIST || '';
 const chainWalletWhitelists = JSON.parse(process?.env?.NEXT_PUBLIC_CHAIN_WALLET_WHITELISTS || '{}');
 
 interface Config {
   addressBlacklist: string[]; // A list of addresses that are blacklisted and cannot be used in the app
   chainWalletWhitelists: ChainMap<string[]>; // A map of chain names to a list of wallet names that work for it
   enableExplorerLink: boolean; // Include a link to the hyperlane explorer in the transfer modal
-  explorerApiKeys: Record<string, string>; // Optional map of API keys for block explorer
   isDevMode: boolean; // Enables some debug features in the app
   registryUrl: string | undefined; // Optional URL to use a custom registry instead of the published canonical version
   registryBranch?: string | undefined; // Optional customization of the registry branch instead of main
@@ -26,14 +23,12 @@ interface Config {
   transferBlacklist: string; // comma-separated list of routes between which transfers are disabled. Expects Caip2Id-Caip2Id (e.g. ethereum:1-sealevel:1399811149)
   version: string; // Matches version number in package.json
   walletConnectProjectId: string; // Project ID provided by walletconnect
-  withdrawalWhitelist: string; // comma-separated list of CAIP2 chain IDs to which transfers are supported
 }
 
 export const config: Config = Object.freeze({
   addressBlacklist: ADDRESS_BLACKLIST.map((address) => address.toLowerCase()),
   chainWalletWhitelists,
   enableExplorerLink: false,
-  explorerApiKeys,
   isDevMode,
   registryUrl,
   registryBranch,
@@ -43,5 +38,4 @@ export const config: Config = Object.freeze({
   version,
   transferBlacklist,
   walletConnectProjectId,
-  withdrawalWhitelist,
 });

src/features/transfer/TransfersDetailsModal.tsx

@@ -20,16 +20,16 @@ import { Color } from '../../styles/Color';
 import { formatTimestamp } from '../../utils/date';
 import { getHypExplorerLink } from '../../utils/links';
 import { logger } from '../../utils/logger';
+import { useMultiProvider } from '../chains/hooks';
+import { getChainDisplayName, hasPermissionlessChain } from '../chains/utils';
+import { tryFindToken, useWarpCore } from '../tokens/hooks';
+import { TransferContext, TransferStatus } from './types';
 import {
   getIconByTransferStatus,
   getTransferStatusLabel,
   isTransferFailed,
   isTransferSent,
-} from '../../utils/transfer';
-import { useMultiProvider } from '../chains/hooks';
-import { getChainDisplayName, hasPermissionlessChain } from '../chains/utils';
-import { tryFindToken, useWarpCore } from '../tokens/hooks';
-import { TransferContext, TransferStatus } from './types';
+} from './utils';
 
 export function TransfersDetailsModal({
   isOpen,

src/features/transfer/utils.ts

@@ -1,3 +1,69 @@
+import ConfirmedIcon from '../../images/icons/confirmed-icon.svg';
+import DeliveredIcon from '../../images/icons/delivered-icon.svg';
+import ErrorCircleIcon from '../../images/icons/error-circle.svg';
+import { FinalTransferStatuses, SentTransferStatuses, TransferStatus } from './types';
+
+export function getTransferStatusLabel(
+  status: TransferStatus,
+  connectorName: string,
+  isPermissionlessRoute: boolean,
+  isAccountReady: boolean,
+) {
+  let statusDescription = '...';
+  if (!isAccountReady && !FinalTransferStatuses.includes(status))
+    statusDescription = 'Please connect wallet to continue';
+  else if (status === TransferStatus.Preparing)
+    statusDescription = 'Preparing for token transfer...';
+  else if (status === TransferStatus.CreatingTxs) statusDescription = 'Creating transactions...';
+  else if (status === TransferStatus.SigningApprove)
+    statusDescription = `Sign approve transaction in ${connectorName} to continue.`;
+  else if (status === TransferStatus.ConfirmingApprove)
+    statusDescription = 'Confirming approve transaction...';
+  else if (status === TransferStatus.SigningTransfer)
+    statusDescription = `Sign transfer transaction in ${connectorName} to continue.`;
+  else if (status === TransferStatus.ConfirmingTransfer)
+    statusDescription = 'Confirming transfer transaction...';
+  else if (status === TransferStatus.ConfirmedTransfer)
+    if (!isPermissionlessRoute)
+      statusDescription = 'Transfer transaction confirmed, delivering message...';
+    else
+      statusDescription =
+        'Transfer confirmed, the funds will arrive when the message is delivered.';
+  else if (status === TransferStatus.Delivered)
+    statusDescription = 'Delivery complete, transfer successful!';
+  else if (status === TransferStatus.Failed)
+    statusDescription = 'Transfer failed, please try again.';
+
+  return statusDescription;
+}
+
+export function isTransferSent(status: TransferStatus) {
+  return SentTransferStatuses.includes(status);
+}
+
+export function isTransferFailed(status: TransferStatus) {
+  return status === TransferStatus.Failed;
+}
+
+export const STATUSES_WITH_ICON = [
+  TransferStatus.Delivered,
+  TransferStatus.ConfirmedTransfer,
+  TransferStatus.Failed,
+];
+
+export function getIconByTransferStatus(status: TransferStatus) {
+  switch (status) {
+    case TransferStatus.Delivered:
+      return DeliveredIcon;
+    case TransferStatus.ConfirmedTransfer:
+      return ConfirmedIcon;
+    case TransferStatus.Failed:
+      return ErrorCircleIcon;
+    default:
+      return ErrorCircleIcon;
+  }
+}
+
 import {
   ChainMap,
   CoreAddresses,

src/features/wallet/SideBarMenu.tsx

@@ -6,13 +6,13 @@ import { ChainLogo } from '../../components/icons/ChainLogo';
 import ArrowRightIcon from '../../images/icons/arrow-right.svg';
 import CollapseIcon from '../../images/icons/collapse-icon.svg';
 import ResetIcon from '../../images/icons/reset-icon.svg';
-import { getIconByTransferStatus, STATUSES_WITH_ICON } from '../../utils/transfer';
 import { useMultiProvider } from '../chains/hooks';
 import { getChainDisplayName } from '../chains/utils';
 import { useStore } from '../store';
 import { tryFindToken, useWarpCore } from '../tokens/hooks';
 import { TransfersDetailsModal } from '../transfer/TransfersDetailsModal';
 import { TransferContext } from '../transfer/types';
+import { getIconByTransferStatus, STATUSES_WITH_ICON } from '../transfer/utils';
 
 export function SideBarMenu({
   onClickConnectWallet,

yarn.lock

@@ -3958,7 +3958,6 @@ __metadata:
     "@hyperlane-xyz/utils": "npm:7.1.0"
     "@hyperlane-xyz/widgets": "npm:7.1.0"
     "@interchain-ui/react": "npm:^1.23.28"
-    "@metamask/jazzicon": "https://github.com/jmrossy/jazzicon#7a8df28974b4e81129bfbe3cab76308b889032a6"
     "@metamask/post-message-stream": "npm:6.1.2"
     "@metamask/providers": "npm:10.2.1"
     "@next/bundle-analyzer": "npm:^15.0.2"
@@ -4793,15 +4792,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/jazzicon@https://github.com/jmrossy/jazzicon#7a8df28974b4e81129bfbe3cab76308b889032a6":
-  version: 2.1.0
-  resolution: "@metamask/jazzicon@https://github.com/jmrossy/jazzicon.git#commit=7a8df28974b4e81129bfbe3cab76308b889032a6"
-  dependencies:
-    mersenne-twister: "npm:^1.1.0"
-  checksum: 10/5e56251b375eade58294334783fb37a15e8fd48d792f6dc93f7247b8897541324f9cf2d3f1d9b1cffdac1d932a8bc48a89dee7cdbd6e4a312ca2ff85df90131b
-  languageName: node
-  linkType: hard
-
 "@metamask/json-rpc-engine@npm:^7.0.0":
   version: 7.3.3
   resolution: "@metamask/json-rpc-engine@npm:7.3.3"
@@ -17646,13 +17636,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"mersenne-twister@npm:^1.1.0":
-  version: 1.1.0
-  resolution: "mersenne-twister@npm:1.1.0"
-  checksum: 10/1123526199091097102f2f91639ad7d5b3df4b098de9a4a72c835920e11ef0ce08e25737d5af1d363325a60da8804365eae8a41e03b7a46a1acc22e18fa8f261
-  languageName: node
-  linkType: hard
-
 "methods@npm:~1.1.2":
   version: 1.1.2
   resolution: "methods@npm:1.1.2"