diff options
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/onboard/filter')
7 files changed, 307 insertions, 140 deletions
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx index c80232de0a..a00357c7b9 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx @@ -17,14 +17,19 @@ import { connect } from 'react-redux'; import React from 'react'; import PropTypes from 'prop-types'; -import i18n from 'nfvo-utils/i18n/i18n.js'; -import Input from 'nfvo-components/input/validation/Input.jsx'; -import Accordion from 'nfvo-components/accordion/Accordion.jsx'; -import { actionTypes } from './FilterConstants.js'; import featureToggle from 'sdc-app/features/featureToggle.js'; import { featureToggleNames } from 'sdc-app/features/FeaturesConstants.js'; import { tabsMapping as onboardTabsMapping } from '../OnboardConstants.js'; -import { itemsType as itemsTypeConstants } from './FilterConstants.js'; +import { actionTypes } from './FilterConstants.js'; + +import Panel from 'sdc-ui/lib/react/Panel.js'; +import { + ItemStatus, + ByVendorView, + EntityType, + Permissions, + OnboardingProcedure +} from './FilterComponents.jsx'; const mapStateToProps = ({ onboard: { filter, activeTab } }) => { return { @@ -35,145 +40,39 @@ const mapStateToProps = ({ onboard: { filter, activeTab } }) => { const mapActionsToProps = dispatch => { return { - onDataChanged: deltaData => + onDataChanged: deltaData => { dispatch({ type: actionTypes.FILTER_DATA_CHANGED, deltaData - }) + }); + } }; }; -const Filter = ({ - onDataChanged, - data: { - entityTypeVsp, - entityTypeVlm, - roleOwner, - roleContributor, - roleViewer, - procedureNetwork, - procedureManual, - recentlyUpdated, - byVendorView, - itemsType - }, - activeTab -}) => ( - <div className="catalog-filter"> - {activeTab === onboardTabsMapping.CATALOG && ( - <Input - type="select" - className="catalog-filter-items-type" - data-test-id="catalog-filter-items-type" - disabled={byVendorView} - value={itemsType} - onChange={e => onDataChanged({ itemsType: e.target.value })}> - <option - key={itemsTypeConstants.ACTIVE} - value={itemsTypeConstants.ACTIVE}> - Active Items - </option> - <option - key={itemsTypeConstants.ARCHIVED} - value={itemsTypeConstants.ARCHIVED}> - Archived Items - </option> - </Input> - )} - {activeTab === onboardTabsMapping.CATALOG && ( - <Input - label={i18n('By Vendor View')} - type="checkbox" - disabled={itemsType === itemsTypeConstants.ARCHIVED} - checked={byVendorView} - onChange={byVendorView => onDataChanged({ byVendorView })} - data-test-id="filter-by-vendor-view" - value="" - /> - )} - <Input - label={i18n('Recently Updated')} - type="checkbox" - checked={recentlyUpdated} - onChange={recentlyUpdated => onDataChanged({ recentlyUpdated })} - data-test-id="filter-recently-updated" - value="" - /> - - <Accordion title={i18n('ENTITY TYPE')}> - <Input - label={i18n('VSP')} - type="checkbox" - checked={entityTypeVsp} - onChange={entityTypeVsp => onDataChanged({ entityTypeVsp })} - data-test-id="filter-type-vsp" - value="" - /> - <Input - label={i18n('VLM')} - type="checkbox" - checked={entityTypeVlm} - onChange={entityTypeVlm => onDataChanged({ entityTypeVlm })} - data-test-id="filter-type-vlm" - value="" - /> - </Accordion> - - <Accordion title={i18n('ROLE')}> - <Input - label={i18n('Owner')} - type="checkbox" - checked={roleOwner} - onChange={roleOwner => onDataChanged({ roleOwner })} - data-test-id="filter-role-owner" - value="" - /> - <Input - label={i18n('Contributer')} - type="checkbox" - checked={roleContributor} - onChange={roleContributor => onDataChanged({ roleContributor })} - data-test-id="filter-role-contributor" - value="" - /> - <Input - label={i18n('Viewer')} - type="checkbox" - checked={roleViewer} - onChange={roleViewer => onDataChanged({ roleViewer })} - data-test-id="filter-role-viewr" - value="" - /> - </Accordion> - - <Accordion title={i18n('ONBOARDING PROCEDURE')}> - <Input - label={i18n('Network Package')} - type="checkbox" - checked={procedureNetwork} - onChange={procedureNetwork => - onDataChanged({ procedureNetwork }) - } - data-test-id="filter-procedure-network" - value="" - /> - <Input - label={i18n('Manual')} - type="checkbox" - checked={procedureManual} - onChange={procedureManual => onDataChanged({ procedureManual })} - data-test-id="filter-procedure-manual" - value="" - /> - </Accordion> - </div> -); +const Filter = ({ onDataChanged, data, activeTab }) => { + return ( + <Panel className="catalog-filter"> + <ItemStatus data={data} onDataChanged={onDataChanged} /> + <EntityType data={data} onDataChanged={onDataChanged} /> + <Permissions data={data} onDataChanged={onDataChanged} /> + <OnboardingProcedure data={data} onDataChanged={onDataChanged} /> + {activeTab === onboardTabsMapping.CATALOG && ( + <ByVendorView data={data} onDataChanged={onDataChanged} /> + )} + </Panel> + ); +}; Filter.PropTypes = { onDataChanged: PropTypes.func, - data: PropTypes.object + data: PropTypes.object, + activeTab: PropTypes.number }; export default featureToggle(featureToggleNames.FILTER)( connect(mapStateToProps, mapActionsToProps)(Filter) ); + +export const ConnectedFilter = connect(mapStateToProps, mapActionsToProps)( + Filter +); diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterActionHelper.js new file mode 100644 index 0000000000..f8155df49d --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterActionHelper.js @@ -0,0 +1,60 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { default as ItemsHelper } from 'sdc-app/common/helpers/ItemsHelper.js'; +import { + itemType, + versionStatus +} from 'sdc-app/common/helpers/ItemsHelperConstants.js'; +import { actionTypes } from './FilterConstants.js'; + +const FilterActionHelper = { + async updateFilteredItems(dispatch, filter) { + let permission = { ...filter.permission }; + if ( + filter.versionStatus === versionStatus.DRAFT && + !permission.Owner && + !permission.Contributor + ) { + permission.Owner = true; + permission.Contributor = true; + } + const items = await ItemsHelper.fetchItems({ + ...filter, + permission + }); + let vspList = []; + let vlmList = []; + items.results.map(item => { + if (item.type === itemType.VSP) { + const { properties, ...all } = item; + vspList.push({ ...all, ...properties }); + } else { + vlmList.push(item); + } + }); + + dispatch({ + type: actionTypes.UPDATE_FILTERED_LIST, + data: { + vspList, + vlmList + } + }); + } +}; + +export default FilterActionHelper; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterComponents.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterComponents.jsx new file mode 100644 index 0000000000..65ec733fd5 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterComponents.jsx @@ -0,0 +1,145 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react'; +import Input from 'nfvo-components/input/validation/Input.jsx'; +import i18n from 'nfvo-utils/i18n/i18n.js'; +import { itemStatus } from 'sdc-app/common/helpers/ItemsHelperConstants.js'; +import Accordion from 'sdc-ui/lib/react/Accordion.js'; +import Checklist from 'sdc-ui/lib/react/Checklist.js'; +import Checkbox from 'sdc-ui/lib/react/Checkbox.js'; + +export const ItemStatus = ({ data, onDataChanged, byVendorView }) => ( + <Input + type="select" + className="catalog-filter-items-type" + data-test-id="catalog-filter-items-type" + disabled={byVendorView} + value={data.itemStatus} + onChange={e => onDataChanged({ itemStatus: e.target.value }, data)}> + <option key={itemStatus.ACTIVE} value={itemStatus.ACTIVE}> + {i18n('Active Items')} + </option> + <option key={itemStatus.ARCHIVED} value={itemStatus.ARCHIVED}> + {i18n('Archived Items')} + </option> + </Input> +); + +const FilterList = ({ title, items, groupKey, onDataChanged, data }) => { + let onChange = value => { + let obj = {}; + obj[groupKey] = { ...data[groupKey], ...value }; + onDataChanged(obj); + }; + return ( + <Accordion title={title}> + <Checklist items={items} onChange={onChange} /> + </Accordion> + ); +}; + +export const ByVendorView = ({ data, onDataChanged }) => ( + <Checkbox + label={i18n('By Vendor View')} + className="catalog-filter-by-vendor-view" + disabled={data.itemsType === itemStatus.ARCHIVED} + checked={data.byVendorView} + onChange={byVendorView => onDataChanged({ byVendorView }, data)} + data-test-id="filter-by-vendor-view" + value="" + /> +); + +export const EntityType = ({ data, onDataChanged }) => { + const items = [ + { + label: i18n('VSP'), + dataTestId: 'catalog-filter-type-vsp', + value: 'vsp', + checked: data.itemType && data.itemType.vsp + }, + { + label: i18n('VLM'), + dataTestId: 'catalog-ilter-type-vlm', + value: 'vlm', + checked: data.itemType && data.itemType.vlm + } + ]; + return ( + <FilterList + title={i18n('ENTITY TYPE')} + items={items} + onDataChanged={onDataChanged} + data={data} + groupKey="itemType" + /> + ); +}; + +export const Permissions = ({ data, onDataChanged }) => { + const items = [ + { + label: i18n('Owner'), + dataTestId: 'catalog-filter-permission-owner', + value: 'Owner', + checked: data.permission && data.permission.Owner + }, + { + label: i18n('Contributor'), + dataTestId: 'catalog-filter-permission-contributor', + value: 'Contributor', + checked: data.permission && data.permission.Contributor + } + ]; + + return ( + <FilterList + title={i18n('PERMISSIONS')} + items={items} + onDataChanged={onDataChanged} + data={data} + groupKey="permission" + /> + ); +}; + +export const OnboardingProcedure = ({ data, onDataChanged }) => { + const items = [ + { + label: i18n('Network Package'), + dataTestId: 'catalog-filter-procedure-network', + value: 'NetworkPackage', + checked: + data.onboardingMethod && data.onboardingMethod.NetworkPackage + }, + { + label: i18n('Manual'), + dataTestId: 'catalog-filter-procedure-manual', + value: 'Manual', + checked: data.onboardingMethod && data.onboardingMethod.Manual + } + ]; + + return ( + <FilterList + title={i18n('ONBOARDING PROCEDURE')} + items={items} + onDataChanged={onDataChanged} + data={data} + groupKey="onboardingMethod" + /> + ); +}; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js index edfe592877..9dce52dfd6 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterConstants.js @@ -17,10 +17,6 @@ import keyMirror from 'nfvo-utils/KeyMirror.js'; export const actionTypes = keyMirror({ - FILTER_DATA_CHANGED: null + FILTER_DATA_CHANGED: null, + UPDATE_FILTERED_LIST: null }); - -export const itemsType = { - ACTIVE: '1', - ARCHIVED: '2' -}; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterMiddleware.js b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterMiddleware.js new file mode 100644 index 0000000000..8490bfe675 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterMiddleware.js @@ -0,0 +1,32 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import FilterActionHelper from './FilterActionHelper.js'; +import { actionTypes } from './FilterConstants.js'; + +const filterUpdater = store => next => action => { + if (action.type === actionTypes.FILTER_DATA_CHANGED) { + const filter = store.getState().onboard.filter; + + FilterActionHelper.updateFilteredItems(store.dispatch, { + ...filter, + ...action.deltaData + }); + } + return next(action); +}; + +export default filterUpdater; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterReducer.js b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterReducer.js index f1e857498a..28b34753a5 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterReducer.js +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/FilterReducer.js @@ -14,8 +14,19 @@ * limitations under the License. */ import { actionTypes } from './FilterConstants.js'; +import { + itemStatus, + versionStatus +} from 'sdc-app/common/helpers/ItemsHelperConstants.js'; -export default (state = {}, action) => { +const defaultState = { + itemStatus: itemStatus.ACTIVE, + versionStatus: versionStatus.DRAFT, + entityType: {}, + permission: {}, + onboardingMethod: {} +}; +export default (state = defaultState, action) => { switch (action.type) { case actionTypes.FILTER_DATA_CHANGED: return { diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/ItemsReducer.js b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/ItemsReducer.js new file mode 100644 index 0000000000..fa1528d8d9 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/ItemsReducer.js @@ -0,0 +1,24 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { actionTypes } from './FilterConstants.js'; +export default (state = { vspList: [], vlmList: [] }, action) => { + switch (action.type) { + case actionTypes.UPDATE_FILTERED_LIST: + return action.data; + default: + return state; + } +}; |