From f5d14ca5d7f703206006171e2ffd0c55c1f4b1ac Mon Sep 17 00:00:00 2001 From: Ben Styles Date: Tue, 23 Jan 2018 13:11:07 +0000 Subject: [PATCH 1/8] initial commit --- .eslintrc | 3 +- .../ImmutableVirtualizedList.js | 89 +++++++++++++++++-- src/utils.js | 22 +++++ 3 files changed, 104 insertions(+), 10 deletions(-) diff --git a/.eslintrc b/.eslintrc index ef3324d..ff3e4b9 100644 --- a/.eslintrc +++ b/.eslintrc @@ -8,7 +8,8 @@ }, "rules": { - "react-native/no-color-literals": "off" + "react-native/no-color-literals": "off", + "react/no-did-update-set-state": "off" }, "globals": { diff --git a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js index b2fffc2..9d9ec62 100644 --- a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js +++ b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js @@ -26,14 +26,31 @@ class ImmutableVirtualizedList extends PureComponent { immutableData: (props, propName, componentName) => { // Note: It's not enough to simply validate PropTypes.instanceOf(Immutable.Iterable), // because different imports of Immutable.js across files have different class prototypes. - // TODO: Add support for Immutable.Map, etc. - if (Immutable.Map.isMap(props[propName])) { - return new Error(`Invalid prop ${propName} supplied to ${componentName}: Support for Immutable.Map is coming soon. For now, try an Immutable List, Set, or Range.`); - } else if (!utils.isImmutableIterable(props[propName])) { + if (!utils.isImmutableIterable(props[propName])) { return new Error(`Invalid prop ${propName} supplied to ${componentName}: Must be instance of Immutable.Iterable.`); } }, + /** + * Whether to treat immutableData as a sectioned list, + * applying section headers. + */ + treatAsSections: PropTypes.bool, + + /** + * A function that returns some {@link PropTypes.element} + * to be rendered as a section header. It will be passed a List + * or Map of the section's items, and the section key. + */ + renderSectionHeader: PropTypes.func, + + /** + * A function that returns some {@link PropTypes.element} + * to be rendered as a section row. It will be passed the item, + * and the item's key. + */ + renderRow: PropTypes.func, + /** * A plain string, or a function that returns some {@link PropTypes.element} * to be rendered in place of a `VirtualizedList` when there are no items in the list. @@ -58,14 +75,40 @@ class ImmutableVirtualizedList extends PureComponent { static defaultProps = { ...VirtualizedList.defaultProps, - + treatAsSections: false, renderEmptyInList: 'No data.', }; + state = { + flattenedData: this.props.treatAsSections + ? utils.flattenMap(this.props.immutableData) + : null, + } + + componentDidUpdate(prevProps) { + const { treatAsSections, immutableData } = this.props; + if (treatAsSections && prevProps.immutableData !== immutableData) { + const flattenedData = utils.flattenMap(immutableData); + this.setState({ + flattenedData, + stickyHeaderIndices: utils.getStickyHeaderIndices(flattenedData), + }); + } + } + getVirtualizedList() { return this.virtualizedListRef; } + keyExtractor = (item, index) => ( + this.props.treatAsSections + ? this.state.flattenedData + .keySeq() + .skip(index) + .first() + : String(index) + ) + scrollToEnd = (...args) => this.virtualizedListRef && this.virtualizedListRef.scrollToEnd(...args); @@ -81,6 +124,20 @@ class ImmutableVirtualizedList extends PureComponent { recordInteraction = (...args) => this.virtualizedListRef && this.virtualizedListRef.recordInteraction(...args); + renderItem = (info) => ( + this.props.treatAsSections + ? utils.isSectionHeader(info.item) + ? this.renderSectionHeader( + info.item, + this.keyExtractor(info.item, info.index), + ) + : this.renderRow( + info.item, + this.keyExtractor(info.item, info.index), + ) + : this.props.renderItem(info) + ) + renderEmpty() { const { immutableData, renderEmpty, renderEmptyInList, contentContainerStyle, @@ -107,15 +164,29 @@ class ImmutableVirtualizedList extends PureComponent { } render() { - const { immutableData, renderEmpty, renderEmptyInList, ...passThroughProps } = this.props; + const { + immutableData, + treatAsSections, + renderEmpty, + renderEmptyInList, + ...passThroughProps + } = this.props; + + const { flattenedData, stickyHeaderIndices } = this.state; return this.renderEmpty() || ( { this.virtualizedListRef = component; }} - data={immutableData} - getItem={(items, index) => utils.getValueFromKey(index, items)} + data={treatAsSections ? flattenedData : immutableData} + getItem={(items, index) => ( + treatAsSections + ? items.skip(index).first() + : utils.getValueFromKey(index, items) + )} getItemCount={(items) => (items.size || 0)} - keyExtractor={(item, index) => String(index)} + keyExtractor={this.keyExtractor} + stickyHeaderIndices={treatAsSections ? stickyHeaderIndices : null} + renderItem={this.renderItem} {...passThroughProps} /> ); diff --git a/src/utils.js b/src/utils.js index 5da0f6b..d469c69 100644 --- a/src/utils.js +++ b/src/utils.js @@ -71,6 +71,28 @@ const utils = { return immutableData.every((item) => !item || item.isEmpty()); }, + flattenMap(data) { + return data.reduce( + (flattened, section, key) => flattened.set(key, section).merge(section), + Immutable.OrderedMap().asMutable(), + ).asImmutable(); + }, + + isSectionHeader(item) { + return Immutable.Map.isMap(item) || Immutable.List.isList(item) + }, + + getStickyHeaderIndices(items) { + return items + .valueSeq() + .reduce((arr, item, i) => { + if (utils.isSectionHeader(item)) { + arr.push(i); + } + return arr; + }, []); + }, + }; export default utils; From d83fa3c52d47b9834bf24884c0155b576a1b942d Mon Sep 17 00:00:00 2001 From: Ben Styles Date: Tue, 23 Jan 2018 13:40:25 +0000 Subject: [PATCH 2/8] lint fixes --- src/ImmutableVirtualizedList/ImmutableVirtualizedList.js | 1 - src/utils.js | 2 +- 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js index 9d9ec62..5cbec9f 100644 --- a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js +++ b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js @@ -1,4 +1,3 @@ -import Immutable from 'immutable'; import PropTypes from 'prop-types'; import React, { PureComponent } from 'react'; import { Text, VirtualizedList } from 'react-native'; diff --git a/src/utils.js b/src/utils.js index d469c69..f6e4f0c 100644 --- a/src/utils.js +++ b/src/utils.js @@ -79,7 +79,7 @@ const utils = { }, isSectionHeader(item) { - return Immutable.Map.isMap(item) || Immutable.List.isList(item) + return Immutable.Map.isMap(item) || Immutable.List.isList(item); }, getStickyHeaderIndices(items) { From cba8549c4c79919effda285e656aeb24cd398612 Mon Sep 17 00:00:00 2001 From: Ben Styles Date: Wed, 31 Jan 2018 18:47:35 +0000 Subject: [PATCH 3/8] improvements based on comments from @cooperka removed isSectionHeader() in favour of querying stickyHeaderIndices --- .eslintrc | 3 +- .../ImmutableVirtualizedList.js | 49 +++++++------------ src/__tests__/utils.test.js | 8 +++ src/utils.js | 20 +++----- 4 files changed, 35 insertions(+), 45 deletions(-) diff --git a/.eslintrc b/.eslintrc index ff3e4b9..ef3324d 100644 --- a/.eslintrc +++ b/.eslintrc @@ -8,8 +8,7 @@ }, "rules": { - "react-native/no-color-literals": "off", - "react/no-did-update-set-state": "off" + "react-native/no-color-literals": "off" }, "globals": { diff --git a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js index 5cbec9f..5830c8e 100644 --- a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js +++ b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js @@ -30,12 +30,6 @@ class ImmutableVirtualizedList extends PureComponent { } }, - /** - * Whether to treat immutableData as a sectioned list, - * applying section headers. - */ - treatAsSections: PropTypes.bool, - /** * A function that returns some {@link PropTypes.element} * to be rendered as a section header. It will be passed a List @@ -43,13 +37,6 @@ class ImmutableVirtualizedList extends PureComponent { */ renderSectionHeader: PropTypes.func, - /** - * A function that returns some {@link PropTypes.element} - * to be rendered as a section row. It will be passed the item, - * and the item's key. - */ - renderRow: PropTypes.func, - /** * A plain string, or a function that returns some {@link PropTypes.element} * to be rendered in place of a `VirtualizedList` when there are no items in the list. @@ -74,23 +61,24 @@ class ImmutableVirtualizedList extends PureComponent { static defaultProps = { ...VirtualizedList.defaultProps, - treatAsSections: false, renderEmptyInList: 'No data.', }; state = { - flattenedData: this.props.treatAsSections + flattenedData: this.props.renderSectionHeader ? utils.flattenMap(this.props.immutableData) : null, + stickyHeaderIndices: this.props.renderSectionHeader + ? utils.getStickyHeaderIndices(this.props.immutableData) + : null, } - componentDidUpdate(prevProps) { - const { treatAsSections, immutableData } = this.props; - if (treatAsSections && prevProps.immutableData !== immutableData) { - const flattenedData = utils.flattenMap(immutableData); + componentWillReceiveProps(nextProps) { + const { renderSectionHeader, immutableData } = nextProps; + if (renderSectionHeader && this.props.immutableData !== immutableData) { this.setState({ - flattenedData, - stickyHeaderIndices: utils.getStickyHeaderIndices(flattenedData), + flattenedData: utils.flattenMap(immutableData), + stickyHeaderIndices: utils.getStickyHeaderIndices(immutableData), }); } } @@ -100,7 +88,7 @@ class ImmutableVirtualizedList extends PureComponent { } keyExtractor = (item, index) => ( - this.props.treatAsSections + this.props.renderSectionHeader ? this.state.flattenedData .keySeq() .skip(index) @@ -124,13 +112,13 @@ class ImmutableVirtualizedList extends PureComponent { this.virtualizedListRef && this.virtualizedListRef.recordInteraction(...args); renderItem = (info) => ( - this.props.treatAsSections - ? utils.isSectionHeader(info.item) - ? this.renderSectionHeader( + this.props.renderSectionHeader + ? this.state.stickyHeaderIndices.includes(info.item) + ? this.props.renderSectionHeader( info.item, this.keyExtractor(info.item, info.index), ) - : this.renderRow( + : this.props.renderItem( info.item, this.keyExtractor(info.item, info.index), ) @@ -165,9 +153,10 @@ class ImmutableVirtualizedList extends PureComponent { render() { const { immutableData, - treatAsSections, renderEmpty, renderEmptyInList, + renderSectionHeader, + renderItem, ...passThroughProps } = this.props; @@ -176,15 +165,15 @@ class ImmutableVirtualizedList extends PureComponent { return this.renderEmpty() || ( { this.virtualizedListRef = component; }} - data={treatAsSections ? flattenedData : immutableData} + data={renderSectionHeader ? flattenedData : immutableData} getItem={(items, index) => ( - treatAsSections + renderSectionHeader ? items.skip(index).first() : utils.getValueFromKey(index, items) )} getItemCount={(items) => (items.size || 0)} keyExtractor={this.keyExtractor} - stickyHeaderIndices={treatAsSections ? stickyHeaderIndices : null} + stickyHeaderIndices={renderSectionHeader ? stickyHeaderIndices : null} renderItem={this.renderItem} {...passThroughProps} /> diff --git a/src/__tests__/utils.test.js b/src/__tests__/utils.test.js index 7d895ed..23ee5c5 100644 --- a/src/__tests__/utils.test.js +++ b/src/__tests__/utils.test.js @@ -30,4 +30,12 @@ describe('Utils', () => { const isEmpty = utils.isEmptyListView(data.EMPTY_DATA, true); expect(isEmpty).toBe(true); }); + + describe('getStickyHeaderIndices', () => { + it('returns an array of the correct size', () => { + expect( + utils.getStickyHeaderIndices(data.MAP_DATA_MAP_ROWS).length, + ).toBe(data.MAP_DATA_MAP_ROWS.size); + }); + }); }); diff --git a/src/utils.js b/src/utils.js index f6e4f0c..f210d35 100644 --- a/src/utils.js +++ b/src/utils.js @@ -78,19 +78,13 @@ const utils = { ).asImmutable(); }, - isSectionHeader(item) { - return Immutable.Map.isMap(item) || Immutable.List.isList(item); - }, - - getStickyHeaderIndices(items) { - return items - .valueSeq() - .reduce((arr, item, i) => { - if (utils.isSectionHeader(item)) { - arr.push(i); - } - return arr; - }, []); + getStickyHeaderIndices(immutableData) { + const indices = immutableData.reduce((arr, section) => { + arr.push(arr[arr.length - 1] + section.size); + return arr; + }, [0]); + indices.pop(); + return indices; }, }; From 39e81fdf432fa5a8127f2669564207801f4b6593 Mon Sep 17 00:00:00 2001 From: Kevin Cooper Date: Thu, 8 Feb 2018 09:55:53 -0500 Subject: [PATCH 4/8] Code style tweaks --- .../ImmutableVirtualizedList.js | 59 ++++++++++--------- src/utils.js | 18 ++++-- 2 files changed, 46 insertions(+), 31 deletions(-) diff --git a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js index 5830c8e..592569f 100644 --- a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js +++ b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js @@ -61,24 +61,27 @@ class ImmutableVirtualizedList extends PureComponent { static defaultProps = { ...VirtualizedList.defaultProps, + renderEmptyInList: 'No data.', }; state = { flattenedData: this.props.renderSectionHeader ? utils.flattenMap(this.props.immutableData) - : null, + : undefined, stickyHeaderIndices: this.props.renderSectionHeader ? utils.getStickyHeaderIndices(this.props.immutableData) - : null, - } + : undefined, + }; componentWillReceiveProps(nextProps) { - const { renderSectionHeader, immutableData } = nextProps; - if (renderSectionHeader && this.props.immutableData !== immutableData) { + const { immutableData } = this.props; + const { nextRenderSectionHeader, nextImmutableData } = nextProps; + + if (nextRenderSectionHeader && immutableData !== nextImmutableData) { this.setState({ - flattenedData: utils.flattenMap(immutableData), - stickyHeaderIndices: utils.getStickyHeaderIndices(immutableData), + flattenedData: utils.flattenMap(nextImmutableData), + stickyHeaderIndices: utils.getStickyHeaderIndices(nextImmutableData), }); } } @@ -87,14 +90,16 @@ class ImmutableVirtualizedList extends PureComponent { return this.virtualizedListRef; } - keyExtractor = (item, index) => ( - this.props.renderSectionHeader - ? this.state.flattenedData + keyExtractor = (item, index) => { + if (this.props.renderSectionHeader) { + return this.state.flattenedData .keySeq() .skip(index) - .first() - : String(index) - ) + .first(); + } + + return String(index); + }; scrollToEnd = (...args) => this.virtualizedListRef && this.virtualizedListRef.scrollToEnd(...args); @@ -111,19 +116,19 @@ class ImmutableVirtualizedList extends PureComponent { recordInteraction = (...args) => this.virtualizedListRef && this.virtualizedListRef.recordInteraction(...args); - renderItem = (info) => ( - this.props.renderSectionHeader - ? this.state.stickyHeaderIndices.includes(info.item) - ? this.props.renderSectionHeader( - info.item, - this.keyExtractor(info.item, info.index), - ) - : this.props.renderItem( - info.item, - this.keyExtractor(info.item, info.index), - ) - : this.props.renderItem(info) - ) + renderItem = (info) => { + const { renderSectionHeader, renderItem } = this.props; + + if (renderSectionHeader) { + const renderMethod = this.state.stickyHeaderIndices.includes(info.item) + ? renderSectionHeader + : renderItem; + + return renderMethod(info.item, this.keyExtractor(info.item, info.index)); + } + + return renderItem(info); + }; renderEmpty() { const { @@ -173,7 +178,7 @@ class ImmutableVirtualizedList extends PureComponent { )} getItemCount={(items) => (items.size || 0)} keyExtractor={this.keyExtractor} - stickyHeaderIndices={renderSectionHeader ? stickyHeaderIndices : null} + stickyHeaderIndices={renderSectionHeader ? stickyHeaderIndices : undefined} renderItem={this.renderItem} {...passThroughProps} /> diff --git a/src/utils.js b/src/utils.js index f210d35..502f44d 100644 --- a/src/utils.js +++ b/src/utils.js @@ -71,6 +71,9 @@ const utils = { return immutableData.every((item) => !item || item.isEmpty()); }, + /** + * @returns {Immutable.OrderedMap} A new Immutable Map with its section headers flattened. + */ flattenMap(data) { return data.reduce( (flattened, section, key) => flattened.set(key, section).merge(section), @@ -78,12 +81,19 @@ const utils = { ).asImmutable(); }, + /** + * @returns [Array] An array of all indices which should be sticky section headers. + */ getStickyHeaderIndices(immutableData) { - const indices = immutableData.reduce((arr, section) => { - arr.push(arr[arr.length - 1] + section.size); - return arr; - }, [0]); + const indicesReducer = (indices, section) => { + const lastIndex = indices[indices.length - 1]; + indices.push(lastIndex + section.size); + return indices; + }; + + const indices = immutableData.reduce(indicesReducer, [0]); indices.pop(); + return indices; }, From 073c26237dbdd4b3c38a68b321dc918bf4624aa5 Mon Sep 17 00:00:00 2001 From: Ben Styles Date: Sat, 10 Feb 2018 11:07:03 +0000 Subject: [PATCH 5/8] handle Map of Lists, add tests --- .../ImmutableVirtualizedList.test.js | 42 +++ .../ImmutableVirtualizedList.test.js.snap | 254 ++++++++++++++++++ src/__tests__/utils.test.js | 10 + src/utils.js | 9 +- 4 files changed, 313 insertions(+), 2 deletions(-) diff --git a/src/ImmutableVirtualizedList/__tests__/ImmutableVirtualizedList.test.js b/src/ImmutableVirtualizedList/__tests__/ImmutableVirtualizedList.test.js index ad3351d..cabb1dc 100644 --- a/src/ImmutableVirtualizedList/__tests__/ImmutableVirtualizedList.test.js +++ b/src/ImmutableVirtualizedList/__tests__/ImmutableVirtualizedList.test.js @@ -122,3 +122,45 @@ describe('ImmutableVirtualizedList with renderEmptyInList', () => { expect(tree.toJSON()).toMatchSnapshot(); }); }); + +describe('ImmutableVirtualizedList with section headers', () => { + describe('Map of Maps', () => { + const tree = renderer.create( + , + ); + + it('renders basic Map of Maps', () => { + expect(tree.toJSON()).toMatchSnapshot(); + }); + + it('flattens the data as expected', () => { + const { flattenedData } = tree.getInstance().state; + expect(flattenedData).toBeDefined(); + expect(flattenedData.size).toBe(4); + }); + }); + + describe('Map of Lists', () => { + const tree = renderer.create( + , + ); + + it('renders basic Map of Lists', () => { + expect(tree.toJSON()).toMatchSnapshot(); + }); + + it('flattens the data as expected', () => { + const { flattenedData } = tree.getInstance().state; + expect(flattenedData).toBeDefined(); + expect(flattenedData.size).toBe(9); + }); + }); +}); diff --git a/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap b/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap index e7cd66b..3b1d2f1 100644 --- a/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap +++ b/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap @@ -585,3 +585,257 @@ exports[`ImmutableVirtualizedList with renderEmptyInList renders normally when t `; + +exports[`ImmutableVirtualizedList with section headers Map of Lists renders basic Map of Lists 1`] = ` + + + + + ["m","a","p"] + + + + + "m" + + + + + "a" + + + + + "p" + + + + + ["foo"] + + + + + "foo" + + + + + [] + + + + + ["bar"] + + + + + "bar" + + + + +`; + +exports[`ImmutableVirtualizedList with section headers Map of Maps renders basic Map of Maps 1`] = ` + + + + + {"row1":"data 1","row2":"data 2"} + + + + + "data 1" + + + + + "data 2" + + + + + {} + + + + +`; diff --git a/src/__tests__/utils.test.js b/src/__tests__/utils.test.js index 23ee5c5..664d09e 100644 --- a/src/__tests__/utils.test.js +++ b/src/__tests__/utils.test.js @@ -37,5 +37,15 @@ describe('Utils', () => { utils.getStickyHeaderIndices(data.MAP_DATA_MAP_ROWS).length, ).toBe(data.MAP_DATA_MAP_ROWS.size); }); + + it('returns an array of header indices', () => { + expect( + utils.getStickyHeaderIndices(data.MAP_DATA_MAP_ROWS), + ).toEqual([0, 3]); + + expect( + utils.getStickyHeaderIndices(data.MAP_DATA_LIST_ROWS), + ).toEqual([0, 4, 6, 7]); + }); }); }); diff --git a/src/utils.js b/src/utils.js index 502f44d..bfb5bc0 100644 --- a/src/utils.js +++ b/src/utils.js @@ -76,7 +76,12 @@ const utils = { */ flattenMap(data) { return data.reduce( - (flattened, section, key) => flattened.set(key, section).merge(section), + (flattened, section, key) => + flattened.set(key, section).merge( + Immutable.Map.isMap(section) + ? section + : section.toMap().mapKeys((i) => `${key}_${i}`), + ), Immutable.OrderedMap().asMutable(), ).asImmutable(); }, @@ -87,7 +92,7 @@ const utils = { getStickyHeaderIndices(immutableData) { const indicesReducer = (indices, section) => { const lastIndex = indices[indices.length - 1]; - indices.push(lastIndex + section.size); + indices.push(lastIndex + section.size + 1); return indices; }; From 639403314db09aa175b990a879a9a5eece7e631d Mon Sep 17 00:00:00 2001 From: Ben Styles Date: Sun, 18 Feb 2018 17:59:06 +0000 Subject: [PATCH 6/8] pass whole `info` object to `renderItem()` and `renderSectionHeader()` as we do for flat lists --- .../ImmutableVirtualizedList.js | 2 +- .../ImmutableVirtualizedList.test.js.snap | 26 +++++++++---------- 2 files changed, 14 insertions(+), 14 deletions(-) diff --git a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js index 592569f..5c41730 100644 --- a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js +++ b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js @@ -124,7 +124,7 @@ class ImmutableVirtualizedList extends PureComponent { ? renderSectionHeader : renderItem; - return renderMethod(info.item, this.keyExtractor(info.item, info.index)); + return renderMethod(info, this.keyExtractor(info.item, info.index)); } return renderItem(info); diff --git a/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap b/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap index 3b1d2f1..02d2c1d 100644 --- a/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap +++ b/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap @@ -646,7 +646,7 @@ exports[`ImmutableVirtualizedList with section headers Map of Lists renders basi allowFontScaling={true} ellipsizeMode="tail" > - ["m","a","p"] + {"item":["m","a","p"],"index":0,"separators":{}} - "m" + {"item":"m","index":1,"separators":{}} - "a" + {"item":"a","index":2,"separators":{}} - "p" + {"item":"p","index":3,"separators":{}} - ["foo"] + {"item":["foo"],"index":4,"separators":{}} - "foo" + {"item":"foo","index":5,"separators":{}} - [] + {"item":[],"index":6,"separators":{}} - ["bar"] + {"item":["bar"],"index":7,"separators":{}} - "bar" + {"item":"bar","index":8,"separators":{}} @@ -797,7 +797,7 @@ exports[`ImmutableVirtualizedList with section headers Map of Maps renders basic allowFontScaling={true} ellipsizeMode="tail" > - {"row1":"data 1","row2":"data 2"} + {"item":{"row1":"data 1","row2":"data 2"},"index":0,"separators":{}} - "data 1" + {"item":"data 1","index":1,"separators":{}} - "data 2" + {"item":"data 2","index":2,"separators":{}} - {} + {"item":{},"index":3,"separators":{}} From 53ac8fb0d94b5e3679cecddce980d323cdd54239 Mon Sep 17 00:00:00 2001 From: Ben Styles Date: Sun, 18 Feb 2018 19:49:23 +0000 Subject: [PATCH 7/8] fix renderSectionHeader branch condition --- src/ImmutableVirtualizedList/ImmutableVirtualizedList.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js index 5c41730..961e5e0 100644 --- a/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js +++ b/src/ImmutableVirtualizedList/ImmutableVirtualizedList.js @@ -120,7 +120,7 @@ class ImmutableVirtualizedList extends PureComponent { const { renderSectionHeader, renderItem } = this.props; if (renderSectionHeader) { - const renderMethod = this.state.stickyHeaderIndices.includes(info.item) + const renderMethod = this.state.stickyHeaderIndices.includes(info.index) ? renderSectionHeader : renderItem; From 090b2d4ff13cf1a55bda0fdef0526381504c42d4 Mon Sep 17 00:00:00 2001 From: Ben Styles Date: Sun, 18 Feb 2018 19:55:01 +0000 Subject: [PATCH 8/8] update sectionHeader test snapshots --- .../ImmutableVirtualizedList.test.js.snap | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap b/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap index 02d2c1d..5492b4d 100644 --- a/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap +++ b/src/ImmutableVirtualizedList/__tests__/__snapshots__/ImmutableVirtualizedList.test.js.snap @@ -645,8 +645,9 @@ exports[`ImmutableVirtualizedList with section headers Map of Lists renders basi accessible={true} allowFontScaling={true} ellipsizeMode="tail" + header={true} > - {"item":["m","a","p"],"index":0,"separators":{}} + first (undefined items) - {"item":["foo"],"index":4,"separators":{}} + second (undefined items) - {"item":[],"index":6,"separators":{}} + third (undefined items) - {"item":["bar"],"index":7,"separators":{}} + fourth (undefined items) - {"item":{"row1":"data 1","row2":"data 2"},"index":0,"separators":{}} + first (undefined items) - {"item":{},"index":3,"separators":{}} + second (undefined items)