From 7fdf733a64670fceefc3ded35cfa581e1c458179 Mon Sep 17 00:00:00 2001 From: Einav Weiss Keidar Date: Tue, 20 Mar 2018 14:45:40 +0200 Subject: Adding Prettier and fixing up eslint version Issue-ID: SDC-1094 Change-Id: Ie83ad95a03899345dd90235daf0323cbe3bc6afd Signed-off-by: Einav Weiss Keidar --- .../nfvo-components/panel/NavigationSideBar.jsx | 219 ++++++++------ .../panel/versionController/VersionController.jsx | 323 ++++++++++++++------- .../VersionControllerConstants.js | 10 +- .../versionController/components/ActionButtons.jsx | 227 ++++++++++----- .../components/CommitCommentModal.jsx | 87 +++--- .../versionController/components/Permissions.jsx | 106 ++++--- 6 files changed, 616 insertions(+), 356 deletions(-) (limited to 'openecomp-ui/src/nfvo-components/panel') diff --git a/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx b/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx index 2eda7e69bf..61121df335 100644 --- a/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx +++ b/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx @@ -19,116 +19,159 @@ import classnames from 'classnames'; import Collapse from 'react-bootstrap/lib/Collapse.js'; class NavigationSideBar extends React.Component { - static PropTypes = { - activeItemId: PropTypes.string.isRequired, - onSelect: PropTypes.func, - onToggle: PropTypes.func, - groups: PropTypes.array, - disabled: PropTypes.bool - }; + static PropTypes = { + activeItemId: PropTypes.string.isRequired, + onSelect: PropTypes.func, + onToggle: PropTypes.func, + groups: PropTypes.array, + disabled: PropTypes.bool + }; - constructor(props) { - super(props); - this.state = { - activeItemId: null - }; - this.handleItemClicked = this.handleItemClicked.bind(this); - } + constructor(props) { + super(props); + this.state = { + activeItemId: null + }; + this.handleItemClicked = this.handleItemClicked.bind(this); + } - render() { - let {groups, activeItemId, disabled = false} = this.props; + render() { + let { groups, activeItemId, disabled = false } = this.props; - return ( -
- {groups.map(group => ( - - ))} -
- ); - } + return ( +
+ {groups.map(group => ( + + ))} +
+ ); + } - handleItemClicked(event, item) { - event.stopPropagation(); - if(this.props.onToggle) { - this.props.onToggle(this.props.groups, item.id); - } - if(item.onSelect) { - item.onSelect(); - } - if(this.props.onSelect) { - this.props.onSelect(item); - } - } + handleItemClicked(event, item) { + event.stopPropagation(); + if (this.props.onToggle) { + this.props.onToggle(this.props.groups, item.id); + } + if (item.onSelect) { + item.onSelect(); + } + if (this.props.onSelect) { + this.props.onSelect(item); + } + } } class NavigationMenu extends React.Component { - static PropTypes = { - activeItemId: PropTypes.string.isRequired, - onNavigationItemClick: PropTypes.func, - menu: PropTypes.array - }; + static PropTypes = { + activeItemId: PropTypes.string.isRequired, + onNavigationItemClick: PropTypes.func, + menu: PropTypes.array + }; - render() { - const {menu, activeItemId, onNavigationItemClick} = this.props; - return ( -
- - -
); - } + render() { + const { menu, activeItemId, onNavigationItemClick } = this.props; + return ( +
+ + +
+ ); + } } function NavigationMenuHeader(props) { - return
{props.title}
; + return ( +
+ {props.title} +
+ ); } function getItemDataTestId(itemId) { - return itemId.split('|')[0]; + return itemId.split('|')[0]; } function NavigationMenuItems(props) { - const {items, activeItemId, onNavigationItemClick} = props; - return ( -
- { - items && items.map(item => ()) - } -
- ); + const { items, activeItemId, onNavigationItemClick } = props; + return ( +
+ {items && + items.map(item => ( + + ))} +
+ ); } function NavigationMenuItem(props) { - const {onNavigationItemClick, item, activeItemId} = props; - const isGroup = item.items && item.items.length > 0; - return ( -
- - {isGroup && -
- {item.items.map(subItem => ()) } -
- - } -
- ); + const { onNavigationItemClick, item, activeItemId } = props; + const isGroup = item.items && item.items.length > 0; + return ( +
+ + {isGroup && ( + +
+ {item.items.map(subItem => ( + + ))} +
+ + )} +
+ ); } function NavigationLink(props) { - const {item, activeItemId, onClick} = props; - // todo should this be button - return ( -
onClick(event, item)} - data-test-id={'navbar-group-item-' + getItemDataTestId(item.id)}> - {item.name} -
- ); + const { item, activeItemId, onClick } = props; + // todo should this be button + return ( +
onClick(event, item)} + data-test-id={'navbar-group-item-' + getItemDataTestId(item.id)}> + {item.name} +
+ ); } export default NavigationSideBar; diff --git a/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx b/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx index 57fa86f561..c9c5789622 100644 --- a/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx +++ b/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx @@ -17,125 +17,224 @@ import React from 'react'; import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import {actionsEnum} from './VersionControllerConstants.js'; +import { actionsEnum } from './VersionControllerConstants.js'; import ActionButtons from './components/ActionButtons.jsx'; import NotificationsView from 'sdc-app/onboarding/userNotifications/NotificationsView.jsx'; - class VersionController extends React.Component { - - static propTypes = { - version: PropTypes.object, - viewableVersions: PropTypes.array, - onVersionSwitching: PropTypes.func, - callVCAction: PropTypes.func, - onSave: PropTypes.func, - onClose: PropTypes.func, - isFormDataValid: PropTypes.bool, - onOpenCommentCommitModal: PropTypes.func, - isReadOnlyMode: PropTypes.bool - }; - - state = { - showPermissions: false, - showRevisions: false - }; - - render() { - let {version = {}, viewableVersions = [], onVersionSwitching, onMoreVersionsClick, callVCAction, onSave, isReadOnlyMode, itemPermission, - isFormDataValid, onClose, onManagePermissions, permissions = {}, userInfo, usersList, itemName, - onOpenCommentCommitModal, onOpenRevisionsModal, isManual, candidateInProcess, isArchived} = this.props; - return ( -
-
-
- onMoreVersionsClick({itemName, users: usersList})}/> - {isArchived &&
{i18n('Archived')}
} -
-
- this.submit(callVCAction, version) : undefined} - onRevert={callVCAction ? () => this.revert(callVCAction, version) : undefined} - onOpenRevisionsModal={onOpenRevisionsModal} - onSave={onSave ? () => onSave() : undefined} - permissions={permissions} - userInfo={userInfo} - onManagePermissions={onManagePermissions} - showPermissions={this.state.showPermissions} - onClosePermissions={()=>this.setState({showPermissions: false})} - onClickPermissions={() => this.onClickPermissions()} - onSync={callVCAction ? () => this.sync(callVCAction, version) : undefined} - onOpenCommentCommitModal={onOpenCommentCommitModal} - onCommit={callVCAction ? (comment) => this.commit(callVCAction, version, comment) : undefined} - isFormDataValid={isFormDataValid} - itemPermissions={itemPermission} - isArchived={isArchived} - isReadOnlyMode={isReadOnlyMode || candidateInProcess} - isManual={isManual} /> -
- - {onClose &&
onClose()} data-test-id='vc-cancel-btn'> X
} -
-
-
- ); - } - - onClickPermissions() { - let {onOpenPermissions, usersList} = this.props; - let {showPermissions} = this.state; - let promise = showPermissions ? Promise.resolve() : onOpenPermissions({users: usersList}); - promise.then(() => this.setState({showPermissions: !showPermissions})); - } - - - submit(callVCAction, version) { - const action = actionsEnum.SUBMIT; - callVCAction(action, version); - } - - revert(callVCAction, version) { - const action = actionsEnum.REVERT; - callVCAction(action, version); - } - - sync(callVCAction, version) { - const action = actionsEnum.SYNC; - callVCAction(action, version); - } - - commit(callVCAction, version, comment) { - const action = actionsEnum.COMMIT; - callVCAction(action, version, comment); - } - - permissions() { - - } + static propTypes = { + version: PropTypes.object, + viewableVersions: PropTypes.array, + onVersionSwitching: PropTypes.func, + callVCAction: PropTypes.func, + onSave: PropTypes.func, + onClose: PropTypes.func, + isFormDataValid: PropTypes.bool, + onOpenCommentCommitModal: PropTypes.func, + isReadOnlyMode: PropTypes.bool + }; + + state = { + showPermissions: false, + showRevisions: false + }; + + render() { + let { + version = {}, + viewableVersions = [], + onVersionSwitching, + onMoreVersionsClick, + callVCAction, + onSave, + isReadOnlyMode, + itemPermission, + isFormDataValid, + onClose, + onManagePermissions, + permissions = {}, + userInfo, + usersList, + itemName, + onOpenCommentCommitModal, + onOpenRevisionsModal, + isManual, + candidateInProcess, + isArchived + } = this.props; + return ( +
+
+
+ + onMoreVersionsClick({ + itemName, + users: usersList + }) + } + /> + {isArchived && ( +
+ {i18n('Archived')} +
+ )} +
+
+ this.submit(callVCAction, version) + : undefined + } + onRevert={ + callVCAction + ? () => this.revert(callVCAction, version) + : undefined + } + onOpenRevisionsModal={onOpenRevisionsModal} + onSave={onSave ? () => onSave() : undefined} + permissions={permissions} + userInfo={userInfo} + onManagePermissions={onManagePermissions} + showPermissions={this.state.showPermissions} + onClosePermissions={() => + this.setState({ showPermissions: false }) + } + onClickPermissions={() => this.onClickPermissions()} + onSync={ + callVCAction + ? () => this.sync(callVCAction, version) + : undefined + } + onOpenCommentCommitModal={onOpenCommentCommitModal} + onCommit={ + callVCAction + ? comment => + this.commit( + callVCAction, + version, + comment + ) + : undefined + } + isFormDataValid={isFormDataValid} + itemPermissions={itemPermission} + isArchived={isArchived} + isReadOnlyMode={ + isReadOnlyMode || candidateInProcess + } + isManual={isManual} + /> +
+ + {onClose && ( +
onClose()} + data-test-id="vc-cancel-btn"> + {' '} + X +
+ )} +
+
+
+ ); + } + + onClickPermissions() { + let { onOpenPermissions, usersList } = this.props; + let { showPermissions } = this.state; + let promise = showPermissions + ? Promise.resolve() + : onOpenPermissions({ users: usersList }); + promise.then(() => + this.setState({ showPermissions: !showPermissions }) + ); + } + + submit(callVCAction, version) { + const action = actionsEnum.SUBMIT; + callVCAction(action, version); + } + + revert(callVCAction, version) { + const action = actionsEnum.REVERT; + callVCAction(action, version); + } + + sync(callVCAction, version) { + const action = actionsEnum.SYNC; + callVCAction(action, version); + } + + commit(callVCAction, version, comment) { + const action = actionsEnum.COMMIT; + callVCAction(action, version, comment); + } + + permissions() {} } function VersionSelector(props) { - let {version = {}, onMoreVersionsClick, viewableVersions = [], onVersionSwitching} = props; - const includedVersions = viewableVersions.filter(ver => {return ver.id === version.id;}); - return (
- - {i18n('Versions Page')} -
); + let { + version = {}, + onMoreVersionsClick, + viewableVersions = [], + onVersionSwitching + } = props; + const includedVersions = viewableVersions.filter(ver => { + return ver.id === version.id; + }); + return ( +
+ + + {i18n('Versions Page')} + +
+ ); } export default VersionController; diff --git a/openecomp-ui/src/nfvo-components/panel/versionController/VersionControllerConstants.js b/openecomp-ui/src/nfvo-components/panel/versionController/VersionControllerConstants.js index ddb428a1e9..54f10c1acf 100644 --- a/openecomp-ui/src/nfvo-components/panel/versionController/VersionControllerConstants.js +++ b/openecomp-ui/src/nfvo-components/panel/versionController/VersionControllerConstants.js @@ -16,9 +16,9 @@ import keyMirror from 'nfvo-utils/KeyMirror.js'; export const actionsEnum = keyMirror({ - REVERT: 'Revert', - SYNC: 'Sync', - SUBMIT: 'Submit', - COMMIT: 'Commit', - CREATE_PACKAGE: 'Create_Package' + REVERT: 'Revert', + SYNC: 'Sync', + SUBMIT: 'Submit', + COMMIT: 'Commit', + CREATE_PACKAGE: 'Create_Package' }); diff --git a/openecomp-ui/src/nfvo-components/panel/versionController/components/ActionButtons.jsx b/openecomp-ui/src/nfvo-components/panel/versionController/components/ActionButtons.jsx index b5750817ba..4dfa117803 100644 --- a/openecomp-ui/src/nfvo-components/panel/versionController/components/ActionButtons.jsx +++ b/openecomp-ui/src/nfvo-components/panel/versionController/components/ActionButtons.jsx @@ -13,7 +13,7 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import React, {Component} from 'react'; +import React, { Component } from 'react'; import PropTypes from 'prop-types'; import enhanceWithClickOutside from 'react-click-outside'; import i18n from 'nfvo-utils/i18n/i18n.js'; @@ -22,88 +22,171 @@ import Overlay from 'nfvo-components/overlay/Overlay.jsx'; import Permissions from './Permissions.jsx'; class ClickOutsideWrapper extends Component { - handleClickOutside() { - this.props.onClose(); - } - render() { - return
{this.props.children}
; - } + handleClickOutside() { + this.props.onClose(); + } + render() { + return
{this.props.children}
; + } } -const EnhancedClickOutsideWrapper = enhanceWithClickOutside(ClickOutsideWrapper); +const EnhancedClickOutsideWrapper = enhanceWithClickOutside( + ClickOutsideWrapper +); -const VCButton = ({name, tooltipText, disabled, onClick, dataTestId}) => { - let onClickAction = disabled ? ()=>{} : onClick; - return ( -
-
- -
-
- ); +const VCButton = ({ name, tooltipText, disabled, onClick, dataTestId }) => { + let onClickAction = disabled ? () => {} : onClick; + return ( +
+
+ +
+
+ ); }; -const Separator = () => (
); +const Separator = () =>
; -const SubmitButton = ({onClick, disabled}) => ( -
onClick()} data-test-id='vc-submit-btn' className={`vc-submit-button ${disabled ? 'disabled' : ''}`}> - - {i18n('Submit')} -
+const SubmitButton = ({ onClick, disabled }) => ( +
onClick()} + data-test-id="vc-submit-btn" + className={`vc-submit-button ${disabled ? 'disabled' : ''}`}> + + {i18n('Submit')} +
); - -const ActionButtons = ({isReadOnlyMode, onSubmit, onRevert, onSave, isFormDataValid, onClickPermissions, onSync, onCommit, isArchived, - onOpenCommentCommitModal, showPermissions, onClosePermissions, permissions, onManagePermissions, userInfo, onOpenRevisionsModal, isManual, - itemPermissions: {isCertified, isCollaborator, isDirty, isOutOfSync, isUpToDate}}) => ( -
- - - {showPermissions && - - - - } - - {isCollaborator && !isArchived &&
- - {onSave &&
- onSave()} - name='version-controller-save' tooltipText={i18n('Save')} disabled={isReadOnlyMode || !isFormDataValid} /> - -
- } - - onOpenCommentCommitModal({onCommit, title: i18n('Commit')})} - name='version-controller-commit' tooltipText={i18n('Share')} disabled={isReadOnlyMode || !isDirty || isOutOfSync} /> - {onRevert && - - } - {onSubmit && -
- - -
- } -
} -
+const ActionButtons = ({ + isReadOnlyMode, + onSubmit, + onRevert, + onSave, + isFormDataValid, + onClickPermissions, + onSync, + onCommit, + isArchived, + onOpenCommentCommitModal, + showPermissions, + onClosePermissions, + permissions, + onManagePermissions, + userInfo, + onOpenRevisionsModal, + isManual, + itemPermissions: { + isCertified, + isCollaborator, + isDirty, + isOutOfSync, + isUpToDate + } +}) => ( +
+ + + {showPermissions && ( + + + + )} + + {isCollaborator && + !isArchived && ( +
+ + {onSave && ( +
+ onSave()} + name="version-controller-save" + tooltipText={i18n('Save')} + disabled={isReadOnlyMode || !isFormDataValid} + /> + +
+ )} + + + onOpenCommentCommitModal({ + onCommit, + title: i18n('Commit') + }) + } + name="version-controller-commit" + tooltipText={i18n('Share')} + disabled={isReadOnlyMode || !isDirty || isOutOfSync} + /> + {onRevert && ( + + )} + {onSubmit && ( +
+ + +
+ )} +
+ )} +
); ActionButtons.propTypes = { - version: PropTypes.object, - onSubmit: PropTypes.func, - onRevert: PropTypes.func, - onSave: PropTypes.func, - isLatestVersion: PropTypes.bool, - isCheckedIn: PropTypes.bool, - isCheckedOut: PropTypes.bool, - isFormDataValid: PropTypes.bool, - isReadOnlyMode: PropTypes.bool + version: PropTypes.object, + onSubmit: PropTypes.func, + onRevert: PropTypes.func, + onSave: PropTypes.func, + isLatestVersion: PropTypes.bool, + isCheckedIn: PropTypes.bool, + isCheckedOut: PropTypes.bool, + isFormDataValid: PropTypes.bool, + isReadOnlyMode: PropTypes.bool }; export default ActionButtons; diff --git a/openecomp-ui/src/nfvo-components/panel/versionController/components/CommitCommentModal.jsx b/openecomp-ui/src/nfvo-components/panel/versionController/components/CommitCommentModal.jsx index 600eaeefaa..ae0913f3a9 100644 --- a/openecomp-ui/src/nfvo-components/panel/versionController/components/CommitCommentModal.jsx +++ b/openecomp-ui/src/nfvo-components/panel/versionController/components/CommitCommentModal.jsx @@ -15,59 +15,66 @@ */ import React from 'react'; -import {connect} from 'react-redux'; +import { connect } from 'react-redux'; import i18n from 'nfvo-utils/i18n/i18n.js'; import Form from 'nfvo-components/input/validation/Form.jsx'; import Input from 'nfvo-components/input/validation/Input.jsx'; -import {actionTypes as modalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js'; +import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js'; import keyMirror from 'nfvo-utils/KeyMirror.js'; export const CommitModalType = keyMirror({ - COMMIT: null, - COMMIT_SUBMIT: null - + COMMIT: null, + COMMIT_SUBMIT: null }); -export const mapActionToProps = (dispatch) => { - return { - onClose: () => dispatch({ - type: modalActionTypes.GLOBAL_MODAL_CLOSE - }) - }; +export const mapActionToProps = dispatch => { + return { + onClose: () => + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_CLOSE + }) + }; }; class CommitCommentModal extends React.Component { + state = { + comment: '' + }; - state = { - comment: '' - }; - - render() { - const {onCommit, onClose, type} = this.props; - const [commitButtonText, descriptionText] = type === CommitModalType.COMMIT ? - [i18n('Commit'), i18n('You are about to commit your version')] : - [i18n('Commit & Submit'), i18n('You must commit your changes before the submit')]; + render() { + const { onCommit, onClose, type } = this.props; + const [commitButtonText, descriptionText] = + type === CommitModalType.COMMIT + ? [i18n('Commit'), i18n('You are about to commit your version')] + : [ + i18n('Commit & Submit'), + i18n('You must commit your changes before the submit') + ]; - return ( -
{onCommit(this.state.comment); onClose();} } - onReset={onClose} - submitButtonText={commitButtonText} - labledButtons={true} - isValid={true} - className='comment-commit-form'> -
{descriptionText}
- this.setState({comment: comment})} - label={i18n('Enter Commit Comment:')} - value={this.state.comment} - type='textarea'/> -
- ); - } + return ( +
{ + onCommit(this.state.comment); + onClose(); + }} + onReset={onClose} + submitButtonText={commitButtonText} + labledButtons={true} + isValid={true} + className="comment-commit-form"> +
{descriptionText}
+ this.setState({ comment: comment })} + label={i18n('Enter Commit Comment:')} + value={this.state.comment} + type="textarea" + /> +
+ ); + } } export default connect(null, mapActionToProps)(CommitCommentModal); diff --git a/openecomp-ui/src/nfvo-components/panel/versionController/components/Permissions.jsx b/openecomp-ui/src/nfvo-components/panel/versionController/components/Permissions.jsx index 952bd4fb58..6e0ae8187b 100644 --- a/openecomp-ui/src/nfvo-components/panel/versionController/components/Permissions.jsx +++ b/openecomp-ui/src/nfvo-components/panel/versionController/components/Permissions.jsx @@ -18,48 +18,76 @@ import React from 'react'; import i18n from 'nfvo-utils/i18n/i18n.js'; import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; -const Contributor = ({name, role, id, userInfo}) => { +const Contributor = ({ name, role, id, userInfo }) => { + const selected = id === userInfo.userId ? 'selected' : ''; - const selected = id === userInfo.userId ? 'selected' : ''; - - return( -
-
-
-
- -
-
-
-
{name}
-

{role}

-
-
-
- ); + return ( +
+
+
+
+ +
+
+
+
{name}
+
+

{role}

+
+
+
+
+ ); }; -const Permissions = ({permissions: {owner, contributors}, onManagePermissions, userInfo, onClosePermissions}) => { - - return ( -
-
-

{i18n('PERMISSIONS')}

-
-
- - {contributors.map(item => item.userId !== owner.userId && )} -
-
- { - owner.userId === userInfo.userId && -
{ onClosePermissions(); onManagePermissions(); }} className='manage-permissions-btn'> - {i18n('Manage Permissions')} -
- } -
-
- ); +const Permissions = ({ + permissions: { owner, contributors }, + onManagePermissions, + userInfo, + onClosePermissions +}) => { + return ( +
+
+

+ {i18n('PERMISSIONS')} +

+
+
+ + {contributors.map( + item => + item.userId !== owner.userId && ( + + ) + )} +
+
+ {owner.userId === userInfo.userId && ( +
{ + onClosePermissions(); + onManagePermissions(); + }} + className="manage-permissions-btn"> + {i18n('Manage Permissions')} +
+ )} +
+
+ ); }; export default Permissions; -- cgit 1.2.3-korg