mirror of https://github.com/certusone/oyster.git
added swap input style to withdraw
This commit is contained in:
parent
9b20d9013b
commit
eb2a24980d
|
@ -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") {
|
||||
|
|
|
@ -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: {
|
|||
}}
|
||||
>
|
||||
<div className="withdraw-input-title">{LABELS.WITHDRAW_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} />
|
||||
|
|
Loading…
Reference in New Issue