Anvil

.env

@@ -0,0 +1,3 @@
+NEXT_PUBLIC_ALCHEMY_API_KEY=K6mtTYHuGxIcaIPnfj71QjrGAXtHfUIj
+NEXT_PUBLIC_SUBGRAPH_URL=https://api.thegraph.com/subgraphs/name/dyadstablecoin/dnft
+NEXT_PUBLIC_WALLETCONNECT_ID=7d57012cde8b449998792e223c4daebf

README.md

@@ -1,5 +1,14 @@
 This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
 
+## INSTALL
+
+```bash
+$ yarn install
+$ yarn global add @wagmi/cli@canary
+$ wagmi generate
+$ yarn dev
+```
+
 ## Getting Started
 
 First, run the development server:

app/page.tsx

@@ -3,18 +3,21 @@
 import ButtonComponent from "@/components/reusable/ButtonComponent";
 import KeroseneCard from "@/components/KeroseneCard/KeroseneCard";
 import NoteCard from "@/components/NoteCard/NoteCard";
+import { EarnKeroseneContent } from "@/components/earn-kerosene";
 
 import SortbyComponent from "@/components/reusable/SortbyComponent";
 import { SORT_BY_OPTIONS } from "@/mockData/tabsMockData";
 import { useState } from "react";
 import { ClaimModalContent } from "@/components/claim-modal-content";
 import { useQuery } from "@tanstack/react-query";
 import { alchemySdk } from "@/lib/alchemy";
-import { useAccount } from "wagmi";
+import { useAccount, useContractRead } from "wagmi";
 import { dNftAddress } from "@/generated";
 import { defaultChain } from "@/lib/config";
 import { SnapshotClaim } from "@/components/NoteCard/Children/SnapshotClaim";
 import dynamic from "next/dynamic";
+import DnftAbi from "@/abis/DNft.json";
+import useIDsByOwner from "@/hooks/useIDsByOwner";
 
 const TabsComponent = dynamic(
   () => import("@/components/reusable/TabsComponent"),
@@ -34,6 +37,16 @@ export default function Home() {
         .then((res) => res.ownedNfts.map((nft) => nft.tokenId)),
   });
 
+  const { data: balance } = useContractRead({
+    address: dNftAddress[defaultChain.id],
+    functionName: "balanceOf",
+    abi: DnftAbi,
+    args: [address],
+  });
+
+  const { tokens } = useIDsByOwner(address, balance);
+  console.log("balance", tokens);
+
   const keroseneCardsData = [
     {
       currency: "ETH - DYAD (Uniswap)",
@@ -61,8 +74,13 @@ export default function Home() {
         </div> */}
       </div>
       <div className="flex flex-col gap-4">
-        {notes &&
-          notes.map((tokenId) => <NoteCard key={tokenId} tokenId={tokenId} />)}
+        {tokens &&
+          tokens.map((token) => (
+            <NoteCard
+              key={parseInt(token.result)}
+              tokenId={parseInt(token.result)}
+            />
+          ))}
       </div>
     </>
   );
@@ -94,7 +112,7 @@ export default function Home() {
     {
       label: "Earn Kerosene",
       tabKey: "earn-kerosene",
-      content: <p>Coming Soon</p>,
+      content: <EarnKeroseneContent />,
     },
     {
       label: "Check Eligibility",
@@ -105,7 +123,7 @@ export default function Home() {
 
   return (
     <div className="flex-1 max-w-screen-md w-[745px] p-4 mt-4">
-      <TabsComponent tabsData={tabsData} urlUpdate/>
+      <TabsComponent tabsData={tabsData} urlUpdate />
     </div>
   );
 }

components/claim-modal-content.tsx

@@ -19,6 +19,7 @@ export function ClaimModalContent() {
   const { data: startingPrice } = useReadDNftStartPrice({
     chainId: defaultChain.id,
   });
+  console.log("READING", startingPrice);
   const { data: publicMints } = useReadDNftPublicMints({
     chainId: defaultChain.id,
   });
@@ -56,5 +57,5 @@ export function ClaimModalContent() {
     );
   }
 
-  return <p>Connect wallet to view notes</p>
+  return <p>Connect wallet to view notes</p>;
 }

components/dnft-box.tsx

@@ -125,6 +125,7 @@ export default function DnftBox() {
     minCollateralizationRatio,
     id2asset,
   } = initialContractReads ?? {};
+  console.log("AAAAAA");
 
   // Get addresses of all dnfts owned by user
   const { data: dnfts } = useContractReads({

components/earn-kerosene.tsx

@@ -0,0 +1,77 @@
+import { useAccount } from "wagmi";
+import { formatEther, parseEther } from "viem";
+import { Button } from "@/components/ui/button";
+import {
+  dNftAbi,
+  dNftAddress,
+  useReadDNftPriceIncrease,
+  useReadDNftPublicMints,
+  useReadDNftStartPrice,
+  useReadDNftTotalSupply,
+} from "@/generated";
+import { defaultChain } from "@/lib/config";
+import { useTransactionStore } from "@/lib/store";
+import ButtonComponent from "@/components/reusable/ButtonComponent";
+import KeroseneCard from "@/components/KeroseneCard/KeroseneCard";
+
+export function EarnKeroseneContent() {
+  const { address, isConnected } = useAccount();
+  const { setTransactionData } = useTransactionStore();
+
+  const { data: startingPrice } = useReadDNftStartPrice({
+    chainId: defaultChain.id,
+  });
+  console.log("READING", startingPrice);
+  const { data: publicMints } = useReadDNftPublicMints({
+    chainId: defaultChain.id,
+  });
+  const { data: priceIncrease } = useReadDNftPriceIncrease({
+    chainId: defaultChain.id,
+  });
+  const { data: totalSupply } = useReadDNftTotalSupply({
+    chainId: defaultChain.id,
+  });
+
+  const mintPrice = formatEther(
+    (startingPrice || 0n) + (priceIncrease || 0n) * (publicMints || 0n)
+  );
+
+  const nextNote = parseInt(totalSupply?.toString() || "0", 10);
+
+  const keroseneCardsData = [
+    {
+      currency: "ETH - DYAD (Uniswap)",
+      APY: "24",
+      staked: "390",
+      keroseneEarned: "830",
+    },
+    {
+      currency: "DYAD",
+      APY: "12",
+      staked: "1200",
+      keroseneEarned: "500",
+    },
+  ];
+
+  if (isConnected) {
+    return (
+      <>
+        <div className="mt-12">
+          <ButtonComponent>Claim 1,863 Kerosene</ButtonComponent>
+        </div>
+        {keroseneCardsData.map((card, index) => (
+          <div className="mt-6" key={index}>
+            <KeroseneCard
+              currency={card.currency}
+              staked={card.staked}
+              APY={card.APY}
+              keroseneEarned={card.keroseneEarned}
+            />
+          </div>
+        ))}
+      </>
+    );
+  }
+
+  return <p>Connect wallet to view notes</p>;
+}

hooks/useIDsByOwner.js

@@ -0,0 +1,60 @@
+import { useContractReads } from "wagmi";
+import { useEffect, useState } from "react";
+import DnftAbi from "@/abis/DNft.json";
+import { dNftAddress } from "@/generated";
+import { defaultChain } from "@/lib/config";
+
+export default function useIDsByOwner(owner, balance) {
+  console.log("LLLL");
+  const [tokenIds, setTokenIds] = useState([]);
+  const [calls, setCalls] = useState([]);
+
+  const { refetch, data: tokens } = useContractReads({
+    contracts: calls,
+    // enabled: false,
+    onSuccess: (data) => {
+      console.log("SUCESS");
+      console.log("useIDsByOwner: Fetching ids for", owner, data);
+      setTokenIds(data);
+    },
+    onError: (error) => {
+      console.log("SUCESS");
+      console.error("Nein: Error fetching ids for", owner, error);
+    },
+    select: (data) => {
+      console.log("SELECT", data);
+      return data;
+    },
+  });
+  // console.log("BBBB", bbb);
+  console.log("XXXX", owner, parseInt(balance));
+
+  useEffect(() => {
+    console.log("BBBBB");
+    let _calls = [];
+    // for (let i = 0; i < parseInt(balance); i++) {
+    for (let i = 0; i < balance; i++) {
+      console.log("OOOO", i);
+      _calls.push({
+        address: dNftAddress[defaultChain.id],
+        functionName: "tokenOfOwnerByIndex",
+        abi: DnftAbi,
+        args: [owner, i],
+      });
+    }
+    console.log("calls", calls);
+    setCalls(_calls);
+  }, [balance]);
+
+  useEffect(() => {
+    console.log("super calls", calls);
+    refetch();
+    /**
+     * If there are no calls to be made, we automatically know that there are
+     * not any token ids to be fetched.
+     */
+    // calls.length > 0 ? refetch() : setTokenIds([]);
+  }, [calls]);
+
+  return { tokens };
+}

lib/config.ts

@@ -1,9 +1,11 @@
 import { cookieStorage, createStorage } from "wagmi";
-import { mainnet, sepolia } from "viem/chains";
+import { mainnet, sepolia, anvil } from "viem/chains";
 import { defaultWagmiConfig } from "@web3modal/wagmi";
+import { defineChain } from "viem";
 
 export const projectId = process.env.NEXT_PUBLIC_WALLETCONNECT_ID;
-export const defaultChain = mainnet;
+
+export const defaultChain = anvil;
 
 if (!projectId) throw new Error("Project ID is not defined");
 

wagmi.config.ts

@@ -1,6 +1,6 @@
 import { defineConfig } from "@wagmi/cli";
 import { react } from "@wagmi/cli/plugins";
-import { mainnet, sepolia } from "viem/chains";
+import { mainnet, sepolia, anvil } from "viem/chains";
 import { dnftAbi } from "@/lib/abi/Dnft";
 import { licenserAbi } from "@/lib/abi/Licenser";
 import { dyadAbi } from "@/lib/abi/Dyad";
@@ -18,6 +18,7 @@ export default defineConfig({
         // [sepolia.id]: "0x07319c8e07847D346051858FD0Ea9b9990E2Df07",
         [sepolia.id]: "0xf799122A38EDadd17BF73433e93Aaa422a515880",
         [mainnet.id]: "0xDc400bBe0B8B79C07A962EA99a642F5819e3b712",
+        [anvil.id]: "0xDc400bBe0B8B79C07A962EA99a642F5819e3b712",
       },
       abi: dnftAbi,
     },
@@ -26,6 +27,7 @@ export default defineConfig({
       address: {
         // [sepolia.id]: "0x7Ad21b2D244789c2e483af902BB1Ad0101139E88",
         [sepolia.id]: "0x287f5Fe6551E7567eD8Bdb6B0801F6Fa2C765CEb",
+        [anvil.id]: "0x287f5Fe6551E7567eD8Bdb6B0801F6Fa2C765CEb",
       },
       abi: licenserAbi,
     },
@@ -35,6 +37,7 @@ export default defineConfig({
         // [sepolia.id]: "0xf3b7B1CF5C5f32728D4cBb975c0969C23E70fA81",
         [sepolia.id]: "0x35C85fbC38c4fBBAb13603d2cce5eC521A022DC4",
         [mainnet.id]: "0x305B58c5F6B5b6606fb13edD11FbDD5e532d5A26",
+        [anvil.id]: "0x305B58c5F6B5b6606fb13edD11FbDD5e532d5A26",
       },
       abi: dyadAbi,
     },
@@ -44,6 +47,7 @@ export default defineConfig({
         // [sepolia.id]: "0xDbdF094Aa2d283C6F0044555931C8B50A41e7605",
         [sepolia.id]: "0x0ceedBf60e5DDa9562B34ac637e60Ac39eEe0213",
         [mainnet.id]: "0xfaa785c041181a54c700fD993CDdC61dbBfb420f",
+        [anvil.id]: "0xfaa785c041181a54c700fD993CDdC61dbBfb420f",
       },
       abi: vaultManagerAbi,
     },
@@ -53,13 +57,15 @@ export default defineConfig({
         // [sepolia.id]: "0xF19c9F99CC04C1C38D51dd3A0c2169D6485762b4",
         [sepolia.id]: "0x9802741d855b52E22E115B6cE7ba9E0e4433E8A9",
         [mainnet.id]: "0xcF97cEc1907CcF9d4A0DC4F492A3448eFc744F6c",
+        [anvil.id]: "0xcF97cEc1907CcF9d4A0DC4F492A3448eFc744F6c",
       },
       abi: vaultAbi,
     },
     {
       name: "wstETHVault",
       address: {
         [mainnet.id]: "0x7aE80418051b2897729Cbdf388b07C5158C557A1",
+        [anvil.id]: "0x7aE80418051b2897729Cbdf388b07C5158C557A1",
       },
       abi: vaultAbi,
     },
@@ -69,6 +75,7 @@ export default defineConfig({
         // [sepolia.id]: "0xe9F9Df2De303802f81EB114a5F24a3d4A17089f4",
         [sepolia.id]: "0xb1dD20c907e1DD95D6c05E29F0d79f6e8061735B",
         [mainnet.id]: "0x7363936FC85575Ff59D721B2B0171584880ba55B",
+        [anvil.id]: "0x7363936FC85575Ff59D721B2B0171584880ba55B",
       },
       abi: paymentsAbi,
     },
@@ -112,13 +119,15 @@ export default defineConfig({
       address: {
         [sepolia.id]: "0x7b79995e5f793A07Bc00c21412e50Ecae098E7f9",
         [mainnet.id]: "0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2",
+        [anvil.id]: "0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2",
       },
       abi: erc20Abi,
     },
     {
       name: "wstETH",
       address: {
         [mainnet.id]: "0x7f39C581F595B53c5cb19bD0b3f8dA6c935E2Ca0",
+        [anvil.id]: "0x7f39C581F595B53c5cb19bD0b3f8dA6c935E2Ca0",
       },
       abi: erc20Abi,
     },