Skip to content

Commit

Permalink
Merge pull request #54 from DyadStablecoin/bug/earn-keroseene
Browse files Browse the repository at this point in the history
earn kerosene
  • Loading branch information
shafu0x authored Aug 9, 2024
2 parents 6b659cc + ab9d37b commit 5b13fc9
Show file tree
Hide file tree
Showing 2 changed files with 46 additions and 35 deletions.
63 changes: 36 additions & 27 deletions components/earn-kerosene.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -38,25 +38,27 @@ export function EarnKeroseneContent() {
},
});

const { kerosenePrice } = useKerosenePrice();
const { kerosenePrice, error: kerosenePriceError } = useKerosenePrice();

const { totalUsd, claimableUsd } = useMemo(() => {
if (merklRewards === undefined || kerosenePrice === undefined) {
return { totalUsd: 0, claimableUsd: 0 };
if (!merklRewards || !kerosenePrice) {
return { totalUsd: "0", claimableUsd: "0" };
}

let totalUsd =
Number(formatEther(merklRewards.accumulated || 0n)) * kerosenePrice;
totalUsd = Number(totalUsd.toFixed(2));
try {
const totalUsd =
Number(formatEther(merklRewards.accumulated || 0n)) * kerosenePrice;
const claimableUsd =
Number(formatEther(merklRewards.unclaimed || 0n)) * kerosenePrice;

let claimableUsd =
Number(formatEther(merklRewards.unclaimed || 0n)) * kerosenePrice;
claimableUsd = Number(claimableUsd.toFixed(2));

return {
totalUsd: totalUsd.toLocaleString(),
claimableUsd: claimableUsd.toLocaleString(),
};
return {
totalUsd: totalUsd.toFixed(2).toLocaleString(),
claimableUsd: claimableUsd.toFixed(2).toLocaleString(),
};
} catch (e) {
console.error("Error calculating USD values", e);
return { totalUsd: "0", claimableUsd: "0" };
}
}, [merklRewards, kerosenePrice]);

const {
Expand All @@ -80,19 +82,20 @@ export function EarnKeroseneContent() {
<div>
{merklData && (
<div className="flex justify-between text-2xl p-[2rem] pl-[5rem] pr-[5rem] font-bold">
<div>{merklData.apr.toFixed(0)}% APR</div>
<div>Liquidity: ${Number(merklData.tvl.toFixed(0)).toLocaleString()}</div>
<div>{merklData.apr?.toFixed(0) || 0}% APR</div>
<div>
Liquidity: $
{Number(merklData.tvl?.toFixed(0) || 0).toLocaleString()}
</div>
</div>
)}

<div className="flex flex-col space-y-4">
<NoteCardsContainer>
<div className="text-sm font-semibold text-[#A1A1AA]">
<div className="flex w-full flex justify-between items-center">
<div className="text-2xl text-[#FAFAFA] ">Step 1</div>
<div>
Claim or buy a Note
</div>
<div className="text-2xl text-[#FAFAFA]">Step 1</div>
<div>Claim or buy a Note</div>
</div>
<div className="flex justify-between mt-[32px] w-full">
<div className="w-full flex gap-4">
Expand All @@ -104,7 +107,7 @@ export function EarnKeroseneContent() {
<NoteCardsContainer>
<div className="text-sm font-semibold text-[#A1A1AA]">
<div className="flex w-full flex justify-between items-center">
<div className="text-2xl text-[#FAFAFA] ">Step 2</div>
<div className="text-2xl text-[#FAFAFA]">Step 2</div>
<div>Deposit collateral and mint DYAD</div>
</div>
<div className="flex justify-between mt-[32px] w-full">
Expand All @@ -123,7 +126,7 @@ export function EarnKeroseneContent() {
<NoteCardsContainer>
<div className="text-sm font-semibold text-[#A1A1AA]">
<div className="flex w-full flex justify-between items-center">
<div className="text-2xl text-[#FAFAFA] ">Step 3</div>
<div className="text-2xl text-[#FAFAFA]">Step 3</div>
<div>Provide liquidity to USDC - DYAD on Uniswap v3</div>
</div>
<div className="flex justify-between mt-[32px] w-full">
Expand All @@ -144,7 +147,7 @@ export function EarnKeroseneContent() {
<NoteCardsContainer>
<div className="text-sm font-semibold text-[#A1A1AA]">
<div className="flex w-full flex justify-between items-center">
<div className="text-2xl text-[#FAFAFA] ">Step 4</div>
<div className="text-2xl text-[#FAFAFA]">Step 4</div>
<div>Claim rewards from Merkl</div>
</div>

Expand All @@ -166,7 +169,13 @@ export function EarnKeroseneContent() {
{loading ? (
<p>Loading...</p>
) : error ? (
<p className="col-span-3">{error}</p>
<p className="col-span-3">
{error.message || "An error occurred"}
</p>
) : kerosenePriceError ? (
<p className="col-span-3">
{kerosenePriceError.message || "Failed to load price"}
</p>
) : (
<>
<p>Your total earnings</p>
Expand All @@ -176,20 +185,20 @@ export function EarnKeroseneContent() {
).toLocaleString()}{" "}
KEROSENE
</p>
<p>{totalUsd && `$${totalUsd}`}</p>
<p>{`$${totalUsd}`}</p>
<p>Total claimable</p>
<p>
{Number(
formatEther(merklRewards?.unclaimed || 0n)
).toLocaleString()}{" "}
KEROSENE
</p>
<p>{claimableUsd && `$${claimableUsd}`}</p>
<p>{`$${claimableUsd}`}</p>
</>
)}
</div>
{merklRewards &&
claimMerklRewardsConfig != undefined &&
claimMerklRewardsConfig !== undefined &&
claimError === null && (
<div className="w-full flex gap-4">
<ButtonComponent
Expand Down
18 changes: 10 additions & 8 deletions hooks/useKerosenePrice.ts
Original file line number Diff line number Diff line change
@@ -1,15 +1,17 @@
import useSWR from "swr";

export default function useKerosenePrice() {

const { data } = useSWR("https://api.coingecko.com/api/v3/coins/kerosene/tickers", async (url) => {
const res = await fetch(url);
const result = await res.json();
return result.tickers[0]?.converted_last?.usd || 0;
});
const { data, error } = useSWR(
"https://api.coingecko.com/api/v3/coins/kerosene/tickers",
async (url) => {
const res = await fetch(url);
const result = await res.json();
return result.tickers[0]?.converted_last?.usd || 0;
}
);

return {
kerosenePrice: data || 0
kerosenePrice: data || 0,
error: error,
};
}

0 comments on commit 5b13fc9

Please sign in to comment.