77 lines
2.3 KiB
JavaScript
77 lines
2.3 KiB
JavaScript
import { useEffect } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import { useHistory } from 'react-router-dom';
|
|
import PropTypes from 'prop-types';
|
|
import { logoutUser } from '../../../redux/actions/auth';
|
|
import NavLink from '../../shared/buttons/nav-link';
|
|
import { fetchStudent } from '../../../redux/actions/student';
|
|
import ButtonGroup from '../../shared/buttons/button-group';
|
|
import Button from '../../shared/buttons/button';
|
|
import { fetchUserData } from '../../../redux/actions/user';
|
|
import { isAnonymous, isAuthenticated as isAuthenticatedFn } from '../../../redux/utils/auth';
|
|
|
|
function AuthHeader(props) {
|
|
useEffect(() => props.fetchStudent(), []);
|
|
const history = useHistory();
|
|
const nextURL = `${history.location.pathname}${history.location.search.replace('&', ';')}`;
|
|
|
|
if (isAnonymous(props.authStatus)) {
|
|
return (
|
|
<ButtonGroup className={props.className}>
|
|
<NavLink
|
|
to={`/login?next=${nextURL}`}
|
|
color='blue'
|
|
content='ورود'
|
|
className={props.className}
|
|
/>
|
|
<NavLink
|
|
to={`/register?next=${nextURL}`}
|
|
color='blue'
|
|
content='ثبت نام'
|
|
className={props.className}
|
|
/>
|
|
</ButtonGroup>
|
|
);
|
|
}
|
|
|
|
const isAuthenticated = isAuthenticatedFn(props.authStatus);
|
|
|
|
return (
|
|
<ButtonGroup className={props.className}>
|
|
<NavLink
|
|
to='/profile'
|
|
content={props.name}
|
|
loading={!isAuthenticated || !props.name}
|
|
disabled={!isAuthenticated || !props.name}
|
|
/>
|
|
<Button
|
|
content='خروج'
|
|
color='red'
|
|
onClick={props.logoutUser.bind(null, history)}
|
|
loading={!isAuthenticated}
|
|
disabled={!isAuthenticated}
|
|
/>
|
|
</ButtonGroup>
|
|
);
|
|
}
|
|
|
|
AuthHeader.propTypes = {
|
|
authStatus: PropTypes.string.isRequired,
|
|
name: PropTypes.string,
|
|
mobile: PropTypes.string,
|
|
fetchUserData: PropTypes.func.isRequired,
|
|
fetchStudent: PropTypes.func.isRequired,
|
|
logoutUser: PropTypes.func.isRequired,
|
|
className: PropTypes.string
|
|
};
|
|
|
|
function mapStateToProps(state) {
|
|
return {
|
|
authStatus: state.auth.status,
|
|
name: state.user.data.name,
|
|
mobile: state.user.data.mobile
|
|
};
|
|
}
|
|
|
|
export default connect(mapStateToProps, { fetchUserData, fetchStudent, logoutUser })(AuthHeader);
|