summaryrefslogtreecommitdiffstats
path: root/openecomp-ui/src/sdc-app/onboarding
diff options
context:
space:
mode:
authorsvishnev <shlomo-stanisla.vishnevetskiy@amdocs.com>2018-04-15 09:06:57 +0300
committerEinav Keidar <einavw@amdocs.com>2018-04-15 07:55:06 +0000
commitea5e43cc939f2010b4f4c97cb8d346c91348fbba (patch)
tree23e0d347103d16099ec3ca657ab246088cf88d01 /openecomp-ui/src/sdc-app/onboarding
parent894285bfa9ccacde35b1e94e07856b53971e2559 (diff)
Onboarding filter
Issue-ID: SDC-1187 Change-Id: I74ce464c8ee4060c381b094d26d1ded270cdf40d Signed-off-by: svishnev <shlomo-stanisla.vishnevetskiy@amdocs.com>
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding')
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/OnboardingActionHelper.js34
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/OnboardingPunchOut.jsx131
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/OnboardingReducersMap.js5
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js21
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreation.js30
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationReducer.js3
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationViewWithFilter.jsx116
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.stories.js10
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/DetailsCatalogView.jsx45
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js27
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/OnboardActionHelper.js39
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/OnboardView.jsx21
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx165
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterActionHelper.js60
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterComponents.jsx145
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js8
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterMiddleware.js32
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterReducer.js13
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/filter/ItemsReducer.js24
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx4
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogViewWithFilter.jsx147
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx4
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/workspace/WorkspaceViewWithFilter.jsx57
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js21
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreation.js33
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationActionHelper.js21
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationConstants.js3
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationReducer.js5
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationViewWithFilter.jsx329
29 files changed, 1240 insertions, 313 deletions
diff --git a/openecomp-ui/src/sdc-app/onboarding/OnboardingActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/OnboardingActionHelper.js
index 2fccfcbd2a..b8ce714bce 100644
--- a/openecomp-ui/src/sdc-app/onboarding/OnboardingActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/OnboardingActionHelper.js
@@ -45,6 +45,8 @@ import SoftwareProductComponentsImageActionHelper from './softwareProduct/compon
import licenseModelOverviewActionHelper from 'sdc-app/onboarding/licenseModel/overview/licenseModelOverviewActionHelper.js';
import { tabsMapping as attachmentsTabsMapping } from 'sdc-app/onboarding/softwareProduct/attachments/SoftwareProductAttachmentsConstants.js';
import SoftwareProductAttachmentsActionHelper from 'sdc-app/onboarding/softwareProduct/attachments/SoftwareProductAttachmentsActionHelper.js';
+import { actionTypes as filterActionTypes } from './onboard/filter/FilterConstants.js';
+import FeaturesActionHelper from 'sdc-app/features/FeaturesActionHelper.js';
function setCurrentScreen(dispatch, screen, props = {}) {
dispatch({
@@ -74,11 +76,16 @@ const OnboardingActionHelper = {
SoftwareProductActionHelper.fetchArchivedSoftwareProductList(dispatch);
},
- navigateToOnboardingCatalog(dispatch) {
+ async navigateToOnboardingCatalog(dispatch) {
+ await FeaturesActionHelper.getFeaturesList(dispatch);
UsersActionHelper.fetchUsersList(dispatch);
this.loadItemsLists(dispatch);
OnboardActionHelper.resetOnboardStore(dispatch);
setCurrentScreen(dispatch, enums.SCREEN.ONBOARDING_CATALOG);
+ dispatch({
+ type: filterActionTypes.FILTER_DATA_CHANGED,
+ deltaData: {}
+ });
},
autoSaveBeforeNavigate(
@@ -207,6 +214,7 @@ const OnboardingActionHelper = {
{ softwareProductId, version, status }
) {
SoftwareProductComponentsActionHelper.clearComponentsStore(dispatch);
+ LicenseModelActionHelper.fetchFinalizedLicenseModels(dispatch);
SoftwareProductActionHelper.fetchSoftwareProduct(dispatch, {
softwareProductId,
version
@@ -559,7 +567,7 @@ const OnboardingActionHelper = {
);
},
- navigateToVersionsPage(
+ async navigateToVersionsPage(
dispatch,
{ itemType, itemId, itemName, additionalProps, users }
) {
@@ -568,19 +576,19 @@ const OnboardingActionHelper = {
allUsers: users
});
VersionsPageActionHelper.selectNone(dispatch);
- VersionsPageActionHelper.fetchVersions(dispatch, {
+ await VersionsPageActionHelper.fetchVersions(dispatch, {
itemType,
itemId
- }).then(() => {
- ItemsHelper.fetchItem(itemId).then(result => {
- setCurrentScreen(dispatch, enums.SCREEN.VERSIONS_PAGE, {
- status: result.status,
- itemType,
- itemId,
- itemName,
- additionalProps
- });
- });
+ });
+ const items = await ItemsHelper.fetchItem(itemId);
+ setCurrentScreen(dispatch, enums.SCREEN.VERSIONS_PAGE, {
+ status: items.status,
+ itemType,
+ itemId,
+ itemName,
+ vendorName: items.properties.vendorName,
+ vendorId: items.properties.vendorId,
+ additionalProps
});
},
diff --git a/openecomp-ui/src/sdc-app/onboarding/OnboardingPunchOut.jsx b/openecomp-ui/src/sdc-app/onboarding/OnboardingPunchOut.jsx
index f462dd790b..245dd2b55c 100644
--- a/openecomp-ui/src/sdc-app/onboarding/OnboardingPunchOut.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/OnboardingPunchOut.jsx
@@ -21,8 +21,6 @@ import ReactDOM from 'react-dom';
import isEqual from 'lodash/isEqual.js';
-import lodashUnionBy from 'lodash/unionBy.js';
-
import i18n from 'nfvo-utils/i18n/i18n.js';
import Application from 'sdc-app/Application.jsx';
import store from 'sdc-app/AppStore.js';
@@ -356,10 +354,6 @@ export default class OnboardingPunchOut {
handleStoreChange() {
let {
currentScreen,
- licenseModelList,
- finalizedLicenseModelList,
- softwareProductList,
- finalizedSoftwareProductList,
versionsPage: { versionsList: { itemType, itemId } },
softwareProduct: {
softwareProductEditor: {
@@ -367,26 +361,17 @@ export default class OnboardingPunchOut {
},
softwareProductComponents: { componentsList }
},
- archivedLicenseModelList,
- archivedSoftwareProductList
+ licenseModel: {
+ licenseModelEditor: { data: currentLicenseModel = {} }
+ }
} = store.getState();
- const wholeSoftwareProductList = lodashUnionBy(
- softwareProductList,
- [...finalizedSoftwareProductList, ...archivedSoftwareProductList],
- 'id'
- );
- const wholeLicenseModelList = lodashUnionBy(
- licenseModelList,
- [...finalizedLicenseModelList, ...archivedLicenseModelList],
- 'id'
- );
+
let breadcrumbsData = {
itemType,
itemId,
currentScreen,
- wholeLicenseModelList,
- wholeSoftwareProductList,
currentSoftwareProduct,
+ currentLicenseModel,
componentsList
};
@@ -415,8 +400,7 @@ export default class OnboardingPunchOut {
itemType,
itemId,
currentSoftwareProduct,
- wholeLicenseModelList,
- wholeSoftwareProductList,
+ currentLicenseModel,
componentsList
}) {
let {
@@ -435,12 +419,12 @@ export default class OnboardingPunchOut {
? [
{
selectedKey: itemId,
- menuItems: wholeLicenseModelList.map(
- ({ id, name }) => ({
- key: id,
- displayText: name
- })
- )
+ menuItems: [
+ {
+ key: itemId,
+ displayText: props.itemName
+ }
+ ]
}
]
: [
@@ -448,12 +432,12 @@ export default class OnboardingPunchOut {
selectedKey:
props.additionalProps.licenseModelId ||
currentSoftwareProduct.vendorId,
- menuItems: wholeLicenseModelList.map(
- ({ id, name }) => ({
- key: id,
- displayText: name
- })
- )
+ menuItems: [
+ {
+ key: props.vendorId,
+ displayText: props.vendorName
+ }
+ ]
},
{
selectedKey:
@@ -472,17 +456,12 @@ export default class OnboardingPunchOut {
},
{
selectedKey: itemId,
- menuItems: wholeSoftwareProductList
- .filter(
- ({ id, vendorId }) =>
- vendorId ===
- currentSoftwareProduct.vendorId ||
- id === itemId
- )
- .map(({ id, name }) => ({
- key: id,
- displayText: name
- }))
+ menuItems: [
+ {
+ key: itemId,
+ displayText: props.itemName
+ }
+ ]
}
];
return [
@@ -519,13 +498,13 @@ export default class OnboardingPunchOut {
};
return [
{
- selectedKey: props.licenseModelId,
- menuItems: wholeLicenseModelList.map(
- ({ id, name }) => ({
- key: id,
- displayText: name
- })
- )
+ selectedKey: currentLicenseModel.id,
+ menuItems: [
+ {
+ key: currentLicenseModel.id,
+ displayText: currentLicenseModel.vendorName
+ }
+ ]
},
{
selectedKey: enums.BREADCRUMS.LICENSE_MODEL,
@@ -533,19 +512,7 @@ export default class OnboardingPunchOut {
{
key: enums.BREADCRUMS.LICENSE_MODEL,
displayText: i18n('License Model')
- },
- ...(wholeSoftwareProductList.findIndex(
- ({ vendorId }) =>
- vendorId === props.licenseModelId
- ) === -1
- ? []
- : [
- {
- key:
- enums.BREADCRUMS.SOFTWARE_PRODUCT,
- displayText: i18n('Software Products')
- }
- ])
+ }
]
},
{
@@ -636,16 +603,16 @@ export default class OnboardingPunchOut {
[enums.SCREEN.SOFTWARE_PRODUCT_COMPONENT_MONITORING]:
enums.BREADCRUMS.SOFTWARE_PRODUCT_COMPONENT_MONITORING
};
- let licenseModelId = currentSoftwareProduct.vendorId;
+
let returnedBreadcrumb = [
{
- selectedKey: licenseModelId,
- menuItems: wholeLicenseModelList.map(
- ({ id, name }) => ({
- key: id,
- displayText: name
- })
- )
+ selectedKey: currentSoftwareProduct.vendorId,
+ menuItems: [
+ {
+ key: currentSoftwareProduct.vendorId,
+ displayText: currentSoftwareProduct.vendorName
+ }
+ ]
},
{
selectedKey: enums.BREADCRUMS.SOFTWARE_PRODUCT,
@@ -661,17 +628,13 @@ export default class OnboardingPunchOut {
]
},
{
- selectedKey: props.softwareProductId,
- menuItems: wholeSoftwareProductList
- .filter(
- ({ vendorId, id }) =>
- vendorId === licenseModelId ||
- id === props.softwareProductId
- )
- .map(({ id, name }) => ({
- key: id,
- displayText: name
- }))
+ selectedKey: currentSoftwareProduct.id,
+ menuItems: [
+ {
+ key: currentSoftwareProduct.id,
+ displayText: currentSoftwareProduct.name
+ }
+ ]
},
.../*screen === enums.SCREEN.SOFTWARE_PRODUCT_LANDING_PAGE ? [] :*/ [
{
diff --git a/openecomp-ui/src/sdc-app/onboarding/OnboardingReducersMap.js b/openecomp-ui/src/sdc-app/onboarding/OnboardingReducersMap.js
index 3b526a67f6..09f4ffb930 100644
--- a/openecomp-ui/src/sdc-app/onboarding/OnboardingReducersMap.js
+++ b/openecomp-ui/src/sdc-app/onboarding/OnboardingReducersMap.js
@@ -28,7 +28,7 @@ import usersReducer from './users/UsersReducers.js';
import mergeEditorReducer from 'sdc-app/common/merge/MergeEditorReducer.js';
import revisionsReducer from './revisions/RevisionsReducer.js';
import featuresReducer from 'sdc-app/features/FeaturesReducer.js';
-
+import itemsReducer from 'sdc-app/onboarding/onboard/filter/ItemsReducer.js';
export default {
currentScreen: currentScreenReducer,
licenseModel: licenseModelReducer,
@@ -44,5 +44,6 @@ export default {
users: usersReducer,
versionsPage: versionsPageReducer,
revisions: revisionsReducer,
- features: featuresReducer
+ features: featuresReducer,
+ filteredItems: itemsReducer
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js
index cfff9f1fcd..be33af7910 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js
@@ -29,8 +29,11 @@ import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js';
import { CommitModalType } from 'nfvo-components/panel/versionController/components/CommitCommentModal.jsx';
import versionPageActionHelper from 'sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js';
import { itemTypes } from 'sdc-app/onboarding/versionsPage/VersionsPageConstants.js';
-import { catalogItemStatuses } from 'sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js';
import { actionsEnum as VersionControllerActionsEnum } from 'nfvo-components/panel/versionController/VersionControllerConstants.js';
+import {
+ itemStatus,
+ versionStatus
+} from 'sdc-app/common/helpers/ItemsHelperConstants.js';
function baseUrl() {
const restPrefix = Configuration.get('restPrefix');
@@ -39,19 +42,17 @@ function baseUrl() {
function fetchLicenseModels() {
return RestAPIUtil.fetch(
- `${baseUrl()}?versionFilter=${catalogItemStatuses.DRAFT}`
+ `${baseUrl()}?versionFilter=${versionStatus.DRAFT}`
);
}
function fetchFinalizedLicenseModels() {
return RestAPIUtil.fetch(
- `${baseUrl()}?versionFilter=${catalogItemStatuses.CERTIFIED}`
+ `${baseUrl()}?versionFilter=${versionStatus.CERTIFIED}`
);
}
function fetchArchivedLicenseModels() {
- return RestAPIUtil.fetch(
- `${baseUrl()}?Status=${catalogItemStatuses.ARCHIVED}`
- );
+ return RestAPIUtil.fetch(`${baseUrl()}?Status=${itemStatus.ARCHIVED}`);
}
function fetchLicenseModelById(licenseModelId, version) {
const { id: versionId } = version;
@@ -206,9 +207,8 @@ const LicenseModelActionHelper = {
version
}).then(({ inMerge, isDirty, updatedVersion }) => {
if (
- (updatedVersion.status === catalogItemStatuses.CERTIFIED ||
- updatedVersion.archivedStatus ===
- catalogItemStatuses.ARCHIVED) &&
+ (updatedVersion.status === versionStatus.CERTIFIED ||
+ updatedVersion.archivedStatus === versionStatus.ARCHIVED) &&
(action === VersionControllerActionsEnum.COMMIT ||
action === VersionControllerActionsEnum.SYNC)
) {
@@ -217,8 +217,7 @@ const LicenseModelActionHelper = {
itemId: licenseModelId
});
const msg =
- updatedVersion.archivedStatus ===
- catalogItemStatuses.ARCHIVED
+ updatedVersion.archivedStatus === versionStatus.ARCHIVED
? i18n('Item was Archived')
: i18n('Item version already Certified');
dispatch({
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreation.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreation.js
index 4bbab865fa..c6a0702a57 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreation.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreation.js
@@ -14,8 +14,12 @@
* limitations under the License.
*/
import { connect } from 'react-redux';
+import featureToggle from 'sdc-app/features/featureToggle.js';
+import { featureToggleNames } from 'sdc-app/features/FeaturesConstants.js';
import LicenseModelCreationActionHelper from './LicenseModelCreationActionHelper.js';
import LicenseModelCreationView from './LicenseModelCreationView.jsx';
+import LicenseModelCreationViewWithFilter from './LicenseModelCreationViewWithFilter.jsx';
+
import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
import LicenseModelActionHelper from 'sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js';
import VersionsPageActionHelper from 'sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js';
@@ -23,6 +27,16 @@ import { itemTypes as versionItemTypes } from 'sdc-app/onboarding/versionsPage/V
import ScreensHelper from 'sdc-app/common/helpers/ScreensHelper.js';
import { enums, screenTypes } from 'sdc-app/onboarding/OnboardingConstants.js';
import PermissionsActionHelper from 'sdc-app/onboarding/permissions/PermissionsActionHelper.js';
+import UniqueTypesHelper from 'sdc-app/common/helpers/UniqueTypesHelper.js';
+import i18n from 'nfvo-utils/i18n/i18n.js';
+import { itemType } from 'sdc-app/common/helpers/ItemsHelperConstants.js';
+
+const ToggledLicenseModelCreationView = featureToggle(
+ featureToggleNames.FILTER
+)({
+ OnComp: LicenseModelCreationViewWithFilter,
+ OffComp: LicenseModelCreationView
+});
export const mapStateToProps = ({
users: { usersList },
@@ -87,10 +101,22 @@ export const mapActionsToProps = dispatch => {
});
},
onValidateForm: formName =>
- ValidationHelper.validateForm(dispatch, formName)
+ ValidationHelper.validateForm(dispatch, formName),
+ isNameUnique: (value, name, formName) =>
+ UniqueTypesHelper.isNameUnique(dispatch, {
+ value,
+ name,
+ formName,
+ errorText: `${i18n(
+ 'License model by the name'
+ )} ${value} ${i18n('already exists')}. ${i18n(
+ 'License model name must be unique'
+ )}`,
+ itemType: itemType.VLM
+ })
};
};
export default connect(mapStateToProps, mapActionsToProps)(
- LicenseModelCreationView
+ ToggledLicenseModelCreationView
);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationReducer.js
index 7137230cc7..5922a47822 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationReducer.js
@@ -40,7 +40,8 @@ export default (state = {}, action) => {
errorText: '',
validations: [
{ type: 'required', data: true },
- { type: 'maxLength', data: 25 }
+ { type: 'maxLength', data: 25 },
+ { type: 'validateName', data: true }
]
}
}
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationViewWithFilter.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationViewWithFilter.jsx
new file mode 100644
index 0000000000..8c5d966938
--- /dev/null
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationViewWithFilter.jsx
@@ -0,0 +1,116 @@
+/*
+ * Copyright © 2016-2018 European Support Limited
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import React from 'react';
+import PropTypes from 'prop-types';
+import i18n from 'nfvo-utils/i18n/i18n.js';
+import Input from 'nfvo-components/input/validation/Input.jsx';
+import Form from 'nfvo-components/input/validation/Form.jsx';
+import { LICENSE_MODEL_CREATION_FORM_NAME } from './LicenseModelCreationConstants.js';
+
+const LicenseModelPropType = PropTypes.shape({
+ id: PropTypes.string,
+ vendorName: PropTypes.string,
+ description: PropTypes.string
+});
+
+class LicenseModelCreationView extends React.Component {
+ static propTypes = {
+ data: LicenseModelPropType,
+ VLMNames: PropTypes.object,
+ usersList: PropTypes.array,
+ onDataChanged: PropTypes.func.isRequired,
+ onSubmit: PropTypes.func.isRequired,
+ onValidateForm: PropTypes.func.isRequired,
+ onCancel: PropTypes.func.isRequired
+ };
+
+ render() {
+ let { data = {}, onDataChanged, genericFieldInfo } = this.props;
+ let { vendorName, description } = data;
+ return (
+ <div>
+ {genericFieldInfo && (
+ <Form
+ ref="validationForm"
+ hasButtons={true}
+ onSubmit={() => this.submit()}
+ submitButtonText={i18n('Create')}
+ onReset={() => this.props.onCancel()}
+ labledButtons={true}
+ isValid={this.props.isFormValid}
+ formReady={this.props.formReady}
+ onValidateForm={() => this.validate()}>
+ <Input
+ value={vendorName}
+ label={i18n('Vendor Name')}
+ data-test-id="vendor-name"
+ onChange={vendorName =>
+ onDataChanged(
+ { vendorName },
+ LICENSE_MODEL_CREATION_FORM_NAME
+ )
+ }
+ onBlur={e =>
+ this.validateIsNameUnique(e.target.value)
+ }
+ isValid={genericFieldInfo.vendorName.isValid}
+ errorText={genericFieldInfo.vendorName.errorText}
+ type="text"
+ isRequired={true}
+ className="field-section"
+ />
+ <Input
+ isRequired={true}
+ value={description}
+ label={i18n('Description')}
+ data-test-id="vendor-description"
+ overlayPos="bottom"
+ onChange={description =>
+ onDataChanged(
+ { description },
+ LICENSE_MODEL_CREATION_FORM_NAME
+ )
+ }
+ isValid={genericFieldInfo.description.isValid}
+ errorText={genericFieldInfo.description.errorText}
+ type="textarea"
+ className="field-section"
+ />
+ </Form>
+ )}
+ </div>
+ );
+ }
+
+ submit() {
+ const { data: licenseModel, usersList } = this.props;
+ this.props.onSubmit(licenseModel, usersList);
+ }
+
+ validateIsNameUnique(value) {
+ this.props.isNameUnique(
+ value,
+ 'vendorName',
+ LICENSE_MODEL_CREATION_FORM_NAME
+ );
+ }
+
+ validate() {
+ this.props.onValidateForm(LICENSE_MODEL_CREATION_FORM_NAME);
+ }
+}
+
+export default LicenseModelCreationView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.stories.js b/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.stories.js
index d01b9d0d04..c0de0eeb79 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.stories.js
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.stories.js
@@ -2,11 +2,9 @@ import React from 'react';
import { storiesOf, action } from '@kadira/storybook';
import { select, withKnobs } from '@kadira/storybook-addon-knobs';
import CatalogItemDetails from './CatalogItemDetails.jsx';
-import {
- catalogItemTypes,
- catalogItemStatuses
-} from './onboardingCatalog/OnboardingCatalogConstants.js';
+import { catalogItemTypes } from './onboardingCatalog/OnboardingCatalogConstants.js';
import { FinalizedLicenseModelFactory } from 'test-utils/factories/licenseModel/LicenseModelFactories.js';
+import { versionStatus } from 'sdc-app/common/helpers/ItemsHelperConstants.js';
const stories = storiesOf('CatalogTiles', module);
stories.addDecorator(withKnobs);
@@ -22,9 +20,9 @@ function selectType() {
let vlm = {
...FinalizedLicenseModelFactory.build({ name: 'Test-VLM' }),
- itemStatus: catalogItemStatuses.DRAFT
+ itemStatus: versionStatus.DRAFT
};
-let certifiedVlm = { ...vlm, itemStatus: catalogItemStatuses.CERTIFIED };
+let certifiedVlm = { ...vlm, itemStatus: versionStatus.CERTIFIED };
stories.add('preview', () => (
<div className="catalog-view">
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/DetailsCatalogView.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/DetailsCatalogView.jsx
index 771c0eb6c1..b535595355 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/DetailsCatalogView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/DetailsCatalogView.jsx
@@ -13,6 +13,7 @@
* or implied. See the License for the specific language governing
* permissions and limitations under the License.
*/
+import isEqual from 'lodash/isEqual.js';
import React from 'react';
import PropTypes from 'prop-types';
import { catalogItemTypes } from './onboardingCatalog/OnboardingCatalogConstants.js';
@@ -20,6 +21,28 @@ import { filterCatalogItemsByType } from './onboardingCatalog/OnboardingCatalogU
import CatalogList from './CatalogList.jsx';
import CatalogItemDetails from './CatalogItemDetails.jsx';
+function renderCatalogItems({
+ items,
+ type,
+ filter,
+ onSelect,
+ onMigrate,
+ users
+}) {
+ const filteredItems = items.length
+ ? filterCatalogItemsByType({ items, filter })
+ : [];
+ return filteredItems.map(item => (
+ <CatalogItemDetails
+ key={item.id}
+ catalogItemData={item}
+ catalogItemTypeClass={type}
+ onMigrate={onMigrate}
+ onSelect={() => onSelect(item, users)}
+ />
+ ));
+}
+
class DetailsCatalogView extends React.Component {
static propTypes = {
VLMList: PropTypes.array,
@@ -31,18 +54,14 @@ class DetailsCatalogView extends React.Component {
filter: PropTypes.string.isRequired
};
- renderCatalogItems({ items, type, filter, onSelect, onMigrate, users }) {
- return filterCatalogItemsByType({ items, filter }).map(item => (
- <CatalogItemDetails
- key={item.id}
- catalogItemData={item}
- catalogItemTypeClass={type}
- onMigrate={onMigrate}
- onSelect={() => onSelect(item, users)}
- />
- ));
+ shouldComponentUpdate(nextProps) {
+ const shouldUpdate =
+ isEqual(nextProps.VLMList, this.props.VLMList) &&
+ isEqual(nextProps.VSPList, this.props.VSPList) &&
+ isEqual(nextProps.users, this.props.users) &&
+ isEqual(nextProps.filter, this.props.filter);
+ return !shouldUpdate;
}
-
render() {
let {
VLMList,
@@ -57,7 +76,7 @@ class DetailsCatalogView extends React.Component {
} = this.props;
return (
<CatalogList onAddVLM={onAddVLM} onAddVSP={onAddVSP}>
- {this.renderCatalogItems({
+ {renderCatalogItems({
items: VLMList,
type: catalogItemTypes.LICENSE_MODEL,
filter,
@@ -65,7 +84,7 @@ class DetailsCatalogView extends React.Component {
onMigrate,
users
})}
- {this.renderCatalogItems({
+ {renderCatalogItems({
items: VSPList,
type: catalogItemTypes.SOFTWARE_PRODUCT,
filter,
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js b/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js
index a1e0018114..ea70f9c0b8 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js
@@ -22,7 +22,7 @@ import LicenseModelCreationActionHelper from '../licenseModel/creation/LicenseMo
import SoftwareProductCreationActionHelper from '../softwareProduct/creation/SoftwareProductCreationActionHelper.js';
import sortByStringProperty from 'nfvo-utils/sortByStringProperty.js';
import { tabsMapping } from './onboardingCatalog/OnboardingCatalogConstants.js';
-import { itemsType } from './filter/FilterConstants.js';
+import { itemStatus } from 'sdc-app/common/helpers/ItemsHelperConstants.js';
export const mapStateToProps = ({
onboard: { onboardingCatalog, activeTab, searchValue, filter },
@@ -32,7 +32,8 @@ export const mapStateToProps = ({
archivedSoftwareProductList,
finalizedLicenseModelList,
softwareProductList,
- finalizedSoftwareProductList
+ finalizedSoftwareProductList,
+ filteredItems
}) => {
const fullSoftwareProducts = softwareProductList
.filter(
@@ -50,6 +51,23 @@ export const mapStateToProps = ({
return accum;
};
+ const reduceFilteredLicenseModelList = (accum, vlm) => {
+ let currentSoftwareProductList = sortByStringProperty(
+ filteredItems.vspList.filter(vsp => vsp.vendorId === vlm.id),
+ 'name'
+ );
+ accum.push({ ...vlm, softwareProductList: currentSoftwareProductList });
+ return accum;
+ };
+
+ const updatedFilteredItems = {
+ vspList: [...filteredItems.vspList],
+ vlmList: sortByStringProperty(
+ filteredItems.vlmList.reduce(reduceFilteredLicenseModelList, []),
+ 'name'
+ )
+ };
+
licenseModelList = sortByStringProperty(
licenseModelList.reduce(reduceLicenseModelList, []),
'name'
@@ -72,7 +90,7 @@ export const mapStateToProps = ({
} = onboardingCatalog;
if (filter.byVendorView) {
catalogActiveTab = tabsMapping.BY_VENDOR;
- } else if (filter.itemsType && filter.itemsType === itemsType.ARCHIVED) {
+ } else if (filter.itemStatus && filter.itemStatus === itemStatus.ARCHIVED) {
catalogActiveTab = tabsMapping.ARCHIVE;
}
@@ -89,7 +107,8 @@ export const mapStateToProps = ({
searchValue,
vspOverlay,
selectedVendor,
- users: users.usersList
+ users: users.usersList,
+ filteredItems: updatedFilteredItems
};
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardActionHelper.js
index 87ec2d148e..2826e324b3 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardActionHelper.js
@@ -1,25 +1,30 @@
-/*!
- * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+/*
+ * Copyright © 2016-2018 European Support Limited
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
- * or implied. See the License for the specific language governing
- * permissions and limitations under the License.
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
*/
import { tabsMapping, actionTypes } from './OnboardConstants.js';
import ScreensHelper from 'sdc-app/common/helpers/ScreensHelper.js';
import { enums, screenTypes } from 'sdc-app/onboarding/OnboardingConstants.js';
import VersionsPageActionHelper from 'sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js';
-import { catalogItemStatuses } from 'sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js';
+
import { itemTypes } from 'sdc-app/onboarding/versionsPage/VersionsPageConstants.js';
import PermissionsActionHelper from 'sdc-app/onboarding/permissions/PermissionsActionHelper.js';
+import { actionTypes as filterActionTypes } from './filter/FilterConstants.js';
+import {
+ versionStatus,
+ itemStatus
+} from 'sdc-app/common/helpers/ItemsHelperConstants.js';
const OnboardActionHelper = {
resetOnboardStore(dispatch) {
@@ -33,6 +38,18 @@ const OnboardActionHelper = {
type: actionTypes.CHANGE_ACTIVE_ONBOARD_TAB,
activeTab
});
+ dispatch({
+ type: filterActionTypes.FILTER_DATA_CHANGED,
+ deltaData:
+ activeTab === tabsMapping.WORKSPACE
+ ? {
+ versionStatus: versionStatus.DRAFT,
+ itemStatus: itemStatus.ACTIVE
+ }
+ : {
+ versionStatus: versionStatus.CERTIFIED
+ }
+ });
},
changeSearchValue(dispatch, searchValue) {
dispatch({
@@ -54,7 +71,7 @@ const OnboardActionHelper = {
itemType: itemTypes.LICENSE_MODEL
}).then(({ results }) => {
results = results.filter(
- version => version.status === catalogItemStatuses.DRAFT
+ version => version.status === versionStatus.DRAFT
);
if (results.length !== 1) {
ScreensHelper.loadScreen(dispatch, {
@@ -104,7 +121,7 @@ const OnboardActionHelper = {
itemType: itemTypes.SOFTWARE_PRODUCT
}).then(({ results }) => {
results = results.filter(
- version => version.status === catalogItemStatuses.DRAFT
+ version => version.status === versionStatus.DRAFT
);
if (results.length !== 1) {
ScreensHelper.loadScreen(dispatch, {
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardView.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardView.jsx
index dcaeaa787d..0fc64b328c 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardView.jsx
@@ -16,7 +16,9 @@
import React from 'react';
import PropTypes from 'prop-types';
import OnboardingCatalogView from './onboardingCatalog/OnboardingCatalogView.jsx';
+import OnboardingCatalogViewWithFilter from './onboardingCatalog/OnboardingCatalogViewWithFilter.jsx';
import WorkspaceView from './workspace/WorkspaceView.jsx';
+import WorkspaceViewWithFilter from './workspace/WorkspaceViewWithFilter.jsx';
import { tabsMapping } from './OnboardConstants.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
import classnames from 'classnames';
@@ -25,7 +27,8 @@ import objectValues from 'lodash/values.js';
import { catalogItemTypes } from './onboardingCatalog/OnboardingCatalogConstants.js';
import NotificationsView from 'sdc-app/onboarding/userNotifications/NotificationsView.jsx';
import Filter from 'sdc-app/onboarding/onboard/filter/Filter.jsx';
-
+import featureToggle from 'sdc-app/features/featureToggle.js';
+import { featureToggleNames } from 'sdc-app/features/FeaturesConstants.js';
const OnboardHeaderTabs = ({ onTabClick, activeTab }) => (
<div className="onboard-header-tabs">
<div
@@ -47,6 +50,16 @@ const OnboardHeaderTabs = ({ onTabClick, activeTab }) => (
</div>
);
+const ToggledOnboardingCatalogView = featureToggle(featureToggleNames.FILTER)({
+ OnComp: OnboardingCatalogViewWithFilter,
+ OffComp: OnboardingCatalogView
+});
+
+const ToggledWorkspaceView = featureToggle(featureToggleNames.FILTER)({
+ OnComp: WorkspaceViewWithFilter,
+ OffComp: WorkspaceView
+});
+
const OnboardHeader = ({ onSearch, activeTab, onTabClick, searchValue }) => (
<div className="onboard-header">
<OnboardHeaderTabs activeTab={activeTab} onTabClick={onTabClick} />
@@ -85,11 +98,11 @@ class OnboardView extends React.Component {
renderViewByTab(activeTab) {
switch (activeTab) {
case tabsMapping.WORKSPACE:
- return <WorkspaceView {...this.props} />;
+ return <ToggledWorkspaceView {...this.props} />;
case tabsMapping.CATALOG:
- return <OnboardingCatalogView {...this.props} />;
+ return <ToggledOnboardingCatalogView {...this.props} />;
default:
- return <WorkspaceView {...this.props} />;
+ return <ToggledWorkspaceView {...this.props} />;
}
}
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx
index c80232de0a..a00357c7b9 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx
@@ -17,14 +17,19 @@
import { connect } from 'react-redux';
import React from 'react';
import PropTypes from 'prop-types';
-import i18n from 'nfvo-utils/i18n/i18n.js';
-import Input from 'nfvo-components/input/validation/Input.jsx';
-import Accordion from 'nfvo-components/accordion/Accordion.jsx';
-import { actionTypes } from './FilterConstants.js';
import featureToggle from 'sdc-app/features/featureToggle.js';
import { featureToggleNames } from 'sdc-app/features/FeaturesConstants.js';
import { tabsMapping as onboardTabsMapping } from '../OnboardConstants.js';
-import { itemsType as itemsTypeConstants } from './FilterConstants.js';
+import { actionTypes } from './FilterConstants.js';
+
+import Panel from 'sdc-ui/lib/react/Panel.js';
+import {
+ ItemStatus,
+ ByVendorView,
+ EntityType,
+ Permissions,
+ OnboardingProcedure
+} from './FilterComponents.jsx';
const mapStateToProps = ({ onboard: { filter, activeTab } }) => {
return {
@@ -35,145 +40,39 @@ const mapStateToProps = ({ onboard: { filter, activeTab } }) => {
const mapActionsToProps = dispatch => {
return {
- onDataChanged: deltaData =>
+ onDataChanged: deltaData => {
dispatch({
type: actionTypes.FILTER_DATA_CHANGED,
deltaData
- })
+ });
+ }
};
};
-const Filter = ({
- onDataChanged,
- data: {
- entityTypeVsp,
- entityTypeVlm,
- roleOwner,
- roleContributor,
- roleViewer,
- procedureNetwork,
- procedureManual,
- recentlyUpdated,
- byVendorView,
- itemsType
- },
- activeTab
-}) => (
- <div className="catalog-filter">
- {activeTab === onboardTabsMapping.CATALOG && (
- <Input
- type="select"
- className="catalog-filter-items-type"
- data-test-id="catalog-filter-items-type"
- disabled={byVendorView}
- value={itemsType}
- onChange={e => onDataChanged({ itemsType: e.target.value })}>
- <option
- key={itemsTypeConstants.ACTIVE}
- value={itemsTypeConstants.ACTIVE}>
- Active Items
- </option>
- <option
- key={itemsTypeConstants.ARCHIVED}
- value={itemsTypeConstants.ARCHIVED}>
- Archived Items
- </option>
- </Input>
- )}
- {activeTab === onboardTabsMapping.CATALOG && (
- <Input
- label={i18n('By Vendor View')}
- type="checkbox"
- disabled={itemsType === itemsTypeConstants.ARCHIVED}
- checked={byVendorView}
- onChange={byVendorView => onDataChanged({ byVendorView })}
- data-test-id="filter-by-vendor-view"
- value=""
- />
- )}
- <Input
- label={i18n('Recently Updated')}
- type="checkbox"
- checked={recentlyUpdated}
- onChange={recentlyUpdated => onDataChanged({ recentlyUpdated })}
- data-test-id="filter-recently-updated"
- value=""
- />
-
- <Accordion title={i18n('ENTITY TYPE')}>
- <Input
- label={i18n('VSP')}
- type="checkbox"
- checked={entityTypeVsp}
- onChange={entityTypeVsp => onDataChanged({ entityTypeVsp })}
- data-test-id="filter-type-vsp"
- value=""
- />
- <Input
- label={i18n('VLM')}
- type="checkbox"
- checked={entityTypeVlm}
- onChange={entityTypeVlm => onDataChanged({ entityTypeVlm })}
- data-test-id="filter-type-vlm"
- value=""
- />
- </Accordion>
-
- <Accordion title={i18n('ROLE')}>
- <Input
- label={i18n('Owner')}
- type="checkbox"
- checked={roleOwner}
- onChange={roleOwner => onDataChanged({ roleOwner })}
- data-test-id="filter-role-owner"
- value=""
- />
- <Input
- label={i18n('Contributer')}
- type="checkbox"
- checked={roleContributor}
- onChange={roleContributor => onDataChanged({ roleContributor })}
- data-test-id="filter-role-contributor"
- value=""
- />
- <Input
- label={i18n('Viewer')}
- type="checkbox"
- checked={roleViewer}
- onChange={roleViewer => onDataChanged({ roleViewer })}
- data-test-id="filter-role-viewr"
- value=""
- />
- </Accordion>
-
- <Accordion title={i18n('ONBOARDING PROCEDURE')}>
- <Input
- label={i18n('Network Package')}
- type="checkbox"
- checked={procedureNetwork}
- onChange={procedureNetwork =>
- onDataChanged({ procedureNetwork })
- }
- data-test-id="filter-procedure-network"
- value=""
- />
- <Input
- label={i18n('Manual')}
- type="checkbox"
- checked={procedureManual}
- onChange={procedureManual => onDataChanged({ procedureManual })}
- data-test-id="filter-procedure-manual"
- value=""
- />
- </Accordion>
- </div>
-);
+const Filter = ({ onDataChanged, data, activeTab }) => {
+ return (
+ <Panel className="catalog-filter">
+ <ItemStatus data={data} onDataChanged={onDataChanged} />
+ <EntityType data={data} onDataChanged={onDataChanged} />
+ <Permissions data={data} onDataChanged={onDataChanged} />
+ <OnboardingProcedure data={data} onDataChanged={onDataChanged} />
+ {activeTab === onboardTabsMapping.CATALOG && (
+ <ByVendorView data={data} onDataChanged={onDataChanged} />
+ )}
+ </Panel>
+ );
+};
Filter.PropTypes = {
onDataChanged: PropTypes.func,
- data: PropTypes.object
+ data: PropTypes.object,
+ activeTab: PropTypes.number
};
export default featureToggle(featureToggleNames.FILTER)(
connect(mapStateToProps, mapActionsToProps)(Filter)
);
+
+export const ConnectedFilter = connect(mapStateToProps, mapActionsToProps)(
+ Filter
+);
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterActionHelper.js
new file mode 100644
index 0000000000..f8155df49d
--- /dev/null
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterActionHelper.js
@@ -0,0 +1,60 @@
+/*
+ * Copyright © 2016-2018 European Support Limited
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { default as ItemsHelper } from 'sdc-app/common/helpers/ItemsHelper.js';
+import {
+ itemType,
+ versionStatus
+} from 'sdc-app/common/helpers/ItemsHelperConstants.js';
+import { actionTypes } from './FilterConstants.js';
+
+const FilterActionHelper = {
+ async updateFilteredItems(dispatch, filter) {
+ let permission = { ...filter.permission };
+ if (
+ filter.versionStatus === versionStatus.DRAFT &&
+ !permission.Owner &&
+ !permission.Contributor
+ ) {
+ permission.Owner = true;
+ permission.Contributor = true;
+ }
+ const items = await ItemsHelper.fetchItems({
+ ...filter,
+ permission
+ });
+ let vspList = [];
+ let vlmList = [];
+ items.results.map(item => {
+ if (item.type === itemType.VSP) {
+ const { properties, ...all } = item;
+ vspList.push({ ...all, ...properties });
+ } else {
+ vlmList.push(item);
+ }
+ });
+
+ dispatch({
+ type: actionTypes.UPDATE_FILTERED_LIST,
+ data: {
+ vspList,
+ vlmList
+ }
+ });
+ }
+};
+
+export default FilterActionHelper;
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterComponents.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterComponents.jsx
new file mode 100644
index 0000000000..65ec733fd5
--- /dev/null
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterComponents.jsx
@@ -0,0 +1,145 @@
+/*
+ * Copyright © 2016-2018 European Support Limited
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import React from 'react';
+import Input from 'nfvo-components/input/validation/Input.jsx';
+import i18n from 'nfvo-utils/i18n/i18n.js';
+import { itemStatus } from 'sdc-app/common/helpers/ItemsHelperConstants.js';
+import Accordion from 'sdc-ui/lib/react/Accordion.js';
+import Checklist from 'sdc-ui/lib/react/Checklist.js';
+import Checkbox from 'sdc-ui/lib/react/Checkbox.js';
+
+export const ItemStatus = ({ data, onDataChanged, byVendorView }) => (
+ <Input
+ type="select"
+ className="catalog-filter-items-type"
+ data-test-id="catalog-filter-items-type"
+ disabled={byVendorView}
+ value={data.itemStatus}
+ onChange={e => onDataChanged({ itemStatus: e.target.value }, data)}>
+ <option key={itemStatus.ACTIVE} value={itemStatus.ACTIVE}>
+ {i18n('Active Items')}
+ </option>
+ <option key={itemStatus.ARCHIVED} value={itemStatus.ARCHIVED}>
+ {i18n('Archived Items')}
+ </option>
+ </Input>
+);
+
+const FilterList = ({ title, items, groupKey, onDataChanged, data }) => {
+ let onChange = value => {
+ let obj = {};
+ obj[groupKey] = { ...data[groupKey], ...value };
+ onDataChanged(obj);
+ };
+ return (
+ <Accordion title={title}>
+ <Checklist items={items} onChange={onChange} />
+ </Accordion>
+ );
+};
+
+export const ByVendorView = ({ data, onDataChanged }) => (
+ <Checkbox
+ label={i18n('By Vendor View')}
+ className="catalog-filter-by-vendor-view"
+ disabled={data.itemsType === itemStatus.ARCHIVED}
+ checked={data.byVendorView}
+ onChange={byVendorView => onDataChanged({ byVendorView }, data)}
+ data-test-id="filter-by-vendor-view"
+ value=""
+ />
+);
+
+export const EntityType = ({ data, onDataChanged }) => {
+ const items = [
+ {
+ label: i18n('VSP'),
+ dataTestId: 'catalog-filter-type-vsp',
+ value: 'vsp',
+ checked: data.itemType && data.itemType.vsp
+ },
+ {
+ label: i18n('VLM'),
+ dataTestId: 'catalog-ilter-type-vlm',
+ value: 'vlm',
+ checked: data.itemType && data.itemType.vlm
+ }
+ ];
+ return (
+ <FilterList
+ title={i18n('ENTITY TYPE')}
+ items={items}
+ onDataChanged={onDataChanged}
+ data={data}
+ groupKey="itemType"
+ />
+ );
+};
+
+export const Permissions = ({ data, onDataChanged }) => {
+ const items = [
+ {
+ label: i18n('Owner'),
+ dataTestId: 'catalog-filter-permission-owner',
+ value: 'Owner',
+ checked: data.permission && data.permission.Owner
+ },
+ {
+ label: i18n('Contributor'),
+ dataTestId: 'catalog-filter-permission-contributor',
+ value: 'Contributor',
+ checked: data.permission && data.permission.Contributor
+ }
+ ];
+
+ return (
+ <FilterList
+ title={i18n('PERMISSIONS')}
+ items={items}
+ onDataChanged={onDataChanged}
+ data={data}
+ groupKey="permission"
+ />
+ );
+};
+
+export const OnboardingProcedure = ({ data, onDataChanged }) => {
+ const items = [
+ {
+ label: i18n('Network Package'),
+ dataTestId: 'catalog-filter-procedure-network',
+ value: 'NetworkPackage',
+ checked:
+ data.onboardingMethod && data.onboardingMethod.NetworkPackage
+ },
+ {
+ label: i18n('Manual'),
+ dataTestId: 'catalog-filter-procedure-manual',
+ value: 'Manual',
+ checked: data.onboardingMethod && data.onboardingMethod.Manual
+ }
+ ];
+
+ return (
+ <FilterList
+ title={i18n('ONBOARDING PROCEDURE')}
+ items={items}
+ onDataChanged={onDataChanged}
+ data={data}
+ groupKey="onboardingMethod"
+ />
+ );
+};
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js
index edfe592877..9dce52dfd6 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js
@@ -17,10 +17,6 @@
import keyMirror from 'nfvo-utils/KeyMirror.js';
export const actionTypes = keyMirror({
- FILTER_DATA_CHANGED: null
+ FILTER_DATA_CHANGED: null,
+ UPDATE_FILTERED_LIST: null
});
-
-export const itemsType = {
- ACTIVE: '1',
- ARCHIVED: '2'
-};
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterMiddleware.js b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterMiddleware.js
new file mode 100644
index 0000000000..8490bfe675
--- /dev/null
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterMiddleware.js
@@ -0,0 +1,32 @@
+/*
+ * Copyright © 2016-2018 European Support Limited
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import FilterActionHelper from './FilterActionHelper.js';
+import { actionTypes } from './FilterConstants.js';
+
+const filterUpdater = store => next => action => {
+ if (action.type === actionTypes.FILTER_DATA_CHANGED) {
+ const filter = store.getState().onboard.filter;
+
+ FilterActionHelper.updateFilteredItems(store.dispatch, {
+ ...filter,
+ ...action.deltaData
+ });
+ }
+ return next(action);
+};
+
+export default filterUpdater;
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterReducer.js b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterReducer.js
index f1e857498a..28b34753a5 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterReducer.js
@@ -14,8 +14,19 @@
* limitations under the License.
*/
import { actionTypes } from './FilterConstants.js';
+import {
+ itemStatus,
+ versionStatus
+} from 'sdc-app/common/helpers/ItemsHelperConstants.js';
-export default (state = {}, action) => {
+const defaultState = {
+ itemStatus: itemStatus.ACTIVE,
+ versionStatus: versionStatus.DRAFT,
+ entityType: {},
+ permission: {},
+ onboardingMethod: {}
+};
+export default (state = defaultState, action) => {
switch (action.type) {
case actionTypes.FILTER_DATA_CHANGED:
return {
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/ItemsReducer.js b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/ItemsReducer.js
new file mode 100644
index 0000000000..fa1528d8d9
--- /dev/null
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/ItemsReducer.js
@@ -0,0 +1,24 @@
+/*
+ * Copyright © 2016-2018 European Support Limited
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { actionTypes } from './FilterConstants.js';
+export default (state = { vspList: [], vlmList: [] }, action) => {
+ switch (action.type) {
+ case actionTypes.UPDATE_FILTERED_LIST:
+ return action.data;
+ default:
+ return state;
+ }
+};
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx
index 2cc32c2936..a416d36075 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx
@@ -83,8 +83,8 @@ const FilterCatalogHeader = () => (
);
const FeaturedCatalogHeader = featureToggle(featureToggleNames.FILTER)({
- AComp: FilterCatalogHeader,
- BComp: CatalogHeader
+ OnComp: FilterCatalogHeader,
+ OffComp: CatalogHeader
});
class OnboardingCatalogView extends React.Component {
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogViewWithFilter.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogViewWithFilter.jsx
new file mode 100644
index 0000000000..86c437d888
--- /dev/null
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogViewWithFilter.jsx
@@ -0,0 +1,147 @@
+/*
+ * Copyright © 2016-2018 European Support Limited
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import React from 'react';
+import i18n from 'nfvo-utils/i18n/i18n.js';
+import DetailsCatalogView from 'sdc-app/onboarding/onboard/DetailsCatalogView.jsx';
+import VendorCatalogView from './VendorCatalogView.jsx';
+import { tabsMapping } from './OnboardingCatalogConstants.js';
+import { tabsMapping as WCTabsMapping } from 'sdc-app/onboarding/onboard/OnboardConstants.js';
+
+const CatalogHeader = () => (
+ <div className="catalog-header">
+ <div className="catalog-header-tabs">
+ <div className="catalog-header-tab active">
+ {i18n('ONBOARD CATALOG')}
+ </div>
+ </div>
+ </div>
+);
+
+class OnboardingCatalogView extends React.Component {
+ renderViewByTab(activeTab) {
+ const {
+ users,
+ vspOverlay,
+ onSelectLicenseModel,
+ onSelectSoftwareProduct,
+ onAddLicenseModelClick,
+ onAddSoftwareProductClick,
+ onVspOverlayChange,
+ onVendorSelect,
+ selectedVendor,
+ searchValue,
+ onMigrate,
+ filteredItems
+ } = this.props;
+
+ const { vlmList, vspList } = filteredItems;
+
+ switch (activeTab) {
+ case tabsMapping.ARCHIVE:
+ return (
+ <DetailsCatalogView
+ VLMList={vlmList}
+ VSPList={vspList}
+ users={users}
+ onSelectVLM={(item, users) =>
+ onSelectLicenseModel(
+ item,
+ users,
+ WCTabsMapping.CATALOG
+ )
+ }
+ onSelectVSP={(item, users) =>
+ onSelectSoftwareProduct(
+ item,
+ users,
+ WCTabsMapping.CATALOG
+ )
+ }
+ filter={searchValue}
+ onMigrate={onMigrate}
+ />
+ );
+ case tabsMapping.ACTIVE:
+ return (
+ <DetailsCatalogView
+ VLMList={vlmList}
+ VSPList={vspList}
+ users={users}
+ onAddVLM={onAddLicenseModelClick}
+ onAddVSP={onAddSoftwareProductClick}
+ onSelectVLM={(item, users) =>
+ onSelectLicenseModel(
+ item,
+ users,
+ WCTabsMapping.CATALOG
+ )
+ }
+ onSelectVSP={(item, users) =>
+ onSelectSoftwareProduct(
+ item,
+ users,
+ WCTabsMapping.CATALOG
+ )
+ }
+ filter={searchValue}
+ onMigrate={onMigrate}
+ />
+ );
+ case tabsMapping.BY_VENDOR:
+ default:
+ return (
+ <VendorCatalogView
+ licenseModelList={vlmList}
+ users={users}
+ onAddVSP={onAddSoftwareProductClick}
+ onAddVLM={onAddLicenseModelClick}
+ onSelectVSP={(item, users) =>
+ onSelectSoftwareProduct(
+ item,
+ users,
+ WCTabsMapping.CATALOG
+ )
+ }
+ onSelectVLM={(item, users) =>
+ onSelectLicenseModel(
+ item,
+ users,
+ WCTabsMapping.CATALOG
+ )
+ }
+ vspOverlay={vspOverlay}
+ onVendorSelect={onVendorSelect}
+ selectedVendor={selectedVendor}
+ onVspOverlayChange={onVspOverlayChange}
+ onMigrate={onMigrate}
+ filter={searchValue}
+ />
+ );
+ }
+ }
+
+ render() {
+ const { selectedVendor, catalogActiveTab: activeTab } = this.props;
+ return (
+ <div className="catalog-wrapper">
+ {!selectedVendor && <CatalogHeader />}
+ {this.renderViewByTab(activeTab)}
+ </div>
+ );
+ }
+}
+
+export default OnboardingCatalogView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx
index bef47d5acf..12beff7a30 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx
@@ -60,8 +60,8 @@ class VendorItem extends React.Component {
</TileInfoLine>
<TileInfoLine>
<Button
- btnType="outline-rounded"
- color="dark-gray"
+ btnType="secondary"
+ className="venodor-tile-btn"
onClick={e => this.handleVspCountClick(e)}
data-test-id="catalog-vsp-count"
disabled={!softwareProductList.length}>
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/workspace/WorkspaceViewWithFilter.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/workspace/WorkspaceViewWithFilter.jsx
new file mode 100644
index 0000000000..eec59622b3
--- /dev/null
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/workspace/WorkspaceViewWithFilter.jsx
@@ -0,0 +1,57 @@
+/*
+ * Copyright © 2016-2018 European Support Limited
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import React from 'react';
+import DetailsCatalogView from '../DetailsCatalogView.jsx';
+import i18n from 'nfvo-utils/i18n/i18n.js';
+import { tabsMapping } from 'sdc-app/onboarding/onboard/OnboardConstants.js';
+
+const WorkspaceView = props => {
+ let {
+ onAddLicenseModelClick,
+ users,
+ onAddSoftwareProductClick,
+ onSelectLicenseModel,
+ onSelectSoftwareProduct,
+ searchValue,
+ onMigrate,
+ filteredItems: { vspList, vlmList }
+ } = props;
+
+ return (
+ <div className="catalog-wrapper workspace-view">
+ <div className="catalog-header workspace-header">
+ {i18n('WORKSPACE')}
+ </div>
+ <DetailsCatalogView
+ VLMList={vlmList}
+ VSPList={vspList}
+ users={users}
+ onAddVLM={onAddLicenseModelClick}
+ onAddVSP={onAddSoftwareProductClick}
+ onSelectVLM={(item, users) =>
+ onSelectLicenseModel(item, users, tabsMapping.WORKSPACE)
+ }
+ onSelectVSP={(item, users) =>
+ onSelectSoftwareProduct(item, users, tabsMapping.WORKSPACE)
+ }
+ onMigrate={onMigrate}
+ filter={searchValue}
+ />
+ </div>
+ );
+};
+
+export default WorkspaceView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js
index 4a2d7a2ece..25bd32e468 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js
@@ -45,8 +45,11 @@ import { CommitModalType } from 'nfvo-components/panel/versionController/compone
import { actionTypes as commonActionTypes } from 'sdc-app/common/reducers/PlainDataReducerConstants.js';
import versionPageActionHelper from 'sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js';
import { itemTypes } from 'sdc-app/onboarding/versionsPage/VersionsPageConstants.js';
-import { catalogItemStatuses } from 'sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js';
import getValue from 'nfvo-utils/getValue.js';
+import {
+ itemStatus,
+ versionStatus
+} from 'sdc-app/common/helpers/ItemsHelperConstants.js';
function getLicensingData(licensingData = {}) {
const { licenseAgreement, featureGroups } = licensingData;
@@ -112,19 +115,17 @@ function putSoftwareProductAction(id, action, version) {
function fetchSoftwareProductList() {
return RestAPIUtil.fetch(
- `${baseUrl()}?versionFilter=${catalogItemStatuses.DRAFT}`
+ `${baseUrl()}?versionFilter=${versionStatus.DRAFT}`
);
}
function fetchArchivedSoftwareProductList() {
- return RestAPIUtil.fetch(
- `${baseUrl()}?Status=${catalogItemStatuses.ARCHIVED}`
- );
+ return RestAPIUtil.fetch(`${baseUrl()}?Status=${itemStatus.ARCHIVED}`);
}
function fetchFinalizedSoftwareProductList() {
return RestAPIUtil.fetch(
- `${baseUrl()}?versionFilter=${catalogItemStatuses.CERTIFIED}`
+ `${baseUrl()}?versionFilter=${versionStatus.CERTIFIED}`
);
}
@@ -664,9 +665,8 @@ const SoftwareProductActionHelper = {
version
}).then(({ inMerge, isDirty, updatedVersion }) => {
if (
- (updatedVersion.status === catalogItemStatuses.CERTIFIED ||
- updatedVersion.archivedStatus ===
- catalogItemStatuses.ARCHIVED) &&
+ (updatedVersion.status === versionStatus.CERTIFIED ||
+ updatedVersion.archivedStatus === itemStatus.ARCHIVED) &&
(action === VersionControllerActionsEnum.COMMIT ||
action === VersionControllerActionsEnum.SYNC)
) {
@@ -675,8 +675,7 @@ const SoftwareProductActionHelper = {
itemId: softwareProductId
});
const msg =
- updatedVersion.archivedStatus ===
- catalogItemStatuses.ARCHIVED
+ updatedVersion.archivedStatus === itemStatus.ARCHIVED
? i18n('Item was Archived')
: i18n('Item version already Certified');
dispatch({
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreation.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreation.js
index 41584d94e2..9a7d257d7d 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreation.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreation.js
@@ -14,9 +14,11 @@
* permissions and limitations under the License.
*/
import { connect } from 'react-redux';
-
+import featureToggle from 'sdc-app/features/featureToggle.js';
+import { featureToggleNames } from 'sdc-app/features/FeaturesConstants.js';
import SoftwareProductCreationActionHelper from './SoftwareProductCreationActionHelper.js';
import SoftwareProductCreationView from './SoftwareProductCreationView.jsx';
+import SoftwareProductCreationViewWithFilter from './SoftwareProductCreationViewWithFilter.jsx';
import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
import SoftwareProductActionHelper from '../SoftwareProductActionHelper.js';
import VersionsPageActionHelper from 'sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js';
@@ -24,6 +26,16 @@ import { itemTypes as versionItemTypes } from 'sdc-app/onboarding/versionsPage/V
import ScreensHelper from 'sdc-app/common/helpers/ScreensHelper.js';
import { enums, screenTypes } from 'sdc-app/onboarding/OnboardingConstants.js';
import PermissionsActionHelper from 'sdc-app/onboarding/permissions/PermissionsActionHelper.js';
+import UniqueTypesHelper from 'sdc-app/common/helpers/UniqueTypesHelper.js';
+import i18n from 'nfvo-utils/i18n/i18n.js';
+import { itemType } from 'sdc-app/common/helpers/ItemsHelperConstants.js';
+
+const ToggledSoftwareProductCreationView = featureToggle(
+ featureToggleNames.FILTER
+)({
+ OnComp: SoftwareProductCreationViewWithFilter,
+ OffComp: SoftwareProductCreationView
+});
export const mapStateToProps = ({
finalizedLicenseModelList,
@@ -33,7 +45,7 @@ export const mapStateToProps = ({
finalizedSoftwareProductList,
softwareProduct: { softwareProductCreation, softwareProductCategories }
}) => {
- let { genericFieldInfo } = softwareProductCreation;
+ let { genericFieldInfo, vendorList = [] } = softwareProductCreation;
let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
let VSPNames = {};
@@ -52,6 +64,7 @@ export const mapStateToProps = ({
disableVendor: softwareProductCreation.disableVendor,
softwareProductCategories,
finalizedLicenseModelList,
+ vendorList,
isFormValid,
formReady: softwareProductCreation.formReady,
genericFieldInfo,
@@ -99,10 +112,22 @@ export const mapActionsToProps = dispatch => {
});
},
onValidateForm: formName =>
- ValidationHelper.validateForm(dispatch, formName)
+ ValidationHelper.validateForm(dispatch, formName),
+ isNameUnique: (value, name, formName) =>
+ UniqueTypesHelper.isNameUnique(dispatch, {
+ value,
+ name,
+ formName,
+ errorText: `${i18n(
+ 'Software product by the name'
+ )} ${value} ${i18n('already exists')}. ${i18n(
+ 'Software product name must be unique'
+ )}`,
+ itemType: itemType.VSP
+ })
};
};
export default connect(mapStateToProps, mapActionsToProps, null, {
withRef: true
-})(SoftwareProductCreationView);
+})(ToggledSoftwareProductCreationView);
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationActionHelper.js
index 1b1fd71fef..259b50ba4f 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationActionHelper.js
@@ -24,7 +24,11 @@ import {
import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js';
import { actionTypes } from './SoftwareProductCreationConstants.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
-
+import ItemsHelper from 'sdc-app/common/helpers/ItemsHelper.js';
+import {
+ itemStatus,
+ versionStatus
+} from 'sdc-app/common/helpers/ItemsHelperConstants.js';
function baseUrl() {
const restPrefix = Configuration.get('restPrefix');
return `${restPrefix}/v1.0/vendor-software-products/`;
@@ -45,7 +49,7 @@ const SoftwareProductCreationActionHelper = {
type: actionTypes.OPEN,
selectedVendorId: vendorId
});
-
+ this.loadVendorList(dispatch);
dispatch({
type: modalActionTypes.GLOBAL_MODAL_SHOW,
data: {
@@ -78,6 +82,19 @@ const SoftwareProductCreationActionHelper = {
});
return result;
});
+ },
+ async loadVendorList(dispatch) {
+ const { results } = await ItemsHelper.fetchItems({
+ itemStatus: itemStatus.ACTIVE,
+ versionStatus: versionStatus.CERTIFIED,
+ itemType: {
+ vlm: true
+ }
+ });
+ dispatch({
+ type: actionTypes.VENDOR_LIST_LOADED,
+ vendorList: results
+ });
}
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationConstants.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationConstants.js
index ad1034602a..128b3edfd9 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationConstants.js
@@ -18,7 +18,8 @@ import keyMirror from 'nfvo-utils/KeyMirror.js';
export const actionTypes = keyMirror({
OPEN: null,
RESET_DATA: null,
- SOFTWARE_PRODUCT_CREATED: null
+ SOFTWARE_PRODUCT_CREATED: null,
+ VENDOR_LIST_LOADED: null
});
export const SP_CREATION_FORM_NAME = 'SPCREATIONFORM';
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationReducer.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationReducer.js
index 5f70f18f75..b019248ba0 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationReducer.js
@@ -74,6 +74,11 @@ export default (state = {}, action) => {
},
showModal: true
};
+ case actionTypes.VENDOR_LIST_LOADED:
+ return {
+ ...state,
+ vendorList: action.vendorList
+ };
case actionTypes.RESET_DATA:
return {};
default:
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationViewWithFilter.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationViewWithFilter.jsx
new file mode 100644
index 0000000000..810337dbed
--- /dev/null
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationViewWithFilter.jsx
@@ -0,0 +1,329 @@
+/*!
+ * Copyright © 2016-2018 European Support Limited
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
+ * or implied. See the License for the specific language governing
+ * permissions and limitations under the License.
+ */
+import React from 'react';
+import PropTypes from 'prop-types';
+import i18n from 'nfvo-utils/i18n/i18n.js';
+import Validator from 'nfvo-utils/Validator.js';
+import Input from 'nfvo-components/input/validation/Input.jsx';
+import Form from 'nfvo-components/input/validation/Form.jsx';
+import GridSection from 'nfvo-components/grid/GridSection.jsx';
+import GridItem from 'nfvo-components/grid/GridItem.jsx';
+
+import { SP_CREATION_FORM_NAME } from './SoftwareProductCreationConstants.js';
+import sortByStringProperty from 'nfvo-utils/sortByStringProperty.js';
+
+import SoftwareProductCategoriesHelper from 'sdc-app/onboarding/softwareProduct/SoftwareProductCategoriesHelper.js';
+import { onboardingMethod as onboardingMethodConst } from '../SoftwareProductConstants.js';
+
+const SoftwareProductPropType = PropTypes.shape({
+ id: PropTypes.string,
+ name: PropTypes.string,
+ description: PropTypes.string,
+ category: PropTypes.string,
+ subCategory: PropTypes.string,
+ vendorId: PropTypes.string
+});
+
+class SoftwareProductCreationView extends React.Component {
+ static propTypes = {
+ data: SoftwareProductPropType,
+ finalizedLicenseModelList: PropTypes.array,
+ softwareProductCategories: PropTypes.array,
+ VSPNames: PropTypes.object,
+ usersList: PropTypes.array,
+ onDataChanged: PropTypes.func.isRequired,
+ onSubmit: PropTypes.func.isRequired,
+ onCancel: PropTypes.func.isRequired
+ };
+
+ render() {
+ let {
+ softwareProductCategories,
+ data = {},
+ onDataChanged,
+ onCancel,
+ genericFieldInfo,
+ disableVendor
+ } = this.props;
+ let {
+ name,
+ description,
+ vendorId,
+ subCategory,
+ onboardingMethod
+ } = data;
+
+ const vendorList = this.getVendorList();
+ return (
+ <div className="software-product-creation-page">
+ {genericFieldInfo && (
+ <Form
+ ref={validationForm =>
+ (this.validationForm = validationForm)
+ }
+ hasButtons={true}
+ onSubmit={() => this.submit()}
+ onReset={() => onCancel()}
+ labledButtons={true}
+ isValid={this.props.isFormValid}
+ submitButtonText={i18n('Create')}
+ formReady={this.props.formReady}
+ onValidateForm={() => this.validate()}>
+ <GridSection hasLastColSet>
+ <GridItem colSpan="2">
+ <Input
+ value={name}
+ label={i18n('Name')}
+ isRequired={true}
+ onChange={name =>
+ onDataChanged(
+ { name },
+ SP_CREATION_FORM_NAME
+ )
+ }
+ onBlur={this.validateIsNameUnique}
+ isValid={genericFieldInfo.name.isValid}
+ errorText={genericFieldInfo.name.errorText}
+ type="text"
+ className="field-section"
+ data-test-id="new-vsp-name"
+ />
+ <Input
+ label={i18n('Vendor')}
+ type="select"
+ value={vendorId}
+ overlayPos="bottom"
+ isRequired={true}
+ disabled={disableVendor}
+ onChange={e => this.onSelectVendor(e)}
+ isValid={genericFieldInfo.vendorId.isValid}
+ errorText={
+ genericFieldInfo.vendorId.errorText
+ }
+ className="input-options-select"
+ groupClassName="bootstrap-input-options"
+ data-test-id="new-vsp-vendor">
+ {vendorList.map(vendor => (
+ <option
+ key={vendor.title}
+ value={vendor.enum}>
+ {vendor.title}
+ </option>
+ ))}
+ </Input>
+ <Input
+ label={i18n('Category')}
+ type="select"
+ value={subCategory}
+ isRequired={true}
+ onChange={e => this.onSelectSubCategory(e)}
+ isValid={
+ genericFieldInfo.subCategory.isValid
+ }
+ errorText={
+ genericFieldInfo.subCategory.errorText
+ }
+ className="input-options-select"
+ groupClassName="bootstrap-input-options"
+ data-test-id="new-vsp-category">
+ <option key="" value="">
+ {i18n('please select…')}
+ </option>
+ {softwareProductCategories.map(
+ category =>
+ category.subcategories && (
+ <optgroup
+ key={category.name}
+ label={category.name}>
+ {category.subcategories.map(
+ sub => (
+ <option
+ key={
+ sub.uniqueId
+ }
+ value={
+ sub.uniqueId
+ }>{`${
+ sub.name
+ } (${
+ category.name
+ })`}</option>
+ )
+ )}
+ </optgroup>
+ )
+ )}
+ </Input>
+ </GridItem>
+ <GridItem colSpan="2" stretch lastColInRow>
+ <Input
+ value={description}
+ label={i18n('Description')}
+ isRequired={true}
+ overlayPos="bottom"
+ onChange={description =>
+ onDataChanged(
+ { description },
+ SP_CREATION_FORM_NAME
+ )
+ }
+ isValid={
+ genericFieldInfo.description.isValid
+ }
+ errorText={
+ genericFieldInfo.description.errorText
+ }
+ type="textarea"
+ className="field-section"
+ data-test-id="new-vsp-description"
+ />
+ </GridItem>
+ </GridSection>
+ <OnboardingProcedure
+ genericFieldInfo={genericFieldInfo}
+ onboardingMethod={onboardingMethod}
+ onDataChanged={onDataChanged}
+ />
+ </Form>
+ )}
+ </div>
+ );
+ }
+
+ getVendorList() {
+ let { vendorList } = this.props;
+
+ return [{ enum: '', title: i18n('please select...') }].concat(
+ sortByStringProperty(vendorList, 'name').map(vendor => {
+ return {
+ enum: vendor.id,
+ title: vendor.name
+ };
+ })
+ );
+ }
+
+ onSelectVendor(e) {
+ const selectedIndex = e.target.selectedIndex;
+ const vendorId = e.target.options[selectedIndex].value;
+ this.props.onDataChanged({ vendorId }, SP_CREATION_FORM_NAME);
+ }
+
+ onSelectSubCategory(e) {
+ const selectedIndex = e.target.selectedIndex;
+ const subCategory = e.target.options[selectedIndex].value;
+ let { softwareProductCategories, onDataChanged } = this.props;
+ let category = SoftwareProductCategoriesHelper.getCurrentCategoryOfSubCategory(
+ subCategory,
+ softwareProductCategories
+ );
+ onDataChanged({ category, subCategory }, SP_CREATION_FORM_NAME);
+ }
+
+ submit() {
+ let {
+ data: softwareProduct,
+ finalizedLicenseModelList,
+ usersList
+ } = this.props;
+ softwareProduct.vendorName = finalizedLicenseModelList.find(
+ vendor => vendor.id === softwareProduct.vendorId
+ ).name;
+ this.props.onSubmit(softwareProduct, usersList);
+ }
+
+ validateName(value) {
+ const { data: { id }, VSPNames } = this.props;
+ const isExists = Validator.isItemNameAlreadyExistsInList({
+ itemId: id,
+ itemName: value,
+ list: VSPNames
+ });
+
+ return !isExists
+ ? { isValid: true, errorText: '' }
+ : {
+ isValid: false,
+ errorText: i18n(
+ "Software product by the name '" +
+ value +
+ "' already exists. Software product name must be unique"
+ )
+ };
+ }
+
+ validateIsNameUnique = e => {
+ const value = e.target.value;
+ this.props.isNameUnique(value, 'name', SP_CREATION_FORM_NAME);
+ };
+
+ validate() {
+ this.props.onValidateForm(SP_CREATION_FORM_NAME);
+ }
+}
+
+const OnboardingProcedure = ({
+ onboardingMethod,
+ onDataChanged,
+ genericFieldInfo
+}) => {
+ return (
+ <GridSection title={i18n('Onboarding procedure')}>
+ <GridItem colSpan={4}>
+ <Input
+ label={i18n('Network Package')}
+ overlayPos="top"
+ isValid={genericFieldInfo.onboardingMethod.isValid}
+ checked={
+ onboardingMethod ===
+ onboardingMethodConst.NETWORK_PACKAGE
+ }
+ errorText={genericFieldInfo.onboardingMethod.errorText}
+ onChange={() =>
+ onDataChanged(
+ {
+ onboardingMethod:
+ onboardingMethodConst.NETWORK_PACKAGE
+ },
+ SP_CREATION_FORM_NAME
+ )
+ }
+ type="radio"
+ data-test-id="new-vsp-creation-procedure-heat"
+ />
+ </GridItem>
+ <GridItem colSpan={4}>
+ <Input
+ label={i18n('Manual')}
+ overlayPos="bottom"
+ checked={onboardingMethod === onboardingMethodConst.MANUAL}
+ isValid={genericFieldInfo.onboardingMethod.isValid}
+ errorText={genericFieldInfo.onboardingMethod.errorText}
+ onChange={() =>
+ onDataChanged(
+ { onboardingMethod: onboardingMethodConst.MANUAL },
+ SP_CREATION_FORM_NAME
+ )
+ }
+ type="radio"
+ data-test-id="new-vsp-creation-procedure-manual"
+ />
+ </GridItem>
+ </GridSection>
+ );
+};
+
+export default SoftwareProductCreationView;