diff --git a/src/components/common/input/InputQuickOptions.tsx b/src/components/common/input/InputQuickOptions.tsx index 2084babc..7208196c 100644 --- a/src/components/common/input/InputQuickOptions.tsx +++ b/src/components/common/input/InputQuickOptions.tsx @@ -24,7 +24,7 @@ export const AmountQuickOptions = ({ value, setValue }: QuickOptionsProps) => { weight="normal" data-state={value === option ? "active" : "inactive"} onClick={() => setValue(option)} - className="w-16" + className="w-10 sm:w-16" > {option} diff --git a/src/components/farms/row/FarmsAccordionRow.tsx b/src/components/farms/row/FarmsAccordionRow.tsx index b8b3e7e0..ed6ed7dd 100644 --- a/src/components/farms/row/FarmsAccordionRow.tsx +++ b/src/components/farms/row/FarmsAccordionRow.tsx @@ -1,18 +1,21 @@ +import { Fragment } from "react"; + import { AccordionContent, AccordionItem, AccordionTrigger, } from "@/components/ui/accordion"; import { Button } from "@/components/ui/button"; +import { useSettings } from "@/components/providers/SettingsProvider"; import { useGetTokenPrice } from "@/lib/queries/useTokenPrice"; import { Farm } from "@/lib/types"; import { cn } from "@/utils/cn"; import { formatNumber } from "@/utils/number"; + import { ExitButton } from "./ExitButton"; import { CurveFarmContent } from "./CurveFarmContent"; import { InternalFarmContent } from "./InternalFarmContent"; import { SushiFarmContent } from "./SushiFarmContent"; -import { Fragment } from "react"; export const FarmsAccordionRow = ({ farm }: { farm: Farm }) => { const isActive = farm.isActive; @@ -135,10 +138,26 @@ const TvlCell = ({ farm }: { farm: Farm }) => { ? "0xdbdb4d16eda451d0503b854cf79d55697f90c8df" : farm.poolTokenAddress; + const { currency } = useSettings(); const { data: internalTokenPrice = 0 } = useGetTokenPrice(tokenAddress); const tvl = farm.type === "internal" ? internalTokenPrice * +farm.reserve : farm.tvl; - return
{formatNumber(tvl)}
; + return ( ++ {formatNumber(tvl, { + isCurrency: true, + // NOTE: Curve TVL Calculation doesn't account for currency selected, because uses virtual price from contract. + currency: farm.type !== "external-curve" ? currency : undefined, + })} +
+ {farm.type === "internal" && ( ++ {formatNumber(farm.reserve)} {farm.tokenSymbol} +
+ )} +{formatNumber( dayjs.duration({ years: data.timeToTransmute }).asDays(), + { allowNegative: false }, )}{" "} days