added swap input style to deposit
This commit is contained in:
parent
c295b8e4bf
commit
9b20d9013b
|
@ -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: {
|
|||
}}
|
||||
>
|
||||
<div className="deposit-input-title">{LABELS.DEPOSIT_QUESTION}</div>
|
||||
<div className="token-input">
|
||||
<TokenIcon mintAddress={reserve?.liquidityMint} />
|
||||
<NumericInput
|
||||
value={value}
|
||||
onChange={setValue}
|
||||
autoFocus={true}
|
||||
<div
|
||||
style={{
|
||||
fontSize: 20,
|
||||
boxShadow: "none",
|
||||
borderColor: "transparent",
|
||||
outline: "transparent",
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-evenly",
|
||||
alignItems: "center",
|
||||
}}
|
||||
placeholder="0.00"
|
||||
>
|
||||
<CollateralInput
|
||||
title="Amount"
|
||||
reserve={reserve}
|
||||
amount={parseFloat(value) || 0}
|
||||
onInputChange={(val: number | null) => {
|
||||
setValue(val?.toString() || "");
|
||||
}}
|
||||
disabled={true}
|
||||
hideBalance={true}
|
||||
/>
|
||||
<div>{name}</div>
|
||||
</div>
|
||||
|
||||
<Slider marks={marks} value={pct} onChange={setPct} />
|
||||
|
||||
<ConnectButton
|
||||
size="large"
|
||||
type="primary"
|
||||
onClick={onDeposit}
|
||||
loading={pendingTx}
|
||||
|
|
Loading…
Reference in New Issue