IO-2733 Add loading state and further delay reload.

client/src/components/update-alert/update-alert.component.jsx

@@ -21,6 +21,7 @@ const mapDispatchToProps = (dispatch) => ({
 export function UpdateAlert({ updateAvailable }) {
   const { t } = useTranslation();
   const [timerStarted, setTimerStarted] = useState(false);
+  const [loading, setLoading] = useState(false);
   const [
     timeLeft,
     {
@@ -50,10 +51,11 @@ export function UpdateAlert({ updateAvailable }) {
   });
 
   const ReloadNewVersion = useCallback(() => {
+    setLoading(true);
     updateServiceWorker(true);
     setTimeout(() => {
       window.location.reload(true);
-    }, 2000);
+    }, 5000);
   }, [updateServiceWorker]);
 
   useEffect(() => {
@@ -115,7 +117,7 @@ export function UpdateAlert({ updateAvailable }) {
               <Button onClick={() => window.open("https://imex-online.noticeable.news/", "_blank")}>
                 {i18n.t("general.actions.viewreleasenotes")}
               </Button>
-              <Button type="primary" onClick={() => ReloadNewVersion()}>
+              <Button loading={loading} type="primary" onClick={() => ReloadNewVersion()}>
                 {i18n.t("general.actions.refresh")} {`(${(timeLeft / 1000).toFixed(0)} s)`}
               </Button>
               <Button onClick={() => start(300000)}>{i18n.t("general.actions.delay")}</Button>