diff --git a/src/api/index.ts b/src/api/index.ts index c83f4aef..65033954 100644 --- a/src/api/index.ts +++ b/src/api/index.ts @@ -738,6 +738,9 @@ export const getCategoryList = ( export const dailyOpen = (): Promise => http.post(`${BASE_URL_API}/invite/checkin/open`); +export const dailySkipMint = (): Promise => + http.post(`${BASE_URL_API}/invite/skip`); + export interface DailyCheckinHistoryData { date: string; expired: boolean; diff --git a/src/components/DashboardS2/DailyRoulette/DailyDrawModal.tsx b/src/components/DashboardS2/DailyRoulette/DailyDrawModal.tsx index 87ff8c1c..bf8efa44 100644 --- a/src/components/DashboardS2/DailyRoulette/DailyDrawModal.tsx +++ b/src/components/DashboardS2/DailyRoulette/DailyDrawModal.tsx @@ -12,9 +12,12 @@ import { import { UseDisclosureReturn } from "@nextui-org/use-disclosure"; import Marquee from "@/components/Marquee"; import { useRef, useState, useEffect, useCallback, useMemo } from "react"; -import { dailyOpen } from "@/api"; +import { dailyOpen, dailySkipMint } from "@/api"; import { sleep } from "@/utils"; -import useNovaNFT, { MysteryboxMintParams } from "@/hooks/useNovaNFT"; +import useNovaNFT, { + MysteryboxMintParams, + TrademarkMintParams, +} from "@/hooks/useNovaNFT"; import { MintStatus, TRADEMARK_NFT_MARKET_URL, @@ -79,6 +82,7 @@ const DailyDrawModal: React.FC = (props: IProps) => { points?: number; tooltip?: string; }>(); + const [mintParams, setMintParams] = useState(); const mintResultModal = useDisclosure(); const handleDrawEnd = () => {}; @@ -112,9 +116,7 @@ const DailyDrawModal: React.FC = (props: IProps) => { setMintResult({ ...prize, }); - if ([1, 2, 3, 4].includes(tokenId)) { - await sleep(2000); // show nft - setMinting(true); + if (tokenId <= 4) { const { tokenId, nonce, signature, expiry, mintType } = res.result; const mintParams = { tokenId, @@ -124,32 +126,12 @@ const DailyDrawModal: React.FC = (props: IProps) => { method: "safeMintCommon", mintType, }; - - try { - await sendTrademarkMintTx(mintParams); - setMintStatus(MintStatus.Success); - mintResultModal.onOpen(); - onDrawed(); // update remain times after mint tx - } catch (e) { - console.log(e); - setMintStatus(MintStatus.Failed); - if (e.message) { - if (e.message.includes("rejected the request")) { - setFailMessage("User rejected the request"); - } else { - setFailMessage(e.message); - } - } - } finally { - setMinting(false); - setSpinging(false); - } + setMintParams(mintParams); } else { setMintStatus(MintStatus.Success); mintResultModal.onOpen(); - setSpinging(false); } - + setSpinging(false); if (!remain || remain <= 1) { modalInstance.onClose(); } @@ -160,10 +142,42 @@ const DailyDrawModal: React.FC = (props: IProps) => { modalInstance, onDrawed, remain, - sendTrademarkMintTx, switchChain, ]); + const handleMint = useCallback(async () => { + if (!mintParams) { + return; + } + try { + setMinting(true); + await sendTrademarkMintTx(mintParams); + setMintStatus(MintStatus.Success); + mintResultModal.onOpen(); + onDrawed(); // update remain times after mint tx + setMintParams(undefined); + } catch (e) { + console.log(e); + setMintStatus(MintStatus.Failed); + if (e.message) { + if (e.message.includes("rejected the request")) { + setFailMessage("User rejected the request"); + } else { + setFailMessage(e.message); + } + } + } finally { + setMinting(false); + } + }, [mintParams, mintResultModal, onDrawed, sendTrademarkMintTx]); + + const handleSkip = async () => { + await dailySkipMint(); + setMintParams(undefined); + mintResultModal.onClose(); + onDrawed(); // update remain times after skip + }; + useEffect(() => { if (!modalInstance.isOpen) { setMinting(false); @@ -216,23 +230,46 @@ const DailyDrawModal: React.FC = (props: IProps) => { -
- - - {btnText} - -
+ {!mintParams && ( +
+ + + {btnText} + +
+ )} + {mintParams && ( +
+ + Skip + + + {!minting && ( + + )} + Mint + +
+ )}
)}