summaryrefslogtreecommitdiffstats
path: root/openecomp-ui
diff options
context:
space:
mode:
Diffstat (limited to 'openecomp-ui')
-rw-r--r--openecomp-ui/package.json5
-rw-r--r--openecomp-ui/pom.xml16
-rw-r--r--openecomp-ui/resources/scss/_components.scss1
-rw-r--r--openecomp-ui/resources/scss/common/_variables.scss27
-rw-r--r--openecomp-ui/resources/scss/components/_activityLog.scss6
-rw-r--r--openecomp-ui/resources/scss/components/_expandableInput.scss49
-rw-r--r--openecomp-ui/resources/scss/components/_selectActionTable.scss29
-rw-r--r--openecomp-ui/resources/scss/components/_submitErrorResponse.scss17
-rw-r--r--openecomp-ui/resources/scss/components/_validationForm.scss2
-rw-r--r--openecomp-ui/resources/scss/components/_versionController.scss59
-rw-r--r--openecomp-ui/resources/scss/modules/_featureGroup.scss52
-rw-r--r--openecomp-ui/resources/scss/modules/_licenseModelOverview.scss70
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductAttachmentPage.scss32
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductComponentImage.scss6
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductLandingPage.scss18
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareproductComponentLoadBalancing.scss8
-rw-r--r--openecomp-ui/resources/scss/modules/_vspComponentMonitoring.scss18
-rw-r--r--openecomp-ui/resources/scss/modules/_vspHeatSetup.scss137
-rw-r--r--openecomp-ui/resources/scss/modules/onboardingCatalog/_catalogTile.scss51
-rw-r--r--openecomp-ui/resources/scss/modules/onboardingCatalog/_createItemTile.scss14
-rw-r--r--openecomp-ui/resources/scss/onboarding.scss4
-rw-r--r--openecomp-ui/src/nfvo-components/SubmitErrorResponse.jsx6
-rw-r--r--openecomp-ui/src/nfvo-components/fileupload/DraggableUploadFileBox.jsx46
-rw-r--r--openecomp-ui/src/nfvo-components/input/ToggleInput.jsx1
-rw-r--r--openecomp-ui/src/nfvo-components/listEditor/ListEditorView.jsx7
-rw-r--r--openecomp-ui/src/nfvo-components/modal/GlobalModal.js22
-rw-r--r--openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx1
-rw-r--r--openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx2
-rw-r--r--openecomp-ui/src/nfvo-components/table/SelectActionTable.jsx6
-rw-r--r--openecomp-ui/src/nfvo-components/table/SelectActionTableRow.jsx8
-rw-r--r--openecomp-ui/src/nfvo-utils/getValue.js18
-rw-r--r--openecomp-ui/src/sdc-app/common/activity-log/ActivityLogView.jsx3
-rw-r--r--openecomp-ui/src/sdc-app/common/helpers/ValidationHelper.js5
-rw-r--r--openecomp-ui/src/sdc-app/common/reducers/JSONSchemaReducer.js4
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/OnboardingActionHelper.js7
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/OnboardingConstants.js3
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/OnboardingReducers.js18
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js3
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js40
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx19
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js18
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.jsx109
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorActionHelper.js30
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js46
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorReducer.js10
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/Limits.jsx37
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/LicenseModelDescriptionEdit.jsx1
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountItem.jsx4
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/VendorDataView.js2
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/CatalogList.jsx1
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js2
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/SoftwareProductAttachmentsView.jsx37
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupView.jsx51
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/validation/HeatValidationView.jsx28
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/ImageValidations.js6
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditor.js9
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorReducer.js2
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorView.jsx5
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/imagesEditorComponents/FileDetails.jsx1
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/imagesEditorComponents/Version.jsx4
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/loadBalancing/SoftwareProductComponentLoadBalancingRefView.jsx1
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/monitoring/SoftwareProductComponentsMonitoringView.jsx47
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorView.jsx14
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/landingPage/SoftwareProductLandingPageView.jsx17
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesEditorView.jsx14
-rw-r--r--openecomp-ui/test-utils/MockSVGIcon.js17
-rw-r--r--openecomp-ui/test-utils/factories/licenseModel/LimitFactories.js10
-rw-r--r--openecomp-ui/test/licenseModel/entitlementPools/test.js35
-rw-r--r--openecomp-ui/test/licenseModel/licenseKeyGroups/test.js33
-rw-r--r--openecomp-ui/test/nfvo-components/listEditor/listEditor.test.js9
-rw-r--r--openecomp-ui/test/nfvo-components/panel/VersionController/versionController.test.js12
71 files changed, 808 insertions, 644 deletions
diff --git a/openecomp-ui/package.json b/openecomp-ui/package.json
index ef44bfb2b8..f18dd75329 100644
--- a/openecomp-ui/package.json
+++ b/openecomp-ui/package.json
@@ -18,7 +18,7 @@
"storyshots": "jest storyshots.test.js",
"build-storybook": "build-storybook -c .storybook -o .storybook-dist && gulp copy-storybook-fonts && gulp copy-storybook-resources-prod"
},
- "dependencies": {
+ "dependencies": {
"classnames": "^2.2.5",
"core-js": "^2.4.0",
"d3": "^3.5.16",
@@ -40,7 +40,7 @@
"react-sortable": "^1.2.0",
"redux": "^3.3.1",
"restful-js": "^0.7.0",
- "sdc-ui": "1.6.0",
+ "sdc-ui": "1.6.2",
"uuid-js": "^0.7.5",
"validator": "^4.3.0"
},
@@ -110,6 +110,7 @@
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/test-utils/fileMock.js",
"\\.(css|scss)$": "<rootDir>/test-utils/styleMock.js",
"^nfvo-utils/RestAPIUtil.js$": "<rootDir>/test-utils/MockRest.js",
+ "^sdc-ui/lib/react/SVGIcon.js$": "<rootDir>/test-utils/MockSVGIcon.js",
"^nfvo-utils(.*)$": "<rootDir>/src/nfvo-utils$1",
"^nfvo-components(.*)$": "<rootDir>/src/nfvo-components$1",
"^sdc-app(.*)$": "<rootDir>/src/sdc-app$1",
diff --git a/openecomp-ui/pom.xml b/openecomp-ui/pom.xml
index 0e98b7c9c3..77313092c6 100644
--- a/openecomp-ui/pom.xml
+++ b/openecomp-ui/pom.xml
@@ -56,11 +56,11 @@
<groupId>com.github.eirslett</groupId>
<artifactId>frontend-maven-plugin</artifactId>
<version>1.4</version>
-
+
<configuration>
<installDirectory>${project.parent.parent.basedir}</installDirectory>
- </configuration>
-
+ </configuration>
+
<executions>
<execution>
@@ -73,7 +73,7 @@
<npmVersion>3.10.10</npmVersion>
</configuration>
</execution>
-
+
<execution>
<id>npm set progress off</id>
<goals>
@@ -83,7 +83,7 @@
<arguments>set progress=false</arguments>
</configuration>
</execution>
-
+
<execution>
<id>npm install in dox-sequence-diagram-ui</id>
<goals>
@@ -94,7 +94,7 @@
<arguments>install</arguments>
</configuration>
</execution>
-
+
<execution>
<id>npm install</id>
<goals>
@@ -104,14 +104,14 @@
<arguments>install</arguments>
</configuration>
</execution>
-
+
<execution>
<id>npm run build</id>
<goals>
<goal>npm</goal>
</goals>
<configuration>
- <arguments>run build -- --version=${version}</arguments>
+ <arguments>run build</arguments>
</configuration>
</execution>
</executions>
diff --git a/openecomp-ui/resources/scss/_components.scss b/openecomp-ui/resources/scss/_components.scss
index c70b914187..7c726aa8dd 100644
--- a/openecomp-ui/resources/scss/_components.scss
+++ b/openecomp-ui/resources/scss/_components.scss
@@ -16,7 +16,6 @@
@import "components/submitErrorResponse";
@import "components/expandableInput";
@import "components/grid";
-@import "components/icon";
@import "components/activityLog";
@import "components/selectActionTable";
@import "components/datepicker";
diff --git a/openecomp-ui/resources/scss/common/_variables.scss b/openecomp-ui/resources/scss/common/_variables.scss
index 2162b0b1b0..3a3178c6b0 100644
--- a/openecomp-ui/resources/scss/common/_variables.scss
+++ b/openecomp-ui/resources/scss/common/_variables.scss
@@ -47,14 +47,23 @@ $desktop-min-width: 1824px;
/* Textures */
$images-folder-name: "../images";
+/*
+$plus-circle-icon: $images-folder-name + "/plus-circle-icon.svg";
+$interface-icon: $images-folder-name + "/interface.svg";
+$sdc-logo: $images-folder-name + "/logo.svg";
+$warning-icon: $images-folder-name + "/warning.svg";
+*/
/* Icons */
$icons-folder: "../images/icons";
-$artifacts-icon: $images-folder-name + "/artifacts_icon.png";
-$check-icon: $images-folder-name + "/v_icon.png";
-$base-module-icon: $images-folder-name + "/base_icon.png";
-$module-icon: $images-folder-name + "/module_icon.png";
+/*
+$plus-circle-icon: $images-folder-name + "/plus-circle-icon.svg";
+$interface-icon: $images-folder-name + "/interface.svg";
+$sdc-logo: $images-folder-name + "/logo.svg";
+$warning-icon: $images-folder-name + "/warning.svg";
+*/
$pencil-icon: $images-folder-name + "/pencil_icon-01.svg";
+/*
$vc-check-in-icon: $icons-folder + "/checked_in.png";
$vc-checkout-icon: $icons-folder + "/checked_out.png";
$vc-revert-icon: $icons-folder + "/reverticon.png";
@@ -66,11 +75,12 @@ $vc-submit-disabled-icon: $icons-folder + "/submit_icon_disable.png";
$trash-icon: $images-folder-name + "/trash_icon.png";
$download-icon: $images-folder-name + "/download_icon.png";
$upload-icon: $images-folder-name + "/upload_icon.png";
+*/
-
-/* catalog icons */
+/*****
+// catalog icons
$back-icon: $icons-folder + "/back_icon.png";
-/* validation icons */
+// validation icons
$artifacts-selected-icon: $icons-folder + "/artifacts_blue_icon.png";
$artifacts-regular-icon: $icons-folder + "/artifacts_grey_icon.png";
$chevron_down: $icons-folder + "/down_chevron.png";
@@ -93,7 +103,7 @@ $heat-selected-icon: $icons-folder + "/nested_HEAT_icon_blue.png";
$env-icon: $icons-folder + "/env_icon.png";
$env-selected-icon: $icons-folder + "/env_icon_blue.png";
-/* vlm summary icons */
+// vlm summary icons
$vlm-summary-plus-blue: $icons-folder + "/plus_vlm_summary_icon_blue.png";
$vlm-summary-plus: $icons-folder + "/plus_vlm_summary_icon.png";
@@ -102,4 +112,5 @@ $vlm-summary-orphans: $icons-folder + "/orphans_grey_icon.png";
$vlm-summary-orphans-blue: $icons-folder + "/orphans_blue_icon-n.png";
$vlm-summary-used: $icons-folder + "/vlm_list_view_grey_icon.png";
$vlm-summary-used-blue: $icons-folder + "/vlm_list_view_blue_icon.png";
+*****/
diff --git a/openecomp-ui/resources/scss/components/_activityLog.scss b/openecomp-ui/resources/scss/components/_activityLog.scss
index 9ada804934..5e9418ed7d 100644
--- a/openecomp-ui/resources/scss/components/_activityLog.scss
+++ b/openecomp-ui/resources/scss/components/_activityLog.scss
@@ -39,11 +39,7 @@ $message-info-icon-size: 16px;
.svg-icon-wrapper {
float: right;
}
- .checkCircle {
- fill: $green;
- width: 16px;
- height: 16px;
- }
+
.status-icon.false:after {
@include status-icon-class;
float: right;
diff --git a/openecomp-ui/resources/scss/components/_expandableInput.scss b/openecomp-ui/resources/scss/components/_expandableInput.scss
index 52b72d7c91..2484a73e8a 100644
--- a/openecomp-ui/resources/scss/components/_expandableInput.scss
+++ b/openecomp-ui/resources/scss/components/_expandableInput.scss
@@ -1,24 +1,21 @@
.expandable-input-top {
display: flex;
height: 22px;
- .svg-icon-wrapper {
- height: 17px;
- width: 17px;
- }
.expandable-input-wrapper {
display: flex;
- .svg-icon.search {
- height: 17px;
- width: 17px;
- }
&.closed {
- .svg-icon.search {
- transition: fill 0.5s ease-in;
- fill: $blue;
- cursor: pointer;
- &:hover {
+ .svg-icon
+ {
+ &.__search {
+ height: 17px;
+ width: 17px;
transition: fill 0.5s ease-in;
- fill: $dark-blue;
+ fill: $blue;
+ cursor: pointer;
+ &:hover {
+ transition: fill 0.5s ease-in;
+ fill: $dark-blue;
+ }
}
}
}
@@ -26,17 +23,21 @@
.svg-icon-wrapper {
margin-left: 3px;
}
- .svg-icon.search {
- fill: $dark-blue;
+ .svg-icon {
+ &.__search {
+ height: 17px;
+ width: 17px;
+ fill: $dark-blue;
+ }
}
- .svg-icon.close {
- margin-left: 7px;
- height: 10px;
- width: 10px;
- opacity: 0.6;
- fill: $dark-gray;
- &:hover {
- opacity: 1;
+ .svg-icon {
+ &.__close {
+ margin-left: 7px;
+ opacity: 0.6;
+ fill: $dark-gray;
+ &:hover {
+ opacity: 1;
+ }
}
}
}
diff --git a/openecomp-ui/resources/scss/components/_selectActionTable.scss b/openecomp-ui/resources/scss/components/_selectActionTable.scss
index 79a5432ef1..fa8eb3110c 100644
--- a/openecomp-ui/resources/scss/components/_selectActionTable.scss
+++ b/openecomp-ui/resources/scss/components/_selectActionTable.scss
@@ -1,15 +1,13 @@
.select-action-table-view {
.svg-icon-wrapper {
flex-direction: row;
-
- &::before {
- content:"";
- }
.svg-icon {
- margin-left: 5px;
- margin-right: 5px;
- width:16px;
- height:16px;
+ &:not(.__plus) {
+ margin-left: 5px;
+ margin-right: 5px;
+ width:16px;
+ height:16px;
+ }
}
}
.dummy-icon {
@@ -57,21 +55,6 @@
display: flex;
flex-direction: row;
margin-bottom: 14px;
- .svg-icon-wrapper.trashO {
- .svg-icon {
- fill: $dark-gray;
- }
- }
- .svg-icon-wrapper.errorCircle {
- .svg-icon {
- fill: $red;
- }
- }
- .svg-icon-wrapper.checkCircle {
- .svg-icon {
- fill: $green;
- }
- }
.svg-icon-wrapper.hideDelete {
.svg-icon {
fill: $white;
diff --git a/openecomp-ui/resources/scss/components/_submitErrorResponse.scss b/openecomp-ui/resources/scss/components/_submitErrorResponse.scss
index b917dfefeb..f045038193 100644
--- a/openecomp-ui/resources/scss/components/_submitErrorResponse.scss
+++ b/openecomp-ui/resources/scss/components/_submitErrorResponse.scss
@@ -26,14 +26,19 @@
background-color: $tlv-gray;
padding: 5px;
cursor: pointer;
- .chevronDown {
- width:10px;
- height:10px;
- margin-right: 10px;
- &.right {
- transform: rotate(270deg);
+ .svg-icon {
+ &.__chevronDown {
+ margin-right: 10px;
}
}
+ .collapse-right {
+ .svg-icon {
+ &.__chevronDown {
+ transform: rotate(270deg);
+ }
+ }
+
+ }
}
.error-code-list-item {
diff --git a/openecomp-ui/resources/scss/components/_validationForm.scss b/openecomp-ui/resources/scss/components/_validationForm.scss
index e4aac32b74..e1adb5650f 100644
--- a/openecomp-ui/resources/scss/components/_validationForm.scss
+++ b/openecomp-ui/resources/scss/components/_validationForm.scss
@@ -75,7 +75,7 @@ form {
flex: 0.2;
content: ' ';
}
- @media (min-width: 1349px) {
+ @media (min-width: 1389px) {
&.add-line-break {
.control-label {
&:after {
diff --git a/openecomp-ui/resources/scss/components/_versionController.scss b/openecomp-ui/resources/scss/components/_versionController.scss
index b454d3496b..57610986c3 100644
--- a/openecomp-ui/resources/scss/components/_versionController.scss
+++ b/openecomp-ui/resources/scss/components/_versionController.scss
@@ -59,56 +59,33 @@
margin-right: 20px;
padding-bottom: 5px;
- .versionControllerLockClosed {
+
+ .svg-icon {
fill: $dark-gray;
- width: 21px;
- height: 23px;
- margin-top: -3px;
- &.disabled {
- fill: $light-gray;
- }
&:hover {
fill: $black;
}
- }
- .versionControllerLockOpen {
- fill: $dark-gray;
- width: 24px;
- height: 28px;
- margin-top: -6px;
- &:hover {
- fill: $black;
+ &.__versionControllerLockClosed {
+ margin-top: -3px;
}
- }
- .versionControllerSubmit {
- fill: $blue;
- &.disabled {
- fill: $light-gray;
+ &.__versionControllerLockOpen {
+ margin-top: -6px;
}
- &:hover {
- fill: $dark-blue;
+ &.__versionControllerSubmit {
+ fill: $blue;
+ &:hover {
+ fill: $dark-blue;
+ }
+ &.disabled {
+ fill: $dark-gray;
+ }
}
}
-
- .versionControllerRevert {
- fill: $dark-gray;
- &.disabled {
- fill: $light-gray;
- }
- &:hover {
- fill: $black;
- }
- }
- .versionControllerSave {
- fill: $dark-gray;
- &.disabled {
- fill: $light-gray;
- }
- &:hover {
- fill: $black;
- }
}
- }
+
+
+
+
}
.vc-nav-item-close {
display: flex;
diff --git a/openecomp-ui/resources/scss/modules/_featureGroup.scss b/openecomp-ui/resources/scss/modules/_featureGroup.scss
index 9d395f98c8..5f98ed2c05 100644
--- a/openecomp-ui/resources/scss/modules/_featureGroup.scss
+++ b/openecomp-ui/resources/scss/modules/_featureGroup.scss
@@ -1,23 +1,37 @@
.feature-groups-list-editor {
- .list-editor-view-list {
- .list-editor-item-view {
- min-height: 110px;
- height: 110px;
- }
- .list-editor-item-view-field {
- .feature-groups-count-field {
- display: inline-block;
- &:first-child {
- margin-right: 95px;
- }
- }
- .feature-groups-count-ep {
- @extend .heading-1;
- color: $light-blue;
+ .list-editor-view{
+ .list-editor-view-list {
+ .list-editor-item-view {
+ min-height: 110px;
+ height: 110px;
}
- .feature-groups-count-lk {
- @extend .heading-1;
- color: $light-green;
+ .list-editor-item-view-content {
+ .list-editor-item-view-field {
+ &.smaller-field {
+ flex: 0.35;
+ }
+ .feature-groups-count-field {
+ display: inline-block;
+ &:first-child {
+ margin-right: 95px;
+ }
+ }
+ .feature-groups-count-ep {
+ @extend .heading-1;
+ color: $light-blue;
+ }
+ .feature-groups-mrn-ep {
+ @extend .body-1;
+ color: $light-blue;
+ }
+ .feature-groups-count-lk {
+ @extend .heading-1;
+ color: $light-green;
+ }
+ .title-no-wrap {
+ white-space: nowrap;
+ }
+ }
}
}
}
@@ -39,7 +53,7 @@
.nav.nav-tabs {
padding-left: 50px;
}
-
+
.tab-content {
padding: 50px;
.field-section {
diff --git a/openecomp-ui/resources/scss/modules/_licenseModelOverview.scss b/openecomp-ui/resources/scss/modules/_licenseModelOverview.scss
index 1c133a1dce..15bb9a7033 100644
--- a/openecomp-ui/resources/scss/modules/_licenseModelOverview.scss
+++ b/openecomp-ui/resources/scss/modules/_licenseModelOverview.scss
@@ -61,26 +61,34 @@ $lkg-ep-color: $light-blue;
&:not(.read-only) .vendor-description {
border: 1px solid transparent;
+ width: 100%;
padding: 2px 0 2px 6px;
margin-top: 10px;
-
+ position: relative;
+ .svg-icon-wrapper {
+ position: absolute;;
+ right:0;
+ top:0;
+ opacity: 0;
+ }
$hover-padding-right: 16px;
@include percent-plus-value($property: width, $percent: 100%, $value: -$hover-padding-right); // compensate for padding added on hover
&:hover {
padding-right: $hover-padding-right;
- width: 100%;
border: 1px solid $light-gray;
cursor: pointer;
- background-position: calc(100% - 4px) 4px;
- background-size: 14px;
- background-image: url($pencil-icon);
- background-repeat: no-repeat;
- background-color: white;
-
+ background-color: $white;
+ .svg-icon-wrapper {
+ opacity: 1;
+ z-index: 10;
+ }
.description-data:after {
background: white;
}
+ .description-data {
+ width: 100%;
+ }
}
}
@@ -167,20 +175,23 @@ $lkg-ep-color: $light-blue;
flex-grow: 2;
margin-left: 5px;
}
- .add-button {
- cursor: pointer;
- font-size: larger;
- background-image: url($vlm-summary-plus);
- background-size: 20px;
- background-repeat: no-repeat;
- width:20px;
- height:20px;
- margin-top: 3px;
- margin-left: auto;
- &:hover {
- cursor: pointer;
- background-image: url($vlm-summary-plus-blue);
- }
+ .summary-name-and-count {
+ width: 100%;
+ }
+ .svg-icon-wrapper {
+
+ .svg-icon {
+ &.__plusCircle {
+ width: 20px;
+ height: 20px;
+ margin-top: 3px;
+ margin-left: auto;
+ fill: $dark-gray;
+ &:hover {
+ fill: $blue;
+ }
+ }
+ }
}
.summary-name-and-count {
@@ -205,7 +216,7 @@ $lkg-ep-color: $light-blue;
}
}
.vlm-list-tab-panel {
-
+
@extend .flex;
margin-bottom: 7px;
.section-title {
@@ -221,6 +232,7 @@ $lkg-ep-color: $light-blue;
margin-left:10px;
cursor: pointer;
}
+ /**
.vlm-list-icon {
background-size: 32px;
background-repeat: no-repeat;
@@ -237,7 +249,7 @@ $lkg-ep-color: $light-blue;
background-image: url($vlm-summary-orphans-blue);
}
}
-
+ **/
}
}
@@ -260,7 +272,7 @@ $lkg-ep-color: $light-blue;
.vlm-list-item.orphan-list-item {
@include overview-tile-shadow();
margin-left: 0;
-
+
.vlm-list-item-title {
.item-name {
@@ -304,7 +316,7 @@ $lkg-ep-color: $light-blue;
.clickable {
cursor: pointer;
}
-
+
.list-item-section {
.count-value {
@extend .body-3;
@@ -365,7 +377,7 @@ $lkg-ep-color: $light-blue;
}
.arrow-icon {
align-self: center;
-
+
}
.vlm-item-info {
flex: 1;
@@ -424,7 +436,7 @@ $lkg-ep-color: $light-blue;
@include create-circle($circle-icon-size,$fg-color,'FG');
color: $white;
}
-
+
.vlm-list-item-title {
.item-name {
color: $fg-color;
@@ -465,7 +477,7 @@ $lkg-ep-color: $light-blue;
margin-left: 52px;
}
}
-
+
}
&.vlm-list-item-lkg {
margin-top: 10px;
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductAttachmentPage.scss b/openecomp-ui/resources/scss/modules/_softwareProductAttachmentPage.scss
index bab2872691..0e092dd8bb 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductAttachmentPage.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductAttachmentPage.scss
@@ -22,20 +22,7 @@
right: 40px;
top: 15px;
display: flex;
- .icon-label {
- color: $dark-gray;
- }
- .go-to-overview-icon {
- .icon-label {
- color: $blue;
- }
- &.disabled {
- .icon-label {
- color: $gray;
- }
- }
- }
.icon-component {
margin-right: 30px;
@@ -104,6 +91,11 @@
z-index: 1;
padding-right: 20px;
.counter {
+ .svg-icon {
+ &.__exclamationTriangleLine {
+ fill :$orange;
+ }
+ }
display: flex;
&:first-child {
margin-right: 20px;
@@ -145,8 +137,8 @@
justify-content: space-between;
height: 40px;
align-items: center;
- .svg-icon-wrapper.chevronDown, .svg-icon-wrapper.chevronUp {
- .svg-icon {
+ .svg-icon {
+ &.__chevronUp, &.__chevronDown {
height: 10px;
width: 10px;
}
@@ -224,6 +216,13 @@
.error-item {
display: flex;
margin: 10px 0;
+ .large {
+ .svg-icon {
+ width: 20px;
+ height: 20px;
+ fill: $orange;
+ }
+ }
.error-item-file-type {
margin-left: 15px;
}
@@ -231,6 +230,9 @@
@extend .body-1-semibold;
margin-right: 5px;
}
+
+
+
}
}
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductComponentImage.scss b/openecomp-ui/resources/scss/modules/_softwareProductComponentImage.scss
index 068404fcb6..dad837f356 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductComponentImage.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductComponentImage.scss
@@ -16,6 +16,12 @@
}
}
+.vsp-components-image-editor {
+ .note-text {
+ color: $red;
+ }
+}
+
.image-modal-edit, .image-modal-new {
.modal-body {
padding: 0;
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductLandingPage.scss b/openecomp-ui/resources/scss/modules/_softwareProductLandingPage.scss
index 56860101b2..9b0375d24a 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductLandingPage.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductLandingPage.scss
@@ -28,21 +28,19 @@
.missing-license {
display: flex;
align-items: baseline;
- .svg-icon-wrapper.exclamationTriangleFull .svg-icon{
- fill: $orange;
+ .svg-icon{
+ margin-right: 7px;
+ margin-left: 3px;
+ &.__exclamationTriangleFull {
+ fill: $orange;
+ width: 17px;
+ height: 17px;
+ }
}
.warning-text {
position: relative;
top: -2px;
}
- .svg-icon-wrapper {
- margin-right: 7px;
- margin-left: 3px;
- .svg-icon {
- height: 17px;
- width: 17px;
- }
- }
}
}
.name {
diff --git a/openecomp-ui/resources/scss/modules/_softwareproductComponentLoadBalancing.scss b/openecomp-ui/resources/scss/modules/_softwareproductComponentLoadBalancing.scss
index ceae4a00de..d1f3f488bd 100644
--- a/openecomp-ui/resources/scss/modules/_softwareproductComponentLoadBalancing.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareproductComponentLoadBalancing.scss
@@ -1,13 +1,7 @@
.vsp-components-load-balancing {
.svg-icon-wrapper {
position: relative;
- top: -3px;
- &.chevronUp, &.chevronDown {
- .svg-icon {
- width: 10px;
- height: 10px;
- }
- }
+ top: -4px;
}
.halb-data {
diff --git a/openecomp-ui/resources/scss/modules/_vspComponentMonitoring.scss b/openecomp-ui/resources/scss/modules/_vspComponentMonitoring.scss
index 4bcf7940eb..bda8512f36 100644
--- a/openecomp-ui/resources/scss/modules/_vspComponentMonitoring.scss
+++ b/openecomp-ui/resources/scss/modules/_vspComponentMonitoring.scss
@@ -1,6 +1,6 @@
.vsp-component-monitoring {
- .snmp-dropzone {
+ .dropzone {
.section-title {
padding-bottom: 20px;
}
@@ -22,7 +22,7 @@
}
.drag-text {
color: $blue;
- @extend .body-1-semibold;
+ @extend .body-1-semibold
}
.or-text {
margin-top: 10px;
@@ -30,6 +30,20 @@
}
}
+ .monitoring-file {
+ display: flex;
+ .filename {
+ opacity: 1;
+ width: auto;
+ border-right-style: none;
+ }
+ .delete {
+ display: flex;
+ width: 30px;
+ justify-content: center;
+ align-items: center;
+ }
+ }
}
.delete-button {
diff --git a/openecomp-ui/resources/scss/modules/_vspHeatSetup.scss b/openecomp-ui/resources/scss/modules/_vspHeatSetup.scss
index 75d96b4c85..bd216c794b 100644
--- a/openecomp-ui/resources/scss/modules/_vspHeatSetup.scss
+++ b/openecomp-ui/resources/scss/modules/_vspHeatSetup.scss
@@ -24,10 +24,12 @@
position: relative;
top: -2px;
}
+
.modules-list-wrapper {
- padding-bottom: 20px;
- margin-bottom: 20px;
- border-bottom: 1px solid $tlv-light-gray;
+ &.modules-list-wrapper-divider {
+ border-bottom: 1px solid $tlv-light-gray;
+ }
+
ul {
.undefined-dragging {
opacity: 0.5;
@@ -36,7 +38,7 @@
display: flex;
justify-content: space-between;
flex-wrap: wrap;
-
+ padding-bottom: 3px;
.Select-value-label {
@include ellipsis(85%);
}
@@ -55,24 +57,6 @@
}
}
- .modules-list-controllers {
- text-align: right;
- .btn-link {
- &[disabled] {
- color: $gray;
- }
- @extend .body-1;
- color: $blue;
- &:last-child {
- padding-right: 0;
- }
- &:hover {
- color: $dark-blue;
- text-decoration: none;
- }
- }
- }
-
.modules-list-item-controllers {
display: flex;
justify-content: space-between;
@@ -82,16 +66,15 @@
min-width: 0;
}
- .svg-icon-wrapper.trashO {
- .svg-icon {
- fill: $dark-gray;
- height: 18px;
- width: 18px;
- &:hover {
- fill: $black;
+ .svg-icon {
+ &.__trashO {
+ fill: $dark-gray;
+ &:hover {
+ fill: $black;
+ }
}
- }
}
+
.module-title-by-type {
@extend .heading-5-semibold;
margin-right: 3px;
@@ -100,15 +83,15 @@
display: flex;
align-items: center;
- .svg-icon-wrapper.pencil {
- .svg-icon {
- height: 15px;
- width: 15px;
+ .svg-icon {
+ &.__pencil {
+ margin-left: 3px;
+ opacity: 0;
}
- margin-left: 3px;
- opacity: 0;
}
+
+
.filename-text {
@extend .heading-5-semibold;
@@ -144,14 +127,16 @@
border-color: transparent;
}
}
- .svg-icon-wrapper.pencil {
- margin-left: 10px;
- opacity: 1;
- .svg-icon {
- stroke: $dark-gray;
- &:hover {
- stroke: $black;
- }
+ .svg-icon {
+ &.__pencil {
+ margin-left: 10px;
+ opacity: 1;
+ .svg-icon {
+ stroke: $dark-gray;
+ &:hover {
+ stroke: $black;
+ }
+ }
}
}
}
@@ -173,23 +158,8 @@
}
}
.add-or-delete-volumes {
- .svg-icon-wrapper {
- margin-right: 8px;
- .svg-icon {
- height: 10px;
- width: 10px;
- fill: $blue;
- }
- }
- cursor: pointer;
- color: $blue;
+ margin-right: 8px;
margin-bottom: 11px;
- &:hover {
- color: $dark-blue;
- .svg-icon {
- fill: $dark-blue;
- }
- }
}
&:before {
content: "\00B7\00B7\00B7\00B7\00B7\00B7";
@@ -208,7 +178,9 @@
.artifact-files {
@include modules-and-artifacts-list-items;
- margin-top: 20px;
+ &.with-list-items {
+ margin-top: 10px;
+ }
&.nested {
.nested-list {
@@ -238,21 +210,20 @@
display: flex;
}
- .add-all-unassigned {
- @extend .body-1;
- margin-bottom: 0;
- color: $blue;
- cursor: pointer;
- &:hover {
- color: $dark-blue;
- }
- }
}
}
}
+ .modules-list-header {
+ height: 30px;
+ display: flex;
+ flex-direction: row;
+ flex-wrap: nowrap;
+ justify-content: flex-end;
+ align-items: baseline;
+ }
+
.unassigned-files {
- margin-top: 30px;
border: 1px solid $light-gray;
background-color: $white;
height: 250px;
@@ -283,26 +254,12 @@
@extend .heading-4;
margin-bottom: 10px;
}
- .link {
- color: $blue;
- cursor: pointer;
- display: flex;
- align-items: center;
+ .svg-icon-wrapper {
margin-bottom: 10px;
- .svg-icon-wrapper.angleRight {
- .svg-icon {
- height: 10px;
- width: 10px;
- margin-left: 7px;
- fill: $blue;
- }
- }
- &:hover {
- color: $dark-blue;
- .svg-icon-wrapper.angleRight {
- .svg-icon {
- fill: $dark-blue;
- }
+ .svg-icon {
+ &.__angleRight {
+ width: 10px;
+ height: 10px;
}
}
}
diff --git a/openecomp-ui/resources/scss/modules/onboardingCatalog/_catalogTile.scss b/openecomp-ui/resources/scss/modules/onboardingCatalog/_catalogTile.scss
index 87a852f755..612ec495cd 100644
--- a/openecomp-ui/resources/scss/modules/onboardingCatalog/_catalogTile.scss
+++ b/openecomp-ui/resources/scss/modules/onboardingCatalog/_catalogTile.scss
@@ -79,36 +79,22 @@
width: 58px;
margin-left: 122px;
background-repeat: no-repeat;
- .svg-icon-wrapper {
- &.vendor {
- .svg-icon {
+ .svg-icon {
+ &.__vendor {
fill: $dark-gray;
- width: 53px;
- height: 47px;
&:hover {
fill: $dark-gray;
}
- }
margin-top: 22px;
-
}
- &.vsp {
- .svg-icon {
+ &.__vsp {
fill: $light-blue;
- width: 60px;
- height: 40px;
}
margin-top: 18px;
margin-left: 3px;
- }
- &.vlm {
+ &.__vlm {
margin-top: 18px;
- .svg-icon {
fill: $purple;
-
- width: 45px;
- height: 53px;
- }
}
}
}
@@ -121,13 +107,11 @@
margin-top: 2px;
padding-bottom: 3px;
@extend .body-2-semibold;
- .svg-icon-wrapper {
- &.plus {
- .svg-icon {
- height: 9px;
- width: 9px;
+ .svg-icon {
+ &.__plus {
+ width: 20px;
+ height: 20px;
fill: $blue;
- }
}
}
.catalog-tile-item-details {
@@ -136,6 +120,13 @@
.catalog-tile-add-new-vsp {
color: $blue;
+ .svg-icon {
+ &.__plus {
+ width: 20px;
+ height: 20px;
+
+ }
+ }
margin-left: 40px;
}
.catalog-tile-locking-user-name {
@@ -143,18 +134,12 @@
@include ellipsis(auto, inline-block, 180px);
}
.catalog-tile-check-in-status {
- .svg-icon-wrapper {
- &.locked {
- .svg-icon {
- width: 11px;
+ .svg-icon {
+ &.__locked {
fill: $gray;
- }
}
- &.unlocked {
- .svg-icon {
- width: 11px;
+ &.__unlocked {
fill: $gray;
- }
}
}
}
diff --git a/openecomp-ui/resources/scss/modules/onboardingCatalog/_createItemTile.scss b/openecomp-ui/resources/scss/modules/onboardingCatalog/_createItemTile.scss
index aa3cf04c4f..d17dcdd685 100644
--- a/openecomp-ui/resources/scss/modules/onboardingCatalog/_createItemTile.scss
+++ b/openecomp-ui/resources/scss/modules/onboardingCatalog/_createItemTile.scss
@@ -37,12 +37,14 @@
}
}
.create-item-plus-icon{
- width: 19px;
- height: 19px;
- margin: -5px 12px 0 0;
- .svg-icon.plus {
- height: 19px;
- width: 19px;
+ margin: -5px 12px 0 0;
+ height: 19px;
+ width: 19px;
+ .svg-icon {
+ &.__plus {
+ width: 19px;
+ height: 19px;
+ }
}
}
&.vlm-type {
diff --git a/openecomp-ui/resources/scss/onboarding.scss b/openecomp-ui/resources/scss/onboarding.scss
index b49a7cb423..94dc223be3 100644
--- a/openecomp-ui/resources/scss/onboarding.scss
+++ b/openecomp-ui/resources/scss/onboarding.scss
@@ -23,14 +23,14 @@ div[data-reactroot].customized-date-picker-calendar {
width: 12px;
height: 12px;
margin-top: 2px;
- content: url(../images/angle-left.svg);
+ content: url(../../node_modules/sdc-ui/assets/icons/angleLeft.svg);
}
.react-datepicker__navigation--next {
border: none;
width: 12px;
height: 12px;
margin-top: 2px;
- content: url(../images/angle-right.svg);
+ content: url(../../node_modules/sdc-ui/assets/icons/angleRight.svg);
}
.react-datepicker__month-container {
.react-datepicker__header {
diff --git a/openecomp-ui/src/nfvo-components/SubmitErrorResponse.jsx b/openecomp-ui/src/nfvo-components/SubmitErrorResponse.jsx
index 5fe592a663..1488c6c0bb 100644
--- a/openecomp-ui/src/nfvo-components/SubmitErrorResponse.jsx
+++ b/openecomp-ui/src/nfvo-components/SubmitErrorResponse.jsx
@@ -17,7 +17,6 @@ import React, {Component} from 'react';
import ListGroupItem from 'react-bootstrap/lib/ListGroupItem.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
-import Icon from 'nfvo-components/icon/Icon.jsx';
import {Collapse} from 'react-bootstrap';
/**
* parsing and showing the following Java Response object
@@ -145,8 +144,7 @@ class ErrorBlock extends React.Component {
const ErrorHeader = ({errorType, collapsed, onClick}) => {
return(
<div onClick={onClick} className='error-block-header'>
- <SVGIcon iconClassName={collapsed ? '' : 'right' } name='chevronDown'/>
- {errorType}
+ <SVGIcon iconClassName={collapsed ? '' : 'collapse-right' } name='chevronDown' label={errorType} labelPosition='right'/>
</div>
);
};
@@ -154,7 +152,7 @@ const ErrorHeader = ({errorType, collapsed, onClick}) => {
const ErrorMessage = ({error, warning}) => {
return (
<ListGroupItem className='error-code-list-item'>
- <Icon image={warning ? 'warning' : 'error'} label={error}/>
+ <SVGIcon name={warning ? 'warning' : 'error'} label={error} labelPosition='right' color={warning ? 'warning' : 'negative'} labelClassName='icon-label'/>
</ListGroupItem>
);
};
diff --git a/openecomp-ui/src/nfvo-components/fileupload/DraggableUploadFileBox.jsx b/openecomp-ui/src/nfvo-components/fileupload/DraggableUploadFileBox.jsx
new file mode 100644
index 0000000000..629b9449a2
--- /dev/null
+++ b/openecomp-ui/src/nfvo-components/fileupload/DraggableUploadFileBox.jsx
@@ -0,0 +1,46 @@
+/*!
+ * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ *
+ * 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.
+ */
+/**
+ * The HTML structure here is aligned with bootstrap HTML structure for form elements.
+ * In this way we have proper styling and it is aligned with other form elements on screen.
+ *
+ * Select and MultiSelect options:
+ *
+ * label - the label to be shown which paired with the input
+ *
+ * all other "react-select" props - as documented on
+ * http://jedwatson.github.io/react-select/
+ * or
+ * https://github.com/JedWatson/react-select
+ */
+import React, {Component} from 'react';
+import i18n from 'nfvo-utils/i18n/i18n.js';
+import Button from 'sdc-ui/lib/react/Button.js';
+
+class DraggableUploadFileBox extends Component {
+ render() {
+ let {className, onClick, dataTestId, isReadOnlyMode} = this.props;
+ return (
+ <div
+ className={`${className}${isReadOnlyMode ? ' disabled' : ''}`}>
+ <div className={`${'drag-text'}${isReadOnlyMode ? ' disabled' : ''}`}>{i18n('Drag & drop for upload')}</div>
+ <div className='or-text'>{i18n('or')}</div>
+ <Button type='button' data-test-id={dataTestId} btnType='outline' onClick={onClick} disabled={isReadOnlyMode === true}>{i18n('Select File')}</Button>
+ </div>
+ );
+ }
+}
+export default DraggableUploadFileBox;
diff --git a/openecomp-ui/src/nfvo-components/input/ToggleInput.jsx b/openecomp-ui/src/nfvo-components/input/ToggleInput.jsx
index 7bbafa3696..23af72a26a 100644
--- a/openecomp-ui/src/nfvo-components/input/ToggleInput.jsx
+++ b/openecomp-ui/src/nfvo-components/input/ToggleInput.jsx
@@ -41,6 +41,7 @@ class ToggleInput extends React.Component {
render() {
let {label, disabled} = this.props;
let checked = this.status() === 'on';
+ //TODO check onclick
return (
<div className='toggle-input-wrapper form-group' onClick={!disabled && this.click}>
<div className='toggle-input-label'>{label}</div>
diff --git a/openecomp-ui/src/nfvo-components/listEditor/ListEditorView.jsx b/openecomp-ui/src/nfvo-components/listEditor/ListEditorView.jsx
index cc805e9ada..df7d69b4ff 100644
--- a/openecomp-ui/src/nfvo-components/listEditor/ListEditorView.jsx
+++ b/openecomp-ui/src/nfvo-components/listEditor/ListEditorView.jsx
@@ -14,6 +14,7 @@
* permissions and limitations under the License.
*/
import React from 'react';
+import Button from 'sdc-ui/lib/react/Button.js';
import classnames from 'classnames';
import ExpandableInput from 'nfvo-components/input/ExpandableInput.jsx';
@@ -21,11 +22,9 @@ const ListEditorHeader = ({onAdd, isReadOnlyMode, title, plusButtonTitle}) => {
return (
<div className='list-editor-view-header'>
{title && <div className='list-editor-view-title'>{title}</div>}
- <div className={`list-editor-view-add-controller${isReadOnlyMode ? ' disabled' : ''}`}>
+ <div>
{ onAdd &&
- <div className='list-editor-view-add-title' data-test-id='add-button' onClick={onAdd}>
- <span>{`+ ${plusButtonTitle}`}</span>
- </div>
+ <Button data-test-id='add-button' iconName='plusThin' btnType='link' onClick={onAdd} disabled={isReadOnlyMode === true}>{plusButtonTitle}</Button>
}
</div>
</div>
diff --git a/openecomp-ui/src/nfvo-components/modal/GlobalModal.js b/openecomp-ui/src/nfvo-components/modal/GlobalModal.js
index 825cc609a8..e05c2ac616 100644
--- a/openecomp-ui/src/nfvo-components/modal/GlobalModal.js
+++ b/openecomp-ui/src/nfvo-components/modal/GlobalModal.js
@@ -31,21 +31,35 @@ const typeClass = {
success: 'positive'
};
+const type2HeaderColor = {
+ 'default': 'primary',
+ error: 'danger',
+ warning: 'warning',
+ success: 'success'
+};
+
-const ModalFooter = ({type, onConfirmed, onDeclined, onClose, confirmationButtonText, cancelButtonText}) =>
+const ModalFooter = ({type, onConfirmed, onDeclined, onClose, confirmationButtonText, cancelButtonText}) => {
+ let myPropsForNoConfirmed = {};
+ if (onConfirmed) {
+ myPropsForNoConfirmed.btnType = 'outline';
+ }
+ return (
<Modal.Footer>
<div className='sdc-modal-footer'>
{onConfirmed && <Button color={typeClass[type]} onClick={() => {
onConfirmed();
onClose();
}}>{confirmationButtonText}</Button>}
- <Button btnType='outline' color={typeClass[type]} onClick={onDeclined ? () => {
+ <Button {...myPropsForNoConfirmed} color={typeClass[type]} onClick={onDeclined ? () => {
onDeclined();
onClose();} : () => onClose()}>
{cancelButtonText}
</Button>
</div>
- </Modal.Footer>;
+ </Modal.Footer>
+ );
+};
ModalFooter.defaultProps = {
type: 'default',
@@ -93,7 +107,7 @@ export class GlobalModalView extends React.Component {
modalClassName, msg, onConfirmed, onDeclined, confirmationButtonText, cancelButtonText, onClose} = this.props;
const ComponentToRender = modalContentComponents[modalComponentName];
return (
- <Modal show={show} bsSize={modalComponentProps && modalComponentProps.size} className={`onborading-modal ${modalClassName || ''} ${typeClass[type]}`}>
+ <Modal show={show} bsSize={modalComponentProps && modalComponentProps.size} className={`onborading-modal ${modalClassName || ''} ${type2HeaderColor[type]}`}>
<Modal.Header>
<Modal.Title>{title}</Modal.Title>
</Modal.Header>
diff --git a/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx b/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx
index 3b89137090..fb3b71f0c8 100644
--- a/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx
+++ b/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx
@@ -109,6 +109,7 @@ function NavigationMenuItem(props) {
function NavigationLink(props) {
const {item, activeItemId, onClick} = props;
+ // todo should this be button
return (
<div
key={'navAction_' + item.id}
diff --git a/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx b/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx
index ecfe7df116..922db05282 100644
--- a/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx
+++ b/openecomp-ui/src/nfvo-components/panel/versionController/VersionController.jsx
@@ -154,7 +154,7 @@ function VCButton({name, tooltipText, isDisabled, onClick, dataTestId}) {
return (
<OverlayTrigger placement='top' overlay={<Tooltip id='vc-tooltip'>{tooltipText}</Tooltip>}>
<div disabled={disabled} className='action-buttons-svg'>
- <SVGIcon data-test-id={dataTestId} iconClassName={disabled} onClick={onClickAction ? onClickAction : undefined} name={name}/>
+ <SVGIcon data-test-id={dataTestId} disabled={isDisabled} onClick={onClickAction ? onClickAction : undefined} name={name}/>
</div>
</OverlayTrigger>
);
diff --git a/openecomp-ui/src/nfvo-components/table/SelectActionTable.jsx b/openecomp-ui/src/nfvo-components/table/SelectActionTable.jsx
index 12e9a06623..3f8dbba53a 100644
--- a/openecomp-ui/src/nfvo-components/table/SelectActionTable.jsx
+++ b/openecomp-ui/src/nfvo-components/table/SelectActionTable.jsx
@@ -1,6 +1,7 @@
import React from 'react';
import i18n from 'nfvo-utils/i18n/i18n.js';
import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
+import Button from 'sdc-ui/lib/react/Button.js';
import uuid from 'uuid-js';
export default class SelectActionTable extends React.Component {
@@ -10,13 +11,14 @@ export default class SelectActionTable extends React.Component {
return (
<div className={`select-action-table-view ${isReadOnlyMode ? 'disabled' : ''}`}>
<div className='select-action-table-controllers'>
- {onAdd && onAddItem && <div data-test-id='select-action-table-add' onClick={onAdd}>{onAddItem}</div>}
+ {onAdd && onAddItem &&
+ <Button btnType='link' disabled={isReadOnlyMode === true} color='primary' iconName='plus' data-test-id='select-action-table-add' onClick={onAdd}>{onAddItem}</Button>}
<SVGIcon name='trashO' className='dummy-icon' />
</div>
<div className='select-action-table'>
<div className='select-action-table-headers'>
{columns.map(column => <div key={uuid.create()} className='select-action-table-header'>{i18n(column)}</div>)}
- {Array(numOfIcons).fill().map((e, i) => <SVGIcon name='trashO' key={i} className='dummy-icon' />)}
+ {Array(numOfIcons).fill().map((e, i) => <SVGIcon name='trash-o' key={i} className='dummy-icon' />)}
</div>
<div className='select-action-table-body'>
{children}
diff --git a/openecomp-ui/src/nfvo-components/table/SelectActionTableRow.jsx b/openecomp-ui/src/nfvo-components/table/SelectActionTableRow.jsx
index 7df7d532e8..a03f8441a4 100644
--- a/openecomp-ui/src/nfvo-components/table/SelectActionTableRow.jsx
+++ b/openecomp-ui/src/nfvo-components/table/SelectActionTableRow.jsx
@@ -11,7 +11,7 @@ function tooltip (msg) {
const IconWithOverlay = ({overlayMsg}) => (
<OverlayTrigger placement='bottom' overlay={tooltip(overlayMsg)}>
- <SVGIcon name='errorCircle'/>
+ <SVGIcon name='errorCircle' color='negative'/>
</OverlayTrigger>
);
@@ -21,10 +21,10 @@ function renderErrorOrCheck({hasError, overlayMsg}) {
}
if (hasError) {
- return overlayMsg ? <IconWithOverlay overlayMsg={overlayMsg}/> : <SVGIcon name='errorCircle'/>;
+ return overlayMsg ? <IconWithOverlay overlayMsg={overlayMsg}/> : <SVGIcon color='negative' name='errorCircle'/>;
}
- return <SVGIcon name='checkCircle'/>;
+ return <SVGIcon name='checkCircle' color='positive'/>;
}
const SelectActionTableRow = ({children, onDelete, hasError, hasErrorIndication, overlayMsg, showDelete}) => (
@@ -32,7 +32,7 @@ const SelectActionTableRow = ({children, onDelete, hasError, hasErrorIndication,
<div className={`select-action-table-row ${hasError ? 'has-error' : ''}`}>
{children}
</div>
- {onDelete && <SVGIcon name='trashO' iconClassName={(showDelete) ? '' : 'hideDelete'} data-test-id='select-action-table-delete' onClick={(showDelete) ? onDelete : null} />}
+ {onDelete && <SVGIcon color='secondary' name='trashO' data-test-id='select-action-table-delete' onClick={onDelete} iconClassName={(showDelete) ? '' : 'hideDelete'}/>}
{hasErrorIndication && renderErrorOrCheck({hasError, overlayMsg})}
</div>
);
diff --git a/openecomp-ui/src/nfvo-utils/getValue.js b/openecomp-ui/src/nfvo-utils/getValue.js
index e6871c094d..101655bf31 100644
--- a/openecomp-ui/src/nfvo-utils/getValue.js
+++ b/openecomp-ui/src/nfvo-utils/getValue.js
@@ -19,14 +19,26 @@ function getValueFromObject(element) {
return element.choices && element.choices.length > 0 && element.choices[0] !== '' && element.choices[0] !== optionInputOther.OTHER ||
element.other && element.choices[0] === optionInputOther.OTHER ?
element : undefined;
-}
+}
function getValueFromVariable(variable) {
return variable ? variable : undefined;
}
let getValue = element => {
- return typeof element === 'object' ? getValueFromObject(element) : getValueFromVariable(element);
+ return typeof element === 'object' ? getValueFromObject(element) : getValueFromVariable(element);
};
- export default getValue; \ No newline at end of file
+export function getStrValue(choiceObject) {
+ if (!choiceObject) {
+ return undefined;
+ }
+ if (choiceObject.choice && choiceObject.choice !== '' && choiceObject.choice !== optionInputOther.OTHER) {
+ return choiceObject.choice;
+ }
+ else if (choiceObject.other && choiceObject.choice === optionInputOther.OTHER) {
+ return choiceObject.other;
+ }
+}
+
+ export default getValue;
diff --git a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogView.jsx b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogView.jsx
index 19ab570fd9..9abddea542 100644
--- a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogView.jsx
+++ b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogView.jsx
@@ -22,6 +22,7 @@ import i18n from 'nfvo-utils/i18n/i18n.js';
import LogDetails from './LogixUtil.jsx';
function ActivityLogSortableCellHeader({isHeader, data, isDes, onSort}) {
+ //TODO check icon sdc-ui
if (isHeader) {
return (
<span className='date-header' onClick={onSort}>
@@ -51,7 +52,7 @@ function ActivityLogStatus({status, isHeader}) {
return (
<span>
<span className={`status-icon ${success}`}>{`${success ? i18n('Success') : i18n('Failure')}`}</span>
- {success && <SVGIcon name='checkCircle'/>}
+ {success && <SVGIcon name='checkCircle' color='positive'/>}
{!success && <OverlayTrigger placement='bottom' overlay={<Tooltip className='activity-log-message-tooltip' id={'activity-log-message-tooltip'}>
<div className='message-block'>{message}</div>
</Tooltip>}>
diff --git a/openecomp-ui/src/sdc-app/common/helpers/ValidationHelper.js b/openecomp-ui/src/sdc-app/common/helpers/ValidationHelper.js
index 51dfcf9a67..cfa675278f 100644
--- a/openecomp-ui/src/sdc-app/common/helpers/ValidationHelper.js
+++ b/openecomp-ui/src/sdc-app/common/helpers/ValidationHelper.js
@@ -51,10 +51,11 @@ class ValidationHelper {
});
}
- static qValidateForm(dispatch, qName){
+ static qValidateForm(dispatch, qName, customValidations){
dispatch({
type: qcommonActionTypes.VALIDATE_FORM,
- qName
+ qName,
+ customValidations
});
}
diff --git a/openecomp-ui/src/sdc-app/common/reducers/JSONSchemaReducer.js b/openecomp-ui/src/sdc-app/common/reducers/JSONSchemaReducer.js
index 35b2f936ce..916f724b40 100644
--- a/openecomp-ui/src/sdc-app/common/reducers/JSONSchemaReducer.js
+++ b/openecomp-ui/src/sdc-app/common/reducers/JSONSchemaReducer.js
@@ -99,8 +99,8 @@ function updateSchemaDataAndValidateReducer (state = {}, action, questionnaireNa
genericFieldInfoClone = {...state.qgenericFieldInfo};
let formReady = true;
forOwn(state.qgenericFieldInfo,(value, key) => {
- let val = state.data[key] ? state.data[key] : '';
- let result = Validator.validate(key, val, state.qgenericFieldInfo[key].validations, state, {});
+ let val = state.dataMap[key] ? state.dataMap[key] : '';
+ let result = Validator.validate(key, val, state.qgenericFieldInfo[key].validations, state, action.customValidations);
genericFieldInfoClone[key] = {...genericFieldInfoClone[key], isValid: result.isValid, errorText: result.errorText};
if (!result.isValid) {
formReady = false;
diff --git a/openecomp-ui/src/sdc-app/onboarding/OnboardingActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/OnboardingActionHelper.js
index dad930127b..24ba05e303 100644
--- a/openecomp-ui/src/sdc-app/onboarding/OnboardingActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/OnboardingActionHelper.js
@@ -275,6 +275,13 @@ export default {
version
});
setCurrentScreen(dispatch, enums.SCREEN.SOFTWARE_PRODUCT_COMPONENT_IMAGES, {softwareProductId, version, componentId});
+ },
+
+ updateCurrentScreenVersion(dispatch, version) {
+ dispatch({
+ type: actionTypes.SET_CURRENT_SCREEN_VERSION,
+ version
+ });
}
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/OnboardingConstants.js b/openecomp-ui/src/sdc-app/onboarding/OnboardingConstants.js
index 0fff513cc5..1ce8605b63 100644
--- a/openecomp-ui/src/sdc-app/onboarding/OnboardingConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/OnboardingConstants.js
@@ -19,7 +19,8 @@ export const DATE_FORMAT = 'MM/DD/YYYY';
export const actionTypes = keyMirror({
SET_CURRENT_SCREEN: null,
- SET_CURRENT_LICENSE_MODEL: null
+ SET_CURRENT_LICENSE_MODEL: null,
+ SET_CURRENT_SCREEN_VERSION: null,
});
export const enums = keyMirror({
diff --git a/openecomp-ui/src/sdc-app/onboarding/OnboardingReducers.js b/openecomp-ui/src/sdc-app/onboarding/OnboardingReducers.js
index 46fc58db95..e63bcb16af 100644
--- a/openecomp-ui/src/sdc-app/onboarding/OnboardingReducers.js
+++ b/openecomp-ui/src/sdc-app/onboarding/OnboardingReducers.js
@@ -16,9 +16,19 @@
import {actionTypes, enums} from './OnboardingConstants.js';
export const currentScreenReducer = (state = {forceBreadCrumbsUpdate: false, screen: enums.SCREEN.ONBOARDING_CATALOG, props: {}}, action) => {
- if (action.type === actionTypes.SET_CURRENT_SCREEN) {
- return action.currentScreen;
- }
- return state;
+ switch (action.type) {
+ case actionTypes.SET_CURRENT_SCREEN:
+ return action.currentScreen;
+ case actionTypes.SET_CURRENT_SCREEN_VERSION:
+ return {
+ ...state,
+ props: {
+ ...state.props,
+ version: action.version
+ }
+ };
+ default:
+ return state;
+ }
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js
index 186f1cbc7b..788528fd75 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js
@@ -23,6 +23,7 @@ import LicenseAgreementActionHelper from './licenseAgreement/LicenseAgreementAct
import FeatureGroupsActionHelper from './featureGroups/FeatureGroupsActionHelper.js';
import EntitlementPoolsActionHelper from './entitlementPools/EntitlementPoolsActionHelper.js';
import LicenseKeyGroupsActionHelper from './licenseKeyGroups/LicenseKeyGroupsActionHelper.js';
+import OnboardingActionHelper from 'sdc-app/onboarding/OnboardingActionHelper.js';
function baseUrl() {
const restPrefix = Configuration.get('restPrefix');
@@ -140,6 +141,8 @@ const LicenseModelActionHelper = {
newVersionId = adjustMajorVersion(version.label, 1);
}
+ OnboardingActionHelper.updateCurrentScreenVersion(dispatch, {label: newVersionId, id: newVersionId});
+
LicenseModelActionHelper.fetchLicenseModelById(dispatch, {licenseModelId, version:{id: newVersionId, label: newVersionId}});
return Promise.resolve({id: newVersionId, label: newVersionId});
});
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js
index a371d5635e..ce4327d810 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js
@@ -18,7 +18,7 @@ import Configuration from 'sdc-app/config/Configuration.js';
import {actionTypes as entitlementPoolsActionTypes } from './EntitlementPoolsConstants.js';
import LicenseModelActionHelper from 'sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js';
import {actionTypes as limitEditorActions} from 'sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js';
-import getValue from 'nfvo-utils/getValue.js';
+import {default as getValue, getStrValue} from 'nfvo-utils/getValue.js';
function baseUrl(licenseModelId, version) {
const restPrefix = Configuration.get('restPrefix');
@@ -26,17 +26,16 @@ function baseUrl(licenseModelId, version) {
return `${restPrefix}/v1.0/vendor-license-models/${licenseModelId}/versions/${versionId}/entitlement-pools`;
}
-function fetchEntitlementPoolsList(licenseModelId, version) {
+function fetchEntitlementPoolsList(licenseModelId, version) {
return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}`);
}
-function postEntitlementPool(licenseModelId, entitlementPool, version) {
+function postEntitlementPool(licenseModelId, entitlementPool, version) {
return RestAPIUtil.post(baseUrl(licenseModelId, version), {
name: entitlementPool.name,
description: entitlementPool.description,
thresholdValue: entitlementPool.thresholdValue,
thresholdUnits: getValue(entitlementPool.thresholdUnits),
- entitlementMetric: entitlementPool.entitlementMetric,
increments: entitlementPool.increments,
operationalScope: getValue(entitlementPool.operationalScope),
time: entitlementPool.time,
@@ -47,13 +46,12 @@ function postEntitlementPool(licenseModelId, entitlementPool, version) {
function putEntitlementPool(licenseModelId, previousEntitlementPool, entitlementPool, version) {
-
+
return RestAPIUtil.put(`${baseUrl(licenseModelId, version)}/${entitlementPool.id}`, {
name: entitlementPool.name,
description: entitlementPool.description,
thresholdValue: entitlementPool.thresholdValue,
thresholdUnits: getValue(entitlementPool.thresholdUnits),
- entitlementMetric: entitlementPool.entitlementMetric,
increments: entitlementPool.increments,
operationalScope: getValue(entitlementPool.operationalScope),
time: entitlementPool.time,
@@ -66,39 +64,39 @@ function deleteEntitlementPool(licenseModelId, entitlementPoolId, version) {
return RestAPIUtil.destroy(`${baseUrl(licenseModelId, version)}/${entitlementPoolId}`);
}
-function fetchLimitsList(licenseModelId, entitlementPoolId, version) {
+function fetchLimitsList(licenseModelId, entitlementPoolId, version) {
return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}/${entitlementPoolId}/limits`);
}
-function deleteLimit(licenseModelId, entitlementPoolId, version, limitId) {
+function deleteLimit(licenseModelId, entitlementPoolId, version, limitId) {
return RestAPIUtil.destroy(`${baseUrl(licenseModelId, version)}/${entitlementPoolId}/limits/${limitId}`);
}
-function postLimit(licenseModelId, entitlementPoolId, version, limit) {
+function postLimit(licenseModelId, entitlementPoolId, version, limit) {
return RestAPIUtil.post(`${baseUrl(licenseModelId, version)}/${entitlementPoolId}/limits`, {
name: limit.name,
type: limit.type,
description: limit.description,
- metric: limit.metric,
+ metric: getStrValue(limit.metric),
value: limit.value,
- unit: limit.unit,
+ unit: getStrValue(limit.unit),
aggregationFunction: getValue(limit.aggregationFunction),
time: getValue(limit.time)
});
}
function putLimit(licenseModelId, entitlementPoolId, version, limit) {
-
+
return RestAPIUtil.put(`${baseUrl(licenseModelId, version)}/${entitlementPoolId}/limits/${limit.id}`, {
name: limit.name,
type: limit.type,
description: limit.description,
- metric: limit.metric,
+ metric: getStrValue(limit.metric),
value: limit.value,
- unit: limit.unit,
+ unit: getStrValue(limit.unit),
aggregationFunction: getValue(limit.aggregationFunction),
time: getValue(limit.time)
- });
+ });
}
export default {
@@ -191,10 +189,10 @@ export default {
type: entitlementPoolsActionTypes.entitlementPoolsEditor.LIMITS_LIST_LOADED,
response
});
- });
+ });
},
- submitLimit(dispatch, {licenseModelId, version, entitlementPool, limit}) {
+ submitLimit(dispatch, {licenseModelId, version, entitlementPool, limit}) {
const propmise = limit.id ? putLimit(licenseModelId,entitlementPool.id, version, limit)
: postLimit(licenseModelId,entitlementPool.id, version, limit);
return propmise.then(() => {
@@ -202,12 +200,12 @@ export default {
type: limitEditorActions.CLOSE
});
this.fetchLimits(dispatch, {licenseModelId, version, entitlementPool});
- });
+ });
},
- deleteLimit(dispatch, {licenseModelId, version, entitlementPool, limit}) {
+ deleteLimit(dispatch, {licenseModelId, version, entitlementPool, limit}) {
return deleteLimit(licenseModelId,entitlementPool.id, version, limit.id).then(() => {
- this.fetchLimits(dispatch, {licenseModelId, version, entitlementPool});
- });
+ this.fetchLimits(dispatch, {licenseModelId, version, entitlementPool});
+ });
}
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx
index 9844290a25..497c29d14c 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx
@@ -97,24 +97,23 @@ class FeatureGroupListEditorView extends React.Component {
<div className='text name'>{name}</div>
</div>
- <div className='list-editor-item-view-field'>
+ <div className='list-editor-item-view-field smaller-field'>
<div className='feature-groups-count-field'>
- <div className='title'>{i18n('Entitlement')}</div>
- <div className='title'>{i18n('Pools')}</div>
+ <div className='title'>{i18n('EP')}</div>
<div className='feature-groups-count-ep'>{entitlementPoolsIds.length || 0}</div>
</div>
+ </div>
+ <div className='list-editor-item-view-field smaller-field'>
<div className='feature-groups-count-field'>
- <div className='title'>{i18n('License key')}</div>
- <div className='title'>{i18n('Groups')}</div>
+ <div className='title'>{i18n('LKG')}</div>
<div className='feature-groups-count-lk'>{licenseKeyGroupsIds.length || 0}</div>
</div>
</div>
<div className='list-editor-item-view-field'>
<div className='feature-groups-count-field'>
- <div className='title'>{i18n('Manufacturer Reference')}</div>
- <div className='title'>{i18n('Number')}</div>
- <div className='feature-groups-count-ep'>{manufacturerReferenceNumber}</div>
+ <div className='title title-no-wrap'>{i18n('Manufacturer Reference Number')}</div>
+ <div className='feature-groups-mrn-ep'>{manufacturerReferenceNumber}</div>
</div>
</div>
@@ -122,8 +121,8 @@ class FeatureGroupListEditorView extends React.Component {
<div className='title'>{i18n('Description')}</div>
<div className='text description'>{description}</div>
</div>
-
-
+
+
</ListEditorItemView>
);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js
index f5017f6d7a..f22080a75c 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js
@@ -18,7 +18,7 @@ import Configuration from 'sdc-app/config/Configuration.js';
import {actionTypes as licenseKeyGroupsConstants} from './LicenseKeyGroupsConstants.js';
import LicenseModelActionHelper from 'sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js';
import {actionTypes as limitEditorActions} from 'sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js';
-import getValue from 'nfvo-utils/getValue.js';
+import {default as getValue, getStrValue} from 'nfvo-utils/getValue.js';
function baseUrl(licenseModelId, version) {
const restPrefix = Configuration.get('restPrefix');
@@ -75,9 +75,9 @@ function postLimit(licenseModelId, licenseKeyGroupId, version, limit) {
name: limit.name,
type: limit.type,
description: limit.description,
- metric: limit.metric,
+ metric: getStrValue(limit.metric),
value: limit.value,
- unit: limit.unit,
+ unit: getStrValue(limit.unit),
aggregationFunction: getValue(limit.aggregationFunction),
time: getValue(limit.time)
});
@@ -89,9 +89,9 @@ function putLimit(licenseModelId, licenseKeyGroupId, version, limit) {
name: limit.name,
type: limit.type,
description: limit.description,
- metric: limit.metric,
+ metric: getStrValue(limit.metric),
value: limit.value,
- unit: limit.unit,
+ unit: getStrValue(limit.unit),
aggregationFunction: getValue(limit.aggregationFunction),
time: getValue(limit.time)
});
@@ -181,8 +181,8 @@ export default {
dispatch({
type: licenseKeyGroupsConstants.licenseKeyGroupsEditor.LIMITS_LIST_LOADED,
response
- });
- });
+ });
+ });
},
submitLimit(dispatch, {licenseModelId, version, licenseKeyGroup, limit}) {
@@ -193,13 +193,13 @@ export default {
type: limitEditorActions.CLOSE
});
this.fetchLimits(dispatch, {licenseModelId, version, licenseKeyGroup});
- });
+ });
},
deleteLimit(dispatch, {licenseModelId, version, licenseKeyGroup, limit}) {
return deleteLimit(licenseModelId,licenseKeyGroup.id, version, limit.id).then(() => {
this.fetchLimits(dispatch, {licenseModelId, version, licenseKeyGroup});
- });
+ });
}
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.jsx
index f70f917725..5c4e50d673 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.jsx
@@ -7,16 +7,24 @@ import GridItem from 'nfvo-components/grid/GridItem.jsx';
import {LIMITS_FORM_NAME, selectValues} from './LimitEditorConstants.js';
import Button from 'sdc-ui/lib/react/Button.js';
import Validator from 'nfvo-utils/Validator.js';
+import {other as optionInputOther} from 'nfvo-components/input/inputOptions/InputOptions.jsx';
+import InputOptions from 'nfvo-components/input/validation/InputOptions.jsx';
const LimitPropType = React.PropTypes.shape({
id: React.PropTypes.string,
name: React.PropTypes.string,
description: React.PropTypes.string,
- metric: React.PropTypes.string,
- value: React.PropTypes.number,
+ metric: React.PropTypes.shape({
+ choice: React.PropTypes.string,
+ other: React.PropTypes.string
+ }),
+ value: React.PropTypes.string,
aggregationFunction: React.PropTypes.string,
time: React.PropTypes.string,
- unit: React.PropTypes.number
+ unit: React.PropTypes.shape({
+ choice: React.PropTypes.string,
+ other: React.PropTypes.string
+ })
});
class LimitEditor extends React.Component {
@@ -33,8 +41,8 @@ class LimitEditor extends React.Component {
onCancel: React.PropTypes.func.isRequired
};
- componentDidUpdate(prevProps) {
- if (this.props.formReady && this.props.formReady !== prevProps.formReady) {
+ componentDidUpdate(prevProps) {
+ if (this.props.formReady && this.props.formReady !== prevProps.formReady) {
this.submit();
}
}
@@ -44,21 +52,21 @@ class LimitEditor extends React.Component {
let {name, description, metric, value, aggregationFunction, time, unit} = data;
return (
<div className='limit-editor'>
- {!data.id &&
+ {!data.id &&
<div className='limit-editor-title'>
{data.name ? data.name : i18n('NEW LIMIT')}
</div>}
{
- genericFieldInfo &&
+ genericFieldInfo &&
<Form
ref='validationForm'
- hasButtons={false}
+ hasButtons={false}
isValid={isFormValid}
formReady={formReady}
onValidateForm={() => onValidateForm(LIMITS_FORM_NAME) }
labledButtons={false}
isReadOnlyMode={isReadOnlyMode}
- className='limit-editor-form'>
+ className='limit-editor-form'>
<GridSection className='limit-editor-form-grid-section'>
<GridItem colSpan={2}>
<Input
@@ -83,24 +91,23 @@ class LimitEditor extends React.Component {
type='text'/>
</GridItem>
<GridItem colSpan={2}>
- <Input
- onChange={e => {
- const selectedIndex = e.target.selectedIndex;
- const val = e.target.options[selectedIndex].value;
- onDataChanged({metric: val}, LIMITS_FORM_NAME);}
- }
+ <InputOptions
+ onInputChange={()=>{}}
+ isMultiSelect={false}
isRequired={true}
- value={metric}
+ onEnumChange={metric => onDataChanged({metric:{choice: metric, other: ''}},
+ LIMITS_FORM_NAME, {metric: this.validateChoiceWithOther})}
+ onOtherChange={metric => onDataChanged({metric:{choice: optionInputOther.OTHER,
+ other: metric}}, LIMITS_FORM_NAME, {metric: this.validateChoiceWithOther})}
label={i18n('Metric')}
data-test-id='limit-editor-metric'
+ type='select'
+ required={true}
+ selectedEnum={metric && metric.choice}
+ otherValue={metric && metric.other}
+ values={selectValues.METRIC}
isValid={genericFieldInfo.metric.isValid}
- errorText={genericFieldInfo.metric.errorText}
- groupClassName='bootstrap-input-options'
- className='input-options-select'
- type='select' >
- {selectValues.METRIC.map(mtype =>
- <option key={mtype.enum} value={mtype.enum}>{`${mtype.title}`}</option>)}
- </Input>
+ errorText={genericFieldInfo.metric.errorText} />
</GridItem>
<GridItem>
<Input
@@ -111,22 +118,30 @@ class LimitEditor extends React.Component {
isValid={genericFieldInfo.value.isValid}
errorText={genericFieldInfo.value.errorText}
isRequired={true}
- type='number'/>
+ type='text'/>
</GridItem>
<GridItem>
- <Input
- onChange={unit => onDataChanged({unit}, LIMITS_FORM_NAME)}
+ <InputOptions
+ onInputChange={()=>{}}
+ isMultiSelect={false}
+ isRequired={false}
+ onEnumChange={unit => onDataChanged({unit:{choice: unit, other: ''}},
+ LIMITS_FORM_NAME)}
+ onOtherChange={unit => onDataChanged({unit:{choice: optionInputOther.OTHER,
+ other: unit}}, LIMITS_FORM_NAME)}
label={i18n('Units')}
data-test-id='limit-editor-units'
- value={unit}
+ type='select'
+ required={false}
+ selectedEnum={unit && unit.choice}
+ otherValue={unit && unit.other}
+ values={selectValues.UNIT}
isValid={genericFieldInfo.unit.isValid}
- errorText={genericFieldInfo.unit.errorText}
- isRequired={false}
- type='number'/>
+ errorText={genericFieldInfo.unit.errorText} />
</GridItem>
<GridItem colSpan={2}>
<Input
- onChange={e => {
+ onChange={e => {
const selectedIndex = e.target.selectedIndex;
const val = e.target.options[selectedIndex].value;
onDataChanged({aggregationFunction: val}, LIMITS_FORM_NAME);}
@@ -145,7 +160,7 @@ class LimitEditor extends React.Component {
</GridItem>
<GridItem>
<Input
- onChange={e => {
+ onChange={e => {
const selectedIndex = e.target.selectedIndex;
const val = e.target.options[selectedIndex].value;
onDataChanged({time: val}, LIMITS_FORM_NAME);}
@@ -160,15 +175,15 @@ class LimitEditor extends React.Component {
type='select' >
{selectValues.TIME.map(mtype =>
<option key={mtype.enum} value={mtype.enum}>{`${mtype.title}`}</option>)}
- </Input>
+ </Input>
</GridItem>
</GridSection>
<GridSection className='limit-editor-buttons'>
- <Button btnType='outline' disabled={!isFormValid} onClick={() => this.submit()} type='reset'>{i18n('Save')}</Button>
+ <Button btnType='outline' disabled={!isFormValid} onClick={() => this.submit()} type='reset'>{i18n('Save')}</Button>
<Button btnType='outline' color='gray' onClick={onCancel} type='reset'>{i18n('Cancel')}</Button>
- </GridSection>
- </Form>
- }
+ </GridSection>
+ </Form>
+ }
</div>
);
}
@@ -181,6 +196,24 @@ class LimitEditor extends React.Component {
{isValid: false, errorText: i18n('Limit by the name \'' + value + '\' already exists. Limit name must be unique')};
}
+ validateChoiceWithOther(value) {
+ let chosen = value.choice;
+ // if we have an empty multiple select we have a problem since it's required
+ if (value.choices) {
+ if (value.choices.length === 0) {
+ return Validator.validate('field', '', [{type: 'required', data: true}]);
+ } else {
+ // continuing validation with the first chosen value in case we have the 'Other' field
+ chosen = value.choices[0];
+ }
+ }
+ if (chosen !== optionInputOther.OTHER) {
+ return Validator.validate('field', chosen, [{type: 'required', data: true}]);
+ } else { // when 'Other' was chosen, validate other value
+ return Validator.validate('field', value.other, [{type: 'required', data: true}]);
+ }
+ }
+
submit() {
if (!this.props.formReady) {
this.props.onValidateForm(LIMITS_FORM_NAME);
@@ -190,4 +223,4 @@ class LimitEditor extends React.Component {
}
}
-export default LimitEditor; \ No newline at end of file
+export default LimitEditor;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorActionHelper.js
index 09c64ada62..8ac845a1a7 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorActionHelper.js
@@ -14,17 +14,41 @@
* permissions and limitations under the License.
*/
-import {actionTypes} from './LimitEditorConstants.js';
+import {actionTypes, selectValues} from './LimitEditorConstants.js';
+import {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
const LimitEditorActionHelper = {
openLimitsEditor(dispatch, {limit}) {
- dispatch({type: actionTypes.OPEN, limitItem: limit});
+ let modifiedLimit = {...limit};
+ if (limit && limit.metric) {
+ modifiedLimit.metric = LimitEditorActionHelper.createChoiceObject(modifiedLimit.metric, selectValues.METRIC);
+ }
+ if (limit && limit.unit) {
+ modifiedLimit.unit = LimitEditorActionHelper.createChoiceObject(modifiedLimit.unit, selectValues.UNIT);
+ }
+ dispatch({type: actionTypes.OPEN, limitItem: modifiedLimit});
},
closeLimitsEditor(dispatch) {
dispatch({type: actionTypes.CLOSE});
+ },
+
+ createChoiceObject(value, optionsList) {
+ let option = optionsList.find(function(item) { return item.enum === value; });
+ if (!option) {
+ return {
+ choice: optionInputOther.OTHER,
+ other: value
+ };
+ }
+ else {
+ return {
+ choice: value,
+ other: ''
+ };
+ }
}
};
-export default LimitEditorActionHelper; \ No newline at end of file
+export default LimitEditorActionHelper;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js
index 1bef286442..9829e696c3 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js
@@ -13,18 +13,25 @@ export const LIMITS_FORM_NAME = 'LIMITSFORM';
export const selectValues = {
METRIC: [
{enum: '', title: i18n('please select…')},
- {enum: 'Software_Instances_Count', title: 'Software Instances'},
- {enum: 'Core', title: 'Core'},
- {enum: 'CPU', title: 'CPU'},
- {enum: 'Trunks', title: 'Trunks'},
- {enum: 'User', title: 'User'},
- {enum: 'Subscribers', title: 'Subscribers'},
- {enum: 'Tenants', title: 'Tenants'},
- {enum: 'Tokens', title: 'Tokens'},
- {enum: 'Seats', title: 'Seats'},
- {enum: 'Units_TB', title: 'Units-TB'},
- {enum: 'Units_GB', title: 'Units-GB'},
- {enum: 'Units_MB', title: 'Units-MB'}
+ {enum: 'BWTH', title: 'BWTH'},
+ {enum: 'Country', title: 'Country'},
+ {enum: 'Session', title: 'Session'},
+ {enum: 'LoB', title: 'LoB'},
+ {enum: 'Site', title: 'Site'},
+ {enum: 'Usage', title: 'Usage'}
+ ],
+ UNIT: [
+ {enum: '', title: i18n('please select…')},
+ {enum: 'trunk', title: 'Trunks'},
+ {enum: 'user', title: 'Users'},
+ {enum: 'subscriber', title: 'Subscribers'},
+ {enum: 'session', title: 'Sessions'},
+ {enum: 'tenant', title: 'Tenants'},
+ {enum: 'token', title: 'Tokens'},
+ {enum: 'seats', title: 'Seats'},
+ {enum: 'TB', title: 'TB'},
+ {enum: 'GB', title: 'GB'},
+ {enum: 'MB', title: 'MB'}
],
AGGREGATION_FUNCTION: [
{enum: '', title: i18n('please select…')},
@@ -33,11 +40,14 @@ export const selectValues = {
],
TIME: [
{enum: '', title: i18n('please select…')},
- {enum: 'Hour', title: 'Hour'},
{enum: 'Day', title: 'Day'},
- {enum: 'Month', title: 'Month'}
+ {enum: 'Month', title: 'Month'},
+ {enum: 'Hour', title: 'Hour'},
+ {enum: 'Minute', title: 'Minute'},
+ {enum: 'Second', title: 'Second'},
+ {enum: 'Milli-Second', title: 'Milli-Second'}
]
-
+
};
export const limitType = {
@@ -46,7 +56,9 @@ export const limitType = {
};
export const defaultState = {
- LIMITS_EDITOR_DATA: {}
+ LIMITS_EDITOR_DATA: {
+ metric: {choice: '', other: ''},
+ }
};
-export const NEW_LIMIT_TEMP_ID = 'NEW_LIMIT_TEMP_ID'; \ No newline at end of file
+export const NEW_LIMIT_TEMP_ID = 'NEW_LIMIT_TEMP_ID';
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorReducer.js
index 2499093af2..de9e7c8c38 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorReducer.js
@@ -20,7 +20,7 @@ export default (state = {}, action) => {
switch (action.type) {
case actionTypes.OPEN:
return {
- ...state,
+ ...state,
data: action.limitItem ? {...action.limitItem} : defaultState.LIMITS_EDITOR_DATA,
formReady: null,
formName: LIMITS_FORM_NAME,
@@ -38,17 +38,17 @@ export default (state = {}, action) => {
'metric' : {
isValid: true,
errorText: '',
- validations: [{type: 'required', data: true}]
+ validations: []
},
'value' : {
isValid: true,
errorText: '',
- validations: [{type: 'required', data: true}, {type: 'numeric', data: true}, {type: 'minimum', data: 0}]
+ validations: [{type: 'required', data: true}]
},
'unit' : {
isValid: true,
errorText: '',
- validations: [{type: 'numeric', data: true}]
+ validations: []
},
'aggregationFunction' : {
isValid: true,
@@ -67,4 +67,4 @@ export default (state = {}, action) => {
default:
return state;
}
-}; \ No newline at end of file
+};
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/Limits.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/Limits.jsx
index ec5a1dff72..b144f63968 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/Limits.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/Limits.jsx
@@ -17,40 +17,43 @@ import React from 'react';
import i18n from 'nfvo-utils/i18n/i18n.js';
import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx';
import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx';
-import LimitEditor from './LimitEditor.js';
+import LimitEditor from './LimitEditor.js';
import {NEW_LIMIT_TEMP_ID, selectValues} from './LimitEditorConstants.js';
const LimitItem = ({isReadOnlyMode, limit, onDelete, onSelect}) => {
- const {name, description, metric, value, aggregationFunction = '', time = ''} = limit;
+ const {name, description, value, metric, aggregationFunction = '', time = ''} = limit;
const timeLabel = time ? `per ${time}` : '';
+ let metricOption = selectValues.METRIC.find(item => item.enum === metric);
+ metricOption = metricOption ? metricOption.title : metric;
+
return (
- <ListEditorItemView
+ <ListEditorItemView
onDelete={onDelete}
onSelect={onSelect}
isReadOnlyMode={isReadOnlyMode}>
- <div className='list-editor-item-view-field limit-name'>
+ <div className='list-editor-item-view-field limit-name'>
<div className='text name'>{name}</div>
</div>
- <div className='list-editor-item-view-field limit-description'>
+ <div className='list-editor-item-view-field limit-description'>
<div className='text description'>{description}</div>
</div>
- <div className='list-editor-item-view-field limit-metric-details'>
- <div className='text description'>{`${selectValues.METRIC.find(item => item.enum === metric).title} ${value} ${aggregationFunction} ${timeLabel}`}</div>
- </div>
+ <div className='list-editor-item-view-field limit-metric-details'>
+ <div className='text description'>{`${metricOption} ${value} ${aggregationFunction} ${timeLabel}`}</div>
+ </div>
</ListEditorItemView>
);
};
class Limits extends React.Component {
-
+
state = {
localFilter: ''
};
- render() {
+ render() {
const {isReadOnlyMode = false, limitEditor, limitsList = [], onCloseLimitEditor, selectedLimit} = this.props;
let limitsNames = {};
for (let i = 0; i < limitsList.length; i++) {
@@ -66,26 +69,26 @@ class Limits extends React.Component {
{limitsList.length === 0 && !limitEditor.data && <div className='no-limits-text'>{i18n('There are no limits')}</div>}
{limitsList.map(limit =>
<div key={limit.id} className='limit-item-wrapper'>
- <LimitItem
- onDelete={() => this.delete(limit)}
+ <LimitItem
+ onDelete={() => this.deleteLimit(limit)}
onSelect={selectedLimit ? undefined : () => this.props.onSelectLimit(limit)}
- clickable={!selectedLimit}
- isReadOnlyMode={isReadOnlyMode}
+ clickable={!selectedLimit}
+ isReadOnlyMode={isReadOnlyMode}
limit={limit}/>
{limit.id === selectedLimit && limitEditor.data && <LimitEditor limitsNames={limitsNames} onCancel={onCloseLimitEditor} onSubmit={ () => this.submit()}/>}
</div> )}
</ListEditorView>
-
+
</div>
);
}
submit() {
- let {onSubmit, onCloseLimitEditor, parent, limitEditor, licenseModelId, version, limitType} = this.props;
+ let {onSubmit, onCloseLimitEditor, parent, limitEditor, licenseModelId, version, limitType} = this.props;
onSubmit({type: limitType, ...limitEditor.data}, parent, licenseModelId, version).then(() => onCloseLimitEditor());
}
- delete(limit) {
+ deleteLimit(limit) {
let {onDelete, parent, licenseModelId, version, onCloseLimitEditor, selectedLimit} = this.props;
onDelete({limit, parent, licenseModelId, version, onCloseLimitEditor, selectedLimit});
}
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/LicenseModelDescriptionEdit.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/LicenseModelDescriptionEdit.jsx
index 0c0103fc10..9232402b75 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/LicenseModelDescriptionEdit.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/LicenseModelDescriptionEdit.jsx
@@ -18,6 +18,7 @@ import Input from 'nfvo-components/input/validation/Input.jsx';
class LicenseModelDescriptionEdit extends React.Component {
render() {
+ //TODO check if buttons
let {onDataChanged, description, genericFieldInfo} = this.props;
let saveButtonClassName = (genericFieldInfo.description.isValid) ? 'description-save' : 'description-save disabled';
return(
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountItem.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountItem.jsx
index 66f2cc6838..6ec84e16ca 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountItem.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountItem.jsx
@@ -14,15 +14,17 @@
* permissions and limitations under the License.
*/
import React from 'react';
+import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
function SummaryCountItem ({name, counter, onAdd, onNavigate, isReadOnlyMode}) {
+ //TODO check for buttons
return(
<div className='summary-count-item'>
<div className='summary-name-and-count' onClick={onNavigate}>
<span className='item-name' onClick={onNavigate}>{name}</span>
<span className='item-count' onClick={onNavigate} data-test-id={'vlm-summary-vendor-counter-' + name.toLowerCase().replace(/\s/g,'-')}>({counter})</span>
</div>
- <div className={isReadOnlyMode ? 'add-button disabled' : 'add-button'} onClick={onAdd} data-test-id={'vlm-summary-vendor-add-btn-' + name.toLowerCase().replace(/\s/g,'-')}/>
+ <SVGIcon name='plusCircle' disabled={isReadOnlyMode} color='secondary' onClick={onAdd} data-test-id={'vlm-summary-vendor-add-btn-' + name.toLowerCase().replace(/\s/g,'-')}/>
</div>
);
}
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/VendorDataView.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/VendorDataView.js
index 87559901b3..deb4550347 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/VendorDataView.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/VendorDataView.js
@@ -18,6 +18,7 @@ import {connect} from 'react-redux';
import Tooltip from 'react-bootstrap/lib/Tooltip.js';
import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js';
+import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
import licenseModelOverviewActionHelper from '../licenseModelOverviewActionHelper.js';
import LicenseModelActionHelper from '../../LicenseModelActionHelper.js';
@@ -70,6 +71,7 @@ export class VendorDataView extends Component {
{this.renderOverlay(
<div className='description-data' data-test-id='vlm-summary-vendor-description'>
{description}
+ <SVGIcon name='pencil'/>
</div>
)}
</div>
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogList.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogList.jsx
index 51702e6d36..7664f6abaa 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogList.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogList.jsx
@@ -40,6 +40,7 @@ const CatalogList = ({children, onAddVLM, onAddVSP, vendorPageOptions}) => (
);
const CreateItemTile = ({onClick, dataTestId, title, className = ''}) => {
+ //TODO check for buttons
return (
<div className={'create-catalog-item tile ' + className} onClick={() => onClick()} data-test-id={dataTestId}>
<div className='create-item-plus-icon'><SVGIcon name='plus' /></div>
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js
index 90a2bb8f2e..d4bee0a876 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js
@@ -409,6 +409,7 @@ const SoftwareProductActionHelper = {
}
});
const newVersionId = adjustMajorVersion(version.label, 1);
+ OnboardingActionHelper.updateCurrentScreenVersion(dispatch, {label: newVersionId, id: newVersionId});
SoftwareProductActionHelper.fetchSoftwareProduct(dispatch,{softwareProductId, version: {id: newVersionId}});
return Promise.resolve({newVersion: {id: newVersionId}});
});
@@ -438,6 +439,7 @@ const SoftwareProductActionHelper = {
newVersionId = adjustMinorVersion(version.label, -1);
break;
}
+ OnboardingActionHelper.updateCurrentScreenVersion(dispatch, {label: newVersionId, id: newVersionId});
SoftwareProductActionHelper.fetchSoftwareProduct(dispatch,{softwareProductId, version:{id: newVersionId}});
return Promise.resolve({newVersion: {id: newVersionId}});
});
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/SoftwareProductAttachmentsView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/SoftwareProductAttachmentsView.jsx
index ef4aecf568..3da26cc20f 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/SoftwareProductAttachmentsView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/SoftwareProductAttachmentsView.jsx
@@ -18,7 +18,7 @@ import Tabs from 'react-bootstrap/lib/Tabs.js';
import Tab from 'react-bootstrap/lib/Tab.js';
import {tabsMapping} from './SoftwareProductAttachmentsConstants.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
-import Icon from 'nfvo-components/icon/Icon.jsx';
+import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
import HeatValidation from './validation/HeatValidation.js';
class HeatScreenView extends Component {
@@ -38,27 +38,32 @@ class HeatScreenView extends Component {
<div className='vsp-attachments-view'>
<div className='attachments-view-controllers'>
{(this.state.activeTab === tabsMapping.SETUP) &&
- <Icon
- iconClassName={heatDataExist ? '' : 'disabled'}
- className={heatDataExist ? '' : 'disabled'}
- image='download'
+ <SVGIcon
+ disabled={heatDataExist ? false : true}
+ name='download'
+ className='icon-component'
label={i18n('Download HEAT')}
+ labelPosition='right'
+ color='secondary'
onClick={heatDataExist ? () => onDownload({heatCandidate: heatSetup, isReadOnlyMode, version}) : undefined}
data-test-id='download-heat'/>}
{(this.state.activeTab === tabsMapping.VALIDATION && softwareProductId) &&
- <Icon
- iconClassName={this.props.goToOverview ? '' : 'disabled'}
- className={`go-to-overview-icon ${this.props.goToOverview ? '' : 'disabled'}`}
- labelClassName='go-to-overview-label'
+ <SVGIcon
+ disabled={this.props.goToOverview !== true}
onClick={this.props.goToOverview ? () => onGoToOverview({version}) : undefined}
- image='go-to-overview'
+ name='proceedToOverview'
+ className='icon-component'
label={i18n('Go to Overview')}
+ labelPosition='right'
+ color={this.props.goToOverview ? 'primary' : 'secondary'}
data-test-id='go-to-overview'/>}
- <Icon
- image='upload'
+ <SVGIcon
+ name='upload'
+ className='icon-component'
label={i18n('Upload New HEAT')}
- className={isReadOnlyMode ? 'disabled' : ''}
- iconClassName={isReadOnlyMode ? 'disabled' : ''}
+ labelPosition='right'
+ color='secondary'
+ disabled={isReadOnlyMode}
onClick={evt => {this.refs.hiddenImportFileInput.click(evt);}}
data-test-id='upload-heat'/>
<input
@@ -87,9 +92,9 @@ class HeatScreenView extends Component {
}
handleTabPress(key) {
- let {heatSetup, heatSetupCache, onProcessAndValidate, isReadOnlyMode, version} = this.props;
+ let {heatSetup, heatSetupCache, onProcessAndValidate, isReadOnlyMode, version} = this.props;
switch (key) {
- case tabsMapping.VALIDATION:
+ case tabsMapping.VALIDATION:
onProcessAndValidate({heatData: heatSetup, heatDataCache: heatSetupCache, isReadOnlyMode, version}).then(
() => this.setState({activeTab: tabsMapping.VALIDATION})
);
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupView.jsx
index 901a583e24..17b3179d01 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupView.jsx
@@ -20,7 +20,6 @@ import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js';
import FormControl from 'react-bootstrap/lib/FormControl.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
import SelectInput from 'nfvo-components/input/SelectInput.jsx';
-import Icon from 'nfvo-components/icon/Icon.jsx';
import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
import {fileTypes} from './HeatSetupConstants.js';
import {tabsMapping} from '../SoftwareProductAttachmentsConstants.js';
@@ -52,7 +51,7 @@ class SortableModuleFileList extends Component {
render() {
- let {unassigned, onModuleRename, onModuleDelete, onModuleAdd, onBaseAdd, onModuleFileTypeChange, isBaseExist} = this.props;
+ let {unassigned, onModuleRename, onModuleDelete, onModuleAdd, onBaseAdd, onModuleFileTypeChange, isBaseExist, isReadOnlyMode} = this.props;
const childProps = module => ({
module,
onModuleRename,
@@ -68,19 +67,17 @@ class SortableModuleFileList extends Component {
items={this.state.data}
draggingIndex={this.state.draggingIndex}
sortId={i}
- outline='list'><ModuleFile {...childProps(item)} /></SortableListItem>
+ outline='list'><ModuleFile {...childProps(item)} isReadOnlyMode={this.props.isReadOnlyMode} /></SortableListItem>
);
}, this);
return (
- <div className='modules-list-wrapper'>
+ <div className={`modules-list-wrapper ${(listItems.length > 0) ? 'modules-list-wrapper-divider' : ''}`}>
<div className='modules-list-header'>
- <div className='modules-list-controllers'>
- {!isBaseExist && <Button btnType='link' onClick={onBaseAdd} disabled={unassigned.length === 0}>{i18n('Add Base')}</Button>}
- <Button btnType='link' onClick={onModuleAdd} disabled={unassigned.length === 0}>{i18n('Add Module')}</Button>
- </div>
+ {!isBaseExist && <div><Button btnType='link' onClick={onBaseAdd} disabled={isReadOnlyMode || unassigned.length === 0}>{i18n('Add Base')}</Button></div>}
+ <div><Button btnType='link' onClick={onModuleAdd} disabled={isReadOnlyMode || unassigned.length === 0}>{i18n('Add Module')}</Button></div>
</div>
- <ul>{listItems}</ul>
+ {(listItems.length > 0) && <ul>{listItems}</ul>}
</div>
);
}
@@ -89,20 +86,24 @@ class SortableModuleFileList extends Component {
const tooltip = (name) => <Tooltip id='tooltip-bottom'>{name}</Tooltip>;
const UnassignedFileList = (props) => {
return (
- <div className='unassigned-files'>
+ <div>
+ <div className='modules-list-header'/>
+ <div className='unassigned-files'>
<div className='unassigned-files-title'>{i18n('UNASSIGNED FILES')}</div>
<div className='unassigned-files-list'>{props.children}</div>
+ </div>
</div>
);
};
const EmptyListContent = props => {
- let {onClick, heatDataExist} = props;
+ let {onClick, heatDataExist, isReadOnlyMode} = props;
let displayText = heatDataExist ? 'All Files Are Assigned' : '';
return (
<div className='go-to-validation-button-wrapper'>
<div className='all-files-assigned'>{i18n(displayText)}</div>
- {heatDataExist && <div className={'link'} onClick={onClick} data-test-id='go-to-validation'>{i18n('Proceed To Validation')}<SVGIcon name='angleRight'/></div>}
+ {heatDataExist && <SVGIcon disabled={isReadOnlyMode} name='angleRight' onClick={onClick}
+ data-test-id='go-to-validation' label={i18n('Proceed To Validation')} labelPosition='left' color='primary'/>}
</div>
);
};
@@ -112,14 +113,11 @@ const UnassignedFile = (props) => (
</OverlayTrigger>
);
-const AddOrDeleteVolumeFiels = ({add = true, onAdd, onDelete}) => {
+const AddOrDeleteVolumeFiles = ({add = true, onAdd, onDelete, isReadOnlyMode}) => {
const displayText = add ? 'Add Volume Files' : 'Delete Volume Files';
const action = add ? onAdd : onDelete;
return (
- <div className='add-or-delete-volumes' onClick={action}>
- <SVGIcon name={add ? 'plus' : 'close'} />
- <span>{i18n(displayText)}</span>
- </div>
+ <Button disabled={isReadOnlyMode} onClick={action} btnType='link' className='add-or-delete-volumes' iconName={add ? 'plus' : 'close'}>{i18n(displayText)}</Button>
);
};
@@ -195,14 +193,14 @@ class ModuleFile extends Component {
}
render() {
- const {module: {name, isBase, yaml, env, vol, volEnv}, onModuleDelete, files, onModuleFileTypeChange} = this.props;
+ const {module: {name, isBase, yaml, env, vol, volEnv}, onModuleDelete, files, onModuleFileTypeChange, isReadOnlyMode} = this.props;
const {displayVolumes} = this.state;
const moduleType = isBase ? 'BASE' : 'MODULE';
return (
<div className='modules-list-item' data-test-id='module-item'>
<div className='modules-list-item-controllers'>
<div className='modules-list-item-filename'>
- <Icon image={isBase ? 'base' : 'module'} iconClassName='heat-setup-module-icon' />
+ <SVGIcon name={isBase ? 'base' : 'module'} color='primary' iconClassName='heat-setup-module-icon' />
<span className='module-title-by-type'>{`${moduleType}: `}</span>
<div className={`text-and-icon ${this.state.isInNameEdit ? 'in-edit' : ''}`}>
{this.renderNameAccordingToEditState()}
@@ -235,7 +233,7 @@ class ModuleFile extends Component {
files={files}
selected={volEnv}
onChange={onModuleFileTypeChange}/>}
- <AddOrDeleteVolumeFiels onAdd={() => this.setState({displayVolumes: true})} onDelete={() => this.deleteVolumeFiles()} add={!displayVolumes}/>
+ <AddOrDeleteVolumeFiles isReadOnlyMode={isReadOnlyMode} onAdd={() => this.setState({displayVolumes: true})} onDelete={() => this.deleteVolumeFiles()} add={!displayVolumes}/>
</div>
</div>
);
@@ -245,15 +243,15 @@ class ModuleFile extends Component {
class ArtifactOrNestedFileList extends Component {
render() {
- let {type, title, selected, options, onSelectChanged, onAddAllUnassigned} = this.props;
+ let {type, title, selected, options, onSelectChanged, onAddAllUnassigned, isReadOnlyMode, headerClassName} = this.props;
return (
- <div className={`artifact-files ${type === 'nested' ? 'nested' : ''}`}>
+ <div className={`artifact-files ${type === 'nested' ? 'nested' : ''} ${headerClassName} `}>
<div className='artifact-files-header'>
<span>
- {type === 'artifact' && (<Icon image='artifacts' iconClassName='heat-setup-module-icon' />)}
+ {type === 'artifact' && (<SVGIcon color='primary' name='artifacts' iconClassName='heat-setup-module-icon' />)}
{`${title}`}
</span>
- {type === 'artifact' && <span className='add-all-unassigned' onClick={onAddAllUnassigned}>{i18n('Add All Unassigned Files')}</span>}
+ {type === 'artifact' && <Button disabled={isReadOnlyMode} btnType='link' className='add-all-unassigned' onClick={onAddAllUnassigned}>{i18n('Add All Unassigned Files')}</Button>}
</div>
{type === 'nested' ? (
<ul className='nested-list'>{selected.map(nested =>
@@ -294,6 +292,7 @@ class SoftwareProductHeatSetupView extends Component {
<div className='heat-setup-view-modules-and-artifacts'>
<SortableModuleFileList
{...this.props}
+ isReadOnlyMode={this.props.isReadOnlyMode}
artifacts={formattedArtifacts}
unassigned={formattedUnassigned}/>
<ArtifactOrNestedFileList
@@ -302,11 +301,14 @@ class SoftwareProductHeatSetupView extends Component {
options={formattedUnassigned}
selected={formattedArtifacts}
onSelectChanged={onArtifactListChange}
+ isReadOnlyMode={this.props.isReadOnlyMode}
+ headerClassName={(modules && modules.length > 0) ? 'with-list-items' : ''}
onAddAllUnassigned={onAddAllUnassigned}/>
<ArtifactOrNestedFileList
type={'nested'}
title={i18n('NESTED HEAT FILES')}
options={[]}
+ isReadOnlyMode={this.props.isReadOnlyMode}
selected={nested}/>
</div>
<UnassignedFileList>
@@ -316,6 +318,7 @@ class SoftwareProductHeatSetupView extends Component {
:
(<EmptyListContent
heatDataExist={heatDataExist}
+ isReadOnlyMode={this.props.isReadOnlyMode}
onClick={() => this.processAndValidateHeat({modules, unassigned, artifacts, nested}, heatSetupCache)}/>)
}
</UnassignedFileList>
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/validation/HeatValidationView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/validation/HeatValidationView.jsx
index f2d5de4dff..62dcb82db1 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/validation/HeatValidationView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/validation/HeatValidationView.jsx
@@ -16,19 +16,18 @@
import React, {Component, PropTypes} from 'react';
import classNames from 'classnames';
import Collapse from 'react-bootstrap/lib/Collapse.js';
-import Icon from 'nfvo-components/icon/Icon.jsx';
import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
import {mouseActions, errorLevels, nodeFilters} from './HeatValidationConstants.js';
const leftPanelWidth = 250;
const typeToIcon = Object.freeze({
- heat: 'heat',
- volume: 'volume',
+ heat: 'nestedHeat',
+ volume: 'base',
network: 'network',
- artifact: 'validation-artifacts',
+ artifact: 'artifacts',
env: 'env',
- other: 'validation-other'
+ other: 'other'
});
@@ -74,7 +73,7 @@ function HeatFileTreeRow(props) {
{
<span className='tree-node-icon'>
- <Icon image={typeToIcon[node.type]} iconClassName={selectedNode === node.name ? 'selected' : ''}/>
+ <SVGIcon name={typeToIcon[node.type]} color={selectedNode === node.name ? 'primary' : 'secondary'}/>
</span>
}
{
@@ -94,7 +93,7 @@ function HeatFileTreeHeader(props) {
<div onClick={() => props.selectNode(nodeFilters.ALL)} className={classNames({'attachments-tree-header': true,
'header-selected' : props.selectedNode === nodeFilters.ALL})} data-test-id='validation-tree-header'>
<div className='tree-header-title' >
- <Icon image='zip' iconClassName={classNames(props.selectedNode === nodeFilters.ALL ? 'selected' : '', 'header-icon')} />
+ <SVGIcon name='zip' color={props.selectedNode === nodeFilters.ALL ? 'primary' : ''} iconClassName='header-icon' />
<span className={classNames({'tree-header-title-text' : true,
'tree-header-title-selected' : props.selectedNode === nodeFilters.ALL})}>{i18n(`HEAT${hasErrors ? ' (Draft)' : ''}`)}</span>
</div>
@@ -200,12 +199,13 @@ class HeatMessageBoard extends Component {
}
renderError(error) {
let rand = Math.random() * (3000 - 1) + 1;
+ console.log(this.props.selectedNode );
return (
<div
key={error.name + error.errorMessage + error.parentName + rand}
className='error-item' data-test-id='validation-error'>
{error.level === errorLevels.WARNING ?
- <SVGIcon name='exclamationTriangleLine' iconClassName='large' /> : <Icon image='error-lg' /> }
+ <SVGIcon name='exclamationTriangleLine' iconClassName='large' color='warning' /> : <SVGIcon iconClassName='large' color='negative' /> }
<span className='error-item-file-type'>
{
(this.props.selectedNode === nodeFilters.ALL) ?
@@ -217,7 +217,7 @@ class HeatMessageBoard extends Component {
{i18n(error.errorMessage)}
</span>
</span> :
- i18n(error.errorMesage)
+ i18n(error.errorMessage)
}
</span>
</div>
@@ -234,18 +234,14 @@ class ErrorsAndWarningsCount extends Component {
if (!errors) {
return null;
}
- let errIcon = 'error';
let {size} = this.props;
- if (size && size === 'large') {
- errIcon += '-lg';
- }
return (<div className='counters'>
{(errors.errorCount > 0) && <div className='counter'>
- <Icon image={errIcon} iconClassName='counter-icon'/>
- <div className={'error-text ' + (size ? size : '')} data-test-id='validation-error-count'>{errors.errorCount}</div>
+ <SVGIcon name='error' color='negative' iconClassName={size}/>
+ <div className={'error-text ' + (size ? size : '')} data-test-id='validation-error-count'>={errors.errorCount}</div>
</div>}
{(errors.warningCount > 0) && <div className='counter'>
- <SVGIcon name='exclamationTriangleLine' iconClassName={size} />
+ <SVGIcon name='exclamationTriangleLine' iconClassName={size} color='warning'/>
<div className={'warning-text ' + (size ? size : '')} data-test-id='validation-warning-count'>{errors.warningCount}</div>
</div>}
</div>);
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/ImageValidations.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/ImageValidations.js
new file mode 100644
index 0000000000..2483d0aaa2
--- /dev/null
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/ImageValidations.js
@@ -0,0 +1,6 @@
+
+import Validator from 'nfvo-utils/Validator.js';
+
+export const imageCustomValidations = {
+ 'version': value => Validator.validate('version', value, [{type: 'required', data: true}])
+};
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditor.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditor.js
index 49d891c9df..5c81f05e80 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditor.js
@@ -54,9 +54,12 @@ const mapActionsToProps = (dispatch, {softwareProductId, componentId, version})
onDataChanged: (deltaData) => ValidationHelper.dataChanged(dispatch, {deltaData, formName: forms.IMAGE_EDIT_FORM}),
onSubmit: ({data, qdata}) => SoftwareProductComponentsImageActionHelper.saveImageDataAndQuestionnaire(dispatch, {softwareProductId, componentId, version, data, qdata}),
onCancel: () => SoftwareProductComponentsImageActionHelper.closeImageEditor(dispatch),
- onValidateForm: () => ValidationHelper.validateForm(dispatch, forms.IMAGE_EDIT_FORM),
- onQDataChanged: (deltaData) => ValidationHelper.qDataChanged(dispatch, {deltaData,
- qName: IMAGE_QUESTIONNAIRE}),
+ onValidateForm: customValidations => {
+ ValidationHelper.validateForm(dispatch, forms.IMAGE_EDIT_FORM);
+ ValidationHelper.qValidateForm(dispatch, IMAGE_QUESTIONNAIRE, customValidations);
+ },
+ onQDataChanged: (deltaData, customValidations) => ValidationHelper.qDataChanged(dispatch, {deltaData,
+ qName: IMAGE_QUESTIONNAIRE, customValidations}),
};
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorReducer.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorReducer.js
index 0ab785a97f..7c357429e5 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorReducer.js
@@ -30,7 +30,7 @@ export default (state = {}, action) => {
'fileName' : {
isValid: true,
errorText: '',
- validations: [{type: 'required', data: true}, {type: 'validateName', data: true}]
+ validations: [{type: 'required', data: true}]
}
},
formName: forms.IMAGE_EDIT_FORM
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorView.jsx
index 300f8edcc3..7c1a3f5b55 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorView.jsx
@@ -20,6 +20,7 @@ import Form from 'nfvo-components/input/validation/Form.jsx';
import FileDetails from './imagesEditorComponents/FileDetails.jsx';
import ImageDetails from './imagesEditorComponents/ImageDetails.jsx';
+import {imageCustomValidations} from './ImageValidations.js';
class SoftwareProductComponentsImageEditorView extends React.Component {
static propTypes = {
@@ -44,7 +45,7 @@ class SoftwareProductComponentsImageEditorView extends React.Component {
isValid={isFormValid}
formReady={formReady}
submitButtonText={editingMode ? i18n('Save') : i18n('Create')}
- onValidateForm={() => onValidateForm() }
+ onValidateForm={() => onValidateForm(imageCustomValidations) }
className='vsp-components-image-editor'>
<div className='editor-data'>
<FileDetails
@@ -56,7 +57,7 @@ class SoftwareProductComponentsImageEditorView extends React.Component {
isManual={isManual}
dataMap={dataMap}
onQDataChanged={onQDataChanged}/>
- {editingMode && <ImageDetails dataMap={dataMap}qgenericFieldInfo={qgenericFieldInfo} onQDataChanged={onQDataChanged}/>}
+ {editingMode && <ImageDetails dataMap={dataMap} qgenericFieldInfo={qgenericFieldInfo} onQDataChanged={onQDataChanged}/>}
</div>
</Form>}
</div>
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/imagesEditorComponents/FileDetails.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/imagesEditorComponents/FileDetails.jsx
index ca58b697a2..2e9ab417d8 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/imagesEditorComponents/FileDetails.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/imagesEditorComponents/FileDetails.jsx
@@ -40,6 +40,7 @@ const FileDetails = ({editingMode, fileName, onDataChanged, isManual, dataMap, o
type='text'
className='image-filename'/>
</GridItem>
+ {!editingMode && <div className='note-text'>{i18n('After image creation you must go to Edit Image and add File Version')}</div>}
{editingMode && <Version isManual={isManual} dataMap={dataMap} qgenericFieldInfo={qgenericFieldInfo} onQDataChanged={onQDataChanged}/>}
{editingMode && <Format isManual={isManual} qgenericFieldInfo={qgenericFieldInfo} dataMap={dataMap} onQDataChanged={onQDataChanged}/>}
</GridSection>
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/imagesEditorComponents/Version.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/imagesEditorComponents/Version.jsx
index 3cac9a51b8..7dd577b8c9 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/imagesEditorComponents/Version.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/imagesEditorComponents/Version.jsx
@@ -17,6 +17,7 @@ import React from 'react';
import i18n from 'nfvo-utils/i18n/i18n.js';
import Input from 'nfvo-components/input/validation/Input.jsx';
import GridItem from 'nfvo-components/grid/GridItem.jsx';
+import {imageCustomValidations} from '../ImageValidations.js';
const Version = ({isManual, dataMap, qgenericFieldInfo, onQDataChanged}) => {
@@ -28,7 +29,8 @@ const Version = ({isManual, dataMap, qgenericFieldInfo, onQDataChanged}) => {
type='text'
className='image-version'
label={i18n('Version')}
- onChange={(version) => onQDataChanged({'version' : version})}
+ isRequired={true}
+ onChange={(version) => onQDataChanged({'version' : version}, {'version' : imageCustomValidations['version']})}
isValid={qgenericFieldInfo['version'].isValid}
errorText={qgenericFieldInfo['version'].errorText}
value={dataMap['version']}/>
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/loadBalancing/SoftwareProductComponentLoadBalancingRefView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/loadBalancing/SoftwareProductComponentLoadBalancingRefView.jsx
index 9ae9e359b0..8a82f54901 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/loadBalancing/SoftwareProductComponentLoadBalancingRefView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/loadBalancing/SoftwareProductComponentLoadBalancingRefView.jsx
@@ -50,6 +50,7 @@ const pointers = [
added: 'Please describe.'
}
];
+//TODO check for buttons
const TextAreaItem = ({item, toggle, expanded, genericFieldInfo, dataMap, onQDataChanged}) => (
<GridItem colSpan={3} key={item.key} >
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/monitoring/SoftwareProductComponentsMonitoringView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/monitoring/SoftwareProductComponentsMonitoringView.jsx
index 36c1728ef3..2d5a965c40 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/monitoring/SoftwareProductComponentsMonitoringView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/monitoring/SoftwareProductComponentsMonitoringView.jsx
@@ -15,10 +15,8 @@
*/
import React, {Component, PropTypes} from 'react';
import Dropzone from 'react-dropzone';
-import ButtonGroup from 'react-bootstrap/lib/ButtonGroup.js';
-import ButtonToolbar from 'react-bootstrap/lib/ButtonToolbar.js';
-import Button from 'react-bootstrap/lib/Button.js';
-import i18n from 'nfvo-utils/i18n/i18n.js';
+import Button from 'sdc-ui/lib/react/Button.js';
+import DraggableUploadFileBox from 'nfvo-components/fileupload/DraggableUploadFileBox.jsx';
import {fileTypes, type2Title, type2Name} from './SoftwareProductComponentsMonitoringConstants.js';
@@ -59,7 +57,7 @@ class SoftwareProductComponentsMonitoringView extends Component {
let typeDisplayName = type2Title[type];
return (
<Dropzone
- className={`snmp-dropzone ${this.state.dragging ? 'active-dragging' : ''}`}
+ className={`dropzone ${this.state.dragging ? 'active-dragging' : ''}`}
onDrop={(acceptedFiles, rejectedFiles) => this.handleImport(acceptedFiles, rejectedFiles, {isReadOnlyMode, type, refAndName})}
onDragEnter={() => this.handleOnDragEnter(isReadOnlyMode)}
onDragLeave={() => this.setState({dragging:false})}
@@ -71,7 +69,7 @@ class SoftwareProductComponentsMonitoringView extends Component {
disabled>
<div className='draggable-wrapper'>
<div className='section-title'>{typeDisplayName}</div>
- {fileName ? this.renderUploadedFileName(fileName, type) : this.renderUploadButton(refAndName)}
+ {fileName ? this.renderUploadedFileName(fileName, type, isReadOnlyMode) : this.renderUploadButton(refAndName)}
</div>
</Dropzone>
);
@@ -80,25 +78,32 @@ class SoftwareProductComponentsMonitoringView extends Component {
renderUploadButton(refAndName) {
let {isReadOnlyMode} = this.props;
return (
- <div
- className={`software-product-landing-view-top-block-col-upl${isReadOnlyMode ? ' disabled' : ''}`}>
- <div className='drag-text'>{i18n('Drag & drop for upload')}</div>
- <div className='or-text'>{i18n('or')}</div>
- <div className='upload-btn primary-btn' data-test-id={`monitoring-upload-${refAndName}`} onClick={() => this.refs[refAndName].open()}>
- <span className='primary-btn-text'>{i18n('Select file')}</span>
- </div>
- </div>
+ <DraggableUploadFileBox
+ dataTestId={`monitoring-upload-${refAndName}`}
+ className='software-product-landing-view-top-block-col-upl'
+ isReadOnlyMode={isReadOnlyMode}
+ onClick={() => this.refs[refAndName].open()}/>
);
}
- renderUploadedFileName(filename, type) {
+ renderUploadedFileName(filename, type, isReadOnlyMode) {
return (
- <ButtonToolbar>
- <ButtonGroup>
- <Button disabled>{filename}</Button>
- <Button data-test-id={`monitoring-delete-${type}`} className='delete-button' onClick={()=>this.props.onDeleteFile(type)}>X</Button>
- </ButtonGroup>
- </ButtonToolbar>
+ <div className='monitoring-file'>
+ <Button
+ color='white'
+ disabled={true}
+ className='filename'>
+ {filename}
+ </Button>
+
+ <Button
+ color='gray'
+ data-test-id={`monitoring-delete-${type}`}
+ disabled={isReadOnlyMode}
+ onClick={()=>this.props.onDeleteFile(type)}
+ iconName='close'
+ className='delete'/>
+ </div>
);
}
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorView.jsx
index 18f2ee129c..87abaf4978 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorView.jsx
@@ -17,6 +17,7 @@ import React from 'react';
import i18n from 'nfvo-utils/i18n/i18n.js';
import Dropzone from 'react-dropzone';
+import DraggableUploadFileBox from 'nfvo-components/fileupload/DraggableUploadFileBox.jsx';
import {optionsInputValues as ComponentProcessesOptionsInputValues} from './SoftwareProductComponentProcessesConstants.js';
import Form from 'nfvo-components/input/validation/Form.jsx';
import Input from 'nfvo-components/input/validation/Input.jsx';
@@ -31,17 +32,6 @@ const SoftwareProductProcessEditorPropType = React.PropTypes.shape({
type: React.PropTypes.string
});
-const FileUploadBox = ({onClick}) => {
- return (
- <div className='file-upload-box'>
- <div className='drag-text'>{i18n('Drag & drop for upload')}</div>
- <div className='or-text'>{i18n('or')}</div>
- <div className='upload-btn primary-btn' onClick={onClick}>
- <span className='primary-btn-text'>{i18n('Select file')}</span>
- </div>
- </div>
- );
-};
class SoftwareProductProcessesEditorView extends React.Component {
@@ -99,7 +89,7 @@ class SoftwareProductProcessesEditorView extends React.Component {
type='text'/>
</GridItem>
<GridItem colSpan={2}>
- <FileUploadBox onClick={() => this.refs.processEditorFileInput.open()} />
+ <DraggableUploadFileBox isReadOnlyMode={isReadOnlyMode} className='file-upload-box' onClick={() => this.refs.processEditorFileInput.open()} />
</GridItem>
</GridSection>
<GridSection>
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/landingPage/SoftwareProductLandingPageView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/landingPage/SoftwareProductLandingPageView.jsx
index d3738e3ea4..7ffbeda4dc 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/landingPage/SoftwareProductLandingPageView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/landingPage/SoftwareProductLandingPageView.jsx
@@ -19,7 +19,7 @@ import Dropzone from 'react-dropzone';
import i18n from 'nfvo-utils/i18n/i18n.js';
-
+import DraggableUploadFileBox from 'nfvo-components/fileupload/DraggableUploadFileBox.jsx';
import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
import SoftwareProductComponentsList from '../components/SoftwareProductComponentsList.js';
@@ -128,14 +128,11 @@ class SoftwareProductLandingPageView extends React.Component {
</div>
</div>
</div>
- <div
- className={classnames('software-product-landing-view-top-block-col-upl', {'disabled': isReadOnlyMode})}>
- <div className='drag-text'>{i18n('Drag & drop for upload')}</div>
- <div className='or-text'>{i18n('or')}</div>
- <div data-test-id='upload-btn' className='upload-btn primary-btn' onClick={() => this.refs.fileInput.open()}>
- <span className='primary-btn-text'>{i18n('Select file')}</span>
- </div>
- </div>
+ <DraggableUploadFileBox
+ dataTestId='upload-btn'
+ isReadOnlyMode={isReadOnlyMode}
+ className={classnames('software-product-landing-view-top-block-col-upl', {'disabled': isReadOnlyMode})}
+ onClick={() => this.refs.fileInput.open()}/>
</div>
</div>
);
@@ -229,7 +226,7 @@ const ProductSummary = ({currentSoftwareProduct, onDetailsSelect}) => {
const LicenseAgreement = ({licenseAgreementName}) => {
if (!licenseAgreementName) {
- return (<div className='missing-license'><SVGIcon name='exclamationTriangleFull'/><div className='warning-text'>{i18n('Missing')}</div></div>);
+ return (<div className='missing-license'><SVGIcon color='warning' name='exclamationTriangleFull'/><div className='warning-text'>{i18n('Missing')}</div></div>);
}
return <div>{licenseAgreementName}</div>;
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesEditorView.jsx
index 137e4a2b4e..0df36cf65d 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesEditorView.jsx
@@ -17,6 +17,7 @@ import React from 'react';
import Dropzone from 'react-dropzone';
import classnames from 'classnames';
+import DraggableUploadFileBox from 'nfvo-components/fileupload/DraggableUploadFileBox.jsx';
import i18n from 'nfvo-utils/i18n/i18n.js';
import {optionsInputValues as ProcessesOptionsInputValues} from './SoftwareProductProcessesConstants.js';
import Form from 'nfvo-components/input/validation/Form.jsx';
@@ -32,17 +33,6 @@ const SoftwareProductProcessEditorPropType = React.PropTypes.shape({
type: React.PropTypes.string
});
-const FileUploadBox = ({onClick}) => {
- return (
- <div className='file-upload-box'>
- <div className='drag-text'>{i18n('Drag & drop for upload')}</div>
- <div className='or-text'>{i18n('or')}</div>
- <div className='upload-btn primary-btn' onClick={onClick}>
- <span className='primary-btn-text'>{i18n('Select file')}</span>
- </div>
- </div>
- );
-};
class SoftwareProductProcessesEditorView extends React.Component {
@@ -101,7 +91,7 @@ class SoftwareProductProcessesEditorView extends React.Component {
type='text'/>
</GridItem>
<GridItem colSpan={2}>
- <FileUploadBox onClick={() => this.refs.processEditorFileInput.open()}/>
+ <DraggableUploadFileBox isReadOnlyMode={isReadOnlyMode} className='file-upload-box' onClick={() => this.refs.processEditorFileInput.open()}/>
</GridItem>
</GridSection>
<GridSection>
diff --git a/openecomp-ui/test-utils/MockSVGIcon.js b/openecomp-ui/test-utils/MockSVGIcon.js
new file mode 100644
index 0000000000..6ce76cf91a
--- /dev/null
+++ b/openecomp-ui/test-utils/MockSVGIcon.js
@@ -0,0 +1,17 @@
+import React from 'react';
+//import ReactDOMServer from 'react-dom/server';
+
+const SVGIcon = ({name, onClick, label, className, iconClassName, labelClassName, labelPosition, color, disabled, ...other}) => {
+ let colorClass = (color !== '') ? '__' + color : '';
+ let classes = `svg-icon-wrapper ${iconClassName} ${className} ${colorClass} ${onClick ? 'clickable' : ''} ${disabled ? 'disabled' : ''} ${labelPosition}`;
+
+ let iconMock = (
+ <div {...other} onClick={onClick} className={classes}>
+ <span className={`svg-icon __${name} ${disabled ? 'disabled' : ''}`} />
+ {label && <span className={`svg-icon-label ${labelClassName}`}>{label}</span>}
+ </div>
+ );
+// console.log(ReactDOMServer.renderToStaticMarkup(iconMock));
+ return iconMock;
+};
+export default SVGIcon;
diff --git a/openecomp-ui/test-utils/factories/licenseModel/LimitFactories.js b/openecomp-ui/test-utils/factories/licenseModel/LimitFactories.js
index a08e7e6355..5ad8b12228 100644
--- a/openecomp-ui/test-utils/factories/licenseModel/LimitFactories.js
+++ b/openecomp-ui/test-utils/factories/licenseModel/LimitFactories.js
@@ -19,20 +19,20 @@ import {limitType} from 'sdc-app/onboarding/licenseModel/limits/LimitEditorConst
import IdMixin from 'test-utils/factories/mixins/IdMixin.js';
Factory.define('LimitBaseFactory')
- .attrs({
+ .attrs({
name: 'SpLimit1',
type: limitType.SERVICE_PROVIDER,
description: 'fgfg',
- metric: 'CPU',
value: 45,
- unit: 55,
aggregationFunction: 'Peak',
- time: 'Day'
+ time: 'Day'
});
export const LimitPostFactory = new Factory()
+ .attrs({metric: {choice: 'BWDT', other: ''}, unit: {choice: 'GB', other: ''}})
.extend('LimitBaseFactory');
export const LimitItemFactory = new Factory()
+ .attrs({metric: 'BWDT', unit: 'GB'})
.extend('LimitBaseFactory')
- .extend(IdMixin);
+ .extend(IdMixin);
diff --git a/openecomp-ui/test/licenseModel/entitlementPools/test.js b/openecomp-ui/test/licenseModel/entitlementPools/test.js
index 911fb011f4..f5415239ad 100644
--- a/openecomp-ui/test/licenseModel/entitlementPools/test.js
+++ b/openecomp-ui/test/licenseModel/entitlementPools/test.js
@@ -21,6 +21,7 @@ import EntitlementPoolsActionHelper from 'sdc-app/onboarding/licenseModel/entitl
import {EntitlementPoolStoreFactory, EntitlementPoolPostFactory} from 'test-utils/factories/licenseModel/EntitlementPoolFactories.js';
import VersionControllerUtilsFactory from 'test-utils/factories/softwareProduct/VersionControllerUtilsFactory.js';
import {LimitItemFactory, LimitPostFactory} from 'test-utils/factories/licenseModel/LimitFactories.js';
+import {getStrValue} from 'nfvo-utils/getValue.js';
describe('Entitlement Pools Module Tests', function () {
@@ -165,7 +166,7 @@ describe('Entitlement Pools Module Tests', function () {
it('Load Limits List', () => {
- const limitsList = LimitItemFactory.buildList(3);
+ const limitsList = LimitItemFactory.buildList(3);
deepFreeze(limitsList);
const store = storeCreator();
deepFreeze(store.getState());
@@ -190,8 +191,12 @@ describe('Entitlement Pools Module Tests', function () {
deepFreeze(store.getState());
const limitToAdd = LimitPostFactory.build();
+ let limitFromBE = {...limitToAdd};
+ limitFromBE.metric = getStrValue(limitFromBE.metric);
+ limitFromBE.unit = getStrValue(limitFromBE.unit);
deepFreeze(limitToAdd);
+ deepFreeze(limitFromBE);
const LimitIdFromResponse = 'ADDED_ID';
const limitAddedItem = {...limitToAdd, id: LimitIdFromResponse};
@@ -202,7 +207,7 @@ describe('Entitlement Pools Module Tests', function () {
mockRest.addHandler('post', ({data, options, baseUrl}) => {
expect(baseUrl).toEqual(`/onboarding-api/v1.0/vendor-license-models/${LICENSE_MODEL_ID}/versions/${version.id}/entitlement-pools/${entitlementPool.id}/limits`);
- expect(data).toEqual(limitToAdd);
+ expect(data).toEqual(limitFromBE);
expect(options).toEqual(undefined);
return {
returnCode: 'OK',
@@ -220,7 +225,7 @@ describe('Entitlement Pools Module Tests', function () {
return EntitlementPoolsActionHelper.submitLimit(store.dispatch,
{
licenseModelId: LICENSE_MODEL_ID,
- version,
+ version,
entitlementPool,
limit: limitToAdd
}
@@ -232,9 +237,9 @@ describe('Entitlement Pools Module Tests', function () {
it('Delete Limit', () => {
- const limitsList = LimitItemFactory.buildList(1);
+ const limitsList = LimitItemFactory.buildList(1);
deepFreeze(limitsList);
-
+
const store = storeCreator({
licenseModel: {
entitlementPool: {
@@ -279,7 +284,7 @@ describe('Entitlement Pools Module Tests', function () {
it('Update Limit', () => {
- const limitsList = LimitItemFactory.buildList(1);
+ const limitsList = LimitItemFactory.buildList(1);
deepFreeze(limitsList);
const entitlementPool = EntitlementPoolStoreFactory.build();
const store = storeCreator({
@@ -294,16 +299,20 @@ describe('Entitlement Pools Module Tests', function () {
deepFreeze(store.getState());
-
+
const previousData = limitsList[0];
+
deepFreeze(previousData);
const limitId = limitsList[0].id;
-
- const updatedLimit = {...previousData, name: 'updatedLimit'};
- deepFreeze(updatedLimit);
+
+ let updatedLimit = {...previousData, name: 'updatedLimit'};
+
const updatedLimitForPut = {...updatedLimit, id: undefined};
+ updatedLimit.metric = {choice: updatedLimit.metric, other: ''};
+ updatedLimit.unit = {choice: updatedLimit.unit, other: ''};
+ deepFreeze(updatedLimit);
- const expectedStore = cloneAndSet(store.getState(), 'licenseModel.entitlementPool.entitlementPoolEditor.limitsList', [updatedLimit]);
+ const expectedStore = cloneAndSet(store.getState(), 'licenseModel.entitlementPool.entitlementPoolEditor.limitsList', [updatedLimitForPut]);
mockRest.addHandler('put', ({data, options, baseUrl}) => {
@@ -317,13 +326,13 @@ describe('Entitlement Pools Module Tests', function () {
expect(baseUrl).toEqual(`/onboarding-api/v1.0/vendor-license-models/${LICENSE_MODEL_ID}/versions/${version.id}/entitlement-pools/${entitlementPool.id}/limits`);
expect(data).toEqual(undefined);
expect(options).toEqual(undefined);
- return {results: [updatedLimit]};
+ return {results: [updatedLimitForPut]};
});
return EntitlementPoolsActionHelper.submitLimit(store.dispatch,
{
licenseModelId: LICENSE_MODEL_ID,
- version,
+ version,
entitlementPool,
limit: updatedLimit
}
diff --git a/openecomp-ui/test/licenseModel/licenseKeyGroups/test.js b/openecomp-ui/test/licenseModel/licenseKeyGroups/test.js
index 77fcc00694..739e266d7f 100644
--- a/openecomp-ui/test/licenseModel/licenseKeyGroups/test.js
+++ b/openecomp-ui/test/licenseModel/licenseKeyGroups/test.js
@@ -22,6 +22,7 @@ import {LicenseKeyGroupStoreFactory, LicenseKeyGroupPostFactory} from 'test-util
import LicenseKeyGroupsActionHelper from 'sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js';
import VersionControllerUtilsFactory from 'test-utils/factories/softwareProduct/VersionControllerUtilsFactory.js';
import {LimitItemFactory, LimitPostFactory} from 'test-utils/factories/licenseModel/LimitFactories.js';
+import {getStrValue} from 'nfvo-utils/getValue.js';
describe('License Key Groups Module Tests', function () {
@@ -160,7 +161,7 @@ describe('License Key Groups Module Tests', function () {
it('Load Limits List', () => {
- const limitsList = LimitItemFactory.buildList(3);
+ const limitsList = LimitItemFactory.buildList(3);
deepFreeze(limitsList);
const store = storeCreator();
deepFreeze(store.getState());
@@ -185,8 +186,12 @@ describe('License Key Groups Module Tests', function () {
deepFreeze(store.getState());
const limitToAdd = LimitPostFactory.build();
+ let limitFromBE = {...limitToAdd};
+ limitFromBE.metric = getStrValue(limitFromBE.metric);
+ limitFromBE.unit = getStrValue(limitFromBE.unit);
deepFreeze(limitToAdd);
+ deepFreeze(limitFromBE);
const LimitIdFromResponse = 'ADDED_ID';
const limitAddedItem = {...limitToAdd, id: LimitIdFromResponse};
@@ -197,7 +202,7 @@ describe('License Key Groups Module Tests', function () {
mockRest.addHandler('post', ({data, options, baseUrl}) => {
expect(baseUrl).toEqual(`/onboarding-api/v1.0/vendor-license-models/${LICENSE_MODEL_ID}/versions/${version.id}/license-key-groups/${licenseKeyGroup.id}/limits`);
- expect(data).toEqual(limitToAdd);
+ expect(data).toEqual(limitFromBE);
expect(options).toEqual(undefined);
return {
returnCode: 'OK',
@@ -215,7 +220,7 @@ describe('License Key Groups Module Tests', function () {
return LicenseKeyGroupsActionHelper.submitLimit(store.dispatch,
{
licenseModelId: LICENSE_MODEL_ID,
- version,
+ version,
licenseKeyGroup,
limit: limitToAdd
}
@@ -226,9 +231,9 @@ describe('License Key Groups Module Tests', function () {
it('Delete Limit', () => {
- const limitsList = LimitItemFactory.buildList(1);
+ const limitsList = LimitItemFactory.buildList(1);
deepFreeze(limitsList);
-
+
const store = storeCreator({
licenseModel: {
entitlementPool: {
@@ -273,7 +278,7 @@ describe('License Key Groups Module Tests', function () {
it('Update Limit', () => {
- const limitsList = LimitItemFactory.buildList(1);
+ const limitsList = LimitItemFactory.buildList(1);
deepFreeze(limitsList);
const licenseKeyGroup = LicenseKeyGroupStoreFactory.build();
const store = storeCreator({
@@ -288,16 +293,18 @@ describe('License Key Groups Module Tests', function () {
deepFreeze(store.getState());
-
+
const previousData = limitsList[0];
deepFreeze(previousData);
const limitId = limitsList[0].id;
-
- const updatedLimit = {...previousData, name: 'updatedLimit'};
- deepFreeze(updatedLimit);
+
+ let updatedLimit = {...previousData, name: 'updatedLimit'};
const updatedLimitForPut = {...updatedLimit, id: undefined};
+ updatedLimit.metric = {choice: updatedLimit.metric, other: ''};
+ updatedLimit.unit = {choice: updatedLimit.unit, other: ''};
+ deepFreeze(updatedLimit);
- const expectedStore = cloneAndSet(store.getState(), 'licenseModel.licenseKeyGroup.licenseKeyGroupsEditor.limitsList', [updatedLimit]);
+ const expectedStore = cloneAndSet(store.getState(), 'licenseModel.licenseKeyGroup.licenseKeyGroupsEditor.limitsList', [updatedLimitForPut]);
mockRest.addHandler('put', ({data, options, baseUrl}) => {
@@ -311,13 +318,13 @@ describe('License Key Groups Module Tests', function () {
expect(baseUrl).toEqual(`/onboarding-api/v1.0/vendor-license-models/${LICENSE_MODEL_ID}/versions/${version.id}/license-key-groups/${licenseKeyGroup.id}/limits`);
expect(data).toEqual(undefined);
expect(options).toEqual(undefined);
- return {results: [updatedLimit]};
+ return {results: [updatedLimitForPut]};
});
return LicenseKeyGroupsActionHelper.submitLimit(store.dispatch,
{
licenseModelId: LICENSE_MODEL_ID,
- version,
+ version,
licenseKeyGroup,
limit: updatedLimit
}
diff --git a/openecomp-ui/test/nfvo-components/listEditor/listEditor.test.js b/openecomp-ui/test/nfvo-components/listEditor/listEditor.test.js
index 029ea31889..b1127386f7 100644
--- a/openecomp-ui/test/nfvo-components/listEditor/listEditor.test.js
+++ b/openecomp-ui/test/nfvo-components/listEditor/listEditor.test.js
@@ -40,7 +40,7 @@ describe('listEditor Module Tests', function () {
</ListEditorView>
);
expect(itemView).toBeTruthy();
- let sliderIcon = TestUtils.findRenderedDOMComponentWithClass(itemView, 'sliders');
+ let sliderIcon = TestUtils.findRenderedDOMComponentWithClass(itemView, '__sliders');
TestUtils.Simulate.click(sliderIcon);
});
@@ -60,7 +60,7 @@ describe('listEditor Module Tests', function () {
</ListEditorItemView>
);
expect(itemView).toBeTruthy();
- let sliderIcon = TestUtils.findRenderedDOMComponentWithClass(itemView, 'sliders');
+ let sliderIcon = TestUtils.findRenderedDOMComponentWithClass(itemView, '__sliders');
TestUtils.Simulate.click(sliderIcon);
});
@@ -71,7 +71,7 @@ describe('listEditor Module Tests', function () {
</ListEditorItemView>
);
expect(itemView).toBeTruthy();
- let sliderIcon = TestUtils.findRenderedDOMComponentWithClass(itemView, 'trashO');
+ let sliderIcon = TestUtils.findRenderedDOMComponentWithClass(itemView, '__trashO');
TestUtils.Simulate.click(sliderIcon);
});
@@ -82,7 +82,8 @@ describe('listEditor Module Tests', function () {
</ListEditorItemView>
);
expect(itemView).toBeTruthy();
- let trashIcon = TestUtils.scryRenderedDOMComponentsWithClass(itemView, 'fa-trash-o');
+ let trashIcon = TestUtils.scryRenderedDOMComponentsWithClass(itemView, '__trashOq');
expect(trashIcon).toEqual([]);
});
+
});
diff --git a/openecomp-ui/test/nfvo-components/panel/VersionController/versionController.test.js b/openecomp-ui/test/nfvo-components/panel/VersionController/versionController.test.js
index 7d4d57eb35..e14e9b76f5 100644
--- a/openecomp-ui/test/nfvo-components/panel/VersionController/versionController.test.js
+++ b/openecomp-ui/test/nfvo-components/panel/VersionController/versionController.test.js
@@ -16,7 +16,7 @@
import React from 'react';
-
+import ReactDOMServer from 'react-dom/server';
import TestUtils from 'react-addons-test-utils';
import {mount} from 'enzyme';
import VersionController from 'nfvo-components/panel/versionController/VersionController.jsx';
@@ -131,21 +131,21 @@ describe('versionController UI Component', () => {
let callVCActionProps = { ...props, version: '1.0', callVCAction: function(){} };
let versionController = mount(<VersionController isCheckedOut={true} status={statusEnum.CHECK_OUT_STATUS} {...callVCActionProps} />);
let elem = versionController.find('[data-test-id="vc-checkout-btn"]');
- let svgIcon = versionController.find('.versionControllerLockClosed');
+
expect(elem).toBeTruthy();
expect(elem.length).toEqual(1);
- expect(svgIcon.hasClass('disabled')).toBe(true);
+ expect(elem.find('.svg-icon').length).toEqual(1);
+ expect(elem.find('.svg-icon').hasClass('disabled')).toBe(true);
});
it('Doesn\'t show the checkout button', () => {
let callVCActionProps = { ...props, version: '1.0', callVCAction: function(){} };
let versionController = mount(<VersionController isCheckedOut={false} status={statusEnum.CHECK_IN_STATUS} {...callVCActionProps} />);
let elem = versionController.find('[data-test-id="vc-checkout-btn"]');
- let svgIcon = versionController.find('.versionControllerLockClosed');
-
expect(elem).toBeTruthy();
expect(elem.length).toBe(1);
- expect(svgIcon.hasClass('disabled')).toBe(true);
+ expect(elem.find('.svg-icon').length).toEqual(1);
+ expect(elem.find('.svg-icon').hasClass('disabled')).toBe(true);
});