From 60a47aa01328d511582e7a60dbe29a66ab05cc21 Mon Sep 17 00:00:00 2001 From: juan Date: Sun, 24 Jan 2021 12:13:44 -0500 Subject: [PATCH 1/7] borrow calculation on borrow page --- src/components/BorrowInput/index.tsx | 72 ++++++++++++++++++---------- 1 file changed, 47 insertions(+), 25 deletions(-) diff --git a/src/components/BorrowInput/index.tsx b/src/components/BorrowInput/index.tsx index dbdd27a..bd37c9a 100644 --- a/src/components/BorrowInput/index.tsx +++ b/src/components/BorrowInput/index.tsx @@ -1,4 +1,4 @@ -import React, { useCallback, useMemo, useState } from "react"; +import React, {useCallback, useEffect, useMemo, useState} from "react"; import { useTokenName, useUserBalance, @@ -9,19 +9,19 @@ import { LendingReserve, LendingReserveParser, } from "../../models"; -import { TokenIcon } from "../TokenIcon"; import { Card } from "antd"; import { cache, ParsedAccount } from "../../contexts/accounts"; -import { NumericInput } from "../Input/numeric"; import { useConnection } from "../../contexts/connection"; import { useWallet } from "../../contexts/wallet"; import { borrow } from "../../actions"; -import { CollateralSelector } from "./../CollateralSelector"; import "./style.less"; import { LABELS } from "../../constants"; import { ActionConfirmation } from "./../ActionConfirmation"; import { BackButton } from "./../BackButton"; import { ConnectButton } from "../ConnectButton"; +import CollateralInput from "../CollateralInput"; +import {ArrowDownOutlined} from "@ant-design/icons"; +import {useMidPriceInUSD} from "../../contexts/market"; export const BorrowInput = (props: { className?: string; @@ -30,6 +30,7 @@ export const BorrowInput = (props: { const connection = useConnection(); const { wallet } = useWallet(); const [value, setValue] = useState(""); + const [collateralValue, setCollateralValue] = useState(""); const [pendingTx, setPendingTx] = useState(false); const [showConfirmation, setShowConfirmation] = useState(false); @@ -46,6 +47,24 @@ export const BorrowInput = (props: { return cache.get(id) as ParsedAccount; }, [collateralReserveKey]); + const borrowPrice = useMidPriceInUSD(borrowReserve.info.liquidityMint.toBase58()).price; + const collateralPrice = useMidPriceInUSD(collateralReserve?.info.liquidityMint.toBase58())?.price; + + useEffect(() => { + if (collateralReserve) { + const ltv = borrowReserve.info.config.loanToValueRatio / 100; + + if (collateralValue) { + const nCollateralValue = parseFloat(collateralValue); + const borrowInUSD = nCollateralValue * collateralPrice * ltv; + const borrowAmount = borrowInUSD / borrowPrice; + setValue(borrowAmount.toString()) + } else { + setValue("") + } + } + }, [collateralReserve, collateralPrice, borrowPrice, borrowReserve, collateralValue]) + const name = useTokenName(borrowReserve?.info.liquidityMint); const { accounts: fromAccounts } = useUserBalance( collateralReserve?.info.collateralMint @@ -87,6 +106,7 @@ export const BorrowInput = (props: { ); setValue(""); + setCollateralValue(""); setShowConfirmation(true); } catch { // TODO: @@ -126,32 +146,34 @@ export const BorrowInput = (props: { justifyContent: "space-around", }} > -
{LABELS.SELECT_COLLATERAL}
- - -
{LABELS.BORROW_QUESTION}
-
- - { - setValue(val); +
+ { + setCollateralValue(val?.toString() || "") }} - style={{ - fontSize: 20, - boxShadow: "none", - borderColor: "transparent", - outline: "transparent", + onCollateralReserve={(key) => { + setCollateralReserveKey(key); }} - placeholder="0.00" /> -
{name}
+
+ +
+ { + setValue(val?.toString() || "") + }} + disabled={true} + hideBalance={true} + />
Date: Sun, 24 Jan 2021 12:30:29 -0500 Subject: [PATCH 2/7] collateral calculation from borrow input --- src/components/BorrowInput/index.tsx | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/src/components/BorrowInput/index.tsx b/src/components/BorrowInput/index.tsx index bd37c9a..fcba12b 100644 --- a/src/components/BorrowInput/index.tsx +++ b/src/components/BorrowInput/index.tsx @@ -31,6 +31,7 @@ export const BorrowInput = (props: { const { wallet } = useWallet(); const [value, setValue] = useState(""); const [collateralValue, setCollateralValue] = useState(""); + const [lastTyped, setLastTyped] = useState("collateral"); const [pendingTx, setPendingTx] = useState(false); const [showConfirmation, setShowConfirmation] = useState(false); @@ -51,7 +52,7 @@ export const BorrowInput = (props: { const collateralPrice = useMidPriceInUSD(collateralReserve?.info.liquidityMint.toBase58())?.price; useEffect(() => { - if (collateralReserve) { + if (collateralReserve && lastTyped == "collateral") { const ltv = borrowReserve.info.config.loanToValueRatio / 100; if (collateralValue) { @@ -65,6 +66,21 @@ export const BorrowInput = (props: { } }, [collateralReserve, collateralPrice, borrowPrice, borrowReserve, collateralValue]) + useEffect(() => { + if (collateralReserve && lastTyped == "borrow") { + const ltv = borrowReserve.info.config.loanToValueRatio / 100; + + if (value) { + const nValue = parseFloat(value); + const borrowInUSD = nValue * borrowPrice; + const collateralAmount = (borrowInUSD / ltv) / collateralPrice + setCollateralValue(collateralAmount.toString()) + } else { + setCollateralValue("") + } + } + }, [lastTyped, collateralReserve, collateralPrice, borrowPrice, borrowReserve, value]) + const name = useTokenName(borrowReserve?.info.liquidityMint); const { accounts: fromAccounts } = useUserBalance( collateralReserve?.info.collateralMint @@ -153,6 +169,7 @@ export const BorrowInput = (props: { amount={parseFloat(collateralValue) || 0} onInputChange={(val: number | null) => { setCollateralValue(val?.toString() || "") + setLastTyped("collateral") }} onCollateralReserve={(key) => { setCollateralReserveKey(key); @@ -167,6 +184,7 @@ export const BorrowInput = (props: { amount={parseFloat(value) || 0} onInputChange={(val: number | null) => { setValue(val?.toString() || "") + setLastTyped("borrow") }} disabled={true} hideBalance={true} From 1b14c2641b22e672d2877dad6c38bafb25d01ca0 Mon Sep 17 00:00:00 2001 From: juan Date: Sun, 24 Jan 2021 15:19:44 -0500 Subject: [PATCH 3/7] Added swap input style to repay page --- src/components/BorrowInput/index.tsx | 10 ++- src/components/RepayInput/index.tsx | 93 +++++++++++++++++++--------- src/contexts/market.tsx | 1 + src/views/repayReserve/index.tsx | 2 +- 4 files changed, 69 insertions(+), 37 deletions(-) diff --git a/src/components/BorrowInput/index.tsx b/src/components/BorrowInput/index.tsx index fcba12b..ca559ca 100644 --- a/src/components/BorrowInput/index.tsx +++ b/src/components/BorrowInput/index.tsx @@ -1,6 +1,5 @@ import React, {useCallback, useEffect, useMemo, useState} from "react"; import { - useTokenName, useUserBalance, useUserObligationByReserve, } from "../../hooks"; @@ -52,7 +51,7 @@ export const BorrowInput = (props: { const collateralPrice = useMidPriceInUSD(collateralReserve?.info.liquidityMint.toBase58())?.price; useEffect(() => { - if (collateralReserve && lastTyped == "collateral") { + if (collateralReserve && lastTyped === "collateral") { const ltv = borrowReserve.info.config.loanToValueRatio / 100; if (collateralValue) { @@ -64,10 +63,10 @@ export const BorrowInput = (props: { setValue("") } } - }, [collateralReserve, collateralPrice, borrowPrice, borrowReserve, collateralValue]) + }, [lastTyped, collateralReserve, collateralPrice, borrowPrice, borrowReserve, collateralValue]) useEffect(() => { - if (collateralReserve && lastTyped == "borrow") { + if (collateralReserve && lastTyped === "borrow") { const ltv = borrowReserve.info.config.loanToValueRatio / 100; if (value) { @@ -81,7 +80,6 @@ export const BorrowInput = (props: { } }, [lastTyped, collateralReserve, collateralPrice, borrowPrice, borrowReserve, value]) - const name = useTokenName(borrowReserve?.info.liquidityMint); const { accounts: fromAccounts } = useUserBalance( collateralReserve?.info.collateralMint ); @@ -164,7 +162,7 @@ export const BorrowInput = (props: { >
{ diff --git a/src/components/RepayInput/index.tsx b/src/components/RepayInput/index.tsx index 192679b..d116fca 100644 --- a/src/components/RepayInput/index.tsx +++ b/src/components/RepayInput/index.tsx @@ -1,38 +1,38 @@ -import React, { useCallback, useState } from "react"; +import React, {useCallback, useEffect, useState} from "react"; import { EnrichedLendingObligation, InputType, useAccountByMint, useSliderInput, - useTokenName, useUserBalance, } from "../../hooks"; import { LendingReserve } from "../../models"; -import { TokenIcon } from "../TokenIcon"; import { Card, Slider } from "antd"; import { ParsedAccount, useMint } from "../../contexts/accounts"; -import { NumericInput } from "../Input/numeric"; import { useConnection } from "../../contexts/connection"; import { useWallet } from "../../contexts/wallet"; import { repay } from "../../actions"; -import { CollateralSelector } from "./../CollateralSelector"; import "./style.less"; import { LABELS, marks } from "../../constants"; import { ActionConfirmation } from "./../ActionConfirmation"; import { fromLamports, wadToLamports } from "../../utils/utils"; import { notify } from "../../utils/notifications"; import { ConnectButton } from "../ConnectButton"; +import CollateralInput from "../CollateralInput"; +import {useMidPriceInUSD} from "../../contexts/market"; export const RepayInput = (props: { className?: string; borrowReserve: ParsedAccount; - collateralReserve?: ParsedAccount; + collateralReserve: ParsedAccount; obligation: EnrichedLendingObligation; }) => { const connection = useConnection(); const { wallet } = useWallet(); + const [lastTyped, setLastTyped] = useState("repay"); const [pendingTx, setPendingTx] = useState(false); const [showConfirmation, setShowConfirmation] = useState(false); + const [collateralValue, setCollateralValue] = useState(""); const repayReserve = props.borrowReserve; const obligation = props.obligation; @@ -45,7 +45,6 @@ export const RepayInput = (props: { const borrowAmount = fromLamports(borrowAmountLamports, liquidityMint); const collateralReserve = props.collateralReserve; - const name = useTokenName(repayReserve?.info.liquidityMint); const { accounts: fromAccounts } = useUserBalance( repayReserve.info.liquidityMint ); @@ -54,10 +53,11 @@ export const RepayInput = (props: { const convert = useCallback( (val: string | number) => { + setLastTyped("repay") if (typeof val === "string") { return (parseFloat(val) / borrowAmount) * 100; } else { - return ((val * borrowAmount) / 100).toFixed(2); + return ((val * borrowAmount) / 100); } }, [borrowAmount] @@ -85,7 +85,6 @@ export const RepayInput = (props: { : Math.ceil( borrowAmountLamports * (parseFloat(value) / borrowAmount) ); - await repay( fromAccounts[0], toRepayLamports, @@ -98,6 +97,7 @@ export const RepayInput = (props: { ); setValue(""); + setCollateralValue("") setShowConfirmation(true); } catch (error) { notify({ @@ -125,6 +125,36 @@ export const RepayInput = (props: { setValue, ]); + const collateralPrice = useMidPriceInUSD(collateralReserve?.info.liquidityMint.toBase58())?.price; + + useEffect(() => { + if (collateralReserve && lastTyped === "repay") { + const collateralInQuote = obligation.info.collateralInQuote; + const collateral = collateralInQuote * collateralPrice + if (value) { + const borrowRatio = (parseFloat(value) / borrowAmount) * 100 + const collateralAmount = (borrowRatio * collateral) / 100 + setCollateralValue(collateralAmount.toString()) + } else { + setCollateralValue("") + } + } + }, [lastTyped, collateralReserve, obligation.info.collateralInQuote, collateralPrice, borrowAmount, value]) + + useEffect(() => { + if (collateralReserve && lastTyped === "collateral") { + const collateralInQuote = obligation.info.collateralInQuote; + const collateral = collateralInQuote * collateralPrice + if (collateralValue) { + const collateralRatio = (parseFloat(collateralValue) / collateral) * 100 + const borrowValue = (collateralRatio * borrowAmount) / 100 + setValue(borrowValue.toString()) + } else { + setValue("") + } + } + }, [lastTyped, collateralReserve, obligation.info.collateralInQuote, collateralPrice, borrowAmount, collateralValue]) + const bodyStyle: React.CSSProperties = { display: "flex", flex: 1, @@ -145,33 +175,36 @@ export const RepayInput = (props: { justifyContent: "space-around", }} > -
{LABELS.REPAY_QUESTION}
-
- - + { + setValue(val?.toString() || "") + setLastTyped("repay") }} - placeholder="0.00" + disabled={true} + hideBalance={true} /> -
{name}
-
{LABELS.COLLATERAL}
- - +
+ { + setCollateralValue(val?.toString() || "") + setLastTyped("collateral") + }} + disabled={true} + hideBalance={true} + /> +
{ }; // Do not add pools here, causes a really bad infinite rendering loop. Use poolKeys instead. }, [ + pools, tokenMap, dailyVolume, poolKeys, diff --git a/src/views/repayReserve/index.tsx b/src/views/repayReserve/index.tsx index ca2d003..8a07493 100644 --- a/src/views/repayReserve/index.tsx +++ b/src/views/repayReserve/index.tsx @@ -37,7 +37,7 @@ export const RepayReserveView = () => { const reserve = lendingReserve?.info; - if (!reserve || !lendingReserve || !lendingObligation) { + if (!reserve || !lendingReserve || !lendingObligation || !repayReserve) { return null; } From c295b8e4bfd367d32592a58e696df10b3527107d Mon Sep 17 00:00:00 2001 From: juan Date: Sun, 24 Jan 2021 15:21:29 -0500 Subject: [PATCH 4/7] lint --- src/components/BorrowInput/index.tsx | 79 +++++++++++++++++--------- src/components/RepayInput/index.tsx | 83 +++++++++++++++++++--------- 2 files changed, 111 insertions(+), 51 deletions(-) diff --git a/src/components/BorrowInput/index.tsx b/src/components/BorrowInput/index.tsx index ca559ca..83dceba 100644 --- a/src/components/BorrowInput/index.tsx +++ b/src/components/BorrowInput/index.tsx @@ -1,8 +1,5 @@ -import React, {useCallback, useEffect, useMemo, useState} from "react"; -import { - useUserBalance, - useUserObligationByReserve, -} from "../../hooks"; +import React, { useCallback, useEffect, useMemo, useState } from "react"; +import { useUserBalance, useUserObligationByReserve } from "../../hooks"; import { BorrowAmountType, LendingReserve, @@ -19,8 +16,8 @@ import { ActionConfirmation } from "./../ActionConfirmation"; import { BackButton } from "./../BackButton"; import { ConnectButton } from "../ConnectButton"; import CollateralInput from "../CollateralInput"; -import {ArrowDownOutlined} from "@ant-design/icons"; -import {useMidPriceInUSD} from "../../contexts/market"; +import { ArrowDownOutlined } from "@ant-design/icons"; +import { useMidPriceInUSD } from "../../contexts/market"; export const BorrowInput = (props: { className?: string; @@ -47,8 +44,12 @@ export const BorrowInput = (props: { return cache.get(id) as ParsedAccount; }, [collateralReserveKey]); - const borrowPrice = useMidPriceInUSD(borrowReserve.info.liquidityMint.toBase58()).price; - const collateralPrice = useMidPriceInUSD(collateralReserve?.info.liquidityMint.toBase58())?.price; + const borrowPrice = useMidPriceInUSD( + borrowReserve.info.liquidityMint.toBase58() + ).price; + const collateralPrice = useMidPriceInUSD( + collateralReserve?.info.liquidityMint.toBase58() + )?.price; useEffect(() => { if (collateralReserve && lastTyped === "collateral") { @@ -58,12 +59,19 @@ export const BorrowInput = (props: { const nCollateralValue = parseFloat(collateralValue); const borrowInUSD = nCollateralValue * collateralPrice * ltv; const borrowAmount = borrowInUSD / borrowPrice; - setValue(borrowAmount.toString()) + setValue(borrowAmount.toString()); } else { - setValue("") + setValue(""); } } - }, [lastTyped, collateralReserve, collateralPrice, borrowPrice, borrowReserve, collateralValue]) + }, [ + lastTyped, + collateralReserve, + collateralPrice, + borrowPrice, + borrowReserve, + collateralValue, + ]); useEffect(() => { if (collateralReserve && lastTyped === "borrow") { @@ -72,13 +80,20 @@ export const BorrowInput = (props: { if (value) { const nValue = parseFloat(value); const borrowInUSD = nValue * borrowPrice; - const collateralAmount = (borrowInUSD / ltv) / collateralPrice - setCollateralValue(collateralAmount.toString()) + const collateralAmount = borrowInUSD / ltv / collateralPrice; + setCollateralValue(collateralAmount.toString()); } else { - setCollateralValue("") + setCollateralValue(""); } } - }, [lastTyped, collateralReserve, collateralPrice, borrowPrice, borrowReserve, value]) + }, [ + lastTyped, + collateralReserve, + collateralPrice, + borrowPrice, + borrowReserve, + value, + ]); const { accounts: fromAccounts } = useUserBalance( collateralReserve?.info.collateralMint @@ -160,14 +175,21 @@ export const BorrowInput = (props: { justifyContent: "space-around", }} > -
+
{ - setCollateralValue(val?.toString() || "") - setLastTyped("collateral") + setCollateralValue(val?.toString() || ""); + setLastTyped("collateral"); }} onCollateralReserve={(key) => { setCollateralReserveKey(key); @@ -175,21 +197,28 @@ export const BorrowInput = (props: { />
-
+
{ - setValue(val?.toString() || "") - setLastTyped("borrow") + setValue(val?.toString() || ""); + setLastTyped("borrow"); }} disabled={true} hideBalance={true} />
{ - setLastTyped("repay") + setLastTyped("repay"); if (typeof val === "string") { return (parseFloat(val) / borrowAmount) * 100; } else { - return ((val * borrowAmount) / 100); + return (val * borrowAmount) / 100; } }, [borrowAmount] @@ -97,7 +97,7 @@ export const RepayInput = (props: { ); setValue(""); - setCollateralValue("") + setCollateralValue(""); setShowConfirmation(true); } catch (error) { notify({ @@ -125,35 +125,52 @@ export const RepayInput = (props: { setValue, ]); - const collateralPrice = useMidPriceInUSD(collateralReserve?.info.liquidityMint.toBase58())?.price; + const collateralPrice = useMidPriceInUSD( + collateralReserve?.info.liquidityMint.toBase58() + )?.price; useEffect(() => { if (collateralReserve && lastTyped === "repay") { const collateralInQuote = obligation.info.collateralInQuote; - const collateral = collateralInQuote * collateralPrice + const collateral = collateralInQuote * collateralPrice; if (value) { - const borrowRatio = (parseFloat(value) / borrowAmount) * 100 - const collateralAmount = (borrowRatio * collateral) / 100 - setCollateralValue(collateralAmount.toString()) + const borrowRatio = (parseFloat(value) / borrowAmount) * 100; + const collateralAmount = (borrowRatio * collateral) / 100; + setCollateralValue(collateralAmount.toString()); } else { - setCollateralValue("") + setCollateralValue(""); } } - }, [lastTyped, collateralReserve, obligation.info.collateralInQuote, collateralPrice, borrowAmount, value]) + }, [ + lastTyped, + collateralReserve, + obligation.info.collateralInQuote, + collateralPrice, + borrowAmount, + value, + ]); useEffect(() => { if (collateralReserve && lastTyped === "collateral") { const collateralInQuote = obligation.info.collateralInQuote; - const collateral = collateralInQuote * collateralPrice + const collateral = collateralInQuote * collateralPrice; if (collateralValue) { - const collateralRatio = (parseFloat(collateralValue) / collateral) * 100 - const borrowValue = (collateralRatio * borrowAmount) / 100 - setValue(borrowValue.toString()) + const collateralRatio = + (parseFloat(collateralValue) / collateral) * 100; + const borrowValue = (collateralRatio * borrowAmount) / 100; + setValue(borrowValue.toString()); } else { - setValue("") + setValue(""); } } - }, [lastTyped, collateralReserve, obligation.info.collateralInQuote, collateralPrice, borrowAmount, collateralValue]) + }, [ + lastTyped, + collateralReserve, + obligation.info.collateralInQuote, + collateralPrice, + borrowAmount, + collateralValue, + ]); const bodyStyle: React.CSSProperties = { display: "flex", @@ -175,28 +192,42 @@ export const RepayInput = (props: { justifyContent: "space-around", }} > -
+
{ - setValue(val?.toString() || "") - setLastTyped("repay") + setValue(val?.toString() || ""); + setLastTyped("repay"); }} disabled={true} hideBalance={true} />
-
+
{ - setCollateralValue(val?.toString() || "") - setLastTyped("collateral") + setCollateralValue(val?.toString() || ""); + setLastTyped("collateral"); }} disabled={true} hideBalance={true} From 9b20d9013baff61babc0fa7c498fca6a4ebeccef Mon Sep 17 00:00:00 2001 From: juan Date: Sun, 24 Jan 2021 15:34:29 -0500 Subject: [PATCH 5/7] added swap input style to deposit --- src/components/DepositInput/index.tsx | 36 +++++++++++++++------------ 1 file changed, 20 insertions(+), 16 deletions(-) diff --git a/src/components/DepositInput/index.tsx b/src/components/DepositInput/index.tsx index 4f5d6b2..a3dc057 100644 --- a/src/components/DepositInput/index.tsx +++ b/src/components/DepositInput/index.tsx @@ -17,6 +17,7 @@ import "./style.less"; import { ActionConfirmation } from "./../ActionConfirmation"; import { LABELS, marks } from "../../constants"; import { ConnectButton } from "../ConnectButton"; +import CollateralInput from "../CollateralInput"; export const DepositInput = (props: { className?: string; @@ -31,17 +32,16 @@ export const DepositInput = (props: { const reserve = props.reserve; const address = props.address; - const name = useTokenName(reserve?.liquidityMint); const { accounts: fromAccounts, balance, balanceLamports } = useUserBalance( reserve?.liquidityMint ); - + console.log(balance) const convert = useCallback( (val: string | number) => { if (typeof val === "string") { return (parseFloat(val) / balance) * 100; } else { - return ((val * balance) / 100).toFixed(2); + return (val * balance) / 100; } }, [balance] @@ -108,26 +108,30 @@ export const DepositInput = (props: { }} >
{LABELS.DEPOSIT_QUESTION}
-
- - + { + setValue(val?.toString() || ""); }} - placeholder="0.00" + disabled={true} + hideBalance={true} /> -
{name}
Date: Sun, 24 Jan 2021 15:43:28 -0500 Subject: [PATCH 6/7] added swap input style to withdraw --- src/components/DepositInput/index.tsx | 11 ++------ src/components/WithdrawInput/index.tsx | 36 +++++++++++++------------- 2 files changed, 20 insertions(+), 27 deletions(-) diff --git a/src/components/DepositInput/index.tsx b/src/components/DepositInput/index.tsx index a3dc057..11da23b 100644 --- a/src/components/DepositInput/index.tsx +++ b/src/components/DepositInput/index.tsx @@ -1,14 +1,7 @@ import React, { useCallback, useState } from "react"; -import { - InputType, - useSliderInput, - useTokenName, - useUserBalance, -} from "../../hooks"; +import { InputType, useSliderInput, useUserBalance } from "../../hooks"; import { LendingReserve } from "../../models/lending"; -import { TokenIcon } from "../TokenIcon"; import { Card, Slider } from "antd"; -import { NumericInput } from "../Input/numeric"; import { useConnection } from "../../contexts/connection"; import { useWallet } from "../../contexts/wallet"; import { deposit } from "../../actions/deposit"; @@ -35,7 +28,7 @@ export const DepositInput = (props: { const { accounts: fromAccounts, balance, balanceLamports } = useUserBalance( reserve?.liquidityMint ); - console.log(balance) + const convert = useCallback( (val: string | number) => { if (typeof val === "string") { diff --git a/src/components/WithdrawInput/index.tsx b/src/components/WithdrawInput/index.tsx index 60b46ce..f00ee57 100644 --- a/src/components/WithdrawInput/index.tsx +++ b/src/components/WithdrawInput/index.tsx @@ -3,13 +3,10 @@ import { InputType, useUserCollateralBalance, useSliderInput, - useTokenName, useUserBalance, } from "../../hooks"; import { LendingReserve } from "../../models/lending"; -import { TokenIcon } from "../TokenIcon"; import { Card, Slider } from "antd"; -import { NumericInput } from "../Input/numeric"; import { useConnection } from "../../contexts/connection"; import { useWallet } from "../../contexts/wallet"; import { withdraw } from "../../actions"; @@ -18,6 +15,7 @@ import "./style.less"; import { LABELS, marks } from "../../constants"; import { ActionConfirmation } from "./../ActionConfirmation"; import { ConnectButton } from "../ConnectButton"; +import CollateralInput from "../CollateralInput"; export const WithdrawInput = (props: { className?: string; @@ -32,7 +30,6 @@ export const WithdrawInput = (props: { const reserve = props.reserve; const address = props.address; - const name = useTokenName(reserve?.liquidityMint); const { balanceLamports: collateralBalanceLamports, accounts: fromAccounts, @@ -46,7 +43,7 @@ export const WithdrawInput = (props: { if (typeof val === "string") { return (parseFloat(val) / collateralBalanceInLiquidity) * 100; } else { - return ((val * collateralBalanceInLiquidity) / 100).toFixed(2); + return (val * collateralBalanceInLiquidity) / 100; } }, [collateralBalanceInLiquidity] @@ -120,21 +117,24 @@ export const WithdrawInput = (props: { }} >
{LABELS.WITHDRAW_QUESTION}
-
- - + { + setValue(val?.toString() || ""); }} - placeholder="0.00" + disabled={true} + hideBalance={true} /> -
{name}
From c36a3f4a447fe4c75242804c449a8f3afaf06eef Mon Sep 17 00:00:00 2001 From: juan Date: Sun, 24 Jan 2021 15:49:22 -0500 Subject: [PATCH 7/7] button size changed --- src/components/WithdrawInput/index.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/WithdrawInput/index.tsx b/src/components/WithdrawInput/index.tsx index f00ee57..3b902db 100644 --- a/src/components/WithdrawInput/index.tsx +++ b/src/components/WithdrawInput/index.tsx @@ -140,6 +140,7 @@ export const WithdrawInput = (props: {