Change dep in hook to fix input bug

package.json

@@ -39,9 +39,9 @@
     "@cosmjs/proto-signing": "^0.31.0",
     "@cosmjs/stargate": "^0.31.0",
     "@cosmjs/tendermint-rpc": "^0.31.0",
-    "@dydxprotocol/v4-abacus": "^1.1.4",
+    "@dydxprotocol/v4-abacus": "^1.0.24",
-    "@dydxprotocol/v4-client-js": "^1.0.6",
+    "@dydxprotocol/v4-client-js": "^1.0.0",
-    "@dydxprotocol/v4-localization": "^1.0.17",
+    "@dydxprotocol/v4-localization": "^1.0.5",
     "@ethersproject/providers": "^5.7.2",
     "@js-joda/core": "^5.5.3",
     "@radix-ui/react-checkbox": "^1.0.4",

pnpm-lock.yaml

@@ -1,9 +1,5 @@
 lockfileVersion: '6.0'
 
-settings:
-  autoInstallPeers: true
-  excludeLinksFromLockfile: false
-
 dependencies:
   '@0xsquid/sdk':
     specifier: ^1.10.0
@@ -27,14 +23,14 @@ dependencies:
     specifier: ^0.31.0
     version: 0.31.0
   '@dydxprotocol/v4-abacus':
-    specifier: ^1.1.4
+    specifier: ^1.0.24
-    version: 1.1.4
+    version: 1.0.24
   '@dydxprotocol/v4-client-js':
-    specifier: ^1.0.6
+    specifier: ^1.0.0
-    version: 1.0.6
+    version: 1.0.0
   '@dydxprotocol/v4-localization':
-    specifier: ^1.0.17
+    specifier: ^1.0.5
-    version: 1.0.17
+    version: 1.0.5
   '@ethersproject/providers':
     specifier: ^5.7.2
     version: 5.7.2
@@ -988,12 +984,12 @@ packages:
     resolution: {integrity: sha512-RpfLEtTlyIxeNPGKcokS+p3BZII/Q3bYxryFRglh5H3A3T8q9fsLYm72VYAMEOOIBLEa8o93kFLiBDUWKrwXZA==}
     dev: true
 
-  /@dydxprotocol/v4-abacus@1.1.4:
+  /@dydxprotocol/v4-abacus@1.0.24:
-    resolution: {integrity: sha512-gml6qheFsPShE9p3FmzFeStYM9ZVhgMq0K0+y12V7pObnMKbumkOIISgCzc47idkah0GMNhiqwi9faD5SjOy/A==}
+    resolution: {integrity: sha512-wDGSjkrc3Se6Ev7UTjPgJV7PiyzZSz2mJwOTZikLwH7W3k1iPYGQmaCd7TudFk8h2aSdlEwNsQBCf0sLoyvHaQ==}
     dev: false
 
-  /@dydxprotocol/v4-client-js@1.0.6:
+  /@dydxprotocol/v4-client-js@1.0.0:
-    resolution: {integrity: sha512-xiWH+kbix+zhI6EsAnd+NDvkjBgxWtGwQmvpd0PjljWNYSFgUtNe5M+piDdRbl2nhy6YWbxAGTwwS3K/ih5qSw==}
+    resolution: {integrity: sha512-ehfHO+zQy795TcJRwtiawadFHZyh4HnpJNP26hCGsIjLE5q6LLHweQHpK/1N/sXU1PBOuQwc7iaJnFop6gYauQ==}
     dependencies:
       '@cosmjs/amino': 0.30.1
       '@cosmjs/encoding': 0.31.1
@@ -1020,8 +1016,8 @@ packages:
       - utf-8-validate
     dev: false
 
-  /@dydxprotocol/v4-localization@1.0.17:
+  /@dydxprotocol/v4-localization@1.0.5:
-    resolution: {integrity: sha512-fybNpi1ono1IdwFQJTszsHbHmGti2BdhTo1nz9KOmKh3tmXdhWObKb64Ve6/6Fjk6h/9+DeZ5ZG4UbYyYMyhCA==}
+    resolution: {integrity: sha512-zZm3GFp/ORz9YjigQFVBlcWmaxYY+XEdIw8AWN5nEbsuiA2Jay+/OA7lO9+nV1J1p1T+TgLo9iczIHJsAo3IsA==}
     dev: false
 
   /@dydxprotocol/v4-proto@0.4.1:
@@ -14140,3 +14136,7 @@ packages:
   /zwitch@2.0.4:
     resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
     dev: true
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false

public/configs/cctp.json

@@ -1,61 +0,0 @@
-[
-    {
-        "chainId": "42161",
-        "tokenAddress": "0xff970a61a04b1ca14834a43f5de4533ebddb5cc8",
-        "name": "Arbitrum"
-    },
-    {
-        "chainId": "43114",
-        "tokenAddress": "0xB97EF9Ef8734C71904D8002F8b6Bc66Dd9c48a6E",
-        "name": "Avalanche"
-    },
-    {
-        "chainId": "8453",
-        "tokenAddress": "0x66627F389ae46D881773B7131139b2411980E09E",
-        "name": "Base"
-    },
-    {
-        "chainId": "1",
-        "tokenAddress": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
-        "name": "Ethereum"
-    },
-    {
-        "chainId": "10",
-        "tokenAddress": "0x7F5c764cBc14f9669B88837ca1490cCa17c31607",
-        "name": "OP Mainnet"
-    },
-    {
-        "chainId": "421613",
-        "tokenAddress": "0xfd064a18f3bf249cf1f87fc203e90d8f650f2d63",
-        "name": "Arbitrum Goerli"
-    },
-    {
-        "chainId": "43113",
-        "tokenAddress": "0x5425890298aed601595a70AB815c96711a31Bc65",
-        "name": "Avalanche Fuji"
-    },
-    {
-        "chainId": "84531",
-        "tokenAddress": "0xf175520c52418dfe19c8098071a252da48cd1c19",
-        "name": "Base Goerli"
-    },
-    {
-        "chainId": "5",
-        "tokenAddress": "0x07865c6E87B9F70255377e024ace6630C1Eaa37F",
-        "name": "Ethereum Goerli"
-    },
-    {
-        "chainId": "grand-1",
-        "tokenAddress": "uusdc",
-        "name": "Noble Testnet"
-    },
-    {
-        "chainId": "420",
-        "tokenAddress": "0xe05606174bac4a6364b31bd0eca4bf4dd368f8c6",
-        "name": "OP Goerli"
-    },
-    {
-        "chainId": "103",
-        "name": "Solana Devnet"
-    }
-]

public/configs/env.json

@@ -42,7 +42,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydxprotocol-testnet",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -71,7 +71,6 @@
                "https://validator.v4dev.dydx.exchange"
             ],
             "0xsquid": "https://testnet.api.0xsquid.com",
-            "nobleValidator": "https://rpc.testnet.noble.strange.love",
             "faucet": "https://faucet.v4dev.dydx.exchange"
          },
          "links": {
@@ -116,7 +115,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydxprotocol-testnet",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -144,8 +143,7 @@
             "validators": [
                "http://54.92.118.111"
             ],
-            "0xsquid": "https://testnet.api.0xsquid.com",
+            "0xsquid": "https://testnet.api.0xsquid.com"
-            "nobleValidator": "https://rpc.testnet.noble.strange.love"
          },
          "links": {
             "tos": "https://dydx.exchange/v4-terms",
@@ -189,7 +187,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydxprotocol-testnet",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -217,8 +215,7 @@
             "validators": [
                "http://validator.v4dev4.dydx.exchange"
             ],
-            "0xsquid": "https://testnet.api.0xsquid.com",
+            "0xsquid": "https://testnet.api.0xsquid.com"
-            "nobleValidator": "https://rpc.testnet.noble.strange.love"
          },
          "links": {
             "tos": "https://dydx.exchange/v4-terms",
@@ -262,7 +259,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydxprotocol-testnet",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -290,8 +287,7 @@
             "validators": [
                "http://18.223.78.50"
             ],
-            "0xsquid": "https://testnet.api.0xsquid.com",
+            "0xsquid": "https://testnet.api.0xsquid.com"
-            "nobleValidator": "https://rpc.testnet.noble.strange.love"
          },
          "links": {
             "tos": "https://dydx.exchange/v4-terms",
@@ -335,7 +331,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydxprotocol-testnet",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -364,8 +360,7 @@
             "validators": [
                "https://validator.v4staging.dydx.exchange"
             ],
-            "0xsquid": "https://testnet.api.squidrouter.com",
+            "0xsquid": "https://testnet.api.squidrouter.com"
-            "nobleValidator": "https://rpc.testnet.noble.strange.love"
          },
          "links": {
             "tos": "https://dydx.exchange/v4-terms",
@@ -410,8 +405,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydxprotocol-testnet",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
-         "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
             "chain": {
@@ -439,8 +433,7 @@
             "validators": [
                "https://validator.v4staging.dydx.exchange"
             ],
-            "0xsquid": "https://testnet.api.squidrouter.com",
+            "0xsquid": "https://testnet.api.squidrouter.com"
-            "nobleValidator": "https://rpc.testnet.noble.strange.love"
          },
          "links": {
             "tos": "https://dydx.exchange/v4-terms",
@@ -483,7 +476,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydxprotocol-testnet",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -512,8 +505,7 @@
             "validators": [
                "https://validator-uswest1.v4staging.dydx.exchange"
             ],
-            "0xsquid": "https://testnet.api.squidrouter.com",
+            "0xsquid": "https://testnet.api.squidrouter.com"
-            "nobleValidator": "https://rpc.testnet.noble.strange.love"
          },
          "links": {
             "tos": "https://dydx.exchange/v4-terms",
@@ -558,7 +550,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydx-testnet-4",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -591,7 +583,6 @@
                "https://dydx-rpc.liquify.com/api=8878132/dydx"
             ],
             "0xsquid": "https://testnet.api.squidrouter.com",
-            "nobleValidator": "https://rpc.testnet.noble.strange.love",
             "faucet": "https://faucet.v4testnet.dydx.exchange"
          },
          "links": {
@@ -637,7 +628,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydx-testnet-4",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -666,7 +657,6 @@
                "https://validator.v4testnet.dydx.exchange"
             ],
             "0xsquid": "https://testnet.api.squidrouter.com",
-            "nobleValidator": "https://rpc.testnet.noble.strange.love",
             "faucet": "https://faucet.v4testnet.dydx.exchange"
          },
          "links": {
@@ -713,7 +703,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydx-testnet-4",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -742,7 +732,6 @@
                "https://dydx-testnet.nodefleet.org"
             ],
             "0xsquid": "https://testnet.api.squidrouter.com",
-            "nobleValidator": "https://rpc.testnet.noble.strange.love",
             "faucet": "https://faucet.v4testnet.dydx.exchange"
          },
          "links": {
@@ -789,7 +778,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydx-testnet-4",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -818,7 +807,6 @@
                "https://test-dydx.kingnodes.com"
             ],
             "0xsquid": "https://testnet.api.squidrouter.com",
-            "nobleValidator": "https://rpc.testnet.noble.strange.love",
             "faucet": "https://faucet.v4testnet.dydx.exchange"
          },
          "links": {
@@ -865,7 +853,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydx-testnet-4",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -894,7 +882,6 @@
                "https://dydx-rpc.liquify.com/api=8878132/dydx"
             ],
             "0xsquid": "https://testnet.api.squidrouter.com",
-            "nobleValidator": "https://rpc.testnet.noble.strange.love",
             "faucet": "https://faucet.v4testnet.dydx.exchange"
          },
          "links": {
@@ -941,7 +928,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydx-testnet-4",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -970,7 +957,6 @@
                "https://dydx-testnet-rpc.polkachu.com/"
             ],
             "0xsquid": "https://testnet.api.squidrouter.com",
-            "nobleValidator": "https://rpc.testnet.noble.strange.love",
             "faucet": "https://faucet.v4testnet.dydx.exchange"
          },
          "links": {
@@ -1008,7 +994,7 @@
          "ethereumChainId": "5",
          "dydxChainId": "dydx-testnet-4",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "dYdX-api",
          "isMainNet": false,
          "tokens": {
@@ -1037,7 +1023,6 @@
                "https://dydx-testnet-full-rpc.public.blastapi.io/"
             ],
             "0xsquid": "https://testnet.api.squidrouter.com",
-            "nobleValidator": "https://rpc.testnet.noble.strange.love",
             "faucet": "https://faucet.v4testnet.dydx.exchange"
          },
          "links": {
@@ -1084,7 +1069,7 @@
          "ethereumChainId": "1",
          "dydxChainId": "[mainnet chain id]",
          "chainName": "dYdX Chain",
-         "chainLogo": "/dydx-chain.png",
+         "chainLogo": "dydx-chain.png",
          "squidIntegratorId": "[mainnet squid integrator id]",
          "isMainNet": true,
          "tokens": {
@@ -1114,8 +1099,7 @@
                "[Validator endpoint 1",
                "[Validator endpoint n]"
             ],
-            "0xsquid": "[0xSquid endpoint for mainnet]",
+            "0xsquid": "[0xSquid endpoint for mainnet]"
-            "nobleValidator": "[noble validator endpoint for mainnet]"
          },
          "links": {
             "tos": "[HTTP link to TOS]",

public/configs/wallets.json

@@ -199,7 +199,7 @@
     },
     "mobile": {
       "native": "trust:",
-      "universal": ""
+      "universal": "https://link.trustwallet.com"
     },
     "desktop": {
       "native": "",

src/App.tsx

@@ -22,6 +22,8 @@ import { NotificationsProvider } from '@/hooks/useNotifications';
 import { LocalNotificationsProvider } from '@/hooks/useLocalNotifications';
 import { RestrictionProvider } from '@/hooks/useRestrictions';
 import { SubaccountProvider } from '@/hooks/useSubaccount';
+import { SquidProvider } from '@/hooks/useSquid';
+import { TestFlagsProvider } from '@/hooks/useTestFlags';
 
 import { GuardedMobileRoute } from '@/components/GuardedMobileRoute';
 
@@ -122,11 +124,13 @@ const providers = [
   wrapProvider(QueryClientProvider, { client: queryClient }),
   wrapProvider(GrazProvider),
   wrapProvider(WagmiConfig, { config }),
+  wrapProvider(TestFlagsProvider),
   wrapProvider(LocaleProvider),
   wrapProvider(RestrictionProvider),
   wrapProvider(DydxProvider),
   wrapProvider(AccountsProvider),
   wrapProvider(SubaccountProvider),
+  wrapProvider(SquidProvider),
   wrapProvider(LocalNotificationsProvider),
   wrapProvider(NotificationsProvider),
   wrapProvider(DialogAreaProvider),

src/abi/erc20_usdt.json

@@ -1,390 +0,0 @@
-[
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "name",
-    "outputs": [{ "name": "", "type": "string" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [{ "name": "_upgradedAddress", "type": "address" }],
-    "name": "deprecate",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [
-      { "name": "_spender", "type": "address" },
-      { "name": "_value", "type": "uint256" }
-    ],
-    "name": "approve",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "deprecated",
-    "outputs": [{ "name": "", "type": "bool" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [{ "name": "_evilUser", "type": "address" }],
-    "name": "addBlackList",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "totalSupply",
-    "outputs": [{ "name": "", "type": "uint256" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [
-      { "name": "_from", "type": "address" },
-      { "name": "_to", "type": "address" },
-      { "name": "_value", "type": "uint256" }
-    ],
-    "name": "transferFrom",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "upgradedAddress",
-    "outputs": [{ "name": "", "type": "address" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [{ "name": "", "type": "address" }],
-    "name": "balances",
-    "outputs": [{ "name": "", "type": "uint256" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "decimals",
-    "outputs": [{ "name": "", "type": "uint256" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "maximumFee",
-    "outputs": [{ "name": "", "type": "uint256" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "_totalSupply",
-    "outputs": [{ "name": "", "type": "uint256" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [],
-    "name": "unpause",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [{ "name": "_maker", "type": "address" }],
-    "name": "getBlackListStatus",
-    "outputs": [{ "name": "", "type": "bool" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [
-      { "name": "", "type": "address" },
-      { "name": "", "type": "address" }
-    ],
-    "name": "allowed",
-    "outputs": [{ "name": "", "type": "uint256" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "paused",
-    "outputs": [{ "name": "", "type": "bool" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [{ "name": "who", "type": "address" }],
-    "name": "balanceOf",
-    "outputs": [{ "name": "", "type": "uint256" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [],
-    "name": "pause",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "getOwner",
-    "outputs": [{ "name": "", "type": "address" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "owner",
-    "outputs": [{ "name": "", "type": "address" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "symbol",
-    "outputs": [{ "name": "", "type": "string" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [
-      { "name": "_to", "type": "address" },
-      { "name": "_value", "type": "uint256" }
-    ],
-    "name": "transfer",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [
-      { "name": "newBasisPoints", "type": "uint256" },
-      { "name": "newMaxFee", "type": "uint256" }
-    ],
-    "name": "setParams",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [{ "name": "amount", "type": "uint256" }],
-    "name": "issue",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [{ "name": "amount", "type": "uint256" }],
-    "name": "redeem",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [
-      { "name": "_owner", "type": "address" },
-      { "name": "_spender", "type": "address" }
-    ],
-    "name": "allowance",
-    "outputs": [{ "name": "remaining", "type": "uint256" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "basisPointsRate",
-    "outputs": [{ "name": "", "type": "uint256" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [{ "name": "", "type": "address" }],
-    "name": "isBlackListed",
-    "outputs": [{ "name": "", "type": "bool" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [{ "name": "_clearedUser", "type": "address" }],
-    "name": "removeBlackList",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": true,
-    "inputs": [],
-    "name": "MAX_UINT",
-    "outputs": [{ "name": "", "type": "uint256" }],
-    "payable": false,
-    "stateMutability": "view",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [{ "name": "newOwner", "type": "address" }],
-    "name": "transferOwnership",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "constant": false,
-    "inputs": [{ "name": "_blackListedUser", "type": "address" }],
-    "name": "destroyBlackFunds",
-    "outputs": [],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "function"
-  },
-  {
-    "inputs": [
-      { "name": "_initialSupply", "type": "uint256" },
-      { "name": "_name", "type": "string" },
-      { "name": "_symbol", "type": "string" },
-      { "name": "_decimals", "type": "uint256" }
-    ],
-    "payable": false,
-    "stateMutability": "nonpayable",
-    "type": "constructor"
-  },
-  {
-    "anonymous": false,
-    "inputs": [{ "indexed": false, "name": "amount", "type": "uint256" }],
-    "name": "Issue",
-    "type": "event"
-  },
-  {
-    "anonymous": false,
-    "inputs": [{ "indexed": false, "name": "amount", "type": "uint256" }],
-    "name": "Redeem",
-    "type": "event"
-  },
-  {
-    "anonymous": false,
-    "inputs": [{ "indexed": false, "name": "newAddress", "type": "address" }],
-    "name": "Deprecate",
-    "type": "event"
-  },
-  {
-    "anonymous": false,
-    "inputs": [
-      { "indexed": false, "name": "feeBasisPoints", "type": "uint256" },
-      { "indexed": false, "name": "maxFee", "type": "uint256" }
-    ],
-    "name": "Params",
-    "type": "event"
-  },
-  {
-    "anonymous": false,
-    "inputs": [
-      { "indexed": false, "name": "_blackListedUser", "type": "address" },
-      { "indexed": false, "name": "_balance", "type": "uint256" }
-    ],
-    "name": "DestroyedBlackFunds",
-    "type": "event"
-  },
-  {
-    "anonymous": false,
-    "inputs": [{ "indexed": false, "name": "_user", "type": "address" }],
-    "name": "AddedBlackList",
-    "type": "event"
-  },
-  {
-    "anonymous": false,
-    "inputs": [{ "indexed": false, "name": "_user", "type": "address" }],
-    "name": "RemovedBlackList",
-    "type": "event"
-  },
-  {
-    "anonymous": false,
-    "inputs": [
-      { "indexed": true, "name": "owner", "type": "address" },
-      { "indexed": true, "name": "spender", "type": "address" },
-      { "indexed": false, "name": "value", "type": "uint256" }
-    ],
-    "name": "Approval",
-    "type": "event"
-  },
-  {
-    "anonymous": false,
-    "inputs": [
-      { "indexed": true, "name": "from", "type": "address" },
-      { "indexed": true, "name": "to", "type": "address" },
-      { "indexed": false, "name": "value", "type": "uint256" }
-    ],
-    "name": "Transfer",
-    "type": "event"
-  },
-  { "anonymous": false, "inputs": [], "name": "Pause", "type": "event" },
-  { "anonymous": false, "inputs": [], "name": "Unpause", "type": "event" }
-]

src/components/Button.tsx

@@ -61,7 +61,7 @@ export const Button = forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonPr
 
     return (
       <StyledBaseButton
-        disabled={state[ButtonState.Disabled] || state[ButtonState.Loading]}
+        disabled={state[ButtonState.Disabled]}
         {...{ ref, action, size, shape, state, ...otherProps }}
       >
         {

src/components/ComboboxDialogMenu.tsx

@@ -122,7 +122,6 @@ Styled.Dialog = styled(Dialog)`
 
     /* Net 0 sticky top inset (let stickyArea1 header stick to top) */
     --stickyArea0-topGap: calc(-1 * var(--stickyArea0-topHeight));
-    overflow-x: clip;
   }
 `;
 

src/components/ComboboxMenu.tsx

@@ -44,6 +44,13 @@ export const ComboboxMenu = <MenuItemValue extends string, MenuGroupValue extend
 }: ComboboxMenuProps<MenuItemValue, MenuGroupValue>) => {
   const [highlightedCommand, setHighlightedCommand] = useState<MenuItemValue>();
   const [searchValue, setSearchValue] = useState('');
+  // const inputRef = useRef<HTMLInputElement | null>(null);
+
+  // console.log({ commandValue: highlightedCommand });
+
+  // useEffect(() => {
+  //   inputRef?.current?.focus();
+  // }, []);
 
   return (
     <Styled.Command
@@ -60,14 +67,11 @@ export const ComboboxMenu = <MenuItemValue extends string, MenuGroupValue extend
       {withSearch && (
         <Styled.Header $withStickyLayout={withStickyLayout}>
           <Styled.Input
-            /**
+            // ref={inputRef}
-             * Mobile Issue: Search Input will always trigger mobile keyboard drawer. There is no fix.
-             * https://github.com/pacocoursey/cmdk/issues/127
-             */
-            autoFocus
             type="search"
             value={searchValue}
             onValueChange={setSearchValue}
+            autoFocus
             placeholder={inputPlaceholder}
           />
         </Styled.Header>
@@ -254,7 +258,6 @@ Styled.Group = styled(Command.Group)<{ $withItemBorders?: boolean; $withStickyLa
 
       > [cmdk-group-heading] {
         ${layoutMixins.stickyHeader}
-        z-index: 2;
       }
 
       > [cmdk-group-items] {

src/components/CopyButton.tsx

@@ -10,7 +10,6 @@ import { layoutMixins } from '@/styles/layoutMixins';
 import { Button, ButtonProps } from './Button';
 import { Icon, IconName } from './Icon';
 import { IconButton } from './IconButton';
-import { WithTooltip } from './WithTooltip';
 
 export type CopyButtonProps = {
   value?: string;
@@ -41,17 +40,13 @@ export const CopyButton = ({
       <Styled.Icon copied={copied} iconName={copied ? IconName.Check : IconName.Copy} />
     </Styled.InlineRow>
   ) : buttonType === 'icon' ? (
-    <WithTooltip
+    <Styled.IconButton
-      tooltipString={stringGetter({ key: copied ? STRING_KEYS.COPIED : STRING_KEYS.COPY })}
+      {...buttonProps}
-    >
+      copied={copied}
-      <Styled.IconButton
+      action={ButtonAction.Base}
-        {...buttonProps}
+      iconName={copied ? IconName.Check : IconName.Copy}
-        copied={copied}
+      onClick={onCopy}
-        action={ButtonAction.Base}
+    />
-        iconName={copied ? IconName.Check : IconName.Copy}
-        onClick={onCopy}
-      />
-    </WithTooltip>
   ) : (
     <Button
       {...buttonProps}

src/components/Icon.tsx

@@ -38,7 +38,6 @@ import {
   HelpCircleIcon,
   HideIcon,
   HistoryIcon,
-  LeaderboardIcon,
   LinkOutIcon,
   LockIcon,
   LogoShortIcon,
@@ -54,7 +53,6 @@ import {
   OrderUntriggeredIcon,
   OverviewIcon,
   PencilIcon,
-  PlayIcon,
   PositionsIcon,
   PriceChartIcon,
   PrivacyIcon,
@@ -112,7 +110,6 @@ export enum IconName {
   HelpCircle = 'HelpCircle',
   Hide = 'Hide',
   History = 'History',
-  Leaderboard = 'Leaderboard',
   LinkOut = 'LinkOut',
   Lock = 'Lock',
   LogoShort = 'LogoShort',
@@ -129,7 +126,6 @@ export enum IconName {
   OrderUntriggered = 'OrderUntriggered',
   Overview = 'Overview',
   Pencil = 'Pencil',
-  Play = 'Play',
   Positions = 'Positions',
   PriceChart = 'PriceChart',
   Privacy = 'Privacy',
@@ -187,7 +183,6 @@ const icons = {
   [IconName.HelpCircle]: HelpCircleIcon,
   [IconName.Hide]: HideIcon,
   [IconName.History]: HistoryIcon,
-  [IconName.Leaderboard]: LeaderboardIcon,
   [IconName.LinkOut]: LinkOutIcon,
   [IconName.Lock]: LockIcon,
   [IconName.LogoShort]: LogoShortIcon,
@@ -203,7 +198,6 @@ const icons = {
   [IconName.OrderUntriggered]: OrderUntriggeredIcon,
   [IconName.Overview]: OverviewIcon,
   [IconName.Pencil]: PencilIcon,
-  [IconName.Play]: PlayIcon,
   [IconName.Positions]: PositionsIcon,
   [IconName.PriceChart]: PriceChartIcon,
   [IconName.Privacy]: PrivacyIcon,

src/components/Input.tsx

@@ -10,7 +10,7 @@ import {
   USD_DECIMALS,
 } from '@/constants/numbers';
 
-import { BIG_NUMBERS } from '@/lib/numbers';
+import { BIG_NUMBERS, MustBigNumber } from '@/lib/numbers';
 import { useLocaleSeparators } from '@/hooks';
 
 export enum InputType {
@@ -29,38 +29,31 @@ type StyleProps = {
 type ElementProps = {
   type?: InputType;
   value?: string | number | null;
+
+  allowNegative?: boolean;
+  decimals?: number;
   disabled?: boolean;
   id?: string;
+  max?: number;
   onBlur?: () => void;
+  onChange?:
+    | Dispatch<SetStateAction<string>>
+    | React.ReactEventHandler<HTMLInputElement>
+    | ((values: NumberFormatValues, e: SourceInfo) => void);
   onFocus?: () => void;
+  onInput?: ({
+    value,
+    floatValue,
+    formattedValue,
+  }: {
+    value: string;
+    floatValue?: number;
+    formattedValue: string;
+  }) => void;
   placeholder?: string;
 };
 
-type ConditionalProps =
+export type InputProps = ElementProps & StyleProps;
-  | {
-      allowNegative?: boolean;
-      decimals?: number;
-      max?: number;
-      onChange?: (values: NumberFormatValues, e: SourceInfo) => void;
-      onInput?: ({
-        value,
-        floatValue,
-        formattedValue,
-      }: {
-        value: string;
-        floatValue?: number;
-        formattedValue: string;
-      }) => void;
-    }
-  | {
-      allowNegative?: never;
-      decimals?: never;
-      max?: never;
-      onChange?: Dispatch<SetStateAction<string>> | React.ReactEventHandler<HTMLInputElement>;
-      onInput?: (e: SyntheticInputEvent) => void;
-    };
-
-export type InputProps = ElementProps & StyleProps & ConditionalProps;
 
 export const Input = forwardRef<HTMLInputElement, InputProps>(
   (
@@ -136,7 +129,6 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
             placeholder={placeholder}
             value={value}
             // Other
-            data-1p-ignore // prevent 1Password fill
             {...otherProps}
           />
         ) : (
@@ -145,7 +137,6 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
             ref={ref as React.Ref<typeof NumericFormat<unknown>>}
             id={id}
             // NumericFormat
-            valueIsNumericString
             allowNegative={allowNegative}
             decimalScale={decimals}
             decimalSeparator={LOCALE_DECIMAL_SEPARATOR}
@@ -169,7 +160,7 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
                 ? undefined
                 : Number(formattedValue.replace(',', '.'));
 
-              onInput?.({ value, floatValue, formattedValue, ...e });
+              onInput?.({ value, floatValue, formattedValue });
             }}
             // Native
             disabled={disabled}
@@ -177,7 +168,6 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
             value={formattedValue}
             autoComplete="off"
             autoCorrect="off"
-            data-1p-ignore // prevent 1Password fill
             {...otherProps}
           />
         )}

src/components/Toast.tsx

@@ -4,7 +4,6 @@ import { Root, Action, Close } from '@radix-ui/react-toast';
 
 import { ButtonShape, ButtonSize } from '@/constants/buttons';
 import { popoverMixins } from '@/styles/popoverMixins';
-import { breakpoints } from '@/styles';
 
 import { Notification, type NotificationProps } from '@/components/Notification';
 
@@ -77,7 +76,7 @@ export const Toast = ({
       <Close asChild>
         <$CloseButton
           iconName={IconName.Close}
-          shape={ButtonShape.Circle}
+          shape={ButtonShape.Square}
           size={ButtonSize.XSmall}
           onClick={(e: MouseEvent) => e.stopPropagation()}
         />
@@ -250,16 +249,12 @@ const $CloseButton = styled(IconButton)`
   right: 0;
 
   border: solid var(--border-width) var(--color-border);
+  border-radius: 50%;
 
   ${$Root}:hover & {
     display: block;
     z-index: 2;
   }
-
-  @media ${breakpoints.mobile} {
-    display: block;
-    z-index: 2;
-  }
 `;
 
 const $Action = styled(Action)`

src/components/ToastArea.tsx

@@ -1,7 +1,6 @@
-import styled from 'styled-components';
-
 import { Provider, Viewport } from '@radix-ui/react-toast';
 
+import styled from 'styled-components';
 import { layoutMixins } from '@/styles/layoutMixins';
 
 type ElementProps = {
@@ -13,9 +12,7 @@ type StyleProps = {
   className?: string;
 };
 
-type ToastAreaProps = ElementProps & StyleProps;
+export const ToastArea = ({ swipeDirection, children, className }: ElementProps & StyleProps) => (
-
-export const ToastArea = ({ swipeDirection, children, className }: ToastAreaProps) => (
   <$ToastArea className={className}>
     <Provider swipeDirection={swipeDirection}>
       {children}

src/constants/dialogs.ts

@@ -3,7 +3,6 @@ export enum DialogTypes {
   Deposit = 'Deposit',
   DisconnectWallet = 'DisconnectWallet',
   ExchangeOffline = 'ExchangeOffline',
-  ExternalLink = 'ExternalLink',
   FillDetails = 'FillDetails',
   Help = 'Help',
   ExternalNavKeplr = 'ExternalNavKeplr',
@@ -13,6 +12,7 @@ export enum DialogTypes {
   OrderDetails = 'OrderDetails',
   Preferences = 'Preferences',
   RateLimit = 'RateLimit',
+  Receive = 'Receive',
   RestrictedGeo = 'RestrictedGeo',
   RestrictedWallet = 'RestrictedWallet',
   Trade = 'Trade',

src/constants/localStorage.ts

@@ -22,7 +22,6 @@ export enum LocalStorageKey {
   SelectedTheme = 'dydx.SelectedTheme',
   SelectedTradeLayout = 'dydx.SelectedTradeLayout',
   TradingViewChartConfig = 'dydx.TradingViewChartConfig',
-  HasSeenLaunchIncentives = 'dydx.HasSeenLaunchIncentives',
 }
 
 export const LOCAL_STORAGE_VERSIONS = {

src/constants/markets.ts

@@ -26,39 +26,3 @@ export enum FundingDirection {
   ToShort = 'ToShort',
   ToLong = 'ToLong',
 }
-
-export const MARKETS_TO_DISPLAY = [
-  'BTC-USD',
-  'ETH-USD',
-  'LINK-USD',
-  'SOL-USD',
-  'MATIC-USD',
-  'ATOM-USD',
-  'AVAX-USD',
-  'APE-USD',
-  'XRP-USD',
-  'UNI-USD',
-  'ADA-USD',
-  'TRX-USD',
-  'OP-USD',
-  'MKR-USD',
-  'DOGE-USD',
-  'SHIB-USD',
-  'COMP-USD',
-  'LDO-USD',
-  'NEAR-USD',
-  'APT-USD',
-  'SUI-USD',
-  'DOT-USD',
-  'ETC-USD',
-  'ARB-USD',
-  'CRV-USD',
-  'BLUR-USD',
-  'FIL-USD',
-  'XLM-USD',
-  'PEPE-USD',
-  'WLD-USD',
-  'SEI-USD',
-  'LTC-USD',
-  'BCH-USD',
-];

src/constants/notifications.ts

@@ -4,7 +4,6 @@ import { StatusResponse } from '@0xsquid/sdk';
 export enum NotificationType {
   AbacusGenerated = 'AbacusGenerated',
   SquidTransfer = 'SquidTransfer',
-  ReleaseUpdates = 'ReleaseUpdates',
 }
 
 export enum NotificationComponentType {}
@@ -129,7 +128,6 @@ export type TransferNotifcation = {
   fromChainId?: string;
   toAmount?: number;
   triggeredAt?: number;
-  isCctp?: boolean;
   errorCount?: number;
   status?: StatusResponse;
 };

src/constants/trade.ts

@@ -116,15 +116,3 @@ export enum MobilePlaceOrderSteps {
   PlacingOrder = 'PlacingOrder',
   Confirmation = 'Confirmation',
 }
-
-export const CLEARED_TRADE_INPUTS = {
-  limitPriceInput: '',
-  triggerPriceInput: '',
-  trailingPercentInput: '',
-};
-
-export const CLEARED_SIZE_INPUTS = {
-  amountInput: '',
-  usdAmountInput: '',
-  leverageInput: '',
-};

src/hooks/index.ts

@@ -22,7 +22,6 @@ import { useShouldShowFooter } from './useShouldShowFooter';
 import { useSelectedNetwork } from './useSelectedNetwork';
 import { useStringGetter } from './useStringGetter';
 import { useSubaccount } from './useSubaccount';
-import { useTradeFormInputs } from './useTradeFormInputs';
 import { useURLConfigs } from './useURLConfigs';
 
 export {
@@ -50,6 +49,5 @@ export {
   useSelectedNetwork,
   useStringGetter,
   useSubaccount,
-  useTradeFormInputs,
   useURLConfigs,
 };

src/hooks/useAccounts.tsx

@@ -2,7 +2,7 @@ import { useCallback, useContext, createContext, useEffect, useState, useMemo }
 
 import { useDispatch } from 'react-redux';
 import { AES, enc } from 'crypto-js';
-import { NOBLE_BECH32_PREFIX, LocalWallet, type Subaccount } from '@dydxprotocol/v4-client-js';
+import { LocalWallet, type Subaccount } from '@dydxprotocol/v4-client-js';
 
 import { OnboardingGuard, OnboardingState, type EvmDerivedAddresses } from '@/constants/account';
 import { DialogTypes } from '@/constants/dialogs';
@@ -219,16 +219,6 @@ const useAccountsContext = () => {
     else abacusStateManager.attemptDisconnectAccount();
   }, [localDydxWallet]);
 
-  useEffect(() => {
-    const setNobleWallet = async () => {
-      if (hdKey?.mnemonic) {
-        const nobleWallet = await LocalWallet.fromMnemonic(hdKey.mnemonic, NOBLE_BECH32_PREFIX);
-        abacusStateManager.setNobleWallet(nobleWallet);
-      }
-    };
-    setNobleWallet();
-  }, [hdKey?.mnemonic]);
-
   // clear subaccounts when no dydxAddress is set
   useEffect(() => {
     (async () => {

src/hooks/useCurrentMarketId.ts

@@ -23,7 +23,6 @@ export const useCurrentMarketId = () => {
   const selectedNetwork = useSelector(getSelectedNetwork);
   const marketIds = useSelector(getMarketIds, shallowEqual);
   const hasMarketIds = marketIds.length > 0;
-
   const [lastViewedMarket, setLastViewedMarket] = useLocalStorage({
     key: LocalStorageKey.LastViewedMarket,
     defaultValue: DEFAULT_MARKETID,

src/hooks/useLocalNotifications.tsx

@@ -1,11 +1,11 @@
 import { createContext, useContext, useCallback, useEffect, useMemo } from 'react';
 import { useQuery } from 'react-query';
+import type { StatusResponse } from '@0xsquid/sdk';
 
 import { LOCAL_STORAGE_VERSIONS, LocalStorageKey } from '@/constants/localStorage';
 import { type TransferNotifcation } from '@/constants/notifications';
 import { useAccounts } from '@/hooks/useAccounts';
-
+import { STATUS_ERROR_GRACE_PERIOD, useSquid } from '@/hooks/useSquid';
-import { fetchSquidStatus, STATUS_ERROR_GRACE_PERIOD } from '@/lib/squid';
 
 import { useLocalStorage } from './useLocalStorage';
 
@@ -68,6 +68,8 @@ const useLocalNotificationsContext = () => {
     [transferNotifications]
   );
 
+  const squid = useSquid();
+
   useQuery({
     queryKey: 'getTransactionStatus',
     queryFn: async () => {
@@ -79,27 +81,23 @@ const useLocalNotificationsContext = () => {
               toChainId,
               fromChainId,
               triggeredAt,
-              isCctp,
               errorCount,
               status: currentStatus,
             } = 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);
-
             if (
-              !hasErrors &&
+              // @ts-ignore status.errors is not in the type definition but can be returned
+              !currentStatus?.errors &&
+              !currentStatus?.error &&
               (!currentStatus?.squidTransactionStatus ||
                 currentStatus?.squidTransactionStatus === 'ongoing')
             ) {
               try {
-                const status = await fetchSquidStatus({
+                const status = await squid?.getStatus({
                   transactionId: txHash,
                   toChainId,
                   fromChainId,
-                }, isCctp);
+                });
 
                 if (status) {
                   transferNotification.status = status;

src/hooks/useMarketsData.ts

@@ -1,14 +1,7 @@
 import { useMemo } from 'react';
 import { useSelector, shallowEqual } from 'react-redux';
 
-import {
+import { MarketFilters, MARKET_FILTER_LABELS, type MarketData } from '@/constants/markets';
-  MarketFilters,
-  MARKET_FILTER_LABELS,
-  type MarketData,
-  MARKETS_TO_DISPLAY,
-} from '@/constants/markets';
-
-import { testFlags } from '@/lib/testFlags';
 
 import { getAssets } from '@/state/assetsSelectors';
 import { getPerpetualMarkets } from '@/state/perpetualsSelectors';
@@ -49,9 +42,7 @@ export const useMarketsData = (
   }, [allPerpetualMarkets, allAssets]);
 
   const filteredMarkets = useMemo(() => {
-    const filtered = markets
+    const filtered = markets.filter(filterFunctions[filter]);
-      .filter(filterFunctions[filter])
-      .filter(({ id }) => (testFlags.displayAllMarkets ? true : MARKETS_TO_DISPLAY.includes(id)));
 
     if (searchFilter) {
       return filtered.filter(

src/hooks/useNotificationTypes.tsx

@@ -25,7 +25,6 @@ import {
 import { useSelectedNetwork, useStringGetter } from '@/hooks';
 import { useLocalNotifications } from '@/hooks/useLocalNotifications';
 
-import { AssetIcon } from '@/components/AssetIcon';
 import { Icon, IconName } from '@/components/Icon';
 import { TradeNotification } from '@/views/notifications/TradeNotification';
 import { TransferStatusNotification } from '@/views/notifications/TransferStatusNotification';
@@ -206,57 +205,9 @@ export const notificationTypes: NotificationTypeConfig[] = [
       return () => {};
     },
   },
-  {
-    type: NotificationType.ReleaseUpdates,
-    useTrigger: ({ trigger }) => {
-      const stringGetter = useStringGetter();
-
-      useEffect(() => {
-        trigger(
-          'rewards-and-full-trading-live',
-          {
-            icon: <AssetIcon symbol="DYDX" />,
-            title: stringGetter({ key: 'NOTIFICATIONS.RELEASE_REWARDS_AND_FULL_TRADING.TITLE' }),
-            body: stringGetter({
-              key: 'NOTIFICATIONS.RELEASE_REWARDS_AND_FULL_TRADING.BODY',
-              params: {
-                DOS_BLOGPOST: (
-                  <$Link
-                    href="https://www.dydxopsdao.com/blog/deep-dive-full-trading"
-                    target="_blank"
-                    rel="noopener noreferrer"
-                  >
-                    {stringGetter({ key: STRING_KEYS.HERE })}
-                  </$Link>
-                ),
-                TRADING_BLOGPOST: (
-                  <$Link
-                    href="https://dydx.exchange/blog/v4-full-trading"
-                    target="_blank"
-                    rel="noopener noreferrer"
-                  >
-                    {stringGetter({ key: STRING_KEYS.HERE })}
-                  </$Link>
-                ),
-              },
-            }),
-            toastSensitivity: 'foreground',
-          },
-          []
-        );
-      }, [stringGetter]);
-    },
-    useNotificationAction: () => {
-      return () => {};
-    },
-  },
 ];
 
 const $Icon = styled.img`
   height: 1.5rem;
   width: 1.5rem;
 `;
-
-const $Link = styled.a`
-  --link-color: var(--color-text-2);
-`;

src/hooks/useNotifications.tsx

@@ -81,7 +81,6 @@ const useNotificationsContext = () => {
       setNotificationPreferences({
         [NotificationType.AbacusGenerated]: true,
         [NotificationType.SquidTransfer]: true,
-        [NotificationType.ReleaseUpdates]: true,
         version: LOCAL_STORAGE_VERSIONS[LocalStorageKey.NotificationPreferences],
       });
     }

src/hooks/useSquid.tsx

@@ -0,0 +1,50 @@
+import { createContext, useContext, useEffect, useMemo, useState } from 'react';
+import { useSelector } from 'react-redux';
+import { Squid } from '@0xsquid/sdk';
+
+import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks';
+
+import { getSelectedNetwork } from '@/state/appSelectors';
+
+export const NATIVE_TOKEN_ADDRESS = '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE';
+
+export const STATUS_ERROR_GRACE_PERIOD = 300_000;
+
+const useSquidContext = () => {
+  const selectedNetwork = useSelector(getSelectedNetwork);
+  const [_, setInitialized] = useState(false);
+
+  const initializeClient = async () => {
+    setInitialized(false);
+    if (!squid) return;
+    await squid.init();
+    setInitialized(true);
+  };
+
+  const squid = useMemo(
+    () =>
+      new Squid({
+        baseUrl: ENVIRONMENT_CONFIG_MAP[selectedNetwork]?.endpoints['0xsquid'],
+        integratorId: ENVIRONMENT_CONFIG_MAP[selectedNetwork]?.squidIntegratorId,
+      }),
+    [selectedNetwork]
+  );
+
+  useEffect(() => {
+    if (squid) {
+      initializeClient();
+    }
+  }, [squid]);
+
+  return squid;
+};
+
+type SquidContextType = ReturnType<typeof useSquidContext>;
+const SquidContext = createContext<SquidContextType | undefined>(undefined);
+SquidContext.displayName = '0xSquid';
+
+export const SquidProvider = ({ ...props }) => (
+  <SquidContext.Provider value={useSquidContext()} {...props} />
+);
+
+export const useSquid = () => useContext(SquidContext);

src/hooks/useTestFlags.tsx

@@ -0,0 +1,46 @@
+import { createContext, useContext, useEffect, useState } from 'react';
+import { useLocation } from 'react-router-dom';
+import queryString from 'query-string';
+
+class TestFlags {
+  public queryParams: queryString.ParsedQuery<string>;
+
+  constructor() {
+    this.queryParams = {};
+  }
+
+  setQueryParams(flags: queryString.ParsedQuery<string>) {
+    this.queryParams = flags;
+  }
+
+  get displayInitializingMarkets() {
+    return !!this.queryParams.displayInitializingMarkets;
+  }
+}
+
+export const testFlags = new TestFlags();
+
+const useTestFlagsContext = () => {
+  const [queryParams, setQueryParams] = useState<queryString.ParsedQuery<string>>({});
+  const location = useLocation();
+
+  useEffect(() => {
+    const parsedQueryParams = queryString.parse(location.search.substring(-1));
+    testFlags.setQueryParams(parsedQueryParams);
+    setQueryParams(parsedQueryParams);
+  }, []);
+
+  return {
+    ...queryParams,
+  };
+};
+
+type TestFlagsContextType = ReturnType<typeof useTestFlagsContext>;
+const TestFlagsContext = createContext<TestFlagsContextType>({} as TestFlagsContextType);
+TestFlagsContext.displayName = 'TestFlags';
+
+export const TestFlagsProvider = ({ ...props }) => (
+  <TestFlagsContext.Provider value={useTestFlagsContext()} {...props} />
+);
+
+export const useTestFlags = () => useContext(TestFlagsContext);

src/hooks/useTradeFormInputs.ts

@@ -1,30 +0,0 @@
-import { getTradeFormInputs } from '@/state/inputsSelectors';
-import { useEffect } from 'react';
-import { shallowEqual, useSelector } from 'react-redux';
-
-import { TradeInputField } from '@/constants/abacus';
-
-import abacusStateManager from '@/lib/abacus';
-
-export const useTradeFormInputs = () => {
-  const tradeFormInputValues = useSelector(getTradeFormInputs, shallowEqual);
-  const { limitPriceInput, triggerPriceInput, trailingPercentInput } = tradeFormInputValues;
-
-  useEffect(() => {
-    abacusStateManager.setTradeValue({
-      value: triggerPriceInput,
-      field: TradeInputField.triggerPrice,
-    });
-  }, [triggerPriceInput]);
-
-  useEffect(() => {
-    abacusStateManager.setTradeValue({ value: limitPriceInput, field: TradeInputField.limitPrice });
-  }, [limitPriceInput]);
-
-  useEffect(() => {
-    abacusStateManager.setTradeValue({
-      value: trailingPercentInput,
-      field: TradeInputField.trailingPercent,
-    });
-  }, [trailingPercentInput]);
-};

src/icons/index.ts

@@ -32,7 +32,6 @@ export { default as GiftboxIcon } from './giftbox.svg';
 export { default as HelpCircleIcon } from './help-circle.svg';
 export { default as HideIcon } from './hide.svg';
 export { default as HistoryIcon } from './history.svg';
-export { default as LeaderboardIcon } from './leaderboard.svg';
 export { default as LinkOutIcon } from './link-out.svg';
 export { default as LockIcon } from './lock.svg';
 export { default as LogoShortIcon } from './logo-short';

src/icons/leaderboard.svg

@@ -1,3 +0,0 @@
-<svg width="13" height="14" viewBox="0 0 13 14" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M0.0996094 2.60156C0.0996094 2.07113 0.310323 1.56242 0.685396 1.18735C1.06047 0.812276 1.56918 0.601563 2.09961 0.601562H10.8996C11.43 0.601563 11.9387 0.812276 12.3138 1.18735C12.6889 1.56242 12.8996 2.07113 12.8996 2.60156C12.8996 3.132 12.6889 3.6407 12.3138 4.01578C11.9387 4.39085 11.43 4.60156 10.8996 4.60156H2.09961C1.56918 4.60156 1.06047 4.39085 0.685396 4.01578C0.310323 3.6407 0.0996094 3.132 0.0996094 2.60156ZM0.699609 6.26796C0.540479 6.26796 0.387867 6.33118 0.275345 6.4437C0.162823 6.55622 0.0996094 6.70883 0.0996094 6.86796C0.0996094 7.02709 0.162823 7.1797 0.275345 7.29223C0.387867 7.40475 0.540479 7.46796 0.699609 7.46796H12.2996C12.4587 7.46796 12.6114 7.40475 12.7239 7.29223C12.8364 7.1797 12.8996 7.02709 12.8996 6.86796C12.8996 6.70883 12.8364 6.55622 12.7239 6.4437C12.6114 6.33118 12.4587 6.26796 12.2996 6.26796H0.699609ZM0.699609 9.13196C0.540479 9.13196 0.387867 9.19518 0.275345 9.3077C0.162823 9.42022 0.0996094 9.57283 0.0996094 9.73196C0.0996094 9.89109 0.162823 10.0437 0.275345 10.1562C0.387867 10.2687 0.540479 10.332 0.699609 10.332H12.2996C12.4587 10.332 12.6114 10.2687 12.7239 10.1562C12.8364 10.0437 12.8996 9.89109 12.8996 9.73196C12.8996 9.57283 12.8364 9.42022 12.7239 9.3077C12.6114 9.19518 12.4587 9.13196 12.2996 9.13196H0.699609ZM0.699609 12.0016C0.540479 12.0016 0.387867 12.0648 0.275345 12.1773C0.162823 12.2898 0.0996094 12.4424 0.0996094 12.6016C0.0996094 12.7607 0.162823 12.9133 0.275345 13.0258C0.387867 13.1383 0.540479 13.2016 0.699609 13.2016H12.2996C12.4587 13.2016 12.6114 13.1383 12.7239 13.0258C12.8364 12.9133 12.8996 12.7607 12.8996 12.6016C12.8996 12.4424 12.8364 12.2898 12.7239 12.1773C12.6114 12.0648 12.4587 12.0016 12.2996 12.0016H0.699609Z" fill="currentColor"/>
-</svg>

src/layout/DialogManager.tsx

@@ -11,13 +11,13 @@ import { DepositDialog } from '@/views/dialogs/DepositDialog';
 import { DisconnectDialog } from '@/views/dialogs/DisconnectDialog';
 import { ExchangeOfflineDialog } from '@/views/dialogs/ExchangeOfflineDialog';
 import { HelpDialog } from '@/views/dialogs/HelpDialog';
-import { ExternalLinkDialog } from '@/views/dialogs/ExternalLinkDialog';
 import { ExternalNavKeplrDialog } from '@/views/dialogs/ExternalNavKeplrDialog';
 import { MnemonicExportDialog } from '@/views/dialogs/MnemonicExportDialog';
 import { MobileSignInDialog } from '@/views/dialogs/MobileSignInDialog';
 import { OnboardingDialog } from '@/views/dialogs/OnboardingDialog';
 import { PreferencesDialog } from '@/views/dialogs/PreferencesDialog';
 import { RateLimitDialog } from '@/views/dialogs/RateLimitDialog';
+import { ReceiveDialog } from '@/views/dialogs/ReceiveDialog';
 import { RestrictedGeoDialog } from '@/views/dialogs/RestrictedGeoDialog';
 import { TradeDialog } from '@/views/dialogs/TradeDialog';
 import { TransferDialog } from '@/views/dialogs/TransferDialog';
@@ -54,13 +54,13 @@ export const DialogManager = () => {
     [DialogTypes.FillDetails]: <FillDetailsDialog {...modalProps} />,
     [DialogTypes.Help]: <HelpDialog {...modalProps} />,
     [DialogTypes.ExternalNavKeplr]: <ExternalNavKeplrDialog {...modalProps} />,
-    [DialogTypes.ExternalLink]: <ExternalLinkDialog {...modalProps} />,
     [DialogTypes.MnemonicExport]: <MnemonicExportDialog {...modalProps} />,
     [DialogTypes.MobileSignIn]: <MobileSignInDialog {...modalProps} />,
     [DialogTypes.Onboarding]: <OnboardingDialog {...modalProps} />,
     [DialogTypes.OrderDetails]: <OrderDetailsDialog {...modalProps} />,
     [DialogTypes.Preferences]: <PreferencesDialog {...modalProps} />,
     [DialogTypes.RateLimit]: <RateLimitDialog {...modalProps} />,
+    [DialogTypes.Receive]: <ReceiveDialog {...modalProps} />,
     [DialogTypes.RestrictedGeo]: <RestrictedGeoDialog {...modalProps} />,
     [DialogTypes.RestrictedWallet]: <RestrictedWalletDialog {...modalProps} />,
     [DialogTypes.Trade]: <TradeDialog {...modalProps} />,

src/layout/Footer/FooterDesktop.tsx

@@ -1,7 +1,7 @@
 import styled, { type AnyStyledComponent, css } from 'styled-components';
 
 import { AbacusApiStatus } from '@/constants/abacus';
-import { ButtonSize, ButtonType } from '@/constants/buttons';
+import { ButtonSize } from '@/constants/buttons';
 import { STRING_KEYS } from '@/constants/localization';
 import { ENVIRONMENT_CONFIG_MAP, isDev } from '@/constants/networks';
 
@@ -55,12 +55,10 @@ export const FooterDesktop = () => {
           }
         >
           <Styled.FooterButton
-            type={statusPage ? ButtonType.Link : ButtonType.Button}
             slotLeft={<Styled.StatusDot exchangeStatus={exchangeStatus} />}
             slotRight={statusPage && <LinkOutIcon />}
             size={ButtonSize.XSmall}
             state={{ isDisabled: !statusPage }}
-            href={statusPage}
           >
             {label}
           </Styled.FooterButton>
@@ -134,7 +132,7 @@ Styled.StatusDot = styled.div<{ exchangeStatus: ExchangeStatus }>`
 Styled.FooterButton = styled(Button)`
   --button-height: 1.5rem;
   --button-radius: 0.25rem;
-  --button-backgroundColor: transparent;
+  --button-backgroundColor: var(--color-layer-2);
   --button-border: none;
   --button-textColor: var(--color-text-0);
 

src/layout/Footer/FooterMobile.tsx

@@ -1,6 +1,7 @@
 import styled, { type AnyStyledComponent } from 'styled-components';
 import { useDispatch, useSelector } from 'react-redux';
 
+import { ButtonAction, ButtonSize } from '@/constants/buttons';
 import { DialogTypes } from '@/constants/dialogs';
 import { STRING_KEYS } from '@/constants/localization';
 import { DEFAULT_MARKETID } from '@/constants/markets';
@@ -10,8 +11,8 @@ import { useShouldShowFooter, useStringGetter } from '@/hooks';
 import { layoutMixins } from '@/styles/layoutMixins';
 
 import { NavigationMenu } from '@/components/NavigationMenu';
-import { Icon, IconName } from '@/components/Icon';
+import { Icon } from '@/components/Icon';
-import { BellIcon, MarketsIcon, PortfolioIcon, ProfileIcon } from '@/icons';
+import { BellIcon, MarketsIcon, PlayIcon, PortfolioIcon, ProfileIcon, TradeIcon } from '@/icons';
 import { IconButton } from '@/components/IconButton';
 
 import { calculateCanAccountTrade } from '@/state/accountCalculators';
@@ -41,9 +42,11 @@ export const FooterMobile = () => {
                     value: 'trade',
                     label: stringGetter({ key: STRING_KEYS.TRADE }),
                     slotBefore: (
-                      <Styled.StartIcon>
+                      <Styled.IconButton
-                        <Icon iconName={IconName.Trade} />
+                        iconComponent={TradeIcon}
-                      </Styled.StartIcon>
+                        size={ButtonSize.Large}
+                        action={ButtonAction.Primary}
+                      />
                     ),
                     href: `${AppRoute.Trade}/${marketId ?? DEFAULT_MARKETID}`,
                   }
@@ -51,9 +54,11 @@ export const FooterMobile = () => {
                     value: 'onboarding',
                     label: stringGetter({ key: STRING_KEYS.ONBOARDING }),
                     slotBefore: (
-                      <Styled.StartIcon>
+                      <Styled.IconButton
-                        <Icon iconName={IconName.Play} />
+                        iconComponent={PlayIcon}
-                      </Styled.StartIcon>
+                        size={ButtonSize.Large}
+                        action={ButtonAction.Primary}
+                      />
                     ),
                     onClick: () => dispatch(openDialog({ type: DialogTypes.Onboarding })),
                   },
@@ -163,24 +168,3 @@ Styled.IconButton = styled(IconButton)`
 Styled.Icon = styled(Icon)`
   font-size: 1.5rem;
 `;
-
-Styled.StartIcon = styled.div`
-  display: inline-flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  margin-top: -0.25rem;
-
-  width: 3.5rem;
-  height: 3.5rem;
-
-  color: var(--color-text-2);
-  background-color: var(--color-accent);
-  border: solid var(--border-width) var(--color-border-white);
-  border-radius: 50%;
-
-  svg {
-    width: 1.5rem;
-    height: 1.5rem;
-  }
-`;

src/layout/Header/HeaderDesktop.tsx

@@ -1,6 +1,6 @@
 import styled, { type AnyStyledComponent } from 'styled-components';
 import { Link } from 'react-router-dom';
-import { useDispatch, useSelector } from 'react-redux';
+import { useDispatch } from 'react-redux';
 
 import { ButtonShape } from '@/constants/buttons';
 import { DialogTypes } from '@/constants/dialogs';
@@ -8,10 +8,6 @@ import { STRING_KEYS } from '@/constants/localization';
 import { AppRoute } from '@/constants/routes';
 import { LogoShortIcon, BellStrokeIcon } from '@/icons';
 
-import { headerMixins } from '@/styles/headerMixins';
-import { layoutMixins } from '@/styles/layoutMixins';
-import breakpoints from '@/styles/breakpoints';
-
 import { useTokenConfigs, useStringGetter, useURLConfigs } from '@/hooks';
 
 import { Icon, IconName } from '@/components/Icon';
@@ -25,7 +21,10 @@ import { NotificationsMenu } from '@/views/menus/NotificationsMenu';
 import { LanguageSelector } from '@/views/menus/LanguageSelector';
 
 import { openDialog } from '@/state/dialogs';
-import { getHasSeenLaunchIncentives } from '@/state/configsSelectors';
+
+import { headerMixins } from '@/styles/headerMixins';
+import { layoutMixins } from '@/styles/layoutMixins';
+import breakpoints from '@/styles/breakpoints';
 
 export const HeaderDesktop = () => {
   const stringGetter = useStringGetter();
@@ -33,8 +32,6 @@ export const HeaderDesktop = () => {
   const dispatch = useDispatch();
   const { chainTokenLabel } = useTokenConfigs();
 
-  const hasSeenLaunchIncentives = useSelector(getHasSeenLaunchIncentives);
-
   const navItems = [
     {
       group: 'navigation',
@@ -58,7 +55,6 @@ export const HeaderDesktop = () => {
           value: chainTokenLabel,
           label: chainTokenLabel,
           href: `/${chainTokenLabel}`,
-          slotAfter: !hasSeenLaunchIncentives && <Styled.UnreadIndicator />,
         },
         {
           value: 'MORE',
@@ -242,10 +238,3 @@ Styled.IconButton = styled(IconButton)<{ size?: string }>`
   --button-icon-size: 1rem;
   --button-padding: 0 0.5em;
 `;
-
-Styled.UnreadIndicator = styled.div`
-  width: 0.4375rem;
-  height: 0.4375rem;
-  border-radius: 50%;
-  background-color: var(--color-accent);
-`;

src/layout/NotificationsToastArea.tsx

@@ -1,17 +1,15 @@
-import { useMemo, useState } from 'react';
+import { useMemo } from 'react';
 import styled, { css } from 'styled-components';
 
 import { NotificationStatus } from '@/constants/notifications';
-import { ButtonShape, ButtonSize } from '@/constants/buttons';
+import { ButtonSize } from '@/constants/buttons';
+
 import { useNotifications } from '@/hooks/useNotifications';
 import { useBreakpoints } from '@/hooks/useBreakpoints';
-import { ChevronLeftIcon } from '@/icons';
-import { breakpoints } from '@/styles';
 
 import { Button } from '@/components/Button';
 import { Toast } from '@/components/Toast';
 import { ToastArea } from '@/components/ToastArea';
-import { ToggleButton } from '@/components/ToggleButton';
 
 type StyleProps = {
   className?: string;
@@ -20,8 +18,6 @@ type StyleProps = {
 const MAX_TOASTS = 10;
 
 export const NotificationsToastArea = ({ className }: StyleProps) => {
-  const [shouldStackNotifications, setshouldStackNotifications] = useState(true);
-
   const {
     notifications,
     getKey,
@@ -47,37 +43,20 @@ export const NotificationsToastArea = ({ className }: StyleProps) => {
           key: getKey(notification),
           displayData: getDisplayData(notification),
         }))
-        .filter(
+        .filter(({ displayData }) => displayData)
-          ({ displayData, notification }) =>
-            displayData && notification.status < NotificationStatus.Unseen
-        )
         .slice(-MAX_TOASTS)
     );
   }, [notifications, getKey, getDisplayData]);
 
   if (isMenuOpen) return null;
 
-  const hasMultipleToasts = notificationMap.length > 1;
-
   return (
     <StyledToastArea swipeDirection={isMobile ? 'up' : 'right'} className={className}>
-      {hasMultipleToasts && (
-        <StyledToggleButton
-          shape={ButtonShape.Pill}
-          size={ButtonSize.XSmall}
-          isPressed={shouldStackNotifications}
-          onPressedChange={() => setshouldStackNotifications(!shouldStackNotifications)}
-        >
-          <ChevronLeftIcon />
-        </StyledToggleButton>
-      )}
-
       {notificationMap.map(({ notification, key, displayData }, idx) => (
         <StyledToast
           key={key}
-          isStacked={shouldStackNotifications}
-          isOpen={notification.status < NotificationStatus.Unseen}
           layer={notificationMap.length - 1 - idx}
+          isOpen={notification.status < NotificationStatus.Unseen}
           notification={notification}
           slotIcon={displayData.icon}
           slotTitle={displayData.title}
@@ -95,7 +74,7 @@ export const NotificationsToastArea = ({ className }: StyleProps) => {
           actionAltText={displayData.actionAltText}
           duration={displayData.toastDuration ?? Infinity}
           sensitivity={displayData.toastSensitivity}
-          setIsOpen={(isOpen: boolean, isClosedFromTimeout?: boolean) => {
+          setIsOpen={(isOpen, isClosedFromTimeout) => {
             if (!isOpen)
               if (isClosedFromTimeout)
                 // Toast timer expired without user interaction
@@ -118,58 +97,16 @@ const StyledToastArea = styled(ToastArea)`
   padding: 0.75rem 0.75rem 0.75rem 0;
 
   mask-image: linear-gradient(to left, transparent, white 0.5rem);
-
-  @media ${breakpoints.mobile} {
-    width: 100%;
-    position: fixed;
-  }
 `;
 
-const StyledToast = styled(Toast)<{ isStacked?: boolean; layer: number }>`
+const StyledToast = styled(Toast)<{ layer: number }>`
   // Stacked toast
-  ${({ isStacked, layer }) =>
-    isStacked
-      ? css`
-          position: absolute;
-          left: 0;
-          top: calc(${layer} * 2px);
-          right: calc(${layer} * -2px);
-        `
-      : css`
-          margin-bottom: 0.75rem;
-        `}
-`;
-
-const StyledToggleButton = styled(ToggleButton)<{ isPressed: boolean }>`
-  z-index: 2;
-  pointer-events: auto;
-  display: none;
   position: absolute;
-  top: 4px;
+  top: 0;
-  left: calc(50% - 0.75rem);
+  left: 0;
-  --button-width: 2rem;
+  right: 0;
-  --button-height: 1rem;
+  ${({ layer }) => css`
-
+    right: calc(${layer} * -2px);
-  ${StyledToastArea}:hover & {
+    top: calc(${layer} * 2px);
-    display: flex;
+  `}
-  }
-
-  > svg {
-    width: 4px;
-    margin-top: 1px;
-    transform: rotate(-90deg);
-
-    ${({ isPressed }) =>
-      !isPressed &&
-      css`
-        transform: rotate(90deg);
-      `}
-  }
-
-  @media ${breakpoints.mobile} {
-    display: flex;
-    left: calc(50% - 2rem);
-    --button-width: 4rem;
-    --button-height: 2rem;
-  }
 `;

src/lib/abacus/dydxChainTransactions.ts

@@ -1,7 +1,7 @@
 import Abacus, { type Nullable } from '@dydxprotocol/v4-abacus';
 import Long from 'long';
 import type { IndexedTx } from '@cosmjs/stargate';
-import { GAS_MULTIPLIER, encodeJson } from '@dydxprotocol/v4-client-js';
+import { encodeJson } from '@dydxprotocol/v4-client-js';
 
 import {
   CompositeClient,
@@ -9,7 +9,6 @@ import {
   type LocalWallet,
   Network,
   NetworkOptimizer,
-  NobleClient,
   SubaccountClient,
   ValidatorConfig,
   OrderType,
@@ -44,10 +43,8 @@ import { log } from '../telemetry';
 
 class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
   private compositeClient: CompositeClient | undefined;
-  private nobleClient: NobleClient | undefined;
   private store: RootStore | undefined;
   private localWallet: LocalWallet | undefined;
-  private nobleWallet: LocalWallet | undefined;
 
   constructor() {
     this.compositeClient = undefined;
@@ -62,13 +59,6 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
     this.localWallet = localWallet;
   }
 
-  setNobleWallet(nobleWallet: LocalWallet) {
-    this.nobleWallet = nobleWallet;
-    if (this.nobleClient) {
-      this.nobleClient.connect(nobleWallet);
-    }
-  }
-
   async connectNetwork(
     paramsInJson: Nullable<string>,
     callback: (p0: Nullable<string>) => void
@@ -80,7 +70,6 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
         websocketUrl,
         validatorUrl,
         chainId,
-        nobleValidatorUrl,
         USDC_DENOM,
         USDC_DECIMALS,
         USDC_GAS_DENOM,
@@ -112,10 +101,6 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
 
       this.compositeClient = compositeClient;
 
-      if (nobleValidatorUrl) {
-        this.nobleClient = new NobleClient(nobleValidatorUrl);
-        if (this.nobleWallet) await this.nobleClient.connect(this.nobleWallet);
-      }
       // Dispatch custom event to notify other parts of the app that the network has been connected
       const customEvent = new CustomEvent('abacus:connectNetwork', {
         detail: parsedParams,
@@ -340,46 +325,6 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
     }
   }
 
-  async sendNobleIBC(
-    params: {
-      msgTypeUrl: string,
-      msg: any,
-    }
-  ): Promise<string> {
-    if (!this.nobleClient?.isConnected) {
-      throw new Error('Missing nobleClient or localWallet');
-    }
-
-    try {
-      const ibcMsg = {
-        typeUrl: params.msgTypeUrl, // '/ibc.applications.transfer.v1.MsgTransfer',
-        value: params.msg,
-      };
-      const fee = await this.nobleClient.simulateTransaction([ibcMsg]);
-  
-      // take out fee from amount before sweeping
-      const amount = parseInt(ibcMsg.value.token.amount, 10) -
-        Math.floor(parseInt(fee.amount[0].amount, 10) * GAS_MULTIPLIER);
-  
-      if (amount <= 0) {
-        throw new Error('noble balance does not cover fees');
-      }
-  
-      ibcMsg.value.token.amount = amount.toString();
-      const tx = await this.nobleClient.send([ibcMsg]);
-
-      const parsedTx = this.parseToPrimitives(tx);
-
-      return JSON.stringify(parsedTx);
-    } catch (error) {
-      log('DydxChainTransactions/sendNobleIBC', error);
-
-      return JSON.stringify({
-        error,
-      });
-    }
-  }
-
   async transaction(
     type: TransactionTypes,
     paramsInJson: Abacus.Nullable<string>,
@@ -409,11 +354,6 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
           callback(result);
           break;
         }
-        case TransactionType.SendNobleIBC: {
-          const result = await this.sendNobleIBC(params);
-          callback(result);
-          break;
-        }
         default: {
           break;
         }
@@ -501,13 +441,6 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
           const parseDelegations = this.parseToPrimitives(delegations);
           callback(JSON.stringify(parseDelegations));
           break;
-        case QueryType.GetNobleBalance:
-          if (this.nobleClient?.isConnected) {
-            const nobleBalance = await this.nobleClient.getAccountBalance('uusdc');
-            const parsedNobleBalance = this.parseToPrimitives(nobleBalance);
-            callback(JSON.stringify(parsedNobleBalance));
-          }
-          break;
         default:
           break;
       }

src/lib/abacus/index.ts

@@ -26,14 +26,12 @@ import {
 } from '@/constants/abacus';
 
 import { DEFAULT_MARKETID } from '@/constants/markets';
-import { CURRENT_ABACUS_DEPLOYMENT, type DydxNetwork, isMainnet } from '@/constants/networks';
+import { CURRENT_ABACUS_DEPLOYMENT, type DydxNetwork } from '@/constants/networks';
-import { CLEARED_SIZE_INPUTS, CLEARED_TRADE_INPUTS } from '@/constants/trade';
 
 import type { RootStore } from '@/state/_store';
-import { setTradeFormInputs } from '@/state/inputs';
-import { getInputTradeOptions, getTransferInputs } from '@/state/inputsSelectors';
 
-import { testFlags } from '@/lib/testFlags';
+import { getInputTradeOptions } from '@/state/inputsSelectors';
+import { getTransferInputs } from '@/state/inputsSelectors';
 
 import AbacusRest from './rest';
 import AbacusAnalytics from './analytics';
@@ -45,7 +43,6 @@ import AbacusFormatter from './formatter';
 import AbacusThreading from './threading';
 import AbacusFileSystem from './filesystem';
 import { LocaleSeparators } from '../numbers';
-
 class AbacusStateManager {
   private store: RootStore | undefined;
   private currentMarket: string | undefined;
@@ -83,14 +80,10 @@ class AbacusStateManager {
       this.abacusFormatter
     );
 
-    const appConfigs = AbacusAppConfig.Companion.forWeb;
-    if (!isMainnet || testFlags.withCCTP)
-      appConfigs.squidVersion = AbacusAppConfig.SquidVersion.V2DepositOnly;
-
     this.stateManager = new AsyncAbacusStateManager(
       '',
       CURRENT_ABACUS_DEPLOYMENT,
-      appConfigs,
+      AbacusAppConfig.Companion.forWeb,
       ioImplementations,
       uiImplementations,
       // @ts-ignore
@@ -139,8 +132,6 @@ class AbacusStateManager {
       this.setTradeValue({ value: null, field: TradeInputField.limitPrice });
     }
 
-    this.store?.dispatch(setTradeFormInputs(CLEARED_TRADE_INPUTS));
-
     if (shouldResetSize) {
       this.setTradeValue({ value: null, field: TradeInputField.size });
       this.setTradeValue({ value: null, field: TradeInputField.usdcSize });
@@ -148,8 +139,6 @@ class AbacusStateManager {
       if (needsLeverage) {
         this.setTradeValue({ value: null, field: TradeInputField.leverage });
       }
-
-      this.store?.dispatch(setTradeFormInputs(CLEARED_SIZE_INPUTS));
     }
   };
 
@@ -186,12 +175,6 @@ class AbacusStateManager {
     }
   };
 
-  setNobleWallet = (nobleWallet?: LocalWallet) => {
-    if (nobleWallet) {
-      this.chainTransactions.setNobleWallet(nobleWallet);
-    }
-  };
-
   setTransfersSourceAddress = (evmAddress: string) => {
     this.stateManager.sourceAddress = evmAddress;
   };
@@ -235,6 +218,18 @@ class AbacusStateManager {
     this.abacusFormatter.setLocaleSeparators({ group, decimal });
   };
 
+  setTransferStatus = ({
+    hash,
+    fromChainId,
+    toChainId,
+  }: {
+    hash: string;
+    fromChainId?: string;
+    toChainId?: string;
+  }) => {
+    this.stateManager.transferStatus(hash, fromChainId, toChainId);
+  };
+
   // ------ Transactions ------ //
 
   placeOrder = (

src/lib/abacus/websocket.ts

@@ -10,7 +10,7 @@ import {
 } from '@/constants/websocket';
 
 import { lastSuccessfulWebsocketRequestByOrigin } from '@/hooks/useAnalytics';
-import { testFlags } from '@/lib/testFlags';
+import { testFlags } from '@/hooks/useTestFlags';
 
 import { subscriptionsByChannelId } from '@/lib/tradingView/dydxfeed/cache';
 import { mapCandle } from '@/lib/tradingView/utils';

src/lib/squid.ts

@@ -1,48 +0,0 @@
-import { isMainnet } from '@/constants/networks';
-import { GetStatus, StatusResponse } from '@0xsquid/sdk';
-
-export const NATIVE_TOKEN_ADDRESS = '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE';
-
-export const STATUS_ERROR_GRACE_PERIOD = 300_000;
-
-const getSquidStatusUrl = (isV2: boolean) => {
-  if (isV2) {
-    return isMainnet
-      ? 'https://v2.api.squidrouter.com/v2/status'
-      : 'https://testnet.v2.api.squidrouter.com/v2/status';
-  }
-  return isMainnet
-    ? 'https://api.squidrouter.com/v1/status'
-    : 'https://testnet.api.squidrouter.com/v1/status';
-};
-
-export const fetchSquidStatus = async (
-  params: GetStatus,
-  isV2?: boolean,
-  integratorId?: string
-): Promise<StatusResponse> => {
-  const parsedParams: { [key: string]: string } = {
-    transactionId: params.transactionId,
-    fromChainId: String(params.fromChainId),
-    toChainId: String(params.toChainId),
-  };
-  if (isV2) parsedParams.bridgeType = 'cctp';
-  const url = `${getSquidStatusUrl(!!isV2)}?${new URLSearchParams(parsedParams).toString()}`;
-
-  const response = await fetch(url, {
-    headers: {
-      "x-integrator-id": integratorId || 'dYdX-api'
-    },
-  });
-
-  if (!response.ok) {
-    const error = await response.json();
-    throw new Error(error);
-  }
-
-  return response.json();
-};
-
-export const getNobleChainId = () => {
-  return isMainnet ? 'noble-1' : 'grand-1';
-}

src/lib/testFlags.ts

@@ -1,31 +0,0 @@
-class TestFlags {
-  public queryParams: { [key: string]: string };
-
-  constructor() {
-    this.queryParams = {};
-    const hash = window.location.hash;
-    const queryIndex = hash.indexOf('?');
-    if (queryIndex === -1) return
-
-    const queryParamsString = hash.substring(queryIndex + 1);
-    const params = new URLSearchParams(queryParamsString);
-
-    for (const [key, value] of params) {
-        this.queryParams[key] = value;
-    }
-  }
-
-  get displayInitializingMarkets() {
-    return !!this.queryParams.displayInitializingMarkets;
-  }
-
-  get displayAllMarkets() {
-    return !!this.queryParams.displayAllMarkets;
-  }
-
-  get withCCTP() {
-    return !!this.queryParams.withCCTP;
-  }
-}
-
-export const testFlags = new TestFlags();

src/pages/Profile.tsx

@@ -2,16 +2,12 @@ import styled, { AnyStyledComponent, css } from 'styled-components';
 import { Link } from 'react-router-dom';
 import { useDispatch, useSelector } from 'react-redux';
 import { useEnsName } from 'wagmi';
-import { useNavigate } from 'react-router-dom';
 
 import { ButtonSize } from '@/constants/buttons';
-import { TransferInputField, TransferType } from '@/constants/abacus';
-
-import { layoutMixins } from '@/styles/layoutMixins';
 
 import { Details } from '@/components/Details';
 import { FillsTable, FillsTableColumnKey } from '@/views/tables/FillsTable';
-import { Icon, IconName } from '@/components/Icon';
+import { IconName } from '@/components/Icon';
 import { IconButton, type IconButtonProps } from '@/components/IconButton';
 import { Panel } from '@/components/Panel';
 import { Toolbar } from '@/components/Toolbar';
@@ -20,22 +16,22 @@ import { OnboardingState } from '@/constants/account';
 import { DialogTypes } from '@/constants/dialogs';
 import { STRING_KEYS } from '@/constants/localization';
 import { AppRoute, PortfolioRoute, HistoryRoute } from '@/constants/routes';
-import { wallets } from '@/constants/wallets';
+import { wallets, WalletType } from '@/constants/wallets';
 import { useAccounts, useStringGetter, useTokenConfigs } from '@/hooks';
 
 import { getOnboardingState } from '@/state/accountSelectors';
 import { openDialog } from '@/state/dialogs';
 
-import abacusStateManager from '@/lib/abacus';
 import { isTruthy } from '@/lib/isTruthy';
 import { truncateAddress } from '@/lib/wallet';
 
+import { layoutMixins } from '@/styles/layoutMixins';
+
 const ENS_CHAIN_ID = 1; // Ethereum
 
 const Profile = () => {
   const stringGetter = useStringGetter();
   const dispatch = useDispatch();
-  const navigate = useNavigate();
 
   const onboardingState = useSelector(getOnboardingState);
   const isConnected = onboardingState !== OnboardingState.Disconnected;
@@ -50,48 +46,17 @@ const Profile = () => {
 
   const actions = [
     {
-      key: 'deposit',
+      key: 'settings',
-      label: stringGetter({ key: STRING_KEYS.DEPOSIT }),
+      label: stringGetter({ key: STRING_KEYS.SETTINGS }),
-      icon: { iconName: IconName.Deposit },
+      icon: { iconName: IconName.Gear },
-      onClick: () => {
+      href: AppRoute.Settings,
-        dispatch(
-          openDialog({
-            type: DialogTypes.ManageFunds,
-            dialogProps: {
-              selectedTransferType: TransferType.deposit.rawValue,
-            },
-          })
-        );
-      },
     },
-    {
+    isConnected && {
-      key: 'withdraw',
+      key: 'transfers',
-      label: stringGetter({ key: STRING_KEYS.WITHDRAW }),
+      label: stringGetter({ key: STRING_KEYS.MANAGE_FUNDS }),
-      icon: { iconName: IconName.Withdraw },
+      icon: { iconName: IconName.Transfer },
       onClick: () => {
-        dispatch(
+        dispatch(openDialog({ type: DialogTypes.ManageFunds }));
-          openDialog({
-            type: DialogTypes.ManageFunds,
-            dialogProps: {
-              selectedTransferType: TransferType.withdrawal.rawValue,
-            },
-          })
-        );
-      },
-    },
-    {
-      key: 'transfer',
-      label: stringGetter({ key: STRING_KEYS.TRANSFER }),
-      icon: { iconName: IconName.Send },
-      onClick: () => {
-        dispatch(
-          openDialog({
-            type: DialogTypes.ManageFunds,
-            dialogProps: {
-              selectedTransferType: TransferType.transferOut.rawValue,
-            },
-          })
-        );
       },
     },
     isConnected
@@ -104,9 +69,9 @@ const Profile = () => {
           },
         }
       : {
-          key: 'connect',
+          key: 'wallet',
-          label: stringGetter({ key: STRING_KEYS.CONNECT }),
+          label: stringGetter({ key: STRING_KEYS.WALLET }),
-          icon: { iconName: IconName.Transfer },
+          icon: { iconComponent: wallets[walletType || WalletType.OtherWallet].icon },
           onClick: () => {
             dispatch(openDialog({ type: DialogTypes.Onboarding }));
           },
@@ -142,7 +107,12 @@ const Profile = () => {
         {actions.map(({ key, label, href, icon, onClick }) => {
           const action = (
             <>
-              <Styled.ActionButton {...icon} size={ButtonSize.Large} onClick={onClick} />
+              <Styled.ActionButton
+                {...icon}
+                size={ButtonSize.Large}
+                onClick={onClick}
+                isCloseIcon={icon.iconName === IconName.Close}
+              />
               <span>{label}</span>
             </>
           );
@@ -155,26 +125,6 @@ const Profile = () => {
           );
         })}
       </Styled.Actions>
-      <Styled.EqualGrid>
-        <Styled.PanelButton
-          slotHeader={
-            <Styled.InlineRow>
-              <Icon iconName={IconName.Gear} />
-              {stringGetter({ key: STRING_KEYS.SETTINGS })}
-            </Styled.InlineRow>
-          }
-          onClick={() => navigate(AppRoute.Settings)}
-        />
-        <Styled.PanelButton
-          slotHeader={
-            <Styled.InlineRow>
-              <Icon iconName={IconName.HelpCircle} />
-              {stringGetter({ key: STRING_KEYS.HELP })}
-            </Styled.InlineRow>
-          }
-          onClick={() => dispatch(openDialog({ type: DialogTypes.Help }))}
-        />
-      </Styled.EqualGrid>
 
       <Styled.EqualGrid>
         <Panel
@@ -233,7 +183,7 @@ Styled.MobileProfileLayout = styled.div`
   ${layoutMixins.contentContainerPage}
 
   gap: 1rem;
-  padding: 1.25rem 0.9rem;
+  padding: 1.25rem;
 `;
 
 Styled.Header = styled.header`
@@ -298,21 +248,19 @@ Styled.Actions = styled(Toolbar)`
   }
 `;
 
-Styled.ActionButton = styled(IconButton)<{ iconName?: IconName }>`
+Styled.ActionButton = styled(IconButton)<{ isCloseIcon?: boolean }>`
   margin-bottom: 0.5rem;
 
-  ${({ iconName }) =>
+  ${({ isCloseIcon }) =>
-    iconName === IconName.Close
+    isCloseIcon &&
-      ? css`
+    css`
-          --button-textColor: var(--color-negative);
+      --button-textColor: var(--color-negative);
-          --button-icon-size: 0.75em;
+
-        `
+      svg {
-      : iconName === IconName.Transfer &&
+        width: 0.875em;
-        css`
+        height: 0.875em;
-          --button-icon-size: 1.25em;
+      }
-          --button-textColor: var(--color-text-2);
+    `}
-          --button-backgroundColor: var(--color-accent);
-        `}
 `;
 
 Styled.EqualGrid = styled.div`
@@ -361,14 +309,3 @@ Styled.TablePanel = styled(Panel)`
     }
   }
 `;
-
-Styled.InlineRow = styled.div`
-  ${layoutMixins.inlineRow}
-  padding: 1rem;
-  gap: 0.5rem;
-`;
-
-Styled.PanelButton = styled(Panel)`
-  --panel-paddingY: 0
-  --panel-paddingX:0;
-`;

src/pages/rewards/DYDXBalancePanel.tsx

@@ -2,7 +2,6 @@ import type { ElementType } from 'react';
 import styled, { AnyStyledComponent } from 'styled-components';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 
-import breakpoints from '@/styles/breakpoints';
 import { layoutMixins } from '@/styles/layoutMixins';
 import { useAccountBalance, useAccounts, useTokenConfigs, useStringGetter } from '@/hooks';
 
@@ -40,7 +39,7 @@ export const DYDXBalancePanel = () => {
             <AssetIcon symbol={chainTokenLabel} />
             {chainTokenLabel}
           </Styled.Title>
-          <Styled.ActionButtons>
+          <Styled.ReceiveAndTransferButtons>
             {!canAccountTrade ? (
               <OnboardingTriggerButton size={ButtonSize.Small} />
             ) : (
@@ -53,7 +52,7 @@ export const DYDXBalancePanel = () => {
                 {stringGetter({ key: STRING_KEYS.TRANSFER })}
               </Button>
             )}
-          </Styled.ActionButtons>
+          </Styled.ReceiveAndTransferButtons>
         </Styled.Header>
       }
     >
@@ -117,17 +116,12 @@ const Styled: Record<string, AnyStyledComponent> = {};
 
 Styled.Panel = styled(Panel)`
   --panel-paddingX: 1.5rem;
-
-  @media ${breakpoints.tablet} {
-    --panel-paddingY: 1.5rem;
-    --panel-content-paddingY: 1rem;
-  }
 `;
 
 Styled.Header = styled.div`
   ${layoutMixins.spacedRow}
   gap: 1rem;
-  padding: var(--panel-paddingY) var(--panel-paddingX) 0;
+  padding: 1rem 1.5rem 0;
 `;
 
 Styled.Title = styled.h3`
@@ -140,7 +134,7 @@ Styled.Title = styled.h3`
   }
 `;
 
-Styled.ActionButtons = styled(Toolbar)`
+Styled.ReceiveAndTransferButtons = styled(Toolbar)`
   ${layoutMixins.inlineRow}
   --stickyArea-topHeight: max-content;
   gap: 0.5rem;

src/pages/rewards/LaunchIncentivesPanel.tsx

@@ -1,296 +0,0 @@
-import { useEffect } from 'react';
-import { useDispatch } from 'react-redux';
-import { useQuery } from 'react-query';
-import styled, { AnyStyledComponent } from 'styled-components';
-
-import { STRING_KEYS } from '@/constants/localization';
-import { ButtonAction } from '@/constants/buttons';
-import { DialogTypes } from '@/constants/dialogs';
-
-import breakpoints from '@/styles/breakpoints';
-import { useAccounts, useBreakpoints, useStringGetter } from '@/hooks';
-
-import { layoutMixins } from '@/styles/layoutMixins';
-
-import { Panel } from '@/components/Panel';
-import { Button } from '@/components/Button';
-
-import { Output, OutputType } from '@/components/Output';
-import { Icon, IconName } from '@/components/Icon';
-import { Tag, TagSize } from '@/components/Tag';
-
-import { markLaunchIncentivesSeen } from '@/state/configs';
-import { openDialog } from '@/state/dialogs';
-
-import { log } from '@/lib/telemetry';
-
-export const LaunchIncentivesPanel = () => {
-  const { isNotTablet } = useBreakpoints();
-  const dispatch = useDispatch();
-
-  useEffect(() => {
-    dispatch(markLaunchIncentivesSeen());
-  }, []);
-
-  return isNotTablet ? (
-    <Styled.Panel slotHeader={<LaunchIncentivesTitle />} slotRight={<EstimatedRewards />}>
-      <LaunchIncentivesContent />
-    </Styled.Panel>
-  ) : (
-    <Styled.Panel>
-      <Styled.Column>
-        <EstimatedRewards />
-        <LaunchIncentivesTitle />
-        <LaunchIncentivesContent />
-      </Styled.Column>
-    </Styled.Panel>
-  );
-};
-
-const LaunchIncentivesTitle = () => {
-  const stringGetter = useStringGetter();
-  return (
-    <Styled.Title>
-      {stringGetter({
-        key: STRING_KEYS.LAUNCH_INCENTIVES_TITLE,
-        params: {
-          FOR_V4: <Styled.ForV4>{stringGetter({ key: STRING_KEYS.FOR_V4 })}</Styled.ForV4>,
-        },
-      })}
-      <Styled.NewTag size={TagSize.Medium}>{stringGetter({ key: STRING_KEYS.NEW })}</Styled.NewTag>
-    </Styled.Title>
-  );
-};
-
-const EstimatedRewards = () => {
-  const stringGetter = useStringGetter();
-  const { dydxAddress } = useAccounts();
-
-  const { data, isLoading } = useQuery({
-    enabled: !!dydxAddress,
-    queryKey: `launch_incentives_rewards_${dydxAddress ?? ''}`,
-    queryFn: async () => {
-      if (!dydxAddress) return undefined;
-      const resp = await fetch(`https://cloud.chaoslabs.co/query/api/dydx/points/${dydxAddress}`);
-      return (await resp.json())?.incentivePoints;
-    },
-    onError: (error: Error) => log('LaunchIncentives/fetchPoints', error),
-  });
-
-  return (
-    <Styled.EstimatedRewardsCard>
-      <Styled.EstimatedRewardsCardContent>
-        <div>
-          <span>{stringGetter({ key: STRING_KEYS.ESTIMATED_REWARDS })}</span>
-          <Styled.Season>
-            {stringGetter({
-              key: STRING_KEYS.LAUNCH_INCENTIVES_SEASON_NUM,
-              params: {
-                SEASON_NUMBER: 1,
-              },
-            })}
-          </Styled.Season>
-        </div>
-
-        <Styled.Points>
-          <Output type={OutputType.Number} value={data} isLoading={isLoading} fractionDigits={2} />
-          {data !== undefined && stringGetter({ key: STRING_KEYS.POINTS })}
-        </Styled.Points>
-      </Styled.EstimatedRewardsCardContent>
-
-      <Styled.Image src="/rewards-stars.svg" />
-    </Styled.EstimatedRewardsCard>
-  );
-};
-
-const LaunchIncentivesContent = () => {
-  const stringGetter = useStringGetter();
-  const dispatch = useDispatch();
-
-  return (
-    <Styled.Column>
-      <Styled.Description>
-        {stringGetter({ key: STRING_KEYS.LAUNCH_INCENTIVES_DESCRIPTION })}{' '}
-      </Styled.Description>
-      <Styled.ChaosLabsLogo src="/logos/chaos-labs.svg" />
-      <Styled.ButtonRow>
-        <Styled.AboutButton
-          action={ButtonAction.Base}
-          onClick={() => {
-            dispatch(
-              openDialog({
-                type: DialogTypes.ExternalLink,
-                dialogProps: { link: 'https://dydx.exchange/blog/v4-full-trading' },
-              })
-            );
-          }}
-          slotRight={<Styled.LinkOutIcon iconName={IconName.LinkOut} />}
-        >
-          {stringGetter({ key: STRING_KEYS.ABOUT })}
-        </Styled.AboutButton>
-        <Styled.Button
-          action={ButtonAction.Primary}
-          onClick={() => {
-            dispatch(
-              openDialog({
-                type: DialogTypes.ExternalLink,
-                dialogProps: { link: 'https://community.chaoslabs.xyz/dydx-v4/risk/leaderboard' },
-              })
-            );
-          }}
-          slotRight={<Styled.LinkOutIcon iconName={IconName.LinkOut} />}
-          slotLeft={<Icon iconName={IconName.Leaderboard} />}
-        >
-          {stringGetter({ key: STRING_KEYS.LEADERBOARD })}
-        </Styled.Button>
-      </Styled.ButtonRow>
-    </Styled.Column>
-  );
-};
-
-const Styled: Record<string, AnyStyledComponent> = {};
-
-Styled.Panel = styled(Panel)`
-  --panel-paddingY: 1rem;
-  --panel-paddingX: 1.5rem;
-
-  background-color: var(--color-layer-4);
-  width: 100%;
-
-  @media ${breakpoints.tablet} {
-    --panel-paddingY: 1.5rem;
-  }
-`;
-
-Styled.ForV4 = styled.span`
-  color: var(--color-text-0);
-`;
-
-Styled.Title = styled.h3`
-  ${layoutMixins.inlineRow}
-  font: var(--font-medium-book);
-  color: var(--color-text-2);
-
-  @media ${breakpoints.notTablet} {
-    padding: var(--panel-paddingY) var(--panel-paddingX) 0;
-  }
-`;
-
-Styled.Description = styled.div`
-  color: var(--color-text-0);
-  --link-color: var(--color-text-1);
-
-  a {
-    display: inline;
-    text-decoration: underline;
-    text-underline-offset: 0.25rem;
-
-    ::before {
-      content: ' ';
-    }
-  }
-`;
-
-Styled.ButtonRow = styled.div`
-  ${layoutMixins.inlineRow}
-  gap: 0.75rem;
-  margin-top: 0.5rem;
-
-  a:last-child {
-    --button-width: 100%;
-  }
-`;
-
-Styled.Button = styled(Button)`
-  --button-padding: 0 1rem;
-`;
-
-Styled.LinkOutIcon = styled(Icon)`
-  color: var(--color-text-1);
-`;
-
-Styled.AboutButton = styled(Styled.Button)`
-  --button-textColor: var(--color-text-2);
-  --button-backgroundColor: var(--color-layer-6);
-  --button-border: solid var(--border-width) var(--color-layer-7);
-`;
-
-Styled.Column = styled.div`
-  ${layoutMixins.flexColumn}
-  gap: 0.5rem;
-`;
-
-Styled.EstimatedRewardsCard = styled.div`
-  ${layoutMixins.spacedRow}
-  padding: 1rem 1.25rem;
-  min-width: 21.25rem;
-  height: calc(100% - calc(1.5rem * 2));
-  margin: 1.5rem;
-
-  background-color: var(--color-layer-5);
-  background-image: url('/dots-background.svg');
-  background-size: cover;
-
-  border-radius: 0.75rem;
-  border: solid var(--border-width) var(--color-layer-6);
-  color: var(--color-text-1);
-
-  @media ${breakpoints.tablet} {
-    margin: 0 0 0.5rem;
-  }
-`;
-
-Styled.EstimatedRewardsCardContent = styled.div`
-  ${layoutMixins.flexColumn}
-  gap: 1rem;
-  height: 100%;
-  justify-content: space-between;
-
-  div {
-    ${layoutMixins.flexColumn}
-    gap: 0.15rem;
-    font: var(--font-medium-book);
-
-    :first-child {
-      color: var(--color-text-2);
-    }
-  }
-`;
-
-Styled.BackgroundDots = styled.img`
-  position: absolute;
-`;
-
-Styled.Season = styled.span`
-  font: var(--font-small-book);
-  color: var(--color-text-1);
-`;
-
-Styled.Points = styled.span`
-  ${layoutMixins.inlineRow}
-  gap: 0.25rem;
-  font: var(--font-large-book);
-  color: var(--color-text-0);
-
-  output {
-    color: var(--color-text-2);
-  }
-`;
-
-Styled.Image = styled.img`
-  position: relative;
-  float: right;
-
-  width: 5.25rem;
-  height: auto;
-`;
-
-Styled.ChaosLabsLogo = styled.img`
-  height: 1.25rem;
-  align-self: start;
-`;
-
-Styled.NewTag = styled(Tag)`
-  color: var(--color-accent);
-  background-color: var(--color-accent-faded);
-`;

src/pages/rewards/MigratePanel.tsx

@@ -7,8 +7,6 @@ import { ButtonAction, ButtonSize, ButtonType } from '@/constants/buttons';
 
 import { useAccountBalance, useBreakpoints, useStringGetter } from '@/hooks';
 
-import { breakpoints } from '@/styles';
-
 import { layoutMixins } from '@/styles/layoutMixins';
 
 import { Details } from '@/components/Details';
@@ -136,22 +134,13 @@ const Styled: Record<string, AnyStyledComponent> = {};
 Styled.MigratePanel = styled(Panel)`
   --panel-paddingX: 1.5rem;
   width: 100%;
-
-  background-image: url('/dots-background.svg');
-  background-position: right;
-  background-repeat: no-repeat;
-
-  @media ${breakpoints.tablet} {
-    --panel-paddingY: 1.5rem;
-    --panel-content-paddingY: 1rem;
-  }
 `;
 
 Styled.Title = styled.h3`
   font: var(--font-medium-book);
   color: var(--color-text-2);
 
-  padding: var(--panel-paddingY) var(--panel-paddingX) 0;
+  padding: 1rem 1.5rem 0;
 `;
 
 Styled.MigrateAction = styled.div`
@@ -175,13 +164,6 @@ Styled.Token = styled(Output)`
 Styled.Description = styled.div`
   color: var(--color-text-0);
   --link-color: var(--color-text-1);
-
-  a {
-    display: inline;
-    ::before {
-      content: ' ';
-    }
-  }
 `;
 
 Styled.Column = styled.div`

src/pages/rewards/RewardsPage.tsx

@@ -19,7 +19,6 @@ import { openDialog } from '@/state/dialogs';
 
 import { DYDXBalancePanel } from './DYDXBalancePanel';
 import { MigratePanel } from './MigratePanel';
-import { LaunchIncentivesPanel } from './LaunchIncentivesPanel';
 
 export const RewardsPage = () => {
   const dispatch = useDispatch();
@@ -40,20 +39,9 @@ export const RewardsPage = () => {
   return (
     <Styled.Page>
       {import.meta.env.VITE_V3_TOKEN_ADDRESS && <MigratePanel />}
-
-      {isTablet ? (
-        <>
-          <LaunchIncentivesPanel />
-          <DYDXBalancePanel />
-        </>
-      ) : (
-        <Styled.PanelRowIncentivesAndBalance>
-          <LaunchIncentivesPanel />
-          <DYDXBalancePanel />
-        </Styled.PanelRowIncentivesAndBalance>
-      )}
-
       <Styled.PanelRow>
+        {isTablet && <DYDXBalancePanel />}
+
         <Styled.Panel
           slotHeader={<Styled.Title>{stringGetter({ key: STRING_KEYS.GOVERNANCE })}</Styled.Title>}
           slotRight={panelArrow}
@@ -79,6 +67,8 @@ export const RewardsPage = () => {
             </Link>
           </Styled.Description>
         </Styled.Panel>
+
+        {isNotTablet && <DYDXBalancePanel />}
       </Styled.PanelRow>
     </Styled.Page>
   );
@@ -109,11 +99,6 @@ Styled.Page = styled.div`
 
 Styled.Panel = styled(Panel)`
   --panel-paddingX: 1.5rem;
-
-  @media ${breakpoints.tablet} {
-    --panel-paddingY: 1.5rem;
-    --panel-content-paddingY: 1rem;
-  }
 `;
 
 Styled.Title = styled.h3`
@@ -125,29 +110,20 @@ Styled.Title = styled.h3`
 Styled.Description = styled.div`
   color: var(--color-text-0);
   --link-color: var(--color-text-1);
-
-  a {
-    display: inline;
-    ::before {
-      content: ' ';
-    }
-  }
 `;
 
 Styled.PanelRow = styled.div`
   ${layoutMixins.gridEqualColumns}
   gap: 1.5rem;
 
+  align-items: flex-start;
+
   @media ${breakpoints.tablet} {
     grid-auto-flow: row;
     grid-template-columns: 1fr;
   }
 `;
 
-Styled.PanelRowIncentivesAndBalance = styled(Styled.PanelRow)`
-  grid-template-columns: 2fr 1fr;
-`;
-
 Styled.IconButton = styled(IconButton)`
   color: var(--color-text-0);
   --color-border: var(--color-layer-6);

src/pages/trade/Trade.tsx

@@ -7,12 +7,7 @@ import { layoutMixins } from '@/styles/layoutMixins';
 
 import { TradeLayouts } from '@/constants/layout';
 
-import {
+import { useBreakpoints, useCurrentMarketId, usePageTitlePriceUpdates } from '@/hooks';
-  useBreakpoints,
-  useCurrentMarketId,
-  usePageTitlePriceUpdates,
-  useTradeFormInputs,
-} from '@/hooks';
 
 import { calculateCanAccountTrade } from '@/state/accountCalculators';
 import { getSelectedTradeLayout } from '@/state/layoutSelectors';
@@ -42,7 +37,6 @@ const TradePage = () => {
   const [isHorizontalPanelOpen, setIsHorizontalPanelOpen] = useState(true);
 
   usePageTitlePriceUpdates();
-  useTradeFormInputs();
 
   return isTablet ? (
     <Styled.TradeLayoutMobile>

src/state/configs.ts

@@ -17,7 +17,6 @@ export interface ConfigsState {
   feeTiers?: kollections.List<FeeTier>;
   feeDiscounts?: FeeDiscount[];
   network?: NetworkConfigs;
-  hasSeenLaunchIncentives: boolean;
 }
 
 const DOCUMENT_THEME_MAP = {
@@ -44,10 +43,6 @@ const initialState: ConfigsState = {
   feeDiscounts: undefined,
   feeTiers: undefined,
   network: undefined,
-  hasSeenLaunchIncentives: getLocalStorage({
-    key: LocalStorageKey.HasSeenLaunchIncentives,
-    defaultValue: false,
-  }),
 };
 
 changeTheme(initialState.appTheme);
@@ -65,11 +60,7 @@ export const configsSlice = createSlice({
       ...state,
       ...action.payload,
     }),
-    markLaunchIncentivesSeen: (state: ConfigsState) => {
-      setLocalStorage({ key: LocalStorageKey.HasSeenLaunchIncentives, value: true });
-      state.hasSeenLaunchIncentives = true;
-    },
   },
 });
 
-export const { setAppTheme, setConfigs, markLaunchIncentivesSeen } = configsSlice.actions;
+export const { setAppTheme, setConfigs } = configsSlice.actions;

src/state/configsSelectors.ts

@@ -5,6 +5,3 @@ export const getAppTheme = (state: RootState) => state.configs.appTheme;
 export const getFeeTiers = (state: RootState) => state.configs.feeTiers?.toArray();
 
 export const getFeeDiscounts = (state: RootState) => state.configs.feeDiscounts;
-
-export const getHasSeenLaunchIncentives = (state: RootState) =>
-  state.configs.hasSeenLaunchIncentives;

src/state/inputs.ts

@@ -1,5 +1,4 @@
 import { createSlice, type PayloadAction } from '@reduxjs/toolkit';
-import assign from 'lodash/assign';
 
 import type {
   InputError,
@@ -10,14 +9,9 @@ import type {
   TransferInputs,
 } from '@/constants/abacus';
 
-import { CLEARED_SIZE_INPUTS, CLEARED_TRADE_INPUTS } from '@/constants/trade';
-
-type TradeFormInputs = typeof CLEARED_TRADE_INPUTS & typeof CLEARED_SIZE_INPUTS;
-
 export interface InputsState {
   current?: Nullable<string>;
   inputErrors?: Nullable<InputError[]>;
-  tradeFormInputs: TradeFormInputs;
   tradeInputs?: Nullable<TradeInputs>;
   closePositionInputs?: Nullable<ClosePositionInputs>;
   transferInputs?: Nullable<TransferInputs>;
@@ -26,10 +20,6 @@ export interface InputsState {
 const initialState: InputsState = {
   current: undefined,
   inputErrors: undefined,
-  tradeFormInputs: {
-    ...CLEARED_TRADE_INPUTS,
-    ...CLEARED_SIZE_INPUTS,
-  },
   tradeInputs: undefined,
   transferInputs: undefined,
 };
@@ -47,17 +37,10 @@ export const inputsSlice = createSlice({
         inputErrors: errors?.toArray(),
         tradeInputs: trade,
         closePositionInputs: closePosition,
-        transferInputs: {
+        transferInputs: transfer,
-          ...transfer,
-          isCctp: !!transfer?.isCctp,
-        } as Nullable<TransferInputs>,
       };
     },
-
-    setTradeFormInputs: (state, action: PayloadAction<Partial<TradeFormInputs>>) => {
-      state.tradeFormInputs = assign({}, state.tradeFormInputs, action.payload);
-    },
   },
 });
 
-export const { setInputs, setTradeFormInputs } = inputsSlice.actions;
+export const { setInputs } = inputsSlice.actions;

src/state/inputsSelectors.ts

@@ -120,8 +120,3 @@ export const useTradeFormData = () => {
     shallowEqual
   );
 };
-
-/**
- * @returns Tradeform Input states for display. Abacus inputs should track these values.
- */
-export const getTradeFormInputs = (state: RootState) => state.inputs.tradeFormInputs;

src/state/localizationMiddleware.ts

@@ -57,8 +57,9 @@ export default (store: any) => (next: any) => async (action: PayloadAction<any>)
       } else if (globalThis.navigator?.language) {
         const browserLanguageBaseTag = globalThis.navigator.language.split('-')[0].toLowerCase();
 
-        const locale = (SUPPORTED_BASE_TAGS_LOCALE_MAPPING[browserLanguageBaseTag] ??
+        const locale = SUPPORTED_BASE_TAGS_LOCALE_MAPPING[
-          SUPPORTED_BASE_TAGS_LOCALE_MAPPING[SupportedLocales.EN]) as SupportedLocales;
+          browserLanguageBaseTag
+        ] as SupportedLocales;
 
         if (locale) {
           store.dispatch(setSelectedLocale({ locale, isAutoDetect: true }));

src/styles/colors.css

@@ -116,7 +116,6 @@
 
   --color-gradient-positive: hsla(158, 49%, 48%, 0.16);
   --color-gradient-negative: hsla(0, 100%, 66%, 0.16);
-  --color-accent-faded: hsla(var(--theme-classic-hue-purple), 100%, 70%, 0.16);
 
   --color-risk-low: var(--theme-classic-color-green);
   --color-risk-medium: var(--theme-classic-color-yellow);

src/styles/formMixins.ts

@@ -151,8 +151,6 @@ export const formMixins: Record<
     --form-input-paddingY: 0.5rem;
     --form-input-paddingX: 1rem;
 
-    height: 100%;
-
     label {
       --label-textColor: var(--color-text-0);
     }

src/views/ExchangeBillboards.tsx

@@ -2,9 +2,7 @@ import styled, { type AnyStyledComponent } from 'styled-components';
 import { shallowEqual, useSelector } from 'react-redux';
 
 import { STRING_KEYS } from '@/constants/localization';
-import { MARKETS_TO_DISPLAY } from '@/constants/markets';
 import { useBreakpoints, useStringGetter } from '@/hooks';
-import { testFlags } from '@/lib/testFlags';
 import { breakpoints } from '@/styles';
 import { layoutMixins } from '@/styles/layoutMixins';
 
@@ -34,7 +32,6 @@ export const ExchangeBillboards: React.FC<ExchangeBillboardsProps> = ({
 
   Object.values(perpetualMarkets)
     .filter(Boolean)
-    .filter(({ id }) => (testFlags.displayAllMarkets ? true : MARKETS_TO_DISPLAY.includes(id)))
     .forEach(({ oraclePrice, perpetual }) => {
       const { volume24H, trades24H, openInterest = 0 } = perpetual || {};
       volume24HUSDC += volume24H ?? 0;
@@ -63,7 +60,7 @@ export const ExchangeBillboards: React.FC<ExchangeBillboardsProps> = ({
         },
         {
           key: 'trades',
-          labelKey: isTablet ? STRING_KEYS.TRADES_24H : STRING_KEYS.TRADES,
+          labelKey: STRING_KEYS.TRADES,
           value: totalTrades24H || undefined,
           type: isTablet ? OutputType.CompactNumber : OutputType.Number,
           subLabelKey: !isTablet && STRING_KEYS.TRADES_LABEL,

src/views/TradeBoxOrderView.tsx

@@ -5,7 +5,7 @@ import { createSelector } from 'reselect';
 
 import { TradeInputField } from '@/constants/abacus';
 import { TradeTypes } from '@/constants/trade';
-import { STRING_KEYS, StringKey } from '@/constants/localization';
+import { STRING_KEYS } from '@/constants/localization';
 import { useStringGetter } from '@/hooks';
 import { layoutMixins } from '@/styles/layoutMixins';
 
@@ -30,8 +30,7 @@ const useTradeTypeOptions = () => {
   const allTradeTypeItems = typeOptions?.toArray()?.map(({ type, stringKey }) => ({
     value: type,
     label: stringGetter({
-      key:
+      key: type === TradeTypes.TAKE_PROFIT ? STRING_KEYS.TAKE_PROFIT_LIMIT : stringKey,
-        type === TradeTypes.TAKE_PROFIT ? STRING_KEYS.TAKE_PROFIT_LIMIT : (stringKey as StringKey),
     }),
   }));
 

src/views/dialogs/DepositDialog/DepositDialogContent.tsx

@@ -1,15 +1,12 @@
-import { useEffect, useState } from 'react';
+import { useState } from 'react';
 import styled, { type AnyStyledComponent } from 'styled-components';
 
-import { TransferInputField, TransferType } from '@/constants/abacus';
 import { isMainnet } from '@/constants/networks';
 import { layoutMixins } from '@/styles/layoutMixins';
 
 import { DepositForm } from '@/views/forms/AccountManagementForms/DepositForm';
 import { TestnetDepositForm } from '@/views/forms/AccountManagementForms/TestnetDepositForm';
 
-import abacusStateManager from '@/lib/abacus';
-
 type ElementProps = {
   onDeposit?: () => void;
 };
@@ -17,20 +14,6 @@ type ElementProps = {
 export const DepositDialogContent = ({ onDeposit }: ElementProps) => {
   const [showFaucet, setShowFaucet] = useState(!isMainnet);
 
-  useEffect(() => {
-    abacusStateManager.setTransferValue({
-      field: TransferInputField.type,
-      value: TransferType.deposit.rawValue,
-    });
-
-    return () => {
-      abacusStateManager.setTransferValue({
-        field: TransferInputField.type,
-        value: null,
-      });
-    };
-  }, []);
-
   return (
     <Styled.Content>
       {isMainnet || !showFaucet ? (

src/views/dialogs/ExternalLinkDialog.tsx

@@ -1,46 +0,0 @@
-import styled, { type AnyStyledComponent } from 'styled-components';
-
-import { ButtonAction, ButtonType } from '@/constants/buttons';
-import { STRING_KEYS } from '@/constants/localization';
-import { useStringGetter } from '@/hooks';
-
-import { Button } from '@/components/Button';
-import { Dialog } from '@/components/Dialog';
-
-import { layoutMixins } from '@/styles/layoutMixins';
-
-type ElementProps = {
-  link: string;
-  linkDescription?: string;
-  setIsOpen: (open: boolean) => void;
-};
-
-export const ExternalLinkDialog = ({ setIsOpen, link, linkDescription }: ElementProps) => {
-  const stringGetter = useStringGetter();
-  return (
-    <Dialog
-      isOpen
-      setIsOpen={setIsOpen}
-      title={stringGetter({ key: STRING_KEYS.LEAVING_WEBSITE })}
-      description={
-        linkDescription ?? stringGetter({ key: STRING_KEYS.LEAVING_WEBSITE_DESCRIPTION })
-      }
-    >
-      <Styled.Content>
-        <p>{stringGetter({ key: STRING_KEYS.LEAVING_WEBSITE_DISCLAIMER })}.</p>
-        <Button type={ButtonType.Link} action={ButtonAction.Primary} href={link}>
-          {stringGetter({ key: STRING_KEYS.CONTINUE })}
-        </Button>
-      </Styled.Content>
-    </Dialog>
-  );
-};
-
-const Styled: Record<string, AnyStyledComponent> = {};
-
-Styled.Content = styled.div`
-  ${layoutMixins.flexColumn}
-  gap: 1rem;
-
-  font: var(--font-base-book);
-`;

src/views/dialogs/ManageFundsDialog.tsx

@@ -18,14 +18,13 @@ import abacusStateManager from '@/lib/abacus';
 import { DepositDialogContent } from './DepositDialog/DepositDialogContent';
 
 type ElementProps = {
-  selectedTransferType?: string;
   setIsOpen?: (open: boolean) => void;
 };
 
-export const ManageFundsDialog = ({ setIsOpen, selectedTransferType }: ElementProps) => {
+export const ManageFundsDialog = ({ setIsOpen }: ElementProps) => {
   const stringGetter = useStringGetter();
   const { type } = useSelector(getTransferInputs, shallowEqual) || {};
-  const currentType = type?.rawValue ?? selectedTransferType ?? TransferType.deposit.rawValue;
+  const currentType = type?.rawValue ?? TransferType.deposit.rawValue;
 
   const closeDialog = () => setIsOpen?.(false);
 

src/views/dialogs/OnboardingDialog/AcknowledgeTerms.tsx

@@ -7,7 +7,6 @@ import { STRING_KEYS } from '@/constants/localization';
 import { ButtonAction } from '@/constants/buttons';
 
 import { layoutMixins } from '@/styles/layoutMixins';
-import { formMixins } from '@/styles/formMixins';
 
 import { Button } from '@/components/Button';
 import { Link } from '@/components/Link';
@@ -55,14 +54,14 @@ export const AcknowledgeTerms = ({ onClose, onContinue }: ElementProps) => {
           <li>{stringGetter({ key: STRING_KEYS.TOS_LINE5 })}</li>
         </ul>
       </Styled.TOS>
-      <Styled.Footer>
+      <Styled.Row>
         <Styled.Button onClick={onClose} action={ButtonAction.Base}>
           {stringGetter({ key: STRING_KEYS.CLOSE })}
         </Styled.Button>
         <Styled.Button onClick={onAcknowledgement} action={ButtonAction.Primary}>
           {stringGetter({ key: STRING_KEYS.I_AGREE })}
         </Styled.Button>
-      </Styled.Footer>
+      </Styled.Row>
     </>
   );
 };
@@ -88,9 +87,8 @@ Styled.TOS = styled.section`
   }
 `;
 
-Styled.Footer = styled.div`
+Styled.Row = styled.div`
-  ${formMixins.footer};
+  ${layoutMixins.row};
-  ${layoutMixins.row}
 
   gap: 1rem;
 `;

src/views/dialogs/OnboardingTriggerButton.tsx

@@ -8,7 +8,7 @@ import { STRING_KEYS } from '@/constants/localization';
 
 import { Button } from '@/components/Button';
 
-import { forceOpenDialog } from '@/state/dialogs';
+import { openDialog } from '@/state/dialogs';
 import { getOnboardingState } from '@/state/accountSelectors';
 import { OnboardingState } from '@/constants/account';
 
@@ -26,7 +26,7 @@ export const OnboardingTriggerButton = ({ size = ButtonSize.Small }: StyleProps)
     <Button
       action={ButtonAction.Primary}
       size={size}
-      onClick={() => dispatch(forceOpenDialog({ type: DialogTypes.Onboarding }))}
+      onClick={() => dispatch(openDialog({ type: DialogTypes.Onboarding }))}
     >
       {
         {

src/views/dialogs/PreferencesDialog.tsx

@@ -53,18 +53,6 @@ export const usePreferenceMenu = () => {
           ),
           onSelect: () => toggleNotifPreference(NotificationType.SquidTransfer),
         },
-        {
-          value: NotificationType.ReleaseUpdates,
-          label: "Release Updates",
-          slotAfter: (
-            <Switch
-              name={NotificationType.ReleaseUpdates}
-              checked={enabledNotifs[NotificationType.ReleaseUpdates]}
-              onCheckedChange={(enabled: boolean) => null}
-            />
-          ),
-          onSelect: () => toggleNotifPreference(NotificationType.ReleaseUpdates),
-        }
       ],
     }),
     [stringGetter, enabledNotifs]

src/views/dialogs/ReceiveDialog.tsx

@@ -0,0 +1,124 @@
+import { useState } from 'react';
+import styled, { type AnyStyledComponent } from 'styled-components';
+
+import { STRING_KEYS } from '@/constants/localization';
+import { DydxChainAsset } from '@/constants/wallets';
+
+import { formMixins } from '@/styles/formMixins';
+import { layoutMixins } from '@/styles/layoutMixins';
+import { useAccounts, useTokenConfigs, useStringGetter } from '@/hooks';
+
+import { AssetIcon } from '@/components/AssetIcon';
+import { CopyButton } from '@/components/CopyButton';
+import { Dialog } from '@/components/Dialog';
+import { QrCode } from '@/components/QrCode';
+import { SelectItem, SelectMenu } from '@/components/SelectMenu';
+import { WithDetailsReceipt } from '@/components/WithDetailsReceipt';
+
+import { truncateAddress } from '@/lib/wallet';
+
+import { OnboardingTriggerButton } from './OnboardingTriggerButton';
+
+type ElementProps = {
+  selectedAsset?: DydxChainAsset;
+  setIsOpen: (open: boolean) => void;
+};
+
+export const ReceiveDialog = ({ selectedAsset = DydxChainAsset.CHAINTOKEN, setIsOpen }: ElementProps) => {
+  const stringGetter = useStringGetter();
+  const { dydxAddress } = useAccounts();
+  const { chainTokenLabel, usdcLabel } = useTokenConfigs();
+
+  const [asset, setAsset] = useState(selectedAsset);
+
+  const assetOptions = [
+    {
+      value: DydxChainAsset.USDC,
+      label: (
+        <Styled.InlineRow>
+          <AssetIcon symbol="USDC" /> {usdcLabel}
+        </Styled.InlineRow>
+      ),
+    },
+    {
+      value: DydxChainAsset.CHAINTOKEN,
+      label: (
+        <Styled.InlineRow>
+          {/* TODO: conditionally display the native token assetIcon */}
+          {/* <AssetIcon symbol="DYDX" />  */}
+          {chainTokenLabel}
+        </Styled.InlineRow>
+      ),
+    },
+  ];
+
+  return (
+    <Styled.Dialog isOpen setIsOpen={setIsOpen} title={stringGetter({ key: STRING_KEYS.RECEIVE })}>
+      <Styled.Content>
+        <Styled.SelectMenu
+          label={stringGetter({ key: STRING_KEYS.ASSET })}
+          value={asset}
+          onValueChange={setAsset}
+        >
+          {assetOptions.map(({ value, label }) => (
+            <Styled.SelectItem key={value} value={value} label={label} />
+          ))}
+        </Styled.SelectMenu>
+
+        {!dydxAddress ? (
+          <OnboardingTriggerButton />
+        ) : (
+          <>
+            <Styled.WithDetailsReceipt
+              side="bottom"
+              detailItems={[
+                {
+                  key: 'address',
+                  label: stringGetter({ key: STRING_KEYS.DYDX_CHAIN_ADDRESS }),
+                  value: truncateAddress(dydxAddress),
+                },
+              ]}
+            >
+              <QrCode hasLogo value={dydxAddress!} />
+            </Styled.WithDetailsReceipt>
+            <CopyButton value={dydxAddress} />
+          </>
+        )}
+      </Styled.Content>
+    </Styled.Dialog>
+  );
+};
+
+const Styled: Record<string, AnyStyledComponent> = {};
+
+Styled.Dialog = styled(Dialog)`
+  --dialog-content-paddingTop: var(--default-border-width);
+  --dialog-width: 20rem;
+`;
+
+Styled.Content = styled.div`
+  ${formMixins.inputsColumn}
+  gap: 1.25rem;
+`;
+
+Styled.SelectMenu = styled(SelectMenu)`
+  ${formMixins.inputSelectMenu}
+  --form-input-height: 3.5rem;
+`;
+
+Styled.SelectItem = styled(SelectItem)`
+  ${formMixins.inputSelectMenuItem}
+`;
+
+Styled.InlineRow = styled.span`
+  ${layoutMixins.inlineRow}
+  height: 100%;
+
+  img {
+    font-size: 1.1em;
+  }
+`;
+
+Styled.WithDetailsReceipt = styled(WithDetailsReceipt)`
+  border-radius: 0.75em;
+`;

src/views/forms/AccountManagementForms/DepositForm.tsx

@@ -2,10 +2,9 @@ import { type FormEvent, useCallback, useEffect, useMemo, useState } from 'react
 import styled, { type AnyStyledComponent } from 'styled-components';
 import { type NumberFormatValues } from 'react-number-format';
 import { shallowEqual, useSelector } from 'react-redux';
-import { Abi, parseUnits } from 'viem';
+import { 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 { AlertType } from '@/constants/alerts';
 import { ButtonSize } from '@/constants/buttons';
@@ -18,6 +17,7 @@ import type { EvmAddress } from '@/constants/wallets';
 import { useAccounts, useDebounce, useStringGetter, useSelectedNetwork } from '@/hooks';
 import { useAccountBalance, CHAIN_DEFAULT_TOKEN_ADDRESS } from '@/hooks/useAccountBalance';
 import { useLocalNotifications } from '@/hooks/useLocalNotifications';
+import { NATIVE_TOKEN_ADDRESS, useSquid } from '@/hooks/useSquid';
 
 import { layoutMixins } from '@/styles/layoutMixins';
 import { formMixins } from '@/styles/formMixins';
@@ -37,7 +37,6 @@ import { getTransferInputs } from '@/state/inputsSelectors';
 
 import abacusStateManager from '@/lib/abacus';
 import { MustBigNumber } from '@/lib/numbers';
-import { getNobleChainId, NATIVE_TOKEN_ADDRESS } from '@/lib/squid';
 import { log } from '@/lib/telemetry';
 import { parseWalletError } from '@/lib/wallet';
 
@@ -69,7 +68,6 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
     summary,
     errors: routeErrors,
     errorMessage: routeErrorMessage,
-    isCctp,
   } = useSelector(getTransferInputs, shallowEqual) || {};
   const chainId = chainIdStr ? parseInt(chainIdStr) : undefined;
 
@@ -85,7 +83,7 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
   );
 
   const [fromAmount, setFromAmount] = useState('');
-  const [slippage, setSlippage] = useState(isCctp ? 0 : 0.01); // 1% slippage
+  const [slippage, setSlippage] = useState(0.01); // 1% slippage
   const debouncedAmount = useDebounce<string>(fromAmount, 500);
 
   // Async Data
@@ -100,8 +98,6 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
   const debouncedAmountBN = MustBigNumber(debouncedAmount);
   const balanceBN = MustBigNumber(balance);
 
-  useEffect(() => setSlippage(isCctp ? 0 : 0.01), [isCctp]);
-
   useEffect(() => {
     const hasInvalidInput =
       debouncedAmountBN.isNaN() || debouncedAmountBN.lte(0) || debouncedAmountBN.gt(balanceBN);
@@ -195,23 +191,15 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
     const sourceAmountBN = parseUnits(debouncedAmount, sourceToken.decimals);
 
     if (sourceAmountBN > (allowance as bigint)) {
-      const simulateApprove = async (abi: Abi) =>
+      const { request } = await publicClientWagmi.simulateContract({
-        publicClientWagmi.simulateContract({
+        account: evmAddress,
-          account: evmAddress,
+        address: sourceToken.address as EvmAddress,
-          address: sourceToken.address as EvmAddress,
+        abi: erc20,
-          abi,
+        functionName: 'approve',
-          functionName: 'approve',
+        args: [requestPayload.targetAddress as EvmAddress, sourceAmountBN],
-          args: [requestPayload.targetAddress as EvmAddress, sourceAmountBN],
+      });
-        });
 
-      let result;
+      const approveTx = await signerWagmi.writeContract(request);
-      try {
-        result = await simulateApprove(erc20 as Abi);
-      } catch (e) {
-        result = await simulateApprove(erc20_usdt as Abi);
-      }
-
-      const approveTx = await signerWagmi.writeContract(result.request);
       await publicClientWagmi.waitForTransactionReceipt({
         hash: approveTx,
       });
@@ -253,11 +241,11 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
         if (txHash) {
           addTransferNotification({
             txHash: txHash,
-            toChainId: !isCctp ? ENVIRONMENT_CONFIG_MAP[selectedNetwork].dydxChainId : getNobleChainId(),
+            toChainId: ENVIRONMENT_CONFIG_MAP[selectedNetwork].dydxChainId,
             fromChainId: chainIdStr || undefined,
             toAmount: summary?.usdcSize || undefined,
             triggeredAt: Date.now(),
-            isCctp,
+            notificationStatus: NotificationStatus.Triggered,
           });
           abacusStateManager.clearTransferInputValues();
           setFromAmount('');

src/views/forms/AccountManagementForms/DepositForm/DepositButtonAndReceipt.tsx

@@ -109,8 +109,6 @@ export const DepositButtonAndReceipt = ({
     ? stringGetter({ key: STRING_KEYS.HIDE_ALL_DETAILS })
     : stringGetter({ key: STRING_KEYS.SHOW_ALL_DETAILS });
 
-  const totalFees = (summary?.bridgeFee || 0) + (summary?.gasFee || 0);
-
   const submitButtonReceipt = [
     {
       key: 'equity',
@@ -160,7 +158,9 @@ export const DepositButtonAndReceipt = ({
     {
       key: 'total-fees',
       label: <span>{stringGetter({ key: STRING_KEYS.TOTAL_FEES })}</span>,
-      value: <Output type={OutputType.Fiat} value={totalFees} />,
+      value: typeof summary?.bridgeFee === 'number' && typeof summary?.gasFee === 'number' && (
+        <Output type={OutputType.Fiat} value={summary?.bridgeFee + summary?.gasFee} />
+      ),
       subitems: feeSubitems,
     },
     {
@@ -183,12 +183,7 @@ export const DepositButtonAndReceipt = ({
           type={OutputType.Text}
           value={stringGetter({
             key: STRING_KEYS.X_MINUTES_LOWERCASED,
-            params: {
+            params: { X: Math.round(summary?.estimatedRouteDuration / 60) },
-              X:
-                summary?.estimatedRouteDuration < 60
-                  ? '< 1'
-                  : Math.round(summary?.estimatedRouteDuration / 60),
-            },
           })}
         />
       ),

src/views/forms/AccountManagementForms/TestnetDepositForm.tsx

@@ -2,16 +2,14 @@ import { useState, type FormEvent, useEffect } from 'react';
 import { shallowEqual, useSelector } from 'react-redux';
 import styled, { type AnyStyledComponent } from 'styled-components';
 
-import { ButtonAction, ButtonSize, ButtonType } from '@/constants/buttons';
+import { ButtonAction, ButtonType } from '@/constants/buttons';
 import { STRING_KEYS } from '@/constants/localization';
 import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks';
 import { useAccounts, useStringGetter, useSubaccount } from '@/hooks';
 import { formMixins } from '@/styles/formMixins';
 
-import { OnboardingTriggerButton } from '@/views/dialogs/OnboardingTriggerButton';
 import { Button } from '@/components/Button';
 
-import { calculateCanAccountTrade } from '@/state/accountCalculators';
 import { getSubaccount } from '@/state/accountSelectors';
 import { getSelectedNetwork } from '@/state/appSelectors';
 
@@ -28,7 +26,6 @@ export const TestnetDepositForm = ({ onDeposit, onError }: DepositFormProps) =>
   const { requestFaucetFunds } = useSubaccount();
   const subAccount = useSelector(getSubaccount, shallowEqual);
   const selectedNetwork = useSelector(getSelectedNetwork);
-  const canAccountTrade = useSelector(calculateCanAccountTrade, shallowEqual);
 
   const [isLoading, setIsLoading] = useState(false);
 
@@ -75,13 +72,9 @@ export const TestnetDepositForm = ({ onDeposit, onError }: DepositFormProps) =>
         })}
       </p>
       <Styled.Footer>
-        {!canAccountTrade ? (
+        <Button action={ButtonAction.Primary} type={ButtonType.Submit} state={{ isLoading }}>
-          <OnboardingTriggerButton size={ButtonSize.Base} />
+          {stringGetter({ key: STRING_KEYS.DEPOSIT_FUNDS })}
-        ) : (
+        </Button>
-          <Button action={ButtonAction.Primary} type={ButtonType.Submit} state={{ isLoading }}>
-            {stringGetter({ key: STRING_KEYS.DEPOSIT_FUNDS })}
-          </Button>
-        )}
       </Styled.Footer>
     </Styled.Form>
   );

src/views/forms/AccountManagementForms/WithdrawForm.tsx

@@ -58,6 +58,11 @@ export const WithdrawForm = () => {
   const { sendSquidWithdraw } = useSubaccount();
   const { freeCollateral } = useSelector(getSubaccount, shallowEqual) || {};
 
+  // User input
+  const [withdrawAmount, setWithdrawAmount] = useState('');
+  const [slippage, setSlippage] = useState(0.01); // 0.1% slippage
+  const debouncedAmount = useDebounce<string>(withdrawAmount, 500);
+
   const {
     requestPayload,
     token,
@@ -66,15 +71,8 @@ export const WithdrawForm = () => {
     resources,
     errors: routeErrors,
     errorMessage: routeErrorMessage,
-    isCctp
   } = useSelector(getTransferInputs, shallowEqual) || {};
 
-  // User input
-  const [withdrawAmount, setWithdrawAmount] = useState('');
-  const [slippage, setSlippage] = useState(isCctp ? 0 : 0.01); // 0.1% slippage
-  const debouncedAmount = useDebounce<string>(withdrawAmount, 500);
-
-
   const isValidAddress = toAddress && isAddress(toAddress);
 
   const toToken = useMemo(
@@ -91,8 +89,6 @@ export const WithdrawForm = () => {
     [freeCollateral?.current]
   );
 
-  useEffect(() => setSlippage(isCctp ? 0 : 0.01), [isCctp]);
-
   useEffect(() => {
     abacusStateManager.setTransferValue({
       field: TransferInputField.type,

src/views/forms/AccountManagementForms/WithdrawForm/WithdrawButtonAndReceipt.tsx

@@ -90,13 +90,13 @@ export const WithdrawButtonAndReceipt = ({
     ? stringGetter({ key: STRING_KEYS.HIDE_ALL_DETAILS })
     : stringGetter({ key: STRING_KEYS.SHOW_ALL_DETAILS });
 
-  const totalFees = (summary?.bridgeFee || 0) + (summary?.gasFee || 0);
-
   const submitButtonReceipt = [
     {
       key: 'total-fees',
       label: <span>{stringGetter({ key: STRING_KEYS.TOTAL_FEES })}</span>,
-      value: <Output type={OutputType.Fiat} value={totalFees} />,
+      value: typeof summary?.bridgeFee === 'number' && typeof summary?.gasFee === 'number' && (
+        <Output type={OutputType.Fiat} value={summary?.bridgeFee + summary?.gasFee} />
+      ),
       subitems: feeSubitems,
     },
     {
@@ -165,12 +165,7 @@ export const WithdrawButtonAndReceipt = ({
           type={OutputType.Text}
           value={stringGetter({
             key: STRING_KEYS.X_MINUTES_LOWERCASED,
-            params: {
+            params: { X: Math.round(summary?.estimatedRouteDuration / 60) },
-              X:
-                summary?.estimatedRouteDuration < 60
-                  ? '< 1'
-                  : Math.round(summary?.estimatedRouteDuration / 60),
-            },
           })}
         />
       ),

src/views/forms/TradeForm.tsx

@@ -1,6 +1,6 @@
-import { type FormEvent, useState, Ref, useCallback, useEffect } from 'react';
+import { type FormEvent, useState, Ref, useCallback } from 'react';
 import styled, { AnyStyledComponent, css } from 'styled-components';
-import { shallowEqual, useDispatch, useSelector } from 'react-redux';
+import { shallowEqual, useSelector } from 'react-redux';
 import type { NumberFormatValues, SourceInfo } from 'react-number-format';
 
 import { AlertType } from '@/constants/alerts';
@@ -37,8 +37,7 @@ import { WithTooltip } from '@/components/WithTooltip';
 
 import { Orderbook } from '@/views/tables/Orderbook';
 
-import { setTradeFormInputs } from '@/state/inputs';
+import { getCurrentInput, useTradeFormData } from '@/state/inputsSelectors';
-import { getCurrentInput, getTradeFormInputs, useTradeFormData } from '@/state/inputsSelectors';
 import { getCurrentMarketConfig } from '@/state/perpetualsSelectors';
 
 import abacusStateManager from '@/lib/abacus';
@@ -81,7 +80,6 @@ export const TradeForm = ({
   const [placeOrderError, setPlaceOrderError] = useState<string>();
   const [showOrderbook, setShowOrderbook] = useState(false);
 
-  const dispatch = useDispatch();
   const stringGetter = useStringGetter();
   const { placeOrder } = useSubaccount();
 
@@ -100,21 +98,18 @@ export const TradeForm = ({
     tradeErrors,
   } = useTradeFormData();
 
+  const { limitPrice, triggerPrice, trailingPercent } = price || {};
   const currentInput = useSelector(getCurrentInput);
   const { tickSizeDecimals, stepSizeDecimals } =
     useSelector(getCurrentMarketConfig, shallowEqual) || {};
 
-  const tradeFormInputValues = useSelector(getTradeFormInputs, shallowEqual);
-  const { limitPriceInput, triggerPriceInput, trailingPercentInput } = tradeFormInputValues;
-
   const needsAdvancedOptions =
     needsGoodUntil || timeInForceOptions || executionOptions || needsPostOnly || needsReduceOnly;
 
   const tradeFormInputs: TradeBoxInputConfig[] = [];
 
   const isInputFilled =
-    Object.values(tradeFormInputValues).some((val) => val !== '') ||
+    Object.values(price || {}).some((val) => val != null) ||
-    Object.values(price || {}).some((val) => !!val) ||
     [size?.size, size?.usdcSize, size?.leverage].some((val) => val != null);
 
   const hasInputErrors =
@@ -202,11 +197,14 @@ export const TradeForm = ({
           <Tag>USD</Tag>
         </>
       ),
-      onChange: ({ value }: NumberFormatValues) => {
+      onChange: ({ floatValue }: NumberFormatValues) => {
-        dispatch(setTradeFormInputs({ triggerPriceInput: value }));
+        abacusStateManager.setTradeValue({
+          value: floatValue,
+          field: TradeInputField.triggerPrice,
+        });
       },
-      value: triggerPriceInput ?? '',
+      value: triggerPrice ?? '',
-      decimals: tickSizeDecimals ?? USD_DECIMALS,
+      decimals: tickSizeDecimals || USD_DECIMALS,
     });
   }
 
@@ -222,11 +220,11 @@ export const TradeForm = ({
           <Tag>USD</Tag>
         </>
       ),
-      onChange: ({ value }: NumberFormatValues) => {
+      onChange: ({ floatValue }: NumberFormatValues) => {
-        dispatch(setTradeFormInputs({ limitPriceInput: value }));
+        abacusStateManager.setTradeValue({ value: floatValue, field: TradeInputField.limitPrice });
       },
-      value: limitPriceInput,
+      value: limitPrice ?? '',
-      decimals: tickSizeDecimals ?? USD_DECIMALS,
+      decimals: tickSizeDecimals || USD_DECIMALS,
     });
   }
 
@@ -239,10 +237,13 @@ export const TradeForm = ({
           {stringGetter({ key: STRING_KEYS.TRAILING_PERCENT })}
         </WithTooltip>
       ),
-      onChange: ({ value }: NumberFormatValues) => {
+      onChange: ({ floatValue }: NumberFormatValues) => {
-        dispatch(setTradeFormInputs({ trailingPercentInput: value }));
+        abacusStateManager.setTradeValue({
+          value: floatValue,
+          field: TradeInputField.trailingPercent,
+        });
       },
-      value: trailingPercentInput ?? '',
+      value: trailingPercent ?? '',
     });
   }
 

src/views/forms/TradeForm/MarketLeverageInput.tsx

@@ -30,8 +30,8 @@ import { getSelectedOrderSide, hasPositionSideChanged } from '@/lib/tradeData';
 import { LeverageSlider } from './LeverageSlider';
 
 type ElementProps = {
-  leverageInputValue: string;
+  leverageInputValue: Nullable<number>;
-  setLeverageInputValue: (value: string) => void;
+  setLeverageInputValue: Dispatch<SetStateAction<Nullable<number>>>;
 };
 
 export const MarketLeverageInput = ({
@@ -66,7 +66,7 @@ export const MarketLeverageInput = ({
     const newLeverage = MustBigNumber(floatValue).toFixed();
 
     if (value === '' || newLeverage === 'NaN' || !floatValue) {
-      setLeverageInputValue('');
+      setLeverageInputValue(null);
       abacusStateManager.setTradeValue({
         value: null,
         field: TradeInputField.leverage,
@@ -84,7 +84,7 @@ export const MarketLeverageInput = ({
         ? newLeverageBN.abs().negated()
         : newLeverageBN.abs();
 
-    setLeverageInputValue(newLeverageSignedBN.toString());
+    setLeverageInputValue(newLeverageSignedBN.toNumber());
 
     abacusStateManager.setTradeValue({
       value: newLeverageSignedBN.toFixed(LEVERAGE_DECIMALS),
@@ -98,11 +98,11 @@ export const MarketLeverageInput = ({
     if (leveragePosition === PositionSide.None) return;
 
     const inputValue = leverageInputValue || currentLeverage;
-    const newInputValue = MustBigNumber(inputValue).negated().toFixed(LEVERAGE_DECIMALS);
+    const newInputValue = MustBigNumber(inputValue).negated().toNumber();
 
     setLeverageInputValue(newInputValue);
     abacusStateManager.setTradeValue({
-      value: newInputValue,
+      value: newInputValue.toFixed(LEVERAGE_DECIMALS),
       field: TradeInputField.leverage,
     });
   };

src/views/forms/TradeForm/PlaceOrderButtonAndReceipt.tsx

@@ -9,7 +9,6 @@ import { TRADE_TYPE_STRINGS, MobilePlaceOrderSteps } from '@/constants/trade';
 
 import { useStringGetter, useTokenConfigs } from '@/hooks';
 
-import { AssetIcon } from '@/components/AssetIcon';
 import { Button } from '@/components/Button';
 import { Output, OutputType, ShowSign } from '@/components/Output';
 import { WithDetailsReceipt } from '@/components/WithDetailsReceipt';
@@ -78,11 +77,7 @@ export const PlaceOrderButtonAndReceipt = ({
     },
     {
       key: 'fee',
-      label: (
+      label: stringGetter({ key: STRING_KEYS.FEE }),
-        <WithTooltip tooltip="fee" side="right">
-          {stringGetter({ key: STRING_KEYS.FEE })}
-        </WithTooltip>
-      ),
       value: <Output type={OutputType.Fiat} value={fee} useGrouping />,
     },
     {
@@ -90,7 +85,7 @@ export const PlaceOrderButtonAndReceipt = ({
       label: (
         <>
           {stringGetter({ key: STRING_KEYS.MAXIMUM_REWARDS })}
-          <AssetIcon symbol={chainTokenLabel} />
+          {/* <AssetIcon symbol="DYDX" /> */}
         </>
       ),
       value: (

src/views/forms/TradeForm/TradeSizeInputs.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react';
-import { shallowEqual, useDispatch, useSelector } from 'react-redux';
+import { shallowEqual, useSelector } from 'react-redux';
 import styled, { AnyStyledComponent } from 'styled-components';
 
 import { TradeInputField } from '@/constants/abacus';
@@ -20,13 +20,8 @@ import { Icon, IconName } from '@/components/Icon';
 import { ToggleButton } from '@/components/ToggleButton';
 
 import { getCurrentMarketAssetData } from '@/state/assetsSelectors';
-import { setTradeFormInputs } from '@/state/inputs';
 
-import {
+import { getInputTradeSizeData, getInputTradeOptions } from '@/state/inputsSelectors';
-  getInputTradeSizeData,
-  getInputTradeOptions,
-  getTradeFormInputs,
-} from '@/state/inputsSelectors';
 
 import { getCurrentMarketConfig } from '@/state/perpetualsSelectors';
 
@@ -36,8 +31,12 @@ import { MustBigNumber } from '@/lib/numbers';
 import { MarketLeverageInput } from './MarketLeverageInput';
 
 export const TradeSizeInputs = () => {
+  const [sizeInputValue, setSizeInputValue] = useState<number | null>();
+  const [usdcInputValue, setUsdcInputValue] = useState<number | null>();
+  const [leverageInputValue, setLeverageInputValue] = useState<number | null>();
+
   const [showUSDCInputOnTablet, setShowUSDCInputOnTablet] = useState(false);
-  const dispatch = useDispatch();
+
   const stringGetter = useStringGetter();
   const { isTablet } = useBreakpoints();
 
@@ -49,55 +48,40 @@ export const TradeSizeInputs = () => {
     useSelector(getCurrentMarketConfig, shallowEqual) || {};
   const { size, usdcSize, leverage, input: lastEditedInput } = inputTradeSizeData || {};
   const { needsLeverage } = currentTradeInputOptions || {};
-  const decimals = stepSizeDecimals ?? TOKEN_DECIMALS;
+  const decimals = stepSizeDecimals || TOKEN_DECIMALS;
-
-  const { amountInput, usdAmountInput, leverageInput } = useSelector(
-    getTradeFormInputs,
-    shallowEqual
-  );
 
   // Update State variables if their inputs are not being source of calculations
   // Or if they have been reset to null
   useEffect(() => {
     if (lastEditedInput !== TradeSizeInput.Size || size == null) {
-      dispatch(setTradeFormInputs({ amountInput: size ? size.toString() : '' }));
+      // Abacus size already respects step size
+      // using .toFixed to prevent trailing zeros and exponential notation
+      setSizeInputValue(size);
     }
     if (lastEditedInput !== TradeSizeInput.Usdc || usdcSize == null) {
-      dispatch(setTradeFormInputs({ usdAmountInput: usdcSize ? usdcSize.toString() : '' }));
+      setUsdcInputValue(usdcSize);
     }
     if (lastEditedInput !== TradeSizeInput.Leverage || leverage == null) {
-      dispatch(setTradeFormInputs({ leverageInput: leverage ? leverage.toString() : '' }));
+      setLeverageInputValue(leverage);
     }
   }, [size, usdcSize, leverage, lastEditedInput]);
 
-  const onSizeInput = ({
+  const onSizeInput = ({ value, floatValue }: { value: string; floatValue?: number }) => {
-    floatValue,
+    setSizeInputValue(floatValue);
-    formattedValue,
-  }: {
-    floatValue?: number;
-    formattedValue: string;
-  }) => {
-    dispatch(setTradeFormInputs({ amountInput: MustBigNumber(floatValue).toString() }));
     const newAmount = MustBigNumber(floatValue).toFixed(decimals);
 
     abacusStateManager.setTradeValue({
-      value: formattedValue === '' || newAmount === 'NaN' ? null : newAmount,
+      value: value === '' || newAmount === 'NaN' ? null : newAmount,
       field: TradeInputField.size,
     });
   };
 
-  const onUSDCInput = ({
+  const onUSDCInput = ({ value, floatValue }: { value: string; floatValue?: number }) => {
-    floatValue,
+    setUsdcInputValue(floatValue);
-    formattedValue,
+    const newUsdcAmount = MustBigNumber(floatValue).toFixed();
-  }: {
-    floatValue?: number;
-    formattedValue: string;
-  }) => {
-    dispatch(setTradeFormInputs({ usdAmountInput: MustBigNumber(floatValue).toString() }));
-    const newUsdcAmount = MustBigNumber(floatValue).toFixed(tickSizeDecimals || USD_DECIMALS);
 
     abacusStateManager.setTradeValue({
-      value: formattedValue === '' || newUsdcAmount === 'NaN' ? null : newUsdcAmount,
+      value: value === '' || newUsdcAmount === 'NaN' ? null : newUsdcAmount,
       field: TradeInputField.usdcSize,
     });
   };
@@ -129,7 +113,7 @@ export const TradeSizeInputs = () => {
       }
       slotRight={isTablet && inputToggleButton}
       type={InputType.Number}
-      value={amountInput || ''}
+      value={sizeInputValue || ''}
     />
   );
 
@@ -138,7 +122,7 @@ export const TradeSizeInputs = () => {
       id="trade-usdc"
       onInput={onUSDCInput}
       type={InputType.Currency}
-      value={usdAmountInput || ''}
+      value={usdcInputValue || ''}
       decimals={tickSizeDecimals || USD_DECIMALS}
       label={
         <>
@@ -169,10 +153,8 @@ export const TradeSizeInputs = () => {
 
       {needsLeverage && (
         <MarketLeverageInput
-          leverageInputValue={leverageInput}
+          leverageInputValue={leverageInputValue}
-          setLeverageInputValue={(value: string) =>
+          setLeverageInputValue={setLeverageInputValue}
-            dispatch(setTradeFormInputs({ leverageInput: value }))
-          }
         />
       )}
     </Styled.Column>

src/views/forms/TransferForm.tsx

@@ -119,10 +119,6 @@ export const TransferForm = ({
 
     return () => {
       abacusStateManager.clearTransferInputValues();
-      abacusStateManager.setTransferValue({
-        field: TransferInputField.type,
-        value: null,
-      });
     };
   }, []);
 

src/views/menus/AccountMenu.tsx

@@ -1,12 +1,12 @@
 import { memo } from 'react';
-import styled, { AnyStyledComponent, css } from 'styled-components';
+import styled, { AnyStyledComponent } from 'styled-components';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import type { Dispatch } from '@reduxjs/toolkit';
 
 import { OnboardingState } from '@/constants/account';
 import { ButtonAction, ButtonShape, ButtonSize, ButtonType } from '@/constants/buttons';
 import { DialogTypes } from '@/constants/dialogs';
-import { STRING_KEYS, StringGetterFunction, TOOLTIP_STRING_KEYS } from '@/constants/localization';
+import { STRING_KEYS, TOOLTIP_STRING_KEYS } from '@/constants/localization';
 import { isMainnet } from '@/constants/networks';
 import { DydxChainAsset, wallets } from '@/constants/wallets';
 
@@ -40,6 +40,7 @@ import { layoutMixins } from '@/styles/layoutMixins';
 import { headerMixins } from '@/styles/headerMixins';
 import { MustBigNumber } from '@/lib/numbers';
 
+
 export const AccountMenu = () => {
   const stringGetter = useStringGetter();
   const { mintscanBase } = useURLConfigs();
@@ -90,15 +91,13 @@ export const AccountMenu = () => {
                 <Styled.Address>{truncateAddress(dydxAddress)}</Styled.Address>
               </Styled.Column>
               <Styled.CopyButton buttonType="icon" value={dydxAddress} shape={ButtonShape.Square} />
-              <WithTooltip tooltipString={stringGetter({ key: STRING_KEYS.MINTSCAN })}>
+              <Styled.IconButton
-                <Styled.IconButton
+                action={ButtonAction.Base}
-                  action={ButtonAction.Base}
+                href={`${mintscanBase}/account/${dydxAddress}`}
-                  href={`${mintscanBase}/account/${dydxAddress}`}
+                iconName={IconName.LinkOut}
-                  iconName={IconName.LinkOut}
+                shape={ButtonShape.Square}
-                  shape={ButtonShape.Square}
+                type={ButtonType.Link}
-                  type={ButtonType.Link}
+              />
-                />
-              </WithTooltip>
             </Styled.AddressRow>
             <Styled.AddressRow>
               {walletType && (
@@ -128,7 +127,6 @@ export const AccountMenu = () => {
                   asset={DydxChainAsset.CHAINTOKEN}
                   dispatch={dispatch}
                   hasBalance={nativeTokenBalance.gt(0)}
-                  stringGetter={stringGetter}
                 />
               </div>
               <div>
@@ -150,7 +148,6 @@ export const AccountMenu = () => {
                   asset={DydxChainAsset.USDC}
                   dispatch={dispatch}
                   hasBalance={MustBigNumber(usdcBalance).gt(0)}
-                  stringGetter={stringGetter}
                   withOnboarding
                 />
               </div>
@@ -170,12 +167,6 @@ export const AccountMenu = () => {
           onSelect: onRecoverKeys,
           separator: true,
         },
-        {
-          value: 'Preferences',
-          icon: <Icon iconName={IconName.Gear} />,
-          label: stringGetter({ key: STRING_KEYS.PREFERENCES }),
-          onSelect: () => dispatch(openDialog({ type: DialogTypes.Preferences })),
-        },
         ...(onboardingState === OnboardingState.AccountConnected && hdKey
           ? [
               !isMainnet && {
@@ -193,6 +184,12 @@ export const AccountMenu = () => {
               },
             ].filter(isTruthy)
           : []),
+        {
+          value: 'Preferences',
+          icon: <Icon iconName={IconName.Gear} />,
+          label: stringGetter({ key: STRING_KEYS.PREFERENCES }),
+          onSelect: () => dispatch(openDialog({ type: DialogTypes.Preferences })),
+        },
         {
           value: 'Disconnect',
           icon: <Icon iconName={IconName.BoxClose} />,
@@ -220,48 +217,38 @@ const AssetActions = memo(
     dispatch,
     withOnboarding,
     hasBalance,
-    stringGetter,
   }: {
     asset: DydxChainAsset;
     dispatch: Dispatch;
     withOnboarding?: boolean;
     hasBalance?: boolean;
-    stringGetter: StringGetterFunction;
   }) => (
     <Styled.InlineRow>
       {[
-        withOnboarding && {
-          dialogType: DialogTypes.Deposit,
-          iconName: IconName.Deposit,
-          tooltipStringKey: STRING_KEYS.DEPOSIT,
-        },
         withOnboarding &&
           hasBalance && {
             dialogType: DialogTypes.Withdraw,
             iconName: IconName.Withdraw,
-            tooltipStringKey: STRING_KEYS.WITHDRAW,
           },
+        withOnboarding && {
+          dialogType: DialogTypes.Deposit,
+          iconName: IconName.Deposit,
+        },
         hasBalance && {
           dialogType: DialogTypes.Transfer,
           dialogProps: { selectedAsset: asset },
           iconName: IconName.Send,
-          tooltipStringKey: STRING_KEYS.TRANSFER,
         },
       ]
         .filter(isTruthy)
-        .map(({ iconName, tooltipStringKey, dialogType, dialogProps }) => (
+        .map(({ iconName, dialogType, dialogProps }) => (
-          <Styled.WithTooltip
+          <Styled.IconButton
-            key={tooltipStringKey}
+            key={dialogType}
-            tooltipString={stringGetter({ key: tooltipStringKey })}
+            action={ButtonAction.Base}
-          >
+            shape={ButtonShape.Square}
-            <Styled.IconButton
+            iconName={iconName}
-              key={dialogType}
+            onClick={() => dispatch(openDialog({ type: dialogType, dialogProps }))}
-              action={ButtonAction.Base}
+          />
-              shape={ButtonShape.Square}
-              iconName={iconName}
-              onClick={() => dispatch(openDialog({ type: dialogType, dialogProps }))}
-            />
-          </Styled.WithTooltip>
         ))}
     </Styled.InlineRow>
   )
@@ -383,22 +370,12 @@ Styled.ConnectToChain = styled(Styled.Column)`
   }
 `;
 
-Styled.IconButton = styled(IconButton)<{ iconName: IconName }>`
+Styled.IconButton = styled(IconButton)`
   --button-padding: 0 0.25rem;
   --button-border: solid var(--border-width) var(--color-layer-6);
-
-  ${({ iconName }) =>
-    [IconName.Withdraw, IconName.Deposit].includes(iconName) &&
-    css`
-      --button-icon-size: 1.375em;
-    `}
 `;
 
 Styled.CopyButton = styled(CopyButton)`
   --button-padding: 0 0.25rem;
   --button-border: solid var(--border-width) var(--color-layer-6);
 `;
-
-Styled.WithTooltip = styled(WithTooltip)`
-  --tooltip-backgroundColor: var(--color-layer-5);
-`;

src/views/notifications/TransferStatusNotification/index.tsx

@@ -44,7 +44,6 @@ export const TransferStatusNotification = ({
 
   // @ts-ignore status.errors is not in the type definition but can be returned
   const error = status?.errors?.length ? status?.errors[0] : status?.error;
-  const hasError = error && Object.keys(error).length !== 0;
 
   const updateSecondsLeft = useCallback(() => {
     const fromChainEta = (status?.fromChain?.chainData?.estimatedRouteDuration || 0) * 1000;
@@ -88,7 +87,7 @@ export const TransferStatusNotification = ({
           },
         })}
       </Styled.Status>
-      {hasError && (
+      {error && (
         <AlertMessage type={AlertType.Error}>
           {stringGetter({
             key: STRING_KEYS.SOMETHING_WENT_WRONG_WITH_MESSAGE,
@@ -113,7 +112,7 @@ export const TransferStatusNotification = ({
         ) : (
           <Styled.BridgingStatus>
             {content}
-            {!isToast && status?.squidTransactionStatus !== 'success' && !hasError && (
+            {!isToast && status?.squidTransactionStatus !== 'success' && (
               <Styled.TransferStatusSteps status={status} type={type} />
             )}
           </Styled.BridgingStatus>
@@ -121,7 +120,8 @@ export const TransferStatusNotification = ({
       }
       slotAction={
         isToast &&
-        status && (
+        status &&
+        !error && (
           <Styled.Trigger
             isOpen={open}
             onClick={(e: MouseEvent) => {

src/views/tables/MarketsTable.tsx

@@ -67,8 +67,7 @@ export const MarketsTable = ({ className }: { className?: string }) => {
                         <Styled.Output
                           type={OutputType.Percent}
                           value={MustBigNumber(priceChange24HPercent).abs()}
-                          isPositive={MustBigNumber(priceChange24HPercent).gt(0)}
+                          isNegative={MustBigNumber(priceChange24H).isNegative()}
-                          isNegative={MustBigNumber(priceChange24HPercent).isNegative()}
                         />
                       </>
                     )}
@@ -97,20 +96,19 @@ export const MarketsTable = ({ className }: { className?: string }) => {
               ),
             },
             {
-              columnKey: 'priceChange24HPercent',
+              columnKey: 'priceChange24H',
-              getCellValue: (row) => row.priceChange24HPercent,
+              getCellValue: (row) => row.priceChange24H,
               label: stringGetter({ key: STRING_KEYS.CHANGE_24H }),
               renderCell: ({ priceChange24H, priceChange24HPercent, tickSizeDecimals }) => (
                 <TableCell stacked>
                   <Styled.InlineRow>
-                    {!priceChange24HPercent ? (
+                    {!priceChange24H ? (
                       <Output type={OutputType.Text} value={null} />
                     ) : (
                       <Styled.Output
                         type={OutputType.Percent}
                         value={MustBigNumber(priceChange24HPercent).abs()}
-                        isPositive={MustBigNumber(priceChange24HPercent).gt(0)}
+                        isNegative={MustBigNumber(priceChange24H).isNegative()}
-                        isNegative={MustBigNumber(priceChange24HPercent).isNegative()}
                       />
                     )}
                   </Styled.InlineRow>
@@ -130,25 +128,26 @@ export const MarketsTable = ({ className }: { className?: string }) => {
                 <Styled.Output
                   type={OutputType.SmallPercent}
                   value={row.nextFundingRate}
-                  isPositive={MustBigNumber(row.nextFundingRate).gt(0)}
                   isNegative={MustBigNumber(row.nextFundingRate).isNegative()}
                 />
               ),
             },
             {
               columnKey: 'openInterest',
-              getCellValue: (row) => row.openInterestUSDC,
+              getCellValue: (row) => row.openInterest,
               label: stringGetter({ key: STRING_KEYS.OPEN_INTEREST }),
               renderCell: (row) => (
                 <TableCell stacked>
-                  <Output type={OutputType.Fiat} value={row.openInterestUSDC} />
-
                   <Output
                     fractionDigits={LARGE_TOKEN_DECIMALS}
                     type={OutputType.Number}
                     value={row.openInterest}
                     tag={row.asset?.id}
                   />
+                  <Output
+                    type={OutputType.Fiat}
+                    value={MustBigNumber(row.openInterest).times(MustBigNumber(row.oraclePrice))}
+                  />
                 </TableCell>
               ),
             },
@@ -156,7 +155,7 @@ export const MarketsTable = ({ className }: { className?: string }) => {
               columnKey: 'volume24H',
               getCellValue: (row) => row.volume24H,
               label: stringGetter({ key: STRING_KEYS.VOLUME_24H }),
-              renderCell: (row) => <Output type={OutputType.Fiat} value={row.volume24H} />,
+              renderCell: (row) => <Output type={OutputType.Number} value={row.volume24H} />,
             },
             {
               columnKey: 'trades24H',
@@ -242,11 +241,6 @@ Styled.TabletPriceChange = styled(Styled.InlineRow)`
   font: var(--font-small-book);
 `;
 
-Styled.Output = styled(Output)<{ isNegative?: boolean; isPositive?: boolean }>`
+Styled.Output = styled(Output)<{ isNegative?: boolean }>`
-  color: ${({ isNegative, isPositive }) =>
+  color: ${({ isNegative }) => (isNegative ? `var(--color-negative)` : `var(--color-positive)`)};
-    isNegative
-      ? `var(--color-negative)`
-      : isPositive
-      ? `var(--color-positive)`
-      : `var(--color-text-1)`};
 `;

src/views/tables/Orderbook.tsx

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
-import { shallowEqual, useDispatch, useSelector } from 'react-redux';
+import { shallowEqual, useSelector } from 'react-redux';
 import styled, { type AnyStyledComponent, css, keyframes } from 'styled-components';
 
 import { OrderSide } from '@dydxprotocol/v4-client-js';
@@ -9,13 +9,13 @@ import { STRING_KEYS } from '@/constants/localization';
 import { useBreakpoints, useStringGetter } from '@/hooks';
 
 import { calculateCanViewAccount } from '@/state/accountCalculators';
-import { setTradeFormInputs } from '@/state/inputs';
 
 import { getSubaccountOpenOrdersBySideAndPrice } from '@/state/accountSelectors';
 import { getCurrentMarketAssetData } from '@/state/assetsSelectors';
 import { getCurrentMarketConfig, getCurrentMarketOrderbook } from '@/state/perpetualsSelectors';
 import { getCurrentInput } from '@/state/inputsSelectors';
 
+import abacusStateManager from '@/lib/abacus';
 import { MustBigNumber } from '@/lib/numbers';
 
 import { Details } from '@/components/Details';
@@ -42,11 +42,7 @@ type StyleProps = {
   className?: string;
 };
 
-type RowData = Pick<OrderbookLine, 'depth' | 'offset' | 'price' | 'size'> & {
+type RowData = OrderbookLine & { side: 'bid' | 'ask'; mine?: number };
-  side: 'bid' | 'ask';
-  mine?: number;
-  key: string;
-};
 
 const useCalculateOrderbookData = ({ maxRowsPerSide }: { maxRowsPerSide: number }) => {
   const orderbook = useSelector(getCurrentMarketOrderbook, shallowEqual);
@@ -57,9 +53,8 @@ const useCalculateOrderbookData = ({ maxRowsPerSide }: { maxRowsPerSide: number
   return useMemo(() => {
     const asks = (orderbook?.asks?.toArray() ?? [])
       .map(
-        (row: OrderbookLine, idx: number) =>
+        (row: OrderbookLine) =>
           ({
-            key: `ask-${idx}`,
             side: 'ask',
             mine: openOrdersBySideAndPrice[OrderSide.SELL]?.[row.price]?.size,
             ...row,
@@ -69,9 +64,8 @@ const useCalculateOrderbookData = ({ maxRowsPerSide }: { maxRowsPerSide: number
 
     const bids = (orderbook?.bids?.toArray() ?? [])
       .map(
-        (row: OrderbookLine, idx: number) =>
+        (row: OrderbookLine) =>
           ({
-            key: `bid-${idx}`,
             side: 'bid',
             mine: openOrdersBySideAndPrice[OrderSide.BUY]?.[row.price]?.size,
             ...row,
@@ -103,44 +97,15 @@ const useCalculateOrderbookData = ({ maxRowsPerSide }: { maxRowsPerSide: number
     }
 
     const spread =
-      asks[0]?.price && bids[0]?.price ? MustBigNumber(asks[0].price).minus(bids[0].price) : null;
+      asks[0] && bids[0] ? MustBigNumber(asks[0]?.price ?? 0).minus(bids[0]?.price ?? 0) : null;
 
     const spreadPercent = orderbook?.spreadPercent;
 
     const histogramRange = Math.max(
-      isNaN(Number(bids[bids.length - 1]?.depth)) ? 0 : Number(bids[bids.length - 1]?.depth),
+      Number(bids[bids.length - 1]?.depth),
-      isNaN(Number(asks[asks.length - 1]?.depth)) ? 0 : Number(asks[asks.length - 1]?.depth)
+      Number(asks[asks.length - 1]?.depth)
     );
 
-    // Ensure asks and bids are of length maxRowsPerSide by adding empty rows.
-    let idx = asks.length - 1;
-    while (asks.length < maxRowsPerSide) {
-      idx += 1;
-
-      asks.push({
-        key: `ask-${idx}`,
-        side: 'ask',
-        size: 0,
-        price: 0,
-        offset: 0,
-        depth: 0,
-      });
-    }
-
-    idx = bids.length - 1;
-    while (bids.length < maxRowsPerSide) {
-      idx += 1;
-
-      bids.push({
-        key: `bid-${idx}`,
-        side: 'bid',
-        size: 0,
-        price: 0,
-        offset: 0,
-        depth: 0,
-      });
-    }
-
     return { asks, bids, spread, spreadPercent, histogramRange, hasOrderbook: !!orderbook };
   }, [orderbook, openOrdersBySideAndPrice]);
 };
@@ -177,33 +142,31 @@ const OrderbookTable = ({
         getCellValue: (row: RowData) => row.size,
         label: stringGetter({ key: STRING_KEYS.ORDERBOOK_ORDER_SIZE }),
         tag: symbol,
-        renderCell: (row: RowData) =>
+        renderCell: (row: RowData) => (
-          row.size > 0 && (
+          <Styled.HistogramOutput
-            <Styled.HistogramOutput
+            highlightText
-              highlightText
+            type={OutputType.Asset}
-              type={OutputType.Asset}
+            value={row.size}
-              value={row.size}
+            fractionDigits={stepSizeDecimals}
-              fractionDigits={stepSizeDecimals}
+            histogramSide={histogramSide === 'left' && 'left'}
-              histogramSide={histogramSide === 'left' && 'left'}
+            useGrouping={false}
-              useGrouping={false}
+          />
-            />
+        ),
-          ),
       },
       {
         columnKey: 'price',
         getCellValue: (row: RowData) => row.price,
         label: stringGetter({ key: STRING_KEYS.PRICE }),
         tag: 'USD',
-        renderCell: (row: RowData) =>
+        renderCell: (row: RowData) => (
-          row.price > 0 && (
+          <OrderbookTradesOutput
-            <OrderbookTradesOutput
+            highlightText
-              highlightText
+            type={OutputType.Number}
-              type={OutputType.Number}
+            value={row.price}
-              value={row.price}
+            fractionDigits={tickSizeDecimals}
-              fractionDigits={tickSizeDecimals}
+            useGrouping={false}
-              useGrouping={false}
+          />
-            />
+        ),
-          ),
       },
       {
         columnKey: 'subaccount-orders',
@@ -231,13 +194,12 @@ const OrderbookTable = ({
       label="Orderbook"
       data={data}
       columns={columns}
-      getRowKey={(row: RowData) => row.key}
+      getRowKey={(row: RowData) => `${row.side}-${row.price}`}
       getRowAttributes={(row: RowData) => ({
         'data-side': row.side,
         style: {
           '--histogram-bucket-size': row.size,
           '--histogram-bucket-depth': row.depth,
-          '--tr-pointerEvents': row.price ? 'auto' : 'none',
         },
       })}
       onRowAction={onRowAction}
@@ -246,6 +208,7 @@ const OrderbookTable = ({
       // Style props
       histogramSide={histogramSide}
       hideHeader={hideHeader}
+      withFocusStickyRows
       style={{
         '--histogram-range': histogramRange,
       }}
@@ -260,12 +223,11 @@ export const Orderbook = ({
   maxRowsPerSide = ORDERBOOK_MAX_ROWS_PER_SIDE,
   hideHeader = false,
 }: ElementProps & StyleProps) => {
-  const dispatch = useDispatch();
   const stringGetter = useStringGetter();
   const { isTablet } = useBreakpoints();
 
   const currentInput = useSelector(getCurrentInput);
-  const { id = '' } = useSelector(getCurrentMarketAssetData, shallowEqual) ?? {};
+  const { symbol = '' } = useSelector(getCurrentMarketAssetData, shallowEqual) ?? {};
   const { stepSizeDecimals, tickSizeDecimals } =
     useSelector(getCurrentMarketConfig, shallowEqual) ?? {};
 
@@ -276,10 +238,19 @@ export const Orderbook = ({
       maxRowsPerSide,
     });
 
+  const [showRowsPerSide, setShowRowsPerSide] = useState(0);
+
+  // Make rows visible one by one so avoid jumps in initial scroll position
+  useEffect(() => {
+    if (showRowsPerSide < maxRowsPerSide) {
+      setShowRowsPerSide((showRows) => showRows + 1);
+    }
+  }, [showRowsPerSide]);
+
   const data = useMemo(
     () =>
       [
-        ...bids.reverse(),
+        ...bids.slice(0, showRowsPerSide).reverse(),
         {
           key: 'spread',
           slotCustomRow: (props) => (
@@ -296,23 +267,25 @@ export const Orderbook = ({
             </Styled.SpreadTableRow>
           ),
         } as CustomRowConfig,
-        ...asks,
+        ...asks.slice(0, showRowsPerSide),
       ].reverse(),
-    [asks, bids, spread, spreadPercent, isTablet]
+    [asks, bids, spread, spreadPercent, showRowsPerSide, isTablet]
   );
 
   const onRowAction = useCallback(
     (key: string, row: RowData) => {
-      if (currentInput === 'trade' && key !== 'spread' && row?.price) {
+      if (currentInput === 'trade' && key !== 'spread' && row?.price)
-        dispatch(setTradeFormInputs({ limitPriceInput: row?.price?.toString() }));
+        abacusStateManager.setTradeValue({
-      }
+          value: row?.price,
+          field: TradeInputField.limitPrice,
+        });
     },
     [currentInput]
   );
 
   const orderbookTableProps = {
     showMineColumn,
-    symbol: id,
+    symbol,
     stepSizeDecimals,
     tickSizeDecimals,
     histogramRange,
@@ -354,7 +327,7 @@ export const Orderbook = ({
       </Styled.Header>
       <Styled.SplitOrderbook>
         <OrderbookTable data={asks} histogramSide="right" {...orderbookTableProps} />
-        <OrderbookTable data={bids.reverse()} histogramSide="left" {...orderbookTableProps} />
+        <OrderbookTable data={bids} histogramSide="left" {...orderbookTableProps} />
       </Styled.SplitOrderbook>
     </Styled.HorizontalLayout>
   );
@@ -524,7 +497,6 @@ Styled.OrderbookTable = styled(OrderbookTradesTable)<StyleProps>`
 
   tr {
     --histogram-bucket-depth: 0;
-    pointer-events: var(--tr-pointerEvents);
 
     &[data-side='bid'] {
       --accent-color: var(--color-positive);
@@ -538,21 +510,17 @@ Styled.OrderbookTable = styled(OrderbookTradesTable)<StyleProps>`
       content: '';
     }
 
-    ${({ withFocusStickyRows }) =>
+    &:not(:active):is(:focus-visible, :focus-within) {
-      withFocusStickyRows &&
+      ${orderbookMixins.scrollSnapItem}
-      css`
+      z-index: 2;
-        &:not(:active):is(:focus-visible, :focus-within) {
-          ${orderbookMixins.scrollSnapItem}
-          z-index: 2;
 
-          &[data-side='bid'] {
+      &[data-side='bid'] {
-            top: calc(var(--stickyArea-totalInsetTop) + var(--orderbook-spreadRowHeight));
+        top: calc(var(--stickyArea-totalInsetTop) + var(--orderbook-spreadRowHeight));
-          }
+      }
-          &[data-side='ask'] {
+      &[data-side='ask'] {
-            bottom: calc(var(--stickyArea-totalInsetBottom) + var(--orderbook-spreadRowHeight));
+        bottom: calc(var(--stickyArea-totalInsetBottom) + var(--orderbook-spreadRowHeight));
-          }
+      }
-        }
+    }
-      `}
   }
 
   ${Styled.HorizontalLayout} & {