title: State not updating when using react hooks and progressCallback from Amplify Storage.put function
body: <p>I am attempting to use the Amplify Storage progressCallback function to add a visual indicator of upload progress but I am unable to update the state from inside the progressCallback function. The code below runs without any errors but fails to update the loading hook.</p>
  
  <p>I believe this is an issue with how i am trying to pass the state to the  callBack function, but if this is the case i am not sure what the solution is. Would love some help.</p>
  
  <pre><code>const CustomCard = () =&gt; {
    const [loading, setLoading] = useState(null);
  
    const CustomFunc = progress =&gt; {
      setLoading(progress);
      console.log(loading);
    };
  
    const onChange = async e =&gt; {
      const file = e.target.files[0];
      const fileName = "test";
      const result = await Storage.put(fileName, file, {
        customPrefix: { public: "public/" },
        progressCallback: progress =&gt; {
          CustomFunc(progress.progress);
        },
      });
    };
  
    return (
      &lt;React.Fragment&gt;
         &lt;input
             id="add-image-file-input"
             type="file"
             accept="image/*."
             onChange={onChange}
             style={{ display: "none" }}
         /&gt;
         &lt;FileUploadProgress loading={loading} /&gt;
      &lt;/React.Fragment&gt;
    )
  }
  </code></pre>