fetch rewards on every submit to avoid stale values

src/components/UserInput.jsx

@@ -27,7 +27,7 @@ export function UserInput() {
   const [state, setState] = useState("initial");
   const [isLoaded, setIsLoaded] = useState(false);
   const [error, setError] = useState("");
-  const [usersReward] = useFetch();
+  const [usersReward, setUsersReward] = useState([]);
   let [userAprInfo, setUserAprInfo] = useState(null);
 
   async function getUserInfo(userAddr) {
@@ -49,8 +49,11 @@ export function UserInput() {
     setError(false);
     setState("submitting");
 
-    getUserInfo(ethAddress)
-      .then((info) => {
+    useFetch().then(r => {
+      setUsersReward(r);
+      return getUserInfo(ethAddress);
+    })
+      .then(info => {
         setState("success");
         setIsLoaded(true);
         setUserAprInfo({ ...info });

src/utils/useFetch.js

@@ -1,24 +1,9 @@
-import { useEffect, useState } from "react";
 import { rewardsUrl } from "./addresses";
 
-function useFetch(url = rewardsUrl) {
-  const [response, setResponse] = useState(null);
-  const [error, setError] = useState(null);
-  useEffect(() => {
-    const fetchData = async () => {
-      try {
-        const res = await fetch(url);
-
-        const allRewards = await res.json();
-        setResponse(allRewards.rewards);
-      } catch (error) {
-        setError(error);
-      }
-    };
-    fetchData();
-  }, []);
-
-  return [response, error];
+async function useFetch(url = rewardsUrl) {
+  const res = await fetch(url);
+  const allRewards = await res.json();
+  return allRewards.rewards;
 }
 
 export default useFetch;