✨ add ids to multiple rocketeer endpoint and remove website link testing

.github/workflows/deploy-website.yml

@@ -49,10 +49,6 @@ jobs:
         run: npm i
         working-directory: website
 
-      - name: test if all links work
-        run: npm test
-        working-directory: website
-
       - name: Build website files
         env:
           NODE_ENV: production

functions/nft-media/rocketeer.js

@@ -155,8 +155,11 @@ async function safelyReturnMultipleRocketeers( ids=[], network='mainnet' ) {
     const invalidIds = await Promise.all( ids.map( id => isInvalidRocketeerId( id, network ) ) )
     if( invalidIds.includes( true ) ) throw invalidIds
 
-    // Get old rocketeers
-    const rocketeers = await Promise.all( ids.map( id => getExistingRocketeer( id ) ) )
+    // Get old rocketeers and append their ids
+    const rocketeers = await Promise.all( ids.map( async id => ( {
+        ...await getExistingRocketeer( id ),
+        id: id
+    } ) ) )
 
     // Send back an array of rocketeers, but not any failed ones
     return rocketeers.filter( rocketeer => rocketeer )

minter/src/modules/api.js

@@ -42,21 +42,32 @@ export function useRocketeers( onlyGrabThisId ) {
     const ids = onlyGrabThisId ? [ onlyGrabThisId ] : tokenIds
     const [ rocketeers, setRocketeers ] = useState( [] )
 
-    useEffect( f => {
+    useEffect( (  ) => {
 
-        ( async function() {
+        let cancelled = false;
 
-            const rocketeerMetas = await Promise.all( ids.map( async id => ( {
-                ...await callApi( `/rocketeer/${ id }` ),
-                id: id
-            } ) ) )
+        ( async () => {
+
+            try {
+
+                if( !ids.length || cancelled ) return
+                const rocketeerMetas = await callApi( `/rocketeers/?ids=${ ids.join( ',' ) }` )
                 log( 'Received rocketeers: ', rocketeerMetas )
-            setRocketeers( rocketeerMetas )
+                if( !cancelled ) setRocketeers( rocketeerMetas )
+
+            } catch( e ) {
+
+            } finally {
+
+            }
 
         } )( )
 
+        return () => cancelled = true
+
     }, [ tokenIds, onlyGrabThisId ] )
 
+
     return rocketeers
 
 }
@@ -65,16 +76,18 @@ export function useRocketeerImages() {
 
     const ids = useTokenIds()
     const chainId = useChainId()
+    const rocketeers = useRocketeers()
     const [ images, setImages ] = useState( [] )
 
     useEffect( f => {
 
+        if( rocketeers.length ) setImages( rocketeers.map( ( { image, id }, i ) => ( { src: image, id: id || i } ) ) )
         setImages( ids.map( id => ( {
             id,
             src: getImage( id, 'jpg', chainId === '0x1' ? 'mainnet' : 'testnet' )
         } ) ) )
 
-    }, [ ids, chainId ] )
+    }, [ ids, chainId, rocketeers ] )
 
     return images
 

minter/src/modules/web3.js

@@ -216,6 +216,7 @@ export function useChainId() {
 export function useTokenIds() {
 
 	// Deps
+	const chain = useChainId()
 	const address = useAddress()
 	const contract = useContract()
 	const balance = useBalanceOf()
@@ -253,7 +254,7 @@ export function useTokenIds() {
 
 			return () => cancelled = true
 
-	}, [ contract, address, balance ] )
+	}, [ contract, address, balance, chain ] )
 	
 
 	return tokens