summaryrefslogtreecommitdiffstats
path: root/openecomp-ui/src/sdc-app/onboarding/versionsPage
diff options
context:
space:
mode:
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/versionsPage')
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.js134
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.jsx201
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js156
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageConstants.js10
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageReducer.js44
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/components/PermissionsView.jsx141
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/components/VersionList.jsx251
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreation.js58
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationActionHelper.js109
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationConstants.js10
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationReducer.js59
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationView.jsx215
12 files changed, 813 insertions, 575 deletions
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.js b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.js
index 0fd0eabd86..457d096219 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.js
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.js
@@ -14,76 +14,100 @@
* permissions and limitations under the License.
*/
-import {connect} from 'react-redux';
+import { connect } from 'react-redux';
import VersionsPageActionHelper from './VersionsPageActionHelper.js';
import VersionsPageCreationActionHelper from './creation/VersionsPageCreationActionHelper.js';
import PermissionsActionHelper from '../permissions/PermissionsActionHelper.js';
-import {onboardingMethod as onboardingMethodType} from 'sdc-app/onboarding/softwareProduct/SoftwareProductConstants.js';
+import { onboardingMethod as onboardingMethodType } from 'sdc-app/onboarding/softwareProduct/SoftwareProductConstants.js';
import VersionsPageView from './VersionsPage.jsx';
export const mapStateToProps = ({
- users: {userInfo},
- versionsPage: {permissions, versionsList},
- currentScreen: {itemPermission: {isCollaborator, isArchived}, props: {itemId}},
- softwareProductList = []
+ users: { userInfo },
+ versionsPage: { permissions, versionsList },
+ currentScreen: {
+ itemPermission: { isCollaborator, isArchived },
+ props: { itemId }
+ },
+ softwareProductList = []
}) => {
+ let { versions = [], selectedVersion } = versionsList;
+ let { owner, contributors, viewers } = permissions;
- let {versions = [], selectedVersion} = versionsList;
- let {owner, contributors, viewers} = permissions;
-
- // sorting the version list
- versions.sort((a,b) => {
- let statusCompare = b.status.localeCompare(a.status);
- if (statusCompare === 0) {
- return b.modificationTime - a.modificationTime;
- } else {
- return statusCompare;
- }
-
- });
- const curentSoftwareProduct = softwareProductList.find(item => item.id === itemId);
- return {
- versions,
- contributors,
- viewers,
- owner,
- currentUser: userInfo,
- selectedVersion,
- isCollaborator,
- isManual: curentSoftwareProduct && curentSoftwareProduct.onboardingMethod === onboardingMethodType.MANUAL,
- isArchived
- };
-
+ // sorting the version list
+ versions.sort((a, b) => {
+ let statusCompare = b.status.localeCompare(a.status);
+ if (statusCompare === 0) {
+ return b.modificationTime - a.modificationTime;
+ } else {
+ return statusCompare;
+ }
+ });
+ const curentSoftwareProduct = softwareProductList.find(
+ item => item.id === itemId
+ );
+ return {
+ versions,
+ contributors,
+ viewers,
+ owner,
+ currentUser: userInfo,
+ selectedVersion,
+ isCollaborator,
+ isManual:
+ curentSoftwareProduct &&
+ curentSoftwareProduct.onboardingMethod ===
+ onboardingMethodType.MANUAL,
+ isArchived
+ };
};
-export const mapActionsToProps = (dispatch, {itemType, itemId, additionalProps}) => {
- return {
- onNavigateToVersion({version}) {
- VersionsPageActionHelper.onNavigateToVersion(dispatch, {version, itemId, itemType, additionalProps});
- },
+export const mapActionsToProps = (
+ dispatch,
+ { itemType, itemId, additionalProps }
+) => {
+ return {
+ onNavigateToVersion({ version }) {
+ VersionsPageActionHelper.onNavigateToVersion(dispatch, {
+ version,
+ itemId,
+ itemType,
+ additionalProps
+ });
+ },
- onSelectVersion({version}) {
- VersionsPageActionHelper.selectVersion(dispatch, {version});
- },
+ onSelectVersion({ version }) {
+ VersionsPageActionHelper.selectVersion(dispatch, { version });
+ },
- onCreateVersion({version}) {
- VersionsPageCreationActionHelper.open(dispatch, {baseVersion: version, itemId, itemType, additionalProps});
- },
+ onCreateVersion({ version }) {
+ VersionsPageCreationActionHelper.open(dispatch, {
+ baseVersion: version,
+ itemId,
+ itemType,
+ additionalProps
+ });
+ },
- onManagePermissions() {
- PermissionsActionHelper.openPermissonsManager(dispatch, {itemId, askForRights: false});
- },
+ onManagePermissions() {
+ PermissionsActionHelper.openPermissonsManager(dispatch, {
+ itemId,
+ askForRights: false
+ });
+ },
- onTreeFullScreen(treeProps) {
- VersionsPageActionHelper.openTree(dispatch, treeProps);
- },
+ onTreeFullScreen(treeProps) {
+ VersionsPageActionHelper.openTree(dispatch, treeProps);
+ },
- onModalNodeClick({version}) {
- VersionsPageActionHelper.selectVersionFromModal(dispatch, {version});
- },
- onArchive: () => VersionsPageActionHelper.archiveItem(dispatch, itemId),
- onRestore: () => VersionsPageActionHelper.restoreItemFromArchive(dispatch, itemId)
- };
+ onModalNodeClick({ version }) {
+ VersionsPageActionHelper.selectVersionFromModal(dispatch, {
+ version
+ });
+ },
+ onArchive: () => VersionsPageActionHelper.archiveItem(dispatch, itemId),
+ onRestore: () =>
+ VersionsPageActionHelper.restoreItemFromArchive(dispatch, itemId)
+ };
};
export default connect(mapStateToProps, mapActionsToProps)(VersionsPageView);
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.jsx b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.jsx
index f8417fafbf..7f7af8130f 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.jsx
@@ -22,81 +22,144 @@ import Button from 'sdc-ui/lib/react/Button.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
import featureToggle from 'sdc-app/features/featureToggle.js';
-const DepricateButton = ({depricateAction, title}) => (
- <div className='depricate-btn-wrapper'>
- <Button data-test-id='depricate-action-btn' className='depricate-btn' onClick={depricateAction}>{title}</Button>
- </div>
+const DepricateButton = ({ depricateAction, title }) => (
+ <div className="depricate-btn-wrapper">
+ <Button
+ data-test-id="depricate-action-btn"
+ className="depricate-btn"
+ onClick={depricateAction}>
+ {title}
+ </Button>
+ </div>
);
-const FeatureDepricatedButton = featureToggle('ARCHIVE_ITEM')(DepricateButton);
+const FeatureDepricatedButton = featureToggle('ARCHIVE_ITEM')(DepricateButton);
-const VersionPageTitle = ({itemName, depricatedTitle, isArchived, onRestore, onArchive}) => {
- return (
- <div className='version-page-header'>
- <div className='versions-page-title'>{`${i18n('Available Versions')} - ${itemName} ${depricatedTitle}`}</div>
- <FeatureDepricatedButton depricateAction={isArchived ? () => onRestore() : () => onArchive() } title={i18n(isArchived ? 'RESTORE' : 'ARCHIVE')}/>
- </div>
- );
+const VersionPageTitle = ({
+ itemName,
+ depricatedTitle,
+ isArchived,
+ onRestore,
+ onArchive
+}) => {
+ return (
+ <div className="version-page-header">
+ <div className="versions-page-title">{`${i18n(
+ 'Available Versions'
+ )} - ${itemName} ${depricatedTitle}`}</div>
+ <FeatureDepricatedButton
+ depricateAction={
+ isArchived ? () => onRestore() : () => onArchive()
+ }
+ title={i18n(isArchived ? 'RESTORE' : 'ARCHIVE')}
+ />
+ </div>
+ );
};
class VersionsPage extends React.Component {
- state = {
- showExpanded : false
- }
- render() {
- let { versions, owner, contributors, currentUser, isCollaborator, itemName = '', viewers, onSelectVersion, onNavigateToVersion,
- onTreeFullScreen, onManagePermissions, onCreateVersion, selectedVersion, onModalNodeClick, isManual, isArchived, onArchive, onRestore} = this.props;
- const depricatedTitle = isArchived ? i18n('(Archived)') : '';
- return (
- <div className='versions-page-view'>
- <VersionPageTitle
- itemName={itemName}
- depricatedTitle={depricatedTitle}
- onArchive={onArchive}
- isArchived={isArchived}
- onRestore={onRestore}/>
- <PermissionsView
- owner={owner}
- contributors={contributors}
- viewers={viewers}
- currentUser={currentUser}
- isManual={isManual}
- onManagePermissions={onManagePermissions}/>
- <div className='versions-page-list-and-tree'>
- <div className='version-tree-wrapper'>
- <div className='version-tree-title-container'>
- <div className='version-tree-title'>{i18n('Version Tree')}</div>
- {this.state.showExpanded && <SVGIcon name='expand' className='version-tree-full-screen' onClick={() => onTreeFullScreen({
- name: 'versions-tree-popup',
- width: 798,
- height: 500,
- nodes: versions.map(version => ({id: version.id, name: version.name, parent: version.baseId || ''})),
- onNodeClick: (version) => onModalNodeClick({version}),
- selectedNodeId: selectedVersion,
- scrollable: true,
- toWiden: true
- })} />}
- </div>
- <Tree
- name={'versions-tree'}
- width={200}
- allowScaleWidth={false}
- nodes={versions.map(version => ({id: version.id, name: version.name, parent: version.baseId || ''}))}
- onNodeClick={version => onSelectVersion({version})}
- onRenderedBeyondWidth={() => {this.setState({showExpanded : true});}}
- selectedNodeId={selectedVersion}/>
- </div>
- <VersionList
- versions={versions}
- onSelectVersion={onSelectVersion}
- onNavigateToVersion={onNavigateToVersion}
- onCreateVersion={isArchived ? false : onCreateVersion}
- selectedVersion={selectedVersion}
- isCollaborator={isCollaborator} />
- </div>
- </div>
- );
- }
+ state = {
+ showExpanded: false
+ };
+ render() {
+ let {
+ versions,
+ owner,
+ contributors,
+ currentUser,
+ isCollaborator,
+ itemName = '',
+ viewers,
+ onSelectVersion,
+ onNavigateToVersion,
+ onTreeFullScreen,
+ onManagePermissions,
+ onCreateVersion,
+ selectedVersion,
+ onModalNodeClick,
+ isManual,
+ isArchived,
+ onArchive,
+ onRestore
+ } = this.props;
+ const depricatedTitle = isArchived ? i18n('(Archived)') : '';
+ return (
+ <div className="versions-page-view">
+ <VersionPageTitle
+ itemName={itemName}
+ depricatedTitle={depricatedTitle}
+ onArchive={onArchive}
+ isArchived={isArchived}
+ onRestore={onRestore}
+ />
+ <PermissionsView
+ owner={owner}
+ contributors={contributors}
+ viewers={viewers}
+ currentUser={currentUser}
+ isManual={isManual}
+ onManagePermissions={onManagePermissions}
+ />
+ <div className="versions-page-list-and-tree">
+ <div className="version-tree-wrapper">
+ <div className="version-tree-title-container">
+ <div className="version-tree-title">
+ {i18n('Version Tree')}
+ </div>
+ {this.state.showExpanded && (
+ <SVGIcon
+ name="expand"
+ className="version-tree-full-screen"
+ onClick={() =>
+ onTreeFullScreen({
+ name: 'versions-tree-popup',
+ width: 798,
+ height: 500,
+ nodes: versions.map(version => ({
+ id: version.id,
+ name: version.name,
+ parent: version.baseId || ''
+ })),
+ onNodeClick: version =>
+ onModalNodeClick({ version }),
+ selectedNodeId: selectedVersion,
+ scrollable: true,
+ toWiden: true
+ })
+ }
+ />
+ )}
+ </div>
+ <Tree
+ name={'versions-tree'}
+ width={200}
+ allowScaleWidth={false}
+ nodes={versions.map(version => ({
+ id: version.id,
+ name: version.name,
+ parent: version.baseId || ''
+ }))}
+ onNodeClick={version =>
+ onSelectVersion({ version })
+ }
+ onRenderedBeyondWidth={() => {
+ this.setState({ showExpanded: true });
+ }}
+ selectedNodeId={selectedVersion}
+ />
+ </div>
+ <VersionList
+ versions={versions}
+ onSelectVersion={onSelectVersion}
+ onNavigateToVersion={onNavigateToVersion}
+ onCreateVersion={isArchived ? false : onCreateVersion}
+ selectedVersion={selectedVersion}
+ isCollaborator={isCollaborator}
+ />
+ </div>
+ </div>
+ );
+ }
}
export default VersionsPage;
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js
index d475c03c31..606b17b897 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js
@@ -14,94 +14,96 @@
* permissions and limitations under the License.
*/
import ItemsHelper from '../../common/helpers/ItemsHelper.js';
-import {actionTypes} from './VersionsPageConstants.js';
-import {itemTypes} from './VersionsPageConstants.js';
-import {modalContentMapper} from 'sdc-app/common/modal/ModalContentMapper.js';
-import {actionTypes as modalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js';
+import { actionTypes } from './VersionsPageConstants.js';
+import { itemTypes } from './VersionsPageConstants.js';
+import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js';
+import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
import ScreensHelper from 'sdc-app/common/helpers/ScreensHelper.js';
-import {enums, screenTypes} from 'sdc-app/onboarding/OnboardingConstants.js';
-
+import { enums, screenTypes } from 'sdc-app/onboarding/OnboardingConstants.js';
const VersionsPageActionHelper = {
- fetchVersions(dispatch, {itemType, itemId}) {
- return ItemsHelper.fetchVersions({itemId}).then(response => {
- dispatch({
- type: actionTypes.VERSIONS_LOADED,
- versions: response.results,
- itemType,
- itemId
- });
- return Promise.resolve(response);
- });
- },
+ fetchVersions(dispatch, { itemType, itemId }) {
+ return ItemsHelper.fetchVersions({ itemId }).then(response => {
+ dispatch({
+ type: actionTypes.VERSIONS_LOADED,
+ versions: response.results,
+ itemType,
+ itemId
+ });
+ return Promise.resolve(response);
+ });
+ },
- selectVersion(dispatch, {version}) {
- dispatch({
- type: actionTypes.SELECT_VERSION,
- versionId: version.id
- });
- },
+ selectVersion(dispatch, { version }) {
+ dispatch({
+ type: actionTypes.SELECT_VERSION,
+ versionId: version.id
+ });
+ },
- selectNone(dispatch) {
- dispatch({ type: actionTypes.SELECT_NONE });
- },
+ selectNone(dispatch) {
+ dispatch({ type: actionTypes.SELECT_NONE });
+ },
- onNavigateToVersion(dispatch, {version, itemId, itemType}) {
- switch (itemType) {
- case itemTypes.LICENSE_MODEL:
- ScreensHelper.loadScreen(dispatch, {
- screen: enums.SCREEN.LICENSE_MODEL_OVERVIEW, screenType: screenTypes.LICENSE_MODEL,
- props: {licenseModelId: itemId, version}
- });
- break;
- case itemTypes.SOFTWARE_PRODUCT:
- ScreensHelper.loadScreen(dispatch, {
- screen: enums.SCREEN.SOFTWARE_PRODUCT_LANDING_PAGE, screenType: screenTypes.SOFTWARE_PRODUCT,
- props: {softwareProductId: itemId, version}
- });
- break;
- }
- },
+ onNavigateToVersion(dispatch, { version, itemId, itemType }) {
+ switch (itemType) {
+ case itemTypes.LICENSE_MODEL:
+ ScreensHelper.loadScreen(dispatch, {
+ screen: enums.SCREEN.LICENSE_MODEL_OVERVIEW,
+ screenType: screenTypes.LICENSE_MODEL,
+ props: { licenseModelId: itemId, version }
+ });
+ break;
+ case itemTypes.SOFTWARE_PRODUCT:
+ ScreensHelper.loadScreen(dispatch, {
+ screen: enums.SCREEN.SOFTWARE_PRODUCT_LANDING_PAGE,
+ screenType: screenTypes.SOFTWARE_PRODUCT,
+ props: { softwareProductId: itemId, version }
+ });
+ break;
+ }
+ },
- openTree(dispatch, treeProps) {
- dispatch({
- type: modalActionTypes.GLOBAL_MODAL_SHOW,
- data: {
- modalComponentName: modalContentMapper.VERSION_TREE,
- modalComponentProps: treeProps,
- onDeclined: () => dispatch({
- type: modalActionTypes.GLOBAL_MODAL_CLOSE
- }),
- modalClassName: 'versions-tree-modal',
- cancelButtonText: i18n('Close'),
- title: i18n('Version Tree')
- }
- });
- },
+ openTree(dispatch, treeProps) {
+ dispatch({
+ type: modalActionTypes.GLOBAL_MODAL_SHOW,
+ data: {
+ modalComponentName: modalContentMapper.VERSION_TREE,
+ modalComponentProps: treeProps,
+ onDeclined: () =>
+ dispatch({
+ type: modalActionTypes.GLOBAL_MODAL_CLOSE
+ }),
+ modalClassName: 'versions-tree-modal',
+ cancelButtonText: i18n('Close'),
+ title: i18n('Version Tree')
+ }
+ });
+ },
- selectVersionFromModal(dispatch, {version}) {
- dispatch({
- type: modalActionTypes.GLOBAL_MODAL_CLOSE
- });
- this.selectVersion(dispatch, {version});
- },
+ selectVersionFromModal(dispatch, { version }) {
+ dispatch({
+ type: modalActionTypes.GLOBAL_MODAL_CLOSE
+ });
+ this.selectVersion(dispatch, { version });
+ },
- archiveItem(dispatch, itemId) {
- ItemsHelper.archiveItem(itemId).then(() => {
- ScreensHelper.loadScreen(dispatch, {
- screen: enums.SCREEN.ONBOARDING_CATALOG
- });
- });
- },
+ archiveItem(dispatch, itemId) {
+ ItemsHelper.archiveItem(itemId).then(() => {
+ ScreensHelper.loadScreen(dispatch, {
+ screen: enums.SCREEN.ONBOARDING_CATALOG
+ });
+ });
+ },
- restoreItemFromArchive(dispatch, itemId) {
- ItemsHelper.restoreItem(itemId).then(() => {
- ScreensHelper.loadScreen(dispatch, {
- screen: enums.SCREEN.ONBOARDING_CATALOG
- });
- });
- }
+ restoreItemFromArchive(dispatch, itemId) {
+ ItemsHelper.restoreItem(itemId).then(() => {
+ ScreensHelper.loadScreen(dispatch, {
+ screen: enums.SCREEN.ONBOARDING_CATALOG
+ });
+ });
+ }
};
export default VersionsPageActionHelper;
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageConstants.js b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageConstants.js
index 983ab79a14..3a3879ddb3 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageConstants.js
@@ -16,12 +16,12 @@
import keyMirror from 'nfvo-utils/KeyMirror.js';
export const actionTypes = keyMirror({
- VERSIONS_LOADED: null,
- SELECT_VERSION: null,
- SELECT_NONE: null
+ VERSIONS_LOADED: null,
+ SELECT_VERSION: null,
+ SELECT_NONE: null
});
export const itemTypes = {
- LICENSE_MODEL: 'vendor-license-models',
- SOFTWARE_PRODUCT: 'vendor-software-products'
+ LICENSE_MODEL: 'vendor-license-models',
+ SOFTWARE_PRODUCT: 'vendor-software-products'
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageReducer.js b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageReducer.js
index 9b6fa9f803..c270278f21 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageReducer.js
@@ -13,30 +13,34 @@
* or implied. See the License for the specific language governing
* permissions and limitations under the License.
*/
-import {actionTypes} from './VersionsPageConstants.js';
-import {combineReducers} from 'redux';
+import { actionTypes } from './VersionsPageConstants.js';
+import { combineReducers } from 'redux';
import VersionsPageCreationReducer from './creation/VersionsPageCreationReducer.js';
import PermissionsReducer from '../permissions/PermissionsReducer.js';
-import {createPlainDataReducer} from 'sdc-app/common/reducers/PlainDataReducer.js';
+import { createPlainDataReducer } from 'sdc-app/common/reducers/PlainDataReducer.js';
function VersionsListReducer(state = {}, action) {
- switch (action.type) {
- case actionTypes.VERSIONS_LOADED:
- let {versions, itemType = state.itemType, itemId} = action;
- return {...state, versions, itemType, itemId};
- case actionTypes.SELECT_VERSION:
- return {...state, selectedVersion: action.versionId === state.selectedVersion ? null : action.versionId};
- case actionTypes.SELECT_NONE:
- return {...state, selectedVersion: null};
- default:
- return state;
- }
-};
-
-
+ switch (action.type) {
+ case actionTypes.VERSIONS_LOADED:
+ let { versions, itemType = state.itemType, itemId } = action;
+ return { ...state, versions, itemType, itemId };
+ case actionTypes.SELECT_VERSION:
+ return {
+ ...state,
+ selectedVersion:
+ action.versionId === state.selectedVersion
+ ? null
+ : action.versionId
+ };
+ case actionTypes.SELECT_NONE:
+ return { ...state, selectedVersion: null };
+ default:
+ return state;
+ }
+}
export default combineReducers({
- versionCreation: createPlainDataReducer(VersionsPageCreationReducer),
- versionsList: VersionsListReducer,
- permissions: PermissionsReducer
+ versionCreation: createPlainDataReducer(VersionsPageCreationReducer),
+ versionsList: VersionsListReducer,
+ permissions: PermissionsReducer
});
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/components/PermissionsView.jsx b/openecomp-ui/src/sdc-app/onboarding/versionsPage/components/PermissionsView.jsx
index 26f8450f4c..74d88f0b52 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/components/PermissionsView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/components/PermissionsView.jsx
@@ -22,61 +22,108 @@ import Tooltip from 'react-bootstrap/lib/Tooltip.js';
const maxContributors = 6;
-function extraUsersTooltip (extraUsers) {
- return (
- <Tooltip className='extra-users-tooltip' id='extra-users-tooltip-id'>
- {extraUsers.map(extraUser => <div key={extraUser.userId} className='extra-user'>{extraUser.fullName}</div>)}
- </Tooltip>
- );
+function extraUsersTooltip(extraUsers) {
+ return (
+ <Tooltip className="extra-users-tooltip" id="extra-users-tooltip-id">
+ {extraUsers.map(extraUser => (
+ <div key={extraUser.userId} className="extra-user">
+ {extraUser.fullName}
+ </div>
+ ))}
+ </Tooltip>
+ );
}
-const User = ({user, isCurrentUser, dataTestId}) => (
- <SVGIcon className={`user-view ${isCurrentUser ? 'current-user' : ''}`} name='user' label={user.fullName} labelPosition='right' color='primary'
- data-test-id={dataTestId}/>
+const User = ({ user, isCurrentUser, dataTestId }) => (
+ <SVGIcon
+ className={`user-view ${isCurrentUser ? 'current-user' : ''}`}
+ name="user"
+ label={user.fullName}
+ labelPosition="right"
+ color="primary"
+ data-test-id={dataTestId}
+ />
);
-const Owner = ({owner, isCurrentUser}) => (
- <div className='owner-view'>
- <div className='permissions-view-title'>{i18n('Owner')}</div>
- <User user={owner} isCurrentUser={isCurrentUser} dataTestId='owner'/>
- </div>
+const Owner = ({ owner, isCurrentUser }) => (
+ <div className="owner-view">
+ <div className="permissions-view-title">{i18n('Owner')}</div>
+ <User user={owner} isCurrentUser={isCurrentUser} dataTestId="owner" />
+ </div>
);
-const Contributors = ({contributors, owner, currentUser, onManagePermissions, isManual}) => {
- let extraUsers = contributors.length - maxContributors;
- return (
- <div className='contributors-view'>
- <div className='permissions-view-title'>{i18n('Contributors')}</div>
- {contributors.slice(0, maxContributors).map(contributor =>
- <User key={contributor.userId} user={contributor} isCurrentUser={contributor.userId === currentUser.userId} dataTestId='contributor'/>
- )}
- {extraUsers > 0 &&
- <OverlayTrigger placement='bottom' overlay={extraUsersTooltip(contributors.slice(maxContributors))}>
- <div className='extra-contributors'>{`+${extraUsers}`}</div>
- </OverlayTrigger>
- }
- {currentUser.userId === owner.userId && !isManual &&
- <span
- className='manage-permissions'
- onClick={onManagePermissions}
- data-test-id='versions-page-manage-permissions'>
- {i18n('Manage Permissions')}
- </span>
- }
- </div>
- );
+const Contributors = ({
+ contributors,
+ owner,
+ currentUser,
+ onManagePermissions,
+ isManual
+}) => {
+ let extraUsers = contributors.length - maxContributors;
+ return (
+ <div className="contributors-view">
+ <div className="permissions-view-title">{i18n('Contributors')}</div>
+ {contributors
+ .slice(0, maxContributors)
+ .map(contributor => (
+ <User
+ key={contributor.userId}
+ user={contributor}
+ isCurrentUser={
+ contributor.userId === currentUser.userId
+ }
+ dataTestId="contributor"
+ />
+ ))}
+ {extraUsers > 0 && (
+ <OverlayTrigger
+ placement="bottom"
+ overlay={extraUsersTooltip(
+ contributors.slice(maxContributors)
+ )}>
+ <div className="extra-contributors">{`+${extraUsers}`}</div>
+ </OverlayTrigger>
+ )}
+ {currentUser.userId === owner.userId &&
+ !isManual && (
+ <span
+ className="manage-permissions"
+ onClick={onManagePermissions}
+ data-test-id="versions-page-manage-permissions">
+ {i18n('Manage Permissions')}
+ </span>
+ )}
+ </div>
+ );
};
-const PermissionsView = ({owner, contributors, currentUser = {}, onManagePermissions, isManual}) => (
- <div className='versions-page-permissions-view-wrapper'>
- <div className='permissions-view-wrapper-title'>{i18n('Permissions')}</div>
- <div className='permissions-view-content'>
- <div className='permissions-view'>
- <Owner owner={owner} isCurrentUser={owner.userId === currentUser.userId} />
- <Contributors owner={owner} contributors={contributors} currentUser={currentUser} onManagePermissions={onManagePermissions} isManual={isManual}/>
- </div>
- </div>
- </div>
+const PermissionsView = ({
+ owner,
+ contributors,
+ currentUser = {},
+ onManagePermissions,
+ isManual
+}) => (
+ <div className="versions-page-permissions-view-wrapper">
+ <div className="permissions-view-wrapper-title">
+ {i18n('Permissions')}
+ </div>
+ <div className="permissions-view-content">
+ <div className="permissions-view">
+ <Owner
+ owner={owner}
+ isCurrentUser={owner.userId === currentUser.userId}
+ />
+ <Contributors
+ owner={owner}
+ contributors={contributors}
+ currentUser={currentUser}
+ onManagePermissions={onManagePermissions}
+ isManual={isManual}
+ />
+ </div>
+ </div>
+ </div>
);
export default PermissionsView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/components/VersionList.jsx b/openecomp-ui/src/sdc-app/onboarding/versionsPage/components/VersionList.jsx
index 47255eb9dc..d74805eccc 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/components/VersionList.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/components/VersionList.jsx
@@ -20,108 +20,177 @@ import Tooltip from 'react-bootstrap/lib/Tooltip.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
-const formatTime = (time) => {
- if (!time) { return ''; }
+const formatTime = time => {
+ if (!time) {
+ return '';
+ }
- const date = new Date(time);
- const options = {
- year: 'numeric',
- month: 'short',
- day: 'numeric',
- hour: '2-digit',
- minute: '2-digit'
- };
- const newDate = date.toLocaleTimeString('en-US', options);
+ const date = new Date(time);
+ const options = {
+ year: 'numeric',
+ month: 'short',
+ day: 'numeric',
+ hour: '2-digit',
+ minute: '2-digit'
+ };
+ const newDate = date.toLocaleTimeString('en-US', options);
- return newDate;
+ return newDate;
};
const DescriptionField = ({ className, text, useTooltip }) => {
- if (useTooltip) {
- return (
- <div className={className}>
- <OverlayTrigger
- placement='bottom'
- overlay={<Tooltip className='version-description-tooltip' id='version-description-tooltip'>{text}</Tooltip>}>
- <div className='description-text'>{text}</div>
- </OverlayTrigger>
- </div>
- );
- }
- return <div className={className}>{text}</div>;
+ if (useTooltip) {
+ return (
+ <div className={className}>
+ <OverlayTrigger
+ placement="bottom"
+ overlay={
+ <Tooltip
+ className="version-description-tooltip"
+ id="version-description-tooltip">
+ {text}
+ </Tooltip>
+ }>
+ <div className="description-text">{text}</div>
+ </OverlayTrigger>
+ </div>
+ );
+ }
+ return <div className={className}>{text}</div>;
};
-const VersionListItem = ({ data, onSelectVersion, onNavigateToVersion, onCreateVersion, isHeader, isSelected, isCollaborator }) => {
+const VersionListItem = ({
+ data,
+ onSelectVersion,
+ onNavigateToVersion,
+ onCreateVersion,
+ isHeader,
+ isSelected,
+ isCollaborator
+}) => {
+ let { modificationTime, name, status, description, additionalInfo } = data;
+ const modificationText = !isHeader
+ ? formatTime(modificationTime)
+ : i18n('Last Edited On');
- let {modificationTime, name, status, description, additionalInfo} = data;
- const modificationText = !isHeader ? formatTime(modificationTime) : i18n('Last Edited On');
-
- return (
- <div
- data-test-id='version-item-row'
- className={`version-item-row ${isHeader ? 'header-row' : 'clickable'} ${isSelected ? 'selected' : ''}`}
- onClick={e => {
- e.stopPropagation();
- onSelectVersion();
- onNavigateToVersion();
- }}>
- <div className={`version-item-field ${isHeader ? 'header-field item-version' : 'item-version'}`}>{name}</div>
- <div className={`version-item-field ${isHeader ? 'header-field item-status' : 'item-status'}`}>{status}</div>
- <div className={`version-item-field ${isHeader ? 'header-field' : 'item-last-edited'}`}>{modificationText}</div>
- <DescriptionField
- className={`version-item-field ${isHeader ? 'header-field header-description' : 'item-description'}`}
- useTooltip={!isHeader && description}
- text={description} />
-
- {
- isHeader ?
- <div className='version-item-field header-field actions'>{i18n('Actions')}</div>
- :
- <div className='version-item-field item-actions'>
- <div className='version-item-field item-select'>
- <SVGIcon
- name='check-circle'
- data-test-id='versions-page-select-version'
- onClick={e => {e.stopPropagation(); onNavigateToVersion();}}
- label={i18n('Go to this Version')}
- labelPosition='right' />
- </div>
- <div className='version-item-field item-create'>
- {!isHeader && isCollaborator && additionalInfo.OptionalCreationMethods.length > 0 && onCreateVersion &&
- <SVGIcon
- name='plus-circle'
- data-test-id='versions-page-create-version'
- onClick={e => { e.stopPropagation(); onCreateVersion(); }}
- label={i18n('Create New Version')}
- labelPosition='right'
- disabled={!isCollaborator || !onCreateVersion} />
- }
- </div>
- </div>
- }
- </div>
- );
+ return (
+ <div
+ data-test-id="version-item-row"
+ className={`version-item-row ${
+ isHeader ? 'header-row' : 'clickable'
+ } ${isSelected ? 'selected' : ''}`}
+ onClick={e => {
+ e.stopPropagation();
+ onSelectVersion();
+ onNavigateToVersion();
+ }}>
+ <div
+ className={`version-item-field ${
+ isHeader ? 'header-field item-version' : 'item-version'
+ }`}>
+ {name}
+ </div>
+ <div
+ className={`version-item-field ${
+ isHeader ? 'header-field item-status' : 'item-status'
+ }`}>
+ {status}
+ </div>
+ <div
+ className={`version-item-field ${
+ isHeader ? 'header-field' : 'item-last-edited'
+ }`}>
+ {modificationText}
+ </div>
+ <DescriptionField
+ className={`version-item-field ${
+ isHeader
+ ? 'header-field header-description'
+ : 'item-description'
+ }`}
+ useTooltip={!isHeader && description}
+ text={description}
+ />
+ {isHeader ? (
+ <div className="version-item-field header-field actions">
+ {i18n('Actions')}
+ </div>
+ ) : (
+ <div className="version-item-field item-actions">
+ <div className="version-item-field item-select">
+ <SVGIcon
+ name="check-circle"
+ data-test-id="versions-page-select-version"
+ onClick={e => {
+ e.stopPropagation();
+ onNavigateToVersion();
+ }}
+ label={i18n('Go to this Version')}
+ labelPosition="right"
+ />
+ </div>
+ <div className="version-item-field item-create">
+ {!isHeader &&
+ isCollaborator &&
+ additionalInfo.OptionalCreationMethods.length > 0 &&
+ onCreateVersion && (
+ <SVGIcon
+ name="plus-circle"
+ data-test-id="versions-page-create-version"
+ onClick={e => {
+ e.stopPropagation();
+ onCreateVersion();
+ }}
+ label={i18n('Create New Version')}
+ labelPosition="right"
+ disabled={
+ !isCollaborator || !onCreateVersion
+ }
+ />
+ )}
+ </div>
+ </div>
+ )}
+ </div>
+ );
};
-const VersionList = ({ versions, onSelectVersion, onNavigateToVersion, onCreateVersion, selectedVersion, isCollaborator }) => (
- <div className='version-list'>
- <VersionListItem
- data={{ name: i18n('Version'), status: i18n('Status'), description: i18n('Description') }}
- isHeader />
- <div className='version-list-items'>
- {versions.map(version =>
- <VersionListItem
- key={version.id}
- data={version}
- onSelectVersion={() => onSelectVersion({version})}
- onNavigateToVersion={() => onNavigateToVersion({version})}
- onCreateVersion={onCreateVersion ? () => onCreateVersion({version}) : false}
- isSelected={selectedVersion === version.id}
- isCollaborator={isCollaborator} />
- )}
- </div>
- </div>
+const VersionList = ({
+ versions,
+ onSelectVersion,
+ onNavigateToVersion,
+ onCreateVersion,
+ selectedVersion,
+ isCollaborator
+}) => (
+ <div className="version-list">
+ <VersionListItem
+ data={{
+ name: i18n('Version'),
+ status: i18n('Status'),
+ description: i18n('Description')
+ }}
+ isHeader
+ />
+ <div className="version-list-items">
+ {versions.map(version => (
+ <VersionListItem
+ key={version.id}
+ data={version}
+ onSelectVersion={() => onSelectVersion({ version })}
+ onNavigateToVersion={() => onNavigateToVersion({ version })}
+ onCreateVersion={
+ onCreateVersion
+ ? () => onCreateVersion({ version })
+ : false
+ }
+ isSelected={selectedVersion === version.id}
+ isCollaborator={isCollaborator}
+ />
+ ))}
+ </div>
+ </div>
);
export default VersionList;
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreation.js b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreation.js
index 66c1c79be5..e0cb925df4 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreation.js
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreation.js
@@ -13,32 +13,52 @@
* or implied. See the License for the specific language governing
* permissions and limitations under the License.
*/
-import {connect} from 'react-redux';
+import { connect } from 'react-redux';
import VersionsPageCreationActionHelper from './VersionsPageCreationActionHelper.js';
import VersionsPageActionHelper from '../VersionsPageActionHelper.js';
import VersionsPageCreationView from './VersionsPageCreationView.jsx';
import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
-import {VERSION_CREATION_FORM_NAME} from './VersionsPageCreationConstants.js';
+import { VERSION_CREATION_FORM_NAME } from './VersionsPageCreationConstants.js';
-export const mapStateToProps = ({versionsPage: {versionCreation}}) => {
- let {genericFieldInfo} = versionCreation;
- let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
+export const mapStateToProps = ({ versionsPage: { versionCreation } }) => {
+ let { genericFieldInfo } = versionCreation;
+ let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
- return {...versionCreation, isFormValid};
+ return { ...versionCreation, isFormValid };
};
-export const mapActionsToProps = (dispatch, {itemId, itemType, additionalProps}) => {
- return {
- onDataChanged: (deltaData, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName: VERSION_CREATION_FORM_NAME, customValidations}),
- onCancel: () => VersionsPageCreationActionHelper.close(dispatch),
- onSubmit: ({baseVersion, payload}) => {
- VersionsPageCreationActionHelper.close(dispatch);
- VersionsPageCreationActionHelper.createVersion(dispatch, {baseVersion, itemId, payload}).then(response => {
- VersionsPageActionHelper.onNavigateToVersion(dispatch, {version: response, itemId, itemType, additionalProps});
- });
- },
- onValidateForm: () => ValidationHelper.validateForm(dispatch, VERSION_CREATION_FORM_NAME)
- };
+export const mapActionsToProps = (
+ dispatch,
+ { itemId, itemType, additionalProps }
+) => {
+ return {
+ onDataChanged: (deltaData, customValidations) =>
+ ValidationHelper.dataChanged(dispatch, {
+ deltaData,
+ formName: VERSION_CREATION_FORM_NAME,
+ customValidations
+ }),
+ onCancel: () => VersionsPageCreationActionHelper.close(dispatch),
+ onSubmit: ({ baseVersion, payload }) => {
+ VersionsPageCreationActionHelper.close(dispatch);
+ VersionsPageCreationActionHelper.createVersion(dispatch, {
+ baseVersion,
+ itemId,
+ payload
+ }).then(response => {
+ VersionsPageActionHelper.onNavigateToVersion(dispatch, {
+ version: response,
+ itemId,
+ itemType,
+ additionalProps
+ });
+ });
+ },
+ onValidateForm: () =>
+ ValidationHelper.validateForm(dispatch, VERSION_CREATION_FORM_NAME)
+ };
};
-export default connect(mapStateToProps, mapActionsToProps)(VersionsPageCreationView);
+export default connect(mapStateToProps, mapActionsToProps)(
+ VersionsPageCreationView
+);
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationActionHelper.js
index bc038689a4..6e3be705c0 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationActionHelper.js
@@ -15,65 +15,76 @@
*/
import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js';
import Configuration from 'sdc-app/config/Configuration.js';
-import {actionTypes} from './VersionsPageCreationConstants.js';
-import {modalContentMapper} from 'sdc-app/common/modal/ModalContentMapper.js';
-import {actionTypes as modalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js';
+import { actionTypes } from './VersionsPageCreationConstants.js';
+import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js';
+import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
import ItemsHelper from 'sdc-app/common/helpers/ItemsHelper.js';
-import {actionTypes as VersionsPageActionTypes} from '../VersionsPageConstants.js';
+import { actionTypes as VersionsPageActionTypes } from '../VersionsPageConstants.js';
-function baseUrl({itemId, baseVersion}) {
- const restPrefix = Configuration.get('restPrefix');
- return `${restPrefix}/v1.0/items/${itemId}/versions/${baseVersion.id}/`;
+function baseUrl({ itemId, baseVersion }) {
+ const restPrefix = Configuration.get('restPrefix');
+ return `${restPrefix}/v1.0/items/${itemId}/versions/${baseVersion.id}/`;
}
-function createVersion({itemId, baseVersion, payload: {description, creationMethod} }) {
- return RestAPIUtil.post(baseUrl({itemId, baseVersion}), {description, creationMethod});
+function createVersion({
+ itemId,
+ baseVersion,
+ payload: { description, creationMethod }
+}) {
+ return RestAPIUtil.post(baseUrl({ itemId, baseVersion }), {
+ description,
+ creationMethod
+ });
}
-
export default {
+ open(dispatch, { itemType, itemId, additionalProps, baseVersion }) {
+ dispatch({
+ type: actionTypes.OPEN
+ });
- open(dispatch, {itemType, itemId, additionalProps, baseVersion}) {
- dispatch({
- type: actionTypes.OPEN
- });
-
- dispatch({
- type: modalActionTypes.GLOBAL_MODAL_SHOW,
- data: {
- modalComponentName: modalContentMapper.VERSION_CREATION,
- modalComponentProps: {itemType, itemId, additionalProps, baseVersion},
- title: i18n('New Version - From {name}', {name: baseVersion.name})
- }
- });
- },
-
- close(dispatch){
- dispatch({
- type: actionTypes.CLOSE
- });
+ dispatch({
+ type: modalActionTypes.GLOBAL_MODAL_SHOW,
+ data: {
+ modalComponentName: modalContentMapper.VERSION_CREATION,
+ modalComponentProps: {
+ itemType,
+ itemId,
+ additionalProps,
+ baseVersion
+ },
+ title: i18n('New Version - From {name}', {
+ name: baseVersion.name
+ })
+ }
+ });
+ },
- dispatch({
- type: modalActionTypes.GLOBAL_MODAL_CLOSE
- });
- },
+ close(dispatch) {
+ dispatch({
+ type: actionTypes.CLOSE
+ });
- createVersion(dispatch, {itemId, baseVersion, payload}){
- return createVersion({itemId, baseVersion, payload}).then(result => {
- return ItemsHelper.fetchVersions({itemId}).then(response => {
- dispatch({
- type: VersionsPageActionTypes.VERSIONS_LOADED,
- versions: response.results,
- itemId
- });
- dispatch({
- type: actionTypes.VERSION_CREATED,
- result
- });
- return result;
- });
- });
- }
+ dispatch({
+ type: modalActionTypes.GLOBAL_MODAL_CLOSE
+ });
+ },
+ createVersion(dispatch, { itemId, baseVersion, payload }) {
+ return createVersion({ itemId, baseVersion, payload }).then(result => {
+ return ItemsHelper.fetchVersions({ itemId }).then(response => {
+ dispatch({
+ type: VersionsPageActionTypes.VERSIONS_LOADED,
+ versions: response.results,
+ itemId
+ });
+ dispatch({
+ type: actionTypes.VERSION_CREATED,
+ result
+ });
+ return result;
+ });
+ });
+ }
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationConstants.js b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationConstants.js
index 4ce381d4de..e761232443 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationConstants.js
@@ -16,13 +16,13 @@
import keyMirror from 'nfvo-utils/KeyMirror.js';
export const actionTypes = keyMirror({
- OPEN: null,
- CLOSE: null,
- VERSION_CREATED: null
+ OPEN: null,
+ CLOSE: null,
+ VERSION_CREATED: null
});
export const VERSION_CREATION_FORM_NAME = 'VCREATIONFORM';
export const defaultState = {
- creationMethod: 'major'
-}; \ No newline at end of file
+ creationMethod: 'major'
+};
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationReducer.js b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationReducer.js
index 620cf4717f..a762e4d338 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationReducer.js
@@ -13,32 +13,39 @@
* or implied. See the License for the specific language governing
* permissions and limitations under the License.
*/
-import {actionTypes, VERSION_CREATION_FORM_NAME, defaultState} from './VersionsPageCreationConstants.js';
+import {
+ actionTypes,
+ VERSION_CREATION_FORM_NAME,
+ defaultState
+} from './VersionsPageCreationConstants.js';
export default (state = {}, action) => {
- switch (action.type) {
- case actionTypes.OPEN:
- return {
- ...state,
- formReady: null,
- formName: VERSION_CREATION_FORM_NAME,
- data: {...defaultState},
- genericFieldInfo: {
- description: {
- isValid: true,
- errorText: '',
- validations: [{type: 'required', data: true}, {type: 'maxLength', data: 120}]
- },
- creationMethod: {
- isValid: true,
- errorText: '',
- validations: [{type: 'required', data: true}]
- }
- }
- };
- case actionTypes.CLOSE:
- return {};
- default:
- return state;
- }
+ switch (action.type) {
+ case actionTypes.OPEN:
+ return {
+ ...state,
+ formReady: null,
+ formName: VERSION_CREATION_FORM_NAME,
+ data: { ...defaultState },
+ genericFieldInfo: {
+ description: {
+ isValid: true,
+ errorText: '',
+ validations: [
+ { type: 'required', data: true },
+ { type: 'maxLength', data: 120 }
+ ]
+ },
+ creationMethod: {
+ isValid: true,
+ errorText: '',
+ validations: [{ type: 'required', data: true }]
+ }
+ }
+ };
+ case actionTypes.CLOSE:
+ return {};
+ default:
+ return state;
+ }
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationView.jsx b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationView.jsx
index caa85fe107..ba92d26067 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationView.jsx
@@ -20,125 +20,116 @@ import Input from 'nfvo-components/input/validation/Input.jsx';
import Form from 'nfvo-components/input/validation/Form.jsx';
const VersionPropType = PropTypes.shape({
- name: PropTypes.string,
- description: PropTypes.string,
- creationMethod: PropTypes.string
+ name: PropTypes.string,
+ description: PropTypes.string,
+ creationMethod: PropTypes.string
});
class VersionsPageCreationView extends React.Component {
-
- static propTypes = {
- data: VersionPropType,
- availableMethods: PropTypes.array,
- onDataChanged: PropTypes.func.isRequired,
- onSubmit: PropTypes.func.isRequired,
- onCancel: PropTypes.func.isRequired
- };
-
- render() {
- let {data = {}, genericFieldInfo, baseVersion, onDataChanged, onCancel} = this.props;
- let {additionalInfo: {OptionalCreationMethods}} = baseVersion;
- let {description, creationMethod} = data;
-
- return (
- <div className='version-creation-page'>
- { genericFieldInfo && <Form
- ref={(validationForm) => this.validationForm = validationForm}
- hasButtons={true}
- onSubmit={() => this.submit()}
- submitButtonText={i18n('Create')}
- onReset={() => onCancel()}
- labledButtons={true}
- isValid={this.props.isFormValid}
- formReady={this.props.formReady}
- onValidateForm={() => this.validate()}>
-
- <div className='version-form-row'>
- <Input
- label={i18n('Version Category')}
- value={creationMethod}
- onChange={e => this.onSelectMethod(e)}
- type='select'
- overlayPos='bottom'
- data-test-id='new-version-category'
- isValid={genericFieldInfo.creationMethod.isValid}
- errorText={genericFieldInfo.creationMethod.errorText}
- isRequired>
- <option key='' value=''>{i18n('Please select…')}</option>
- {OptionalCreationMethods.map(method => <option key={method} value={method}>{i18n(method)}</option>)}
- </Input>
- </div>
-
- <div className='version-form-row'>
- <Input
- label={i18n('Description')}
- value={description}
- type='text'
- overlayPos='bottom'
- data-test-id='new-version-description'
- isValid={genericFieldInfo.description.isValid}
- errorText={genericFieldInfo.description.errorText}
- onChange={description => onDataChanged({description})}
- isRequired />
- </div>
-
- </Form> }
- </div>
- );
- }
-
- onSelectMethod(e) {
- const selectedIndex = e.target.selectedIndex;
- const creationMethod = e.target.options[selectedIndex].value;
- this.props.onDataChanged({creationMethod});
- }
-
- submit() {
- let {baseVersion, data: {description, creationMethod}} = this.props;
- this.props.onSubmit({baseVersion, payload: {description, creationMethod}});
- }
-
- validate() {
- this.props.onValidateForm();
- }
-
+ static propTypes = {
+ data: VersionPropType,
+ availableMethods: PropTypes.array,
+ onDataChanged: PropTypes.func.isRequired,
+ onSubmit: PropTypes.func.isRequired,
+ onCancel: PropTypes.func.isRequired
+ };
+
+ render() {
+ let {
+ data = {},
+ genericFieldInfo,
+ baseVersion,
+ onDataChanged,
+ onCancel
+ } = this.props;
+ let { additionalInfo: { OptionalCreationMethods } } = baseVersion;
+ let { description, creationMethod } = data;
+
+ return (
+ <div className="version-creation-page">
+ {genericFieldInfo && (
+ <Form
+ ref={validationForm =>
+ (this.validationForm = validationForm)
+ }
+ hasButtons={true}
+ onSubmit={() => this.submit()}
+ submitButtonText={i18n('Create')}
+ onReset={() => onCancel()}
+ labledButtons={true}
+ isValid={this.props.isFormValid}
+ formReady={this.props.formReady}
+ onValidateForm={() => this.validate()}>
+ <div className="version-form-row">
+ <Input
+ label={i18n('Version Category')}
+ value={creationMethod}
+ onChange={e => this.onSelectMethod(e)}
+ type="select"
+ overlayPos="bottom"
+ data-test-id="new-version-category"
+ isValid={
+ genericFieldInfo.creationMethod.isValid
+ }
+ errorText={
+ genericFieldInfo.creationMethod.errorText
+ }
+ isRequired>
+ <option key="" value="">
+ {i18n('Please select…')}
+ </option>
+ {OptionalCreationMethods.map(method => (
+ <option key={method} value={method}>
+ {i18n(method)}
+ </option>
+ ))}
+ </Input>
+ </div>
+
+ <div className="version-form-row">
+ <Input
+ label={i18n('Description')}
+ value={description}
+ type="text"
+ overlayPos="bottom"
+ data-test-id="new-version-description"
+ isValid={genericFieldInfo.description.isValid}
+ errorText={
+ genericFieldInfo.description.errorText
+ }
+ onChange={description =>
+ onDataChanged({ description })
+ }
+ isRequired
+ />
+ </div>
+ </Form>
+ )}
+ </div>
+ );
+ }
+
+ onSelectMethod(e) {
+ const selectedIndex = e.target.selectedIndex;
+ const creationMethod = e.target.options[selectedIndex].value;
+ this.props.onDataChanged({ creationMethod });
+ }
+
+ submit() {
+ let { baseVersion, data: { description, creationMethod } } = this.props;
+ this.props.onSubmit({
+ baseVersion,
+ payload: { description, creationMethod }
+ });
+ }
+
+ validate() {
+ this.props.onValidateForm();
+ }
}
export default VersionsPageCreationView;
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
/*
<div className='software-product-inline-section'>
<Input