🗿🪒 -> getOwnerGears function in s.contract & pull into App.js(x) for #3

contracts/GearToken.sol

@@ -62,4 +62,17 @@ contract GearToken is ERC721, Ownable {
     function getGears() public view returns(Gear[] memory){
         return gears;
     }
+
+    function getOwnerGears(address _owner) public view returns (Gear[] memory) { // Get all of the owner's Gears
+        // Filter & loop through all gears, retrieve only the owner's gears (getter)
+        Gear[] memory result = new Gear[](balanceOf(_owner)); // balanceOf(_owner) => how many NFTs the owner has (from ERC721 smartcontract script from openzeppelin)
+        uint256 counter = 0;
+        for(uint256 i = 0; i < gears.length; i++) {
+            if(ownerOf(i) == _owner) { // If the owner of the NFT is the same as the address that's calling the function
+                result[counter] = gears[i];
+                counter++;
+            }
+        }
+        return result;
+    }
 }

src/App.js

@@ -12,17 +12,24 @@ function App() {
   console.table(blockchain);
 
   useEffect(() => {
-    dispatch(connect());
   }, [dispatch]);
 
   return <s.Screen>
+    {blockchain.account !== "" || blockchain.gearToken !== null ? (
     <s.Container flex={1} ai={"center"} jc={"center"}>
-      <s.TextTitle>
-        Our game
-      </s.TextTitle>
       <s.SpacerSmall />
-      <button>CONNECT</button>
+      <button onClick={(e) => {
+        e.preventDefault(); // prevent default form submit
+        dispatch(connect());
+      }}>CONNECT</button>
     </s.Container>
+    ) : (
+      <s.Container>
+        <s.TextTitle>
+          Connect to our Game
+        </s.TextTitle>
+      </s.Container>
+    )}
   </s.Screen>
 }
 

src/redux/data/dataReducer.js

@@ -1,6 +1,7 @@
 const initialState = {
     loading: false,
     allGears: [],
+    allOwnerGears: [],
     error: false,
     errorMsg: "",
 };
@@ -17,6 +18,7 @@ const dataReducer = (state = initialState, action) => {
                 ...state,
                 loading: false,
                 allGears: action.payload.allGears,
+                allOwnerGears: action.payload.allOwnerGears,
             };
         case "CHECK_DATA_FAILED":
             return {