Add withdrawalGateLearnMore to v1/env.json

Add telemetry log fn
Add useEnvFeatures to gate fetch when unsupported on env
2024-02-20 10:57:17 -08:00 · 2024-02-20 10:48:29 -08:00 · 2024-02-20 10:41:33 -08:00 · 2024-02-20 10:10:42 -08:00 · 2024-02-20 10:00:22 -08:00 · 2024-02-19 20:18:57 -08:00
39 changed files with 821 additions and 248 deletions
@@ -40,9 +40,9 @@
    "@cosmjs/proto-signing": "^0.32.1",
    "@cosmjs/stargate": "^0.32.1",
    "@cosmjs/tendermint-rpc": "^0.32.1",
-    "@dydxprotocol/v4-abacus": "^1.4.5",
+    "@dydxprotocol/v4-abacus": "^1.4.6",
    "@dydxprotocol/v4-client-js": "^1.0.20",
-    "@dydxprotocol/v4-localization": "^1.1.30",
+    "@dydxprotocol/v4-localization": "^1.1.31",
    "@ethersproject/providers": "^5.7.2",
    "@js-joda/core": "^5.5.3",
    "@radix-ui/react-accordion": "^1.1.2",
@@ -26,14 +26,14 @@ dependencies:
    specifier: ^0.32.1
    version: 0.32.2
  '@dydxprotocol/v4-abacus':
-    specifier: ^1.4.5
-    version: 1.4.5
+    specifier: ^1.4.6
+    version: 1.4.6
  '@dydxprotocol/v4-client-js':
    specifier: ^1.0.20
    version: 1.0.20
  '@dydxprotocol/v4-localization':
-    specifier: ^1.1.30
-    version: 1.1.30
+    specifier: ^1.1.31
+    version: 1.1.31
  '@ethersproject/providers':
    specifier: ^5.7.2
    version: 5.7.2
@@ -1286,8 +1286,8 @@ packages:
    resolution: {integrity: sha512-Gg5t+eR7vPJMAmhkFt6CZrzPd0EKpAslWwk5rFVYZpJsM8JG5KT9XQ99hgNM3Ov6ScNoIWbXkpX27F6A9cXR4Q==}
    dev: false

-  /@dydxprotocol/v4-abacus@1.4.5:
-    resolution: {integrity: sha512-LhJmpIaUkHCsSiHx+jdk+59euvGp2E+gGFelpfmOYpH1+enZgEXDQvWsgHSFEQxYP3mRiGG4uo+ZYNGdvffg7g==}
+  /@dydxprotocol/v4-abacus@1.4.6:
+    resolution: {integrity: sha512-qYq+4TizcMMxYVXckn0LCucWBe5N9ZNtD1XnowCAuBUUifHSgMGvao5OeZIKMgNM/udSKOXLss4zLy6dH/G2SA==}
    dev: false

  /@dydxprotocol/v4-client-js@1.0.20:
@@ -1319,8 +1319,8 @@ packages:
      - utf-8-validate
    dev: false

-  /@dydxprotocol/v4-localization@1.1.30:
-    resolution: {integrity: sha512-TZfWWRSOxcjLHs972wlJVVHkE7+DVqAUnGZSs24HYHsPtUkPhZiNXMOA2Vk9YddQxumhM79xIRH0cmJSe5DDUg==}
+  /@dydxprotocol/v4-localization@1.1.31:
+    resolution: {integrity: sha512-plJVIgFAKq9/hA/gk5GgKgCQFsH3pNtDWfG/yHLDXyiGX0M0mMEi1bTNVs4podFVoHJu1nSL9YPFlpJ00FteGw==}
    dev: false

  /@dydxprotocol/v4-proto@4.0.0-dev.0:
@@ -1,12 +1,22 @@
 [
-    {
-        "chainId": "1",
-        "tokenAddress": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
-        "name": "Ethereum"
-    },
-    {
-        "chainId": "5",
-        "tokenAddress": "0x07865c6E87B9F70255377e024ace6630C1Eaa37F",
-        "name": "Ethereum Goerli"
-    }
-]
+  {
+    "chainId": "1",
+    "tokenAddress": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+    "name": "Ethereum"
+  },
+  {
+    "chainId": "5",
+    "tokenAddress": "0x07865c6E87B9F70255377e024ace6630C1Eaa37F",
+    "name": "Ethereum Goerli"
+  },
+  {
+    "chainId": "43114",
+    "tokenAddress": "0xB97EF9Ef8734C71904D8002F8b6Bc66Dd9c48a6E",
+    "name": "Avalanche"
+  },
+  {
+    "chainId": "10",
+    "tokenAddress": "0x0b2C639c533813f4Aa9D7837CAf62653d097Ff85",
+    "name": "optimism"
+  }
+]
@@ -98,7 +98,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -126,7 +127,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-dev-2": {
@@ -182,7 +184,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -210,7 +213,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-dev-4": {
@@ -267,7 +271,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -295,7 +300,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-dev-5": {
@@ -351,7 +357,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -379,7 +386,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-staging": {
@@ -437,7 +445,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -465,7 +474,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-staging-forced-update": {
@@ -514,7 +524,8 @@
            "community": "https://discord.com/invite/dydx",
            "feedback": "https://docs.google.com/forms/d/e/1FAIpQLSezLsWCKvAYDEb7L-2O4wOON1T56xxro9A2Azvl6IxXHP_15Q/viewform",
            "blogs": "https://www.dydx.foundation/blog",
-            "newMarketProposalLearnMore": "https://dydx.exchange/blog/new-market-proposals"
+            "newMarketProposalLearnMore": "https://dydx.exchange/blog/new-market-proposals",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -549,7 +560,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-staging-west": {
@@ -607,7 +619,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -635,7 +648,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet": {
@@ -697,7 +711,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -725,7 +740,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-dydx": {
@@ -784,7 +800,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -812,7 +829,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-nodefleet": {
@@ -871,7 +889,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -899,7 +918,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-kingnodes": {
@@ -958,7 +978,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -986,7 +1007,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-liquify": {
@@ -1045,7 +1067,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -1073,7 +1096,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-polkachu": {
@@ -1123,7 +1147,8 @@
            "community": "https://discord.com/invite/dydx",
            "feedback": "https://docs.google.com/forms/d/e/1FAIpQLSezLsWCKvAYDEb7L-2O4wOON1T56xxro9A2Azvl6IxXHP_15Q/viewform",
            "blogs": "https://www.dydx.foundation/blog",
-            "newMarketProposalLearnMore": "https://dydx.exchange/blog/new-market-proposals"
+            "newMarketProposalLearnMore": "https://dydx.exchange/blog/new-market-proposals",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -1151,7 +1176,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-bware": {
@@ -1210,7 +1236,8 @@
            "keplrDashboard": "https://testnet.keplr.app/",
            "strideZoneApp": "https://testnet.stride.zone",
            "accountExportLearnmore": "https://help.dydx.exchange",
-            "walletLearnmore": "https://www.dydx.academy/video/defi-wallet"
+            "walletLearnmore": "https://www.dydx.academy/video/defi-wallet",
+            "withdrawalGateLearnMore": "https://help.dydx.exchange"
         },
         "wallets": {
            "walletconnect": {
@@ -1238,7 +1265,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-mainnet": {
@@ -1297,7 +1325,8 @@
            "keplrDashboard": "[HTTP link to keplr dashboard, can be null]",
            "strideZoneApp": "[HTTP link to stride zone app, can be null]",
            "accountExportLearnMore": "[HTTP link to account export learn more, can be null]",
-            "walletLearnMore": "[HTTP link to wallet learn more, can be null]"
+            "walletLearnMore": "[HTTP link to wallet learn more, can be null]",
+            "withdrawalGateLearnMore": "[HTTP link to withdrawal gate learn more, can be null]"
         },
         "wallets": {
            "walletconnect": {
@@ -1325,8 +1354,9 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": false
         }
      }
   }
-}
+}
@@ -71,7 +71,8 @@
         "keplrDashboard": "https://testnet.keplr.app/",
         "strideZoneApp": "https://testnet.stride.zone",
         "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-         "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+         "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+         "withdrawalGateLearnMore": "https://help.dydx.exchange"
      },
      "dydx-testnet-4": {
         "tos": "https://dydx.exchange/v4-terms",
@@ -92,7 +93,8 @@
         "keplrDashboard": "https://testnet.keplr.app/",
         "strideZoneApp": "https://testnet.stride.zone",
         "accountExportLearnMore": "https://help.dydx.exchange/en/articles/8565867-secret-phrase-on-dydx-chain",
-         "walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
+         "walletLearnMore": "https://www.dydx.academy/video/defi-wallet",
+         "withdrawalGateLearnMore": "https://help.dydx.exchange"
      },
      "[mainnet chain id]": {
         "tos": "[HTTP link to TOS]",
@@ -113,7 +115,8 @@
         "keplrDashboard": "[HTTP link to keplr dashboard, can be null]",
         "strideZoneApp": "[HTTP link to stride zone app, can be null]",
         "accountExportLearnMore": "[HTTP link to account export learn more, can be null]",
-         "walletLearnMore": "[HTTP link to wallet learn more, can be null]"
+         "walletLearnMore": "[HTTP link to wallet learn more, can be null]",
+         "withdrawalGateLearnMore": "[HTTP link to withdrawal gate learn more, can be null]"
      }
   },
   "wallets": {
@@ -258,7 +261,8 @@
            "faucet": "https://faucet.v4dev.dydx.exchange"
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-dev-2": {
@@ -283,7 +287,8 @@
            "nobleValidator": "https://noble-testnet-rpc.polkachu.com/"
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-dev-4": {
@@ -309,7 +314,8 @@
            "faucet": "https://faucet.v4dev4.dydx.exchange"
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-dev-5": {
@@ -334,7 +340,8 @@
            "nobleValidator": "https://noble-testnet-rpc.polkachu.com/"
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-staging": {
@@ -360,7 +367,8 @@
            "nobleValidator": "https://noble-testnet-rpc.polkachu.com/"
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-staging-forced-update": {
@@ -393,7 +401,8 @@
            }
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-staging-west": {
@@ -419,7 +428,8 @@
            "nobleValidator": "https://noble-testnet-rpc.polkachu.com/"
         },
         "featureFlags": {
-            "reduceOnlySupported": true
+            "reduceOnlySupported": true,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet": {
@@ -449,7 +459,8 @@
            "faucet": "https://faucet.v4testnet.dydx.exchange"
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-dydx": {
@@ -475,7 +486,8 @@
            "faucet": "https://faucet.v4testnet.dydx.exchange"
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-nodefleet": {
@@ -501,7 +513,8 @@
            "faucet": "https://faucet.v4testnet.dydx.exchange"
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-kingnodes": {
@@ -527,7 +540,8 @@
            "faucet": "https://faucet.v4testnet.dydx.exchange"
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-liquify": {
@@ -553,7 +567,8 @@
            "faucet": "https://faucet.v4testnet.dydx.exchange"
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-polkachu": {
@@ -579,7 +594,8 @@
            "faucet": "https://faucet.v4testnet.dydx.exchange"
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-testnet-bware": {
@@ -605,7 +621,8 @@
            "faucet": "https://faucet.v4testnet.dydx.exchange"
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": true
         }
      },
      "dydxprotocol-mainnet": {
@@ -631,8 +648,9 @@
            "nobleValidator": "[noble validator endpoint for mainnet]"
         },
         "featureFlags": {
-            "reduceOnlySupported": false
+            "reduceOnlySupported": false,
+            "withdrawalSafetyEnabled": false
         }
      }
   }
-}
+}
@@ -7,7 +7,12 @@ type ElementProps = {
  onClick?: () => void;
 };

+type StyleProps = {
+  className?: string;
+};
+
 export const BackButton = ({
+  className,
  onClick = () => {
    // @ts-ignore
    const navigation = globalThis.navigation;
@@ -21,8 +26,9 @@ export const BackButton = ({
      navigation.navigate('/', { replace: true });
    }
  },
-}: ElementProps) => (
+}: ElementProps & StyleProps) => (
  <IconButton
+    className={className}
    onClick={onClick}
    iconName={IconName.ChevronLeft}
    size={ButtonSize.Small}
@@ -47,6 +47,7 @@ type StyleProps = {
  hasHeaderBorder?: boolean;
  children?: React.ReactNode;
  className?: string;
+  stacked?: boolean;
  withAnimation?: boolean;
 };

@@ -81,6 +82,7 @@ export const Dialog = ({
  slotTrigger,
  slotHeaderInner,
  slotFooter,
+  stacked,
  withClose = true,
  placement = DialogPlacement.Default,
  portalContainer,
@@ -109,27 +111,48 @@ export const Dialog = ({
              e.preventDefault();
            }
          }}
+          $stacked={stacked}
          $withAnimation={withAnimation}
        >
-          <Styled.Header $withBorder={hasHeaderBorder}>
-            <Styled.HeaderTopRow>
-              {onBack && <BackButton onClick={onBack} />}
+          {stacked ? (
+            <Styled.StackedHeaderTopRow $withBorder={hasHeaderBorder}>
+              {onBack && <Styled.BackButton onClick={onBack} />}

-              {slotIcon && <Styled.Icon>{slotIcon}</Styled.Icon>}
-
-              {title && <Styled.Title>{title}</Styled.Title>}
+              {slotIcon}

              {!preventClose && withClose && (
-                <Styled.Close ref={closeButtonRef}>
+                <Styled.Close ref={closeButtonRef} $absolute={stacked}>
                  <Icon iconName={IconName.Close} />
                </Styled.Close>
              )}
-            </Styled.HeaderTopRow>

-            {description && <Styled.Description>{description}</Styled.Description>}
+              {title && <Styled.Title>{title}</Styled.Title>}

-            {slotHeaderInner}
-          </Styled.Header>
+              {description && <Styled.Description>{description}</Styled.Description>}
+
+              {slotHeaderInner}
+            </Styled.StackedHeaderTopRow>
+          ) : (
+            <Styled.Header $withBorder={hasHeaderBorder}>
+              <Styled.HeaderTopRow>
+                {onBack && <BackButton onClick={onBack} />}
+
+                {slotIcon && <Styled.Icon>{slotIcon}</Styled.Icon>}
+
+                {title && <Styled.Title>{title}</Styled.Title>}
+
+                {!preventClose && withClose && (
+                  <Styled.Close ref={closeButtonRef}>
+                    <Icon iconName={IconName.Close} />
+                  </Styled.Close>
+                )}
+              </Styled.HeaderTopRow>
+
+              {description && <Styled.Description>{description}</Styled.Description>}
+
+              {slotHeaderInner}
+            </Styled.Header>
+          )}

          <Styled.Content>{children}</Styled.Content>

@@ -173,7 +196,11 @@ Styled.Overlay = styled(Overlay)`
  }
 `;

-Styled.Container = styled(Content)<{ placement: DialogPlacement; $withAnimation?: boolean }>`
+Styled.Container = styled(Content)<{
+  placement: DialogPlacement;
+  $stacked?: boolean;
+  $withAnimation?: boolean;
+}>`
  /* Params */
  --dialog-inset: 1rem;
  --dialog-width: 30rem;
@@ -353,6 +380,13 @@ Styled.Container = styled(Content)<{ placement: DialogPlacement; $withAnimation?
        bottom: 0;
      `,
    }[placement])}
+
+  ${({ $stacked }) =>
+    $stacked &&
+    css`
+      justify-content: center;
+      text-align: center;
+    `}
 `;

 Styled.Header = styled.header<{ $withBorder: boolean }>`
@@ -379,9 +413,21 @@ Styled.HeaderTopRow = styled.div`
  gap: var(--dialog-title-gap);
 `;

-Styled.HeaderTopRow = styled.div`
-  ${layoutMixins.row}
-  gap: var(--dialog-title-gap);
+Styled.StackedHeaderTopRow = styled.div<{ $withBorder: boolean }>`
+  ${layoutMixins.flexColumn}
+  align-items: center;
+  justify-content: center;
+  padding: var(--dialog-header-paddingTop) var(--dialog-header-paddingLeft)
+    var(--dialog-header-paddingBottom) var(--dialog-header-paddingRight);
+  border-top-left-radius: inherit;
+  border-top-right-radius: inherit;
+
+  ${({ $withBorder }) =>
+    $withBorder &&
+    css`
+      ${layoutMixins.withOuterBorder};
+      background: var(--dialog-backgroundColor);
+    `};
 `;

 Styled.Content = styled.div`
@@ -412,7 +458,7 @@ Styled.Icon = styled.div`
  line-height: 1;
 `;

-Styled.Close = styled(Close)`
+Styled.Close = styled(Close)<{ $absolute?: boolean }>`
  width: 0.7813rem;
  height: 0.7813rem;

@@ -438,6 +484,14 @@ Styled.Close = styled(Close)`
    color: var(--color-text-2);
  }

+  ${({ $absolute }) =>
+    $absolute &&
+    css`
+      position: absolute;
+      right: var(--dialog-header-paddingRight);
+      top: var(--dialog-header-paddingTop);
+    `}
+
  @media ${breakpoints.tablet} {
    width: 1rem;
    height: 1rem;
@@ -445,6 +499,12 @@ Styled.Close = styled(Close)`
  }
 `;

+Styled.BackButton = styled(BackButton)`
+  position: absolute;
+  left: var(--dialog-header-paddingLeft);
+  top: var(--dialog-header-paddingTop);
+`;
+
 Styled.Title = styled(Title)`
  flex: 1;

@@ -39,7 +39,7 @@ export const SearchSelectMenu = ({
  disabled,
  label,
  items,
-  withSearch,
+  withSearch = true,
  withReceiptItems,
 }: SearchSelectMenuProps) => {
  const [open, setOpen] = useState(false);
@@ -77,6 +77,7 @@ export const SearchSelectMenu = ({
            withSearch={withSearch}
            onItemSelected={() => setOpen(false)}
            withStickyLayout
+            $withSearch={withSearch}
          />
        </Styled.Popover>
      </Styled.WithDetailsReceipt>
@@ -127,7 +128,7 @@ Styled.Popover = styled(Popover)`
  box-shadow: none;
 `;

-Styled.ComboboxMenu = styled(ComboboxMenu)`
+Styled.ComboboxMenu = styled(ComboboxMenu)<{ $withSearch?: boolean }>`
  ${layoutMixins.withInnerHorizontalBorders}

  --comboboxMenu-backgroundColor: var(--color-layer-4);
@@ -140,7 +141,8 @@ Styled.ComboboxMenu = styled(ComboboxMenu)`
  --comboboxMenu-item-checked-textColor: var(--color-text-2);
  --comboboxMenu-item-highlighted-textColor: var(--color-text-2);

-  --stickyArea1-topHeight: var(--form-input-height);
+  --stickyArea1-topHeight: ${({ $withSearch }) =>
+    !$withSearch ? '0' : 'var(--form-input-height)'};

  input:focus-visible {
    outline: none;
@@ -1,4 +1,4 @@
-import { type ReactNode, useState } from 'react';
+import { type ReactNode, useState, useEffect } from 'react';

 import { ButtonAction, ButtonState } from '@/constants/buttons';
 import { STRING_KEYS } from '@/constants/localization';
@@ -8,6 +8,7 @@ import { Button, type ButtonStateConfig, type ButtonProps } from '@/components/B

 type ElementProps = {
  timeoutInSeconds: number;
+  onTimeOut?: () => void;
  slotFinal?: ReactNode;
 } & ButtonProps;

@@ -16,6 +17,7 @@ export type TimeoutButtonProps = ElementProps;
 export const TimeoutButton = ({
  children,
  timeoutInSeconds,
+  onTimeOut,
  slotFinal,
  ...otherProps
 }: TimeoutButtonProps) => {
@@ -25,6 +27,11 @@ export const TimeoutButton = ({

  const secondsLeft = Math.max(0, (timeoutDeadline - now) / 1000);

+  useEffect(() => {
+    if (secondsLeft > 0) return;
+    onTimeOut?.();
+  }, [secondsLeft]);
+
  if (slotFinal && secondsLeft <= 0) return slotFinal;

  return (
@@ -144,9 +144,17 @@ export type AnalyticsEventData<T extends AnalyticsEvent> =
        validatorUrl: string;
      }
    : T extends AnalyticsEvent.TransferDeposit
-    ? {}
+    ? {
+        chainId?: string;
+        tokenAddress?: string;
+        tokenSymbol?: string;
+      }
    : T extends AnalyticsEvent.TransferWithdraw
-    ? {}
+    ? {
+        chainId?: string;
+        tokenAddress?: string;
+        tokenSymbol?: string;
+      }
    : // Trading
    T extends AnalyticsEvent.TradeOrderTypeSelected
    ? {
@@ -9,8 +9,11 @@ export enum DialogTypes {
  FillDetails = 'FillDetails',
  Help = 'Help',
  ExternalNavKeplr = 'ExternalNavKeplr',
+  ManageFunds = 'ManageFunds',
  MnemonicExport = 'MnemonicExport',
  MobileSignIn = 'MobileSignIn',
+  NewMarketAgreement = 'NewMarketAgreement',
+  NewMarketMessageDetails = 'NewMarketMessageDetails',
  Onboarding = 'Onboarding',
  OrderDetails = 'OrderDetails',
  Preferences = 'Preferences',
@@ -20,9 +23,7 @@ export enum DialogTypes {
  Trade = 'Trade',
  Transfer = 'Transfer',
  Withdraw = 'Withdraw',
-  ManageFunds = 'ManageFunds',
-  NewMarketMessageDetails = 'NewMarketMessageDetails',
-  NewMarketAgreement = 'NewMarketAgreement',
+  WithdrawalGated = 'WithdrawalGated',
 }

 export enum TradeBoxDialogTypes {
@@ -140,6 +140,7 @@ export type TransferNotifcation = {
  isCctp?: boolean;
  errorCount?: number;
  status?: StatusResponse;
+  isExchange?: boolean;
 };

 /**
@@ -7,6 +7,7 @@ import { useDebounce } from './useDebounce';
 import { useInterval } from './useInterval';
 import { useDocumentTitle } from './useDocumentTitle';
 import { useDydxClient } from './useDydxClient';
+import { useEnvFeatures } from './useEnvFeatures';
 import { useGovernanceVariables } from './useGovernanceVariables';
 import { useAccountBalance } from './useAccountBalance';
 import { useAccounts } from './useAccounts';
@@ -26,6 +27,7 @@ import { useStringGetter } from './useStringGetter';
 import { useSubaccount } from './useSubaccount';
 import { useTradeFormInputs } from './useTradeFormInputs';
 import { useURLConfigs } from './useURLConfigs';
+import { useWithdrawalInfo } from './useWithdrawalInfo';

 export {
  useApiState,
@@ -36,6 +38,7 @@ export {
  useDebounce,
  useDocumentTitle,
  useDydxClient,
+  useEnvFeatures,
  useGovernanceVariables,
  useAccountBalance,
  useAccounts,
@@ -56,4 +59,5 @@ export {
  useSubaccount,
  useTradeFormInputs,
  useURLConfigs,
+  useWithdrawalInfo,
 };
@@ -251,6 +251,17 @@ const useDydxClientContext = () => {
    [compositeClient]
  );

+  const getWithdrawalAndTransferGatingStatus = useCallback(async () => {
+    return await compositeClient?.validatorClient.get.GetWithdrawalAndTransferGatingStatus();
+  }, [compositeClient]);
+
+  const getWithdrawalCapacityByDenom = useCallback(
+    async ({ denom }: { denom: string }) => {
+      return await compositeClient?.validatorClient.get.getWithdrawalCapacityByDenom(denom);
+    },
+    [compositeClient]
+  );
+
  return {
    // Client initialization
    connect: setNetworkConfig,
@@ -267,5 +278,7 @@ const useDydxClientContext = () => {
    requestAllGovernanceProposals,
    getCandlesForDatafeed,
    screenAddresses,
+    getWithdrawalAndTransferGatingStatus,
+    getWithdrawalCapacityByDenom,
  };
 };
@@ -0,0 +1,15 @@
+import { useSelector } from 'react-redux';
+
+import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks';
+
+import { getSelectedNetwork } from '@/state/appSelectors';
+
+export interface EnvironmentFeatures {
+  reduceOnlySupported: boolean;
+  withdrawalSafetyEnabled: boolean;
+}
+
+export const useEnvFeatures = (): EnvironmentFeatures => {
+  const selectedNetwork = useSelector(getSelectedNetwork);
+  return ENVIRONMENT_CONFIG_MAP[selectedNetwork].featureFlags;
+};
@@ -82,24 +82,30 @@ const useLocalNotificationsContext = () => {
              isCctp,
              errorCount,
              status: currentStatus,
+              isExchange,
            } = transferNotification;

-            // @ts-ignore status.errors is not in the type definition but can be returned
-            // also error can some time come back as an empty object so we need to ignore for that
-            const hasErrors = !!currentStatus?.errors || 
-                 (currentStatus?.error && Object.keys(currentStatus.error).length !== 0);
+            const hasErrors =
+              // @ts-ignore status.errors is not in the type definition but can be returned
+              // also error can some time come back as an empty object so we need to ignore for that
+              !!currentStatus?.errors ||
+              (currentStatus?.error && Object.keys(currentStatus.error).length !== 0);

            if (
+              !isExchange &&
              !hasErrors &&
              (!currentStatus?.squidTransactionStatus ||
                currentStatus?.squidTransactionStatus === 'ongoing')
            ) {
              try {
-                const status = await fetchSquidStatus({
-                  transactionId: txHash,
-                  toChainId,
-                  fromChainId,
-                }, isCctp);
+                const status = await fetchSquidStatus(
+                  {
+                    transactionId: txHash,
+                    toChainId,
+                    fromChainId,
+                  },
+                  isCctp
+                );

                if (status) {
                  transferNotification.status = status;
@@ -179,8 +179,9 @@ export const notificationTypes: NotificationTypeConfig[] = [

      useEffect(() => {
        for (const transfer of transferNotifications) {
-          const { fromChainId, status, txHash, toAmount, type } = transfer;
-          const isFinished = Boolean(status) && status?.squidTransactionStatus !== 'ongoing';
+          const { fromChainId, status, txHash, toAmount, type, isExchange } = transfer;
+          const isFinished =
+            (Boolean(status) && status?.squidTransactionStatus !== 'ongoing') || isExchange;
          const icon = <Icon iconName={isFinished ? IconName.Transfer : IconName.Clock} />;

          const transferType =
@@ -27,6 +27,7 @@ export interface LinksConfigs {
  strideZoneApp?: string;
  accountExportLearnMore?: string;
  walletLearnMore?: string;
+  withdrawalGateLearnMore?: string;
 }

 export const useURLConfigs = (): LinksConfigs => {
@@ -54,5 +55,6 @@ export const useURLConfigs = (): LinksConfigs => {
    strideZoneApp: linksConfigs.strideZoneApp || FALLBACK_URL,
    accountExportLearnMore: linksConfigs.accountExportLearnMore || FALLBACK_URL,
    walletLearnMore: linksConfigs.walletLearnMore || FALLBACK_URL,
+    withdrawalGateLearnMore: linksConfigs.withdrawalGateLearnMore || FALLBACK_URL,
  };
 };
@@ -0,0 +1,131 @@
+import { useEffect, useMemo } from 'react';
+import { useQuery } from 'react-query';
+import BigNumber from 'bignumber.js';
+import { encodeJson } from '@dydxprotocol/v4-client-js';
+import { ByteArrayEncoding } from '@dydxprotocol/v4-client-js/build/src/lib/helpers';
+import { shallowEqual, useDispatch, useSelector } from 'react-redux';
+
+import { DialogTypes } from '@/constants/dialogs';
+import { isMainnet } from '@/constants/networks';
+import { useEnvFeatures } from './useEnvFeatures';
+
+import { getApiState } from '@/state/appSelectors';
+import { closeDialog, openDialog } from '@/state/dialogs';
+import { getSelectedLocale } from '@/state/localizationSelectors';
+
+import { formatRelativeTime } from '@/lib/dateTime';
+import { BIG_NUMBERS, MustBigNumber } from '@/lib/numbers';
+import { log } from '@/lib/telemetry';
+
+import { useDydxClient } from './useDydxClient';
+import { useTokenConfigs } from './useTokenConfigs';
+
+const BLOCK_TIME = isMainnet ? 1_000 : 1_500;
+
+export const useWithdrawalInfo = ({
+  transferType,
+}: {
+  transferType: 'withdrawal' | 'transfer';
+}) => {
+  const { getWithdrawalAndTransferGatingStatus, getWithdrawalCapacityByDenom } = useDydxClient();
+  const { usdcDenom, usdcDecimals } = useTokenConfigs();
+  const apiState = useSelector(getApiState, shallowEqual);
+  const { height } = apiState || {};
+  const selectedLocale = useSelector(getSelectedLocale);
+  const dispatch = useDispatch();
+  const { withdrawalSafetyEnabled } = useEnvFeatures();
+
+  const { data: usdcWithdrawalCapacity } = useQuery({
+    enabled: withdrawalSafetyEnabled,
+    queryKey: 'usdcWithdrawalCapacity',
+    queryFn: async () => {
+      try {
+        const response = await getWithdrawalCapacityByDenom({ denom: usdcDenom });
+        return JSON.parse(encodeJson(response, ByteArrayEncoding.BIGINT));
+      } catch (error) {
+        log('useWithdrawalInfo/getWithdrawalCapacityByDenom', error);
+      }
+    },
+    refetchInterval: 60_000,
+    staleTime: 60_000,
+  });
+
+  const { data: withdrawalAndTransferGatingStatus } = useQuery({
+    enabled: withdrawalSafetyEnabled,
+    queryKey: 'withdrawalTransferGateStatus',
+    queryFn: async () => {
+      try {
+        return await getWithdrawalAndTransferGatingStatus();
+      } catch (error) {
+        log('useWithdrawalInfo/getWithdrawalAndTransferGatingStatus', error);
+      }
+    },
+    refetchInterval: 60_000,
+    staleTime: 60_000,
+  });
+
+  const capacity = useMemo(() => {
+    const capacityList = usdcWithdrawalCapacity?.limiterCapacityList;
+    if (!capacityList || capacityList.length < 2) {
+      if (!withdrawalSafetyEnabled) {
+        return BigNumber(Infinity);
+      }
+
+      return BIG_NUMBERS.ZERO;
+    }
+
+    const [{ capacity: daily }, { capacity: weekly }] = capacityList;
+    const dailyBN = MustBigNumber(daily);
+    const weeklyBN = MustBigNumber(weekly);
+    return BigNumber.minimum(dailyBN, weeklyBN).div(10 ** usdcDecimals);
+  }, [usdcDecimals, usdcWithdrawalCapacity]);
+
+  const withdrawalAndTransferGatingStatusValue = useMemo(() => {
+    const { withdrawalsAndTransfersUnblockedAtBlock } = withdrawalAndTransferGatingStatus ?? {};
+    if (
+      height &&
+      withdrawalsAndTransfersUnblockedAtBlock &&
+      height < withdrawalsAndTransfersUnblockedAtBlock &&
+      withdrawalSafetyEnabled
+    ) {
+      return {
+        estimatedUnblockTime: formatRelativeTime(
+          Date.now() + (withdrawalsAndTransfersUnblockedAtBlock - height) * BLOCK_TIME,
+          {
+            locale: selectedLocale,
+            largestUnit: 'day',
+          }
+        ),
+        isGated: true,
+      };
+    }
+    return {
+      estimatedUnblockTime: null,
+      isGated: false,
+    };
+  }, [height, withdrawalAndTransferGatingStatus, withdrawalSafetyEnabled]);
+
+  useEffect(() => {
+    if (
+      withdrawalAndTransferGatingStatusValue.isGated &&
+      withdrawalAndTransferGatingStatusValue.estimatedUnblockTime &&
+      withdrawalSafetyEnabled
+    ) {
+      dispatch(closeDialog());
+      dispatch(
+        openDialog({
+          type: DialogTypes.WithdrawalGated,
+          dialogProps: {
+            transferType,
+            estimatedUnblockTime: withdrawalAndTransferGatingStatusValue.estimatedUnblockTime,
+          },
+        })
+      );
+    }
+  }, [transferType, withdrawalAndTransferGatingStatusValue.isGated, withdrawalSafetyEnabled]);
+
+  return {
+    usdcWithdrawalCapacity: capacity,
+    withdrawalAndTransferGatingStatus,
+  };
+};
@@ -11,26 +11,27 @@ import { DepositDialog } from '@/views/dialogs/DepositDialog';
 import { DisconnectDialog } from '@/views/dialogs/DisconnectDialog';
 import { DisplaySettingsDialog } from '@/views/dialogs/DisplaySettingsDialog';
 import { ExchangeOfflineDialog } from '@/views/dialogs/ExchangeOfflineDialog';
+import { ExternalNavStrideDialog } from '@/views/dialogs/ExternalNavStrideDialog';
 import { HelpDialog } from '@/views/dialogs/HelpDialog';
 import { ExternalLinkDialog } from '@/views/dialogs/ExternalLinkDialog';
 import { ExternalNavKeplrDialog } from '@/views/dialogs/ExternalNavKeplrDialog';
+import { ManageFundsDialog } from '@/views/dialogs/ManageFundsDialog';
 import { MnemonicExportDialog } from '@/views/dialogs/MnemonicExportDialog';
 import { MobileSignInDialog } from '@/views/dialogs/MobileSignInDialog';
+import { NewMarketAgreementDialog } from '@/views/dialogs/NewMarketAgreementDialog';
+import { NewMarketMessageDetailsDialog } from '@/views/dialogs/NewMarketMessageDetailsDialog';
 import { OnboardingDialog } from '@/views/dialogs/OnboardingDialog';
 import { PreferencesDialog } from '@/views/dialogs/PreferencesDialog';
 import { RateLimitDialog } from '@/views/dialogs/RateLimitDialog';
 import { RestrictedGeoDialog } from '@/views/dialogs/RestrictedGeoDialog';
+import { RestrictedWalletDialog } from '@/views/dialogs/RestrictedWalletDialog';
 import { TradeDialog } from '@/views/dialogs/TradeDialog';
 import { TransferDialog } from '@/views/dialogs/TransferDialog';
-import { RestrictedWalletDialog } from '@/views/dialogs/RestrictedWalletDialog';
 import { WithdrawDialog } from '@/views/dialogs/WithdrawDialog';
-import { ManageFundsDialog } from '@/views/dialogs/ManageFundsDialog';
+import { WithdrawalGateDialog } from '@/views/dialogs/WithdrawalGateDialog';

 import { OrderDetailsDialog } from '@/views/dialogs/DetailsDialog/OrderDetailsDialog';
 import { FillDetailsDialog } from '@/views/dialogs/DetailsDialog/FillDetailsDialog';
-import { NewMarketMessageDetailsDialog } from '@/views/dialogs/NewMarketMessageDetailsDialog';
-import { NewMarketAgreementDialog } from '@/views/dialogs/NewMarketAgreementDialog';
-import { ExternalNavStrideDialog } from '@/views/dialogs/ExternalNavStrideDialog';

 export const DialogManager = () => {
  const dispatch = useDispatch();
@@ -72,6 +73,7 @@ export const DialogManager = () => {
    [DialogTypes.Trade]: <TradeDialog {...modalProps} />,
    [DialogTypes.Transfer]: <TransferDialog {...modalProps} />,
    [DialogTypes.Withdraw]: <WithdrawDialog {...modalProps} />,
+    [DialogTypes.WithdrawalGated]: <WithdrawalGateDialog {...modalProps} />,
    [DialogTypes.ManageFunds]: <ManageFundsDialog {...modalProps} />,
    [DialogTypes.NewMarketMessageDetails]: <NewMarketMessageDetailsDialog {...modalProps} />,
    [DialogTypes.NewMarketAgreement]: <NewMarketAgreementDialog {...modalProps} />,
@@ -34,7 +34,7 @@ import {
 import { DEFAULT_TRANSACTION_MEMO } from '@/constants/analytics';
 import { DialogTypes } from '@/constants/dialogs';
 import { UNCOMMITTED_ORDER_TIMEOUT_MS } from '@/constants/trade';
-import { DydxNetwork, isTestnet } from '@/constants/networks';
+import { DydxChainId, isTestnet } from '@/constants/networks';

 import { RootStore } from '@/state/_store';
 import { addUncommittedOrderClientId, removeUncommittedOrderClientId } from '@/state/account';
@@ -44,7 +44,10 @@ import { StatefulOrderError } from '../errors';
 import { bytesToBigInt } from '../numbers';
 import { log } from '../telemetry';
 import { hashFromTx, getMintscanTxLink } from '../txUtils';
-import { getDydxChainIdFromNetwork } from '../network';
+
+(BigInt.prototype as any).toJSON = function () {
+  return this.toString();
+};

 class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
  private compositeClient: CompositeClient | undefined;
@@ -239,10 +242,7 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {

      if (isTestnet) {
        console.log(
-          getMintscanTxLink(
-            getDydxChainIdFromNetwork(this.compositeClient.network.getString() as DydxNetwork),
-            hash
-          )
+          getMintscanTxLink(this.compositeClient.network.getString() as DydxChainId, hash)
        );
      } else console.log(`txHash: ${hash}`);

@@ -538,7 +538,6 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
          const result = await this.cctpWithdraw(params);
          callback(result);
          break;
-          break;
        }
        default: {
          break;
@@ -25,3 +25,22 @@ export function convertBech32Address({
 }): string {
  return toBech32(bech32Prefix, fromHex(toHex(fromBech32(address).data)));
 }
+
+/**
+ * Validates a Cosmos address with a specific prefix.
+ * @param {string} address The Cosmos address to validate.
+ * @param {string} prefix The expected prefix for the address.
+ * @returns {boolean} True if the address is valid and matches the prefix, false otherwise.
+ */
+export function validateCosmosAddress(address: string, prefix: string) {
+  try {
+    // Decode the address to verify its structure and prefix
+    const { prefix: decodedPrefix } = fromBech32(address);
+
+    // Check if the decoded address has the expected prefix
+    return decodedPrefix === prefix;
+  } catch (error) {
+    // If decoding fails, the address is not valid
+    return false;
+  }
+}
@@ -1,8 +1,4 @@
 import { type DydxNetwork, ENVIRONMENT_CONFIG_MAP, type DydxChainId } from '@/constants/networks';

 export const validateAgainstAvailableEnvironments = (value: DydxNetwork) =>
-  Object.keys(ENVIRONMENT_CONFIG_MAP).includes(value);
-
-export const getDydxChainIdFromNetwork = (network: DydxNetwork) => {
-  return ENVIRONMENT_CONFIG_MAP[network].dydxChainId as DydxChainId;
-};
+  Object.keys(ENVIRONMENT_CONFIG_MAP).includes(value);
@@ -31,13 +31,13 @@ export const fetchSquidStatus = async (

  const response = await fetch(url, {
    headers: {
-      "x-integrator-id": integratorId || 'dYdX-api'
+      'x-integrator-id': integratorId || 'dYdX-api',
    },
  });

  if (!response.ok) {
    const error = await response.json();
-    throw new Error(error);
+    throw error;
  }

  return response.json();
@@ -45,4 +45,4 @@ export const fetchSquidStatus = async (

 export const getNobleChainId = () => {
  return isMainnet ? 'noble-1' : 'grand-1';
-}
+};
@@ -19,13 +19,17 @@ class TestFlags {
    return !!this.queryParams.displayinitializingmarkets;
  }

-  get addressOverride():string {
+  get addressOverride(): string {
    return this.queryParams.address;
  }
-  
+
  get showTradingRewards() {
    return !!this.queryParams.tradingrewards;
  }
+
+  get showCexWithdrawal() {
+    return !!this.queryParams.cexwithdrawal;
+  }
 }

 export const testFlags = new TestFlags();
@@ -0,0 +1,5 @@
+import { ThemeColorBase } from '@/constants/styles/colors';
+
+declare module 'styled-components' {
+  export interface DefaultTheme extends ThemeColorBase {}
+}
@@ -13,8 +13,6 @@ export const DepositDialog = ({ setIsOpen }: ElementProps) => {
  const stringGetter = useStringGetter();
  const { isMobile } = useBreakpoints();

-  const closeDialog = () => setIsOpen?.(false);
-
  return (
    <Dialog
      isOpen
@@ -22,7 +20,7 @@ export const DepositDialog = ({ setIsOpen }: ElementProps) => {
      title={stringGetter({ key: STRING_KEYS.DEPOSIT })}
      placement={isMobile ? DialogPlacement.FullScreen : DialogPlacement.Default}
    >
-      <DepositDialogContent onDeposit={closeDialog} />
+      <DepositDialogContent />
    </Dialog>
  );
 };
@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react';
 import styled, { type AnyStyledComponent } from 'styled-components';

 import { TransferInputField, TransferType } from '@/constants/abacus';
+import { AnalyticsEvent } from '@/constants/analytics';
 import { isMainnet } from '@/constants/networks';
 import { layoutMixins } from '@/styles/layoutMixins';

@@ -9,6 +10,7 @@ import { DepositForm } from '@/views/forms/AccountManagementForms/DepositForm';
 import { TestnetDepositForm } from '@/views/forms/AccountManagementForms/TestnetDepositForm';

 import abacusStateManager from '@/lib/abacus';
+import { track } from '@/lib/analytics';

 type ElementProps = {
  onDeposit?: () => void;
@@ -34,9 +36,19 @@ export const DepositDialogContent = ({ onDeposit }: ElementProps) => {
  return (
    <Styled.Content>
      {isMainnet || !showFaucet ? (
-        <DepositForm onDeposit={onDeposit} />
+        <DepositForm
+          onDeposit={(event) => {
+            track(AnalyticsEvent.TransferDeposit, event);
+            onDeposit?.();
+          }}
+        />
      ) : (
-        <TestnetDepositForm onDeposit={onDeposit} />
+        <TestnetDepositForm
+          onDeposit={() => {
+            track(AnalyticsEvent.TransferFaucet);
+            onDeposit?.();
+          }}
+        />
      )}
      {!isMainnet && (
        <Styled.TextToggle onClick={() => setShowFaucet(!showFaucet)}>
@@ -105,8 +105,8 @@ export const OnboardingDialog = ({ setIsOpen }: ElementProps) => {
              <Styled.Content>
                {isMainnet ? (
                  <DepositForm
-                    onDeposit={() => {
-                      track(AnalyticsEvent.TransferDeposit);
+                    onDeposit={(event) => {
+                      track(AnalyticsEvent.TransferDeposit, event);
                    }}
                  />
                ) : (
@@ -0,0 +1,101 @@
+import styled, { AnyStyledComponent } from 'styled-components';
+
+import { ButtonAction, ButtonType } from '@/constants/buttons';
+import { STRING_KEYS } from '@/constants/localization';
+import { useStringGetter, useURLConfigs } from '@/hooks';
+import { LinkOutIcon } from '@/icons';
+import { layoutMixins } from '@/styles/layoutMixins';
+
+import { Button } from '@/components/Button';
+import { Dialog } from '@/components/Dialog';
+import { Icon, IconName } from '@/components/Icon';
+
+type ElementProps = {
+  setIsOpen: (open: boolean) => void;
+  transferType: 'withdrawal' | 'transfer';
+  estimatedUnblockTime?: string | null;
+};
+
+export const WithdrawalGateDialog = ({
+  setIsOpen,
+  estimatedUnblockTime,
+  transferType,
+}: ElementProps) => {
+  const stringGetter = useStringGetter();
+  const { withdrawalGateLearnMore } = useURLConfigs();
+
+  return (
+    <Dialog
+      isOpen
+      stacked
+      setIsOpen={setIsOpen}
+      title={
+        {
+          withdrawal: stringGetter({ key: STRING_KEYS.WITHDRAWALS_PAUSED }),
+          transfer: stringGetter({ key: STRING_KEYS.TRANSFERS_PAUSED }),
+        }[transferType]
+      }
+      slotIcon={
+        <Styled.IconContainer>
+          <Styled.Icon iconName={IconName.Warning} />
+        </Styled.IconContainer>
+      }
+      slotFooter={
+        <Styled.ButtonRow>
+          <Button
+            type={ButtonType.Link}
+            action={ButtonAction.Secondary}
+            href={withdrawalGateLearnMore}
+          >
+            {stringGetter({ key: STRING_KEYS.LEARN_MORE })}
+            <LinkOutIcon />
+          </Button>
+          <Button action={ButtonAction.Primary} onClick={() => setIsOpen(false)}>
+            {stringGetter({ key: STRING_KEYS.CLOSE })}
+          </Button>
+        </Styled.ButtonRow>
+      }
+    >
+      <Styled.Content>
+        {stringGetter({
+          key: STRING_KEYS.WITHDRAWALS_PAUSED_DESC,
+          params: {
+            ESTIMATED_DURATION: estimatedUnblockTime,
+          },
+        })}
+      </Styled.Content>
+    </Dialog>
+  );
+};
+
+const Styled: Record<string, AnyStyledComponent> = {};
+
+Styled.IconContainer = styled.div`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  width: 4.5rem;
+  height: 4.5rem;
+  border-radius: 50%;
+  min-width: 4.5rem;
+  min-height: 4.5rem;
+  background-color: var(--color-gradient-warning);
+`;
+
+Styled.Icon = styled(Icon)`
+  color: var(--color-warning);
+  font-size: 2.5rem;
+  margin-bottom: 0.125rem;
+`;
+
+Styled.Content = styled.div`
+  ${layoutMixins.column}
+  gap: 1rem;
+`;
+
+Styled.ButtonRow = styled.div`
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 1rem;
+`;
@@ -7,6 +7,7 @@ import { Abi, parseUnits } from 'viem';
 import erc20 from '@/abi/erc20.json';
 import erc20_usdt from '@/abi/erc20_usdt.json';
 import { TransferInputField, TransferInputTokenResource, TransferType } from '@/constants/abacus';
+import { AnalyticsEvent, AnalyticsEventData } from '@/constants/analytics';
 import { AlertType } from '@/constants/alerts';
 import { ButtonSize } from '@/constants/buttons';
 import { STRING_KEYS } from '@/constants/localization';
@@ -48,7 +49,7 @@ import { DepositButtonAndReceipt } from './DepositForm/DepositButtonAndReceipt';
 import { NobleDeposit } from '../NobleDeposit';

 type DepositFormProps = {
-  onDeposit?: () => void;
+  onDeposit?: (event?: AnalyticsEventData<AnalyticsEvent.TransferDeposit>) => void;
  onError?: () => void;
 };

@@ -132,7 +133,7 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
    if (error) onError?.();
  }, [error]);

-  const onSelectChain = useCallback((name: string, type: 'chain' | 'exchange') => {
+  const onSelectNetwork = useCallback((name: string, type: 'chain' | 'exchange') => {
    if (name) {
      abacusStateManager.clearTransferInputValues();
      setFromAmount('');
@@ -258,8 +259,6 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
        };
        const txHash = await signerWagmi.sendTransaction(tx);

-        onDeposit?.();
-
        if (txHash) {
          addTransferNotification({
            txHash: txHash,
@@ -271,6 +270,12 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
          });
          abacusStateManager.clearTransferInputValues();
          setFromAmount('');
+
+          onDeposit?.({
+            chainId: chainIdStr || undefined,
+            tokenAddress: sourceToken?.address || undefined,
+            tokenSymbol: sourceToken?.symbol || undefined,
+          });
        }
      } catch (error) {
        log('DepositForm/onSubmit', error);
@@ -279,7 +284,7 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
        setIsLoading(false);
      }
    },
-    [requestPayload, signerWagmi, chainId]
+    [requestPayload, signerWagmi, chainId, sourceToken, sourceChain]
  );

  const amountInputReceipt = [
@@ -378,7 +383,7 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
      <SourceSelectMenu
        selectedChain={chainIdStr || undefined}
        selectedExchange={exchange || undefined}
-        onSelect={onSelectChain}
+        onSelect={onSelectNetwork}
      />
      {exchange && nobleAddress ? (
        <NobleDeposit />
@@ -14,6 +14,7 @@ import { popoverMixins } from '@/styles/popoverMixins';
 import { getTransferInputs } from '@/state/inputsSelectors';

 import { isTruthy } from '@/lib/isTruthy';
+import { testFlags } from '@/lib/testFlags';

 type ElementProps = {
  label?: string;
@@ -62,11 +63,12 @@ export const SourceSelectMenu = ({
  return (
    <SearchSelectMenu
      items={[
-        exchangeItems.length > 0 && {
-          group: 'exchanges',
-          groupLabel: stringGetter({ key: STRING_KEYS.EXCHANGES }),
-          items: exchangeItems,
-        },
+        exchangeItems.length > 0 &&
+          (testFlags.showCexWithdrawal || type === TransferType.deposit) && {
+            group: 'exchanges',
+            groupLabel: stringGetter({ key: STRING_KEYS.EXCHANGES }),
+            items: exchangeItems,
+          },
        chainItems.length > 0 && {
          group: 'chains',
          groupLabel: stringGetter({ key: STRING_KEYS.CHAINS }),
@@ -17,9 +17,10 @@ import { getTransferInputs } from '@/state/inputsSelectors';
 type ElementProps = {
  selectedToken?: TransferInputTokenResource;
  onSelectToken: (token: TransferInputTokenResource) => void;
+  isExchange?: boolean;
 };

-export const TokenSelectMenu = ({ selectedToken, onSelectToken }: ElementProps) => {
+export const TokenSelectMenu = ({ selectedToken, onSelectToken, isExchange }: ElementProps) => {
  const stringGetter = useStringGetter();
  const { type, depositOptions, withdrawalOptions, resources } =
    useSelector(getTransferInputs, shallowEqual) || {};
@@ -47,19 +48,24 @@ export const TokenSelectMenu = ({ selectedToken, onSelectToken }: ElementProps)
        },
      ]}
      label={stringGetter({ key: STRING_KEYS.ASSET })}
-      withReceiptItems={[
-        {
-          key: 'swap',
-          label: stringGetter({ key: STRING_KEYS.SWAP }),
-          value: selectedToken && (
-            <>
-              <Tag>{type === TransferType.deposit ? selectedToken?.symbol : 'USDC'}</Tag>
-              <DiffArrow />
-              <Tag>{type === TransferType.deposit ? 'USDC' : selectedToken?.symbol}</Tag>
-            </>
-          ),
-        },
-      ]}
+      withSearch={!isExchange}
+      withReceiptItems={
+        !isExchange
+          ? [
+              {
+                key: 'swap',
+                label: stringGetter({ key: STRING_KEYS.SWAP }),
+                value: selectedToken && (
+                  <>
+                    <Tag>{type === TransferType.deposit ? selectedToken?.symbol : 'USDC'}</Tag>
+                    <DiffArrow />
+                    <Tag>{type === TransferType.deposit ? 'USDC' : selectedToken?.symbol}</Tag>
+                  </>
+                ),
+              },
+            ]
+          : undefined
+      }
    >
      <Styled.AssetRow>
        {selectedToken ? (
@@ -7,6 +7,7 @@ import { isAddress } from 'viem';

 import { TransferInputField, TransferInputTokenResource, TransferType } from '@/constants/abacus';
 import { AlertType } from '@/constants/alerts';
+import { AnalyticsEvent } from '@/constants/analytics';
 import { ButtonSize } from '@/constants/buttons';
 import { STRING_KEYS } from '@/constants/localization';
 import { isMainnet } from '@/constants/networks';
@@ -16,6 +17,7 @@ import {
  MAX_PRICE_IMPACT,
  MIN_CCTP_TRANSFER_AMOUNT,
  NumberSign,
+  TOKEN_DECIMALS,
 } from '@/constants/numbers';

 import {
@@ -26,6 +28,8 @@ import {
  useSelectedNetwork,
  useStringGetter,
  useSubaccount,
+  useTokenConfigs,
+  useWithdrawalInfo,
 } from '@/hooks';
 import { useLocalNotifications } from '@/hooks/useLocalNotifications';

@@ -55,6 +59,8 @@ import { getNobleChainId } from '@/lib/squid';

 import { TokenSelectMenu } from './TokenSelectMenu';
 import { WithdrawButtonAndReceipt } from './WithdrawForm/WithdrawButtonAndReceipt';
+import { validateCosmosAddress } from '@/lib/addressUtils';
+import { track } from '@/lib/analytics';

 export const WithdrawForm = () => {
  const stringGetter = useStringGetter();
@@ -68,6 +74,7 @@ export const WithdrawForm = () => {
  const {
    requestPayload,
    token,
+    exchange,
    chain: chainIdStr,
    address: toAddress,
    resources,
@@ -81,6 +88,8 @@ export const WithdrawForm = () => {
  const [withdrawAmount, setWithdrawAmount] = useState('');
  const [slippage, setSlippage] = useState(isCctp ? 0 : 0.01); // 0.1% slippage
  const debouncedAmount = useDebounce<string>(withdrawAmount, 500);
+  const { usdcLabel } = useTokenConfigs();
+  const { usdcWithdrawalCapacity } = useWithdrawalInfo({ transferType: 'withdrawal' });

  const isValidAddress = toAddress && isAddress(toAddress);

@@ -179,18 +188,27 @@ export const WithdrawForm = () => {
            requestPayload.data,
            isCctp
          );
-          if (txHash) {
+          const nobleChainId = getNobleChainId();
+          const toChainId = Boolean(exchange) ? nobleChainId : chainIdStr || undefined;
+          if (txHash && toChainId) {
            addTransferNotification({
              txHash: txHash,
              type: TransferNotificationTypes.Withdrawal,
-              fromChainId: !isCctp ? selectedDydxChainId : getNobleChainId(),
-              toChainId: chainIdStr || undefined,
+              fromChainId: !isCctp ? selectedDydxChainId : nobleChainId,
+              toChainId,
              toAmount: debouncedAmountBN.toNumber(),
              triggeredAt: Date.now(),
              isCctp,
+              isExchange: Boolean(exchange),
            });
            abacusStateManager.clearTransferInputValues();
            setWithdrawAmount('');
+
+            track(AnalyticsEvent.TransferWithdraw, {
+              chainId: toChainId,
+              tokenAddress: toToken?.address || undefined,
+              tokenSymbol: toToken?.symbol || undefined,
+            });
          }
        }
      } catch (error) {
@@ -213,7 +231,17 @@ export const WithdrawForm = () => {
        setIsLoading(false);
      }
    },
-    [requestPayload, debouncedAmountBN, chainIdStr, toAddress, screenAddresses, stringGetter]
+    [
+      requestPayload,
+      debouncedAmountBN,
+      chainIdStr,
+      toAddress,
+      selectedDydxChainId,
+      exchange,
+      toToken,
+      screenAddresses,
+      stringGetter,
+    ]
  );

  const onChangeAddress = useCallback((e: ChangeEvent<HTMLInputElement>) => {
@@ -246,13 +274,20 @@ export const WithdrawForm = () => {
    setWithdrawAmount(freeCollateralBN.toString());
  }, [freeCollateralBN, setWithdrawAmount]);

-  const onSelectChain = useCallback((chain: string) => {
-    if (chain) {
-      abacusStateManager.setTransferValue({
-        field: TransferInputField.chain,
-        value: chain,
-      });
+  const onSelectNetwork = useCallback((name: string, type: 'chain' | 'exchange') => {
+    if (name) {
      setWithdrawAmount('');
+      if (type === 'chain') {
+        abacusStateManager.setTransferValue({
+          field: TransferInputField.chain,
+          value: name,
+        });
+      } else {
+        abacusStateManager.setTransferValue({
+          field: TransferInputField.exchange,
+          value: name,
+        });
+      }
    }
  }, []);

@@ -291,61 +326,102 @@ export const WithdrawForm = () => {

  const { sanctionedAddresses } = useRestrictions();

-  const errorMessage = useMemo(() => {
+  const { alertType, errorMessage } = useMemo(() => {
    if (error) {
-      return error;
+      return {
+        errorMessage: error,
+      };
    }

    if (routeErrors) {
-      return routeErrorMessage
-        ? stringGetter({
-            key: STRING_KEYS.SOMETHING_WENT_WRONG_WITH_MESSAGE,
-            params: { ERROR_MESSAGE: routeErrorMessage },
-          })
-        : stringGetter({ key: STRING_KEYS.SOMETHING_WENT_WRONG });
+      return {
+        errorMessage: routeErrorMessage
+          ? stringGetter({
+              key: STRING_KEYS.SOMETHING_WENT_WRONG_WITH_MESSAGE,
+              params: { ERROR_MESSAGE: routeErrorMessage },
+            })
+          : stringGetter({ key: STRING_KEYS.SOMETHING_WENT_WRONG }),
+      };
    }

-    if (!toAddress) return stringGetter({ key: STRING_KEYS.WITHDRAW_MUST_SPECIFY_ADDRESS });
+    if (!toAddress) {
+      return {
+        alertType: AlertType.Warning,
+        errorMessage: stringGetter({ key: STRING_KEYS.WITHDRAW_MUST_SPECIFY_ADDRESS }),
+      };
+    }

    if (sanctionedAddresses.has(toAddress))
-      return stringGetter({
-        key: STRING_KEYS.TRANSFER_INVALID_DYDX_ADDRESS,
-      });
+      return {
+        errorMessage: stringGetter({
+          key: STRING_KEYS.TRANSFER_INVALID_DYDX_ADDRESS,
+        }),
+      };

    if (debouncedAmountBN) {
-      if (!chainIdStr) {
-        return stringGetter({ key: STRING_KEYS.WITHDRAW_MUST_SPECIFY_CHAIN });
+      if (!chainIdStr && !exchange) {
+        return {
+          errorMessage: stringGetter({ key: STRING_KEYS.WITHDRAW_MUST_SPECIFY_CHAIN }),
+        };
      } else if (!toToken) {
-        return stringGetter({ key: STRING_KEYS.WITHDRAW_MUST_SPECIFY_ASSET });
+        return {
+          errorMessage: stringGetter({ key: STRING_KEYS.WITHDRAW_MUST_SPECIFY_ASSET }),
+        };
      }
    }

-    if (MustBigNumber(debouncedAmountBN).gt(MustBigNumber(freeCollateralBN))) {
-      return stringGetter({ key: STRING_KEYS.WITHDRAW_MORE_THAN_FREE });
+    if (debouncedAmountBN.gt(MustBigNumber(freeCollateralBN))) {
+      return {
+        errorMessage: stringGetter({ key: STRING_KEYS.WITHDRAW_MORE_THAN_FREE }),
+      };
    }

    if (isCctp) {
-      if (MustBigNumber(debouncedAmountBN).gte(MAX_CCTP_TRANSFER_AMOUNT)) {
-        return stringGetter({
-          key: STRING_KEYS.MAX_CCTP_TRANSFER_LIMIT_EXCEEDED,
-          params: {
-            MAX_CCTP_TRANSFER_AMOUNT: MAX_CCTP_TRANSFER_AMOUNT,
-          },
-        });
+      if (debouncedAmountBN.gte(MAX_CCTP_TRANSFER_AMOUNT)) {
+        return {
+          errorMessage: stringGetter({
+            key: STRING_KEYS.MAX_CCTP_TRANSFER_LIMIT_EXCEEDED,
+            params: {
+              MAX_CCTP_TRANSFER_AMOUNT: MAX_CCTP_TRANSFER_AMOUNT,
+            },
+          }),
+        };
      }
      if (
        !debouncedAmountBN.isZero() &&
        MustBigNumber(debouncedAmountBN).lte(MIN_CCTP_TRANSFER_AMOUNT)
      ) {
-        return 'Amount must be greater than 10 USDC';
+        return {
+          errorMessage: 'Amount must be greater than 10 USDC',
+        };
      }
    }

    if (isMainnet && MustBigNumber(summary?.aggregatePriceImpact).gte(MAX_PRICE_IMPACT)) {
-      return stringGetter({ key: STRING_KEYS.PRICE_IMPACT_TOO_HIGH });
+      return { errorMessage: stringGetter({ key: STRING_KEYS.PRICE_IMPACT_TOO_HIGH }) };
    }

-    return undefined;
+    // Withdrawal Safety
+    if (usdcWithdrawalCapacity.gt(0) && debouncedAmountBN.gt(usdcWithdrawalCapacity)) {
+      return {
+        alertType: AlertType.Warning,
+        errorMessage: stringGetter({
+          key: STRING_KEYS.WITHDRAWAL_LIMIT_OVER,
+          params: {
+            USDC_LIMIT: (
+              <span>
+                {usdcWithdrawalCapacity.toFormat(TOKEN_DECIMALS)}
+                <Styled.Tag>{usdcLabel}</Styled.Tag>
+              </span>
+            ),
+          },
+        }),
+      };
+    }
+
+    return {
+      errorMessage: undefined,
+    };
  }, [
    error,
    routeErrors,
@@ -358,16 +434,22 @@ export const WithdrawForm = () => {
    sanctionedAddresses,
    stringGetter,
    summary,
+    usdcWithdrawalCapacity,
  ]);

+  const isInvalidNobleAddress = Boolean(
+    exchange && toAddress && !validateCosmosAddress(toAddress, 'noble')
+  );
+
  const isDisabled =
    !!errorMessage ||
    !toToken ||
-    !chainIdStr ||
+    (!chainIdStr && !exchange) ||
    !toAddress ||
    debouncedAmountBN.isNaN() ||
    debouncedAmountBN.isZero() ||
-    isLoading;
+    isLoading ||
+    isInvalidNobleAddress;

  return (
    <Styled.Form onSubmit={onSubmit}>
@@ -385,12 +467,21 @@ export const WithdrawForm = () => {
          }
        />
        <SourceSelectMenu
-          label={stringGetter({ key: STRING_KEYS.NETWORK })}
+          selectedExchange={exchange || undefined}
          selectedChain={chainIdStr || undefined}
-          onSelect={onSelectChain}
+          onSelect={onSelectNetwork}
        />
      </Styled.DestinationRow>
-      <TokenSelectMenu selectedToken={toToken || undefined} onSelectToken={onSelectToken} />
+      {isInvalidNobleAddress && (
+        <AlertMessage type={AlertType.Error}>
+          {stringGetter({ key: STRING_KEYS.NOBLE_ADDRESS_VALIDATION })}
+        </AlertMessage>
+      )}
+      <TokenSelectMenu
+        selectedToken={toToken || undefined}
+        onSelectToken={onSelectToken}
+        isExchange={Boolean(exchange)}
+      />
      <Styled.WithDetailsReceipt side="bottom" detailItems={amountInputReceipt}>
        <FormInput
          type={InputType.Number}
@@ -404,7 +495,11 @@ export const WithdrawForm = () => {
          }
        />
      </Styled.WithDetailsReceipt>
-      {errorMessage && <AlertMessage type={AlertType.Error}>{errorMessage}</AlertMessage>}
+      {errorMessage && (
+        <Styled.AlertMessage type={alertType ?? AlertType.Error}>
+          {errorMessage}
+        </Styled.AlertMessage>
+      )}
      <Styled.Footer>
        <WithdrawButtonAndReceipt
          isDisabled={isDisabled}
@@ -421,6 +516,10 @@ export const WithdrawForm = () => {

 const Styled: Record<string, AnyStyledComponent> = {};

+Styled.Tag = styled(Tag)`
+  margin-left: 0.5ch;
+`;
+
 Styled.DiffOutput = styled(DiffOutput)`
  --diffOutput-valueWithDiff-fontSize: 1em;
 `;
@@ -440,6 +539,10 @@ Styled.DestinationRow = styled.div`
  gap: 1rem;
 `;

+Styled.AlertMessage = styled(AlertMessage)`
+  display: inline;
+`;
+
 Styled.WithDetailsReceipt = styled(WithDetailsReceipt)`
  --withReceipt-backgroundColor: var(--color-layer-2);
 `;
@@ -27,6 +27,8 @@ import { calculateCanAccountTrade } from '@/state/accountCalculators';
 import { getSubaccount } from '@/state/accountSelectors';
 import { getTransferInputs } from '@/state/inputsSelectors';

+import { isTruthy } from '@/lib/isTruthy';
+
 import { SlippageEditor } from '../SlippageEditor';

 type ElementProps = {
@@ -55,7 +57,7 @@ export const WithdrawButtonAndReceipt = ({
  const stringGetter = useStringGetter();

  const { leverage } = useSelector(getSubaccount, shallowEqual) || {};
-  const { summary, requestPayload } = useSelector(getTransferInputs, shallowEqual) || {};
+  const { summary, requestPayload, exchange } = useSelector(getTransferInputs, shallowEqual) || {};
  const canAccountTrade = useSelector(calculateCanAccountTrade, shallowEqual);
  const { usdcLabel } = useTokenConfigs();

@@ -92,7 +94,7 @@ export const WithdrawButtonAndReceipt = ({
      value: <Output type={OutputType.Fiat} value={totalFees} />,
      subitems: feeSubitems,
    },
-    {
+    !exchange && {
      key: 'exchange-rate',
      label: <span>{stringGetter({ key: STRING_KEYS.EXCHANGE_RATE })}</span>,
      value: withdrawToken && typeof summary?.exchangeRate === 'number' && (
@@ -133,7 +135,9 @@ export const WithdrawButtonAndReceipt = ({
          {withdrawToken && <Tag>{withdrawToken?.symbol}</Tag>}
        </span>
      ),
-      value: <Output type={OutputType.Asset} value={summary?.toAmount} fractionDigits={TOKEN_DECIMALS} />,
+      value: (
+        <Output type={OutputType.Asset} value={summary?.toAmount} fractionDigits={TOKEN_DECIMALS} />
+      ),
      subitems: [
        {
          key: 'minimum-amount-received',
@@ -144,13 +148,17 @@ export const WithdrawButtonAndReceipt = ({
            </span>
          ),
          value: (
-            <Output type={OutputType.Asset} value={summary?.toAmountMin} fractionDigits={TOKEN_DECIMALS} />
+            <Output
+              type={OutputType.Asset}
+              value={summary?.toAmountMin}
+              fractionDigits={TOKEN_DECIMALS}
+            />
          ),
          tooltip: 'minimum-amount-received',
        },
      ],
    },
-    {
+    !exchange && {
      key: 'slippage',
      label: <span>{stringGetter({ key: STRING_KEYS.MAX_SLIPPAGE })}</span>,
      value: (
@@ -175,7 +183,7 @@ export const WithdrawButtonAndReceipt = ({
        />
      ),
    },
-  ];
+  ].filter(isTruthy);

  const isFormValid = !isDisabled && !isEditingSlippage;

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import styled, { type AnyStyledComponent } from 'styled-components';
+import styled, { type AnyStyledComponent, css } from 'styled-components';

 import { OpacityToken } from '@/constants/styles/base';
 import { STRING_KEYS } from '@/constants/localization';
@@ -10,7 +10,6 @@ import { useAccounts, useStringGetter } from '@/hooks';
 import { CopyButton } from '@/components/CopyButton';
 import { QrCode } from '@/components/QrCode';
 import { Checkbox } from '@/components/Checkbox';
-import { Icon, IconName } from '@/components/Icon';
 import { TimeoutButton } from '@/components/TimeoutButton';
 import { WithDetailsReceipt } from '@/components/WithDetailsReceipt';
 import { WithReceipt } from '@/components/WithReceipt';
@@ -19,6 +18,7 @@ import { generateFadedColorVariant } from '@/lib/styles';

 export const NobleDeposit = () => {
  const [hasAcknowledged, setHasAcknowledged] = useState(false);
+  const [hasTimedout, setHasTimedout] = useState(false);
  const stringGetter = useStringGetter();
  const { nobleAddress } = useAccounts();

@@ -30,23 +30,21 @@ export const NobleDeposit = () => {
          {
            key: 'nobleAddress',
            label: stringGetter({ key: STRING_KEYS.NOBLE_ADDRESS }),
-            value: nobleAddress,
+            value:
+              hasAcknowledged && hasTimedout
+                ? nobleAddress
+                : stringGetter({ key: STRING_KEYS.ACKNOWLEDGE_TO_REVEAL }),
          },
        ]}
      >
-        <Styled.QrCodeContainer>
-          <Styled.QrCode size={432} value={nobleAddress || ''} />
-        </Styled.QrCodeContainer>
+        <Styled.QrCode
+          hasLogo
+          size={432}
+          value={nobleAddress || ''}
+          blurred={!hasAcknowledged || !hasTimedout}
+        />
      </WithDetailsReceipt>

-      <Styled.WaitingSpan>
-        <Styled.CautionIconContainer>
-          <Icon iconName={IconName.CautionCircleStroked} />
-        </Styled.CautionIconContainer>
-
-        <p>{stringGetter({ key: STRING_KEYS.NOBLE_WARNING })}</p>
-      </Styled.WaitingSpan>
-
      <Styled.WithReceipt
        slotReceipt={
          <Styled.CheckboxContainer>
@@ -63,7 +61,12 @@ export const NobleDeposit = () => {
      >
        <TimeoutButton
          timeoutInSeconds={8}
-          slotFinal={<CopyButton state={{ isDisabled: !hasAcknowledged }} value={nobleAddress} />}
+          onTimeOut={() => setHasTimedout(true)}
+          slotFinal={
+            <CopyButton state={{ isDisabled: !hasAcknowledged }} value={nobleAddress}>
+              {!hasAcknowledged ? stringGetter({ key: STRING_KEYS.ACKNOWLEDGE_RISKS }) : undefined}
+            </CopyButton>
+          }
        />
      </Styled.WithReceipt>
    </>
@@ -82,23 +85,14 @@ Styled.WithReceipt = styled(WithReceipt)`
  --withReceipt-backgroundColor: var(--color-layer-2);
 `;

-Styled.QrCodeContainer = styled.div`
-  display: flex;
-  justify-content: center;
+Styled.QrCode = styled(QrCode)<{ blurred: boolean }>`
+  border-radius: 0.5em;

-  padding: 0.5rem;
-
-  background-color: var(--color-layer-2);
-  border-radius: 0.5rem;
-`;
-
-Styled.QrCode = styled(QrCode)`
-  max-height: 20rem;
-  width: fit-content;
-
-  svg {
-    max-height: 20rem;
-  }
+  ${({ blurred }) =>
+    blurred &&
+    css`
+      filter: blur(8px);
+    `}
 `;

 Styled.CheckboxContainer = styled.div`
@@ -20,6 +20,7 @@ import {
  useStringGetter,
  useSubaccount,
  useTokenConfigs,
+  useWithdrawalInfo,
 } from '@/hooks';

 import { formMixins } from '@/styles/formMixins';
@@ -64,6 +65,7 @@ export const TransferForm = ({
  const { nativeTokenBalance, usdcBalance } = useAccountBalance();
  const selectedDydxChainId = useSelector(getSelectedDydxChainId);
  const { tokensConfigs, usdcLabel, chainTokenLabel } = useTokenConfigs();
+  useWithdrawalInfo({ transferType: 'transfer' });

  const {
    address: recipientAddress,
@@ -40,7 +40,7 @@ export const TransferStatusNotification = ({
  const stringGetter = useStringGetter();
  const [open, setOpen] = useState<boolean>(false);
  const [secondsLeft, setSecondsLeft] = useState<number>(0);
-  const { fromChainId, status, txHash, toAmount } = transfer;
+  const { fromChainId, status, txHash, toAmount, isExchange } = transfer;

  // @ts-ignore status.errors is not in the type definition but can be returned
  const error = status?.errors?.length ? status?.errors[0] : status?.error;
@@ -54,6 +54,8 @@ export const TransferStatusNotification = ({

  useInterval({ callback: updateSecondsLeft });

+  const isComplete = status?.squidTransactionStatus === 'success' || isExchange;
+
  const inProgressStatusString =
    type === TransferNotificationTypes.Deposit
      ? secondsLeft > 0
@@ -65,10 +67,10 @@ export const TransferStatusNotification = ({

  const statusString =
    type === TransferNotificationTypes.Deposit
-      ? status?.squidTransactionStatus === 'success'
+      ? isComplete
        ? STRING_KEYS.DEPOSIT_COMPLETE
        : inProgressStatusString
-      : status?.squidTransactionStatus === 'success'
+      : isComplete
      ? STRING_KEYS.WITHDRAW_COMPLETE
      : inProgressStatusString;

@@ -108,12 +110,12 @@ export const TransferStatusNotification = ({
      slotIcon={isToast && slotIcon}
      slotTitle={slotTitle}
      slotCustomContent={
-        !status ? (
+        !status && !isExchange ? (
          <LoadingDots size={3} />
        ) : (
          <Styled.BridgingStatus>
            {content}
-            {!isToast && status?.squidTransactionStatus !== 'success' && !hasError && (
+            {!isToast && !isComplete && !hasError && (
              <Styled.TransferStatusSteps status={status} type={type} />
            )}
          </Styled.BridgingStatus>
@@ -22,6 +22,6 @@
      "@/*": ["src/*"]
    }
  },
-  "include": ["src", "scripts"],
+  "include": ["src", "scripts", "styled.d.ts"],
  "references": [{ "path": "./tsconfig.node.json" }]
 }
Author	SHA1	Message	Date
jaredvu	3631f51878	Add withdrawalGateLearnMore to v1/env.json	2024-02-20 10:57:17 -08:00
jaredvu	8518cb6837	Add telemetry log fn	2024-02-20 10:48:29 -08:00
jaredvu	b9024ca6df	Add useEnvFeatures to gate fetch when unsupported on env	2024-02-20 10:41:33 -08:00
jaredvu	88fa4e26e4	TransferType prop	2024-02-20 10:10:42 -08:00
jaredvu	daf862aa40	Merge branch 'main' into withdrawal-safety	2024-02-20 10:00:22 -08:00
Bill	7f947804bd	Enable CCTP onboarding for avalanche, optimism (#310 ) * Enable CCTP for arbitrum avalanche optimism * Enable CCTP onboarding for arbitrum, avalanche, optimism * remove arb	2024-02-19 20:18:57 -08:00
aleka	6620a70a5d	fix parsing error and surface tx broadcast error (#313 ) * fix parsing error and surface tx broadcast error * fix network as chain id	2024-02-19 22:06:13 -05:00
Bill	bff779631b	Cex withdraw (#301 ) * Coinbase withdrawal and deposit UI * analytics * packages bumps * address comments * address comments * add test flag	2024-02-16 17:56:06 -08:00
jaredvu	4e6742ba9d	nits: Add fadedWarning and fix globalStyle type	2024-02-09 20:35:39 -08:00
jaredvu	1ffbead4b3	nits	2024-02-09 20:21:52 -08:00
jaredvu	8cfe4e9d85	✏️ withdrawalGateLearnMore	2024-02-09 20:18:52 -08:00
jaredvu	d8383c1088	🚧 withdrawal gate and capacity	2024-02-09 20:18:32 -08:00
jaredvu	279a5239e5	Merge branch 'main' into withdrawal-safety	2024-02-09 09:12:06 -08:00
jaredvu	c4b42a77df	🚧 withdrwal-safety client calls	2024-02-05 11:32:24 -08:00