Web: Added displaying loading process

This commit is contained in:
Alexey Safronov 2023-09-21 18:00:47 +04:00
parent b19ef29e25
commit 6322290d58

View File

@ -19,6 +19,9 @@ const DocumentService = ({
}) => { }) => {
const { t } = useTranslation(["Settings", "Common"]); const { t } = useTranslation(["Settings", "Common"]);
const [isSaveLoading, setSaveIsLoading] = useState(false);
const [isResetLoading, setResetIsLoading] = useState(false);
const [apiUrl, setApiUrl] = useState(""); const [apiUrl, setApiUrl] = useState("");
const [apiUrlIsValid, setApiUrlIsValid] = useState(true); const [apiUrlIsValid, setApiUrlIsValid] = useState(true);
const onChangeApiUrl = (e) => { const onChangeApiUrl = (e) => {
@ -45,6 +48,7 @@ const DocumentService = ({
const onSubmit = (e) => { const onSubmit = (e) => {
e.preventDefault(); e.preventDefault();
setSaveIsLoading(true);
changeDocumentServiceLocation(apiUrl, internalUrl, portalUrl) changeDocumentServiceLocation(apiUrl, internalUrl, portalUrl)
.then((response) => { .then((response) => {
toastr.success(t("Common:ChangesSavedSuccessfully")); toastr.success(t("Common:ChangesSavedSuccessfully"));
@ -52,7 +56,8 @@ const DocumentService = ({
setInternalUrl(response[1]); setInternalUrl(response[1]);
setPortalUrl(response[2]); setPortalUrl(response[2]);
}) })
.catch((e) => toastr.error(e)); .catch((e) => toastr.error(e))
.finally(() => setSaveIsLoading(false));
}; };
const onReset = () => { const onReset = () => {
@ -60,6 +65,7 @@ const DocumentService = ({
setInternalUrlIsValid(true); setInternalUrlIsValid(true);
setPortalUrlIsValid(true); setPortalUrlIsValid(true);
setResetIsLoading(true);
changeDocumentServiceLocation(null, null, null) changeDocumentServiceLocation(null, null, null)
.then((response) => { .then((response) => {
toastr.success(t("Common:ChangesSavedSuccessfully")); toastr.success(t("Common:ChangesSavedSuccessfully"));
@ -67,7 +73,8 @@ const DocumentService = ({
setInternalUrl(response[1]); setInternalUrl(response[1]);
setPortalUrl(response[2]); setPortalUrl(response[2]);
}) })
.catch((e) => toastr.error(e)); .catch((e) => toastr.error(e))
.finally(() => setResetIsLoading(false));
}; };
const isFormEmpty = !apiUrl && !internalUrl && !portalUrl; const isFormEmpty = !apiUrl && !internalUrl && !portalUrl;
@ -122,6 +129,7 @@ const DocumentService = ({
onChange={onChangeApiUrl} onChange={onChangeApiUrl}
placeholder={"http://<editors-dns-name>/"} placeholder={"http://<editors-dns-name>/"}
hasError={!apiUrlIsValid} hasError={!apiUrlIsValid}
isDisabled={isSaveLoading || isResetLoading}
/> />
</div> </div>
<div className="input-wrapper"> <div className="input-wrapper">
@ -140,6 +148,7 @@ const DocumentService = ({
onChange={onChangeInternalUrl} onChange={onChangeInternalUrl}
placeholder={"http://<editors-dns-name>/"} placeholder={"http://<editors-dns-name>/"}
hasError={!internalUrlIsValid} hasError={!internalUrlIsValid}
isDisabled={isSaveLoading || isResetLoading}
/> />
</div> </div>
<div className="input-wrapper"> <div className="input-wrapper">
@ -158,6 +167,7 @@ const DocumentService = ({
onChange={onChangePortalUrl} onChange={onChangePortalUrl}
placeholder={"http://<win-nvplrl2avjo/"} placeholder={"http://<win-nvplrl2avjo/"}
hasError={!portalUrlIsValid} hasError={!portalUrlIsValid}
isDisabled={isSaveLoading || isResetLoading}
/> />
</div> </div>
</div> </div>
@ -168,14 +178,18 @@ const DocumentService = ({
primary primary
size={"small"} size={"small"}
label={t("Common:SaveButton")} label={t("Common:SaveButton")}
// isDisabled={isFormEmpty || !allInputsValid} isDisabled={
isFormEmpty || !allInputsValid || isSaveLoading || isResetLoading
}
isLoading={isSaveLoading}
/> />
<Button <Button
onClick={onReset} onClick={onReset}
className="button" className="button"
size={"small"} size={"small"}
label={t("Common:ResetButton")} label={t("Common:ResetButton")}
isDisabled={!anyInputFilled} isDisabled={!anyInputFilled || isSaveLoading || isResetLoading}
isLoading={isResetLoading}
/> />
</div> </div>
</Styled.LocationForm> </Styled.LocationForm>