Add unmonetize support

meta-web3-music · Sep 3, 2023 · bd071c1 · bd071c1
1 parent 7f203d6
commit bd071c1
Show file tree

Hide file tree

Showing 7 changed files with 109 additions and 41 deletions.
diff --git a/src/app/account/AccountListBtn.tsx b/src/app/account/AccountListBtn.tsx
@@ -0,0 +1,28 @@
+import OButton from "@/components/OButton/OButton";
+import React from "react";
+
+const AccountListBtn = ({
+  monetizeId,
+  onList,
+  onUnlist,
+}: {
+  // monetizeId should be -1 when it is non existence
+  monetizeId: bigint;
+  onList: () => void;
+  onUnlist: () => void;
+}) => {
+  return (
+    <OButton
+      color={(monetizeId ?? -1) > -1 ? "gray" : "yellow"}
+      btnType="fill"
+      className="w-full mt-2"
+      onClick={() => {
+        (monetizeId ?? -1) > -1 ? onUnlist() : onList();
+      }}
+    >
+      {(monetizeId ?? -1) > -1 ? "Unlist" : "List"}
+    </OButton>
+  );
+};
+
+export default AccountListBtn;
diff --git a/src/app/account/page.tsx b/src/app/account/page.tsx
@@ -18,6 +18,8 @@ import { USDCxWalletBalanceSub } from "@/subs/WalletBalanceSub";
 import { useQuery } from "@apollo/client";
 import React, { useContext, useEffect, useState } from "react";
 import { usePublicClient, useWalletClient } from "wagmi";
+import AccountListBtn from "./AccountListBtn";
+import { unmonetize } from "@/services/smart-contract/unmonetize";
 
 const Account = () => {
   const { data: walletClient } = useWalletClient();
@@ -136,23 +138,19 @@ const Account = () => {
                 handlePlaySongSpinamp(e);
               }}
               customBtn={
-                <OButton
-                  color={
-                    (myListedMusic?.octaveTokens.findIndex((ele) => {
+                <AccountListBtn
+                  monetizeId={BigInt(
+                    myListedMusic?.octaveTokens.find((ele) => {
                       if (!e.contractAddress || !e.tokenId) return false;
                       return (
                         (ele.musicNftAddr as string).toLowerCase() ==
                           e.contractAddress.toLowerCase() &&
                         (ele.musicNftTokenId as string).toLowerCase() ==
                           e.tokenId.toLowerCase()
                       );
-                    }) ?? -1) > -1
-                      ? "gray"
-                      : "yellow"
-                  }
-                  btnType="fill"
-                  className="w-full mt-2"
-                  onClick={() => {
+                    })?.id ?? "-1"
+                  )}
+                  onList={() => {
                     //TODO error
                     if (
                       !walletClient ||
@@ -170,20 +168,18 @@ const Account = () => {
                       walletClient
                     );
                   }}
-                >
-                  {myListedMusic &&
-                  myListedMusic?.octaveTokens.findIndex((ele) => {
-                    if (!e.contractAddress || !e.tokenId) return false;
-                    return (
-                      (ele.musicNftAddr as string).toLowerCase() ==
-                        e.contractAddress.toLowerCase() &&
-                      (ele.musicNftTokenId as string).toLowerCase() ==
-                        e.tokenId.toLowerCase()
-                    );
-                  }) > -1
-                    ? "Unlist"
-                    : "List"}
-                </OButton>
+                  onUnlist={() => {
+                    if (
+                      !walletClient ||
+                      !publicClient ||
+                      !e.contractAddress ||
+                      !e.tokenId ||
+                      !e.tokenUri
+                    )
+                      return;
+                    unmonetize(BigInt(e.tokenId), publicClient, walletClient);
+                  }}
+                />
               }
             />
           );
@@ -198,11 +194,19 @@ const Account = () => {
                 handlePlaySong(e);
               }}
               customBtn={
-                <OButton
-                  color="yellow"
-                  btnType="fill"
-                  className="w-full mt-2"
-                  onClick={() => {
+                <AccountListBtn
+                  monetizeId={BigInt(
+                    myListedMusic?.octaveTokens.find((ele) => {
+                      if (!e.id) return false;
+                      return (
+                        (ele.musicNftAddr as string).toLowerCase() ==
+                          MusicNFTAddr.toLowerCase() &&
+                        (ele.musicNftTokenId as string).toLowerCase() ==
+                          e.id.toLowerCase()
+                      );
+                    })?.id ?? "-1"
+                  )}
+                  onList={() => {
                     //TODO error
                     if (!walletClient || !publicClient || !e.id || !e.tokenUri)
                       return;
@@ -214,9 +218,11 @@ const Account = () => {
                       walletClient
                     );
                   }}
-                >
-                  List
-                </OButton>
+                  onUnlist={() => {
+                    if (!walletClient || !publicClient || !e.id) return;
+                    unmonetize(BigInt(e.id), publicClient, walletClient);
+                  }}
+                />
               }
             />
           );

diff --git a/src/graph-ql/queries/octav3/GET_ALL_MUSIC/getAllMusic.ts b/src/graph-ql/queries/octav3/GET_ALL_MUSIC/getAllMusic.ts
@@ -2,7 +2,7 @@ import { gql } from "../__generated__";
 
 export const GET_ALL_MUSIC = gql(`
 query GetAllMusic @api(name: octav3){
-    octaveTokens {
+    octaveTokens(where:{closed:false}) {
       id
       owner
       musicNftAddr

diff --git a/src/graph-ql/queries/octav3/GET_MY_LISTED_MUSIC/getMyListedMusic.ts b/src/graph-ql/queries/octav3/GET_MY_LISTED_MUSIC/getMyListedMusic.ts
@@ -2,7 +2,8 @@ import { gql } from "../__generated__";
 
 export const GET_MY_LISTED_MUSIC = gql(`
 query GetMyListedMusic($owner:Bytes) @api(name: octav3){
-  octaveTokens(where:{owner:$owner}) {
+  octaveTokens(where:{owner:$owner,closed:false}) {
+      id
       musicNftAddr
       musicNftTokenId
     }

diff --git a/src/graph-ql/queries/octav3/__generated__/gql.ts b/src/graph-ql/queries/octav3/__generated__/gql.ts
diff --git a/src/graph-ql/queries/octav3/__generated__/graphql.ts b/src/graph-ql/queries/octav3/__generated__/graphql.ts
diff --git a/src/services/smart-contract/unmonetize.ts b/src/services/smart-contract/unmonetize.ts
@@ -0,0 +1,27 @@
+import { Octav3Addr } from "../../env";
+import { PublicClient, WalletClient, getContract } from "viem";
+import Octave from "@/contracts/abis/Octave";
+
+export const unmonetize = async (monetizeId: bigint, publicClient: PublicClient, walletClient: WalletClient) => {
+    if (!walletClient.account) {
+        //TODO error
+        return
+    }
+    try {
+        // connect to market smart-contract
+        const adNft = getContract({
+            address: Octav3Addr,
+            abi: Octave,
+            publicClient,
+            walletClient,
+        });
+
+        // invoke contract func and mint ad nft
+        await adNft.write.
+            closedForMonetize([monetizeId], { account: walletClient.account, chain: walletClient.chain })
+
+        // end minting
+    } catch (err: unknown) {
+        console.log(err);
+    }
+};