Commit a7d0bcd6 authored by Oleksii Savran's avatar Oleksii Savran Committed by Viacheslav Pavlov

Add user button

CreateUserDialog fix
parent d001c352
......@@ -2194,6 +2194,7 @@
}
},
"common": {
"modelName": "User",
"email": "Email",
"emailAddress": "E-mail address",
"oAuthClientModelName": "OAuth client",
......
......@@ -16,6 +16,7 @@ import {
ADMIN_REMOVE_OAUTH_ACCESS_TOKEN,
ADMIN_REMOVE_OAUTH_CLIENT,
ADMIN_REMOVE_OAUTH_REFRESH_TOKEN,
ADMIN_TOGGLE_USER_MODAL,
} from 'user/constants';
import { showSnackbar } from 'actions/snackbar';
import navigateTo from 'actions/navigation';
......@@ -298,3 +299,8 @@ export const deleteAllRefreshTokens = (clientId: string) => (dispatch) => {
dispatch(receiveRefreshToken(null));
});
};
export const toggleUserModal = (open: boolean) => ({
type: ADMIN_TOGGLE_USER_MODAL,
payload: open,
});
export const ADMIN_RECEIVE_USERS = 'user/admin/RECEIVE_USERS';
export const ADMIN_APPEND_USERS = 'user/admin/APPEND_USERS';
export const ADMIN_RECEIVE_USER = 'user/admin/RECEIVE_USER';
export const ADMIN_TOGGLE_USER_MODAL = 'user/admin/TOGGLE_USER_MODAL';
export const ADMIN_UPDATE_USER_FORM = 'Form/user/admin/ADMIN_UPDATE_USER_FORM';
export const USER_FILTER_FORM = 'Form/user/admin/USER_FILTER_FORM';
......
......@@ -11,6 +11,7 @@ import {
ADMIN_REMOVE_OAUTH_ACCESS_TOKEN,
ADMIN_REMOVE_OAUTH_CLIENT,
ADMIN_REMOVE_OAUTH_REFRESH_TOKEN,
ADMIN_TOGGLE_USER_MODAL,
} from 'user/constants';
import update from 'immutability-helper';
......@@ -29,6 +30,7 @@ const INITIAL_STATE: {
oAuthError: any;
oAuthPaged: FilteredPage<OAuthClient>;
oAuthPagedError: any;
modalIsOpen: boolean;
} = {
user: null,
requestError: null,
......@@ -38,6 +40,7 @@ const INITIAL_STATE: {
oAuthError: null,
oAuthPaged: null,
oAuthPagedError: null,
modalIsOpen: false,
};
export default function user(state = INITIAL_STATE, action: IReducerAction) {
......@@ -198,6 +201,12 @@ export default function user(state = INITIAL_STATE, action: IReducerAction) {
});
}
case ADMIN_TOGGLE_USER_MODAL: {
return update(state, {
modalIsOpen: { $set: action.payload },
});
}
default:
return state;
}
......
......@@ -139,6 +139,7 @@
}
},
"common": {
"modelName": "User",
"email": "Email",
"emailAddress": "E-mail address",
"oAuthClientModelName": "OAuth client",
......
......@@ -4,7 +4,7 @@ import { bindActionCreators } from 'redux';
import { translate } from 'react-i18next';
// Actions
import { applyFilters, updateRoute, loadMoreUsers } from 'user/actions/admin';
import { applyFilters, updateRoute, loadMoreUsers, toggleUserModal } from 'user/actions/admin';
// Models
import { User } from 'model/user/User';
......@@ -23,6 +23,8 @@ import PaginationComponent from 'ui/common/pagination';
import withWidth from '@material-ui/core/withWidth';
import { Breakpoint } from '@material-ui/core/styles/createBreakpoints';
import PageTitle from 'ui/common/PageTitle';
import CreateNewButton from 'ui/common/buttons/CreateNewButton';
import CreateUserDialog from './c/CreateUserDialog';
const mobile = ['xs'] as Breakpoint[];
......@@ -35,6 +37,10 @@ class BrowsePage extends BrowsePageTemplate<User> {
}
}
public openAddDialog() {
this.props.toggleUserModal(true);
}
public render() {
const { paged, loadMoreData, width, t } = this.props;
......@@ -74,6 +80,11 @@ class BrowsePage extends BrowsePageTemplate<User> {
</PageContents>
</Grid>
</Grid>
<CreateUserDialog/>
<CreateNewButton
title="user.common.modelName"
action={ () => this.openAddDialog() }
/>
</ContentLayout>
);
}
......@@ -88,6 +99,7 @@ const mapDispatchToProps = (dispatch) => bindActionCreators({
applyFilters,
loadMoreData: loadMoreUsers,
updateRoute,
toggleUserModal,
}, dispatch);
......
import * as React from 'react';
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
import {translate} from 'react-i18next';
import {registrationRequest} from 'user/actions/public';
import {toggleUserModal, applyFilters} from 'user/actions/admin';
import Dialog from '@material-ui/core/Dialog';
import DialogContent from '@material-ui/core/DialogContent';
import DialogTitle from '@material-ui/core/DialogTitle';
import RegistrationForm from 'user/ui/c/RegistrationForm';
interface ICreateUserDialogProps extends React.ClassAttributes<any> {
registrationRequest: (u, p, fN, c) => Promise<any>;
toggleUserModal: (open: boolean) => void;
loadUser: (uuid: string) => void;
applyFilters: any;
isOpen: boolean;
captchaClientKey: string;
t: any;
}
class CreateUserDialog extends React.Component<ICreateUserDialogProps, any> {
public state = {
errorMsg: '',
};
private hide = () => {
this.props.toggleUserModal(false);
}
private addUser = (values): any => {
const {email, password, fullName, captcha} = values;
const {registrationRequest, applyFilters} = this.props;
return registrationRequest(email, password, fullName, captcha.captcha)
.then(() => {
applyFilters();
this.hide();
})
.catch((err) => {
console.log(err);
this.setState({errorMsg: err.message});
});
}
public render() {
const { captchaClientKey, t, isOpen} = this.props;
const { errorMsg } = this.state;
return (
<div>
{ isOpen &&
<Dialog open={ isOpen } onClose={ this.hide } maxWidth="md" fullWidth>
<DialogTitle>{ t('common:action.add', {what: t('user.common.modelName').toLowerCase() }) }</DialogTitle>
<DialogContent>
<RegistrationForm onSubmit={ this.addUser } captchaClientKey={ captchaClientKey } errorMsg={ errorMsg } onCancel={ this.hide }/>
</DialogContent>
</Dialog>
}
</div>
);
}
}
const mapStateToProps = (state) => ({
isOpen: state.user.admin.modalIsOpen,
captchaClientKey: state.serverInfo.data.captchaSiteKey,
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
registrationRequest,
toggleUserModal,
applyFilters,
}, dispatch);
export default connect(mapStateToProps, mapDispatchToProps)(translate()(CreateUserDialog));
......@@ -26,6 +26,7 @@ interface IRegistrationProps extends React.ClassAttributes<any> {
errorMsg: string;
captchaClientKey: string;
t: any;
onCancel?: any;
}
class Registration extends React.Component<IRegistrationProps, any> {
......@@ -35,7 +36,7 @@ class Registration extends React.Component<IRegistrationProps, any> {
};
public render() {
const {handleSubmit, captchaClientKey, errorMsg, t} = this.props;
const {handleSubmit, captchaClientKey, errorMsg, onCancel, t} = this.props;
return (
<form onSubmit={ handleSubmit }>
<Field
......@@ -82,6 +83,11 @@ class Registration extends React.Component<IRegistrationProps, any> {
<Button variant="contained" color="secondary" type="submit" style={ {marginTop: '1rem'} }>
{ t('user.public.c.registrationForm.register') }
</Button>
{ onCancel &&
<Button variant="contained" color="secondary" type="button" style={ {marginLeft: '1rem', marginTop: '1rem'} } onClick={ onCancel }>
{ t('common:action.cancel') }
</Button>
}
</form>
);
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment