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.

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

Warnings not showing properly. #130

Merged
merged 1 commit into from
Jan 3, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
2 changes: 1 addition & 1 deletion liquidity/components/ContractError/ContractError.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ export function ContractError({ contractError }: { contractError: ContractErrorT
details...
</Button>
) : null}
<Collapse in={isOpen} animateOpacity>
<Collapse in={isOpen} animateOpacity unmountOnExit>
<Text fontStyle="italic" fontSize="0.8em">
{contractError.name}
</Text>
Expand Down
6 changes: 4 additions & 2 deletions liquidity/ui/src/components/Claim/Claim.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -105,7 +105,7 @@ export function Claim() {
</Flex>
</Flex>
</BorderBox>
<Collapse in={debtChange.lte(0) && maxClaimble.gt(0)} animateOpacity>
<Collapse in={debtChange.lte(0) && maxClaimble.gt(0)} animateOpacity unmountOnExit>
<Alert colorScheme="green" mb="6" borderRadius="6px">
<AlertIcon />
<Text>
Expand All @@ -127,7 +127,7 @@ export function Claim() {
</Text>
</Alert>
</Collapse>
<Collapse in={debtChange.gt(0)} animateOpacity>
<Collapse in={debtChange.gt(0)} animateOpacity unmountOnExit>
<Alert status="warning" mb="6" borderRadius="6px">
<AlertIcon />
<Text>
Expand All @@ -139,6 +139,7 @@ export function Claim() {
<Collapse
in={debtChange.lte(0) && network?.preset !== 'andromeda' && maxBorrowingCapacity.gt(0)}
animateOpacity
unmountOnExit
>
<Alert colorScheme="blue" mb="6" borderRadius="6px">
<AlertIcon />
Expand Down Expand Up @@ -168,6 +169,7 @@ export function Claim() {
network?.preset !== 'andromeda'
}
animateOpacity
unmountOnExit
>
<Alert colorScheme="info" mb="6" borderRadius="6px">
<AlertIcon />
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -177,6 +177,7 @@ function ClosePositionUi({ onSubmit, onClose }: { onClose: () => void; onSubmit:
.gte(liquidityPosition.debt)
}
animateOpacity
unmountOnExit
>
<Alert mb={6} status="error" borderRadius="6px">
<AlertIcon />
Expand Down
8 changes: 5 additions & 3 deletions liquidity/ui/src/components/Deposit/Deposit.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -255,11 +255,11 @@ export function Deposit() {
<CollateralAlert mb="6" tokenBalance={transferrableSnx.collateral} />
) : null}

<Collapse in={collateralChange.gt(0) && !overAvailableBalance} animateOpacity>
<Collapse in={collateralChange.gt(0) && !overAvailableBalance} animateOpacity unmountOnExit>
<WithdrawIncrease />
</Collapse>

<Collapse in={isStataUSDC} animateOpacity>
<Collapse in={isStataUSDC} animateOpacity unmountOnExit>
<Alert mb={6} status="info" borderRadius="6px">
<AlertIcon />
<AlertDescription>
Expand All @@ -277,6 +277,7 @@ export function Deposit() {
.lt(collateralType.minDelegationD18)
}
animateOpacity
unmountOnExit
>
<Alert mb={6} status="error" borderRadius="6px">
<AlertIcon />
Expand All @@ -289,7 +290,7 @@ export function Deposit() {
</Collapse>
) : null}

<Collapse in={overAvailableBalance} animateOpacity>
<Collapse in={overAvailableBalance} animateOpacity unmountOnExit>
<Alert mb={6} status="error" borderRadius="6px">
<AlertIcon />
<AlertDescription>
Expand All @@ -308,6 +309,7 @@ export function Deposit() {
.gte(collateralType.minDelegationD18)
}
animateOpacity
unmountOnExit
>
<TransactionSummary
mb={6}
Expand Down
6 changes: 4 additions & 2 deletions liquidity/ui/src/components/InitialDeposit/InitialDeposit.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -238,10 +238,11 @@ export function InitialDeposit({
collateralChange.gte(collateralType.minDelegationD18)
}
animateOpacity
unmountOnExit
>
<WithdrawIncrease />
</Collapse>
<Collapse in={isStataUSDC} animateOpacity>
<Collapse in={isStataUSDC} animateOpacity unmountOnExit>
<Alert mb={6} status="info" borderRadius="6px">
<AlertIcon />
<AlertDescription>
Expand All @@ -256,6 +257,7 @@ export function InitialDeposit({
!overAvailableBalance
}
animateOpacity
unmountOnExit
>
<Alert mb={6} status="error" borderRadius="6px">
<AlertIcon />
Expand All @@ -268,7 +270,7 @@ export function InitialDeposit({
</AlertDescription>
</Alert>
</Collapse>
<Collapse in={overAvailableBalance} animateOpacity>
<Collapse in={overAvailableBalance} animateOpacity unmountOnExit>
<Alert mb={6} status="error" borderRadius="6px">
<AlertIcon />
<AlertDescription>
Expand Down
2 changes: 1 addition & 1 deletion liquidity/ui/src/components/MigrateUSD/StepIntro.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -131,7 +131,7 @@ export const StepIntro = ({
</Flex>
</BorderBox>

<Collapse in={v2_balance?.lt(amount)} animateOpacity>
<Collapse in={v2_balance?.lt(amount)} animateOpacity unmountOnExit>
<Alert borderRadius="6px" status="error">
<AlertIcon />
<AlertDescription>You cannot convert more than your v2 sUSD balance</AlertDescription>
Expand Down
2 changes: 1 addition & 1 deletion liquidity/ui/src/components/Migration/StepSummary.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -220,7 +220,7 @@ export const StepSummary = ({
</Box>

{data && snxCollateral ? (
<Collapse in={data.balance.lt(snxCollateral.minDelegationD18)} animateOpacity>
<Collapse in={data.balance.lt(snxCollateral.minDelegationD18)} animateOpacity unmountOnExit>
<Alert mb={3.5} status="error" borderRadius="6px">
<AlertIcon />
<AlertDescription fontSize="16px">
Expand Down
15 changes: 10 additions & 5 deletions liquidity/ui/src/components/Undelegate/Undelegate.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -166,7 +166,7 @@ export function Undelegate() {
</Flex>
</BorderBox>

<Collapse in={isInputDisabled} animateOpacity>
<Collapse in={isInputDisabled} animateOpacity unmountOnExit>
<Alert mb={6} status="warning" borderRadius="6px">
<AlertIcon />
<Flex direction="column">
Expand All @@ -180,7 +180,7 @@ export function Undelegate() {
</Collapse>

{collateralType ? (
<Collapse in={!isValidLeftover && !collateralChange.eq(0)} animateOpacity>
<Collapse in={!isValidLeftover && !collateralChange.eq(0)} animateOpacity unmountOnExit>
<Alert mb={6} status="info" borderRadius="6px">
<AlertIcon />
<Flex direction="column">
Expand All @@ -199,7 +199,11 @@ export function Undelegate() {
</Collapse>
) : null}

<Collapse in={collateralChange.abs().gt(0) && isValidLeftover && isRunning} animateOpacity>
<Collapse
in={collateralChange.abs().gt(0) && isValidLeftover && isRunning}
animateOpacity
unmountOnExit
>
<Alert status="warning" mb="6">
<AlertIcon />
<Text>
Expand All @@ -215,6 +219,7 @@ export function Undelegate() {
collateralChange.abs().gt(0) && isValidLeftover && !isRunning && maxWithdrawable?.gt(0)
}
animateOpacity
unmountOnExit
>
<Alert status="info" mb="6" borderRadius="6px">
<AlertIcon />
Expand Down Expand Up @@ -252,7 +257,7 @@ export function Undelegate() {
) : null}

{network?.preset === 'andromeda' && liquidityPosition ? (
<Collapse in={liquidityPosition.debt.gt(0)} animateOpacity>
<Collapse in={liquidityPosition.debt.gt(0)} animateOpacity unmountOnExit>
<Alert status="error" mb="6" borderRadius="6px">
<AlertIcon />
<Text>
Expand Down Expand Up @@ -288,7 +293,7 @@ export function Undelegate() {
) : null}

{liquidityPosition ? (
<Collapse in={collateralChange.abs().gt(0)} animateOpacity>
<Collapse in={collateralChange.abs().gt(0)} animateOpacity unmountOnExit>
<TransactionSummary
mb={6}
items={[
Expand Down
18 changes: 15 additions & 3 deletions liquidity/ui/src/components/Withdraw/Withdraw.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -113,7 +113,11 @@ export function Withdraw({ isDebtWithdrawal = false }: { isDebtWithdrawal?: bool
</Flex>
</BorderBox>

<Collapse in={maxWithdrawable && maxWithdrawable.gt(0) && isRunning} animateOpacity>
<Collapse
in={maxWithdrawable && maxWithdrawable.gt(0) && isRunning}
animateOpacity
unmountOnExit
>
<Alert status="warning" mb="6" borderRadius="6px">
<AlertIcon />
<Text>
Expand All @@ -123,14 +127,22 @@ export function Withdraw({ isDebtWithdrawal = false }: { isDebtWithdrawal?: bool
</Alert>
</Collapse>

<Collapse in={maxWithdrawable && maxWithdrawable.gt(0) && !isRunning} animateOpacity>
<Collapse
in={maxWithdrawable && maxWithdrawable.gt(0) && !isRunning}
animateOpacity
unmountOnExit
>
<Alert status="success" mb="6" borderRadius="6px">
<AlertIcon />
<Amount prefix="You can now withdraw " value={maxWithdrawable} suffix={` ${symbol}`} />
</Alert>
</Collapse>

<Collapse in={maxWithdrawable && withdrawAmount.gt(maxWithdrawable)} animateOpacity>
<Collapse
in={maxWithdrawable && withdrawAmount.gt(maxWithdrawable)}
animateOpacity
unmountOnExit
>
<Alert colorScheme="red" mb="6" borderRadius="6px">
<AlertIcon />
<Text>
Expand Down