summaryrefslogtreecommitdiffstats
path: root/openecomp-ui/src/sdc-app/onboarding/permissions/PermissionsManager.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/permissions/PermissionsManager.jsx')
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/permissions/PermissionsManager.jsx221
1 files changed, 139 insertions, 82 deletions
diff --git a/openecomp-ui/src/sdc-app/onboarding/permissions/PermissionsManager.jsx b/openecomp-ui/src/sdc-app/onboarding/permissions/PermissionsManager.jsx
index b7d5d57cca..ab6add8ac2 100644
--- a/openecomp-ui/src/sdc-app/onboarding/permissions/PermissionsManager.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/permissions/PermissionsManager.jsx
@@ -21,97 +21,154 @@ import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js';
import Tooltip from 'react-bootstrap/lib/Tooltip.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
-import {permissionTypes, changeOwnerMessage} from './PermissionsConstants.js';
+import { permissionTypes, changeOwnerMessage } from './PermissionsConstants.js';
export const askForRightsMsg = () => {
- return (
- <div>
- <p>{i18n('Send a Contributor rights reguest to Owner')}</p>
- </div>
- );
+ return (
+ <div>
+ <p>{i18n('Send a Contributor rights reguest to Owner')}</p>
+ </div>
+ );
};
-
class Permissions extends React.Component {
- constructor(props) {
- super(props);
- this.state = {
- itemUsers: props.itemUsers,
- newOwnerId: '',
- showChangeOwner: false
- };
- }
+ constructor(props) {
+ super(props);
+ this.state = {
+ itemUsers: props.itemUsers,
+ newOwnerId: '',
+ showChangeOwner: false
+ };
+ }
- buildUserOptions() {
- let {users, owner} = this.props;
- return users.filter(user => user.userId !== owner.userId).map(item => {return {label: item.fullName, value: item.userId};});
- }
+ buildUserOptions() {
+ let { users, owner } = this.props;
+ return users.filter(user => user.userId !== owner.userId).map(item => {
+ return { label: item.fullName, value: item.userId };
+ });
+ }
- render() {
- let {onCancel, owner} = this.props;
- let {newOwnerId} = this.state;
- return (
- <div className='manage-permissions-page'>
- <Form
- hasButtons={true}
- onSubmit={() => this.onsaveItemUsers()}
- onReset={() => onCancel() }
- labledButtons={true}>
- <div className='manage-permissions-title'>{i18n('Owner')}</div>
- <div className='owner-details'>
- <span>{owner.fullName}</span>
- <span className='change-owner' onClick={() => this.setState({showChangeOwner: !this.state.showChangeOwner})}>{i18n('Change Owner')}</span>
- </div>
- {this.state.showChangeOwner && <div className='change-owner-wrapper'>
- <div className='change-owner-title'>
- <span className='manage-permissions-title' data-test-id='change-owner'>{i18n('Change Owner')}</span>
- <OverlayTrigger placement='right' trigger='click' overlay={
- <Tooltip id='manage-permissions-owner-tooltip' className='manage-permissions-owner-tooltip'>{i18n(changeOwnerMessage)}</Tooltip> }>
- <SVGIcon name='questionMark' />
- </OverlayTrigger>
- </div>
- <Select
- data-test-id='selected-owner'
- value={newOwnerId}
- onChange={(item) => this.setState({newOwnerId: item ? item.value : ''})}
- options={this.buildUserOptions()} />
- </div>}
- <div className='manage-permissions-title'>{i18n('Contributors')}</div>
- <Select
- data-test-id='selected-contributors'
- value={this.state.itemUsers.map(item => item.userId)}
- className='options-input contributors-select'
- clearable={false}
- onMultiSelectChanged={(value) => {this.onChangeItemUsers({itemUsers: value});}}
- options={this.buildUserOptions()}
- multi/>
- </Form>
- </div>
- );
- }
+ render() {
+ let { onCancel, owner } = this.props;
+ let { newOwnerId } = this.state;
+ return (
+ <div className="manage-permissions-page">
+ <Form
+ hasButtons={true}
+ onSubmit={() => this.onsaveItemUsers()}
+ onReset={() => onCancel()}
+ labledButtons={true}>
+ <div className="manage-permissions-title">
+ {i18n('Owner')}
+ </div>
+ <div className="owner-details">
+ <span>{owner.fullName}</span>
+ <span
+ className="change-owner"
+ onClick={() =>
+ this.setState({
+ showChangeOwner: !this.state.showChangeOwner
+ })
+ }>
+ {i18n('Change Owner')}
+ </span>
+ </div>
+ {this.state.showChangeOwner && (
+ <div className="change-owner-wrapper">
+ <div className="change-owner-title">
+ <span
+ className="manage-permissions-title"
+ data-test-id="change-owner">
+ {i18n('Change Owner')}
+ </span>
+ <OverlayTrigger
+ placement="right"
+ trigger="click"
+ overlay={
+ <Tooltip
+ id="manage-permissions-owner-tooltip"
+ className="manage-permissions-owner-tooltip">
+ {i18n(changeOwnerMessage)}
+ </Tooltip>
+ }>
+ <SVGIcon name="questionMark" />
+ </OverlayTrigger>
+ </div>
+ <Select
+ data-test-id="selected-owner"
+ value={newOwnerId}
+ onChange={item =>
+ this.setState({
+ newOwnerId: item ? item.value : ''
+ })
+ }
+ options={this.buildUserOptions()}
+ />
+ </div>
+ )}
+ <div className="manage-permissions-title">
+ {i18n('Contributors')}
+ </div>
+ <Select
+ data-test-id="selected-contributors"
+ value={this.state.itemUsers.map(item => item.userId)}
+ className="options-input contributors-select"
+ clearable={false}
+ onMultiSelectChanged={value => {
+ this.onChangeItemUsers({ itemUsers: value });
+ }}
+ options={this.buildUserOptions()}
+ multi
+ />
+ </Form>
+ </div>
+ );
+ }
- onChangeItemUsers({itemUsers}) {
- this.setState({
- itemUsers: itemUsers.map(contributor => {
- let contributorFromProps = this.props.itemUsers.find(user => user.userId === contributor.userId);
- return {
- userId: contributor.value,
- fullName: contributor.label,
- permission: contributorFromProps ? contributorFromProps.permission : permissionTypes.CONTRIBUTOR
- };
- })
- });
- }
+ onChangeItemUsers({ itemUsers }) {
+ this.setState({
+ itemUsers: itemUsers.map(contributor => {
+ let contributorFromProps = this.props.itemUsers.find(
+ user => user.userId === contributor.userId
+ );
+ return {
+ userId: contributor.value,
+ fullName: contributor.label,
+ permission: contributorFromProps
+ ? contributorFromProps.permission
+ : permissionTypes.CONTRIBUTOR
+ };
+ })
+ });
+ }
- onsaveItemUsers() {
- let {itemUsers: newUsers, newOwnerId} = this.state;
- let {itemUsers: oldUsers, onSubmit, itemId, users} = this.props;
- let addedUsersIds = newUsers.filter(newUser => !oldUsers.map(oldUser => oldUser.userId).includes(newUser.userId))
- .map(user => user.userId);
- let removedUsersIds = oldUsers.filter(oldUser => !newUsers.map(newUser => newUser.userId).includes(oldUser.userId))
- .map(user => user.userId);
- onSubmit({itemId, addedUsersIds, removedUsersIds, allUsers: users, newOwnerId});
- }
+ onsaveItemUsers() {
+ let { itemUsers: newUsers, newOwnerId } = this.state;
+ let { itemUsers: oldUsers, onSubmit, itemId, users } = this.props;
+ let addedUsersIds = newUsers
+ .filter(
+ newUser =>
+ !oldUsers
+ .map(oldUser => oldUser.userId)
+ .includes(newUser.userId)
+ )
+ .map(user => user.userId);
+ let removedUsersIds = oldUsers
+ .filter(
+ oldUser =>
+ !newUsers
+ .map(newUser => newUser.userId)
+ .includes(oldUser.userId)
+ )
+ .map(user => user.userId);
+ onSubmit({
+ itemId,
+ addedUsersIds,
+ removedUsersIds,
+ allUsers: users,
+ newOwnerId
+ });
+ }
}
export default Permissions;