Memory leak bug because of unmounted Loading button

[gweiying]

Because our modals unmount before the Loading button completes its state update, we receive the memory leak error message shown below:

This happens for all modals (mediaModal, hyperlinkModal etc) that close once the Loading button is clicked because of the following lines in the LoadingButton.jsx component link:

      onClick={async () => {
        setButtonLoading(true);
        await callback();
        setButtonLoading(false);
      }}

[kwajiehao]

So it turns out that the issue isn't to do with the lines specified:

      onClick={async () => {
        setButtonLoading(true);
        await callback();
        setButtonLoading(false);
      }}

but from the fact that we are attempting to set the button loading state to false even after the LoadingButton component has unmounted (because the modal has closed). The fix is to add a condition to update state only when the component is mounted (reference: https://stackoverflow.com/questions/53949393/cant-perform-a-react-state-update-on-an-unmounted-component)