Influxdata
/
chronograf
mirror of https://github.com/influxdata/chronograf.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Move All New Users Are SuperAdmin toggle to AllUsersTable

pull/2733/head
Jared Scheib 2018-01-11 17:18:05 -08:00
parent 068cf733f1
commit aabbeb94ab
5 changed files with 97 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
ui/src/admin/components/chronograf/AllUsersTable.js
View File

@ -25,6 +25,19 @@ class AllUsersTable extends Component {
}
}
handleUpdateAuthConfig = fieldName => updatedValue => {
const {
actionsConfig: {updateAuthConfigAsync},
authConfig,
links,
} = this.props
const updatedAuthConfig = {
...authConfig,
[fieldName]: updatedValue,
}
updateAuthConfigAsync(links.config.auth, authConfig, updatedAuthConfig)
}
handleAddUserToOrganization = user => newOrganization => {
console.log('handleAddUserToOrganization', user.name, newOrganization.id)
// const newOrganizationRole = newOrganization + newOrganizationDefaultRole -- need to get this fresh from server or have server determine it, which requires a change to ValidUpdate
@ -48,7 +61,14 @@ class AllUsersTable extends Component {
}
render() {
const {users, organizations, onCreateUser, meID, notify} = this.props
const {
users,
organizations,
onCreateUser,
authConfig,
meID,
notify,
} = this.props
const {isCreatingUser} = this.state
@ -59,6 +79,8 @@ class AllUsersTable extends Component {
numOrganizations={organizations.length}
onClickCreateUser={this.handleClickCreateUser}
isCreatingUser={isCreatingUser}
authConfig={authConfig}
onChangeAuthConfig={this.handleUpdateAuthConfig}
/>
<div className="panel-body">
<table className="table table-highlight v-center chronograf-admin-table">
@ -117,6 +139,11 @@ class AllUsersTable extends Component {
const {arrayOf, bool, func, shape, string} = PropTypes
AllUsersTable.propTypes = {
links: shape({
config: shape({
auth: string.isRequired,
}).isRequired,
}).isRequired,
users: arrayOf(
shape({
id: string,
@ -145,6 +172,13 @@ AllUsersTable.propTypes = {
onUpdateUserRole: func.isRequired,
onUpdateUserSuperAdmin: func.isRequired,
onDeleteUser: func.isRequired,
actionsConfig: shape({
getAuthConfigAsync: func.isRequired,
updateAuthConfigAsync: func.isRequired,
}),
authConfig: shape({
superAdminNewUsers: bool,
}),
meID: string.isRequired,
notify: func.isRequired,
}

16
ui/src/admin/components/chronograf/AllUsersTableHeader.js
View File

@ -1,10 +1,14 @@
import React, {PropTypes} from 'react'
import SlideToggle from 'shared/components/SlideToggle'
const AllUsersTableHeader = ({
numUsers,
numOrganizations,
onClickCreateUser,
isCreatingUser,
authConfig: {superAdminNewUsers},
onChangeAuthConfig,
}) => {
const numUsersString = `${numUsers} User${numUsers === 1 ? '' : 's'}`
const numOrganizationsString = `${numOrganizations} Org${numOrganizations ===
@ -17,6 +21,12 @@ const AllUsersTableHeader = ({
<h2 className="panel-title">
{numUsersString} in {numOrganizationsString}
</h2>
<SlideToggle
size="xs"
active={superAdminNewUsers}
onToggle={onChangeAuthConfig('superAdminNewUsers')}
/>
<span>All new users are SuperAdmins</span>
<button
className="btn btn-primary btn-sm"
onClick={onClickCreateUser}
@ -29,7 +39,7 @@ const AllUsersTableHeader = ({
)
}
const {bool, func, number} = PropTypes
const {bool, func, number, shape} = PropTypes
AllUsersTableHeader.defaultProps = {
numUsers: 0,
@ -42,6 +52,10 @@ AllUsersTableHeader.propTypes = {
numOrganizations: number.isRequired,
onClickCreateUser: func,
isCreatingUser: bool.isRequired,
onChangeAuthConfig: func.isRequired,
authConfig: shape({
superAdminNewUsers: bool,
}),
}
export default AllUsersTableHeader

29
ui/src/admin/components/chronograf/OrganizationsTable.js
View File

@ -5,7 +5,6 @@ import uuid from 'node-uuid'
import OrganizationsTableRow from 'src/admin/components/chronograf/OrganizationsTableRow'
import OrganizationsTableRowNew from 'src/admin/components/chronograf/OrganizationsTableRowNew'
import QuestionMarkTooltip from 'shared/components/QuestionMarkTooltip'
import SlideToggle from 'shared/components/SlideToggle'
import {PUBLIC_TOOLTIP} from 'src/admin/constants/index'
@ -40,8 +39,6 @@ class OrganizationsTable extends Component {
onChooseDefaultRole,
onTogglePublic,
currentOrganization,
authConfig: {superAdminNewUsers},
onChangeAuthConfig,
} = this.props
const {isCreatingOrganization} = this.state
@ -92,33 +89,13 @@ class OrganizationsTable extends Component {
currentOrganization={currentOrganization}
/>
)}
<table className="table v-center superadmin-config">
<thead>
<tr>
<th style={{width: 70}}>Config</th>
<th />
</tr>
</thead>
<tbody>
<tr>
<td style={{width: 70}}>
<SlideToggle
size="xs"
active={superAdminNewUsers}
onToggle={onChangeAuthConfig('superAdminNewUsers')}
/>
</td>
<td>All new users are SuperAdmins</td>
</tr>
</tbody>
</table>
</div>
</div>
)
}
}
const {arrayOf, bool, func, shape, string} = PropTypes
const {arrayOf, func, shape, string} = PropTypes
OrganizationsTable.propTypes = {
organizations: arrayOf(
@ -136,9 +113,5 @@ OrganizationsTable.propTypes = {
onRenameOrg: func.isRequired,
onTogglePublic: func.isRequired,
onChooseDefaultRole: func.isRequired,
onChangeAuthConfig: func.isRequired,
authConfig: shape({
superAdminNewUsers: bool,
}),
}
export default OrganizationsTable

53
ui/src/admin/containers/chronograf/AllUsersPage.js
View File

@ -3,6 +3,7 @@ import {connect} from 'react-redux'
import {bindActionCreators} from 'redux'
import * as adminChronografActionCreators from 'src/admin/actions/chronograf'
import * as configActionCreators from 'shared/actions/config'
import {publishAutoDismissingNotification} from 'shared/dispatchers'
import AllUsersTableEmpty from 'src/admin/components/chronograf/AllUsersTableEmpty'
@ -17,13 +18,18 @@ class AllUsersPage extends Component {
}
}
componentDidMount() {
const {links, actionsConfig: {getAuthConfigAsync}} = this.props
getAuthConfigAsync(links.config.auth)
}
handleCreateUser = user => {
const {links, actions: {createUserAsync}} = this.props
const {links, actionsAdmin: {createUserAsync}} = this.props
createUserAsync(links.users, user)
}
handleUpdateUserRole = (user, currentRole, {name}) => {
const {actions: {updateUserAsync}} = this.props
const {actionsAdmin: {updateUserAsync}} = this.props
const updatedRole = {...currentRole, name}
const newRoles = user.roles.map(
r => (r.organization === currentRole.organization ? updatedRole : r)
@ -32,20 +38,20 @@ class AllUsersPage extends Component {
}
handleUpdateUserSuperAdmin = (user, superAdmin) => {
const {actions: {updateUserAsync}} = this.props
const {actionsAdmin: {updateUserAsync}} = this.props
const updatedUser = {...user, superAdmin}
updateUserAsync(user, updatedUser)
}
handleDeleteUser = user => {
const {actions: {deleteUserAsync}} = this.props
const {actionsAdmin: {deleteUserAsync}} = this.props
deleteUserAsync(user)
}
async componentWillMount() {
const {
links,
actions: {loadOrganizationsAsync, loadUsersAsync},
actionsAdmin: {loadOrganizationsAsync, loadUsersAsync},
} = this.props
this.setState({isLoading: true})
@ -59,7 +65,15 @@ class AllUsersPage extends Component {
}
render() {
const {organizations, meID, users, notify} = this.props
const {
organizations,
meID,
users,
authConfig,
actionsConfig,
links,
notify,
} = this.props
const {isLoading} = this.state
if (isLoading) {
@ -75,39 +89,58 @@ class AllUsersPage extends Component {
onUpdateUserRole={this.handleUpdateUserRole}
onUpdateUserSuperAdmin={this.handleUpdateUserSuperAdmin}
onDeleteUser={this.handleDeleteUser}
links={links}
authConfig={authConfig}
actionsConfig={actionsConfig}
notify={notify}
/>
)
}
}
const {arrayOf, func, shape, string} = PropTypes
const {arrayOf, bool, func, shape, string} = PropTypes
AllUsersPage.propTypes = {
links: shape({
users: string.isRequired,
config: shape({
auth: string.isRequired,
}).isRequired,
}),
meID: string.isRequired,
users: arrayOf(shape),
organizations: arrayOf(shape),
actions: shape({
actionsAdmin: shape({
loadUsersAsync: func.isRequired,
loadOrganizationsAsync: func.isRequired,
createUserAsync: func.isRequired,
updateUserAsync: func.isRequired,
deleteUserAsync: func.isRequired,
}),
actionsConfig: shape({
getAuthConfigAsync: func.isRequired,
updateAuthConfigAsync: func.isRequired,
}),
authConfig: shape({
superAdminNewUsers: bool,
}),
notify: func.isRequired,
}
const mapStateToProps = ({links, adminChronograf: {organizations, users}}) => ({
const mapStateToProps = ({
links,
adminChronograf: {organizations, users},
config: {auth: authConfig},
}) => ({
links,
organizations,
users,
authConfig,
})
const mapDispatchToProps = dispatch => ({
actions: bindActionCreators(adminChronografActionCreators, dispatch),
actionsAdmin: bindActionCreators(adminChronografActionCreators, dispatch),
actionsConfig: bindActionCreators(configActionCreators, dispatch),
notify: bindActionCreators(publishAutoDismissingNotification, dispatch),
})

37
ui/src/admin/containers/chronograf/OrganizationsPage.js
View File

@ -3,20 +3,14 @@ import {connect} from 'react-redux'
import {bindActionCreators} from 'redux'
import * as adminChronografActionCreators from 'src/admin/actions/chronograf'
import * as configActionCreators from 'shared/actions/config'
import {getMeAsync} from 'shared/actions/auth'
import OrganizationsTable from 'src/admin/components/chronograf/OrganizationsTable'
class OrganizationsPage extends Component {
componentDidMount() {
const {
links,
actionsAdmin: {loadOrganizationsAsync},
actionsConfig: {getAuthConfigAsync},
} = this.props
const {links, actionsAdmin: {loadOrganizationsAsync}} = this.props
loadOrganizationsAsync(links.organizations)
getAuthConfigAsync(links.config.auth)
}
handleCreateOrganization = async organization => {
@ -57,21 +51,8 @@ class OrganizationsPage extends Component {
this.refreshMe()
}
handleUpdateAuthConfig = fieldName => updatedValue => {
const {
actionsConfig: {updateAuthConfigAsync},
authConfig,
links,
} = this.props
const updatedAuthConfig = {
...authConfig,
[fieldName]: updatedValue,
}
updateAuthConfigAsync(links.config.auth, authConfig, updatedAuthConfig)
}
render() {
const {meCurrentOrganization, organizations, authConfig, me} = this.props
const {meCurrentOrganization, organizations, me} = this.props
const organization = organizations.find(
o => o.id === meCurrentOrganization.id
@ -86,15 +67,13 @@ class OrganizationsPage extends Component {
onRenameOrg={this.handleRenameOrganization}
onTogglePublic={this.handleTogglePublic}
onChooseDefaultRole={this.handleChooseDefaultRole}
authConfig={authConfig}
onChangeAuthConfig={this.handleUpdateAuthConfig}
me={me}
/>
: <div className="page-spinner" />
}
}
const {arrayOf, bool, func, shape, string} = PropTypes
const {arrayOf, func, shape, string} = PropTypes
OrganizationsPage.propTypes = {
links: shape({
@ -116,18 +95,11 @@ OrganizationsPage.propTypes = {
updateOrganizationAsync: func.isRequired,
deleteOrganizationAsync: func.isRequired,
}),
actionsConfig: shape({
getAuthConfigAsync: func.isRequired,
updateAuthConfigAsync: func.isRequired,
}),
getMe: func.isRequired,
meCurrentOrganization: shape({
name: string.isRequired,
id: string.isRequired,
}),
authConfig: shape({
superAdminNewUsers: bool,
}),
me: shape({
organizations: arrayOf(
shape({
@ -142,18 +114,15 @@ OrganizationsPage.propTypes = {
const mapStateToProps = ({
links,
adminChronograf: {organizations},
config: {auth: authConfig},
auth: {me},
}) => ({
links,
organizations,
authConfig,
me,
})
const mapDispatchToProps = dispatch => ({
actionsAdmin: bindActionCreators(adminChronografActionCreators, dispatch),
actionsConfig: bindActionCreators(configActionCreators, dispatch),
getMe: bindActionCreators(getMeAsync, dispatch),
})