diff --git a/packages/uikit/src/components/BalanceInput/types.ts b/packages/uikit/src/components/BalanceInput/types.ts index 75a811cc1d275..bc4cc6b871b2f 100644 --- a/packages/uikit/src/components/BalanceInput/types.ts +++ b/packages/uikit/src/components/BalanceInput/types.ts @@ -1,5 +1,6 @@ import { InputHTMLAttributes, ReactNode, ReactText } from "react"; import { BoxProps } from "../Box"; +import { InputProps } from "../Input"; export interface BalanceInputProps extends BoxProps { value: ReactText; @@ -7,7 +8,7 @@ export interface BalanceInputProps extends BoxProps { innerRef?: React.RefObject; currencyValue?: ReactNode; placeholder?: string; - inputProps?: Omit, "value" | "placeholder" | "onChange">; + inputProps?: Omit, "value" | "placeholder" | "onChange"> & InputProps; isWarning?: boolean; decimals?: number; unit?: string; diff --git a/packages/uikit/src/components/Button/StyledButton.tsx b/packages/uikit/src/components/Button/StyledButton.tsx index f1b2422ed0ff6..4ce55b10b2477 100644 --- a/packages/uikit/src/components/Button/StyledButton.tsx +++ b/packages/uikit/src/components/Button/StyledButton.tsx @@ -1,4 +1,4 @@ -import styled, { DefaultTheme } from "styled-components"; +import styled, { DefaultTheme, css } from "styled-components"; import { space, layout, variant } from "styled-system"; import { scaleVariants, styleVariants } from "./theme"; import { BaseButtonProps } from "./types"; @@ -44,6 +44,7 @@ const getOpacity = ({ $isLoading = false }: TransientButtonProps) => { }; const StyledButton = styled.button` + position: relative; align-items: center; border: 0; border-radius: 16px; @@ -80,6 +81,28 @@ const StyledButton = styled.button` })} ${layout} ${space} + ${({ decorator, theme }) => + decorator && + css` + &::before { + content: "${decorator.text}"; + position: absolute; + border-bottom: 20px solid ${decorator.backgroundColor ?? theme.colors.secondary}; + border-left: 34px solid transparent; + border-right: 12px solid transparent; + height: 0; + top: -1px; + right: -12px; + width: 75px; + text-align: center; + padding-right: 30px; + line-height: 20px; + font-size: 12px; + font-weight: 400; + transform: rotate(31.17deg); + color: ${decorator.color ?? "white"}; + } + `} `; export default StyledButton; diff --git a/packages/uikit/src/components/Button/index.stories.tsx b/packages/uikit/src/components/Button/index.stories.tsx index 8cfdbe7b713d7..69d26d42cd594 100644 --- a/packages/uikit/src/components/Button/index.stories.tsx +++ b/packages/uikit/src/components/Button/index.stories.tsx @@ -50,9 +50,12 @@ export const Default: React.FC = () => { - + ); diff --git a/packages/uikit/src/components/Button/types.ts b/packages/uikit/src/components/Button/types.ts index e81c229f5aa1b..964e791fed6c8 100644 --- a/packages/uikit/src/components/Button/types.ts +++ b/packages/uikit/src/components/Button/types.ts @@ -31,6 +31,12 @@ export interface BaseButtonProps extends LayoutProps, SpaceProps { disabled?: boolean; startIcon?: ReactNode; endIcon?: ReactNode; + decorator?: { + backgroundColor?: string; + color?: string; + text: string; + direction?: "left" | "right"; + }; } export type ButtonProps

= PolymorphicComponentProps; diff --git a/packages/uikit/src/components/Card/CardRibbon.tsx b/packages/uikit/src/components/Card/CardRibbon.tsx index 7d55961d6f9d5..0a0faa87952db 100644 --- a/packages/uikit/src/components/Card/CardRibbon.tsx +++ b/packages/uikit/src/components/Card/CardRibbon.tsx @@ -61,7 +61,7 @@ const CardRibbon: React.FC = ({ variantColor, text, ribbonPosit }; CardRibbon.defaultProps = { - /* eslint-disable react/default-props-match-prop-types */ + // eslint-disable-next-line react/default-props-match-prop-types ribbonPosition: "right", }; diff --git a/packages/uikit/src/components/Dropdown/Dropdown.tsx b/packages/uikit/src/components/Dropdown/Dropdown.tsx index fba22a3238dc7..ddc4d7ede31bf 100644 --- a/packages/uikit/src/components/Dropdown/Dropdown.tsx +++ b/packages/uikit/src/components/Dropdown/Dropdown.tsx @@ -54,5 +54,9 @@ const Dropdown: React.FC = ({ target, position = "bottom", childr ); }; +Dropdown.defaultProps = { + // eslint-disable-next-line react/default-props-match-prop-types + position: "bottom", +}; export default Dropdown; diff --git a/packages/uikit/src/components/FallingBunnies/FallingBunnies.tsx b/packages/uikit/src/components/FallingBunnies/FallingBunnies.tsx index 0aad89da73f6f..660ddc7015e73 100644 --- a/packages/uikit/src/components/FallingBunnies/FallingBunnies.tsx +++ b/packages/uikit/src/components/FallingBunnies/FallingBunnies.tsx @@ -72,6 +72,7 @@ const FallingBunnies: React.FC = ({ duration = 10, }) => { const bunnies = [...Array(count)].map((_, index) => ( + // eslint-disable-next-line react/no-array-index-key diff --git a/packages/uikit/src/components/Link/Link.tsx b/packages/uikit/src/components/Link/Link.tsx index fe57e647443a7..2aedeb88bb9fa 100644 --- a/packages/uikit/src/components/Link/Link.tsx +++ b/packages/uikit/src/components/Link/Link.tsx @@ -18,6 +18,7 @@ const Link: React.FC = ({ external, ...props }) => { return ; }; +/* eslint-disable react/default-props-match-prop-types */ Link.defaultProps = { color: "primary", }; diff --git a/packages/uikit/src/components/Message/Message.tsx b/packages/uikit/src/components/Message/Message.tsx index 34a8d90356715..2e26fcd79fbe1 100644 --- a/packages/uikit/src/components/Message/Message.tsx +++ b/packages/uikit/src/components/Message/Message.tsx @@ -16,7 +16,6 @@ const Icons = { }; const MessageContainer = styled.div` - display: flex; background-color: gray; padding: 16px; border-radius: 16px; @@ -28,6 +27,10 @@ const MessageContainer = styled.div` })} `; +const Flex = styled.div` + display: flex; +`; + const colors = { // these color names should be place in the theme once the palette is finalized warning: "#D67E0A", @@ -44,13 +47,17 @@ export const MessageText: React.FC = ({ children, ...props }) => { ); }; -const Message: React.FC = ({ children, variant, icon, ...props }) => { +const Message: React.FC = ({ children, variant, icon, action, actionInline, ...props }) => { const Icon = Icons[variant]; return ( - {icon ?? } - {children} + + {icon ?? } + {children} + {actionInline && action} + + {!actionInline && action} ); diff --git a/packages/uikit/src/components/Message/types.ts b/packages/uikit/src/components/Message/types.ts index 2807f8a9e7fde..2c9c36cec517b 100644 --- a/packages/uikit/src/components/Message/types.ts +++ b/packages/uikit/src/components/Message/types.ts @@ -12,4 +12,6 @@ export type Variant = typeof variants[keyof typeof variants]; export interface MessageProps extends SpaceProps { variant: Variant; icon?: React.ReactNode; + action?: React.ReactNode; + actionInline?: boolean; } diff --git a/packages/uikit/src/components/Svg/Icons/Hot.tsx b/packages/uikit/src/components/Svg/Icons/Hot.tsx new file mode 100644 index 0000000000000..3eff661cb4138 --- /dev/null +++ b/packages/uikit/src/components/Svg/Icons/Hot.tsx @@ -0,0 +1,16 @@ +import React from "react"; +import Svg from "../Svg"; +import { SvgProps } from "../types"; + +const Icon: React.FC = (props) => { + return ( + + + + ); +}; + +export default Icon; diff --git a/packages/uikit/src/components/Svg/Icons/Lock.tsx b/packages/uikit/src/components/Svg/Icons/Lock.tsx new file mode 100644 index 0000000000000..aab8fb732177e --- /dev/null +++ b/packages/uikit/src/components/Svg/Icons/Lock.tsx @@ -0,0 +1,16 @@ +import React from "react"; +import Svg from "../Svg"; +import { SvgProps } from "../types"; + +const Icon: React.FC = (props) => { + return ( + + + + ); +}; + +export default Icon; diff --git a/packages/uikit/src/components/Svg/Icons/Split.tsx b/packages/uikit/src/components/Svg/Icons/Split.tsx new file mode 100644 index 0000000000000..b37cd1859bab2 --- /dev/null +++ b/packages/uikit/src/components/Svg/Icons/Split.tsx @@ -0,0 +1,16 @@ +import React from "react"; +import Svg from "../Svg"; +import { SvgProps } from "../types"; + +const Icon: React.FC = (props) => { + return ( + + + + ); +}; + +export default Icon; diff --git a/packages/uikit/src/components/Svg/Icons/Unlock.tsx b/packages/uikit/src/components/Svg/Icons/Unlock.tsx new file mode 100644 index 0000000000000..86494b2af5b59 --- /dev/null +++ b/packages/uikit/src/components/Svg/Icons/Unlock.tsx @@ -0,0 +1,16 @@ +import React from "react"; +import Svg from "../Svg"; +import { SvgProps } from "../types"; + +const Icon: React.FC = (props) => { + return ( + + + + ); +}; + +export default Icon; diff --git a/packages/uikit/src/components/Svg/index.tsx b/packages/uikit/src/components/Svg/index.tsx index e882aaeda9e6f..5463440c7d037 100644 --- a/packages/uikit/src/components/Svg/index.tsx +++ b/packages/uikit/src/components/Svg/index.tsx @@ -1,5 +1,5 @@ -export { default as AccountIcon } from "./Icons/Account"; export { default as AccountFilledIcon } from "./Icons/AccountFilled"; +export { default as AccountIcon } from "./Icons/Account"; export { default as AddIcon } from "./Icons/Add"; export { default as ArrowBackIcon } from "./Icons/ArrowBack"; export { default as ArrowDownIcon } from "./Icons/ArrowDown"; @@ -8,12 +8,12 @@ export { default as ArrowDropUpIcon } from "./Icons/ArrowDropUp"; export { default as ArrowFirstIcon } from "./Icons/ArrowFirst"; export { default as ArrowForwardIcon } from "./Icons/ArrowForward"; export { default as ArrowLastIcon } from "./Icons/ArrowLast"; -export { default as ArrowUpIcon } from "./Icons/ArrowUp"; export { default as ArrowUpDownIcon } from "./Icons/ArrowUpDown"; +export { default as ArrowUpIcon } from "./Icons/ArrowUp"; export { default as AutoRenewIcon } from "./Icons/AutoRenew"; export { default as BackForwardIcon } from "./Icons/BackForwardIcon"; -export { default as BinanceIcon } from "./Icons/Binance"; export { default as BinanceChainIcon } from "./Icons/BinanceChain"; +export { default as BinanceIcon } from "./Icons/Binance"; export { default as BlockIcon } from "./Icons/Block"; export { default as BnbUsdtPairTokenIcon } from "./Icons/BnbUsdtPairToken"; export { default as BscScanIcon } from "./Icons/BscScan"; @@ -23,11 +23,11 @@ export { default as CalculateIcon } from "./Icons/Calculate"; export { default as CameraIcon } from "./Icons/Camera"; export { default as Cards } from "./Icons/Cards"; export { default as CardViewIcon } from "./Icons/CardView"; -export { default as ChartIcon } from "./Icons/Chart"; export { default as ChartDisableIcon } from "./Icons/ChartDisable"; -export { default as CheckmarkIcon } from "./Icons/Checkmark"; -export { default as CheckmarkCircleIcon } from "./Icons/CheckmarkCircle"; +export { default as ChartIcon } from "./Icons/Chart"; export { default as CheckmarkCircleFillIcon } from "./Icons/CheckmarkCircleFill"; +export { default as CheckmarkCircleIcon } from "./Icons/CheckmarkCircle"; +export { default as CheckmarkIcon } from "./Icons/Checkmark"; export { default as ChevronDownIcon } from "./Icons/ChevronDown"; export { default as ChevronLeftIcon } from "./Icons/ChevronLeft"; export { default as ChevronRightIcon } from "./Icons/ChevronRight"; @@ -37,34 +37,36 @@ export { default as CloseIcon } from "./Icons/Close"; export { default as CogIcon } from "./Icons/Cog"; export { default as Coin98Icon } from "./Icons/Coin98"; export { default as CoinbaseWalletIcon } from "./Icons/CoinbaseWallet"; -export { default as CommunityIcon } from "./Icons/Community"; export { default as CommunityFilledIcon } from "./Icons/CommunityFilled"; +export { default as CommunityIcon } from "./Icons/Community"; export { default as CopyIcon } from "./Icons/Copy"; export { default as CurrencyIcon } from "./Icons/Currency"; export { default as DiscordIcon } from "./Icons/Discord"; -export { default as EarnIcon } from "./Icons/Earn"; -export { default as EarnFillIcon } from "./Icons/EarnFill"; export { default as EarnFilledIcon } from "./Icons/EarnFilled"; +export { default as EarnFillIcon } from "./Icons/EarnFill"; +export { default as EarnIcon } from "./Icons/Earn"; export { default as EllipsisIcon } from "./Icons/Ellipsis"; export { default as ErrorIcon } from "./Icons/Error"; export { default as ExpandIcon } from "./Icons/Expand"; export { default as FarmIcon } from "./Icons/Farm"; export { default as GithubIcon } from "./Icons/Github"; export { default as GroupsIcon } from "./Icons/Groups"; -export { default as HamburgerIcon } from "./Icons/Hamburger"; export { default as HamburgerCloseIcon } from "./Icons/HamburgerClose"; +export { default as HamburgerIcon } from "./Icons/Hamburger"; export { default as HelpIcon } from "./Icons/Help"; export { default as HistoryIcon } from "./Icons/History"; export { default as HomeIcon } from "./Icons/Home"; +export { default as HotIcon } from "./Icons/Hot"; export { default as IfoIcon } from "./Icons/Ifo"; export { default as InfoIcon } from "./Icons/Info"; export { default as InstagramIcon } from "./Icons/Instagram"; -export { default as LanguageIcon } from "./Icons/Language"; export { default as LanguageCurrencyIcon } from "./Icons/LanguageCurrency"; +export { default as LanguageIcon } from "./Icons/Language"; export { default as LaurelLeftIcon } from "./Icons/LaurelLeft"; export { default as LaurelRightIcon } from "./Icons/LaurelRight"; export { default as LineGraphIcon } from "./Icons/LineGraph"; export { default as ListViewIcon } from "./Icons/ListView"; +export { default as LockIcon } from "./Icons/Lock"; export { default as LoginIcon } from "./Icons/Login"; export { default as LogoIcon } from "./Icons/Logo"; export { default as LogoRoundIcon } from "./Icons/LogoRound"; @@ -80,12 +82,12 @@ export { default as MediumIcon } from "./Icons/Medium"; export { default as MetamaskIcon } from "./Icons/Metamask"; export { default as MinusIcon } from "./Icons/Minus"; export { default as MoonIcon } from "./Icons/Moon"; -export { default as MoreIcon } from "./Icons/More"; export { default as MoreHorizontalIcon } from "./Icons/MoreHorizontal"; +export { default as MoreIcon } from "./Icons/More"; export { default as MoreVerticalIcon } from "./Icons/MoreVertical"; -export { default as NftIcon } from "./Icons/Nft"; -export { default as NftFillIcon } from "./Icons/NftFill"; export { default as NftFilledIcon } from "./Icons/NftFilled"; +export { default as NftFillIcon } from "./Icons/NftFill"; +export { default as NftIcon } from "./Icons/Nft"; export { default as NoProfileAvatarIcon } from "./Icons/NoProfileAvatar"; export { default as OpenNewIcon } from "./Icons/OpenNew"; export { default as PancakeRoundIcon } from "./Icons/PancakeRound"; @@ -103,8 +105,8 @@ export { default as ProposalIcon } from "./Icons/Proposal"; export { default as RedditIcon } from "./Icons/Reddit"; export { default as RefreshIcon } from "./Icons/Refresh"; export { default as RemoveIcon } from "./Icons/Remove"; -export { default as ResourcesIcon } from "./Icons/Resources"; export { default as ResourcesFilledIcon } from "./Icons/ResourcesFilled"; +export { default as ResourcesIcon } from "./Icons/Resources"; export { default as SafePalIcon } from "./Icons/SafePal"; export { default as SearchIcon } from "./Icons/Search"; export { default as SellIcon } from "./Icons/Sell"; @@ -112,11 +114,12 @@ export { default as ShareIcon } from "./Icons/Share"; export { default as ShrinkIcon } from "./Icons/Shrink"; export { default as SmallDotIcon } from "./Icons/SmallDot"; export { default as SmartContractIcon } from "./Icons/SmartContract"; +export { default as SplitIcon } from "./Icons/Split"; export { default as StarFillIcon } from "./Icons/StarFill"; export { default as StarLineIcon } from "./Icons/StarLine"; export { default as SunIcon } from "./Icons/Sun"; -export { default as SwapIcon } from "./Icons/Swap"; export { default as SwapFillIcon } from "./Icons/SwapFill"; +export { default as SwapIcon } from "./Icons/Swap"; export { default as SwapVertIcon } from "./Icons/SwapVert"; export { default as SyncAltIcon } from "./Icons/SyncAlt"; export { default as TeamBattleIcon } from "./Icons/TeamBattle"; @@ -128,15 +131,16 @@ export { default as TicketFillIcon } from "./Icons/TicketFill"; export { default as TicketRound } from "./Icons/TicketRound"; export { default as TimerIcon } from "./Icons/Timer"; export { default as TokenPocketIcon } from "./Icons/TokenPocket"; -export { default as TradeIcon } from "./Icons/Trade"; export { default as TradeFilledIcon } from "./Icons/TradeFilled"; +export { default as TradeIcon } from "./Icons/Trade"; export { default as TradingViewIcon } from "./Icons/TradingView"; -export { default as TrophyIcon } from "./Icons/Trophy"; export { default as TrophyFillIcon } from "./Icons/TrophyFill"; export { default as TrophyGoldIcon } from "./Icons/TrophyGold"; +export { default as TrophyIcon } from "./Icons/Trophy"; export { default as TrustWalletIcon } from "./Icons/TrustWallet"; export { default as TuneIcon } from "./Icons/Tune"; export { default as TwitterIcon } from "./Icons/Twitter"; +export { default as UnlockIcon } from "./Icons/Unlock"; export { default as VerifiedIcon } from "./Icons/Verified"; export { default as VisibilityOff } from "./Icons/VisibilityOff"; export { default as VisibilityOn } from "./Icons/VisibilityOn"; @@ -144,9 +148,9 @@ export { default as VolumeOffIcon } from "./Icons/VolumeOff"; export { default as VolumeUpIcon } from "./Icons/VolumeUp"; export { default as VoteIcon } from "./Icons/Vote"; export { default as WaitIcon } from "./Icons/Wait"; -export { default as WalletIcon } from "./Icons/Wallet"; export { default as WalletConnectIcon } from "./Icons/WalletConnect"; export { default as WalletFilledIcon } from "./Icons/WalletFilled"; +export { default as WalletIcon } from "./Icons/Wallet"; export { default as WarningIcon } from "./Icons/Warning"; export { default as Svg } from "./Svg"; export type { SvgProps } from "./types"; diff --git a/packages/uikit/src/components/Tag/Tag.tsx b/packages/uikit/src/components/Tag/Tag.tsx index ef99d63afb58d..ac4308d19be4f 100644 --- a/packages/uikit/src/components/Tag/Tag.tsx +++ b/packages/uikit/src/components/Tag/Tag.tsx @@ -16,6 +16,7 @@ const Tag: React.FC = ({ startIcon, endIcon, children, ...props }) => ); +/* eslint-disable react/default-props-match-prop-types */ Tag.defaultProps = { variant: "primary", scale: scales.MD, diff --git a/packages/uikit/src/components/Text/Text.tsx b/packages/uikit/src/components/Text/Text.tsx index fee916b42b319..87250985a0695 100644 --- a/packages/uikit/src/components/Text/Text.tsx +++ b/packages/uikit/src/components/Text/Text.tsx @@ -11,13 +11,8 @@ const getColor = ({ color, theme }: ThemedProps) => { return getThemeValue(`colors.${color}`, color)(theme); }; -const getFontSize = ({ fontSize, small }: TextProps) => { - return small ? "14px" : fontSize || "16px"; -}; - const Text = styled.div` color: ${getColor}; - font-size: ${getFontSize}; font-weight: ${({ bold }) => (bold ? 600 : 400)}; line-height: 1.5; ${({ textTransform }) => textTransform && `text-transform: ${textTransform};`} @@ -30,11 +25,14 @@ const Text = styled.div` ${space} ${typography} ${layout} + + ${({ small }) => small && `font-size: 14px;`} `; Text.defaultProps = { color: "text", small: false, + fontSize: "16px", ellipsis: false, }; diff --git a/packages/uikit/src/components/Text/types.ts b/packages/uikit/src/components/Text/types.ts index 34dd9403f132e..8654aeb181fb5 100644 --- a/packages/uikit/src/components/Text/types.ts +++ b/packages/uikit/src/components/Text/types.ts @@ -2,7 +2,6 @@ import { LayoutProps, SpaceProps, TypographyProps } from "styled-system"; export interface TextProps extends SpaceProps, TypographyProps, LayoutProps { color?: string; - fontSize?: string; bold?: boolean; small?: boolean; ellipsis?: boolean; diff --git a/packages/uikit/src/widgets/Modal/ModalContext.tsx b/packages/uikit/src/widgets/Modal/ModalContext.tsx index cbc7f18b46104..5af55b77a3980 100644 --- a/packages/uikit/src/widgets/Modal/ModalContext.tsx +++ b/packages/uikit/src/widgets/Modal/ModalContext.tsx @@ -1,4 +1,4 @@ -import { AnimatePresence, m, Variants, LazyMotion, domAnimation } from "framer-motion"; +import { AnimatePresence, Variants, m, LazyMotion, domAnimation } from "framer-motion"; import React, { createContext, useState, useRef } from "react"; import styled, { keyframes } from "styled-components"; import { Overlay } from "../../components/Overlay"; diff --git a/src/components/Balance.tsx b/src/components/Balance.tsx index c65604af85ba5..d663de0ffcd28 100644 --- a/src/components/Balance.tsx +++ b/src/components/Balance.tsx @@ -1,7 +1,12 @@ -import { Text, TextProps } from '@pancakeswap/uikit' +import { Text, TextProps, Skeleton } from '@pancakeswap/uikit' import { useEffect, useRef } from 'react' import CountUp from 'react-countup' import styled, { keyframes } from 'styled-components' +import isUndefinedOrNull from 'utils/isUndefinedOrNull' +import _toNumber from 'lodash/toNumber' +import _isNaN from 'lodash/isNaN' +import _replace from 'lodash/replace' +import _toString from 'lodash/toString' interface BalanceProps extends TextProps { value: number @@ -43,18 +48,34 @@ const Balance: React.FC = ({ ) } -export default Balance +export const BalanceWithLoading: React.FC & { value: string | number }> = ({ + value, + fontSize, + ...props +}) => { + if (isUndefinedOrNull(value)) { + return + } + + const trimedValue = _replace(_toString(value), /,/g, '') + + const finalValue = _isNaN(trimedValue) || _isNaN(_toNumber(trimedValue)) ? 0 : _toNumber(trimedValue) + + return +} const appear = keyframes` from { opacity:0; } - + to { opacity:1; } -` + ` export const AnimatedBalance = styled(Balance)` animation: ${appear} 0.65s ease-in-out forwards; ` + +export default Balance diff --git a/src/components/Divider/index.tsx b/src/components/Divider/index.tsx new file mode 100644 index 0000000000000..17bdfce09a2d9 --- /dev/null +++ b/src/components/Divider/index.tsx @@ -0,0 +1,8 @@ +import styled from 'styled-components' + +const Divider = styled.hr` + border: 1px solid ${({ theme }) => theme.colors.cardBorder}; + width: 100%; +` + +export default Divider diff --git a/src/components/RoiCalculatorModal/RoiCalculatorFooter.tsx b/src/components/RoiCalculatorModal/RoiCalculatorFooter.tsx index 24a949ad96b21..5cc1a861b519b 100644 --- a/src/components/RoiCalculatorModal/RoiCalculatorFooter.tsx +++ b/src/components/RoiCalculatorModal/RoiCalculatorFooter.tsx @@ -29,7 +29,8 @@ const BulletList = styled.ul` interface RoiCalculatorFooterProps { isFarm: boolean - apr: number + apr?: number + apy?: number displayApr: string autoCompoundFrequency: number multiplier: string @@ -41,6 +42,7 @@ interface RoiCalculatorFooterProps { const RoiCalculatorFooter: React.FC = ({ isFarm, apr, + apy, displayApr, autoCompoundFrequency, multiplier, @@ -70,7 +72,6 @@ const RoiCalculatorFooter: React.FC = ({ ) const gridRowCount = isFarm ? 4 : 2 - const apy = (getApy(apr, autoCompoundFrequency > 0 ? autoCompoundFrequency : 1, 365, performanceFee) * 100).toFixed(2) return (