Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Release]: Spend Approval Improvements, Redirects, Tooltips #3036

Merged
merged 2 commits into from
Dec 12, 2023
Merged

[Release]: Spend Approval Improvements, Redirects, Tooltips #3036

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
b1f23c2
Spend Approval Improvements, Redirects, Tooltips (#3033)
brightiron Dec 6, 2023
57b3e47
add debt balance check and insufficient funds message if not enough f…
brightiron Dec 8, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/App.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -247,6 +247,7 @@ function App() {
<Route path="/dashboard/*" element={<TreasuryDashboard />} />
<Route path="/range/*" element={<Range />} />
<Route path="/liquidity/vaults/:id" element={<Vault />} />
<Route path="/lending" element={<Navigate to="/lending/cooler" />} />
<Route path="/lending/cooler" element={<Cooler />} />
<Route path="/utility" element={<Utility />} />

Expand Down
20 changes: 14 additions & 6 deletions src/views/Lending/Cooler/positions/CreateOrRepayLoan.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,14 +62,18 @@ export const CreateOrRepayLoan = ({
const [paymentAmount, setPaymentAmount] = useState(new DecimalBigNumber("0"));
const [collateralAmount, setCollateralAmount] = useState(new DecimalBigNumber("0"));
const { data: collateralBalance } = useBalance({ [networks.MAINNET]: collateralAddress || "" })[networks.MAINNET];
const { data: debtBalance } = useBalance({ [networks.MAINNET]: debtAddress || "" })[networks.MAINNET];

const collateralValue = Number(loanToCollateral) * Number(collateralBalance || 0);
const maxYouCanBorrow = Math.min(Number(capacity), collateralValue);

const loanPayable = new DecimalBigNumber(
loan?.principal.add(loan?.interestDue || BigNumber.from("0")) || BigNumber.from("0"),
18,
);

const maxYouCanBorrow = loan
? Math.min(Number(loanPayable), Number(debtBalance))
: Math.min(Number(capacity), collateralValue);
const interestRepaid = loan?.collateral.isZero() || false;
//if collateral minus principal is greater than interest... then calculate on collateral amount.
const daiCard = (
Expand Down Expand Up @@ -124,7 +128,7 @@ export const CreateOrRepayLoan = ({
<SwapCollection UpperSwapCard={loan ? daiCard : gOHMCard} LowerSwapCard={loan ? gOHMCard : daiCard} />
<Box display="flex" justifyContent="space-between" fontSize="12px" mt="9px" lineHeight="15px">
<Box>Max you Can {loan ? "Repay" : "Borrow"}</Box>
<Box fontWeight="500">{formatNumber(loan ? Number(loanPayable.toString()) : maxYouCanBorrow, 2)} DAI</Box>
<Box fontWeight="500">{formatNumber(maxYouCanBorrow, 2)} DAI</Box>
</Box>
<Box mt="18px" mb="21px">
<Divider />
Expand Down Expand Up @@ -197,7 +201,11 @@ export const CreateOrRepayLoan = ({
approve Olympus DAO to use your <b>{loan ? "DAI" : "gOHM"}</b> for borrowing.
</>
}
spendAmount={new DecimalBigNumber(collateralAmount.toString(), 18)}
spendAmount={
loan
? new DecimalBigNumber(paymentAmount.toString(), 18)
: new DecimalBigNumber(collateralAmount.toString(), 18)
}
>
<PrimaryButton
onClick={() => {
Expand Down Expand Up @@ -233,9 +241,7 @@ export const CreateOrRepayLoan = ({
);
}}
disabled={
(loan
? Number(paymentAmount) > Number(loanPayable)
: Number(paymentAmount.toString()) > maxYouCanBorrow) ||
Number(paymentAmount.toString()) > maxYouCanBorrow ||
Number(paymentAmount.toString()) === 0 ||
createLoan.isLoading ||
repayLoan.isLoading
Expand All @@ -246,6 +252,8 @@ export const CreateOrRepayLoan = ({
{loan
? Number(paymentAmount) > Number(loanPayable)
? `Payback Amount exceeds Loan`
: Number(paymentAmount.toString()) > Number(maxYouCanBorrow)
? `Insufficient Funds for Repayment`
: `Repay Loan`
: Number(paymentAmount.toString()) > maxYouCanBorrow
? `Amount requested exceeds capacity`
Expand Down
37 changes: 23 additions & 14 deletions src/views/Range/RangeChart.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Box, CircularProgress } from "@mui/material";
import { Box, CircularProgress, Typography } from "@mui/material";
import { styled, useTheme } from "@mui/material/styles";
import { DataRow, Paper } from "@olympusdao/component-library";
import {
Expand Down Expand Up @@ -124,34 +124,43 @@ const RangeChart = (props: {
return (
<Paper className={`ohm-card tooltip-container`} sx={{ minWidth: "250px" }}>
<DataRow title="Time" balance={timestamp}></DataRow>
<DataRow title="Price" balance={formatCurrency(price ? price : currentPrice, 2, reserveSymbol)} />
<Typography fontSize="15px" fontWeight={600} mt="33px">
Price
</Typography>
<DataRow title="Market Price" balance={formatCurrency(price ? price : currentPrice, 2, reserveSymbol)} />
{label === "now" && (
<>
<DataRow title="Target Price" balance={`${formatCurrency(targetPrice, 2, reserveSymbol)}`} />
<DataRow title="30 Day MA" balance={`${formatCurrency(movingAverage.movingAverage, 2, reserveSymbol)}`} />
<Typography fontSize="15px" fontWeight={600} mt="33px">
Lower Range
</Typography>
<DataRow
title="Upper Capacity"
balance={`${capacityFormatter.format(parseBigNumber(rangeData.high.capacity, 9))} OHM`}
title="Cushion"
balance={formatCurrency(parseBigNumber(rangeData.low.cushion.price, 18), 2, reserveSymbol)}
/>
<DataRow
title="Upper Cushion"
balance={formatCurrency(parseBigNumber(rangeData.high.cushion.price, 18), 2, reserveSymbol)}
title="Wall"
balance={formatCurrency(parseBigNumber(rangeData.low.wall.price, 18), 2, reserveSymbol)}
/>
<DataRow
title="Upper Wall"
balance={formatCurrency(parseBigNumber(rangeData.high.wall.price, 18), 2, reserveSymbol)}
title="Capacity"
balance={`${capacityFormatter.format(parseBigNumber(rangeData.low.capacity, 18))} ${reserveSymbol} `}
/>
<Typography fontSize="15px" fontWeight={600} mt="33px">
Upper Range
</Typography>
<DataRow
title="Lower Capacity"
balance={`${capacityFormatter.format(parseBigNumber(rangeData.low.capacity, 18))} ${reserveSymbol} `}
title="Cushion"
balance={formatCurrency(parseBigNumber(rangeData.high.cushion.price, 18), 2, reserveSymbol)}
/>
<DataRow
title="Lower Cushion"
balance={formatCurrency(parseBigNumber(rangeData.low.cushion.price, 18), 2, reserveSymbol)}
title="Wall"
balance={formatCurrency(parseBigNumber(rangeData.high.wall.price, 18), 2, reserveSymbol)}
/>
<DataRow
title="Lower Wall"
balance={formatCurrency(parseBigNumber(rangeData.low.wall.price, 18), 2, reserveSymbol)}
title="Capacity"
balance={`${capacityFormatter.format(parseBigNumber(rangeData.high.capacity, 9))} OHM`}
/>
</>
)}
Expand Down
Loading