diff --git a/packages/patternfly-3/patternfly-react/src/components/DualListSelector/DualList.js b/packages/patternfly-3/patternfly-react/src/components/DualListSelector/DualList.js index 24d5e272783..fc8eaab65a8 100644 --- a/packages/patternfly-3/patternfly-react/src/components/DualListSelector/DualList.js +++ b/packages/patternfly-3/patternfly-react/src/components/DualListSelector/DualList.js @@ -186,22 +186,31 @@ class DualList extends React.Component { if (sideItemsWithRemainChildren.length > 0) { sideItems.push(...sideItemsWithRemainChildren); } - sideItems = arrangeArray({ ...sideState, items: sideItems }); - otherSideItems = arrangeArray({ ...otherSideState, items: otherSideItems }); - const updatedSideState = { ...sideState, - items: sideItems, - selectCount: 0 + selectCount: 0, + isMainChecked: false }; const updatedOtherSideState = { ...otherSideState, - items: otherSideItems, - selectCount: sideState.selectCount + otherSideState.selectCount + selectCount: 0, + isMainChecked: false }; - this.props.onChange({ [side]: updatedSideState, [otherSide]: updatedOtherSideState }); + sideItems = arrangeArray({ ...updatedSideState, items: sideItems }); + otherSideItems = arrangeArray({ ...updatedOtherSideState, items: otherSideItems, resetAllSelected: true }); + + this.props.onChange({ + [side]: { + ...updatedSideState, + items: sideItems + }, + [otherSide]: { + ...updatedOtherSideState, + items: otherSideItems + } + }); }; leftArrowClick = () => { diff --git a/packages/patternfly-3/patternfly-react/src/components/DualListSelector/DualList.test.js b/packages/patternfly-3/patternfly-react/src/components/DualListSelector/DualList.test.js index 9339ab92378..fe2145c1e0d 100644 --- a/packages/patternfly-3/patternfly-react/src/components/DualListSelector/DualList.test.js +++ b/packages/patternfly-3/patternfly-react/src/components/DualListSelector/DualList.test.js @@ -99,8 +99,8 @@ test('move child items works properly', () => { .find('Icon') .first(); rightArrow.simulate('click'); - expect(component.state().right.items[0].checked).toBeTruthy(); - expect(component.state().right.items[0].children[0].checked).toBeTruthy(); + expect(component.state().right.items[0].checked).toBeFalsy(); + expect(component.state().right.items[0].children[0].checked).toBeFalsy(); }); test('dual-list filter works ', () => { @@ -147,7 +147,6 @@ test('transitions between selectors works!', () => { .first(); const arrows = component.find('DualListArrows').find('Icon'); const rightArrow = arrows.at(0); - const leftArrow = arrows.at(1); const { 'data-side': side, 'data-position': position } = firstItemCheckbox.props(); const mockedEvent = { target: { checked: true, dataset: { position, side } } }; const getState = () => component.state(); @@ -157,9 +156,6 @@ test('transitions between selectors works!', () => { rightArrow.simulate('click'); expect(getState().left.items).toHaveLength(1); expect(getState().right.items).toHaveLength(2); - leftArrow.simulate('click'); - expect(getState().left.items).toHaveLength(2); - expect(getState().right.items).toHaveLength(1); }); test('sorting works ! ', () => { diff --git a/packages/patternfly-3/patternfly-react/src/components/DualListSelector/helpers.js b/packages/patternfly-3/patternfly-react/src/components/DualListSelector/helpers.js index 89db34d982e..cb1ae97d52b 100644 --- a/packages/patternfly-3/patternfly-react/src/components/DualListSelector/helpers.js +++ b/packages/patternfly-3/patternfly-react/src/components/DualListSelector/helpers.js @@ -38,14 +38,28 @@ export const makeAllItemsVisible = list => export const sortItems = (items, sortFactor = 'label') => items.sort((a, b) => (a[sortFactor].toLowerCase() > b[sortFactor].toLowerCase() ? 1 : -1)); -export const arrangeArray = ({ items, sortBy, isSortAsc = true, isMainChecked = false }) => { +export const shouldItemBeChecked = (item, isMainChecked, resetAllSelected) => { + let checked = item.checked || false; + const isItemEditable = !item.disabled || !item.hidden; + if (!isItemEditable) { + return checked; + } + if (resetAllSelected) { + checked = false; + } else if (isMainChecked) { + checked = isMainChecked; + } + return checked; +}; + +export const arrangeArray = ({ items, sortBy, isSortAsc = true, isMainChecked = false, resetAllSelected = false }) => { // sort the items let itemsCopy = sortItems(items, sortBy).map((item, index) => { // add position to the item and update if the main checkbox is initialy checked. const modifiedItem = { ...item, position: index, - checked: item.checked || isMainChecked + checked: shouldItemBeChecked(item, isMainChecked, resetAllSelected) }; if (itemHasChildren(item)) { // sort the children array and add a position, parentPosition and update check state. @@ -53,7 +67,7 @@ export const arrangeArray = ({ items, sortBy, isSortAsc = true, isMainChecked = ...child, position: childIndex, parentPosition: index, - checked: child.checked || isMainChecked + checked: shouldItemBeChecked(child, isMainChecked, resetAllSelected) })); } return modifiedItem;