Mobile support (#828)

* feat: handle URLs with or without trailing slash (#803)

* feat: handle URLs with or without trailing slash

* tidy: cleanup slashes

* feat: implement v1 tables into v2 with data fetching

* tidy: streamline borrow

* Fix docker build (#805)

* fix: fixed the docker build

* tidy: cleanup

* env: remove env contents (#808)

* Portfolio fix (#809)

* fix: fixed the portfolio account detail page layout

* fix: fixed portfolio cards

* tidy: refactor

* align buttons, perps row clickable (#807)

* align buttons, perps row clickable

* fix comments

* update to v2.2.4

* fix borrowbutton logic, add vault deposit manage btn, fix icon size vault modal

---------

Co-authored-by: Linkie Link <[email protected]>

* Update .env.production

* Update Dockerbuild (#813)

* v2.2.4 (#810)

* feat: handle URLs with or without trailing slash (#803)

* feat: handle URLs with or without trailing slash

* tidy: cleanup slashes

* Fix docker build (#805)

* fix: fixed the docker build

* tidy: cleanup

* env: remove env contents (#808)

* Portfolio fix (#809)

* fix: fixed the portfolio account detail page layout

* fix: fixed portfolio cards

* tidy: refactor

* align buttons, perps row clickable (#807)

* align buttons, perps row clickable

* fix comments

* update to v2.2.4

* fix borrowbutton logic, add vault deposit manage btn, fix icon size vault modal

---------

Co-authored-by: Linkie Link <[email protected]>

---------

Co-authored-by: Bob van der Helm <[email protected]>

* Update Dockerfile

* remove   .env files

* tidy: format

---------

Co-authored-by: Bob van der Helm <[email protected]>

* feat: added v1 based buttons and a portfolio summary

* feat: prepared everything for modal interaction

* feat: finished deposit and withdraw

* feat: added borrow and repay

* fix: fixed lending table widths

* fix: isNaN Leverage

* fix: fix getUrl

* tidy: remove sentry

* feat: separate v1 implementation

* feat: first v1 standalone adjustments

* fix: introduce shortened connect button

* feat: created a new ChainSelect

* fix: filter available networks

* fix: autolend setting

* fix: show all decimals on AssetBalanceRow if needed

* feat: first mobile adjustments

* feat: mobile navigation adjustments

* feat: first mobile menu

* feat: first mobile version

* tidy: format

* fix: fixed mobile menu layout

* fix: never highlight toggle

* fix: updated mobile connect logic

* fix: WalletConnect

* mobile: finetuning

* fix: tradingView

* fix: breadcrumb fixes

* debug: debug deployment

* fix: mobile nav adjustments

* css: increase mobile max-width

* fix: accordion fix

* fix: mobile grid fix

* fix: fixed accordion

* fix: fixed dialog

* fix: disable scroll on chart

* fix: fixed mobile connect

* fix: forward to wallet connecting

* env: updated v1 version

* fix: fix positionings

* fix: fixed modals

* fix: fixed withdraw

* fix: outline fix

* fix: svg fixes

* fix: v1 collateral warning

* fix: fixed the pending spinner

* fix: adjust to feedback

* feat: added sparate hooks for v1

* split useAccount

* fix: add fallback data

* fix: remove debts and deposits hooks for v1

* fix getDepositedVaults

* feat: added perps mobile support

* tidy: adjust according to feedback

---------

Co-authored-by: Bob van der Helm <[email protected]>

next.config.js

@@ -9,22 +9,6 @@ const nextConfig = {
       'xdefi-static.s3.eu-west-1.amazonaws.com',
     ],
   },
-  async redirects() {
-    return [
-      {
-        source: '/((?!_next|mobile).*)',
-        has: [
-          {
-            type: 'header',
-            key: 'User-Agent',
-            value: '.*(Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile|WPDesktop).*',
-          },
-        ],
-        permanent: true,
-        destination: '/mobile',
-      },
-    ]
-  },
   async headers() {
     return [
       {

package.json

@@ -22,11 +22,11 @@
   "dependencies": {
     "@cosmjs/cosmwasm-stargate": "^0.32.2",
     "@delphi-labs/shuttle-react": "^3.19.1",
-    "@keplr-wallet/cosmos": "^0.12.67",
+    "@keplr-wallet/cosmos": "^0.12.70",
     "@splinetool/react-spline": "^2.2.6",
-    "@splinetool/runtime": "^1.0.52",
+    "@splinetool/runtime": "^1.0.55",
     "@tailwindcss/container-queries": "^0.1.1",
-    "@tanstack/react-table": "^8.11.8",
+    "@tanstack/react-table": "^8.13.2",
     "@tippyjs/react": "^4.2.6",
     "bignumber.js": "^9.1.2",
     "classnames": "^2.5.1",
@@ -42,31 +42,31 @@
     "react-draggable": "^4.4.6",
     "react-helmet-async": "^2.0.4",
     "react-qr-code": "^2.0.12",
-    "react-router-dom": "^6.22.0",
+    "react-router-dom": "^6.22.2",
     "react-spring": "^9.7.3",
     "react-toastify": "^10.0.4",
     "react-use-clipboard": "^1.0.9",
-    "recharts": "^2.12.0",
-    "swr": "^2.2.4",
+    "recharts": "^2.12.1",
+    "swr": "^2.2.5",
     "tailwind-scrollbar-hide": "^1.1.7",
-    "zustand": "^4.5.0"
+    "zustand": "^4.5.1"
   },
   "devDependencies": {
     "@svgr/webpack": "^8.1.0",
     "@types/debounce-promise": "^3.1.9",
     "@types/lodash.debounce": "^4.0.9",
     "@types/lodash.throttle": "^4.1.9",
-    "@types/node": "^20.11.17",
-    "@types/react": "18.2.55",
+    "@types/node": "^20.11.24",
+    "@types/react": "18.2.61",
     "@types/react-dom": "18.2.19",
     "@types/react-helmet": "^6.1.11",
     "autoprefixer": "^10.4.17",
-    "dotenv": "^16.4.3",
+    "dotenv": "^16.4.5",
     "dotenv-cli": "^7.3.0",
-    "eslint": "^8.56.0",
+    "eslint": "^8.57.0",
     "eslint-config-next": "^14.1.0",
     "eslint-plugin-import": "^2.29.1",
-    "husky": "^9.0.10",
+    "husky": "^9.0.11",
     "identity-obj-proxy": "^3.0.0",
     "lint-staged": "^15.2.2",
     "prettier": "^3.2.5",

public/tradingview.css

@@ -19,6 +19,9 @@
   --tv-color-toolbar-button-background-expanded: var(--tv-background);
   --tv-color-toolbar-button-background-active: var(--tv-background);
   --tv-color-toolbar-button-background-active-hover: var(--tv-background);
+  --tv-horizontal-scroll-fade-color: var(--tv-background);
+  --tv-vertical-scroll-fade-color: var(--tv-background);
+  --tv-color-popup-background: var(--tv-background);
   --tv-color-toolbar-toggle-button-background-active: rgba(255, 255, 255, 0.2);
   --tv-color-toolbar-toggle-button-background-active-hover: rgba(255, 255, 255, 0.2);
   --tv-color-toolbar-divider-background: var(--tv-menu-text);
@@ -318,3 +321,16 @@ button[class^='button-'][class*='secondary-']:hover {
 [class^='tabContent-']::-webkit-scrollbar-track {
   border-radius: 2px;
 }
+
+[class^='fadeTop-'] {
+  background-image: linear-gradient(180deg, var(--tv-background), transparent) !important;
+}
+
+[class^='fadeBot-'] {
+  background-image: linear-gradient(0deg, var(--tv-background), transparent) !important;
+}
+
+html.theme-dark ::selection {
+  background: var(--tv-background) !important;
+  color: var(--tv-menu-text-hover) !important;
+}

src/api/cache.ts

@@ -10,7 +10,10 @@ import {
   TotalDepositResponse,
   VaultConfigBaseForAddr,
 } from 'types/generated/mars-params/MarsParams.types'
-import { ArrayOfMarket } from 'types/generated/mars-red-bank/MarsRedBank.types'
+import {
+  ArrayOfMarket,
+  ArrayOfUserDebtResponse,
+} from 'types/generated/mars-red-bank/MarsRedBank.types'
 
 interface Cache<T> extends Map<string, { data: T | null; timestamp: number }> {}
 
@@ -62,3 +65,4 @@ export const underlyingDebtCache: Cache<string> = new Map()
 export const previewDepositCache: Cache<{ vaultAddress: string; amount: string }> = new Map()
 export const stakingAprCache: Cache<StakingApr[]> = new Map()
 export const assetParamsCache: Cache<AssetParamsBaseForAddr[]> = new Map()
+export const userDebtCache: Cache<ArrayOfUserDebtResponse> = new Map()