Skip to content

Commit

Permalink
disable earn vault
Browse files Browse the repository at this point in the history
  • Loading branch information
@timongll
timongll committed Jan 26, 2024
1 parent ff03fb3 commit 44aae1d
Show file tree
Hide file tree
Showing 2 changed files with 166 additions and 147 deletions.
1 change: 1 addition & 0 deletions webapp/src/components/RootApp.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import YourPositionModal from "./Vault/Modal/YourPositionModal";
import PausePositionModal from "./Vault/Modal/PausePositionModal";
import ResumePositionModal from "./Vault/Modal/ResumePositionModal";
import EarnPage from "../pages/DepositPage/EarnPage";

const Root = styled.div<{ screenHeight: number }>`
background-color: ${colors.background.one};
min-height: ${(props) =>
Expand Down
312 changes: 165 additions & 147 deletions webapp/src/pages/DepositPage/EarnPage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,13 +60,20 @@ import {
} from "shared/lib/hooks/useGeofence";
import TextPreview from "shared/lib/components/TextPreview/TextPreview";
import Geoblocked from "shared/lib/components/Geoblocked/Geoblocked";
import Banner from "shared/lib/components/Banner/Banner";

const delayedFade = css<{ delay?: number }>`
opacity: 0;
animation: ${fadeIn} 1s ease-in-out forwards;
animation-delay: ${({ delay }) => `${delay || 0}s`};
`;

const AbsoluteContainer = styled.div`
position: absolute;
width: 100%;
top: 0;
`;

const { formatUnits } = ethers.utils;

const PendingOrLogoContainer = styled.div<{ delay?: number }>`
Expand Down Expand Up @@ -513,160 +520,171 @@ const EarnPage = () => {
<StyledEarnInnerRing color={colors.green} />
</FadeDiv>
</CirclesContainer>
<PageContainer offset={pageOffset}>
<AnimatePresence exitBeforeEnter>
{showVault.show ? (
<motion.div
key={"showVault"}
initial={{
opacity: 0,
}}
animate={{
opacity: 1,
}}
exit={{
opacity: 0,
}}
transition={{
duration: 0.25,
type: "keyframes",
ease: "easeInOut",
}}
>
<VaultContainer>
<PendingOrLogoContainer delay={0.1}>
{hasPendingDeposits ? (
<PendingDepositsContainer color={color}>
<div style={{ position: "relative", width: "100%" }}>
<AbsoluteContainer>
<Banner
color={color}
message={"R-EARN vault is now inactive and do not accept deposits"}
></Banner>
</AbsoluteContainer>
<PageContainer offset={pageOffset}>
<AnimatePresence exitBeforeEnter>
{showVault.show ? (
<motion.div
key={"showVault"}
initial={{
opacity: 0,
}}
animate={{
opacity: 1,
}}
exit={{
opacity: 0,
}}
transition={{
duration: 0.25,
type: "keyframes",
ease: "easeInOut",
}}
>
<VaultContainer>
<PendingOrLogoContainer delay={0.1}>
{hasPendingDeposits ? (
<PendingDepositsContainer color={color}>
<ProductAssetLogoContainer color={color}>
{logo}
</ProductAssetLogoContainer>
<TextContainer>
<p>
Your deposit will deployed in the vault in{" "}
<span style={{ color: colors.primaryText }}>
{strategyStartTime}
</span>
</p>
</TextContainer>
</PendingDepositsContainer>
) : (
<ProductAssetLogoContainer color={color}>
{logo}
</ProductAssetLogoContainer>
<TextContainer>
<p>
Your deposit will deployed in the vault in{" "}
<span style={{ color: colors.primaryText }}>
{strategyStartTime}
</span>
</p>
</TextContainer>
</PendingDepositsContainer>
) : (
<ProductAssetLogoContainer color={color}>
{logo}
</ProductAssetLogoContainer>
)}
</PendingOrLogoContainer>
<BalanceTitle delay={0.2}>Your Balance ({asset})</BalanceTitle>
<HeroText delay={0.3}>
{isLoading || !account
? "---"
: formatBigNumber(
BigNumber.from(investedInStrategy),
decimals,
decimalPlaces
)}
</HeroText>
<HeroSubtitle color={yieldColor} delay={0.4}>
{roi > 0 && "+"}
{isLoading || roi === 0 ? "0.00" : roi.toFixed(4)}%
</HeroSubtitle>
<ViewDetailsButton
role="button"
onClick={() => {
setShowDetailsModal(true);
}}
delay={0.5}
>
View Details
</ViewDetailsButton>
<ButtonContainer delay={0.6}>
{active && account ? (
<>
<StyledActionButton
className={`mt-5 py-3 mb-0 w-100`}
color={color}
onClick={() => {
setShowDepositModal(true);
}}
>
Deposit
</StyledActionButton>
<StyledActionButton
className={`py-3 mb-1 w-100`}
color={"white"}
disabled={!showInitiateWithdraw}
onClick={() => {
setShowWithdrawModal(true);
}}
>
Withdraw
</StyledActionButton>
{showCompleteWithdraw && (
<CompleteWithdrawButton
className={`py-3 mb-1 w-100`}
)}
</PendingOrLogoContainer>
<BalanceTitle delay={0.2}>
Your Balance ({asset})
</BalanceTitle>
<HeroText delay={0.3}>
{isLoading || !account
? "---"
: formatBigNumber(
BigNumber.from(investedInStrategy),
decimals,
decimalPlaces
)}
</HeroText>
<HeroSubtitle color={yieldColor} delay={0.4}>
{roi > 0 && "+"}
{isLoading || roi === 0 ? "0.00" : roi.toFixed(4)}%
</HeroSubtitle>
<ViewDetailsButton
role="button"
onClick={() => {
setShowDetailsModal(true);
}}
delay={0.5}
>
View Details
</ViewDetailsButton>
<ButtonContainer delay={0.6}>
{active && account ? (
<>
<StyledActionButton
className={`mt-5 py-3 mb-0 w-100`}
color={color}
onClick={() => {
setShowCompleteModal(true);
setShowDepositModal(true);
}}
disabled
>
<div className="d-flex flex-row justify-content-around align-items-center">
<Marker color={color} />
<SecondaryText>
Complete your withdrawals
</SecondaryText>
</div>
</CompleteWithdrawButton>
)}
</>
) : (
<StyledActionButton
className={`mt-5 py-3 w-100`}
color={color}
onClick={() => setShowConnectModal(true)}
>
Connect Wallet
</StyledActionButton>
)}
</ButtonContainer>
<EarnCapacityText delay={0.7}>
{isLoading || isVaultMaxCapacity === undefined ? (
loadingText
) : isVaultMaxCapacity ? (
<VaultFullText>Vault is currently full</VaultFullText>
) : (
formatAmount(totalDepositStr) +
" " +
asset +
" / " +
formatAmount(depositLimitStr) +
" " +
asset
)}
</EarnCapacityText>
</VaultContainer>
</motion.div>
) : (
<motion.div
key={"showIntro"}
initial={{
opacity: 0,
}}
animate={{
opacity: 1,
}}
exit={{
opacity: 0,
}}
transition={{
duration: 0.25,
type: "keyframes",
ease: "easeInOut",
}}
>
<EarnStrategyExplainer vaultOption={vaultOption} />
</motion.div>
)}
</AnimatePresence>
</PageContainer>
Deposit
</StyledActionButton>
<StyledActionButton
className={`py-3 mb-1 w-100`}
color={"white"}
disabled={!showInitiateWithdraw}
onClick={() => {
setShowWithdrawModal(true);
}}
>
Withdraw
</StyledActionButton>
{showCompleteWithdraw && (
<CompleteWithdrawButton
className={`py-3 mb-1 w-100`}
color={color}
onClick={() => {
setShowCompleteModal(true);
}}
>
<div className="d-flex flex-row justify-content-around align-items-center">
<Marker color={color} />
<SecondaryText>
Complete your withdrawals
</SecondaryText>
</div>
</CompleteWithdrawButton>
)}
</>
) : (
<StyledActionButton
className={`mt-5 py-3 w-100`}
color={color}
onClick={() => setShowConnectModal(true)}
>
Connect Wallet
</StyledActionButton>
)}
</ButtonContainer>
<EarnCapacityText delay={0.7}>
{isLoading || isVaultMaxCapacity === undefined ? (
loadingText
) : isVaultMaxCapacity ? (
<VaultFullText>Vault is currently full</VaultFullText>
) : (
formatAmount(totalDepositStr) +
" " +
asset +
" / " +
formatAmount(depositLimitStr) +
" " +
asset
)}
</EarnCapacityText>
</VaultContainer>
</motion.div>
) : (
<motion.div
key={"showIntro"}
initial={{
opacity: 0,
}}
animate={{
opacity: 1,
}}
exit={{
opacity: 0,
}}
transition={{
duration: 0.25,
type: "keyframes",
ease: "easeInOut",
}}
>
<EarnStrategyExplainer vaultOption={vaultOption} />
</motion.div>
)}
</AnimatePresence>
</PageContainer>
</div>
<EarnDetailsModal
show={showDetailsModal}
onClose={() => setShowDetailsModal(false)}
Expand Down

0 comments on commit 44aae1d

Please sign in to comment.