From 88045a8c1038de4ce4310a96a9f30173808836ae Mon Sep 17 00:00:00 2001 From: Lucas Tortora <85233773+lucas-tortora@users.noreply.github.com> Date: Fri, 14 Feb 2025 09:33:35 -0300 Subject: [PATCH] fix(devx): Fix CTF Challenge 0 (#5371) * popup.tst: * fix path props * use false for setShowPopUp on close always mint-leap-frog-nft.tsx: * add digest prop and use it for PopUp ctf-utils.ts * fix spacing * rename Error to Response * add digest to response ctf-verifier.tsx * rename Error to Response * removed unused imports and constants * rename popup component * Update docs/site/src/components/CTF/ctf-verifier.tsx * Update docs/site/src/utils/ctf-utils.ts Co-authored-by: vivekjain23 <165671934+vivekjain23@users.noreply.github.com> * Update docs/site/src/components/CTF/ctf-verifier.tsx Co-authored-by: vivekjain23 <165671934+vivekjain23@users.noreply.github.com> --------- Co-authored-by: vivekjain23 <165671934+vivekjain23@users.noreply.github.com> --- docs/site/src/components/CTF/ctf-verifier.tsx | 13 +- .../src/components/CTF/mint-leap-frog-nft.tsx | 27 ++-- .../components/CTF/{popup.tsx => pop-in.tsx} | 18 +-- docs/site/src/utils/ctf-utils.ts | 120 +++++++++--------- 4 files changed, 89 insertions(+), 89 deletions(-) rename docs/site/src/components/CTF/{popup.tsx => pop-in.tsx} (78%) diff --git a/docs/site/src/components/CTF/ctf-verifier.tsx b/docs/site/src/components/CTF/ctf-verifier.tsx index 3f0c0140d04..bf926cc9fef 100644 --- a/docs/site/src/components/CTF/ctf-verifier.tsx +++ b/docs/site/src/components/CTF/ctf-verifier.tsx @@ -8,7 +8,6 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import { getFullnodeUrl } from '@iota/iota-sdk/client'; import clsx from 'clsx'; import { useConnectWallet, useWallets } from '@iota/dapp-kit'; -import Popup from './popup'; import { handleChallengeSubmit } from "../../utils/ctf-utils" interface ChallengeVerifierProps { @@ -28,9 +27,9 @@ const ChallengeVerifier: React.FC = ({ }) => { const [inputText, setInputText] = useState(''); const [coins, setCoins] = useState(null); - const [showPopup, setShowPopup] = useState(false); + const [setShowPopIn] = useState(false); const [loading, setLoading] = useState(false); - const [error, setError] = useState<{ + const [response, setResponse] = useState<{ status: 'success' | 'error'; description: string; title: string; @@ -43,7 +42,6 @@ const ChallengeVerifier: React.FC = ({ const wallets = useWallets(); const { mutate } = useConnectWallet(); const { mutate: signAndExecuteTransaction} = useSignAndExecuteTransaction(); - const [digest,setDigest] = useState(''); const handleSubmit = async () => { await handleChallengeSubmit({ inputText, @@ -55,9 +53,8 @@ const ChallengeVerifier: React.FC = ({ signAndExecuteTransaction, setLoading, setCoins, - setError, - setShowPopup, - setDigest + setResponse, + setShowPopIn, }); }; @@ -73,7 +70,7 @@ const ChallengeVerifier: React.FC = ({ placeholder="Enter Flag Object Id" className="input-field" /> - {

{error.description}

} + {

{response.description}

} @@ -63,4 +63,4 @@ const Popup = ({ status, description, title, setShowPopup, showPopup,digest }: P ) } -export default Popup \ No newline at end of file +export default PopIn \ No newline at end of file diff --git a/docs/site/src/utils/ctf-utils.ts b/docs/site/src/utils/ctf-utils.ts index 2756e8634d6..9fbef504fbd 100644 --- a/docs/site/src/utils/ctf-utils.ts +++ b/docs/site/src/utils/ctf-utils.ts @@ -11,12 +11,11 @@ export const handleChallengeSubmit = async ({ signAndExecuteTransaction, setLoading, setCoins, - setError, - setShowPopup, - setDigest + setResponse, + setShowPopIn, }: any) => { setLoading(true); - setError({ + setResponse({ status: 'success', description: '', title: '', @@ -59,24 +58,24 @@ export const handleChallengeSubmit = async ({ onSuccess: ({ digest }: any) => { client.waitForTransaction({ digest, options: { showEffects: true } }).then(() => { setDigest(digest) - setError({ + setResponse({ status: 'success', description: 'An NFT reward was minted and transferred to your IOTA wallet address for completing the challenge.', title: 'NFT Minted', }); setCoins(message); setLoading(false); - setShowPopup(true); + setShowPopIn(true); }); }, onError: (error: any) => { - setError({ + setResponse({ status: 'error', description: `Failed to execute transaction : ${error}`, title: 'Submission failed', }); setLoading(false); - setShowPopup(true); + setShowPopIn(true); }, } ); @@ -87,7 +86,7 @@ export const handleChallengeSubmit = async ({ setCoins('Invalid Flag Object Id. Please try again.'); } } catch (err: any) { - setError({ + setResponse({ status: 'error', description: err.message || 'An error occurred. Please try again.', title: 'Submission failed', @@ -103,11 +102,11 @@ export const handleMintLeapFrogSubmit = async ({ signAndExecuteTransaction, setLoading, setCoins, - setError, - setShowPopup, + setResponse, + setShowPopIn, }: any) => { setLoading(true); - setError({ + setResponse({ status: 'success', description: '', title: '', @@ -121,59 +120,60 @@ export const handleMintLeapFrogSubmit = async ({ const NFTPackageAddress = "0x649884331fa662235b2c06c6eb488e5327105dded1331f6b7541ef4fdbd9eeca" const client = new IotaClient({ url: NETWORKS.testnet.url }); - const message = 'Congratulations! You have successfully completed this level!'; - const wallet = wallets[0]; + const message = 'Congratulations! You have successfully completed this level!'; + const wallet = wallets[0]; - mutate( - { wallet }, - { - onSuccess: () => { - const tx = () => { - const tx = new Transaction(); - const arg0 = new TextEncoder().encode(nft.name); - const arg1 = new TextEncoder().encode(nft.description); - const arg2 = new TextEncoder().encode(nft.url); - tx.setGasBudget(50000000); - tx.moveCall({ - target: `${NFTPackageAddress}::leap_frog_nft::mint_to_sender`, - arguments: [tx.pure.vector('u8', arg0), tx.pure.vector('u8', arg1), tx.pure.vector('u8', arg2), tx.pure.address(nft.address)], - }); - return tx; - }; + mutate( + { wallet }, + { + onSuccess: () => { + const tx = () => { + const tx = new Transaction(); + const arg0 = new TextEncoder().encode(nft.name); + const arg1 = new TextEncoder().encode(nft.description); + const arg2 = new TextEncoder().encode(nft.url); + tx.setGasBudget(50000000); + tx.moveCall({ + target: `${NFTPackageAddress}::leap_frog_nft::mint_to_sender`, + arguments: [tx.pure.vector('u8', arg0), tx.pure.vector('u8', arg1), tx.pure.vector('u8', arg2), tx.pure.address(nft.address)], + }); + return tx; + }; - signAndExecuteTransaction( - { - transaction: tx(), - }, - { - onSuccess: ({ digest }: any) => { - client.waitForTransaction({ digest, options: { showEffects: true } }).then(() => { - setError({ - status: 'success', - description: 'An NFT reward is minted to your IOTA wallet address upon completing the challenge.', - title: 'NFT Minted', - }); - setCoins(message); - setLoading(false); - setShowPopup(true); - }); - }, - onError: (error: any) => { - setError({ - status: 'error', - description: `Failed to execute transaction : ${error}`, - title: 'Submission failed', + signAndExecuteTransaction( + { + transaction: tx(), + }, + { + onSuccess: ({ digest }: any) => { + client.waitForTransaction({ digest, options: { showEffects: true } }).then(() => { + setResponse({ + status: 'success', + description: 'An NFT reward is minted to your IOTA wallet address upon completing the challenge.', + title: 'NFT Minted', + digest: digest }); + setCoins(message); setLoading(false); - setShowPopup(true); - }, - } - ); - }, - } - ); + setShowPopIn(true); + }); + }, + onError: (error: any) => { + setResponse({ + status: 'error', + description: `Failed to execute transaction : ${error}`, + title: 'Submission failed', + }); + setLoading(false); + setShowPopIn(true); + }, + } + ); + }, + } + ); } catch (err: any) { - setError({ + setResponse({ status: 'error', description: err.message || 'An error occurred. Please try again.', title: 'Submission failed',