diff --git a/minter/src/App.js b/minter/src/App.js index f99dd6e..6bf42e9 100644 --- a/minter/src/App.js +++ b/minter/src/App.js @@ -62,13 +62,13 @@ function App() { // Check for action on load useEffect( f => { checkAction() - window.addEventListener( 'popstate', checkAction ) - }, [] ) + return window.addEventListener( 'popstate', checkAction ) + }, [ address, loading ] ) // /////////////////////////////// // Rendering // /////////////////////////////// - log( action, error, loading, address ) + log( 'Rendering with ', action, error, loading, address ) // Initialisation interface if( error || loading || !address ) return { error &&

{ error }

} @@ -80,9 +80,9 @@ function App() { } { !address && ( !error && !loading ) && <> -

Rocketeer { action == 'mint' ? 'Minter' : 'Verifier' }

- { action == 'mint' &&

This interface is used to mint new Rocketeer NFTs. Minting is free, except for the gas fees. After minting you can view your new Rocketeer and its attributes on Opensea.

} - { action == 'verify' &&

This interface is used to veriy that you are the owner of a Rocketeer

} +

Rocketeer { action === 'mint' ? 'Minter' : 'Verifier' }

+ { action === 'mint' &&

This interface is used to mint new Rocketeer NFTs. Minting is free, except for the gas fees. After minting you can view your new Rocketeer and its attributes on Opensea.

} + { action === 'verify' &&

This interface is used to veriy that you are the owner of a Rocketeer

} metamask fox Connect wallet diff --git a/minter/src/components/verifier.js b/minter/src/components/verifier.js index edbb50a..85dcd0c 100644 --- a/minter/src/components/verifier.js +++ b/minter/src/components/verifier.js @@ -1,8 +1,8 @@ import { Container } from './generic' import '../App.css' -import { useState, useEffect, useReducer } from 'react' -import { log, setListenerAndReturnUnlistener } from '../modules/helpers' +import { useState, useEffect } from 'react' +import { log } from '../modules/helpers' import { useAddress, useChainId, useBalanceOf } from '../modules/web3' export default function Verifier() { @@ -36,10 +36,14 @@ export default function Verifier() { function verifyIfNeeded() { + log( 'Check the need to verify' ) + if( !window.location.href.includes( 'message' ) ) return try { + log( 'Verification started' ) + const { search } = window.location const query = new URLSearchParams( search ) const message = query.get( 'message' ) @@ -47,6 +51,8 @@ export default function Verifier() { log( 'Received message: ', verification ) const json = JSON.parse( verification ) + log( 'Showing status for ', json ) + return setMessage( json ) } catch( e ) { @@ -61,16 +67,17 @@ export default function Verifier() { // Lifecycle // /////////////////////////////// useEffect( f => { + log( 'Triggering verification check and popstate listener' ) verifyIfNeeded() - window.addEventListener( 'popstate', verifyIfNeeded ) + return window.addEventListener( 'popstate', verifyIfNeeded ) }, [] ) // /////////////////////////////// // Rendering // /////////////////////////////// - + log('Rendering with ', message, verifyUrl ) if( message ) return - { message.balance > 0 &&

✅ { message.username } has { message.balance } Rocketeers

} + { message.balance > 0 &&

✅ { message.username } has { message.balance } Rocketeers on chain ${ chainId }

} { message.balance < 1 &&

🛑 Computer says no

}