update error str

CCTP deposit/withdraw to throw error if nobleClient is not initialized
2024-01-22 09:48:17 -08:00 · 2024-01-02 21:08:24 -08:00
55 changed files with 857 additions and 1885 deletions
@@ -33,18 +33,17 @@
  "packageManager": "pnpm@8.6.6",
  "dependencies": {
    "@0xsquid/sdk": "^1.10.0",
-    "@cosmjs/amino": "^0.32.1",
-    "@cosmjs/crypto": "^0.32.1",
-    "@cosmjs/encoding": "^0.32.1",
-    "@cosmjs/proto-signing": "^0.32.1",
-    "@cosmjs/stargate": "^0.32.1",
-    "@cosmjs/tendermint-rpc": "^0.32.1",
-    "@dydxprotocol/v4-abacus": "^1.2.5",
-    "@dydxprotocol/v4-client-js": "^1.0.14",
-    "@dydxprotocol/v4-localization": "^1.1.11",
+    "@cosmjs/amino": "^0.31.0",
+    "@cosmjs/crypto": "^0.31.0",
+    "@cosmjs/encoding": "^0.31.0",
+    "@cosmjs/proto-signing": "^0.31.0",
+    "@cosmjs/stargate": "^0.31.0",
+    "@cosmjs/tendermint-rpc": "^0.31.0",
+    "@dydxprotocol/v4-abacus": "^1.1.31",
+    "@dydxprotocol/v4-client-js": "^1.0.11",
+    "@dydxprotocol/v4-localization": "^1.1.5",
    "@ethersproject/providers": "^5.7.2",
    "@js-joda/core": "^5.5.3",
-    "@radix-ui/react-accordion": "^1.1.2",
    "@radix-ui/react-checkbox": "^1.0.4",
    "@radix-ui/react-collapsible": "^1.0.3",
    "@radix-ui/react-dialog": "^1.0.4",
@@ -111,7 +110,7 @@
    "reselect": "^4.1.8",
    "styled-components": "^5.3.11",
    "use-latest": "^1.2.1",
-    "viem": "^1.20.0",
+    "viem": "^1.12.2",
    "wagmi": "^1.4.12"
  },
  "devDependencies": {
@@ -9,41 +9,38 @@ dependencies:
    specifier: ^1.10.0
    version: 1.10.0
  '@cosmjs/amino':
-    specifier: ^0.32.1
-    version: 0.32.2
+    specifier: ^0.31.0
+    version: 0.31.0
  '@cosmjs/crypto':
-    specifier: ^0.32.1
-    version: 0.32.2
+    specifier: ^0.31.0
+    version: 0.31.0
  '@cosmjs/encoding':
-    specifier: ^0.32.1
-    version: 0.32.2
+    specifier: ^0.31.0
+    version: 0.31.0
  '@cosmjs/proto-signing':
-    specifier: ^0.32.1
-    version: 0.32.2
+    specifier: ^0.31.0
+    version: 0.31.0
  '@cosmjs/stargate':
-    specifier: ^0.32.1
-    version: 0.32.2
+    specifier: ^0.31.0
+    version: 0.31.0
  '@cosmjs/tendermint-rpc':
-    specifier: ^0.32.1
-    version: 0.32.2
+    specifier: ^0.31.0
+    version: 0.31.0
  '@dydxprotocol/v4-abacus':
-    specifier: ^1.2.5
-    version: 1.2.5
+    specifier: ^1.1.31
+    version: 1.1.31
  '@dydxprotocol/v4-client-js':
-    specifier: ^1.0.14
-    version: 1.0.14
+    specifier: ^1.0.11
+    version: 1.0.11
  '@dydxprotocol/v4-localization':
-    specifier: ^1.1.11
-    version: 1.1.11
+    specifier: ^1.1.5
+    version: 1.1.5
  '@ethersproject/providers':
    specifier: ^5.7.2
    version: 5.7.2
  '@js-joda/core':
    specifier: ^5.5.3
    version: 5.5.3
-  '@radix-ui/react-accordion':
-    specifier: ^1.1.2
-    version: 1.1.2(@types/react-dom@18.2.6)(@types/react@18.2.14)(react-dom@18.2.0)(react@18.2.0)
  '@radix-ui/react-checkbox':
    specifier: ^1.0.4
    version: 1.0.4(@types/react-dom@18.2.6)(@types/react@18.2.14)(react-dom@18.2.0)(react@18.2.0)
@@ -243,11 +240,11 @@ dependencies:
    specifier: ^1.2.1
    version: 1.2.1(@types/react@18.2.14)(react@18.2.0)
  viem:
-    specifier: ^1.20.0
-    version: 1.20.0(typescript@5.1.3)
+    specifier: ^1.12.2
+    version: 1.12.2(typescript@5.1.3)
  wagmi:
    specifier: ^1.4.12
-    version: 1.4.13(@types/react@18.2.14)(react-dom@18.2.0)(react@18.2.0)(typescript@5.1.3)(viem@1.20.0)
+    version: 1.4.12(@types/react@18.2.14)(react-dom@18.2.0)(react@18.2.0)(typescript@5.1.3)(viem@1.12.2)

 devDependencies:
  '@babel/core':
@@ -392,14 +389,14 @@ packages:
    engines: {node: '>=0.10.0'}
    dev: true

-  /@adraffy/ens-normalize@1.10.0:
-    resolution: {integrity: sha512-nA9XHtlAkYfJxY7bce8DcN7eKxWWCWkU+1GR9d+U6MbNpfwQp8TI7vqOsBsMcHoT4mBu2kypKoSKnghEzOOq5Q==}
-    dev: false
-
  /@adraffy/ens-normalize@1.9.2:
    resolution: {integrity: sha512-0h+FrQDqe2Wn+IIGFkTCd4aAwTJ+7834Ek1COohCyV26AXhwQ7WQaz+4F/nLOeVl/3BtWHOHLPsq46V8YB46Eg==}
    dev: false

+  /@adraffy/ens-normalize@1.9.4:
+    resolution: {integrity: sha512-UK0bHA7hh9cR39V+4gl2/NnBBjoXIxkuWAPCaY4X7fbH4L/azIi7ilWOCjMUYfpJgraLUAqkRi2BqrjME8Rynw==}
+    dev: false
+
  /@ampproject/remapping@2.2.1:
    resolution: {integrity: sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==}
    engines: {node: '>=6.0.0'}
@@ -688,15 +685,6 @@ packages:
      '@cosmjs/utils': 0.31.0
    dev: false

-  /@cosmjs/amino@0.32.2:
-    resolution: {integrity: sha512-lcK5RCVm4OfdAooxKcF2+NwaDVVpghOq6o/A40c2mHXDUzUoRZ33VAHjVJ9Me6vOFxshrw/XEFn1f4KObntjYA==}
-    dependencies:
-      '@cosmjs/crypto': 0.32.2
-      '@cosmjs/encoding': 0.32.2
-      '@cosmjs/math': 0.32.2
-      '@cosmjs/utils': 0.32.2
-    dev: false
-
  /@cosmjs/cosmwasm-stargate@0.30.1:
    resolution: {integrity: sha512-W/6SLUCJAJGBN+sJLXouLZikVgmqDd9LCdlMzQaxczcCHTWeJAmRvOiZGSZaSy3shw/JN1qc6g6PKpvTVgj10A==}
    dependencies:
@@ -750,19 +738,7 @@ packages:
      '@cosmjs/encoding': 0.31.0
      '@cosmjs/math': 0.31.0
      '@cosmjs/utils': 0.31.0
-      '@noble/hashes': 1.3.3
-      bn.js: 5.2.1
-      elliptic: 6.5.4
-      libsodium-wrappers-sumo: 0.7.11
-    dev: false
-
-  /@cosmjs/crypto@0.32.2:
-    resolution: {integrity: sha512-RuxrYKzhrPF9g6NmU7VEq++Hn1vZJjqqJpZ9Tmw9lOYOV8BUsv+j/0BE86kmWi7xVJ7EwxiuxYsKuM8IR18CIA==}
-    dependencies:
-      '@cosmjs/encoding': 0.32.2
-      '@cosmjs/math': 0.32.2
-      '@cosmjs/utils': 0.32.2
-      '@noble/hashes': 1.3.3
+      '@noble/hashes': 1.3.1
      bn.js: 5.2.1
      elliptic: 6.5.4
      libsodium-wrappers-sumo: 0.7.11
@@ -792,8 +768,8 @@ packages:
      readonly-date: 1.0.0
    dev: false

-  /@cosmjs/encoding@0.32.2:
-    resolution: {integrity: sha512-WX7m1wLpA9V/zH0zRcz4EmgZdAv1F44g4dbXOgNj1eXZw1PIGR12p58OEkLN51Ha3S4DKRtCv5CkhK1KHEvQtg==}
+  /@cosmjs/encoding@0.31.1:
+    resolution: {integrity: sha512-IuxP6ewwX6vg9sUJ8ocJD92pkerI4lyG8J5ynAM3NaX3q+n+uMoPRSQXNeL9bnlrv01FF1kIm8if/f5F7ZPtkA==}
    dependencies:
      base64-js: 1.5.1
      bech32: 1.1.4
@@ -814,13 +790,6 @@ packages:
      xstream: 11.14.0
    dev: false

-  /@cosmjs/json-rpc@0.32.2:
-    resolution: {integrity: sha512-lan2lOgmz4yVE/HR8eCOSiII/1OudIulk8836koyIDCsPEpt6eKBuctnAD168vABGArKccLAo7Mr2gy9nrKrOQ==}
-    dependencies:
-      '@cosmjs/stream': 0.32.2
-      xstream: 11.14.0
-    dev: false
-
  /@cosmjs/launchpad@0.27.1:
    resolution: {integrity: sha512-DcFwGD/z5PK8CzO2sojDxa+Be9EIEtRZb2YawgVnw2Ht/p5FlNv+OVo8qlishpBdalXEN7FvQ1dVeDFEe9TuJw==}
    dependencies:
@@ -853,8 +822,8 @@ packages:
      bn.js: 5.2.1
    dev: false

-  /@cosmjs/math@0.32.2:
-    resolution: {integrity: sha512-b8+ruAAY8aKtVKWSft2IvtCVCUH1LigIlf9ALIiY8n9jtM4kMASiaRbQ/27etnSAInV88IaezKK9rQZrtxTjcw==}
+  /@cosmjs/math@0.31.1:
+    resolution: {integrity: sha512-kiuHV6m6DSB8/4UV1qpFhlc4ul8SgLXTGRlYkYiIIP4l0YNeJ+OpPYaOlEgx4Unk2mW3/O2FWYj7Jc93+BWXng==}
    dependencies:
      bn.js: 5.2.1
    dev: false
@@ -883,17 +852,6 @@ packages:
      long: 4.0.0
    dev: false

-  /@cosmjs/proto-signing@0.32.2:
-    resolution: {integrity: sha512-UV4WwkE3W3G3s7wwU9rizNcUEz2g0W8jQZS5J6/3fiN0mRPwtPKQ6EinPN9ASqcAJ7/VQH4/9EPOw7d6XQGnqw==}
-    dependencies:
-      '@cosmjs/amino': 0.32.2
-      '@cosmjs/crypto': 0.32.2
-      '@cosmjs/encoding': 0.32.2
-      '@cosmjs/math': 0.32.2
-      '@cosmjs/utils': 0.32.2
-      cosmjs-types: 0.9.0
-    dev: false
-
  /@cosmjs/socket@0.30.1:
    resolution: {integrity: sha512-r6MpDL+9N+qOS/D5VaxnPaMJ3flwQ36G+vPvYJsXArj93BjgyFB7BwWwXCQDzZ+23cfChPUfhbINOenr8N2Kow==}
    dependencies:
@@ -918,18 +876,6 @@ packages:
      - utf-8-validate
    dev: false

-  /@cosmjs/socket@0.32.2:
-    resolution: {integrity: sha512-Qc8jaw4uSBJm09UwPgkqe3g9TBFx4ZR9HkXpwT6Z9I+6kbLerXPR0Gy3NSJFSUgxIfTpO8O1yqoWAyf0Ay17Mw==}
-    dependencies:
-      '@cosmjs/stream': 0.32.2
-      isomorphic-ws: 4.0.1(ws@7.5.9)
-      ws: 7.5.9
-      xstream: 11.14.0
-    transitivePeerDependencies:
-      - bufferutil
-      - utf-8-validate
-    dev: false
-
  /@cosmjs/stargate@0.30.1:
    resolution: {integrity: sha512-RdbYKZCGOH8gWebO7r6WvNnQMxHrNXInY/gPHPzMjbQF6UatA6fNM2G2tdgS5j5u7FTqlCI10stNXrknaNdzog==}
    dependencies:
@@ -972,25 +918,6 @@ packages:
      - utf-8-validate
    dev: false

-  /@cosmjs/stargate@0.32.2:
-    resolution: {integrity: sha512-AsJa29fT7Jd4xt9Ai+HMqhyj7UQu7fyYKdXj/8+/9PD74xe6lZSYhQPcitUmMLJ1ckKPgXSk5Dd2LbsQT0IhZg==}
-    dependencies:
-      '@confio/ics23': 0.6.8
-      '@cosmjs/amino': 0.32.2
-      '@cosmjs/encoding': 0.32.2
-      '@cosmjs/math': 0.32.2
-      '@cosmjs/proto-signing': 0.32.2
-      '@cosmjs/stream': 0.32.2
-      '@cosmjs/tendermint-rpc': 0.32.2
-      '@cosmjs/utils': 0.32.2
-      cosmjs-types: 0.9.0
-      xstream: 11.14.0
-    transitivePeerDependencies:
-      - bufferutil
-      - debug
-      - utf-8-validate
-    dev: false
-
  /@cosmjs/stream@0.30.1:
    resolution: {integrity: sha512-Fg0pWz1zXQdoxQZpdHRMGvUH5RqS6tPv+j9Eh7Q953UjMlrwZVo0YFLC8OTf/HKVf10E4i0u6aM8D69Q6cNkgQ==}
    dependencies:
@@ -1003,12 +930,6 @@ packages:
      xstream: 11.14.0
    dev: false

-  /@cosmjs/stream@0.32.2:
-    resolution: {integrity: sha512-gpCufLfHAD8Zp1ZKge7AHbDf4RA0TZp66wZY6JaQR5bSiEF2Drjtp4mwXZPGejtaUMnaAgff3LrUzPJfKYdQwg==}
-    dependencies:
-      xstream: 11.14.0
-    dev: false
-
  /@cosmjs/tendermint-rpc@0.30.1:
    resolution: {integrity: sha512-Z3nCwhXSbPZJ++v85zHObeUggrEHVfm1u18ZRwXxFE9ZMl5mXTybnwYhczuYOl7KRskgwlB+rID0WYACxj4wdQ==}
    dependencies:
@@ -1047,25 +968,6 @@ packages:
      - utf-8-validate
    dev: false

-  /@cosmjs/tendermint-rpc@0.32.2:
-    resolution: {integrity: sha512-DXyJHDmcAfCix4H/7/dKR0UMdshP01KxJOXHdHxBCbLIpck94BsWD3B2ZTXwfA6sv98so9wOzhp7qGQa5malxg==}
-    dependencies:
-      '@cosmjs/crypto': 0.32.2
-      '@cosmjs/encoding': 0.32.2
-      '@cosmjs/json-rpc': 0.32.2
-      '@cosmjs/math': 0.32.2
-      '@cosmjs/socket': 0.32.2
-      '@cosmjs/stream': 0.32.2
-      '@cosmjs/utils': 0.32.2
-      axios: 1.6.5
-      readonly-date: 1.0.0
-      xstream: 11.14.0
-    transitivePeerDependencies:
-      - bufferutil
-      - debug
-      - utf-8-validate
-    dev: false
-
  /@cosmjs/utils@0.27.1:
    resolution: {integrity: sha512-VG7QPDiMUzVPxRdJahDV8PXxVdnuAHiIuG56hldV4yPnOz/si/DLNd7VAUUA5923b6jS1Hhev0Hr6AhEkcxBMg==}
    dev: false
@@ -1078,53 +980,52 @@ packages:
    resolution: {integrity: sha512-nNcycZWUYLNJlrIXgpcgVRqdl6BXjF4YlXdxobQWpW9Tikk61bEGeAFhDYtC0PwHlokCNw0KxWiHGJL4nL7Q5A==}
    dev: false

-  /@cosmjs/utils@0.32.2:
-    resolution: {integrity: sha512-Gg5t+eR7vPJMAmhkFt6CZrzPd0EKpAslWwk5rFVYZpJsM8JG5KT9XQ99hgNM3Ov6ScNoIWbXkpX27F6A9cXR4Q==}
+  /@cosmjs/utils@0.31.1:
+    resolution: {integrity: sha512-n4Se1wu4GnKwztQHNFfJvUeWcpvx3o8cWhSbNs9JQShEuB3nv3R5lqFBtDCgHZF/emFQAP+ZjF8bTfCs9UBGhA==}
    dev: false

  /@cush/relative@1.0.0:
    resolution: {integrity: sha512-RpfLEtTlyIxeNPGKcokS+p3BZII/Q3bYxryFRglh5H3A3T8q9fsLYm72VYAMEOOIBLEa8o93kFLiBDUWKrwXZA==}
    dev: true

-  /@dydxprotocol/v4-abacus@1.2.5:
-    resolution: {integrity: sha512-pB3Fv1bzJRUDp29kAN61daZ34gTSGrSTNh+/AP3TUB63/Q/gaXQVBf91xVcso4Hw23xM3FwIcrRK0cvOSWgXKg==}
+  /@dydxprotocol/v4-abacus@1.1.31:
+    resolution: {integrity: sha512-CBfK78u/y2/9KR/w2f7IGhU6tKt/seoKHlsal0vk2WlJsjXnlTKoOQ3HpCSGoMmI5ZLQeqbFClvNH4RZLhEwzg==}
    dev: false

-  /@dydxprotocol/v4-client-js@1.0.14:
-    resolution: {integrity: sha512-nIjj9OKuXb3n3rrihDPkBE6OIBxXNB7gf0NMsrG1Pc9O7M0yjpitTUgnfIzplf0XMrtmozWRYZhlLgBfJcIbBg==}
+  /@dydxprotocol/v4-client-js@1.0.11:
+    resolution: {integrity: sha512-rJNFGTO+HU1GQppXeRLKXNk4HWx/h+DjU2sUCieEv5mnRIMQpLw8dH/L+Uyhxx2oovccY1MaKB4Fr9IngdrF0A==}
    dependencies:
-      '@cosmjs/amino': 0.32.2
-      '@cosmjs/encoding': 0.32.2
-      '@cosmjs/math': 0.32.2
-      '@cosmjs/proto-signing': 0.32.2
-      '@cosmjs/stargate': 0.32.2
-      '@cosmjs/tendermint-rpc': 0.32.2
-      '@cosmjs/utils': 0.32.2
-      '@dydxprotocol/v4-proto': 3.0.0-dev.0
+      '@cosmjs/amino': 0.30.1
+      '@cosmjs/encoding': 0.31.1
+      '@cosmjs/math': 0.31.1
+      '@cosmjs/proto-signing': 0.30.1
+      '@cosmjs/stargate': 0.30.1
+      '@cosmjs/tendermint-rpc': 0.30.1
+      '@cosmjs/utils': 0.31.1
+      '@dydxprotocol/v4-proto': 0.4.1
      '@osmonauts/lcd': 0.6.0
      '@scure/bip32': 1.3.2
      '@scure/bip39': 1.2.1
      axios: 1.1.3
      bech32: 1.1.4
      bignumber.js: 9.1.1
-      cosmjs-types: 0.9.0
      ethereum-cryptography: 2.1.2
      ethers: 6.6.1
      long: 4.0.0
      protobufjs: 6.11.4
-      ws: 8.15.1(bufferutil@4.0.8)(utf-8-validate@5.0.10)
+      ws: 8.15.0
    transitivePeerDependencies:
      - bufferutil
      - debug
      - utf-8-validate
    dev: false

-  /@dydxprotocol/v4-localization@1.1.11:
-    resolution: {integrity: sha512-ZHnyrWD1bEpvY1tctkcmSV6A5+hQSYBFwyjbiyOqepqDqrv24J5a3hlZU94lDyYf+7Sdk3alOvy9Z7Lpk59nvw==}
+  /@dydxprotocol/v4-localization@1.1.5:
+    resolution: {integrity: sha512-Y25yuCLFaK3v/81B60lc3qthaWwJn1fNJuYQdOtgnmOhLNqI4YRryUncLkbjdB5xd4QODq5KZikP34pLKX9sgA==}
    dev: false

-  /@dydxprotocol/v4-proto@3.0.0-dev.0:
-    resolution: {integrity: sha512-hT6F/AgaTqv8Bwo7twpIhmjXvJE/Fx+3mmHHTuIXMeL6OhVtlOpcEQyHvBEAdh1VrNq/S7qWvdQD0fvC/UgKyA==}
+  /@dydxprotocol/v4-proto@0.4.1:
+    resolution: {integrity: sha512-2pBkokufWcxfIpiXE6QuQOBXUe154OTp6ojCIdOPW9TFLxzchoygxXnb5dL6rAQVNj9Qbg+hhXBllutt4m99dw==}
    dependencies:
      protobufjs: 6.11.4
    dev: false
@@ -2419,35 +2320,6 @@ packages:
      '@babel/runtime': 7.22.10
    dev: false

-  /@radix-ui/react-accordion@1.1.2(@types/react-dom@18.2.6)(@types/react@18.2.14)(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-fDG7jcoNKVjSK6yfmuAs0EnPDro0WMXIhMtXdTBWqEioVW206ku+4Lw07e+13lUkFkpoEQ2PdeMIAGpdqEAmDg==}
-    peerDependencies:
-      '@types/react': '*'
-      '@types/react-dom': '*'
-      react: ^16.8 || ^17.0 || ^18.0
-      react-dom: ^16.8 || ^17.0 || ^18.0
-    peerDependenciesMeta:
-      '@types/react':
-        optional: true
-      '@types/react-dom':
-        optional: true
-    dependencies:
-      '@babel/runtime': 7.22.10
-      '@radix-ui/primitive': 1.0.1
-      '@radix-ui/react-collapsible': 1.0.3(@types/react-dom@18.2.6)(@types/react@18.2.14)(react-dom@18.2.0)(react@18.2.0)
-      '@radix-ui/react-collection': 1.0.3(@types/react-dom@18.2.6)(@types/react@18.2.14)(react-dom@18.2.0)(react@18.2.0)
-      '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.14)(react@18.2.0)
-      '@radix-ui/react-context': 1.0.1(@types/react@18.2.14)(react@18.2.0)
-      '@radix-ui/react-direction': 1.0.1(@types/react@18.2.14)(react@18.2.0)
-      '@radix-ui/react-id': 1.0.1(@types/react@18.2.14)(react@18.2.0)
-      '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.6)(@types/react@18.2.14)(react-dom@18.2.0)(react@18.2.0)
-      '@radix-ui/react-use-controllable-state': 1.0.1(@types/react@18.2.14)(react@18.2.0)
-      '@types/react': 18.2.14
-      '@types/react-dom': 18.2.6
-      react: 18.2.0
-      react-dom: 18.2.0(react@18.2.0)
-    dev: false
-
  /@radix-ui/react-arrow@1.0.3(@types/react-dom@18.2.6)(@types/react@18.2.14)(react-dom@18.2.0)(react@18.2.0):
    resolution: {integrity: sha512-wSP+pHsB/jQRaL6voubsQ/ZlrGBHHrOjmBnr19hxYgtS0WvAFwZhK2WP/YY5yF9uKECCEEDGxuLxq1NBK51wFA==}
    peerDependencies:
@@ -4986,7 +4858,7 @@ packages:
    resolution: {integrity: sha512-XJbEPuaVc7b9n23MqlF6c+ToYIS3f7P2Sel8f3cSBQ9WORE4xrSuvhMpK9fDSFqJ7by/brc+rmJR/5HViRr0/w==}
    dependencies:
      '@safe-global/safe-gateway-typescript-sdk': 3.9.0
-      viem: 1.20.0(typescript@5.1.3)
+      viem: 1.12.2(typescript@5.1.3)
    transitivePeerDependencies:
      - bufferutil
      - encoding
@@ -5490,13 +5362,31 @@ packages:
      use-sync-external-store: 1.2.0(react@18.2.0)
    dev: false

-  /@tanstack/react-query-persist-client@4.32.6(@tanstack/react-query@4.36.1):
+  /@tanstack/react-query-persist-client@4.32.6(@tanstack/react-query@4.32.6):
    resolution: {integrity: sha512-EmNnYpvFYpxS4j5WFeNmfVVBxqq4RDnEFDBZwNKRfb4pzukcx/hcWtwqFk7Qj0EI4Dk8QGl239MEYwJbAc83tQ==}
    peerDependencies:
      '@tanstack/react-query': ^4.32.6
    dependencies:
      '@tanstack/query-persist-client-core': 4.32.6
-      '@tanstack/react-query': 4.36.1(react-dom@18.2.0)(react@18.2.0)
+      '@tanstack/react-query': 4.32.6(react-dom@18.2.0)(react@18.2.0)
+    dev: false
+
+  /@tanstack/react-query@4.32.6(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-AITu/IKJJJXsHHeXNBy5bclu12t08usMCY0vFC2dh9SP/w6JAk5U9GwfjOIPj3p+ATADZvxQPe8UiCtMLNeQbg==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-native: '*'
+    peerDependenciesMeta:
+      react-dom:
+        optional: true
+      react-native:
+        optional: true
+    dependencies:
+      '@tanstack/query-core': 4.32.6
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      use-sync-external-store: 1.2.0(react@18.2.0)
    dev: false

  /@tanstack/react-query@4.36.1(react-dom@18.2.0)(react@18.2.0):
@@ -5702,7 +5592,6 @@ packages:

  /@types/node@20.3.1:
    resolution: {integrity: sha512-EhcH/wvidPy1WeML3TtYFGR83UzjxeWRen9V402T8aUGYsCHOmfoisV3ZSg03gAFIbLq8TnWOJ0f4cALtnSEUg==}
-    dev: true

  /@types/normalize-package-data@2.4.1:
    resolution: {integrity: sha512-Gj7cI7z+98M282Tqmp2K5EIsoouUEzbBJhQQzDE3jSIRk6r9gsz0oUokqIUR4u1R3dMHo0pDHM7sNOHyhulypw==}
@@ -5764,6 +5653,12 @@ packages:
      '@types/node': 20.10.5
    dev: false

+  /@types/ws@8.5.6:
+    resolution: {integrity: sha512-8B5EO9jLVCy+B58PLHvLDuOD8DRVMgQzq8d55SjLCOn9kqGyqOvy27exVaTio1q1nX5zLu8/6N0n2ThSxOM6tg==}
+    dependencies:
+      '@types/node': 20.3.1
+    dev: false
+
  /@typescript-eslint/eslint-plugin@5.60.0(@typescript-eslint/parser@5.60.0)(eslint@8.43.0)(typescript@5.1.3):
    resolution: {integrity: sha512-78B+anHLF1TI8Jn/cD0Q00TBYdMgjdOn980JfAVa9yw5sop8nyTfVOQAv6LWywkOGLclDBtv5z3oxN4w7jxyNg==}
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
@@ -6260,8 +6155,8 @@ packages:
      pretty-format: 27.5.1
    dev: true

-  /@wagmi/connectors@3.1.11(@types/react@18.2.14)(react@18.2.0)(typescript@5.1.3)(viem@1.20.0):
-    resolution: {integrity: sha512-wzxp9f9PtSUFjDUP/QDjc1t7HON4D8wrVKsw35ejdO8hToDpx1gU9lwH/47Zo/1zExGezQc392sjoHSszYd7OA==}
+  /@wagmi/connectors@3.1.10(@types/react@18.2.14)(react@18.2.0)(typescript@5.1.3)(viem@1.12.2):
+    resolution: {integrity: sha512-ZLJC1QaeiZarkF07Cr9mOlVjPO1Lf5TBx+JKBms2y5fUIXlKrxCfQgO/gDCureboI+Us2X3IRI659+XacSGpbA==}
    peerDependencies:
      typescript: '>=5.0.4'
      viem: '>=0.3.35'
@@ -6272,14 +6167,14 @@ packages:
      '@coinbase/wallet-sdk': 3.7.1
      '@safe-global/safe-apps-provider': 0.18.1(typescript@5.1.3)
      '@safe-global/safe-apps-sdk': 8.1.0(typescript@5.1.3)
-      '@walletconnect/ethereum-provider': 2.11.0(@types/react@18.2.14)(react@18.2.0)
+      '@walletconnect/ethereum-provider': 2.10.6(@types/react@18.2.14)(react@18.2.0)
      '@walletconnect/legacy-provider': 2.0.0
      '@walletconnect/modal': 2.6.2(@types/react@18.2.14)(react@18.2.0)
-      '@walletconnect/utils': 2.11.0
+      '@walletconnect/utils': 2.10.2
      abitype: 0.8.7(typescript@5.1.3)
      eventemitter3: 4.0.7
      typescript: 5.1.3
-      viem: 1.20.0(typescript@5.1.3)
+      viem: 1.12.2(typescript@5.1.3)
    transitivePeerDependencies:
      - '@azure/app-configuration'
      - '@azure/cosmos'
@@ -6302,8 +6197,8 @@ packages:
      - zod
    dev: false

-  /@wagmi/core@1.4.13(@types/react@18.2.14)(react@18.2.0)(typescript@5.1.3)(viem@1.20.0):
-    resolution: {integrity: sha512-ytMCvXbBOgfDu9Qw67279wq/jNEe7EZLjLyekX7ROnvHRADqFr3lwZI6ih41UmtRZAmXAx8Ghyuqy154EjB5mQ==}
+  /@wagmi/core@1.4.12(@types/react@18.2.14)(react@18.2.0)(typescript@5.1.3)(viem@1.12.2):
+    resolution: {integrity: sha512-bLcYmmGgjtl3jAGo8X3Sm6oUwsdjbVxFMu9SWnwHdE4S9JdYeWM57dEhQgq8SYul2yQ7yY2/gimBf1Or0Ky3dQ==}
    peerDependencies:
      typescript: '>=5.0.4'
      viem: '>=0.3.35'
@@ -6311,11 +6206,11 @@ packages:
      typescript:
        optional: true
    dependencies:
-      '@wagmi/connectors': 3.1.11(@types/react@18.2.14)(react@18.2.0)(typescript@5.1.3)(viem@1.20.0)
+      '@wagmi/connectors': 3.1.10(@types/react@18.2.14)(react@18.2.0)(typescript@5.1.3)(viem@1.12.2)
      abitype: 0.8.7(typescript@5.1.3)
      eventemitter3: 4.0.7
      typescript: 5.1.3
-      viem: 1.20.0(typescript@5.1.3)
+      viem: 1.12.2(typescript@5.1.3)
      zustand: 4.4.7(@types/react@18.2.14)(react@18.2.0)
    transitivePeerDependencies:
      - '@azure/app-configuration'
@@ -6377,45 +6272,6 @@ packages:
      - utf-8-validate
    dev: false

-  /@walletconnect/core@2.11.0:
-    resolution: {integrity: sha512-2Tjp5BCevI7dbmqo/OrCjX4tqgMqwJNQLlQAlphqPfvwlF9+tIu6pGcVbSN3U9zyXzWIZCeleqEaWUeSeET4Ew==}
-    dependencies:
-      '@walletconnect/heartbeat': 1.2.1
-      '@walletconnect/jsonrpc-provider': 1.0.13
-      '@walletconnect/jsonrpc-types': 1.0.3
-      '@walletconnect/jsonrpc-utils': 1.0.8
-      '@walletconnect/jsonrpc-ws-connection': 1.0.14
-      '@walletconnect/keyvaluestorage': 1.1.1
-      '@walletconnect/logger': 2.0.1
-      '@walletconnect/relay-api': 1.0.9
-      '@walletconnect/relay-auth': 1.0.4
-      '@walletconnect/safe-json': 1.0.2
-      '@walletconnect/time': 1.0.2
-      '@walletconnect/types': 2.11.0
-      '@walletconnect/utils': 2.11.0
-      events: 3.3.0
-      isomorphic-unfetch: 3.1.0
-      lodash.isequal: 4.5.0
-      uint8arrays: 3.1.1
-    transitivePeerDependencies:
-      - '@azure/app-configuration'
-      - '@azure/cosmos'
-      - '@azure/data-tables'
-      - '@azure/identity'
-      - '@azure/keyvault-secrets'
-      - '@azure/storage-blob'
-      - '@capacitor/preferences'
-      - '@netlify/blobs'
-      - '@planetscale/database'
-      - '@react-native-async-storage/async-storage'
-      - '@upstash/redis'
-      - '@vercel/kv'
-      - bufferutil
-      - encoding
-      - supports-color
-      - utf-8-validate
-    dev: false
-
  /@walletconnect/crypto@1.0.3:
    resolution: {integrity: sha512-+2jdORD7XQs76I2Odgr3wwrtyuLUXD/kprNVsjWRhhhdO9Mt6WqVzOPu0/t7OHSmgal8k7SoBQzUc5hu/8zL/g==}
    dependencies:
@@ -6441,18 +6297,18 @@ packages:
      tslib: 1.14.1
    dev: false

-  /@walletconnect/ethereum-provider@2.11.0(@types/react@18.2.14)(react@18.2.0):
-    resolution: {integrity: sha512-YrTeHVjuSuhlUw7SQ6xBJXDuJ6iAC+RwINm9nVhoKYJSHAy3EVSJZOofMKrnecL0iRMtD29nj57mxAInIBRuZA==}
+  /@walletconnect/ethereum-provider@2.10.6(@types/react@18.2.14)(react@18.2.0):
+    resolution: {integrity: sha512-bBQ+yUfxLv8VxNttgNKY7nED35gSVayO/BnLHbNKvyV1gpvSCla5mWB9MsXuQs70MK0g+/qtgRVSrOtdSubaNQ==}
    dependencies:
      '@walletconnect/jsonrpc-http-connection': 1.0.7
      '@walletconnect/jsonrpc-provider': 1.0.13
      '@walletconnect/jsonrpc-types': 1.0.3
      '@walletconnect/jsonrpc-utils': 1.0.8
      '@walletconnect/modal': 2.6.2(@types/react@18.2.14)(react@18.2.0)
-      '@walletconnect/sign-client': 2.11.0
-      '@walletconnect/types': 2.11.0
-      '@walletconnect/universal-provider': 2.11.0
-      '@walletconnect/utils': 2.11.0
+      '@walletconnect/sign-client': 2.10.6
+      '@walletconnect/types': 2.10.6
+      '@walletconnect/universal-provider': 2.10.6
+      '@walletconnect/utils': 2.10.6
      events: 3.3.0
    transitivePeerDependencies:
      - '@azure/app-configuration'
@@ -6720,17 +6576,20 @@ packages:
      - utf-8-validate
    dev: false

-  /@walletconnect/sign-client@2.11.0:
-    resolution: {integrity: sha512-H2ukscibBS+6WrzQWh+WyVBqO5z4F5et12JcwobdwgHnJSlqIoZxqnUYYWNCI5rUR5UKsKWaUyto4AE9N5dw4Q==}
+  /@walletconnect/time@1.0.2:
+    resolution: {integrity: sha512-uzdd9woDcJ1AaBZRhqy5rNC9laqWGErfc4dxA9a87mPdKOgWMD85mcFo9dIYIts/Jwocfwn07EC6EzclKubk/g==}
+    dependencies:
+      tslib: 1.14.1
+    dev: false
+
+  /@walletconnect/types@2.10.2:
+    resolution: {integrity: sha512-luNV+07Wdla4STi9AejseCQY31tzWKQ5a7C3zZZaRK/di+rFaAAb7YW04OP4klE7tw/mJRGPTlekZElmHxO8kQ==}
    dependencies:
-      '@walletconnect/core': 2.11.0
      '@walletconnect/events': 1.0.1
      '@walletconnect/heartbeat': 1.2.1
-      '@walletconnect/jsonrpc-utils': 1.0.8
+      '@walletconnect/jsonrpc-types': 1.0.3
+      '@walletconnect/keyvaluestorage': 1.1.1
      '@walletconnect/logger': 2.0.1
-      '@walletconnect/time': 1.0.2
-      '@walletconnect/types': 2.11.0
-      '@walletconnect/utils': 2.11.0
      events: 3.3.0
    transitivePeerDependencies:
      - '@azure/app-configuration'
@@ -6745,16 +6604,7 @@ packages:
      - '@react-native-async-storage/async-storage'
      - '@upstash/redis'
      - '@vercel/kv'
-      - bufferutil
-      - encoding
      - supports-color
-      - utf-8-validate
-    dev: false
-
-  /@walletconnect/time@1.0.2:
-    resolution: {integrity: sha512-uzdd9woDcJ1AaBZRhqy5rNC9laqWGErfc4dxA9a87mPdKOgWMD85mcFo9dIYIts/Jwocfwn07EC6EzclKubk/g==}
-    dependencies:
-      tslib: 1.14.1
    dev: false

  /@walletconnect/types@2.10.6:
@@ -6782,42 +6632,17 @@ packages:
      - supports-color
    dev: false

-  /@walletconnect/types@2.11.0:
-    resolution: {integrity: sha512-AB5b1lrEbCGHxqS2vqfCkIoODieH+ZAUp9rA1O2ftrhnqDJiJK983Df87JhYhECsQUBHHfALphA8ydER0q+9sw==}
-    dependencies:
-      '@walletconnect/events': 1.0.1
-      '@walletconnect/heartbeat': 1.2.1
-      '@walletconnect/jsonrpc-types': 1.0.3
-      '@walletconnect/keyvaluestorage': 1.1.1
-      '@walletconnect/logger': 2.0.1
-      events: 3.3.0
-    transitivePeerDependencies:
-      - '@azure/app-configuration'
-      - '@azure/cosmos'
-      - '@azure/data-tables'
-      - '@azure/identity'
-      - '@azure/keyvault-secrets'
-      - '@azure/storage-blob'
-      - '@capacitor/preferences'
-      - '@netlify/blobs'
-      - '@planetscale/database'
-      - '@react-native-async-storage/async-storage'
-      - '@upstash/redis'
-      - '@vercel/kv'
-      - supports-color
-    dev: false
-
-  /@walletconnect/universal-provider@2.11.0:
-    resolution: {integrity: sha512-zgJv8jDvIMP4Qse/D9oIRXGdfoNqonsrjPZanQ/CHNe7oXGOBiQND2IIeX+tS0H7uNA0TPvctljCLiIN9nw4eA==}
+  /@walletconnect/universal-provider@2.10.6:
+    resolution: {integrity: sha512-CEivusqqoD31BhCTKp08DnrccfGjwD9MFjZs5BNRorDteRFE8zVm9LmP6DSiNJCw82ZajGlZThggLQ/BAATfwA==}
    dependencies:
      '@walletconnect/jsonrpc-http-connection': 1.0.7
      '@walletconnect/jsonrpc-provider': 1.0.13
      '@walletconnect/jsonrpc-types': 1.0.3
      '@walletconnect/jsonrpc-utils': 1.0.8
      '@walletconnect/logger': 2.0.1
-      '@walletconnect/sign-client': 2.11.0
-      '@walletconnect/types': 2.11.0
-      '@walletconnect/utils': 2.11.0
+      '@walletconnect/sign-client': 2.10.6
+      '@walletconnect/types': 2.10.6
+      '@walletconnect/utils': 2.10.6
      events: 3.3.0
    transitivePeerDependencies:
      - '@azure/app-configuration'
@@ -6838,8 +6663,8 @@ packages:
      - utf-8-validate
    dev: false

-  /@walletconnect/utils@2.10.6:
-    resolution: {integrity: sha512-oRsWWhN2+hi3aiDXrQEOfysz6FHQJGXLsNQPVt+WIBJplO6Szmdau9dbleD88u1iiT4GKPqE0R9FOYvvPm1H/w==}
+  /@walletconnect/utils@2.10.2:
+    resolution: {integrity: sha512-syxXRpc2yhSknMu3IfiBGobxOY7fLfLTJuw+ppKaeO6WUdZpIit3wfuGOcc0Ms3ZPFCrGfyGOoZsCvgdXtptRg==}
    dependencies:
      '@stablelib/chacha20poly1305': 1.0.1
      '@stablelib/hkdf': 1.0.1
@@ -6849,7 +6674,7 @@ packages:
      '@walletconnect/relay-api': 1.0.9
      '@walletconnect/safe-json': 1.0.2
      '@walletconnect/time': 1.0.2
-      '@walletconnect/types': 2.10.6
+      '@walletconnect/types': 2.10.2
      '@walletconnect/window-getters': 1.0.1
      '@walletconnect/window-metadata': 1.0.1
      detect-browser: 5.3.0
@@ -6871,8 +6696,8 @@ packages:
      - supports-color
    dev: false

-  /@walletconnect/utils@2.11.0:
-    resolution: {integrity: sha512-hxkHPlTlDQILHfIKXlmzgNJau/YcSBC3XHUSuZuKZbNEw3duFT6h6pm3HT/1+j1a22IG05WDsNBuTCRkwss+BQ==}
+  /@walletconnect/utils@2.10.6:
+    resolution: {integrity: sha512-oRsWWhN2+hi3aiDXrQEOfysz6FHQJGXLsNQPVt+WIBJplO6Szmdau9dbleD88u1iiT4GKPqE0R9FOYvvPm1H/w==}
    dependencies:
      '@stablelib/chacha20poly1305': 1.0.1
      '@stablelib/hkdf': 1.0.1
@@ -6882,7 +6707,7 @@ packages:
      '@walletconnect/relay-api': 1.0.9
      '@walletconnect/safe-json': 1.0.2
      '@walletconnect/time': 1.0.2
-      '@walletconnect/types': 2.11.0
+      '@walletconnect/types': 2.10.6
      '@walletconnect/window-getters': 1.0.1
      '@walletconnect/window-metadata': 1.0.1
      detect-browser: 5.3.0
@@ -7476,7 +7301,7 @@ packages:
  /axios@0.21.4:
    resolution: {integrity: sha512-ut5vewkiu8jjGBdqpM44XxjuCjq9LAKeHVmoVfHVzy8eHgxxq8SbAVQNovDA8mVi05kP0Ea/n/UzcSHcTJQfNg==}
    dependencies:
-      follow-redirects: 1.15.5
+      follow-redirects: 1.15.2
    transitivePeerDependencies:
      - debug
    dev: false
@@ -7493,17 +7318,7 @@ packages:
  /axios@1.1.3:
    resolution: {integrity: sha512-00tXVRwKx/FZr/IDVFt4C+f9FYairX517WoGCL6dpOntqLkZofjhu43F/Xl44UOpqa+9sLFDrG/XAnFsUYgkDA==}
    dependencies:
-      follow-redirects: 1.15.5
-      form-data: 4.0.0
-      proxy-from-env: 1.1.0
-    transitivePeerDependencies:
-      - debug
-    dev: false
-
-  /axios@1.6.5:
-    resolution: {integrity: sha512-Ii012v05KEVuUoFWmMW/UQv9aRIc3ZwkWDcM+h5Il8izZCtRVpDUfwpoFf7eOtajT3QiGR4yDUx7lPqHJULgbg==}
-    dependencies:
-      follow-redirects: 1.15.5
+      follow-redirects: 1.15.2
      form-data: 4.0.0
      proxy-from-env: 1.1.0
    transitivePeerDependencies:
@@ -8167,15 +7982,11 @@ packages:
      protobufjs: 6.11.4
    dev: false

-  /cosmjs-types@0.9.0:
-    resolution: {integrity: sha512-MN/yUe6mkJwHnCFfsNPeCfXVhyxHYW6c/xDUzrSbBycYzw++XvWDMJArXp2pLdgD6FQ8DW79vkPjeNKVrXaHeQ==}
-    dev: false
-
  /cosmos-directory-client@0.0.6:
    resolution: {integrity: sha512-WIdaQ8uW1vIbYvNnAVunkC6yxTrneJC7VQ5UUQ0kuw8b0C0A39KTIpoQHCfc8tV7o9vF4niwRhdXEdfAgQEsQQ==}
    dependencies:
      cosmos-directory-types: 0.0.6
-      node-fetch-native: 1.6.1
+      node-fetch-native: 1.4.1
    dev: false

  /cosmos-directory-types@0.0.6:
@@ -9536,16 +9347,6 @@ packages:
        optional: true
    dev: false

-  /follow-redirects@1.15.5:
-    resolution: {integrity: sha512-vSFWUON1B+yAw1VN4xMfxgn5fTUiaOzAJCKBwIIgT/+7CuGy9+r+5gITvP62j3RmaD5Ph65UaERdOSRGUzZtgw==}
-    engines: {node: '>=4.0'}
-    peerDependencies:
-      debug: '*'
-    peerDependenciesMeta:
-      debug:
-        optional: true
-    dev: false
-
  /for-each@0.3.3:
    resolution: {integrity: sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==}
    dependencies:
@@ -10605,15 +10406,6 @@ packages:
    engines: {node: '>=12'}
    dev: true

-  /isomorphic-unfetch@3.1.0:
-    resolution: {integrity: sha512-geDJjpoZ8N0kWexiwkX8F9NkTsXhetLPVbZFQ+JTW239QNOwvB0gniuR1Wc6f0AMTn7/mFGyXvHTifrCp/GH8Q==}
-    dependencies:
-      node-fetch: 2.6.12
-      unfetch: 4.2.0
-    transitivePeerDependencies:
-      - encoding
-    dev: false
-
  /isomorphic-ws@4.0.1(ws@7.5.9):
    resolution: {integrity: sha512-BhBvN2MBpWTaSHdWRb/bwdZJ1WaehQ2L1KngkCkfLUGF0mAWAT1sQUQacEmQ0jXkFw/czDXPNQSL5u2/Krsz1w==}
    peerDependencies:
@@ -10622,8 +10414,8 @@ packages:
      ws: 7.5.9
    dev: false

-  /isows@1.0.3(ws@8.13.0):
-    resolution: {integrity: sha512-2cKei4vlmg2cxEjm3wVSqn8pcoRF/LX/wpifuuNquFO4SQmPwarClT+SUCA2lt+l581tTeZIPIZuIDo2jWN1fg==}
+  /isomorphic-ws@5.0.0(ws@8.13.0):
+    resolution: {integrity: sha512-muId7Zzn9ywDsyXgTIafTry2sV3nySZeUDe6YedVd1Hvuuep5AsIlqK+XefWpYTyJG5e503F2xIuT2lcU6rCSw==}
    peerDependencies:
      ws: '*'
    dependencies:
@@ -11956,8 +11748,8 @@ packages:
    engines: {node: '>=10.5.0'}
    dev: true

-  /node-fetch-native@1.6.1:
-    resolution: {integrity: sha512-bW9T/uJDPAJB2YNYEpWzE54U5O3MQidXsOyTfnbKYtTtFexRvGzb1waphBN4ZwP6EcIvYYEOwW0b72BpAqydTw==}
+  /node-fetch-native@1.4.1:
+    resolution: {integrity: sha512-NsXBU0UgBxo2rQLOeWNZqS3fvflWePMECr8CoSWoSTqCqGbVVsvl9vZu1HfQicYN0g5piV9Gh8RTEvo/uP752w==}
    dev: false

  /node-fetch@2.6.12:
@@ -12103,7 +11895,7 @@ packages:
    resolution: {integrity: sha512-s1ZCMmQWXy4b5K/TW9i/DtiN8Ku+xCiHcjQ6/J/nDdssirrQNOoB165Zu8EqLMA2lln1JUth9a0aW9Ap2ctrUg==}
    dependencies:
      destr: 2.0.2
-      node-fetch-native: 1.6.1
+      node-fetch-native: 1.4.1
      ufo: 1.3.2
    dev: false

@@ -13991,14 +13783,10 @@ packages:
      consola: 3.2.3
      defu: 6.1.3
      mime: 3.0.0
-      node-fetch-native: 1.6.1
+      node-fetch-native: 1.4.1
      pathe: 1.1.1
    dev: false

-  /unfetch@4.2.0:
-    resolution: {integrity: sha512-F9p7yYCn6cIW9El1zi0HI6vqpeIvBsr3dSuRO6Xuppb1u5rXpCPmMvLSyECLhybr9isec8Ohl0hPekMVrEinDA==}
-    dev: false
-
  /unified@10.1.2:
    resolution: {integrity: sha512-pUSWAi/RAnVy1Pif2kAoeWNBa3JVrx0MId2LASj8G+7AiHWoKZNTomq6LG326T68U7/e263X6fTdcXIy7XnF7Q==}
    dependencies:
@@ -14118,7 +13906,7 @@ packages:
      listhen: 1.5.5
      lru-cache: 10.1.0
      mri: 1.2.0
-      node-fetch-native: 1.6.1
+      node-fetch-native: 1.4.1
      ofetch: 1.3.3
      ufo: 1.3.2
    transitivePeerDependencies:
@@ -14352,21 +14140,22 @@ packages:
      vfile-message: 3.1.4
    dev: true

-  /viem@1.20.0(typescript@5.1.3):
-    resolution: {integrity: sha512-yPjV9pJr10xi28C/9LEvs5zdZNEMiru3Kz7nufghVYABJAfeSkoZQXb6b23n7MscS7c55JO5nmUI3xKkd9g6Yg==}
+  /viem@1.12.2(typescript@5.1.3):
+    resolution: {integrity: sha512-aCaUCyg72ES+jK4s6tVYOMnOt4if71RwzgiUAUpAuaCgvHFfh9DCnwuEfwkxEZLE2vafOsirgJ3fcn7nsDVQoQ==}
    peerDependencies:
      typescript: '>=5.0.4'
    peerDependenciesMeta:
      typescript:
        optional: true
    dependencies:
-      '@adraffy/ens-normalize': 1.10.0
+      '@adraffy/ens-normalize': 1.9.4
      '@noble/curves': 1.2.0
      '@noble/hashes': 1.3.2
      '@scure/bip32': 1.3.2
      '@scure/bip39': 1.2.1
+      '@types/ws': 8.5.6
      abitype: 0.9.8(typescript@5.1.3)
-      isows: 1.0.3(ws@8.13.0)
+      isomorphic-ws: 5.0.0(ws@8.13.0)
      typescript: 5.1.3
      ws: 8.13.0
    transitivePeerDependencies:
@@ -14536,8 +14325,8 @@ packages:
      - supports-color
    dev: true

-  /wagmi@1.4.13(@types/react@18.2.14)(react-dom@18.2.0)(react@18.2.0)(typescript@5.1.3)(viem@1.20.0):
-    resolution: {integrity: sha512-AScVYFjqNt1wMgL99Bob7MLdhoTZ3XKiOZL5HVBdy4W1sh7QodA3gQ8IsmTuUrQ7oQaTxjiXEhwg7sWNrPBvJA==}
+  /wagmi@1.4.12(@types/react@18.2.14)(react-dom@18.2.0)(react@18.2.0)(typescript@5.1.3)(viem@1.12.2):
+    resolution: {integrity: sha512-QRxpjhdMlZmbYTfn9VQkQMKq+l3kwA1O7tF10vaykPrjbGX+IIlyn72ib9oqW9BfQO7n/Sf/mnVz1zbxRhGPWA==}
    peerDependencies:
      react: '>=17.0.0'
      typescript: '>=5.0.4'
@@ -14547,14 +14336,14 @@ packages:
        optional: true
    dependencies:
      '@tanstack/query-sync-storage-persister': 4.32.6
-      '@tanstack/react-query': 4.36.1(react-dom@18.2.0)(react@18.2.0)
-      '@tanstack/react-query-persist-client': 4.32.6(@tanstack/react-query@4.36.1)
-      '@wagmi/core': 1.4.13(@types/react@18.2.14)(react@18.2.0)(typescript@5.1.3)(viem@1.20.0)
+      '@tanstack/react-query': 4.32.6(react-dom@18.2.0)(react@18.2.0)
+      '@tanstack/react-query-persist-client': 4.32.6(@tanstack/react-query@4.32.6)
+      '@wagmi/core': 1.4.12(@types/react@18.2.14)(react@18.2.0)(typescript@5.1.3)(viem@1.12.2)
      abitype: 0.8.7(typescript@5.1.3)
      react: 18.2.0
      typescript: 5.1.3
      use-sync-external-store: 1.2.0(react@18.2.0)
-      viem: 1.20.0(typescript@5.1.3)
+      viem: 1.12.2(typescript@5.1.3)
    transitivePeerDependencies:
      - '@azure/app-configuration'
      - '@azure/cosmos'
@@ -14801,6 +14590,19 @@ packages:
        optional: true
    dev: false

+  /ws@8.15.0:
+    resolution: {integrity: sha512-H/Z3H55mrcrgjFwI+5jKavgXvwQLtfPCUEp6pi35VhoB0pfcHnSoyuTzkBEZpzq49g1193CUEwIvmsjcotenYw==}
+    engines: {node: '>=10.0.0'}
+    peerDependencies:
+      bufferutil: ^4.0.1
+      utf-8-validate: '>=5.0.2'
+    peerDependenciesMeta:
+      bufferutil:
+        optional: true
+      utf-8-validate:
+        optional: true
+    dev: false
+
  /ws@8.15.1(bufferutil@4.0.8)(utf-8-validate@5.0.10):
    resolution: {integrity: sha512-W5OZiCjXEmk0yZ66ZN82beM5Sz7l7coYxpRkzS+p9PP+ToQry8szKh+61eNktr7EA9DOwvFGhfC605jDHbP6QQ==}
    engines: {node: '>=10.0.0'}
@@ -4,9 +4,38 @@
        "tokenAddress": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
        "name": "Ethereum"
    },
+    {
+        "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"
    }
 ]
@@ -39,7 +39,7 @@
   "environments": {
      "dydxprotocol-dev": {
         "name": "v4 Dev",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydxprotocol-testnet",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -113,7 +113,7 @@
      },
      "dydxprotocol-dev-2": {
         "name": "v4 Dev 2",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydxprotocol-testnet",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -186,7 +186,7 @@
      },
      "dydxprotocol-dev-4": {
         "name": "v4 Dev 4",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydxprotocol-testnet",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -259,7 +259,7 @@
      },
      "dydxprotocol-dev-5": {
         "name": "v4 Dev 5",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydxprotocol-testnet",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -332,7 +332,7 @@
      },
      "dydxprotocol-staging": {
         "name": "v4 Staging",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydxprotocol-testnet",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -407,7 +407,7 @@
      },
      "dydxprotocol-staging-forced-update": {
         "name": "v4 Staging Forced Update",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydxprotocol-testnet",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -480,7 +480,7 @@
      },
      "dydxprotocol-staging-west": {
         "name": "v4 Staging West",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydxprotocol-testnet",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -555,7 +555,7 @@
      },
      "dydxprotocol-testnet": {
         "name": "v4 Public Testnet",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydx-testnet-4",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -579,8 +579,8 @@
         "endpoints": {
            "indexers": [
               {
-                  "api": "https://indexer.v4testnet.dydx.exchange",
-                  "socket": "wss://indexer.v4testnet.dydx.exchange"
+                  "api": "https://dydx-testnet.imperator.co",
+                  "socket": "wss://dydx-testnet.imperator.co"
               }
            ],
            "validators": [
@@ -634,7 +634,7 @@
      },
      "dydxprotocol-testnet-dydx": {
         "name": "v4 Public Testnet/dYdX",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydx-testnet-4",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -710,7 +710,7 @@
      },
      "dydxprotocol-testnet-nodefleet": {
         "name": "v4 Public Testnet/nodefleet",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydx-testnet-4",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -734,8 +734,8 @@
         "endpoints": {
            "indexers": [
               {
-                  "api": "https://indexer.v4testnet.dydx.exchange",
-                  "socket": "wss://indexer.v4testnet.dydx.exchange"
+                  "api": "https://dydx-testnet.imperator.co",
+                  "socket": "wss://dydx-testnet.imperator.co"
               }
            ],
            "validators": [
@@ -786,7 +786,7 @@
      },
      "dydxprotocol-testnet-kingnodes": {
         "name": "v4 Public Testnet/KingNodes",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydx-testnet-4",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -810,8 +810,8 @@
         "endpoints": {
            "indexers": [
               {
-                  "api": "https://indexer.v4testnet.dydx.exchange",
-                  "socket": "wss://indexer.v4testnet.dydx.exchange"
+                  "api": "https://dydx-testnet.imperator.co",
+                  "socket": "wss://dydx-testnet.imperator.co"
               }
            ],
            "validators": [
@@ -862,7 +862,7 @@
      },
      "dydxprotocol-testnet-liquify": {
         "name": "v4 Public Testnet/Liquify",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydx-testnet-4",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -886,8 +886,8 @@
         "endpoints": {
            "indexers": [
               {
-                  "api": "https://indexer.v4testnet.dydx.exchange",
-                  "socket": "wss://indexer.v4testnet.dydx.exchange"
+                  "api": "https://dydx-testnet.imperator.co",
+                  "socket": "wss://dydx-testnet.imperator.co"
               }
            ],
            "validators": [
@@ -938,7 +938,7 @@
      },
      "dydxprotocol-testnet-polkachu": {
         "name": "v4 Public Testnet/Polkahcu",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydx-testnet-4",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -962,8 +962,8 @@
         "endpoints": {
            "indexers": [
               {
-                  "api": "https://indexer.v4testnet.dydx.exchange",
-                  "socket": "wss://indexer.v4testnet.dydx.exchange"
+                  "api": "https://dydx-testnet.imperator.co",
+                  "socket": "wss://dydx-testnet.imperator.co"
               }
            ],
            "validators": [
@@ -1005,7 +1005,7 @@
      },
      "dydxprotocol-testnet-bware": {
         "name": "v4 Public Testnet/BWare",
-         "ethereumChainId": "11155111",
+         "ethereumChainId": "5",
         "dydxChainId": "dydx-testnet-4",
         "chainName": "dYdX Chain",
         "chainLogo": "/dydx-chain.png",
@@ -1029,8 +1029,8 @@
         "endpoints": {
            "indexers": [
               {
-                  "api": "https://indexer.v4testnet.dydx.exchange",
-                  "socket": "wss://indexer.v4testnet.dydx.exchange"
+                  "api": "https://dydx-testnet.imperator.co",
+                  "socket": "wss://dydx-testnet.imperator.co"
               }
            ],
            "validators": [
@@ -1,230 +0,0 @@
-<svg width="254" height="77" viewBox="0 0 254 77" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="Group 1258">
-<g id="Ellipse 9" opacity="0.4" filter="url(#filter0_f_20300_14972)">
-<ellipse cx="86.5425" cy="-3.91219" rx="116.542" ry="20.0878" fill="#7774FF"/>
-</g>
-<g id="Ellipse 10" opacity="0.3" filter="url(#filter1_f_20300_14972)">
-<circle cx="74.5734" cy="4.63007" r="1.00507" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 12" opacity="0.3" filter="url(#filter2_f_20300_14972)">
-<circle cx="82.1105" cy="7.64179" r="1.00507" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 22" opacity="0.3" filter="url(#filter3_f_20300_14972)">
-<circle cx="116.785" cy="4.63007" r="1.00507" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 11" opacity="0.3" filter="url(#filter4_f_20300_14972)">
-<circle cx="64.774" cy="8.90488" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 18" opacity="0.3" filter="url(#filter5_f_20300_14972)">
-<circle cx="96.4322" cy="3.87363" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 20" opacity="0.3" filter="url(#filter6_f_20300_14972)">
-<circle cx="76.0807" cy="14.9361" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 21" opacity="0.3" filter="url(#filter7_f_20300_14972)">
-<circle cx="104.725" cy="4.87754" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 23" opacity="0.3" filter="url(#filter8_f_20300_14972)">
-<circle cx="114.021" cy="7.13925" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 24" opacity="0.3" filter="url(#filter9_f_20300_14972)">
-<circle cx="109.75" cy="15.4361" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 25" opacity="0.3" filter="url(#filter10_f_20300_14972)">
-<circle cx="119.801" cy="12.6705" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 27" opacity="0.3" filter="url(#filter11_f_20300_14972)">
-<circle cx="94.0885" cy="11.0182" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 30" opacity="0.3" filter="url(#filter12_f_20300_14972)">
-<circle cx="154.475" cy="11.6666" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 29" opacity="0.3" filter="url(#filter13_f_20300_14972)">
-<circle cx="146.435" cy="8.90488" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 15" opacity="0.3" filter="url(#filter14_f_20300_14972)">
-<circle cx="24.0103" cy="4.44785" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 33" opacity="0.3" filter="url(#filter15_f_20300_14972)">
-<circle cx="-1.05899" cy="13.6783" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 16" opacity="0.3" filter="url(#filter16_f_20300_14972)">
-<circle cx="17.441" cy="16.4908" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 35" opacity="0.3" filter="url(#filter17_f_20300_14972)">
-<circle cx="36.0553" cy="6.63535" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 32" opacity="0.3" filter="url(#filter18_f_20300_14972)">
-<circle cx="10.8707" cy="14.2994" r="0.502536" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 13" opacity="0.3" filter="url(#filter19_f_20300_14972)">
-<circle cx="55.7274" cy="9.65615" r="0.753803" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 19" opacity="0.3" filter="url(#filter20_f_20300_14972)">
-<circle cx="87.3886" cy="20.7108" r="0.753803" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 26" opacity="0.3" filter="url(#filter21_f_20300_14972)">
-<circle cx="123.82" cy="15.1874" r="0.753803" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 36" opacity="0.3" filter="url(#filter22_f_20300_14972)">
-<circle cx="134.876" cy="14.4335" r="0.753803" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 28" opacity="0.3" filter="url(#filter23_f_20300_14972)">
-<circle cx="129.6" cy="6.38662" r="0.753803" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 14" opacity="0.3" filter="url(#filter24_f_20300_14972)">
-<circle cx="41.6571" cy="14.9335" r="0.753803" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 31" opacity="0.3" filter="url(#filter25_f_20300_14972)">
-<circle cx="4.21767" cy="17.9491" r="0.753803" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 34" opacity="0.3" filter="url(#filter26_f_20300_14972)">
-<circle cx="12.2177" cy="6.88662" r="0.753803" fill="#9A9AFF"/>
-</g>
-<g id="Ellipse 17" opacity="0.3" filter="url(#filter27_f_20300_14972)">
-<circle cx="50.2001" cy="3.6249" r="0.753803" fill="#9A9AFF"/>
-</g>
-</g>
-<defs>
-<filter id="filter0_f_20300_14972" x="-94" y="-88" width="361.085" height="168.176" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="32" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter1_f_20300_14972" x="72.5633" y="2.61993" width="4.01991" height="4.02186" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter2_f_20300_14972" x="80.6029" y="6.13418" width="3.01484" height="3.01679" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.251268" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter3_f_20300_14972" x="115.278" y="3.12246" width="3.01484" height="3.01679" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.251268" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter4_f_20300_14972" x="63.2664" y="7.39727" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter5_f_20300_14972" x="94.9246" y="2.36602" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter6_f_20300_14972" x="74.5731" y="13.4285" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter7_f_20300_14972" x="103.218" y="3.36993" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter8_f_20300_14972" x="112.513" y="5.63165" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter9_f_20300_14972" x="108.242" y="13.9285" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter10_f_20300_14972" x="118.294" y="11.1629" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter11_f_20300_14972" x="92.5809" y="9.51055" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter12_f_20300_14972" x="153.47" y="10.6615" width="2.00995" height="2.00898" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.251268" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter13_f_20300_14972" x="144.928" y="7.39727" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter14_f_20300_14972" x="22.5027" y="2.94024" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter15_f_20300_14972" x="-2.56659" y="12.1707" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter16_f_20300_14972" x="15.9334" y="14.9832" width="3.01502" height="3.01405" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter17_f_20300_14972" x="35.0502" y="5.63028" width="2.00995" height="2.00898" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.251268" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter18_f_20300_14972" x="9.86563" y="13.2943" width="2.00995" height="2.00898" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.251268" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter19_f_20300_14972" x="53.9686" y="7.89727" width="3.51795" height="3.51795" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter20_f_20300_14972" x="85.6297" y="18.952" width="3.51795" height="3.51795" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter21_f_20300_14972" x="122.061" y="13.4285" width="3.51795" height="3.51795" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter22_f_20300_14972" x="133.117" y="12.6746" width="3.51795" height="3.51795" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter23_f_20300_14972" x="127.842" y="4.62774" width="3.51795" height="3.51795" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter24_f_20300_14972" x="39.8982" y="13.1746" width="3.51795" height="3.51795" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter25_f_20300_14972" x="2.4588" y="16.1902" width="3.51795" height="3.51795" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter26_f_20300_14972" x="10.4588" y="5.12774" width="3.51795" height="3.51795" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-<filter id="filter27_f_20300_14972" x="48.4412" y="1.86602" width="3.51795" height="3.51795" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="0.502536" result="effect1_foregroundBlur_20300_14972"/>
-</filter>
-</defs>
-</svg>
@@ -1,26 +0,0 @@
-import type { Story } from '@ladle/react';
-
-import { Accordion as AccordionComponent, AccordionProps } from '@/components/Accordion';
-
-import { StoryWrapper } from '.ladle/components';
-
-export const Accordion: Story<AccordionProps> = (args) => {
-  return (
-    <StoryWrapper>
-      <AccordionComponent {...args} />
-    </StoryWrapper>
-  );
-};
-
-Accordion.args = {
-  items: [
-    {
-      header: 'Question 1?',
-      content: 'Answer 1.',
-    },
-    {
-      header: 'Question 2?',
-      content: 'Answer 2.',
-    },
-  ],
-};
@@ -1,129 +0,0 @@
-import styled, { keyframes, type AnyStyledComponent } from 'styled-components';
-
-import { Root, Item, Header, Trigger, Content } from '@radix-ui/react-accordion';
-
-import { layoutMixins } from '@/styles/layoutMixins';
-import { breakpoints } from '@/styles';
-
-import { PlusIcon } from '@/icons';
-
-export type AccordionItem = {
-  header: React.ReactNode;
-  content: React.ReactNode;
-};
-
-export type AccordionProps = {
-  items: AccordionItem[];
-  className?: string;
-};
-
-export const Accordion = ({ items, className }: AccordionProps) => (
-  <Styled.Root className={className} type="single" collapsible>
-    {items.map(({ header, content }, idx) => (
-      <Styled.Item key={idx} value={idx.toString()}>
-        <Header>
-          <Styled.Trigger>
-            {header}
-            <Styled.Icon>
-              <PlusIcon />
-            </Styled.Icon>
-          </Styled.Trigger>
-        </Header>
-        <Styled.Content>{content}</Styled.Content>
-      </Styled.Item>
-    ))}
-  </Styled.Root>
-);
-
-const Styled: Record<string, AnyStyledComponent> = {};
-
-Styled.Root = styled(Root)`
-  --accordion-paddingY: 1rem;
-  --accordion-paddingX: 1rem;
-
-  @media ${breakpoints.notTablet} {
-    --accordion-paddingX: 1.5rem;
-  }
-
-  > *:not(:last-child) {
-    border-bottom: var(--border-width) solid var(--border-color);
-  }
-`;
-
-Styled.Item = styled(Item)``;
-
-Styled.Icon = styled.div`
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-
-  width: 2.25rem;
-  height: 2.25rem;
-
-  --color-border: var(--color-layer-6);
-  color: var(--color-text-1);
-  background-color: var(--color-layer-5);
-  border: solid var(--border-width) var(--color-border);
-  border-radius: 50%;
-  font: var(--font-small-book);
-
-  svg {
-    height: 1.125em;
-    width: 1.125em;
-  }
-`;
-
-Styled.Trigger = styled(Trigger)`
-  ${layoutMixins.spacedRow}
-  width: 100%;
-  padding: var(--accordion-paddingY) var(--accordion-paddingX);
-  gap: 0.5rem;
-
-  color: var(--color-text-1);
-  text-align: start;
-
-  &:hover {
-    ${Styled.Icon} {
-      color: var(--color-text-2);
-      filter: brightness(1.1);
-    }
-  }
-
-  svg {
-    color: var(--color-text-0);
-    transition: transform 0.3s var(--ease-out-expo);
-  }
-
-  &[data-state='open'] svg {
-    transform: rotate(45deg);
-  }
-`;
-
-Styled.Content = styled(Content)`
-  overflow: hidden;
-  margin: 0 var(--accordion-paddingX) var(--accordion-paddingY);
-
-  color: var(--color-text-0);
-
-  &[data-state='open'] {
-    animation: ${keyframes`
-      from {
-        height: 0;
-      }
-      to {
-        height: var(--radix-accordion-content-height);
-      }
-    `} 0.3s var(--ease-out-expo);
-  }
-
-  &[data-state='closed'] {
-    animation: ${keyframes`
-      from {
-        height: var(--radix-accordion-content-height);
-      }
-      to {
-        height: 0;
-      }
-    `} 0.1s var(--ease-in-expo);
-  }
-`;
@@ -24,6 +24,7 @@ import {
  CoinsIcon,
  CommentIcon,
  CopyIcon,
+  CubeIcon,
  DepositIcon,
  DepthChartIcon,
  DiscordIcon,
@@ -54,12 +55,10 @@ import {
  OverviewIcon,
  PencilIcon,
  PlayIcon,
-  PlusIcon,
  PositionsIcon,
  PriceChartIcon,
  PrivacyIcon,
  QrIcon,
-  RewardStarIcon,
  SearchIcon,
  SendIcon,
  ShareIcon,
@@ -99,6 +98,7 @@ export enum IconName {
  Coins = 'Coins',
  Comment = 'Comment',
  Copy = 'Copy',
+  Cube = 'Cube',
  Deposit = 'Deposit',
  DepthChart = 'DepthChart',
  Discord = 'Discord',
@@ -130,12 +130,10 @@ export enum IconName {
  Overview = 'Overview',
  Pencil = 'Pencil',
  Play = 'Play',
-  Plus = 'Plus',
  Positions = 'Positions',
  PriceChart = 'PriceChart',
  Privacy = 'Privacy',
  Qr = 'Qr',
-  RewardStar = 'RewardStar',
  Search = 'Search',
  Send = 'Send',
  Share = 'Share',
@@ -175,6 +173,7 @@ const icons = {
  [IconName.Coins]: CoinsIcon,
  [IconName.Comment]: CommentIcon,
  [IconName.Copy]: CopyIcon,
+  [IconName.Cube]: CubeIcon,
  [IconName.Deposit]: DepositIcon,
  [IconName.DepthChart]: DepthChartIcon,
  [IconName.Discord]: DiscordIcon,
@@ -205,12 +204,10 @@ const icons = {
  [IconName.Overview]: OverviewIcon,
  [IconName.Pencil]: PencilIcon,
  [IconName.Play]: PlayIcon,
-  [IconName.Plus]: PlusIcon,
  [IconName.Positions]: PositionsIcon,
  [IconName.PriceChart]: PriceChartIcon,
  [IconName.Privacy]: PrivacyIcon,
  [IconName.Qr]: QrIcon,
-  [IconName.RewardStar]: RewardStarIcon,
  [IconName.Search]: SearchIcon,
  [IconName.Send]: SendIcon,
  [IconName.Share]: ShareIcon,
@@ -4,7 +4,6 @@ import { Link } from 'react-router-dom';
 import { Icon, IconName } from '@/components/Icon';

 import { layoutMixins } from '@/styles/layoutMixins';
-import { breakpoints } from '@/styles';

 type PanelProps = {
  slotHeaderContent?: string;
@@ -68,12 +67,6 @@ Styled.Panel = styled.section<{ onClick?: () => void }>`
  --panel-content-paddingY: var(--panel-paddingY);
  --panel-content-paddingX: var(--panel-paddingX);

-  @media ${breakpoints.notTablet} {
-    --panel-paddingX: 1.5rem;
-    --panel-paddingY: 1.25rem;
-    --panel-content-paddingY: 1rem;
-  }
-
  ${layoutMixins.row}

  background-color: var(--color-layer-3);
@@ -27,8 +27,9 @@ export const ToastArea = ({ swipeDirection, children, className }: ToastAreaProp
 const $ToastArea = styled.aside`
  // Params
  --toasts-gap: 0.5rem;
-  
+
  // Rules
+  ${layoutMixins.scrollArea}
  z-index: 1;

  pointer-events: none;
@@ -1,33 +1,26 @@
-import React, { PropsWithChildren, useContext, useState } from 'react';
+import React, { useContext, useState } from 'react';

 import { Point } from '@visx/point';
 import { localPoint } from '@visx/event';
-import { XYChart, DataContext, type EventHandlerParams } from '@visx/xychart';
+import { XYChart, DataContext } from '@visx/xychart';
 import { getScaleBandwidth } from '@/components/visx/getScaleBandwidth';

 export const XYChartWithPointerEvents = ({
-  onPointerMove,
-  onPointerUp,
-  onPointerPressedChange,
-  ...props
+  onPointerMove, onPointerUp, onPointerPressedChange, ...props
 }: {
-  onPointerMove?: (point: Point | EventHandlerParams<object>) => void;
-  onPointerUp?: (point: Point | EventHandlerParams<object>) => void;
+  onPointerMove?: (point: Point) => void;
+  onPointerUp?: (point: Point) => void;
  onPointerPressedChange?: (isPointerPressed: boolean) => void;
-} & PropsWithChildren<Parameters<typeof XYChart>[0]>) => {
+} & React.PropsWithChildren<Parameters<typeof XYChart>>) => {
  const { xScale, yScale } = useContext(DataContext);
+
  const [lastPointerMoveEvent, setLastPointerMoveEvent] = useState<React.PointerEvent>();

  const pointerContainerPosition = lastPointerMoveEvent ? localPoint(lastPointerMoveEvent) : null;

-  const pointerChartPosition =
-    xScale &&
-    yScale &&
-    pointerContainerPosition &&
+  const pointerChartPosition = xScale && yScale && pointerContainerPosition &&
    new Point({
-      // @ts-expect-error invert supposedly doesn't exist on AxisScale
      x: xScale.invert(pointerContainerPosition?.x - getScaleBandwidth(xScale) / 2),
-      // @ts-expect-error invert supposedly doesn't exist on AxisScale
      y: yScale.invert(pointerContainerPosition?.y - getScaleBandwidth(yScale) / 2),
    });

@@ -36,13 +29,15 @@ export const XYChartWithPointerEvents = ({
      {...props}
      onPointerMove={({ event }) => {
        setLastPointerMoveEvent(event as React.PointerEvent);
-        if (pointerChartPosition) onPointerMove?.(pointerChartPosition);
+        if (pointerChartPosition)
+          onPointerMove?.(pointerChartPosition);
      }}
      onPointerOut={() => setLastPointerMoveEvent(undefined)}
      onPointerDown={() => onPointerPressedChange?.(true)}
      onPointerUp={() => {
        onPointerPressedChange?.(false);
-        if (pointerChartPosition) onPointerUp?.(pointerChartPosition);
+        if (pointerChartPosition)
+          onPointerUp?.(pointerChartPosition);
      }}
    >
      {props.children}
@@ -142,7 +142,7 @@ const historicalPnlPeriod = [...HistoricalPnlPeriod.values()] as const;
 export type HistoricalPnlPeriods = (typeof historicalPnlPeriod)[number];

 // ------ Transfer Items ------ //
-export const TransferInputField = Abacus.exchange.dydx.abacus.state.model.TransferInputField;
+export const TransferInputField = Abacus.exchange.dydx.abacus.state.modal.TransferInputField;
 const transferInputFields = [...TransferInputField.values()] as const;
 export type TransferInputFields = (typeof transferInputFields)[number];

@@ -151,7 +151,7 @@ const transferTypes = [...TransferType.values()] as const;
 export type TransferTypes = (typeof transferTypes)[number];

 // ------ Trade Items ------ //
-export const TradeInputField = Abacus.exchange.dydx.abacus.state.model.TradeInputField;
+export const TradeInputField = Abacus.exchange.dydx.abacus.state.modal.TradeInputField;
 const tradeInputFields = [...TradeInputField.values()] as const;
 export type TradeInputFields = (typeof tradeInputFields)[number];

@@ -162,7 +162,7 @@ export type TradeState<T> = {
 };

 export const ClosePositionInputField =
-  Abacus.exchange.dydx.abacus.state.model.ClosePositionInputField;
+  Abacus.exchange.dydx.abacus.state.modal.ClosePositionInputField;

 const closePositionInputFields = [...ClosePositionInputField.values()] as const;
 export type ClosePositionInputFields = (typeof closePositionInputFields)[number];
@@ -96,7 +96,6 @@ export type AnalyticsEventData<T extends AnalyticsEvent> =
        elapsedTime?: number;
        blockHeight?: number;
        indexerBlockHeight?: number;
-        trailingBlocks?: number;
      }
    : // Navigation
    T extends AnalyticsEvent.NavigatePage
@@ -1,40 +0,0 @@
-import { OrderSide } from '@dydxprotocol/v4-client-js';
-import { FundingDirection } from './markets';
-
-// ------ Depth Chart ------ //
-export enum DepthChartSeries {
-  Asks = 'Asks',
-  Bids = 'Bids',
-  MidMarket = 'MidMarket',
-}
-
-export type DepthChartDatum = {
-  size: number;
-  price: number;
-  depth: number;
-  seriesKey: DepthChartSeries;
-};
-
-export type DepthChartPoint = {
-  side: OrderSide;
-  price: number;
-  size: number;
-};
-
-export const SERIES_KEY_FOR_ORDER_SIDE = {
-  [OrderSide.BUY]: DepthChartSeries.Bids,
-  [OrderSide.SELL]: DepthChartSeries.Asks,
-};
-
-// ------ Funding Chart ------ //
-export enum FundingRateResolution {
-  OneHour = 'OneHour',
-  EightHour = 'EightHour',
-  Annualized = 'Annualized',
-}
-
-export type FundingChartDatum = {
-  time: number;
-  fundingRate: number;
-  direction: FundingDirection;
-};
@@ -25,5 +25,4 @@ export const DEFAULT_MARKETID = 'ETH-USD';
 export enum FundingDirection {
  ToShort = 'ToShort',
  ToLong = 'ToLong',
-  None = 'None',
 }
@@ -87,8 +87,6 @@ export type NotificationDisplayData = {
  slotTitleLeft?: React.ReactNode;
  slotTitleRight?: React.ReactNode;

-  groupKey: string; // Grouping key toast notification stacking
-
  // Overrides title/body for Notification in NotificationMenu
  renderCustomBody?: ({
    isToast,
@@ -1,10 +1,6 @@
 import { type TooltipStrings, TOOLTIP_STRING_KEYS } from '@/constants/localization';

 export const depositTooltips: TooltipStrings = {
-  'minimum-deposit-amount': ({ stringGetter }) => ({
-    title: stringGetter({ key: TOOLTIP_STRING_KEYS.MINIMUM_DEPOSIT_AMOUNT_TITLE }),
-    body: stringGetter({ key: TOOLTIP_STRING_KEYS.MINIMUM_DEPOSIT_AMOUNT_BODY }),
-  }),
  swap: ({ stringGetter }) => ({
    title: stringGetter({ key: TOOLTIP_STRING_KEYS.SWAP_TITLE }),
    body: stringGetter({ key: TOOLTIP_STRING_KEYS.SWAP_BODY }),
@@ -5,10 +5,6 @@ export const withdrawTooltips: TooltipStrings = {
    title: stringGetter({ key: TOOLTIP_STRING_KEYS.FAST_WITHDRAW_FEE_TITLE }),
    body: stringGetter({ key: TOOLTIP_STRING_KEYS.FAST_WITHDRAW_FEE_BODY }),
  }),
-  'minimum-amount-received': ({ stringGetter }) => ({
-    title: stringGetter({ key: TOOLTIP_STRING_KEYS.MINIMUM_AMOUNT_RECEIVED_TITLE }),
-    body: stringGetter({ key: TOOLTIP_STRING_KEYS.MINIMUM_AMOUNT_RECEIVED_BODY }),
-  }),
  'withdraw-types': ({ stringGetter }) => ({
    title: stringGetter({ key: TOOLTIP_STRING_KEYS.WITHDRAW_TYPES_TITLE }),
    body: stringGetter({ key: TOOLTIP_STRING_KEYS.WITHDRAW_TYPES_BODY }),
@@ -97,7 +97,7 @@ export const useAnalytics = () => {
  }, []);

  // AnalyticsEvent.NetworkStatus
-  const { height, indexerHeight, status, trailingBlocks} = useApiState();
+  const { height, indexerHeight, status } = useApiState();

  useEffect(() => {
    if (status) {
@@ -114,7 +114,6 @@ export const useAnalytics = () => {
        elapsedTime: lastSuccessfulIndexerRpcQuery && Date.now() - lastSuccessfulIndexerRpcQuery,
        blockHeight: height ?? undefined,
        indexerBlockHeight: indexerHeight ?? undefined,
-        trailingBlocks: trailingBlocks ?? undefined
      });
    }
  }, [status]);
@@ -71,7 +71,7 @@ export const getIndexerHeight = (apiState: Nullable<AbacusApiState>) => {
 export const useApiState = () => {
  const stringGetter = useStringGetter();
  const apiState = useSelector(getApiState, shallowEqual);
-  const { haltedBlock, height, status, trailingBlocks} = apiState ?? {};
+  const { haltedBlock, height, status, trailingBlocks } = apiState ?? {};
  const statusErrorMessage = getStatusErrorMessage({ apiState, stringGetter });
  const indexerHeight = getIndexerHeight(apiState);

@@ -28,7 +28,6 @@ import { useLocalNotifications } from '@/hooks/useLocalNotifications';

 import { AssetIcon } from '@/components/AssetIcon';
 import { Icon, IconName } from '@/components/Icon';
-import { BlockRewardNotification } from '@/views/notifications/BlockRewardNotification';
 import { TradeNotification } from '@/views/notifications/TradeNotification';
 import { TransferStatusNotification } from '@/views/notifications/TransferStatusNotification';

@@ -81,7 +80,6 @@ export const notificationTypes: NotificationTypeConfig[] = [
                  body: abacusNotif.text ? stringGetter({ key: abacusNotif.text, params }) : '',
                  toastDuration: DEFAULT_TOAST_AUTO_CLOSE_MS,
                  toastSensitivity: 'foreground',
-                  groupKey: abacusNotificationType,
                  renderCustomBody: ({ isToast, notification }) => (
                    <TradeNotification
                      isToast={isToast}
@@ -95,29 +93,6 @@ export const notificationTypes: NotificationTypeConfig[] = [
              );
              break;
            }
-            case 'blockReward': {
-              trigger(
-                abacusNotif.id,
-                {
-                  icon: abacusNotif.image && <$Icon src={abacusNotif.image} alt="" />,
-                  title: stringGetter({ key: abacusNotif.title }),
-                  body: abacusNotif.text ? stringGetter({ key: abacusNotif.text, params }) : '',
-                  toastDuration: DEFAULT_TOAST_AUTO_CLOSE_MS,
-                  toastSensitivity: 'foreground',
-                  groupKey: abacusNotificationType,
-                  renderCustomBody: ({ isToast, notification }) => (
-                    <BlockRewardNotification
-                      isToast={isToast}
-                      data={parsedData}
-                      notification={notification}
-                    />
-                  ),
-                },
-                [abacusNotif.updateTimeInMilliseconds, abacusNotif.data],
-                true
-              );
-              break;
-            }
            default:
              trigger(
                abacusNotif.id,
@@ -127,7 +102,6 @@ export const notificationTypes: NotificationTypeConfig[] = [
                  body: abacusNotif.text ? stringGetter({ key: abacusNotif.text, params }) : '',
                  toastDuration: DEFAULT_TOAST_AUTO_CLOSE_MS,
                  toastSensitivity: 'foreground',
-                  groupKey: abacusNotificationType,
                },
                [abacusNotif.updateTimeInMilliseconds, abacusNotif.data]
              );
@@ -183,8 +157,8 @@ export const notificationTypes: NotificationTypeConfig[] = [
          const isFinished = Boolean(status) && status?.squidTransactionStatus !== 'ongoing';
          const icon = <Icon iconName={isFinished ? IconName.Transfer : IconName.Clock} />;

-          const transferType =
-            type ?? fromChainId === ENVIRONMENT_CONFIG_MAP[selectedNetwork].dydxChainId
+          const transferType = type ??
+            fromChainId === ENVIRONMENT_CONFIG_MAP[selectedNetwork].dydxChainId
              ? TransferNotificationTypes.Withdrawal
              : TransferNotificationTypes.Deposit;

@@ -223,7 +197,6 @@ export const notificationTypes: NotificationTypeConfig[] = [
                />
              ),
              toastSensitivity: 'foreground',
-              groupKey: NotificationType.SquidTransfer,
            },
            [isFinished]
          );
@@ -269,7 +242,6 @@ export const notificationTypes: NotificationTypeConfig[] = [
              },
            }),
            toastSensitivity: 'foreground',
-            groupKey: NotificationType.ReleaseUpdates,
          },
          []
        );
@@ -1,44 +0,0 @@
-import { useMemo } from 'react';
-import { shallowEqual, useSelector } from 'react-redux';
-
-import { DepthChartSeries, DepthChartDatum } from '@/constants/charts';
-
-import { getCurrentMarketOrderbook } from '@/state/perpetualsSelectors';
-
-import { MustBigNumber } from '@/lib/numbers';
-
-export const useOrderbookValuesForDepthChart = () => {
-  const orderbook = useSelector(getCurrentMarketOrderbook, shallowEqual);
-
-  return useMemo(() => {
-    const bids = (orderbook?.bids?.toArray() ?? [])
-      .filter(Boolean)
-      .map((datum) => ({ ...datum, seriesKey: DepthChartSeries.Bids } as DepthChartDatum));
-
-    const asks = (orderbook?.asks?.toArray() ?? [])
-      .filter(Boolean)
-      .map((datum) => ({ ...datum, seriesKey: DepthChartSeries.Asks } as DepthChartDatum));
-
-    const lowestBid = bids[bids.length - 1];
-    const highestBid = bids[0];
-    const lowestAsk = asks[0];
-    const highestAsk = asks[asks.length - 1];
-
-    const midMarketPrice = orderbook?.midPrice;
-    const spread = MustBigNumber(lowestAsk?.price ?? 0).minus(highestBid?.price ?? 0);
-    const spreadPercent = orderbook?.spreadPercent;
-
-    return {
-      bids,
-      asks,
-      lowestBid,
-      highestBid,
-      lowestAsk,
-      highestAsk,
-      midMarketPrice,
-      spread,
-      spreadPercent,
-      orderbook,
-    };
-  }, [orderbook]);
-};
@@ -198,13 +198,7 @@ export const useSubaccountContext = ({ localDydxWallet }: { localDydxWallet?: Lo
          );
          const ibcMsg: EncodeObject = {
            typeUrl: transaction.msgTypeUrl,
-            value: {
-              ...transaction.msg,
-              timeoutTimestamp: transaction.msg.timeoutTimestamp
-                // Squid returns timeoutTimestamp as Long, but the signer expects BigInt
-                ? BigInt(Long.fromValue(transaction.msg.timeoutTimestamp).toString())
-                : undefined,
-            },
+            value: transaction.msg,
          };

          return await compositeClient.send(
@@ -1 +1,3 @@
-<svg fill="none" height="10" viewBox="0 0 15 10" width="15" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="m.321829 1.09389c.200562-.192959.469529-.298401.747791-.29315.27827.00525.54307.120763.73621.32115l5.194 5.5132 5.19397-5.5132c.0944-.10408.2088-.188152.3363-.247234.1275-.059081.2655-.091968.406-.096713.1404-.004746.2804.018748.4116.069088s.2509.126504.3522.223979c.1012.09747.1818.21427.2371.34347.0552.12921.084.26819.0845.40871.0006.14052-.0271.27972-.0813.40936s-.1339.24707-.2344.34534l-5.94997 6.3c-.09795.10163-.21538.18245-.34527.23766-.1299.05521-.26959.08367-.41073.08367s-.28083-.02846-.41073-.08367c-.12989-.05521-.24732-.13603-.34527-.23766l-5.950001-6.3c-.192962-.20056-.29840394-.46953-.29315364-.74779.00525031-.27827.12076264-.54307.32115364-.73621z" fill="currentColor" fill-rule="evenodd"/></svg>
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M14 6L7.83335 10.5L2 6" stroke="currentColor" stroke-width="2.25" stroke-linecap="round"/>
+</svg>
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.95513 1.00169C7.89506 1.00645 7.83628 1.02054 7.78124 1.04337L1.31971 3.71042C1.2243 3.74983 1.14329 3.81414 1.08653 3.89553C1.02977 3.97691 0.999705 4.07186 1 4.16883V11.8366C1.00078 11.9327 1.03135 12.0265 1.08805 12.1069C1.14474 12.1873 1.22517 12.2508 1.31971 12.2898L7.78124 14.9568C7.85011 14.9853 7.92463 15 8 15C8.07536 15 8.14989 14.9853 8.21876 14.9568L14.6803 12.2898C14.7748 12.2508 14.8552 12.1873 14.9119 12.1069C14.9686 12.0265 14.9992 11.9327 15 11.8366V4.16883C15.0003 4.07186 14.9702 3.97691 14.9134 3.89553C14.8567 3.81414 14.7756 3.74983 14.6803 3.71042L8.21876 1.04337C8.13605 1.00911 8.04538 0.994778 7.95513 1.00169ZM8 2.04351L13.1378 4.16883L8 6.28894L2.86219 4.16883L8 2.04351ZM2.07693 4.93457L7.46153 7.15886V13.7328L2.07693 11.5084V4.93457ZM13.923 4.93457V11.5084L8.53846 13.7328V7.15886L13.923 4.93457Z" fill="currentColor"/>
+</svg>
@@ -19,6 +19,7 @@ export { default as CoinMarketCapIcon } from './logos/coinmarketcap.svg';
 export { default as CoinsIcon } from './coins.svg';
 export { default as CommentIcon } from './comment.svg';
 export { default as CopyIcon } from './copy.svg';
+export { default as CubeIcon } from './cube.svg';
 export { default as DepositIcon } from './deposit.svg';
 export { default as DepthChartIcon } from './depth-chart.svg';
 export { default as DiscordIcon } from './discord.svg';
@@ -43,14 +44,12 @@ export { default as OrderbookIcon } from './orderbook.svg';
 export { default as OverviewIcon } from './overview.svg';
 export { default as PencilIcon } from './pencil.svg';
 export { default as PlayIcon } from './play.svg';
-export { default as PlusIcon } from './plus.svg';
 export { default as PortfolioIcon } from './portfolio.svg';
 export { default as PositionsIcon } from './positions.svg';
 export { default as PriceChartIcon } from './price-chart.svg';
 export { default as PrivacyIcon } from './privacy.svg';
 export { default as ProfileIcon } from './profile.svg';
 export { default as QrIcon } from './qr.svg';
-export { default as RewardStarIcon } from './reward-star.svg';
 export { default as SearchIcon } from './search.svg';
 export { default as SendIcon } from './send.svg';
 export { default as ShareIcon } from './share.svg';
@@ -1 +0,0 @@
-<svg fill="none" height="12" viewBox="0 0 12 12" width="12" xmlns="http://www.w3.org/2000/svg"><path d="m6.75.75c0-.198912-.07902-.389678-.21967-.53033-.14065-.1406525-.33142-.21967-.53033-.21967s-.38968.0790175-.53033.21967c-.14065.140652-.21967.331418-.21967.53033v4.5h-4.5c-.198912 0-.389678.07902-.53033.21967-.1406525.14065-.21967.33142-.21967.53033s.0790175.38968.21967.53033c.140652.14065.331418.21967.53033.21967h4.5v4.5c0 .1989.07902.3897.21967.5303.14065.1407.33142.2197.53033.2197s.38968-.079.53033-.2197c.14065-.1406.21967-.3314.21967-.5303v-4.5h4.5c.1989 0 .3897-.07902.5303-.21967.1407-.14065.2197-.33142.2197-.53033s-.079-.38968-.2197-.53033c-.1406-.14065-.3314-.21967-.5303-.21967h-4.5z" fill="currentColor"/></svg>
@@ -1,11 +1,7 @@
-import { useState } from 'react';
+import { useMemo, useState } from 'react';
 import styled, { css } from 'styled-components';

-import {
-  type Notification,
-  type NotificationDisplayData,
-  NotificationStatus,
-} from '@/constants/notifications';
+import { NotificationStatus } from '@/constants/notifications';
 import { ButtonShape, ButtonSize } from '@/constants/buttons';
 import { useNotifications } from '@/hooks/useNotifications';
 import { useBreakpoints } from '@/hooks/useBreakpoints';
@@ -17,31 +13,54 @@ import { Toast } from '@/components/Toast';
 import { ToastArea } from '@/components/ToastArea';
 import { ToggleButton } from '@/components/ToggleButton';

-type ElementProps = {
-  notifications: {
-    notification: Notification<any, any>;
-    key: string;
-    displayData: NotificationDisplayData;
-  }[];
-};
-
 type StyleProps = {
  className?: string;
 };

-export const NotificationStack = ({ notifications, className }: ElementProps & StyleProps) => {
+const MAX_TOASTS = 10;
+
+export const NotificationsToastArea = ({ className }: StyleProps) => {
  const [shouldStackNotifications, setshouldStackNotifications] = useState(true);

-  const { markUnseen, markSeen, onNotificationAction } = useNotifications();
+  const {
+    notifications,
+    getKey,
+    getDisplayData,
+    markUnseen,
+    markSeen,
+    isMenuOpen,
+    onNotificationAction,
+  } = useNotifications();
+
  const { isMobile } = useBreakpoints();
-  const hasMultipleToasts = notifications.length > 1;
+  const notificationMap = useMemo(() => {
+    return (
+      Object.values(notifications)
+        // Sort by time of first trigger
+        .sort(
+          (n1, n2) =>
+            n1.timestamps[NotificationStatus.Triggered]! -
+            n2.timestamps[NotificationStatus.Triggered]!
+        )
+        .map((notification) => ({
+          notification,
+          key: getKey(notification),
+          displayData: getDisplayData(notification),
+        }))
+        .filter(
+          ({ 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}
-      size={notifications.length}
-    >
+    <StyledToastArea swipeDirection={isMobile ? 'up' : 'right'} className={className}>
      {hasMultipleToasts && (
        <StyledToggleButton
          shape={ButtonShape.Pill}
@@ -53,12 +72,12 @@ export const NotificationStack = ({ notifications, className }: ElementProps & S
        </StyledToggleButton>
      )}

-      {notifications.map(({ notification, key, displayData }, idx) => (
+      {notificationMap.map(({ notification, key, displayData }, idx) => (
        <StyledToast
          key={key}
-          isStacked={idx > 0 && shouldStackNotifications}
+          isStacked={shouldStackNotifications}
          isOpen={notification.status < NotificationStatus.Unseen}
-          layer={idx}
+          layer={notificationMap.length - 1 - idx}
          notification={notification}
          slotIcon={displayData.icon}
          slotTitle={displayData.title}
@@ -91,13 +110,19 @@ export const NotificationStack = ({ notifications, className }: ElementProps & S
  );
 };

-const StyledToastArea = styled(ToastArea)<{ size: number }>`
-  position: relative;
-  ${({ size }) =>
-    size &&
-    css`
-      padding-bottom: calc(${size - 1} * 2px);
-    `}
+const StyledToastArea = styled(ToastArea)`
+  position: absolute;
+  width: min(17.5rem, 100%);
+  inset: 0 0 0 auto;
+
+  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 }>`
@@ -108,7 +133,7 @@ const StyledToast = styled(Toast)<{ isStacked?: boolean; layer: number }>`
          position: absolute;
          left: 0;
          top: calc(${layer} * 2px);
-          right: 0;
+          right: calc(${layer} * -2px);
        `
      : css`
          margin-bottom: 0.75rem;
@@ -120,7 +145,7 @@ const StyledToggleButton = styled(ToggleButton)<{ isPressed: boolean }>`
  pointer-events: auto;
  display: none;
  position: absolute;
-  top: -0.5rem;
+  top: 4px;
  left: calc(50% - 0.75rem);
  --button-width: 2rem;
  --button-height: 1rem;
@@ -1,71 +0,0 @@
-import { useMemo } from 'react';
-import { groupBy } from 'lodash';
-import styled from 'styled-components';
-
-import { breakpoints } from '@/styles';
-import { layoutMixins } from '@/styles/layoutMixins';
-
-import { NotificationStatus } from '@/constants/notifications';
-import { useNotifications } from '@/hooks/useNotifications';
-
-import { NotificationStack } from './NotifcationStack';
-
-type StyleProps = {
-  className?: string;
-};
-
-const MAX_TOASTS = 10;
-
-export const NotificationsToastArea = ({ className }: StyleProps) => {
-  const { notifications, getKey, getDisplayData, isMenuOpen } = useNotifications();
-
-  const notificationMapByType = useMemo(() => {
-    const notificationMap = Object.values(notifications)
-      // Sort by time of first trigger
-      .sort(
-        (n1, n2) =>
-          n1.timestamps[NotificationStatus.Triggered]! -
-          n2.timestamps[NotificationStatus.Triggered]!
-      )
-      .map((notification) => ({
-        notification,
-        key: getKey(notification),
-        displayData: getDisplayData(notification),
-      }))
-      .filter(
-        ({ displayData, notification }) =>
-          displayData && notification.status < NotificationStatus.Unseen
-      )
-      .slice(-MAX_TOASTS);
-    return groupBy(notificationMap, (notification) => notification.displayData?.groupKey);
-  }, [notifications, getKey, getDisplayData]);
-
-  if (isMenuOpen) return null;
-
-  return (
-    <StyledToastArea className={className}>
-      {Object.keys(notificationMapByType).map((groupKey) => (
-        <NotificationStack notifications={notificationMapByType[groupKey]} key={groupKey} />
-      ))}
-    </StyledToastArea>
-  );
-};
-
-const StyledToastArea = styled.div`
-  ${layoutMixins.scrollArea}
-
-  position: absolute;
-  width: min(17.5rem, 100%);
-  inset: 0 0 0 auto;
-
-  padding: 0.75rem 0.75rem 0.75rem 0;
-
-  mask-image: linear-gradient(to left, transparent, white 0.5rem);
-
-  pointer-events: none;
-
-  @media ${breakpoints.mobile} {
-    width: 100%;
-    position: fixed;
-  }
-`;
@@ -173,10 +173,6 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
      return parsedObj as T;
    }

-    if (typeof x === 'bigint') {
-      return x.toString() as T;
-    }
-
    throw new Error(`Unsupported data type: ${typeof x}`);
  }

@@ -367,13 +363,7 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
    try {
      const ibcMsg = {
        typeUrl: params.msgTypeUrl, // '/ibc.applications.transfer.v1.MsgTransfer',
-        value: {
-          ...params.msg,
-          timeoutTimestamp: params.msg.timeoutTimestamp
-            // Squid returns timeoutTimestamp as Long, but the signer expects BigInt
-            ? BigInt(Long.fromValue(params.msg.timeoutTimestamp).toString())
-            : undefined,
-        },
+        value: params.msg,
      };
      const fee = await this.nobleClient.simulateTransaction([ibcMsg]);

@@ -423,13 +413,7 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
      );
      const ibcMsg: EncodeObject = {
        typeUrl: parsedIbcPayload.msgTypeUrl,
-        value: {
-          ...parsedIbcPayload.msg,
-          timeoutTimestamp: parsedIbcPayload.msg.timeoutTimestamp
-            // Squid returns timeoutTimestamp as Long, but the signer expects BigInt
-            ? BigInt(Long.fromValue(parsedIbcPayload.msg.timeoutTimestamp).toString())
-            : undefined,
-        },
+        value: parsedIbcPayload.msg,
      };

      const tx = await this.compositeClient.send(
@@ -11,16 +11,16 @@ class TestFlags {
    const params = new URLSearchParams(queryParamsString);

    for (const [key, value] of params) {
-      this.queryParams[key.toLowerCase()] = value;
+      this.queryParams[key] = value;
    }
  }

  get displayInitializingMarkets() {
-    return !!this.queryParams.displayinitializingmarkets;
+    return !!this.queryParams.displayInitializingMarkets;
  }

-  get showMobileSignInOption() {
-    return !!this.queryParams.mobilesignin;
+  get withCCTP() {
+    return !!this.queryParams.withCCTP;
  }
 }

@@ -1,4 +1,4 @@
-import { createConfig, configureChains, mainnet, Chain } from 'wagmi';
+import { createConfig, configureChains, mainnet, Chain, Connector, usePublicClient } from 'wagmi';
 import { goerli } from 'wagmi/chains';

 import {
@@ -26,9 +26,6 @@ import {
  fantomTestnet,
  celo,
  celoAlfajores,
-  scroll,
-  kava,
-  sepolia,
 } from 'viem/chains';

 import { alchemyProvider } from 'wagmi/providers/alchemy';
@@ -56,7 +53,7 @@ import { isTruthy } from './isTruthy';
 export const WAGMI_SUPPORTED_CHAINS: Chain[] = [
  mainnet,
  goerli,
-  sepolia,
+
  arbitrum,
  arbitrumGoerli,
  avalanche,
@@ -81,8 +78,6 @@ export const WAGMI_SUPPORTED_CHAINS: Chain[] = [
  fantomTestnet,
  celo,
  celoAlfajores,
-  scroll,
-  kava,
 ];

 const { chains, publicClient, webSocketPublicClient } = configureChains(
@@ -30,9 +30,6 @@ import abacusStateManager from '@/lib/abacus';
 import { isTruthy } from '@/lib/isTruthy';
 import { truncateAddress } from '@/lib/wallet';

-import { DYDXBalancePanel } from './rewards/DYDXBalancePanel';
-import { MigratePanel } from './rewards/MigratePanel';
-
 const ENS_CHAIN_ID = 1; // Ethereum

 const Profile = () => {
@@ -178,27 +175,8 @@ const Profile = () => {
          onClick={() => dispatch(openDialog({ type: DialogTypes.Help }))}
        />
      </Styled.EqualGrid>
-      
-      <MigratePanel />
-      <DYDXBalancePanel />

      <Styled.EqualGrid>
-        <Styled.RewardsPanel
-          slotHeaderContent="Trading Rewards"
-          href={`/${chainTokenLabel}`}
-          hasSeparator
-        >
-          <Styled.Details
-            items={[
-              {
-                key: 'week-rewards',
-                label: stringGetter({ key: STRING_KEYS.THIS_WEEK }),
-                value: '-',
-              },
-            ]}
-            layout="grid"
-          />
-        </Styled.RewardsPanel>
        <Panel
          slotHeaderContent={stringGetter({ key: STRING_KEYS.FEES })}
          href={`${AppRoute.Portfolio}/${PortfolioRoute.Fees}`}
@@ -213,6 +191,19 @@ const Profile = () => {
            layout="grid"
          />
        </Panel>
+        <Styled.RewardsPanel
+          slotHeaderContent={stringGetter({ key: STRING_KEYS.REWARDS })}
+          href={`/${chainTokenLabel}`}
+          hasSeparator
+        >
+          <Styled.Details
+            items={[
+              { key: 'maker', label: stringGetter({ key: STRING_KEYS.YOU_WILL_EARN }), value: '-' },
+              { key: 'taker', label: stringGetter({ key: STRING_KEYS.EPOCH_ENDS_IN }), value: '-' },
+            ]}
+            layout="grid"
+          />
+        </Styled.RewardsPanel>
      </Styled.EqualGrid>

      <Styled.TablePanel
@@ -336,13 +327,6 @@ Styled.Details = styled(Details)`
 `;

 Styled.RewardsPanel = styled(Panel)`
-  align-self: flex-start;
-  
-  &,
-  > * {
-    height: 100%;
-  }
-
  dl {
    --details-grid-numColumns: 1;
  }
@@ -17,14 +17,11 @@ import { TransferHistoryTable } from '@/views/tables/TransferHistoryTable';
 import { Button } from '@/components/Button';
 import { Icon, IconName } from '@/components/Icon';
 import { NavigationMenu } from '@/components/NavigationMenu';
-import { Tag, TagType } from '@/components/Tag';
 import { WithSidebar } from '@/components/WithSidebar';

-import { getOnboardingState, getSubaccount, getTradeInfoNumbers } from '@/state/accountSelectors';
+import { getOnboardingState, getSubaccount } from '@/state/accountSelectors';
 import { openDialog } from '@/state/dialogs';

-import { shortenNumberForDisplay } from '@/lib/numbers';
-
 import { PortfolioNavMobile } from './PortfolioNavMobile';
 import { LoadingSpace } from '@/components/Loading/LoadingSpinner';

@@ -45,10 +42,6 @@ export default () => {
  const { freeCollateral } = useSelector(getSubaccount, shallowEqual) || {};
  const { nativeTokenBalance } = useAccountBalance();

-  const { numTotalPositions, numTotalOpenOrders } = useSelector(getTradeInfoNumbers, shallowEqual) || {};
-  const numPositions = shortenNumberForDisplay(numTotalPositions);
-  const numOrders = shortenNumberForDisplay(numTotalOpenOrders);
-
  const usdcBalance = freeCollateral?.current || 0;

  useDocumentTitle(stringGetter({ key: STRING_KEYS.PORTFOLIO }));
@@ -125,28 +118,14 @@ export default () => {
                    },
                    {
                      value: PortfolioRoute.Positions,
-                      slotBefore: <Styled.Icon iconName={IconName.Positions} />,
-                      label: (
-                        <>
-                          {stringGetter({ key: STRING_KEYS.POSITIONS })}
-                          {numPositions > 0 && (
-                            <Tag type={TagType.Number}> {numPositions} </Tag>
-                          )}
-                        </>
-                      ),
+                      slotBefore: <Styled.Icon iconName={IconName.Cube} />,
+                      label: stringGetter({ key: STRING_KEYS.POSITIONS }),
                      href: PortfolioRoute.Positions,
                    },
                    {
                      value: PortfolioRoute.Orders,
                      slotBefore: <Styled.Icon iconName={IconName.OrderPending} />,
-                      label: (
-                        <>
-                          {stringGetter({ key: STRING_KEYS.ORDERS })}
-                          {numOrders > 0 && (
-                            <Tag type={TagType.Number}> {numOrders} </Tag>
-                          )}
-                        </>
-                      ),
+                      label: stringGetter({ key: STRING_KEYS.ORDERS }),
                      href: PortfolioRoute.Orders,
                    },
                    {
@@ -2,6 +2,7 @@ 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';

@@ -32,7 +33,7 @@ export const DYDXBalancePanel = () => {
  const { chainTokenLabel } = useTokenConfigs();

  return (
-    <Panel
+    <Styled.Panel
      slotHeader={
        <Styled.Header>
          <Styled.Title>
@@ -108,12 +109,21 @@ export const DYDXBalancePanel = () => {
          ]}
        />
      </Styled.Content>
-    </Panel>
+    </Styled.Panel>
  );
 };

 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;
@@ -24,8 +24,6 @@ import { openDialog } from '@/state/dialogs';

 import { log } from '@/lib/telemetry';

-const SEASON_NUMBER = 2;
-
 export const LaunchIncentivesPanel = () => {
  const { isNotTablet } = useBreakpoints();
  const dispatch = useDispatch();
@@ -70,12 +68,10 @@ const EstimatedRewards = () => {

  const { data, isLoading } = useQuery({
    enabled: !!dydxAddress,
-    queryKey: `launch_incentives_rewards_${dydxAddress ?? ''}_${SEASON_NUMBER}`,
+    queryKey: `launch_incentives_rewards_${dydxAddress ?? ''}`,
    queryFn: async () => {
      if (!dydxAddress) return undefined;
-      const resp = await fetch(
-        `https://cloud.chaoslabs.co/query/api/dydx/points/${dydxAddress}?n=${SEASON_NUMBER}`
-      );
+      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),
@@ -89,7 +85,9 @@ const EstimatedRewards = () => {
          <Styled.Season>
            {stringGetter({
              key: STRING_KEYS.LAUNCH_INCENTIVES_SEASON_NUM,
-              params: { SEASON_NUMBER },
+              params: {
+                SEASON_NUMBER: 1,
+              },
            })}
          </Styled.Season>
        </div>
@@ -153,8 +151,15 @@ const LaunchIncentivesContent = () => {
 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`
@@ -218,7 +223,7 @@ Styled.Column = styled.div`
 Styled.EstimatedRewardsCard = styled.div`
  ${layoutMixins.spacedRow}
  padding: 1rem 1.25rem;
-  min-width: 19rem;
+  min-width: 21.25rem;
  height: calc(100% - calc(1.5rem * 2));
  margin: 1.5rem;

@@ -7,6 +7,8 @@ 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';
@@ -26,7 +28,7 @@ import { MustBigNumber } from '@/lib/numbers';
 const TOKEN_MIGRATION_LEARN_MORE_LINK =
  'https://www.dydx.foundation/blog/update-on-exploring-the-future-of-dydx';

-export const MigratePanel = ({ className }: { className?: string }) => {
+export const MigratePanel = () => {
  const { isNotTablet } = useBreakpoints();
  const stringGetter = useStringGetter();

@@ -43,7 +45,6 @@ export const MigratePanel = ({ className }: { className?: string }) => {

  return isNotTablet ? (
    <Styled.MigratePanel
-      className={className}
      slotHeader={<Styled.Title>{stringGetter({ key: STRING_KEYS.MIGRATE })}</Styled.Title>}
      slotRight={
        <Styled.MigrateAction>
@@ -73,7 +74,6 @@ export const MigratePanel = ({ className }: { className?: string }) => {
    </Styled.MigratePanel>
  ) : (
    <Styled.MigratePanel
-      className={className}
      slotHeader={
        <Styled.MobileMigrateHeader>
          <h3>
@@ -134,11 +134,17 @@ export const MigratePanel = ({ className }: { className?: string }) => {
 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`
@@ -151,7 +157,7 @@ Styled.Title = styled.h3`
 Styled.MigrateAction = styled.div`
  ${layoutMixins.flexEqualColumns}
  align-items: center;
-  margin: 1rem;
+  margin-right: 1rem;
  gap: 1rem;
  padding: 1rem;
  width: 100%;
@@ -191,7 +197,7 @@ Styled.MobileMigrateHeader = styled.div`
  font: var(--font-small-book);
  color: var(--color-text-0);

-  padding: 1rem 1rem 0;
+  padding: 1rem 1.5rem 0;

  h3 {
    ${layoutMixins.inlineRow}
@@ -1,86 +0,0 @@
-import styled, { AnyStyledComponent } from 'styled-components';
-
-import { breakpoints } from '@/styles';
-import { STRING_KEYS } from '@/constants/localization';
-import { layoutMixins } from '@/styles/layoutMixins';
-import { useStringGetter } from '@/hooks';
-
-import { Accordion } from '@/components/Accordion';
-import { Link } from '@/components/Link';
-import { Panel } from '@/components/Panel';
-
-const REWARDS_LEARN_MORE_LINK = ''; // to be configured
-
-export const RewardsHelpPanel = () => {
-  const stringGetter = useStringGetter();
-
-  return (
-    <Styled.HelpCard
-      slotHeader={
-        <Styled.Header>
-          <h3>{stringGetter({ key: STRING_KEYS.HELP })}</h3>
-          {REWARDS_LEARN_MORE_LINK && (
-            <Link withIcon href={REWARDS_LEARN_MORE_LINK}>
-              {stringGetter({ key: STRING_KEYS.LEARN_MORE })}
-            </Link>
-          )}
-        </Styled.Header>
-      }
-    >
-      <Accordion
-        items={[
-          {
-            header: 'Who is eligible for trading rewards?',
-            content: 'All traders are eligible for trading rewards.',
-          },
-          {
-            header: 'How do trading rewards work?',
-            content:
-              'Immediately after each fill, trading rewards are sent directly to the trader’s dYdX Chain address, based on the amount of fees paid by the trader.',
-          },
-          {
-            header: 'How do I claim my rewards?',
-            content:
-              'Each block, trading rewards are automatically sent directly to the trader’s dYdX Chain address.',
-          },
-        ]}
-      />
-    </Styled.HelpCard>
-  );
-};
-
-const Styled: Record<string, AnyStyledComponent> = {};
-
-Styled.HelpCard = styled(Panel)`
-  --panel-content-paddingX: 0;
-  --panel-content-paddingY: 0;
-  width: 100%;
-  height: max-content;
-  padding: 0;
-  gap: 0;
-
-  text-align: start;
-`;
-
-Styled.Header = styled.div`
-  ${layoutMixins.spacedRow}
-  gap: 1ch;
-
-  padding: 1rem 1rem;
-  border-bottom: var(--border-width) solid var(--border-color);
-
-  font: var(--font-small-book);
-
-  @media ${breakpoints.notTablet} {
-    padding: 1.5rem 1.25rem;
-  }
-
-  h3 {
-    font: var(--font-medium-book);
-    color: var(--color-text-2);
-  }
-`;
-
-Styled.Link = styled(Link)`
-  display: inline-flex;
-`;
@@ -1,18 +1,15 @@
 import styled, { AnyStyledComponent } from 'styled-components';
 import { useDispatch } from 'react-redux';
-import { useNavigate } from 'react-router-dom';

 import { STRING_KEYS } from '@/constants/localization';
 import { ButtonAction, ButtonSize } from '@/constants/buttons';
 import { DialogTypes } from '@/constants/dialogs';
-import { AppRoute } from '@/constants/routes';

 import { useBreakpoints, useStringGetter, useURLConfigs } from '@/hooks';

 import { breakpoints } from '@/styles';
 import { layoutMixins } from '@/styles/layoutMixins';

-import { BackButton } from '@/components/BackButton';
 import { Panel } from '@/components/Panel';
 import { IconName } from '@/components/Icon';
 import { IconButton } from '@/components/IconButton';
@@ -23,14 +20,12 @@ import { openDialog } from '@/state/dialogs';
 import { DYDXBalancePanel } from './DYDXBalancePanel';
 import { MigratePanel } from './MigratePanel';
 import { LaunchIncentivesPanel } from './LaunchIncentivesPanel';
-import { RewardsHelpPanel } from './RewardsHelpPanel';

 const RewardsPage = () => {
  const dispatch = useDispatch();
  const stringGetter = useStringGetter();
  const { governanceLearnMore, stakingLearnMore } = useURLConfigs();
  const { isTablet, isNotTablet } = useBreakpoints();
-  const navigate = useNavigate();

  const panelArrow = (
    <Styled.Arrow>
@@ -44,16 +39,13 @@ const RewardsPage = () => {

  return (
    <Styled.Page>
-      {isTablet && (
-        <Styled.MobileHeader>
-          <BackButton onClick={() => navigate(AppRoute.Profile)} />
-          {stringGetter({ key: STRING_KEYS.TRADING_REWARDS })}
-        </Styled.MobileHeader>
-      )}
-      {import.meta.env.VITE_V3_TOKEN_ADDRESS && isNotTablet && <MigratePanel />}
+      {import.meta.env.VITE_V3_TOKEN_ADDRESS && <MigratePanel />}

      {isTablet ? (
-        <LaunchIncentivesPanel />
+        <>
+          <LaunchIncentivesPanel />
+          <DYDXBalancePanel />
+        </>
      ) : (
        <Styled.PanelRowIncentivesAndBalance>
          <LaunchIncentivesPanel />
@@ -63,9 +55,7 @@ const RewardsPage = () => {

      <Styled.PanelRow>
        <Styled.Panel
-          slotHeaderContent={
-            <Styled.Title>{stringGetter({ key: STRING_KEYS.GOVERNANCE })}</Styled.Title>
-          }
+          slotHeader={<Styled.Title>{stringGetter({ key: STRING_KEYS.GOVERNANCE })}</Styled.Title>}
          slotRight={panelArrow}
          onClick={() => dispatch(openDialog({ type: DialogTypes.ExternalNavKeplr }))}
        >
@@ -78,9 +68,7 @@ const RewardsPage = () => {
        </Styled.Panel>

        <Styled.Panel
-          slotHeaderContent={
-            <Styled.Title>{stringGetter({ key: STRING_KEYS.STAKING })}</Styled.Title>
-          }
+          slotHeader={<Styled.Title>{stringGetter({ key: STRING_KEYS.STAKING })}</Styled.Title>}
          slotRight={panelArrow}
          onClick={() => dispatch(openDialog({ type: DialogTypes.ExternalNavKeplr }))}
        >
@@ -92,8 +80,6 @@ const RewardsPage = () => {
          </Styled.Description>
        </Styled.Panel>
      </Styled.PanelRow>
-
-      <RewardsHelpPanel />
    </Styled.Page>
  );
 };
@@ -109,41 +95,33 @@ Styled.Page = styled.div`
  align-items: center;

  > * {
-    --content-max-width: 80rem;
+    --content-max-width: 70rem;
    max-width: min(calc(100vw - 4rem), var(--content-max-width));
  }

  @media ${breakpoints.tablet} {
-    --stickyArea-topHeight: var(--page-header-height-mobile);
-    padding: 0 1rem 1rem;
+    padding: 1.25rem;

    > * {
-      max-width: calc(100vw - 2rem);
+      max-width: calc(100vw - 2.5rem);
      width: 100%;
    }
  }
 `;

-Styled.MobileHeader = styled.header`
-  ${layoutMixins.contentSectionDetachedScrollable}
-  ${layoutMixins.stickyHeader}
-  z-index: 2;
-  padding: 1.25rem 0;
-  margin-bottom: -1.5rem;
-
-  font: var(--font-large-medium);
-  color: var(--color-text-2);
-  background-color: var(--color-layer-2);
-`;
-
 Styled.Panel = styled(Panel)`
-  height: fit-content;
+  --panel-paddingX: 1.5rem;
+
+  @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);
-  margin-bottom: -1rem;
+  padding: 1rem 1.5rem 0;
 `;

 Styled.Description = styled.div`
@@ -83,6 +83,7 @@ export const HorizontalPanel = ({ isOpen = true, setIsOpen }: ElementProps) => {
  const tabItems = useMemo(
    () => [
      {
+        asChild: true,
        value: InfoSection.Position,
        label: stringGetter({
          key: showCurrentMarket ? STRING_KEYS.POSITION : STRING_KEYS.POSITIONS,
@@ -1,8 +1,10 @@
 import { createSelector } from 'reselect';

+import { SubaccountPosition } from '@/constants/abacus';
 import { OnboardingState, OnboardingSteps } from '@/constants/account';

 import {
+  getExistingOpenPositions,
  getOnboardingGuards,
  getOnboardingState,
  getSubaccountId,
@@ -58,8 +60,13 @@ export const calculateIsAccountViewOnly = createSelector(
 );

 /**
- * @description calculate whether the subaccount has uncommitted positions
+ * @description calculate whether the subaccount has open positions
 */
+export const calculateHasOpenPositions = createSelector(
+  [getExistingOpenPositions],
+  (openPositions?: SubaccountPosition[]) => (openPositions?.length || 0) > 0
+);
+
 export const calculateHasUncommittedOrders = createSelector(
  [getUncommittedOrderClientIds],
  (uncommittedOrderClientIds: number[]) => uncommittedOrderClientIds.length > 0
@@ -2,7 +2,6 @@ import { OrderSide } from '@dydxprotocol/v4-client-js';
 import { createSelector } from 'reselect';

 import {
-  type AbacusOrderStatuses,
  type SubaccountOrder,
  type SubaccountFill,
  type SubaccountFundingPayment,
@@ -44,6 +43,7 @@ export const getSubaccountBuyingPower = (state: RootState) => state.account.suba
 export const getSubaccountEquity = (state: RootState) => state.account.subaccount?.equity;

 export const getSubaccountHistoricalPnl = (state: RootState) => state.account?.historicalPnl;
+
 /**
 * @param state
 * @returns list of a subaccount's open positions. Each item in the list is an open position in a different market.
@@ -258,14 +258,6 @@ export const getCurrentMarketFundingPayments = createSelector(
    !currentMarketId ? [] : marketFundingPayments[currentMarketId]
 );

-/**
- * @param state
- * @returns boolean on whether an order status is considered open
- */
-const isOpenOrderStatus = (status: AbacusOrderStatuses) => {
-  return status !== AbacusOrderStatus.filled && status !== AbacusOrderStatus.cancelled;
-};
-
 /**
 * @param state
 * @returns Total numbers of the subaccount's open positions, open orders and fills
@@ -274,7 +266,8 @@ export const getTradeInfoNumbers = createSelector(
  [getExistingOpenPositions, getSubaccountOrders, getSubaccountFills, getSubaccountFundingPayments],
  (positions, orders, fills, fundingPayments) => ({
    numTotalPositions: positions?.length,
-    numTotalOpenOrders: orders?.filter((order) => isOpenOrderStatus(order.status)).length,
+    numTotalOpenOrders: orders?.filter((order) => order.status !== AbacusOrderStatus.cancelled)
+      .length,
    numTotalFills: fills?.length,
    numTotalFundingPayments: fundingPayments?.length,
  })
@@ -288,7 +281,8 @@ export const getCurrentMarketTradeInfoNumbers = createSelector(
  [getCurrentMarketOrders, getCurrentMarketFills, getCurrentMarketFundingPayments],
  (marketOrders, marketFills, marketFundingPayments) => {
    return {
-      numOpenOrders: marketOrders?.filter((order) => isOpenOrderStatus(order.status)).length,
+      numOpenOrders: marketOrders?.filter((order) => order.status !== AbacusOrderStatus.cancelled)
+        .length,
      numFills: marketFills?.length,
      numFundingPayments: marketFundingPayments?.length,
    };
@@ -26,12 +26,7 @@ export const calculateFundingRateHistory = createSelector(
    return data.map(({ effectiveAtMilliseconds, rate }) => ({
      time: effectiveAtMilliseconds,
      fundingRate: rate,
-      direction:
-        rate === 0
-          ? FundingDirection.None
-          : rate < 0
-          ? FundingDirection.ToLong
-          : FundingDirection.ToShort,
+      direction: rate < 0 ? FundingDirection.ToLong : FundingDirection.ToShort,
    }));
  }
 );
@@ -29,6 +29,7 @@ export const MarketDetails: React.FC = () => {
  if (!configs) return null;

  const {
+    basePositionNotional,
    tickSize,
    stepSize,
    initialMarginFraction,
@@ -113,11 +114,17 @@ export const MarketDetails: React.FC = () => {
      ),
    },
    {
-      key: 'initial-margin-fraction',
-      label: stringGetter({ key: STRING_KEYS.INITIAL_MARGIN_FRACTION }),
+      key: 'base-initial-margin-fraction',
+      label: stringGetter({ key: STRING_KEYS.BASE_INITIAL_MARGIN_FRACTION }),
      tooltip: 'initial-margin-fraction',
      value: <Output useGrouping value={initialMarginFraction} type={OutputType.SmallPercent} />,
    },
+    {
+      key: 'base-position-notional',
+      label: stringGetter({ key: STRING_KEYS.BASE_POSITION_NOTIONAL }),
+      tooltip: 'base-position-notional',
+      value: <Output useGrouping value={basePositionNotional} type={OutputType.Number} />,
+    },
  ];

  return (
@@ -1,20 +1,14 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import styled, { AnyStyledComponent, css, keyframes } from 'styled-components';
 import { useSelector, shallowEqual } from 'react-redux';
-import { OrderSide } from '@dydxprotocol/v4-client-js';

-import {
-  DepthChartDatum,
-  DepthChartPoint,
-  DepthChartSeries,
-  SERIES_KEY_FOR_ORDER_SIDE,
-} from '@/constants/charts';
-import { StringGetterFunction } from '@/constants/localization';
+import { StringGetterFunction, STRING_KEYS } from '@/constants/localization';

 import { useBreakpoints } from '@/hooks';
-import { useOrderbookValuesForDepthChart } from '@/hooks/useOrderbookValues';

-import { getCurrentMarketConfig } from '@/state/perpetualsSelectors';
+import { MustBigNumber } from '@/lib/numbers';
+
+import { getCurrentMarketConfig, getCurrentMarketOrderbook } from '@/state/perpetualsSelectors';
 import { getCurrentMarketAssetData } from '@/state/assetsSelectors';

 import { XYChartWithPointerEvents } from '@/components/visx/XYChartWithPointerEvents';
@@ -27,25 +21,24 @@ import {
  darkTheme,
  DataProvider,
  EventEmitterProvider,
-  type EventHandlerParams,
 } from '@visx/xychart';
 import { LinearGradient } from '@visx/gradient';
 import { curveStepAfter } from '@visx/curve';
-import { Point } from '@visx/point';
+import type { Point } from '@visx/point';
 import Tooltip from '@/components/visx/XYChartTooltipWithBounds';
+import { TooltipContent } from '@/components/visx/TooltipContent';
 import { AxisLabelOutput } from '@/components/visx/AxisLabelOutput';

+import { Details } from '@/components/Details';
 import { LoadingSpace } from '@/components/Loading/LoadingSpinner';
-import { OutputType } from '@/components/Output';
+import { Output, OutputType } from '@/components/Output';

-import { MustBigNumber } from '@/lib/numbers';
-
-import { DepthChartTooltipContent } from './Tooltip';
+import { OrderSide } from '@dydxprotocol/v4-client-js';

 // @ts-ignore
 const theme = buildChartTheme({
  ...darkTheme,
-  colors: ['var(--color-positive)', 'var(--color-negative)', 'var(--color-layer-6)'], // categorical colors, mapped to series via `dataKey`s
+  colors: ['var(--color-positive)', 'var(--color-negative)', 'white'], // categorical colors, mapped to series via `dataKey`s
 });

 const clamp = (n: number, min: number, max: number) => Math.max(min, Math.min(max, n));
@@ -65,6 +58,30 @@ const formatNumber = (n: number, selectedLocale: string, isCompact: boolean = n
    : formattedNumber;
 };

+enum DepthChartSeries {
+  Asks = 'Asks',
+  Bids = 'Bids',
+  MidMarket = 'MidMarket',
+}
+
+type DepthChartDatum = {
+  size: number;
+  price: number;
+  depth: number;
+  seriesKey: DepthChartSeries;
+};
+
+const seriesKeyForOrderSide = {
+  [OrderSide.BUY]: DepthChartSeries.Bids,
+  [OrderSide.SELL]: DepthChartSeries.Asks,
+};
+
+type DepthChartPoint = {
+  side: OrderSide;
+  price: number;
+  size: number;
+};
+
 export const DepthChart = ({
  onChartClick,
  stringGetter,
@@ -79,6 +96,8 @@ export const DepthChart = ({
  const { isMobile } = useBreakpoints();

  // Chart data
+
+  const orderbook = useSelector(getCurrentMarketOrderbook, shallowEqual);
  const { id = '' } = useSelector(getCurrentMarketAssetData, shallowEqual) ?? {};
  const { stepSizeDecimals, tickSizeDecimals } =
    useSelector(getCurrentMarketConfig, shallowEqual) ?? {};
@@ -93,15 +112,43 @@ export const DepthChart = ({
    midMarketPrice,
    spread,
    spreadPercent,
-    orderbook,
-  } = useOrderbookValuesForDepthChart();
+  } = useMemo(() => {
+    const bids = (orderbook?.bids?.toArray() ?? [])
+      .filter(Boolean)
+      .map((datum) => ({ ...datum, seriesKey: DepthChartSeries.Bids } as DepthChartDatum));
+
+    const asks = (orderbook?.asks?.toArray() ?? [])
+      .filter(Boolean)
+      .map((datum) => ({ ...datum, seriesKey: DepthChartSeries.Asks } as DepthChartDatum));
+
+    const lowestBid = bids[bids.length - 1];
+    const highestBid = bids[0];
+    const lowestAsk = asks[0];
+    const highestAsk = asks[asks.length - 1];
+
+    const midMarketPrice = orderbook?.midPrice;
+    const spread = MustBigNumber(lowestAsk?.price ?? 0).minus(highestBid?.price ?? 0);
+    const spreadPercent = orderbook?.spreadPercent;
+
+    return {
+      bids,
+      asks,
+      lowestBid,
+      highestBid,
+      lowestAsk,
+      highestAsk,
+      midMarketPrice,
+      spread,
+      spreadPercent,
+    };
+  }, [orderbook]);

  // Chart state

  const [isPointerPressed, setIsPointerPressed] = useState(false);
  const [chartPointAtPointer, setChartPointAtPointer] = useState<DepthChartPoint>();

-  const isEditingOrder = Boolean(isPointerPressed && chartPointAtPointer);
+  const isEditingOrder = isPointerPressed && chartPointAtPointer;

  const [zoomDomain, setZoomDomain] = useState<undefined | number>();

@@ -146,24 +193,12 @@ export const DepthChart = ({
  }, [orderbook, zoomDomain]);

  const getChartPoint = useCallback(
-    (point: Point | EventHandlerParams<object>) => {
-      let price, size;
-      if (point instanceof Point) {
-        const { x, y } = point as Point;
-        price = x;
-        size = y;
-      } else {
-        const { svgPoint: { x, y } = {} } = point as EventHandlerParams<object>;
-        price = x;
-        size = y;
-      }
-
-      return {
-        side: MustBigNumber(price).lt(midMarketPrice!) ? OrderSide.BUY : OrderSide.SELL,
+    ({ x: price, y: size }: Point) =>
+      ({
+        side: price < midMarketPrice! ? OrderSide.BUY : OrderSide.SELL,
        price,
        size,
-      } as DepthChartPoint;
-    },
+      } as DepthChartPoint),
    [midMarketPrice]
  );

@@ -221,7 +256,7 @@ export const DepthChart = ({
            }}
            onPointerUp={(point) => point && onChartClick?.(getChartPoint(point))}
            onPointerMove={(point) => point && setChartPointAtPointer(getChartPoint(point))}
-            onPointerPressedChange={(isPointerPressed) => setIsPointerPressed(isPointerPressed)}
+            onPointerPressedChange={setIsPointerPressed}
          >
            <Axis
              orientation="bottom"
@@ -328,7 +363,7 @@ export const DepthChart = ({
                <Styled.XAxisLabelOutput
                  type={OutputType.Fiat}
                  value={
-                    isEditingOrder && chartPointAtPointer
+                    isEditingOrder
                      ? chartPointAtPointer.price
                      : tooltipData!.nearestDatum?.datum.price
                  }
@@ -339,8 +374,8 @@ export const DepthChart = ({
                      [DepthChartSeries.Bids]: 'var(--color-positive)',
                      [DepthChartSeries.MidMarket]: 'var(--color-layer-6)',
                    }[
-                      isEditingOrder && chartPointAtPointer
-                        ? SERIES_KEY_FOR_ORDER_SIDE[chartPointAtPointer.side]
+                      isEditingOrder
+                        ? seriesKeyForOrderSide[chartPointAtPointer.side]
                        : (tooltipData!.nearestDatum?.key as DepthChartSeries)
                    ]
                  }
@@ -354,7 +389,7 @@ export const DepthChart = ({
                  <Styled.YAxisLabelOutput
                    type={OutputType.Asset}
                    value={
-                      isEditingOrder && chartPointAtPointer
+                      isEditingOrder
                        ? chartPointAtPointer.size
                        : tooltipData!.nearestDatum?.datum.depth
                    }
@@ -365,8 +400,8 @@ export const DepthChart = ({
                        [DepthChartSeries.Bids]: 'var(--color-positive)',
                        [DepthChartSeries.MidMarket]: 'var(--color-layer-6)',
                      }[
-                        isEditingOrder && chartPointAtPointer
-                          ? SERIES_KEY_FOR_ORDER_SIDE[chartPointAtPointer.side]
+                        isEditingOrder
+                          ? seriesKeyForOrderSide[chartPointAtPointer.side]
                          : (tooltipData!.nearestDatum?.key as DepthChartSeries)
                      ]
                    }
@@ -375,22 +410,181 @@ export const DepthChart = ({
              }
              snapTooltipToDatumX={!isEditingOrder}
              snapTooltipToDatumY={isEditingOrder ? false : isMobile}
-              renderTooltip={({ tooltipData, colorScale }) =>
-                chartPointAtPointer && (
-                  <DepthChartTooltipContent
-                    {...{
-                      tooltipData,
-                      colorScale,
-                      isEditingOrder,
-                      chartPointAtPointer,
-                      stringGetter,
-                      selectedLocale,
-                      stepSizeDecimals,
-                      tickSizeDecimals,
-                    }}
-                  />
-                )
-              }
+              renderTooltip={({ tooltipData, colorScale }) => {
+                const { nearestDatum } = tooltipData || {};
+
+                if (!isEditingOrder && !nearestDatum?.datum) return null;
+
+                return (
+                  <TooltipContent
+                    accentColor={colorScale?.(
+                      isEditingOrder
+                        ? seriesKeyForOrderSide[chartPointAtPointer.side]
+                        : nearestDatum.key
+                    )}
+                  >
+                    <h4>
+                      {isEditingOrder
+                        ? 'Release mouse to edit order'
+                        : {
+                            [DepthChartSeries.Bids]: 'Bids',
+                            [DepthChartSeries.Asks]: 'Asks',
+                            [DepthChartSeries.MidMarket]: 'Mid-Market',
+                          }[nearestDatum.key]}
+                    </h4>
+
+                    <Details
+                      layout="column"
+                      items={
+                        isEditingOrder
+                          ? [
+                              {
+                                key: 'side',
+                                label: stringGetter({ key: STRING_KEYS.SIDE }),
+                                value: (
+                                  <Output
+                                    type={OutputType.Text}
+                                    value={
+                                      {
+                                        [OrderSide.BUY]: stringGetter({
+                                          key: STRING_KEYS.BUY,
+                                        }),
+                                        [OrderSide.SELL]: stringGetter({
+                                          key: STRING_KEYS.SELL,
+                                        }),
+                                      }[chartPointAtPointer.side]
+                                    }
+                                  />
+                                ),
+                              },
+                              {
+                                key: 'limitPrice',
+                                label: stringGetter({ key: STRING_KEYS.LIMIT_PRICE }),
+                                value: (
+                                  <Output
+                                    type={OutputType.Fiat}
+                                    value={chartPointAtPointer.price}
+                                    useGrouping={false}
+                                  />
+                                ),
+                              },
+                              {
+                                key: 'size',
+                                label: stringGetter({ key: STRING_KEYS.AMOUNT }),
+                                value: (
+                                  <Output
+                                    type={OutputType.Asset}
+                                    value={chartPointAtPointer.size}
+                                    fractionDigits={stepSizeDecimals}
+                                    tag={id}
+                                    useGrouping={false}
+                                  />
+                                ),
+                              },
+                            ]
+                          : nearestDatum?.key === DepthChartSeries.MidMarket
+                          ? [
+                              {
+                                key: 'midMarketPrice',
+                                // label: stringGetter({ key: STRING_KEYS.ORDERBOOK_MID_MARKET_PRICE }),
+                                label: stringGetter({ key: STRING_KEYS.PRICE }),
+                                value: (
+                                  <Output
+                                    type={OutputType.Fiat}
+                                    value={midMarketPrice}
+                                    useGrouping={false}
+                                  />
+                                ),
+                              },
+                              {
+                                key: 'spread',
+                                label: stringGetter({ key: STRING_KEYS.ORDERBOOK_SPREAD }),
+                                value: (
+                                  <>
+                                    <Output
+                                      type={OutputType.Fiat}
+                                      value={spread}
+                                      fractionDigits={tickSizeDecimals}
+                                      useGrouping={false}
+                                    />
+                                    <Output
+                                      type={OutputType.SmallPercent}
+                                      value={spreadPercent}
+                                      withParentheses
+                                    />
+                                  </>
+                                ),
+                              },
+                            ]
+                          : [
+                              {
+                                key: 'price',
+                                label: stringGetter({ key: STRING_KEYS.PRICE }),
+                                value: (
+                                  <>
+                                    {nearestDatum &&
+                                      {
+                                        [DepthChartSeries.Bids]: '≥',
+                                        [DepthChartSeries.Asks]: '≤',
+                                      }[nearestDatum.key]}
+                                    <Output
+                                      type={OutputType.Fiat}
+                                      value={nearestDatum?.datum.price}
+                                      useGrouping={false}
+                                    />
+                                  </>
+                                ),
+                              },
+                              {
+                                key: 'depth',
+                                label: stringGetter({ key: STRING_KEYS.TOTAL_SIZE }),
+                                value: (
+                                  <Output
+                                    type={OutputType.Asset}
+                                    value={nearestDatum?.datum.depth}
+                                    fractionDigits={stepSizeDecimals}
+                                    tag={id}
+                                    useGrouping={false}
+                                  />
+                                ),
+                              },
+                              {
+                                key: 'cost',
+                                label: stringGetter({ key: STRING_KEYS.TOTAL_COST }),
+                                value: (
+                                  <Output
+                                    useGrouping
+                                    type={OutputType.Fiat}
+                                    value={nearestDatum?.datum.price * nearestDatum?.datum.depth}
+                                  />
+                                ),
+                              },
+                              {
+                                key: 'priceImpact',
+                                label: stringGetter({ key: STRING_KEYS.PRICE_IMPACT }),
+                                value: (
+                                  <Output
+                                    useGrouping
+                                    type={OutputType.Percent}
+                                    value={{
+                                      [DepthChartSeries.Asks]: () =>
+                                        MustBigNumber(nearestDatum.datum.price)
+                                          .minus(lowestAsk.price)
+                                          .div(nearestDatum.datum.price),
+                                      [DepthChartSeries.Bids]: () =>
+                                        MustBigNumber(highestBid.price)
+                                          .minus(nearestDatum.datum.price)
+                                          .div(highestBid.price),
+                                    }[nearestDatum.key]()}
+                                  />
+                                ),
+                              },
+                            ]
+                      }
+                    />
+                  </TooltipContent>
+                );
+              }}
            />
          </XYChartWithPointerEvents>
        </EventEmitterProvider>
@@ -1,220 +0,0 @@
-import { useMemo } from 'react';
-import { OrderSide } from '@dydxprotocol/v4-client-js';
-import type { RenderTooltipParams } from '@visx/xychart/lib/components/Tooltip';
-import { shallowEqual, useSelector } from 'react-redux';
-
-import type { Nullable } from '@/constants/abacus';
-import {
-  DepthChartDatum,
-  DepthChartPoint,
-  DepthChartSeries,
-  SERIES_KEY_FOR_ORDER_SIDE,
-} from '@/constants/charts';
-import { STRING_KEYS } from '@/constants/localization';
-
-import { useStringGetter } from '@/hooks';
-import { useOrderbookValuesForDepthChart } from '@/hooks/useOrderbookValues';
-
-import { TooltipContent } from '@/components/visx/TooltipContent';
-import { Details } from '@/components/Details';
-import { Output, OutputType } from '@/components/Output';
-
-import { getCurrentMarketAssetData } from '@/state/assetsSelectors';
-
-import { MustBigNumber } from '@/lib/numbers';
-
-type DepthChartTooltipProps = {
-  chartPointAtPointer: DepthChartPoint;
-  isEditingOrder?: boolean;
-  stepSizeDecimals: Nullable<number>;
-  tickSizeDecimals: Nullable<number>;
-} & Pick<RenderTooltipParams<DepthChartDatum>, 'colorScale' | 'tooltipData'>;
-
-export const DepthChartTooltipContent = ({
-  chartPointAtPointer,
-  colorScale,
-  isEditingOrder,
-  stepSizeDecimals,
-  tickSizeDecimals,
-  tooltipData,
-}: DepthChartTooltipProps) => {
-  const { nearestDatum } = tooltipData || {};
-  const stringGetter = useStringGetter();
-  const { spread, spreadPercent, midMarketPrice } = useOrderbookValuesForDepthChart();
-  const { id = '' } = useSelector(getCurrentMarketAssetData, shallowEqual) ?? {};
-
-  const priceImpact = useMemo(() => {
-    if (nearestDatum) {
-      const depthChartSeries = nearestDatum.key as DepthChartSeries;
-
-      return {
-        [DepthChartSeries.Bids]: MustBigNumber(nearestDatum?.datum.price)
-          .minus(chartPointAtPointer.price)
-          .div(nearestDatum?.datum.price),
-        [DepthChartSeries.Asks]: MustBigNumber(chartPointAtPointer.price)
-          .minus(nearestDatum?.datum.price)
-          .div(chartPointAtPointer.price),
-        [DepthChartSeries.MidMarket]: undefined,
-      }[depthChartSeries];
-    }
-    return undefined;
-  }, [nearestDatum, chartPointAtPointer.price]);
-
-  if (!isEditingOrder && !nearestDatum?.datum) return null;
-
-  return (
-    <TooltipContent
-      accentColor={
-        nearestDatum?.key &&
-        colorScale?.(
-          isEditingOrder ? SERIES_KEY_FOR_ORDER_SIDE[chartPointAtPointer.side] : nearestDatum.key
-        )
-      }
-    >
-      <h4>
-        {isEditingOrder
-          ? stringGetter({ key: STRING_KEYS.RELEASE_TO_EDIT })
-          : nearestDatum &&
-            {
-              [DepthChartSeries.Bids]: stringGetter({ key: STRING_KEYS.BIDS }),
-              [DepthChartSeries.Asks]: stringGetter({ key: STRING_KEYS.ASKS }),
-              [DepthChartSeries.MidMarket]: stringGetter({ key: STRING_KEYS.MID_MARKET }),
-            }[nearestDatum.key]}
-      </h4>
-
-      <Details
-        layout="column"
-        items={
-          isEditingOrder
-            ? [
-                {
-                  key: 'side',
-                  label: stringGetter({ key: STRING_KEYS.SIDE }),
-                  value: (
-                    <Output
-                      type={OutputType.Text}
-                      value={
-                        {
-                          [OrderSide.BUY]: stringGetter({
-                            key: STRING_KEYS.BUY,
-                          }),
-                          [OrderSide.SELL]: stringGetter({
-                            key: STRING_KEYS.SELL,
-                          }),
-                        }[chartPointAtPointer.side]
-                      }
-                    />
-                  ),
-                },
-                {
-                  key: 'limitPrice',
-                  label: stringGetter({ key: STRING_KEYS.LIMIT_PRICE }),
-                  value: (
-                    <Output
-                      type={OutputType.Fiat}
-                      value={chartPointAtPointer.price}
-                      useGrouping={false}
-                    />
-                  ),
-                },
-                {
-                  key: 'size',
-                  label: stringGetter({ key: STRING_KEYS.AMOUNT }),
-                  value: (
-                    <Output
-                      type={OutputType.Asset}
-                      value={chartPointAtPointer.size}
-                      fractionDigits={stepSizeDecimals}
-                      tag={id}
-                      useGrouping={false}
-                    />
-                  ),
-                },
-              ]
-            : nearestDatum?.key === DepthChartSeries.MidMarket
-            ? [
-                {
-                  key: 'midMarketPrice',
-                  label: stringGetter({ key: STRING_KEYS.PRICE }),
-                  value: (
-                    <Output type={OutputType.Fiat} value={midMarketPrice} useGrouping={false} />
-                  ),
-                },
-                {
-                  key: 'spread',
-                  label: stringGetter({ key: STRING_KEYS.ORDERBOOK_SPREAD }),
-                  value: (
-                    <>
-                      <Output
-                        type={OutputType.Fiat}
-                        value={spread}
-                        fractionDigits={tickSizeDecimals}
-                        useGrouping={false}
-                      />
-                      <Output
-                        type={OutputType.SmallPercent}
-                        value={spreadPercent}
-                        withParentheses
-                      />
-                    </>
-                  ),
-                },
-              ]
-            : [
-                {
-                  key: 'price',
-                  label: stringGetter({ key: STRING_KEYS.PRICE }),
-                  value: (
-                    <>
-                      {nearestDatum &&
-                        {
-                          [DepthChartSeries.Bids]: '≥',
-                          [DepthChartSeries.Asks]: '≤',
-                        }[nearestDatum.key]}
-                      <Output
-                        type={OutputType.Fiat}
-                        value={nearestDatum?.datum.price}
-                        useGrouping={false}
-                      />
-                    </>
-                  ),
-                },
-                {
-                  key: 'depth',
-                  label: stringGetter({ key: STRING_KEYS.TOTAL_SIZE }),
-                  value: (
-                    <Output
-                      type={OutputType.Asset}
-                      value={nearestDatum?.datum.depth}
-                      fractionDigits={stepSizeDecimals}
-                      tag={id}
-                      useGrouping={false}
-                    />
-                  ),
-                },
-                {
-                  key: 'cost',
-                  label: stringGetter({ key: STRING_KEYS.TOTAL_COST }),
-                  value: (
-                    <Output
-                      useGrouping
-                      type={OutputType.Fiat}
-                      value={
-                        nearestDatum
-                          ? nearestDatum?.datum.price * nearestDatum?.datum.depth
-                          : undefined
-                      }
-                    />
-                  ),
-                },
-                {
-                  key: 'priceImpact',
-                  label: stringGetter({ key: STRING_KEYS.PRICE_IMPACT }),
-                  value: <Output useGrouping type={OutputType.Percent} value={priceImpact} />,
-                },
-              ]
-        }
-      />
-    </TooltipContent>
-  );
-};
@@ -3,27 +3,39 @@ import { shallowEqual, useSelector } from 'react-redux';
 import styled, { type AnyStyledComponent, css } from 'styled-components';
 import { curveMonotoneX, curveStepAfter } from '@visx/curve';

-import { ButtonSize } from '@/constants/buttons';
-import { FundingRateResolution, type FundingChartDatum } from '@/constants/charts';
-import { STRING_KEYS } from '@/constants/localization';
-import { FundingDirection } from '@/constants/markets';
-import { SMALL_PERCENT_DECIMALS, TINY_PERCENT_DECIMALS } from '@/constants/numbers';
 import { useBreakpoints, useStringGetter } from '@/hooks';
+import { ButtonSize } from '@/constants/buttons';
+import { STRING_KEYS } from '@/constants/localization';
+import { SMALL_PERCENT_DECIMALS, TINY_PERCENT_DECIMALS } from '@/constants/numbers';
+import { FundingDirection } from '@/constants/markets';

 import { breakpoints } from '@/styles';

-import { Output, OutputType } from '@/components/Output';
+import { Details, DetailsItem } from '@/components/Details';
+import { Output, OutputType, ShowSign } from '@/components/Output';
 import { LoadingSpace } from '@/components/Loading/LoadingSpinner';
 import { ToggleGroup } from '@/components/ToggleGroup';

 import { TimeSeriesChart } from '@/components/visx/TimeSeriesChart';
 import { AxisLabelOutput } from '@/components/visx/AxisLabelOutput';
+import { TooltipContent } from '@/components/visx/TooltipContent';
 import type { TooltipContextType } from '@visx/xychart';

 import { calculateFundingRateHistory } from '@/state/perpetualsCalculators';

 import { MustBigNumber } from '@/lib/numbers';
-import { FundingChartTooltipContent } from './Tooltip';
+
+enum FundingRateResolution {
+  OneHour = 'OneHour',
+  EightHour = 'EightHour',
+  Annualized = 'Annualized',
+}
+
+type FundingChartDatum = {
+  time: number;
+  fundingRate: number;
+  direction: FundingDirection;
+};

 const FUNDING_RATE_TIME_RESOLUTION = 60 * 60 * 1000; // 1 hour

@@ -104,20 +116,114 @@ export const FundingChart = ({ selectedLocale }: ElementProps) => {
              {
                [FundingDirection.ToLong]: 'var(--color-negative)',
                [FundingDirection.ToShort]: 'var(--color-positive)',
-                [FundingDirection.None]: 'var(--color-layer-6)',
              }[tooltipDatum.direction]
            }
          />
        );
      }}
-      renderTooltip={({ tooltipData }) => (
-        <FundingChartTooltipContent
-          fundingRateView={fundingRateView}
-          tooltipData={tooltipData}
-          latestDatum={latestDatum}
-        />
-      )}
-      onTooltipContext={(tooltipContext) => setTooltipContext(tooltipContext)}
+      renderTooltip={({ tooltipData }) => {
+        const { nearestDatum } = tooltipData || {};
+
+        const tooltipDatum = nearestDatum?.datum ?? latestDatum;
+        const isShowingCurrentFundingRate = tooltipDatum === latestDatum;
+
+        return (
+          <TooltipContent
+            accentColor={
+              {
+                [FundingDirection.ToLong]: 'var(--color-negative)',
+                [FundingDirection.ToShort]: 'var(--color-positive)',
+              }[tooltipDatum.direction]
+            }
+          >
+            <h4>
+              {isShowingCurrentFundingRate
+                ? stringGetter({ key: STRING_KEYS.CURRENT_FUNDING_RATE })
+                : stringGetter({ key: STRING_KEYS.HISTORICAL_FUNDING_RATE })}
+            </h4>
+
+            <Details
+              layout="column"
+              items={
+                [
+                  {
+                    key: 'direction',
+                    label: stringGetter({ key: STRING_KEYS.DIRECTION }),
+                    value: (
+                      <Output
+                        type={OutputType.Text}
+                        value={
+                          {
+                            [FundingDirection.ToLong]: `${stringGetter({
+                              key: STRING_KEYS.SHORT_POSITION_SHORT,
+                            })} → ${stringGetter({
+                              key: STRING_KEYS.LONG_POSITION_SHORT,
+                            })}`,
+                            [FundingDirection.ToShort]: `${stringGetter({
+                              key: STRING_KEYS.LONG_POSITION_SHORT,
+                            })} → ${stringGetter({
+                              key: STRING_KEYS.SHORT_POSITION_SHORT,
+                            })}`,
+                          }[tooltipDatum.direction]
+                        }
+                      />
+                    ),
+                  },
+                  {
+                    key: 'fundingRate1h',
+                    label: stringGetter({ key: STRING_KEYS.RATE_1H }),
+                    value: (
+                      <Output
+                        type={OutputType.SmallPercent}
+                        value={tooltipDatum.fundingRate}
+                        showSign={ShowSign.Both}
+                      />
+                    ),
+                  },
+                  {
+                    key: 'fundingRate8h',
+                    label: stringGetter({ key: STRING_KEYS.RATE_8H }),
+                    value: (
+                      <Output
+                        type={OutputType.SmallPercent}
+                        value={tooltipDatum.fundingRate * 8}
+                        // value={
+                        //   Math.sign(tooltipDatum.fundingRate) *
+                        //   ((Math.abs(tooltipDatum.fundingRate) + 1) ** 8 - 1)
+                        // }
+                        showSign={ShowSign.Both}
+                      />
+                    ),
+                  },
+                  {
+                    key: 'fundingRateAnnualized',
+                    label: stringGetter({ key: STRING_KEYS.ANNUALIZED }),
+                    value: (
+                      <Output
+                        type={OutputType.SmallPercent}
+                        value={tooltipDatum.fundingRate * (24 * 365)}
+                        // value={
+                        //   Math.sign(tooltipDatum.fundingRate) *
+                        //   ((Math.abs(tooltipDatum.fundingRate) + 1) ** (24 * 365) - 1)
+                        // }
+                        showSign={ShowSign.Both}
+                      />
+                    ),
+                  },
+                  {
+                    key: 'time',
+                    label: isShowingCurrentFundingRate
+                      ? 'Time Remaining'
+                      : stringGetter({ key: STRING_KEYS.TIME }),
+                    value: <Output type={OutputType.DateTime} value={tooltipDatum.time} />,
+                  },
+                ].filter(Boolean) as Array<DetailsItem>
+              }
+            />
+          </TooltipContent>
+        );
+      }}
+      onTooltipContext={setTooltipContext}
      minZoomDomain={FUNDING_RATE_TIME_RESOLUTION * 4}
      numGridLines={1}
      slotEmpty={<LoadingSpace id="funding-chart-loading" />}
@@ -184,7 +290,6 @@ Styled.FundingRateToggle = styled.div`
 Styled.CurrentFundingRate = styled.div<{ isShowing?: boolean }>`
  place-self: start center;
  padding: clamp(1.5rem, 9rem - 15%, 4rem);
-  pointer-events: none;

  font: var(--font-large-book);

@@ -1,107 +0,0 @@
-import type { RenderTooltipParams } from '@visx/xychart/lib/components/Tooltip';
-import { TooltipContent } from '@/components/visx/TooltipContent';
-
-import { FundingRateResolution, type FundingChartDatum } from '@/constants/charts';
-import { STRING_KEYS } from '@/constants/localization';
-import { FundingDirection } from '@/constants/markets';
-import { useStringGetter } from '@/hooks';
-
-import { Details, DetailsItem } from '@/components/Details';
-import { Output, OutputType, ShowSign } from '@/components/Output';
-
-type FundingChartTooltipProps = {
-  fundingRateView: FundingRateResolution;
-  latestDatum: FundingChartDatum;
-} & Pick<RenderTooltipParams<FundingChartDatum>, 'tooltipData'>;
-
-export const FundingChartTooltipContent = ({
-  fundingRateView,
-  latestDatum,
-  tooltipData,
-}: FundingChartTooltipProps) => {
-  const { nearestDatum } = tooltipData || {};
-  const stringGetter = useStringGetter();
-
-  const tooltipDatum = nearestDatum?.datum ?? latestDatum;
-  const isShowingCurrentFundingRate = tooltipDatum === latestDatum;
-
-  return (
-    <TooltipContent
-      accentColor={
-        {
-          [FundingDirection.ToLong]: 'var(--color-negative)',
-          [FundingDirection.ToShort]: 'var(--color-positive)',
-          [FundingDirection.None]: 'var(--color-layer-6)',
-        }[tooltipDatum.direction]
-      }
-    >
-      <h4>
-        {isShowingCurrentFundingRate
-          ? stringGetter({ key: STRING_KEYS.CURRENT_FUNDING_RATE })
-          : stringGetter({ key: STRING_KEYS.HISTORICAL_FUNDING_RATE })}
-      </h4>
-
-      <Details
-        layout="column"
-        items={
-          [
-            {
-              key: 'direction',
-              label: stringGetter({ key: STRING_KEYS.DIRECTION }),
-              value: (
-                <Output
-                  type={OutputType.Text}
-                  value={
-                    {
-                      [FundingDirection.ToLong]: `${stringGetter({
-                        key: STRING_KEYS.SHORT_POSITION_SHORT,
-                      })} → ${stringGetter({
-                        key: STRING_KEYS.LONG_POSITION_SHORT,
-                      })}`,
-                      [FundingDirection.ToShort]: `${stringGetter({
-                        key: STRING_KEYS.LONG_POSITION_SHORT,
-                      })} → ${stringGetter({
-                        key: STRING_KEYS.SHORT_POSITION_SHORT,
-                      })}`,
-                      [FundingDirection.None]: undefined,
-                    }[tooltipDatum.direction]
-                  }
-                />
-              ),
-            },
-            {
-              key: 'fundingRate',
-              label: stringGetter({
-                key: {
-                  [FundingRateResolution.OneHour]: STRING_KEYS.RATE_1H,
-                  [FundingRateResolution.EightHour]: STRING_KEYS.RATE_8H,
-                  [FundingRateResolution.Annualized]: STRING_KEYS.ANNUALIZED,
-                }[fundingRateView],
-              }),
-              value: (
-                <Output
-                  type={OutputType.SmallPercent}
-                  value={
-                    {
-                      [FundingRateResolution.OneHour]: tooltipDatum.fundingRate,
-                      [FundingRateResolution.EightHour]: tooltipDatum.fundingRate * 8,
-                      [FundingRateResolution.Annualized]: tooltipDatum.fundingRate * (24 * 365),
-                    }[fundingRateView]
-                  }
-                  showSign={ShowSign.Both}
-                />
-              ),
-            },
-            {
-              key: 'time',
-              label: isShowingCurrentFundingRate
-                ? 'Time Remaining'
-                : stringGetter({ key: STRING_KEYS.TIME }),
-              value: <Output type={OutputType.DateTime} value={tooltipDatum.time} />,
-            },
-          ].filter(Boolean) as Array<DetailsItem>
-        }
-      />
-    </TooltipContent>
-  );
-};
@@ -18,7 +18,11 @@ type ElementProps = {
  onSelectChain: (chain: string) => void;
 };

-export const ChainSelectMenu = ({ label, selectedChain, onSelectChain }: ElementProps) => {
+export const ChainSelectMenu = ({
+  label,
+  selectedChain,
+  onSelectChain,
+}: ElementProps) => {
  const stringGetter = useStringGetter();
  const { type, depositOptions, withdrawalOptions, resources } =
    useSelector(getTransferInputs, shallowEqual) || {};
@@ -34,7 +38,7 @@ export const ChainSelectMenu = ({ label, selectedChain, onSelectChain }: Element
    slotBefore: <Styled.Img src={chain.iconUrl} alt="" />,
  }));

-  const selectedOption = chains.find((item) => item.type === selectedChain);
+  const selectedOption = chains.find((item) => item.type === selectedChain); 

  return (
    <SearchSelectMenu
@@ -77,4 +81,4 @@ Styled.ChainRow = styled.div`
  gap: 0.5rem;
  color: var(--color-text-2);
  font: var(--font-base-book);
-`;
+`;
@@ -1,16 +1,21 @@
-import { type Dispatch, type ReactNode, type SetStateAction, useState, useMemo } from 'react';
+import { type Dispatch, type SetStateAction, useState, type ReactNode } from 'react';
 import styled, { type AnyStyledComponent } from 'styled-components';
 import { shallowEqual, useSelector } from 'react-redux';
 import type { RouteData } from '@0xsquid/sdk';
-import { formatUnits } from 'viem';

-import { ButtonAction, ButtonShape, ButtonSize, ButtonType } from '@/constants/buttons';
+import {
+  ButtonAction,
+  ButtonShape,
+  ButtonSize,
+  ButtonState,
+  ButtonType,
+} from '@/constants/buttons';

 import { TransferInputTokenResource } from '@/constants/abacus';
 import { STRING_KEYS } from '@/constants/localization';
-import { NumberSign, TOKEN_DECIMALS } from '@/constants/numbers';
+import { NumberSign } from '@/constants/numbers';

-import { useStringGetter, useTokenConfigs } from '@/hooks';
+import { useStringGetter } from '@/hooks';
 import { useMatchingEvmNetwork } from '@/hooks/useMatchingEvmNetwork';

 import { layoutMixins } from '@/styles/layoutMixins';
@@ -80,7 +85,6 @@ export const DepositButtonAndReceipt = ({
    useSelector(getSubaccountBuyingPower, shallowEqual) || {};

  const { isCctp, summary, requestPayload } = useSelector(getTransferInputs, shallowEqual) || {};
-  const { usdcDecimals, usdcLabel } = useTokenConfigs();

  const feeSubitems: DetailsItem[] = [];

@@ -95,7 +99,7 @@ export const DepositButtonAndReceipt = ({
  if (typeof summary?.bridgeFee === 'number') {
    feeSubitems.push({
      key: 'bridge-fees',
-      label: <span>{stringGetter({ key: STRING_KEYS.BRIDGE_FEE })}</span>,
+      label: <span>Bridge Fee</span>,
      value: <Output type={OutputType.Fiat} value={summary?.bridgeFee} />,
    });
  }
@@ -109,53 +113,11 @@ export const DepositButtonAndReceipt = ({
  const totalFees = (summary?.bridgeFee || 0) + (summary?.gasFee || 0);

  const submitButtonReceipt = [
-    {
-      key: 'expected-deposit-amount',
-      label: (
-        <span>
-          {stringGetter({ key: STRING_KEYS.EXPECTED_DEPOSIT_AMOUNT })} <Tag>{usdcLabel}</Tag>
-        </span>
-      ),
-      value: <Output type={OutputType.Fiat} fractionDigits={TOKEN_DECIMALS} value={summary?.toAmount} />,
-      subitems: [
-        {
-          key: 'minimum-deposit-amount',
-          label: (
-            <span>
-              {stringGetter({ key: STRING_KEYS.MINIMUM_DEPOSIT_AMOUNT })} <Tag>{usdcLabel}</Tag>
-            </span>
-          ),
-          value: (
-            <Output type={OutputType.Fiat} fractionDigits={TOKEN_DECIMALS} value={summary?.toAmountMin} />
-          ),
-          tooltip: 'minimum-deposit-amount',
-        },
-      ],
-    },
-    {
-      key: 'exchange-rate',
-      label: <span>{stringGetter({ key: STRING_KEYS.EXCHANGE_RATE })}</span>,
-      value:
-        typeof summary?.exchangeRate === 'number' ? (
-          <Styled.ExchangeRate>
-            <Output
-              type={OutputType.Asset}
-              value={1}
-              fractionDigits={0}
-              tag={sourceToken?.symbol}
-            />
-            =
-            <Output type={OutputType.Asset} value={summary?.exchangeRate} tag={usdcLabel} />
-          </Styled.ExchangeRate>
-        ) : (
-          <Output type={OutputType.Asset} />
-        ),
-    },
    {
      key: 'equity',
      label: (
        <span>
-          {stringGetter({ key: STRING_KEYS.EQUITY })} <Tag>{usdcLabel}</Tag>
+          {stringGetter({ key: STRING_KEYS.EQUITY })} <Tag>USDC</Tag>
        </span>
      ),
      value: (
@@ -172,7 +134,7 @@ export const DepositButtonAndReceipt = ({
      key: 'buying-power',
      label: (
        <span>
-          {stringGetter({ key: STRING_KEYS.BUYING_POWER })} <Tag>{usdcLabel}</Tag>
+          {stringGetter({ key: STRING_KEYS.BUYING_POWER })} <Tag>USDC</Tag>
        </span>
      ),
      value: (
@@ -185,6 +147,17 @@ export const DepositButtonAndReceipt = ({
        />
      ),
    },
+    {
+      key: 'exchange-rate',
+      label: <span>{stringGetter({ key: STRING_KEYS.EXCHANGE_RATE })}</span>,
+      value: typeof summary?.exchangeRate === 'number' && (
+        <Styled.ExchangeRate>
+          <Output type={OutputType.Asset} value={1} fractionDigits={0} tag={sourceToken?.symbol} />
+          =
+          <Output type={OutputType.Asset} value={summary?.exchangeRate} tag="USDC" />
+        </Styled.ExchangeRate>
+      ),
+    },
    !isCctp && {
      key: 'total-fees',
      label: <span>{stringGetter({ key: STRING_KEYS.TOTAL_FEES })}</span>,
@@ -206,22 +179,18 @@ export const DepositButtonAndReceipt = ({
    {
      key: 'estimatedRouteDuration',
      label: <span>{stringGetter({ key: STRING_KEYS.ESTIMATED_TIME })}</span>,
-      value: (
+      value: typeof summary?.estimatedRouteDuration === 'number' && (
        <Output
          type={OutputType.Text}
-          value={
-            typeof summary?.estimatedRouteDuration === 'number'
-              ? stringGetter({
-                  key: STRING_KEYS.X_MINUTES_LOWERCASED,
-                  params: {
-                    X:
-                      summary?.estimatedRouteDuration < 60
-                        ? '< 1'
-                        : Math.round(summary?.estimatedRouteDuration / 60),
-                  },
-                })
-              : null
-          }
+          value={stringGetter({
+            key: STRING_KEYS.X_MINUTES_LOWERCASED,
+            params: {
+              X:
+                summary?.estimatedRouteDuration < 60
+                  ? '< 1'
+                  : Math.round(summary?.estimatedRouteDuration / 60),
+            },
+          })}
        />
      ),
    },
@@ -34,7 +34,6 @@ export const TokenSelectMenu = ({ selectedToken, onSelectToken }: ElementProps)
      selectedToken && onSelectToken(selectedToken);
    },
    slotBefore: <Styled.Img src={token.iconUrl} alt="" />,
-    tag: resources?.tokenResources?.get(token.type)?.symbol,
  }));

  return (
@@ -1,4 +1,4 @@
-import { useMemo, useState } from 'react';
+import { useState } from 'react';
 import { shallowEqual, useSelector } from 'react-redux';
 import styled, { type AnyStyledComponent } from 'styled-components';
 import { formatUnits } from 'viem';
@@ -6,11 +6,14 @@ import { formatUnits } from 'viem';
 import { TransferInputTokenResource } from '@/constants/abacus';
 import { ButtonAction, ButtonShape, ButtonSize, ButtonType } from '@/constants/buttons';
 import { STRING_KEYS } from '@/constants/localization';
-import { NumberSign, TOKEN_DECIMALS } from '@/constants/numbers';
+import { NumberSign } from '@/constants/numbers';
+
+import { formatSeconds } from '@/lib/timeUtils';

 import { layoutMixins } from '@/styles/layoutMixins';

-import { useStringGetter, useTokenConfigs } from '@/hooks';
+import { useStringGetter } from '@/hooks';
+import { useAccountBalance } from '@/hooks/useAccountBalance';

 import { Button } from '@/components/Button';

@@ -57,7 +60,11 @@ export const WithdrawButtonAndReceipt = ({
  const { leverage } = useSelector(getSubaccount, shallowEqual) || {};
  const { summary, requestPayload } = useSelector(getTransferInputs, shallowEqual) || {};
  const canAccountTrade = useSelector(calculateCanAccountTrade, shallowEqual);
-  const { usdcLabel } = useTokenConfigs();
+
+  const toAmount =
+    summary?.toAmount &&
+    withdrawToken?.decimals &&
+    formatUnits(BigInt(summary.toAmount), withdrawToken?.decimals);

  const feeSubitems: DetailsItem[] = [];

@@ -92,12 +99,24 @@ export const WithdrawButtonAndReceipt = ({
      value: <Output type={OutputType.Fiat} value={totalFees} />,
      subitems: feeSubitems,
    },
+    {
+      key: 'slippage',
+      label: <span>{stringGetter({ key: STRING_KEYS.MAX_SLIPPAGE })}</span>,
+      value: (
+        <SlippageEditor
+          disabled
+          slippage={slippage}
+          setIsEditing={setIsEditingSlipapge}
+          setSlippage={setSlippage}
+        />
+      ),
+    },
    {
      key: 'exchange-rate',
      label: <span>{stringGetter({ key: STRING_KEYS.EXCHANGE_RATE })}</span>,
      value: withdrawToken && typeof summary?.exchangeRate === 'number' && (
        <Styled.ExchangeRate>
-          <Output type={OutputType.Asset} value={1} fractionDigits={0} tag={usdcLabel} />
+          <Output type={OutputType.Asset} value={1} fractionDigits={0} tag="USDC" />
          =
          <Output
            type={OutputType.Asset}
@@ -108,7 +127,7 @@ export const WithdrawButtonAndReceipt = ({
      ),
    },
    {
-      key: 'estimated-route-duration',
+      key: 'estimatedRouteDuration',
      label: <span>{stringGetter({ key: STRING_KEYS.ESTIMATED_TIME })}</span>,
      value: typeof summary?.estimatedRouteDuration === 'number' && (
        <Output
@@ -126,39 +145,20 @@ export const WithdrawButtonAndReceipt = ({
      ),
    },
    {
-      key: 'expected-amount-received',
+      key: 'wallet',
      label: (
        <span>
-          {stringGetter({ key: STRING_KEYS.EXPECTED_AMOUNT_RECEIVED })}{' '}
+          {stringGetter({ key: STRING_KEYS.MINIMUM_AMOUNT_RECEIVED })}{' '}
          {withdrawToken && <Tag>{withdrawToken?.symbol}</Tag>}
        </span>
      ),
-      value: <Output type={OutputType.Asset} value={summary?.toAmount} fractionDigits={TOKEN_DECIMALS} />,
-      subitems: [
-        {
-          key: 'minimum-amount-received',
-          label: (
-            <span>
-              {stringGetter({ key: STRING_KEYS.MINIMUM_AMOUNT_RECEIVED })}{' '}
-              {withdrawToken && <Tag>{withdrawToken?.symbol}</Tag>}
-            </span>
-          ),
-          value: (
-            <Output type={OutputType.Asset} value={summary?.toAmountMin} fractionDigits={TOKEN_DECIMALS} />
-          ),
-          tooltip: 'minimum-amount-received',
-        },
-      ],
-    },
-    {
-      key: 'slippage',
-      label: <span>{stringGetter({ key: STRING_KEYS.MAX_SLIPPAGE })}</span>,
      value: (
-        <SlippageEditor
-          disabled
-          slippage={slippage}
-          setIsEditing={setIsEditingSlipapge}
-          setSlippage={setSlippage}
+        <Styled.DiffOutput
+          type={OutputType.Asset}
+          value={'0'}
+          newValue={toAmount}
+          sign={NumberSign.Positive}
+          withDiff={Boolean(toAmount)}
        />
      ),
    },
@@ -10,9 +10,6 @@ import { STRING_KEYS, StringGetterFunction, TOOLTIP_STRING_KEYS } from '@/consta
 import { isMainnet } from '@/constants/networks';
 import { DydxChainAsset, wallets } from '@/constants/wallets';

-import { layoutMixins } from '@/styles/layoutMixins';
-import { headerMixins } from '@/styles/headerMixins';
-
 import {
  useAccounts,
  useBreakpoints,
@@ -38,8 +35,10 @@ import { getOnboardingState, getSubaccount } from '@/state/accountSelectors';

 import { isTruthy } from '@/lib/isTruthy';
 import { truncateAddress } from '@/lib/wallet';
+
+import { layoutMixins } from '@/styles/layoutMixins';
+import { headerMixins } from '@/styles/headerMixins';
 import { MustBigNumber } from '@/lib/numbers';
-import { testFlags } from '@/lib/testFlags';

 export const AccountMenu = () => {
  const stringGetter = useStringGetter();
@@ -179,7 +178,7 @@ export const AccountMenu = () => {
        },
        ...(onboardingState === OnboardingState.AccountConnected && hdKey
          ? [
-              (!isMainnet || testFlags.showMobileSignInOption) && {
+              !isMainnet && {
                value: 'MobileQrSignIn',
                icon: <Icon iconName={IconName.Qr} />,
                label: stringGetter({ key: STRING_KEYS.TITLE_SIGN_INTO_MOBILE }),
@@ -1,78 +0,0 @@
-import styled, { type AnyStyledComponent } from 'styled-components';
-
-import { STRING_KEYS } from '@/constants/localization';
-import { useStringGetter } from '@/hooks';
-
-import { Details } from '@/components/Details';
-import { Notification, NotificationProps } from '@/components/Notification';
-import { Output, OutputType } from '@/components/Output';
-import { Icon, IconName } from '@/components/Icon';
-
-type ElementProps = {
-  data: {
-    BLOCK_REWARD_AMOUNT: string;
-    BLOCK_REWARD_HEIGHT: string;
-    BLOCK_REWARD_TIME_MILLISECONDS: string;
-    TOKEN_NAME: string;
-  };
-};
-
-export type BlockRewardNotificationProps = NotificationProps & ElementProps;
-
-export const BlockRewardNotification = ({
-  isToast,
-  data,
-  notification,
-}: BlockRewardNotificationProps) => {
-  const stringGetter = useStringGetter();
-  const { BLOCK_REWARD_AMOUNT, TOKEN_NAME } = data;
-
-  return (
-    <Styled.Notification
-      isToast={isToast}
-      notification={notification}
-      slotIcon={<Icon iconName={IconName.RewardStar} />}
-      slotTitle={stringGetter({ key: STRING_KEYS.TRADING_REWARD_RECEIVED })}
-      slotCustomContent={
-        <Styled.Details
-          items={[
-            {
-              key: 'block_reward',
-              label: stringGetter({ key: STRING_KEYS.BLOCK_REWARD }),
-              value: (
-                <Styled.Output
-                  type={OutputType.Asset}
-                  value={BLOCK_REWARD_AMOUNT}
-                  tag={TOKEN_NAME}
-                />
-              ),
-            },
-          ]}
-        />
-      }
-    />
-  );
-};
-
-const Styled: Record<string, AnyStyledComponent> = {};
-
-Styled.Details = styled(Details)`
-  --details-item-height: 1.5rem;
-
-  dd {
-    color: var(--color-text-2);
-  }
-`;
-
-Styled.Notification = styled(Notification)`
-  background-image: url('/dots-background-2.svg');
-  background-size: cover;
-`;
-
-Styled.Output = styled(Output)`
-  &:before {
-    content: '+';
-    color: var(--color-positive);
-    margin-right: 0.5ch;
-  }
-`;
Author	SHA1	Message	Date
Bill He	433030fdea	update error str	2024-01-22 09:48:17 -08:00
Bill He	747b1a5aee	CCTP deposit/withdraw to throw error if nobleClient is not initialized	2024-01-02 21:08:24 -08:00
				`@@ -1 +0,0 @@`
				<svg fill="none" height="12" viewBox="0 0 12 12" width="12" xmlns="http://www.w3.org/2000/svg"><path d="m6.75.75c0-.198912-.07902-.389678-.21967-.53033-.14065-.1406525-.33142-.21967-.53033-.21967s-.38968.0790175-.53033.21967c-.14065.140652-.21967.331418-.21967.53033v4.5h-4.5c-.198912 0-.389678.07902-.53033.21967-.1406525.14065-.21967.33142-.21967.53033s.0790175.38968.21967.53033c.140652.14065.331418.21967.53033.21967h4.5v4.5c0 .1989.07902.3897.21967.5303.14065.1407.33142.2197.53033.2197s.38968-.079.53033-.2197c.14065-.1406.21967-.3314.21967-.5303v-4.5h4.5c.1989 0 .3897-.07902.5303-.21967.1407-.14065.2197-.33142.2197-.53033s-.079-.38968-.2197-.53033c-.1406-.14065-.3314-.21967-.5303-.21967h-4.5z" fill="currentColor"/></svg>