import React, {useEffect, useRef, useState} from 'react' import {Link, useNavigate} from 'react-router-dom' import {useDispatch, useSelector} from 'react-redux' import {Loader} from '../Loader/Loader' import ErrorBoundary from "../../hoc/ErrorBoundary"; import {auth, selectAuth, setUserInfo} from '../../redux/outstaffingSlice' import {loading} from '../../redux/loaderSlice' import {setRole} from '../../redux/roleSlice' import {selectIsLoading} from '../../redux/loaderSlice' import {apiRequest} from "../../api/request"; import ellipse from '../../images/ellipse.png' import './authBox.scss' import Swal from 'sweetalert2' import withReactContent from 'sweetalert2-react-content' const SweetAlert = withReactContent(Swal); export const AuthBox = ({title, altTitle, roleChangeLink}) => { const dispatch = useDispatch(); const ref = useRef(); const navigate = useNavigate(); const isAuth = useSelector(selectAuth); const isLoading = useSelector(selectIsLoading); const [error, setError] = useState(null); const handleModalError = (error) => { SweetAlert.fire({ title: 'Ошибка', text: error }); setError(null) }; useEffect(() => { if (!localStorage.getItem('auth_token')) { dispatch(auth(false)) } }, []); useEffect(() => { if (isAuth) { navigate('/') } }); const submitHandler = () => { let formData = new FormData(ref.current); if (!isLoading) { dispatch(loading(true)); apiRequest('/user/login', { method: 'POST', data: formData }).then((res) => { if (!res.access_token) { setError('Некорректные данные для входа'); dispatch(loading(false)) } else { localStorage.setItem('auth_token', res.access_token); localStorage.setItem('id', res.id); localStorage.setItem('cardId', res.card_id); localStorage.setItem('role_status', res.status); localStorage.setItem( 'access_token_expired_at', res.access_token_expired_at ); dispatch(auth(true)); dispatch(setUserInfo(res)); dispatch(loading(false)); dispatch(setRole('ROLE_PARTNER')) } }) } }; return (