import { format } from 'date-fns' import React from 'react' import { connect } from 'react-redux' import { Link } from 'react-router-dom' import Message from '../Common/Message' import Pagination from '../Common/Pagination' import { history } from '../../index' import { getOrUpdateData } from '../../actions' import { apiUrl, formatUrl, sortOrders, translateValues, userFilters, } from '../../utils' class AdminUsers extends React.Component { constructor(props, context) { super(props, context) this.state = { page: null, per_page: null, order_by: 'created_at', order: 'asc', } } componentDidMount() { this.initState() this.props.loadUsers(this.props.location.query) } componentDidUpdate(prevProps) { if (prevProps.location.query !== this.props.location.query) { this.props.loadUsers(this.props.location.query) } } initState() { const { query } = this.props.location this.setState({ page: query.page, per_page: query.per_page, order_by: query.order_by ? query.order_by : 'created_at', order: query.order ? query.order : 'asc', }) } updatePage(key, value) { const query = Object.assign({}, this.state) query[key] = value this.setState(query) const url = formatUrl(this.props.location.pathname, query) history.push(url) } render() { const { authUser, location, message, t, pagination, updateUser, users, } = this.props const translatedFilters = translateValues(t, userFilters) const translatedSortOrders = translateValues(t, sortOrders) return (
{message && }
{t('administration:Users')}
{users.map(user => ( ))}
# {t('user:Username')} {t('user:Email')} {t('user:Registration Date')} {t('activities:Activities')} {t('user:Admin')} {t('administration:Actions')}
# {user.picture === true ? ( Avatar ) : ( {t('user:Username')} {user.username} {t('user:Email')} {user.email} {t('user:Registration Date')} {format( new Date(user.created_at), 'dd/MM/yyyy HH:mm' )} {t('activities:Activities')} {user.nb_activities} {t('user:Admin')} {user.admin ? ( {t('administration:Actions')} updateUser(user.username, !user.admin) } />
history.push('/admin/')} value={t('common:Back')} />
) } } export default connect( state => ({ authUser: state.user, location: state.router.location, message: state.message, pagination: state.users.pagination, users: state.users.data, }), dispatch => ({ loadUsers: query => { dispatch(getOrUpdateData('getData', 'users', query)) }, updateUser: (userName, isAdmin) => { const data = { username: userName, admin: isAdmin } dispatch(getOrUpdateData('updateData', 'users', data, false)) }, }) )(AdminUsers)