simple auth error handling

This commit is contained in:
kurpfish 2021-08-11 16:39:54 +03:00
parent 78ca049794
commit b128e4b4cd
5 changed files with 34 additions and 1 deletions

View File

@ -27,6 +27,7 @@ const AuthForDevelopers = () => {
const [username, setUsername] = useState('')
const [password, setPassword] = useState('')
const [error, setError] = useState(null);
if(isAuth) {
return <Redirect to='/' />
@ -67,6 +68,10 @@ const AuthForDevelopers = () => {
onChange={(e) => setPassword(e.target.value)}
/>
{ error && <div className={style.form__error}>
{error}
</div> }
<div className={style.form__buttons}>
<button
className={style.form__btn}
@ -79,6 +84,10 @@ const AuthForDevelopers = () => {
dispatch: ()=> {
dispatch(auth(true))
dispatch(loading(false))
},
catchError: () => {
setError('Некорректные данные')
dispatch(loading(false))
}
})
} : ()=>{}}

View File

@ -192,6 +192,13 @@
color: #6aaf5c !important;
}
.form__error {
font-size: 16px;
color: #b21;
margin-left: 45px;
margin-bottom: 16px;
}
@media (max-width: 575.98px) {
.form__btn {
margin: 0 auto;

View File

@ -28,6 +28,7 @@ const AuthForPartners = () => {
const [username, setUsername] = useState('')
const [password, setPassword] = useState('')
const [error, setError] = useState(null);
if(isAuth) {
return <Redirect to='/' />
@ -62,6 +63,10 @@ const AuthForPartners = () => {
onChange={(e) => setPassword(e.target.value)}
/>
{ error && <div className={style.form__error}>
{error}
</div> }
<div className={style.form__buttons}>
<button
className={style.form__btn}
@ -74,6 +79,10 @@ const AuthForPartners = () => {
dispatch: ()=> {
dispatch(auth(true))
dispatch(loading(false))
},
catchError: () => {
setError('Некорректные данные')
dispatch(loading(false))
}
})
} : ()=>{}}

View File

@ -189,6 +189,13 @@
color: #6aaf5c !important;
}
.form__error {
font-size: 16px;
color: #b21;
margin-left: 45px;
margin-bottom: 16px;
}
@media (max-width: 575.98px) {
.form__btn {
margin: 0 auto;

View File

@ -64,7 +64,7 @@ export const fetchForm = async (link, info) => {
} catch (error) {}
}
export const fetchAuth = async ({ username, password, dispatch }) => {
export const fetchAuth = async ({ username, password, dispatch, catchError }) => {
const baseURL = process.env.REACT_APP_BASE_URL;
const apiURL = process.env.REACT_APP_API_URL;
try {
@ -84,6 +84,7 @@ export const fetchAuth = async ({ username, password, dispatch }) => {
)
if(!response.ok) {
catchError();
return response.statusText;
}