Add collaboration feature

Issue-ID: SDC-767
Change-Id: I14fb4c1f54086ed03a56a7ff7fab9ecd40381795
Signed-off-by: talig <talig@amdocs.com>
diff --git a/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx b/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx
index 922db05..5273785 100644
--- a/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx
+++ b/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx
@@ -14,51 +14,66 @@
  * permissions and limitations under the License.
  */
 import React from 'react';
+import PropTypes from 'prop-types';
 import i18n from 'nfvo-utils/i18n/i18n.js';
 
-import {actionsEnum, statusEnum, statusBarTextMap } from './VersionControllerConstants.js';
-import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
-import Tooltip from 'react-bootstrap/lib/Tooltip.js';
-import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.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: React.PropTypes.object,
-		viewableVersions: React.PropTypes.array,
-		onVersionSwitching: React.PropTypes.func,
-		isCheckedOut: React.PropTypes.bool.isRequired,
-		status: React.PropTypes.string.isRequired,
-		callVCAction: React.PropTypes.func,
-		onSave: React.PropTypes.func,
-		onClose: React.PropTypes.func,
-		isFormDataValid: React.PropTypes.bool
+		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 {status, isCheckedOut, version = {},  viewableVersions = [], onVersionSwitching, callVCAction, onSave, isFormDataValid, onClose} = this.props;
-		let isCheckedIn = Boolean(status === statusEnum.CHECK_IN_STATUS);
-		let isLatestVersion = Boolean(version.id === viewableVersions[viewableVersions.length - 1].id);
-		if (!isLatestVersion) {
-			status = statusEnum.PREVIOUS_VERSION;
-		}
+		let {version = {},  viewableVersions = [], onVersionSwitching, onMoreVersionsClick, callVCAction, onSave, isReadOnlyMode, itemPermission,
+				isFormDataValid, onClose, onManagePermissions, permissions = {},  userInfo, usersList, itemName, onOpenCommentCommitModal, onOpenRevisionsModal, isManual} = this.props;
 		return (
 			<div className='version-controller-bar'>
 				<div className='vc-container'>
 					<div className='version-status-container'>
-						<VersionSelector viewableVersions={viewableVersions} version={version} onVersionSwitching={onVersionSwitching} />
-						<StatusBarUpdates status={status}/>
+						<VersionSelector
+							viewableVersions={viewableVersions}
+							version={version}
+							onVersionSwitching={onVersionSwitching}
+							onMoreVersionsClick={() => onMoreVersionsClick({itemName, users: usersList})}/>
 					</div>
 					<div className='save-submit-cancel-container'>
 						<ActionButtons onSubmit={callVCAction ? () => this.submit(callVCAction, version) : undefined}
-							onRevert={callVCAction ? () => this.revertCheckout(callVCAction, version) : undefined}
-							status={status}
-							onCheckinCheckout={callVCAction ? () => this.checkinCheckoutVersion(callVCAction, version) : undefined}
+							onRevert={callVCAction ? () => this.revert(callVCAction, version) : undefined}
+							onOpenRevisionsModal={onOpenRevisionsModal}
 							onSave={onSave ? () => onSave() : undefined}
-							isLatestVersion={isLatestVersion}
-							isCheckedOut={isCheckedOut}
-							isCheckedIn={isCheckedIn} isFormDataValid={isFormDataValid} version={version}/>
+							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}
+							isReadOnlyMode={isReadOnlyMode}
+							isManual={isManual} />
+						<div className='vc-separator'></div>
+						<NotificationsView />
 						{onClose && <div className='vc-nav-item-close' onClick={() => onClose()} data-test-id='vc-cancel-btn'> X</div>}
 					</div>
 				</div>
@@ -66,116 +81,57 @@
 		);
 	}
 
+	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);
 	}
 
-	revertCheckout(callVCAction, version) {
-		const action = actionsEnum.UNDO_CHECK_OUT;
+	revert(callVCAction, version) {
+		const action = actionsEnum.REVERT;
 		callVCAction(action, version);
 	}
 
-	checkinCheckoutVersion(callVCAction, version) {
-		if (this.props.isCheckedOut) {
-			this.checkin(callVCAction, version);
-		}
-		else {
-			this.checkout(callVCAction, version);
-		}
-	}
-	checkin(callVCAction, version) {
-		const action = actionsEnum.CHECK_IN;
-		if (this.props.onSave) {
-			this.props.onSave().then(()=>{
-				callVCAction(action, version);
-			});
-		}else{
-			callVCAction(action, version);
-		}
-
-	}
-	checkout(callVCAction, version) {
-		const action = actionsEnum.CHECK_OUT;
+	sync(callVCAction, version) {
+		const action = actionsEnum.SYNC;
 		callVCAction(action, version);
 	}
-}
 
-class ActionButtons extends React.Component {
-	static propTypes = {
-		version: React.PropTypes.object,
-		onSubmit: React.PropTypes.func,
-		onRevert: React.PropTypes.func,
-		onSave: React.PropTypes.func,
-		isLatestVersion: React.PropTypes.bool,
-		isCheckedIn: React.PropTypes.bool,
-		isCheckedOut: React.PropTypes.bool,
-		isFormDataValid: React.PropTypes.bool
-	};
-	render() {
-		const {onSubmit, onRevert, onSave, isLatestVersion, isCheckedIn, isCheckedOut, isFormDataValid, version, status, onCheckinCheckout} = this.props;
-		const [checkinBtnIconSvg, checkinCheckoutBtnTitle] = status === statusEnum.CHECK_OUT_STATUS ?
-			['versionControllerLockOpen', i18n('Check In')] :
-			['versionControllerLockClosed', i18n('Check Out')];
-		const disabled = (isLatestVersion && onCheckinCheckout && status !== statusEnum.LOCK_STATUS) ? false : true;
-		return (
-			<div className='action-buttons'>
-				<VCButton dataTestId='vc-checkout-btn' onClick={onCheckinCheckout} isDisabled={disabled}
-					name={checkinBtnIconSvg} tooltipText={checkinCheckoutBtnTitle}/>
-				{onSubmit && onRevert &&
-					<div className='version-control-buttons'>
-						<VCButton dataTestId='vc-submit-btn' onClick={onSubmit}  isDisabled={!isCheckedIn || !isLatestVersion}
-							name='versionControllerSubmit' tooltipText={i18n('Submit')}/>
-						<VCButton dataTestId='vc-revert-btn' onClick={onRevert} isDisabled={!isCheckedOut || version.label === '0.1' || !isLatestVersion}
-							name='versionControllerRevert' tooltipText={i18n('Revert')}/>
-					</div>
-				}
-				{onSave &&
-					<VCButton dataTestId='vc-save-btn' onClick={() => onSave()} isDisabled={!isCheckedOut || !isFormDataValid || !isLatestVersion}
-						name='versionControllerSave'  tooltipText={i18n('Save')}/>
-				}
-			</div>
-		);
+	commit(callVCAction, version, comment) {
+		const action = actionsEnum.COMMIT;
+		callVCAction(action, version, comment);
 	}
-}
 
-function StatusBarUpdates({status}) {
-	return (
-		<div className='vc-status'>
-			<span className='status-text'>{i18n(statusBarTextMap[status])}</span>
-		</div>
-	);
-}
+	permissions() {
 
-function VCButton({name, tooltipText, isDisabled, onClick, dataTestId}) {
-	let onClickAction = isDisabled ? ()=>{} : onClick;
-	let disabled = isDisabled ? 'disabled' : '';
-
-	return (
-		<OverlayTrigger placement='top' overlay={<Tooltip id='vc-tooltip'>{tooltipText}</Tooltip>}>
-			<div disabled={disabled} className='action-buttons-svg'>
-				<SVGIcon data-test-id={dataTestId} disabled={isDisabled} onClick={onClickAction ? onClickAction : undefined} name={name}/>
-			</div>
-		</OverlayTrigger>
-	);
+	}
 }
 
 function VersionSelector(props) {
-	let {version = {}, viewableVersions = [], onVersionSwitching} = props;
+	let {version = {}, onMoreVersionsClick, viewableVersions = [], onVersionSwitching} = props;
 	const includedVersions = viewableVersions.filter(ver => {return ver.id === version.id;});
 	return (<div className='version-section-wrapper'>
 		<select className='version-selector'
-			onChange={ev => onVersionSwitching && onVersionSwitching({id: ev.target.value, label: ev.target.value})}
-			value={version.label}>
+			onChange={ev => onVersionSwitching && onVersionSwitching(viewableVersions.find(version => version.id === ev.target.value))}
+			value={version.id}
+			data-test-id='vc-versions-select-box'>
 				{viewableVersions && viewableVersions.map(viewVersion => {
 					return (
-						<option key={viewVersion.id} value={viewVersion.id} data-test-id='vc-version-option'>{`V ${viewVersion.label}`}</option>
+						<option key={viewVersion.id} value={viewVersion.id} data-test-id='vc-version-option'>{`V ${viewVersion.name} ${viewVersion.status}`}</option>
 					);
 				})
 				}
 				{!includedVersions.length &&
-				<option key={version.id} value={version.id}>{`V ${version.label}`}</option>}
+				<option key={version.id} value={version.id} data-test-id='vc-selected-version-option'>{`V ${version.name} ${version.status}`}</option>}
 		</select>
+		<span onClick={onMoreVersionsClick} className='version-selector-more-versions' data-test-id='vc-versions-page-link'>{i18n('Versions Page')}</span>
 	</div>);
 }