From 442b7a3a8c8cf1f89b23581eed9ed03f07dac5f6 Mon Sep 17 00:00:00 2001 From: Linkie Link Date: Wed, 14 Feb 2024 11:11:34 +0100 Subject: [PATCH] feat: implement v1 tables into v2 with data fetching --- src/api/cache.ts | 9 +++- src/api/cosmwasm-client.ts | 20 ++++++++ src/api/v1/getV1Positions.ts | 41 ++++++++++++++++ src/components/borrow/Borrowings.tsx | 8 ++-- src/components/borrow/Table/Columns/Debt.tsx | 36 -------------- .../borrow/Table/Columns/DebtValue.tsx | 30 ++++++++++++ .../Table/Columns/useDepositedColumns.tsx | 11 +++-- .../borrow/Table/DepositedBorrowingsTable.tsx | 13 ++++- .../Table/useBorrowMarketAssetsTableData.ts | 14 ++++-- src/components/common/Intro.tsx | 2 +- .../earn/lend/Table/Columns/DepositValue.tsx | 1 + .../earn/lend/Table/DepositedLendsTable.tsx | 19 ++++++-- src/components/header/DesktopHeader.tsx | 1 + src/components/header/navigation/Routes.tsx | 3 ++ src/components/v1/Borrowings.tsx | 47 ++++++++++++++++++ src/components/v1/Deposits.tsx | 48 +++++++++++++++++++ .../v1/Table/useV1BorrowingsTableData.ts | 38 +++++++++++++++ .../v1/Table/useV1DepositsTableData.ts | 39 +++++++++++++++ src/components/v1/V1Intro.tsx | 24 ++++++++++ src/hooks/v1/useV1Positions.tsx | 17 +++++++ src/pages/V1Page.tsx | 15 ++++++ src/types/interfaces/market.d.ts | 3 +- src/types/interfaces/route.d.ts | 1 + src/types/interfaces/v1.d.ts | 4 ++ 24 files changed, 387 insertions(+), 57 deletions(-) create mode 100644 src/api/v1/getV1Positions.ts delete mode 100644 src/components/borrow/Table/Columns/Debt.tsx create mode 100644 src/components/borrow/Table/Columns/DebtValue.tsx create mode 100644 src/components/v1/Borrowings.tsx create mode 100644 src/components/v1/Deposits.tsx create mode 100644 src/components/v1/Table/useV1BorrowingsTableData.ts create mode 100644 src/components/v1/Table/useV1DepositsTableData.ts create mode 100644 src/components/v1/V1Intro.tsx create mode 100644 src/hooks/v1/useV1Positions.tsx create mode 100644 src/pages/V1Page.tsx create mode 100644 src/types/interfaces/v1.d.ts diff --git a/src/api/cache.ts b/src/api/cache.ts index 3ce93c94..f6051db3 100644 --- a/src/api/cache.ts +++ b/src/api/cache.ts @@ -10,7 +10,12 @@ import { TotalDepositResponse, VaultConfigBaseForAddr, } from 'types/generated/mars-params/MarsParams.types' -import { ArrayOfMarket } from 'types/generated/mars-red-bank/MarsRedBank.types' +import { + ArrayOfMarket, + ArrayOfUserCollateralResponse, + ArrayOfUserDebtResponse, + UserCollateralResponse, +} from 'types/generated/mars-red-bank/MarsRedBank.types' interface Cache extends Map {} @@ -62,3 +67,5 @@ export const underlyingDebtCache: Cache = new Map() export const previewDepositCache: Cache<{ vaultAddress: string; amount: string }> = new Map() export const stakingAprCache: Cache = new Map() export const assetParamsCache: Cache = new Map() +export const userCollateralCache: Cache = new Map() +export const userDebtCache: Cache = new Map() diff --git a/src/api/cosmwasm-client.ts b/src/api/cosmwasm-client.ts index 357b6167..f6a0ab0a 100644 --- a/src/api/cosmwasm-client.ts +++ b/src/api/cosmwasm-client.ts @@ -6,6 +6,7 @@ import { MarsMockVaultQueryClient } from 'types/generated/mars-mock-vault/MarsMo import { MarsOracleOsmosisQueryClient } from 'types/generated/mars-oracle-osmosis/MarsOracleOsmosis.client' import { MarsParamsQueryClient } from 'types/generated/mars-params/MarsParams.client' import { MarsPerpsQueryClient } from 'types/generated/mars-perps/MarsPerps.client' +import { MarsRedBankQueryClient } from 'types/generated/mars-red-bank/MarsRedBank.client' import { MarsSwapperOsmosisQueryClient } from 'types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.client' let _cosmWasmClient: Map = new Map() @@ -15,6 +16,7 @@ let _paramsQueryClient: Map = new Map() let _incentivesQueryClient: Map = new Map() let _swapperOsmosisClient: Map = new Map() let _perpsClient: Map = new Map() +let _redBankQueryClient: Map = new Map() const getClient = async (rpc: string) => { try { @@ -137,6 +139,23 @@ const getPerpsQueryClient = async (chainConfig: ChainConfig) => { } } +const getRedBankQueryClient = async (chainConfig: ChainConfig) => { + try { + const contract = chainConfig.contracts.redBank + const rpc = chainConfig.endpoints.rpc + const key = rpc + contract + + if (!_redBankQueryClient.get(key)) { + const client = await getClient(rpc) + _redBankQueryClient.set(key, new MarsRedBankQueryClient(client, contract)) + } + + return _redBankQueryClient.get(key)! + } catch (error) { + throw error + } +} + export { getClient, getCreditManagerQueryClient, @@ -146,4 +165,5 @@ export { getSwapperQueryClient, getVaultQueryClient, getPerpsQueryClient, + getRedBankQueryClient, } diff --git a/src/api/v1/getV1Positions.ts b/src/api/v1/getV1Positions.ts new file mode 100644 index 00000000..33032dfa --- /dev/null +++ b/src/api/v1/getV1Positions.ts @@ -0,0 +1,41 @@ +import { cacheFn, userCollateralCache, userDebtCache } from 'api/cache' +import { getRedBankQueryClient } from 'api/cosmwasm-client' +import { BNCoin } from 'types/classes/BNCoin' +import { + ArrayOfUserCollateralResponse, + ArrayOfUserDebtResponse, +} from 'types/generated/mars-red-bank/MarsRedBank.types' + +export default async function getV1Positions( + chainConfig: ChainConfig, + user?: string, +): Promise { + if (!user) return new Promise((_, reject) => reject('No account Wallet ID found')) + + const redBankQueryClient = await getRedBankQueryClient(chainConfig) + + const userCollateral: ArrayOfUserCollateralResponse = await cacheFn( + () => redBankQueryClient.userCollaterals({ user: user, limit: 100 }), + userCollateralCache, + `${chainConfig.id}/v1/deposits/${user}`, + ) + const userDebt: ArrayOfUserDebtResponse = await cacheFn( + () => redBankQueryClient.userDebts({ user: user, limit: 100 }), + userDebtCache, + `${chainConfig.id}/v1/debts/${user}`, + ) + + if (userCollateral && userDebt) { + return { + id: user, + debts: userDebt.map((debt) => new BNCoin(debt)), + lends: userCollateral.map((lend) => new BNCoin(lend)), + deposits: [], + vaults: [], + perps: [], + kind: 'default', + } + } + + return new Promise((_, reject) => reject('No account found')) +} diff --git a/src/components/borrow/Borrowings.tsx b/src/components/borrow/Borrowings.tsx index a30cc99e..4f197270 100644 --- a/src/components/borrow/Borrowings.tsx +++ b/src/components/borrow/Borrowings.tsx @@ -5,15 +5,15 @@ import { BN_ZERO } from 'constants/math' import useBorrowEnabledAssets from 'hooks/assets/useBorrowEnabledAssets' export default function Borrowings() { - const data = useBorrowMarketAssetsTableData() + const { accountBorrowedAssets, availableAssets, allAssets } = useBorrowMarketAssetsTableData() - if (!data?.allAssets?.length) { + if (!allAssets?.length) { return } return ( <> - - + + ) } diff --git a/src/components/borrow/Table/Columns/Debt.tsx b/src/components/borrow/Table/Columns/Debt.tsx deleted file mode 100644 index 794822c6..00000000 --- a/src/components/borrow/Table/Columns/Debt.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import { Row } from '@tanstack/react-table' - -import AmountAndValue from 'components/common/AmountAndValue' -import { BN_ZERO } from 'constants/math' -import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets' -import { byDenom } from 'utils/array' - -export const DEBT_META = { - accessorKey: 'debt', - header: 'Debt', -} - -export const debtSortingFn = ( - a: Row, - b: Row, -): number => { - const assetA = a.original.asset - const assetB = b.original.asset - if (!a.original.accountDebt || !b.original.accountDebt) return 0 - const debtA = a.original.accountDebt.shiftedBy(-assetA.decimals) - const debtB = b.original.accountDebt.shiftedBy(-assetB.decimals) - return debtA.minus(debtB).toNumber() -} - -interface Props { - data: BorrowMarketTableData -} - -export default function Debt(props: Props) { - const marketAssets = useMarketEnabledAssets() - const asset = marketAssets.find(byDenom(props.data.asset.denom)) - - if (!asset) return null - - return -} diff --git a/src/components/borrow/Table/Columns/DebtValue.tsx b/src/components/borrow/Table/Columns/DebtValue.tsx new file mode 100644 index 00000000..ea5a4d4d --- /dev/null +++ b/src/components/borrow/Table/Columns/DebtValue.tsx @@ -0,0 +1,30 @@ +import { Row } from '@tanstack/react-table' + +import AmountAndValue from 'components/common/AmountAndValue' +import { BN_ZERO } from 'constants/math' +import { BN } from 'utils/helpers' + +export const DEBT_VALUE_META = { + id: 'accountDebtValue', + accessorKey: 'accountDebtValue', + header: 'Debt', +} + +export const debtSortingFn = ( + a: Row, + b: Row, +): number => { + const debtValueA = BN(a.original?.accountDebtValue ?? 0) + const debtValueB = BN(b.original?.accountDebtValue ?? 0) + return debtValueA.minus(debtValueB).toNumber() +} + +interface Props { + asset: Asset + debtAmount?: BigNumber +} +export default function DebtValue(props: Props) { + return ( + + ) +} diff --git a/src/components/borrow/Table/Columns/useDepositedColumns.tsx b/src/components/borrow/Table/Columns/useDepositedColumns.tsx index fa657241..1a78f892 100644 --- a/src/components/borrow/Table/Columns/useDepositedColumns.tsx +++ b/src/components/borrow/Table/Columns/useDepositedColumns.tsx @@ -2,7 +2,10 @@ import { ColumnDef } from '@tanstack/react-table' import { useMemo } from 'react' import BorrowRate, { BORROW_RATE_META } from 'components/borrow/Table/Columns/BorrowRate' -import Debt, { DEBT_META, debtSortingFn } from 'components/borrow/Table/Columns/Debt' +import DebtValue, { + DEBT_VALUE_META, + debtSortingFn, +} from 'components/borrow/Table/Columns/DebtValue' import Liquidity, { LIQUIDITY_META, liquiditySortingFn, @@ -18,8 +21,10 @@ export default function useDepositedColumns() { cell: ({ row }) => , }, { - ...DEBT_META, - cell: ({ row }) => , + ...DEBT_VALUE_META, + cell: ({ row }) => ( + + ), sortingFn: debtSortingFn, }, { diff --git a/src/components/borrow/Table/DepositedBorrowingsTable.tsx b/src/components/borrow/Table/DepositedBorrowingsTable.tsx index 85b6fa96..78c12867 100644 --- a/src/components/borrow/Table/DepositedBorrowingsTable.tsx +++ b/src/components/borrow/Table/DepositedBorrowingsTable.tsx @@ -2,6 +2,7 @@ import { Row } from '@tanstack/react-table' import { useCallback } from 'react' import BorrowActionButtons from 'components/borrow/BorrowActionButtons' +import { DEBT_VALUE_META } from 'components/borrow/Table/Columns/DebtValue' import { NAME_META } from 'components/borrow/Table/Columns/Name' import useDepositedColumns from 'components/borrow/Table/Columns/useDepositedColumns' import MarketDetails from 'components/common/MarketDetails' @@ -11,6 +12,7 @@ import ActionButtonRow from 'components/common/Table/ActionButtonRow' type Props = { data: BorrowMarketTableData[] isLoading: boolean + v1?: boolean } export default function DepositedBorrowingsTable(props: Props) { @@ -32,10 +34,17 @@ export default function DepositedBorrowingsTable(props: Props) { return ( ) diff --git a/src/components/borrow/Table/useBorrowMarketAssetsTableData.ts b/src/components/borrow/Table/useBorrowMarketAssetsTableData.ts index d5650cc2..7ca53f0f 100644 --- a/src/components/borrow/Table/useBorrowMarketAssetsTableData.ts +++ b/src/components/borrow/Table/useBorrowMarketAssetsTableData.ts @@ -1,11 +1,14 @@ import { useMemo } from 'react' +import { BN_ZERO } from 'constants/math' import useCurrentAccount from 'hooks/accounts/useCurrentAccount' import useMarkets from 'hooks/markets/useMarkets' +import useDisplayCurrencyPrice from 'hooks/useDisplayCurrencyPrice' export default function useBorrowMarketAssetsTableData() { const account = useCurrentAccount() const markets = useMarkets() + const { convertAmount } = useDisplayCurrencyPrice() return useMemo((): { accountBorrowedAssets: BorrowMarketTableData[] @@ -18,13 +21,16 @@ export default function useBorrowMarketAssetsTableData() { markets .filter((market) => market.borrowEnabled) .forEach((market) => { - const debt = account?.debts?.find((debt) => debt.denom === market.asset.denom) + const amount = + account?.debts?.find((debt) => debt.denom === market.asset.denom)?.amount ?? BN_ZERO + const value = amount ? convertAmount(market.asset, amount) : undefined const borrowMarketAsset: BorrowMarketTableData = { ...market, - accountDebt: debt?.amount, + accountDebtAmount: amount, + accountDebtValue: value, } - ;(borrowMarketAsset.accountDebt ? accountBorrowedAssets : availableAssets).push( + ;(borrowMarketAsset.accountDebtAmount ? accountBorrowedAssets : availableAssets).push( borrowMarketAsset, ) }) @@ -34,5 +40,5 @@ export default function useBorrowMarketAssetsTableData() { availableAssets, allAssets: [...accountBorrowedAssets, ...availableAssets], } - }, [account?.debts, markets]) + }, [account?.debts, markets, convertAmount]) } diff --git a/src/components/common/Intro.tsx b/src/components/common/Intro.tsx index 0a2d3bdc..41fdc893 100644 --- a/src/components/common/Intro.tsx +++ b/src/components/common/Intro.tsx @@ -17,7 +17,7 @@ import useStore from 'store' interface Props { text: string | ReactNode children?: ReactNode - bg: 'borrow' | 'lend' | 'farm' | 'portfolio' | 'hls-farm' | 'hls-staking' + bg: Page } function IntroBackground(props: { bg: Props['bg'] }) { diff --git a/src/components/earn/lend/Table/Columns/DepositValue.tsx b/src/components/earn/lend/Table/Columns/DepositValue.tsx index 54f5d33b..cfd2c504 100644 --- a/src/components/earn/lend/Table/Columns/DepositValue.tsx +++ b/src/components/earn/lend/Table/Columns/DepositValue.tsx @@ -5,6 +5,7 @@ import { BN_ZERO } from 'constants/math' import { BN } from 'utils/helpers' export const DEPOSIT_VALUE_META = { + id: 'accountLentValue', accessorKey: 'accountLentValue', header: 'Deposited', } diff --git a/src/components/earn/lend/Table/DepositedLendsTable.tsx b/src/components/earn/lend/Table/DepositedLendsTable.tsx index 42d37ade..7309ddc6 100644 --- a/src/components/earn/lend/Table/DepositedLendsTable.tsx +++ b/src/components/earn/lend/Table/DepositedLendsTable.tsx @@ -1,16 +1,18 @@ import { Row } from '@tanstack/react-table' import { useCallback } from 'react' -import LendingActionButtons from 'components/earn/lend/LendingActionButtons' -import { NAME_META } from 'components/earn/lend/Table/Columns/Name' -import useDepositedColumns from 'components/earn/lend/Table/Columns/useDepositedColumns' import MarketDetails from 'components/common/MarketDetails' import Table from 'components/common/Table' import ActionButtonRow from 'components/common/Table/ActionButtonRow' +import LendingActionButtons from 'components/earn/lend/LendingActionButtons' +import { DEPOSIT_VALUE_META } from 'components/earn/lend/Table/Columns/DepositValue' +import { NAME_META } from 'components/earn/lend/Table/Columns/Name' +import useDepositedColumns from 'components/earn/lend/Table/Columns/useDepositedColumns' type Props = { data: LendingMarketTableData[] isLoading: boolean + v1?: boolean } export default function DepositedLendsTable(props: Props) { @@ -32,10 +34,17 @@ export default function DepositedLendsTable(props: Props) { return (
) diff --git a/src/components/header/DesktopHeader.tsx b/src/components/header/DesktopHeader.tsx index e6b7b7f2..77ade9f4 100644 --- a/src/components/header/DesktopHeader.tsx +++ b/src/components/header/DesktopHeader.tsx @@ -40,6 +40,7 @@ export const menuTree = (walletId: WalletID, chainConfig: ChainConfig): MenuTree { pages: ['borrow'], label: 'Borrow' }, ...(chainConfig.hls ? [{ pages: ['hls-staking'] as Page[], label: 'High Leverage' }] : []), { pages: ['portfolio'], label: 'Portfolio' }, + { pages: ['v1'], label: 'V1' }, { pages: ['governance'], label: 'Governance', externalUrl: getGovernanceUrl(walletId) }, ] diff --git a/src/components/header/navigation/Routes.tsx b/src/components/header/navigation/Routes.tsx index 4c2eb851..901a7e08 100644 --- a/src/components/header/navigation/Routes.tsx +++ b/src/components/header/navigation/Routes.tsx @@ -12,6 +12,7 @@ import PerpsPage from 'pages/PerpsPage' import PortfolioAccountPage from 'pages/PortfolioAccountPage' import PortfolioPage from 'pages/PortfolioPage' import TradePage from 'pages/TradePage' +import V1Page from 'pages/V1Page' import Layout from 'pages/_layout' export default function Routes() { @@ -32,6 +33,7 @@ export default function Routes() { } /> } /> } /> + } /> } /> {chainConfig.hls && } />} {chainConfig.hls && } />} @@ -47,6 +49,7 @@ export default function Routes() { } /> {chainConfig.hls && } />} {chainConfig.hls && } />} + } /> } /> diff --git a/src/components/v1/Borrowings.tsx b/src/components/v1/Borrowings.tsx new file mode 100644 index 00000000..75f159b2 --- /dev/null +++ b/src/components/v1/Borrowings.tsx @@ -0,0 +1,47 @@ +import BorrowingsTable from 'components/borrow/Table/DepositedBorrowingsTable' +import useV1BorrowingsTableData from 'components/v1/Table/useV1BorrowingsTableData' +import { BN_ZERO } from 'constants/math' +import useBorrowEnabledAssets from 'hooks/assets/useBorrowEnabledAssets' + +export default function Borrowings() { + const { debtAssets } = useV1BorrowingsTableData() + + if (!debtAssets?.length) { + return + } + + return ( + <> + + + ) +} + +function Fallback() { + const assets = useBorrowEnabledAssets() + const data: BorrowMarketTableData[] = assets.map((asset) => ({ + asset, + apy: { + borrow: 0, + deposit: 0, + }, + ltv: { + max: 0, + liq: 0, + }, + liquidity: BN_ZERO, + marketLiquidityRate: 0, + cap: { + denom: asset.denom, + max: BN_ZERO, + used: BN_ZERO, + }, + debt: BN_ZERO, + borrowEnabled: true, + depositEnabled: true, + deposits: BN_ZERO, + accountDebt: BN_ZERO, + })) + + return +} diff --git a/src/components/v1/Deposits.tsx b/src/components/v1/Deposits.tsx new file mode 100644 index 00000000..997243bc --- /dev/null +++ b/src/components/v1/Deposits.tsx @@ -0,0 +1,48 @@ +import DepositsTable from 'components/earn/lend/Table/DepositedLendsTable' +import useV1DepositsTableData from 'components/v1/Table/useV1DepositsTableData' +import { BN_ZERO } from 'constants/math' +import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets' + +export default function Deposits() { + const { depositAssets } = useV1DepositsTableData() + + if (!depositAssets?.length) { + return + } + + console.log(depositAssets) + + return ( + <> + + + ) +} + +function Fallback() { + const assets = useMarketEnabledAssets() + + const data: LendingMarketTableData[] = assets.map((asset) => ({ + asset, + borrowEnabled: true, + depositEnabled: true, + debt: BN_ZERO, + deposits: BN_ZERO, + liquidity: BN_ZERO, + cap: { + max: BN_ZERO, + used: BN_ZERO, + denom: asset.denom, + }, + apy: { + borrow: 0, + deposit: 0, + }, + ltv: { + max: 0, + liq: 0, + }, + })) + + return +} diff --git a/src/components/v1/Table/useV1BorrowingsTableData.ts b/src/components/v1/Table/useV1BorrowingsTableData.ts new file mode 100644 index 00000000..01059116 --- /dev/null +++ b/src/components/v1/Table/useV1BorrowingsTableData.ts @@ -0,0 +1,38 @@ +import { useMemo } from 'react' + +import { BN_ZERO } from 'constants/math' +import useMarkets from 'hooks/markets/useMarkets' +import useDisplayCurrencyPrice from 'hooks/useDisplayCurrencyPrice' +import useV1Positions from 'hooks/v1/useV1Positions' +import useStore from 'store' + +export default function useV1BorrowingsTableData() { + const address = useStore((s) => s.address) + const markets = useMarkets() + const { data: v1Positions } = useV1Positions(address) + const userDebts = v1Positions?.debts ?? [] + const { convertAmount } = useDisplayCurrencyPrice() + + return useMemo((): { + debtAssets: BorrowMarketTableData[] + } => { + const debtAssets: BorrowMarketTableData[] = [] + + markets + .filter((market) => market.borrowEnabled) + .forEach((market) => { + const amount = + userDebts.find((debt) => debt.denom === market.asset.denom)?.amount ?? BN_ZERO + const value = amount ? convertAmount(market.asset, amount) : undefined + + const borrowMarketAsset: BorrowMarketTableData = { + ...market, + accountDebtAmount: amount, + accountDebtValue: value, + } + debtAssets.push(borrowMarketAsset) + }) + + return { debtAssets } + }, [userDebts, markets, convertAmount]) +} diff --git a/src/components/v1/Table/useV1DepositsTableData.ts b/src/components/v1/Table/useV1DepositsTableData.ts new file mode 100644 index 00000000..720922b5 --- /dev/null +++ b/src/components/v1/Table/useV1DepositsTableData.ts @@ -0,0 +1,39 @@ +import { useMemo } from 'react' + +import { BN_ZERO } from 'constants/math' +import useMarkets from 'hooks/markets/useMarkets' +import useDisplayCurrencyPrice from 'hooks/useDisplayCurrencyPrice' +import useV1Positions from 'hooks/v1/useV1Positions' +import useStore from 'store' +import { byDenom } from 'utils/array' + +export default function useV1DepositsTableData(): { + depositAssets: LendingMarketTableData[] +} { + const address = useStore((s) => s.address) + const markets = useMarkets() + const { data: v1Positions } = useV1Positions(address) + const userCollateral = v1Positions?.lends ?? [] + const { convertAmount } = useDisplayCurrencyPrice() + + return useMemo(() => { + const depositAssets: LendingMarketTableData[] = [] + + markets.forEach((market) => { + const amount = userCollateral.find(byDenom(market.asset.denom))?.amount ?? BN_ZERO + const value = amount ? convertAmount(market.asset, amount) : undefined + + const lendingMarketAsset: LendingMarketTableData = { + ...market, + accountLentValue: value, + accountLentAmount: amount, + } + + depositAssets.push(lendingMarketAsset) + }) + + return { + depositAssets, + } + }, [markets, userCollateral, convertAmount]) +} diff --git a/src/components/v1/V1Intro.tsx b/src/components/v1/V1Intro.tsx new file mode 100644 index 00000000..b14e9eec --- /dev/null +++ b/src/components/v1/V1Intro.tsx @@ -0,0 +1,24 @@ +import WalletConnectButton from 'components/Wallet/WalletConnectButton' +import Intro from 'components/common/Intro' +import useStore from 'store' + +export default function V1Intro() { + const address = useStore((state) => state.address) + return ( + + Welcome to the Red Bank! +
+ This is the first version (v1) of the Red Bank. It provides simple lending and borrowing, + without the use of Credit Accounts. Funds are{' '} + not cross-collateralized and can't be used on v2 as + collateral. + + } + bg='v1' + > + {!address && } + + ) +} diff --git a/src/hooks/v1/useV1Positions.tsx b/src/hooks/v1/useV1Positions.tsx new file mode 100644 index 00000000..70510ec6 --- /dev/null +++ b/src/hooks/v1/useV1Positions.tsx @@ -0,0 +1,17 @@ +import useSWR from 'swr' + +import getV1Positions from 'api/v1/getV1Positions' +import useChainConfig from 'hooks/useChainConfig' + +export default function useV1Positions(user?: string, suspense?: boolean) { + const chainConfig = useChainConfig() + + return useSWR( + user && `chains/${chainConfig.id}/v1/${user}`, + () => getV1Positions(chainConfig, user), + { + suspense: suspense, + revalidateOnFocus: false, + }, + ) +} diff --git a/src/pages/V1Page.tsx b/src/pages/V1Page.tsx new file mode 100644 index 00000000..f20b87cf --- /dev/null +++ b/src/pages/V1Page.tsx @@ -0,0 +1,15 @@ +import MigrationBanner from 'components/common/MigrationBanner' +import Borrowings from 'components/v1/Borrowings' +import Deposits from 'components/v1/Deposits' +import V1Intro from 'components/v1/V1Intro' + +export default function V1Page() { + return ( +
+ + + + +
+ ) +} diff --git a/src/types/interfaces/market.d.ts b/src/types/interfaces/market.d.ts index f96d2b47..9858f4b0 100644 --- a/src/types/interfaces/market.d.ts +++ b/src/types/interfaces/market.d.ts @@ -17,7 +17,8 @@ interface Market { } interface BorrowMarketTableData extends Market { - accountDebt?: BigNumber + accountDebtAmount?: BigNumber + accountDebtValue?: BigNumber } interface LendingMarketTableData extends Market { diff --git a/src/types/interfaces/route.d.ts b/src/types/interfaces/route.d.ts index 59fff097..cd4f5fca 100644 --- a/src/types/interfaces/route.d.ts +++ b/src/types/interfaces/route.d.ts @@ -11,6 +11,7 @@ type Page = | 'hls-staking' | 'governance' | 'execute' + | 'v1' type OsmosisRouteResponse = { amount_in: { diff --git a/src/types/interfaces/v1.d.ts b/src/types/interfaces/v1.d.ts new file mode 100644 index 00000000..e40c3902 --- /dev/null +++ b/src/types/interfaces/v1.d.ts @@ -0,0 +1,4 @@ +interface V1Positions { + deposits: BNCoin[] + debts: BNCoin[] +}