use async and await (#62)

Use async and await instead of promise chains
This commit is contained in:
mrdrogdrog 2020-05-24 22:55:06 +02:00 committed by GitHub
parent 11f01094b4
commit a5af15b278
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 92 additions and 80 deletions

View file

@ -3,13 +3,13 @@ import {BackendConfigState} from "../redux/backend-config/types";
import {expectResponseCode, getBackendUrl} from "../utils/apiUtils";
export const getBackendConfig = async () => {
return fetch(getBackendUrl() + '/backend-config.json')
.then(expectResponseCode())
.then(response => response.json() as Promise<BackendConfigState>);
const response = await fetch(getBackendUrl() + '/backend-config.json');
expectResponseCode(response);
return await response.json() as Promise<BackendConfigState>;
}
export const getFrontendConfig = async () => {
return fetch('config.json')
.then(expectResponseCode())
.then(response => response.json() as Promise<FrontendConfigState>);
const response = await fetch('config.json');
expectResponseCode(response)
return await response.json() as Promise<FrontendConfigState>;
}

View file

@ -5,7 +5,7 @@ export const getMe = async () => {
}
export const postEmailLogin = async (email: string, password: string) => {
return fetch(getBackendUrl() + "/login", {
const response = await fetch(getBackendUrl() + "/login", {
method: 'POST',
mode: 'cors',
cache: 'no-cache',
@ -19,13 +19,14 @@ export const postEmailLogin = async (email: string, password: string) => {
email: email,
password: password,
})
})
.then(expectResponseCode())
.then(response => response.json());
});
expectResponseCode(response);
return await response.json();
}
export const postLdapLogin = async (username: string, password: string) => {
return fetch(getBackendUrl() + "/auth/ldap", {
const response = await fetch(getBackendUrl() + "/auth/ldap", {
method: 'POST',
mode: 'cors',
cache: 'no-cache',
@ -40,12 +41,13 @@ export const postLdapLogin = async (username: string, password: string) => {
password: password,
})
})
.then(expectResponseCode())
.then(response => response.json());
expectResponseCode(response)
return await response.json();
}
export const postOpenIdLogin = async (openId: string) => {
return fetch(getBackendUrl() + "/auth/openid", {
const response = await fetch(getBackendUrl() + "/auth/openid", {
method: 'POST',
mode: 'cors',
cache: 'no-cache',
@ -59,6 +61,7 @@ export const postOpenIdLogin = async (openId: string) => {
openId: openId
})
})
.then(expectResponseCode())
.then(response => response.json());
expectResponseCode(response)
return await response.json();
}

View file

@ -13,16 +13,19 @@ export const ApplicationLoader: React.FC<ApplicationLoaderProps> = ({children, i
useEffect(() => {
setDoneTasks(0);
initTasks.map(task =>
task.then(() =>
setDoneTasks(prevDoneTasks => {
return prevDoneTasks + 1;
}))
.catch((reason) => {
initTasks.forEach(task => {
(async () => {
try {
await task;
setDoneTasks(prevDoneTasks => {
return prevDoneTasks + 1;
})
} catch (reason) {
setFailed(true);
console.error(reason);
})
)
}
})();
})
}, [initTasks]);
return (<Fragment>{

View file

@ -4,29 +4,34 @@ import React, {Fragment, useState} from "react";
import {postEmailLogin} from "../../../../../api/user";
import {getAndSetUser} from "../../../../../utils/apiUtils";
const ViaEMail: React.FC = () => {
export const ViaEMail: React.FC = () => {
const {t} = useTranslation();
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const [error, setError] = useState(false);
const login = (event: any) => {
postEmailLogin(email, password)
.then(loginJson => {
console.log(loginJson)
getAndSetUser();
}).catch(_reason => {
const doAsyncLogin = () => {
(async () => {
try {
await postEmailLogin(email, password);
await getAndSetUser();
} catch {
setError(true);
}
)
event.preventDefault();
})();
}
const onFormSubmit = (event: any) => {
doAsyncLogin();
event.preventDefault();
};
return (
<Fragment>
<h5 className="center">
<Trans i18nKey="signInVia" values={{service: "E-Mail"}}/>
</h5>
<Form onSubmit={login}>
<Form onSubmit={onFormSubmit}>
<Form.Group controlId="email">
<Form.Control
isInvalid={error}
@ -60,6 +65,4 @@ const ViaEMail: React.FC = () => {
</Form>
</Fragment>
);
}
export {ViaEMail}
}

View file

@ -9,29 +9,35 @@ import {ApplicationState} from "../../../../../redux";
const ViaLdap: React.FC = () => {
const {t} = useTranslation();
const ldapCustomName = useSelector((state: ApplicationState) => state.backendConfig.customAuthNames.ldap);
const [username, setUsername] = useState("");
const [password, setPassword] = useState("");
const [error, setError] = useState(false);
const login = (event: any) => {
postLdapLogin(username, password)
.then(loginJson => {
console.log(loginJson)
getAndSetUser();
}).catch(_reason => {
setError(true);
}
)
event.preventDefault();
}
const name = ldapCustomName ? `${ldapCustomName} (LDAP)` : "LDAP";
const doAsyncLogin = () => {
(async () => {
try {
await postLdapLogin(username, password);
await getAndSetUser();
} catch {
setError(true);
}
})();
}
const onFormSubmit = (event: any) => {
doAsyncLogin();
event.preventDefault();
}
return (
<Fragment>
<h5 className="center">
<Trans i18nKey="signInVia" values={{service: name}}/>
</h5>
<Form onSubmit={login}>
<Form onSubmit={onFormSubmit}>
<Form.Group controlId="username">
<Form.Control
isInvalid={error}

View file

@ -8,15 +8,20 @@ const ViaOpenId: React.FC = () => {
useTranslation();
const [openId, setOpenId] = useState("");
const [error, setError] = useState(false);
const login = (event: any) => {
postOpenIdLogin(openId)
.then(loginJson => {
console.log(loginJson)
getAndSetUser();
}).catch(_reason => {
const doAsyncLogin = () => {
(async () => {
try {
await postOpenIdLogin(openId);
await getAndSetUser();
} catch {
setError(true);
}
)
})();
}
const onFormSubmit = (event: any) => {
doAsyncLogin();
event.preventDefault();
}
@ -25,7 +30,7 @@ const ViaOpenId: React.FC = () => {
<h5 className="center">
<Trans i18nKey="signInVia" values={{service: "OpenID"}}/>
</h5>
<Form onSubmit={login}>
<Form onSubmit={onFormSubmit}>
<Form.Group controlId="openid">
<Form.Control
isInvalid={error}

View file

@ -3,33 +3,25 @@ import {LoginStatus} from "../redux/user/types";
import {setUser} from "../redux/user/methods";
import {store} from "./store";
export const getAndSetUser = () => {
getMe()
.then(expectResponseCode())
.then(response => response.json())
.then(user => {
if (!user) {
return;
}
setUser({
status: LoginStatus.ok,
id: user.id,
name: user.name,
photo: user.photo,
});
});
export const getAndSetUser = async () => {
const meResponse = await getMe();
expectResponseCode(meResponse);
const me = await meResponse.json();
if (!me) {
return;
}
setUser({
status: LoginStatus.ok,
id: me.id,
name: me.name,
photo: me.photo,
});
}
export const getBackendUrl = () => {
return store.getState().frontendConfig.backendUrl;
}
export const expectResponseCode = (code: number = 200): ((response: Response) => Promise<any>) => {
return (response: Response) => {
if (response.status !== code) {
return Promise.reject(`Response code not ${code}`);
} else {
return Promise.resolve(response);
}
}
export const expectResponseCode = (response: Response, code: number = 200) => {
return (response.status !== code);
}