ui support for archive items
Issue-ID: SDC-1088
Change-Id: I836e4896a8ec6bb065f9d2571f514916ccf6759f
Signed-off-by: svishnev <shlomo-stanisla.vishnevetskiy@amdocs.com>
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogList.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogList.jsx
index 03efa19..10d855c 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogList.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogList.jsx
@@ -1,17 +1,17 @@
-/*!
- * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+/*
+ * Copyright © 2016-2018 European Support Limited
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
- * or implied. See the License for the specific language governing
- * permissions and limitations under the License.
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
*/
import React from 'react';
import i18n from 'nfvo-utils/i18n/i18n.js';
@@ -29,10 +29,12 @@
<div className='catalog-list'>
{vendorPageOptions && <SoftwareProductListHeader onBack={vendorPageOptions.onBack} selectedVendor={vendorPageOptions.selectedVendor}/>}
<div className='catalog-items'>
- <div className='create-catalog-item-wrapper'>
- {onAddVLM && <CreateItemTile onClick={onAddVLM} dataTestId={'catalog-add-new-vlm'} className='vlm-type' title={i18n('CREATE NEW VLM')}/>}
- {onAddVSP && <CreateItemTile onClick={() => onAddVSP()} dataTestId={'catalog-add-new-vsp'} className='vsp-type' title={i18n('CREATE NEW VSP')}/>}
- </div>
+ { (onAddVLM || onAddVSP) &&
+ <div className='create-catalog-item-wrapper'>
+ {onAddVLM && <CreateItemTile onClick={onAddVLM} dataTestId={'catalog-add-new-vlm'} className='vlm-type' title={i18n('CREATE NEW VLM')}/>}
+ {onAddVSP && <CreateItemTile onClick={() => onAddVSP()} dataTestId={'catalog-add-new-vsp'} className='vsp-type' title={i18n('CREATE NEW VSP')}/>}
+ </div>
+ }
{children}
</div>
</div>
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/DetailsCatalogView.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/DetailsCatalogView.jsx
index 8875172..ea6cf5e 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/DetailsCatalogView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/DetailsCatalogView.jsx
@@ -1,5 +1,5 @@
/*!
- * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ * Copyright © 2016-2018 European Support Limited
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
@@ -27,8 +27,8 @@
VSPList: PropTypes.array,
onSelectVLM: PropTypes.func.isRequired,
onSelectVSP: PropTypes.func.isRequired,
- onAddVLM: PropTypes.func.isRequired,
- onAddVSP: PropTypes.func.isRequired,
+ onAddVLM: PropTypes.func,
+ onAddVSP: PropTypes.func,
filter: PropTypes.string.isRequired
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js b/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js
index a308e1e..9535147 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js
@@ -1,17 +1,17 @@
-/*!
- * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+/*
+ * Copyright © 2016-2018 European Support Limited
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
- * or implied. See the License for the specific language governing
- * permissions and limitations under the License.
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
*/
import {connect} from 'react-redux';
@@ -21,16 +21,20 @@
import LicenseModelCreationActionHelper from '../licenseModel/creation/LicenseModelCreationActionHelper.js';
import SoftwareProductCreationActionHelper from '../softwareProduct/creation/SoftwareProductCreationActionHelper.js';
import sortByStringProperty from 'nfvo-utils/sortByStringProperty.js';
-
+import {tabsMapping} from './onboardingCatalog/OnboardingCatalogConstants.js';
+import {itemsType} from './filter/FilterConstants.js';
export const mapStateToProps = ({
onboard: {
onboardingCatalog,
activeTab,
- searchValue
+ searchValue,
+ filter
},
licenseModelList,
users,
+ archivedLicenseModelList,
+ archivedSoftwareProductList,
finalizedLicenseModelList,
softwareProductList,
finalizedSoftwareProductList
@@ -69,12 +73,20 @@
).concat(finalizedLicenseModelList);
let {activeTab: catalogActiveTab, vendorCatalog: {vspOverlay, selectedVendor}} = onboardingCatalog;
+ if (filter.byVendorView) {
+ catalogActiveTab = tabsMapping.BY_VENDOR;
+ }
+ else if (filter.itemsType && filter.itemsType === itemsType.ARCHIVED) {
+ catalogActiveTab = tabsMapping.ARCHIVE;
+ }
return {
finalizedLicenseModelList,
finalizedSoftwareProductList,
licenseModelList,
softwareProductList,
+ archivedLicenseModelList,
+ archivedSoftwareProductList,
fullLicenseModelList,
activeTab,
catalogActiveTab,
@@ -105,7 +117,6 @@
onVendorSelect: (vendor) => OnboardingCatalogActionHelper.onVendorSelect(dispatch, {vendor}),
onMigrate: ({softwareProduct}) => OnboardingCatalogActionHelper.onMigrate(dispatch, softwareProduct)
};
-
};
export default connect(mapStateToProps, mapActionsToProps)(OnboardView);
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardView.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardView.jsx
index f64c1e5..c045a37 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/OnboardView.jsx
@@ -60,6 +60,8 @@
softwareProductList: PropTypes.array,
finalizedLicenseModelList: PropTypes.array,
finalizedSoftwareProductList: PropTypes.array,
+ archivedSoftwareProductList: PropTypes.array,
+ archivedLicenseModelList: PropTypes.array,
modalToShow: PropTypes.oneOf(objectValues(catalogItemTypes)),
onSelectLicenseModel: PropTypes.func.isRequired,
onSelectSoftwareProduct: PropTypes.func.isRequired,
@@ -80,8 +82,9 @@
case tabsMapping.WORKSPACE:
return <WorkspaceView {...this.props} />;
case tabsMapping.CATALOG:
- default:
return <OnboardingCatalogView {...this.props} />;
+ default:
+ return <WorkspaceView {...this.props} />;
}
}
@@ -93,7 +96,7 @@
<div className='catalog-parts'>
<OnboardHeader activeTab={activeTab} onTabClick={onTabClick} searchValue={searchValue} onSearch={value => onSearch(value)}/>
{this.renderViewByTab(activeTab)}
- </div>
+ </div>
</div>
);
}
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx
index bf1927d..d8d04f2 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx
@@ -22,10 +22,14 @@
import Accordion from 'nfvo-components/accordion/Accordion.jsx';
import {actionTypes} from './FilterConstants.js';
import featureToggle from 'sdc-app/features/featureToggle.js';
+import {featureToggleNames} from 'sdc-app/features/FeaturesConstants.js';
+import {tabsMapping as onboardTabsMapping} from '../OnboardConstants.js';
+import {itemsType as itemsTypeConstants} from './FilterConstants.js';
-const mapStateToProps = ({onboard: {filter}}) => {
+const mapStateToProps = ({onboard: {filter, activeTab}}) => {
return {
- data: filter
+ data: filter,
+ activeTab
};
};
@@ -40,9 +44,27 @@
};
const Filter = ({onDataChanged, data: {entityTypeVsp, entityTypeVlm, roleOwner, roleContributor, roleViewer,
- procedureNetwork, procedureManual, recentlyUpdated}}) => (
- <div className='catalog-filter'>
- <Input label={i18n('Recently Updated')} type='checkbox' checked={recentlyUpdated}
+ procedureNetwork, procedureManual, recentlyUpdated, byVendorView, itemsType}, activeTab}) => (
+ <div className='catalog-filter'>
+ {activeTab === onboardTabsMapping.CATALOG && <Input
+ type='select'
+ className='catalog-filter-items-type'
+ data-test-id='catalog-filter-items-type'
+ disabled={byVendorView}
+ value={itemsType}
+ onChange={e => onDataChanged({itemsType: e.target.value})}>
+ <option key={itemsTypeConstants.ACTIVE} value={itemsTypeConstants.ACTIVE}>Active Items</option>
+ <option key={itemsTypeConstants.ARCHIVED} value={itemsTypeConstants.ARCHIVED}>Archived Items</option>
+ </Input>}
+ {activeTab === onboardTabsMapping.CATALOG && <Input
+ label={i18n('By Vendor View')}
+ type='checkbox'
+ disabled={itemsType === itemsTypeConstants.ARCHIVED}
+ checked={byVendorView}
+ onChange={byVendorView => onDataChanged({byVendorView})}
+ data-test-id='filter-by-vendor-view' value='' />
+ }
+ <Input label={i18n('Recently Updated')} type='checkbox' checked={recentlyUpdated}
onChange={recentlyUpdated => onDataChanged({recentlyUpdated})} data-test-id='filter-recently-updated' value='' />
<Accordion title={i18n('ENTITY TYPE')}>
@@ -71,4 +93,4 @@
data: PropTypes.object
};
-export default featureToggle('ONBOARDING_FILTER')(connect(mapStateToProps, mapActionsToProps)(Filter));
+export default featureToggle(featureToggleNames.FILTER)(connect(mapStateToProps, mapActionsToProps)(Filter));
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js
index 36a415c..d944cb0 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js
@@ -19,3 +19,8 @@
export const actionTypes = keyMirror({
FILTER_DATA_CHANGED: null
});
+
+export const itemsType = {
+ ACTIVE: '1',
+ ARCHIVED: '2'
+};
\ No newline at end of file
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js
index a1bf1b1..239ae45 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js
@@ -1,17 +1,17 @@
-/*!
- * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+/*
+ * Copyright © 2016-2018 European Support Limited
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
- * or implied. See the License for the specific language governing
- * permissions and limitations under the License.
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
*/
import keyMirror from 'nfvo-utils/KeyMirror.js';
@@ -28,7 +28,8 @@
export const catalogItemStatuses = {
DRAFT: 'Draft',
- CERTIFIED: 'Certified'
+ CERTIFIED: 'Certified',
+ ARCHIVED: 'ARCHIVED'
};
export const modalMapper = {
@@ -38,7 +39,8 @@
export const tabsMapping = {
'BY_VENDOR': 1,
- 'ALL': 2
+ 'ACTIVE': 2,
+ 'ARCHIVE': 3
};
export const migrationStatusMapper = {
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogReducer.js b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogReducer.js
index d7d9d0b..3f8a833 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogReducer.js
@@ -1,17 +1,17 @@
-/*!
- * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+/*
+ * Copyright © 2016-2018 European Support Limited
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
- * or implied. See the License for the specific language governing
- * permissions and limitations under the License.
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
*/
import {actionTypes, tabsMapping} from './OnboardingCatalogConstants.js';
import {combineReducers} from 'redux';
@@ -19,7 +19,7 @@
const onboardingCatalogReducer = combineReducers({
vendorCatalog: vendorCatalogReducer,
- activeTab: (state = tabsMapping.ALL, action) => action.type === actionTypes.CHANGE_ACTIVE_CATALOG_TAB ? action.activeTab : state
+ activeTab: (state = tabsMapping.ACTIVE, action) => action.type === actionTypes.CHANGE_ACTIVE_CATALOG_TAB ? action.activeTab : state
});
export default (state, action) => {
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx
index 60a5aae..8ae8549 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx
@@ -1,17 +1,17 @@
-/*!
- * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+/*
+ * Copyright © 2016-2018 European Support Limited
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
- * or implied. See the License for the specific language governing
- * permissions and limitations under the License.
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
*/
import React from 'react';
import i18n from 'nfvo-utils/i18n/i18n.js';
@@ -20,22 +20,32 @@
import VendorCatalogView from './VendorCatalogView.jsx';
import { tabsMapping} from './OnboardingCatalogConstants.js';
import {tabsMapping as WCTabsMapping} from 'sdc-app/onboarding/onboard/OnboardConstants.js';
+import featureToggle from 'sdc-app/features/featureToggle.js';
+import {featureToggleNames} from 'sdc-app/features/FeaturesConstants.js';
-const CatalogHeaderTabs = ({onTabPress, activeTab}) => (
+const Separator = () => (
+ <div className='tab-separator'/>
+);
+
+const Tab = ({onTabPress, title, dataTestId, activeTab, tabMapping}) => (
+ <div
+ className={classnames('catalog-header-tab', {'active': activeTab === tabMapping })}
+ onClick={() => onTabPress(tabMapping)}
+ data-test-id={dataTestId}>
+ {title}
+ </div>
+);
+
+const ArchiveTab = featureToggle(featureToggleNames.ARCHIVE_ITEM)(Tab);
+const ArchiveTabSeparator = featureToggle(featureToggleNames.ARCHIVE_ITEM)(Separator);
+
+const CatalogHeaderTabs = (props) => (
<div className='catalog-header-tabs'>
- <div
- className={classnames('catalog-header-tab', {'active': activeTab === tabsMapping.ALL })}
- onClick={() => onTabPress(tabsMapping.ALL)}
- data-test-id='catalog-all-tab'>
- {i18n('ALL')}
- </div>
- <div className='tab-separator'/>
- <div
- className={classnames('catalog-header-tab', {'active': activeTab === tabsMapping.BY_VENDOR })}
- onClick={() => onTabPress(tabsMapping.BY_VENDOR)}
- data-test-id='catalog-by-vendor-tab'>
- {i18n('BY VENDOR')}
- </div>
+ <Tab {...props} title={i18n('ACTIVE')} dataTestId='catalog-all-tab' tabMapping={tabsMapping.ACTIVE}/>
+ <Separator/>
+ <Tab {...props} title={i18n('BY VENDOR')} dataTestId='catalog-header-tab' tabMapping={tabsMapping.BY_VENDOR}/>
+ <ArchiveTabSeparator/>
+ <ArchiveTab {...props} title={i18n('ARCHIVE')} dataTestId='catalog-archive-tab' tabMapping={tabsMapping.ARCHIVE}/>
</div>
);
@@ -45,13 +55,38 @@
</div>
);
+const FilterCatalogHeader = () => (
+ <div className='catalog-header'>
+ <div className='catalog-header-tabs'>
+ <div className='catalog-header-tab active'>
+ {i18n('ONBOARD CATALOG')}
+ </div>
+ </div>
+ </div>
+);
+
+
+const FeaturedCatalogHeader = featureToggle(featureToggleNames.FILTER)({AComp: FilterCatalogHeader, BComp: CatalogHeader});
+
class OnboardingCatalogView extends React.Component {
renderViewByTab(activeTab){
const {finalizedLicenseModelList: licenseModelList, fullLicenseModelList, users, vspOverlay, finalizedSoftwareProductList: softwareProductList, onSelectLicenseModel, onSelectSoftwareProduct,
- onAddLicenseModelClick, onAddSoftwareProductClick, onVspOverlayChange, onVendorSelect, selectedVendor, searchValue, onMigrate} = this.props;
+ onAddLicenseModelClick, onAddSoftwareProductClick, onVspOverlayChange, onVendorSelect, selectedVendor, searchValue, onMigrate,
+ archivedSoftwareProductList, archivedLicenseModelList} = this.props;
switch (activeTab){
- case tabsMapping.ALL:
+ case tabsMapping.ARCHIVE:
+ return (
+ <DetailsCatalogView
+ VLMList={archivedLicenseModelList}
+ VSPList={archivedSoftwareProductList}
+ users={users}
+ onSelectVLM={(item, users) => onSelectLicenseModel(item, users, WCTabsMapping.CATALOG)}
+ onSelectVSP={(item, users) => onSelectSoftwareProduct(item, users, WCTabsMapping.CATALOG)}
+ filter={searchValue}
+ onMigrate={onMigrate}/>
+ );
+ case tabsMapping.ACTIVE:
return (
<DetailsCatalogView
VLMList={licenseModelList}
@@ -88,7 +123,7 @@
const {selectedVendor, catalogActiveTab: activeTab, onCatalogTabClick, onSearch, searchValue} = this.props;
return (
<div className='catalog-wrapper'>
- {!selectedVendor && <CatalogHeader
+ {!selectedVendor && <FeaturedCatalogHeader
onSearch={event => onSearch(event.target.value)}
activeTab={activeTab}
onTabPress={tab => onCatalogTabClick(tab)}