diff --git a/src/components/RepayInput/index.tsx b/src/components/RepayInput/index.tsx index 41a04ca..e7be7bd 100644 --- a/src/components/RepayInput/index.tsx +++ b/src/components/RepayInput/index.tsx @@ -6,7 +6,7 @@ import { LendingReserveParser, } from "../../models"; import { TokenIcon } from "../TokenIcon"; -import { Button, Card, Slider, Spin } from "antd"; +import { Button, Card, Spin } from "antd"; import { cache, ParsedAccount, useMint } from "../../contexts/accounts"; import { NumericInput } from "../Input/numeric"; import { useConnection } from "../../contexts/connection"; @@ -15,15 +15,12 @@ import { repay } from "../../actions"; import { CollateralSelector } from "./../CollateralSelector"; import "./style.less"; import { - wadToLamports, formatNumber, - fromLamports, toLamports, } from "../../utils/utils"; import { LABELS } from "../../constants"; import { LoadingOutlined } from "@ant-design/icons"; import { ActionConfirmation} from './../ActionConfirmation'; -import { BackButton } from "./../BackButton"; const antIcon = ; @@ -67,9 +64,6 @@ export const RepayInput = (props: { [value, repayLiquidityMint] ); - const mark = - (wadToLamports(obligation?.info.borrowAmountWad).toNumber() / lamports) * - 100; const onRepay = useCallback(() => { if ( @@ -193,10 +187,4 @@ export const RepayInput = (props: { ); }; -const marks = { - 0: "0%", - 25: "25%", - 50: "50%", - 75: "75%", - 100: "100%", -}; + diff --git a/src/components/SideReserveOverview/index.tsx b/src/components/SideReserveOverview/index.tsx index 8d32bef..696d83e 100644 --- a/src/components/SideReserveOverview/index.tsx +++ b/src/components/SideReserveOverview/index.tsx @@ -2,7 +2,7 @@ import React from "react"; import { useTokenName } from "./../../hooks"; import { calculateBorrowAPY, calculateDepositAPY, calculateUtilizationRatio, LendingReserve } from "../../models/lending"; import { TokenIcon } from "../../components/TokenIcon"; -import { formatNumber, formatPct, fromLamports, wadToLamports } from "../../utils/utils"; +import { formatNumber, formatPct, fromLamports } from "../../utils/utils"; import { Card, Typography } from "antd"; import { ParsedAccount, useMint } from "../../contexts/accounts"; import { Link } from "react-router-dom"; diff --git a/src/routes.tsx b/src/routes.tsx index 41810da..60c3deb 100644 --- a/src/routes.tsx +++ b/src/routes.tsx @@ -32,11 +32,6 @@ export function Routes() { } /> - } - /> { - const name = useTokenName(props.reserve.liquidityMint); - const { balance: tokenBalance } = useUserBalance(props.reserve.liquidityMint); - const { balance: collateralBalance } = useCollateralBalance(props.reserve); - - return ( - - -
- - - {name} - -
- {formatNumber.format(tokenBalance)} {name} -
-
- {formatNumber.format(collateralBalance)} {name} -
-
--
-
- -
-
-
- - ); -}; diff --git a/src/views/borrowDashboard/index.tsx b/src/views/borrowDashboard/index.tsx deleted file mode 100644 index 7311db2..0000000 --- a/src/views/borrowDashboard/index.tsx +++ /dev/null @@ -1,32 +0,0 @@ -import React from "react"; -import { LABELS } from "../../constants"; -import { useUserDeposits, useUserObligations } from "./../../hooks"; -import { ObligationItem } from "./obligationItem"; -import "./style.less"; - -export const DashboardView = () => { - const { userObligations } = useUserObligations(); - const { userDeposits } = useUserDeposits(); - - return ( -
-
- {LABELS.DASHBOARD_TITLE_DEPOSITS} -
-
- {LABELS.DASHBOARD_TITLE_LOANS} - {userObligations.length > 0 && ( -
-
{LABELS.TABLE_TITLE_ASSET}
-
{LABELS.TABLE_TITLE_LOAN_BALANCE}
-
{LABELS.TABLE_TITLE_APY}
-
{LABELS.TABLE_TITLE_ACTION}
-
- )} - {userObligations.map((item) => { - return ; - })} -
-
- ); -}; diff --git a/src/views/borrowDashboard/obligationItem.tsx b/src/views/borrowDashboard/obligationItem.tsx deleted file mode 100644 index bdc8cee..0000000 --- a/src/views/borrowDashboard/obligationItem.tsx +++ /dev/null @@ -1,49 +0,0 @@ -import React from "react"; -import { useTokenName } from "../../hooks"; -import { LendingObligation, LendingReserve } from "../../models/lending"; -import { TokenIcon } from "../../components/TokenIcon"; -import { wadToLamports, formatNumber, fromLamports } from "../../utils/utils"; -import { Button, Card } from "antd"; -import { Link } from "react-router-dom"; -import { cache, ParsedAccount, useMint } from "../../contexts/accounts"; - -export const ObligationItem = (props: { - obligation: ParsedAccount; -}) => { - const { obligation } = props; - - const borrowReserve = cache.get( - obligation.info.borrowReserve - ) as ParsedAccount; - - const name = useTokenName(borrowReserve?.info.liquidityMint); - - const liquidityMint = useMint(borrowReserve.info.liquidityMint); - - const borrowAmount = fromLamports( - wadToLamports(obligation.info.borrowAmountWad), - liquidityMint - ); - - return ( - - -
- - - {name} - -
- {formatNumber.format(borrowAmount)} {name} -
-
--
-
- -
-
-
- - ); -}; diff --git a/src/views/borrowDashboard/style.less b/src/views/borrowDashboard/style.less deleted file mode 100644 index 93248e9..0000000 --- a/src/views/borrowDashboard/style.less +++ /dev/null @@ -1,50 +0,0 @@ -.dashboard-item { - display: flex; - justify-content: space-between; - align-items: center; - - & > div, span { - flex: 20%; - height: 22px; - text-align: right; - } - - & > :first-child { - flex: 80px - } -} - -.dashboard-header { - margin: 0px 30px; - - & > div { - flex: 20%; - text-align: right; - } - - & > :first-child { - text-align: left; - flex: 80px - } -} - -.dashboard-container { - display: flex; - flex-direction: row; - flex-wrap: wrap; - flex: 1; -} - -.dashboard-right { - flex: 50%; -} - -.dashboard-left { - flex: 50%; -} - -@media (max-width: 600px) { - .dashboard-right, .dashboard-left { - flex: 100%; - } -} diff --git a/src/views/dashboard/depositItem.tsx b/src/views/dashboard/depositItem.tsx index af82945..c2bcfd0 100644 --- a/src/views/dashboard/depositItem.tsx +++ b/src/views/dashboard/depositItem.tsx @@ -1,8 +1,8 @@ -import React from "react"; +import React, { useMemo } from "react"; import { useCollateralBalance, useTokenName } from "../../hooks"; -import { LendingReserve } from "../../models/lending"; +import { calculateDepositAPY, LendingReserve } from "../../models/lending"; import { TokenIcon } from "../../components/TokenIcon"; -import { formatNumber } from "../../utils/utils"; +import { formatNumber, formatPct } from "../../utils/utils"; import { Button, Card } from "antd"; import { Link } from "react-router-dom"; import { TokenAccount } from "../../models"; @@ -19,6 +19,10 @@ export const DepositItem = (props: { props.account.pubkey ); + const depositAPY = useMemo(() => calculateDepositAPY(props.reserve.info), [ + props.reserve, + ]); + return (
@@ -29,7 +33,7 @@ export const DepositItem = (props: {
{formatNumber.format(collateralBalance)} {name}
-
--
+
{formatPct.format(depositAPY)}