diff --git a/Libraries/Lists/FlatList.js b/Libraries/Lists/FlatList.js index 2b89e5cb11d9ed..a8f0ac6fb8ff60 100644 --- a/Libraries/Lists/FlatList.js +++ b/Libraries/Lists/FlatList.js @@ -10,11 +10,9 @@ 'use strict'; const deepDiffer = require('deepDiffer'); -const MetroListView = require('MetroListView'); // Used as a fallback legacy option const React = require('React'); const View = require('View'); const VirtualizedList = require('VirtualizedList'); -const ListView = require('ListView'); const StyleSheet = require('StyleSheet'); const invariant = require('fbjs/lib/invariant'); @@ -359,7 +357,6 @@ class FlatList extends React.PureComponent, void> { viewPosition?: number, }) { if (this._listRef) { - // $FlowFixMe Found when typing ListView this._listRef.scrollToIndex(params); } } @@ -376,7 +373,6 @@ class FlatList extends React.PureComponent, void> { viewPosition?: number, }) { if (this._listRef) { - // $FlowFixMe Found when typing ListView this._listRef.scrollToItem(params); } } @@ -388,7 +384,6 @@ class FlatList extends React.PureComponent, void> { */ scrollToOffset(params: {animated?: ?boolean, offset: number}) { if (this._listRef) { - // $FlowFixMe Found when typing ListView this._listRef.scrollToOffset(params); } } @@ -400,7 +395,6 @@ class FlatList extends React.PureComponent, void> { */ recordInteraction() { if (this._listRef) { - // $FlowFixMe Found when typing ListView this._listRef.recordInteraction(); } } @@ -412,7 +406,6 @@ class FlatList extends React.PureComponent, void> { */ flashScrollIndicators() { if (this._listRef) { - // $FlowFixMe Found when typing ListView this._listRef.flashScrollIndicators(); } } @@ -422,14 +415,12 @@ class FlatList extends React.PureComponent, void> { */ getScrollResponder() { if (this._listRef) { - // $FlowFixMe Found when typing ListView return this._listRef.getScrollResponder(); } } getScrollableNode() { if (this._listRef) { - // $FlowFixMe Found when typing ListView return this._listRef.getScrollableNode(); } } @@ -488,8 +479,7 @@ class FlatList extends React.PureComponent, void> { this._checkProps(this.props); } - _hasWarnedLegacy = false; - _listRef: null | VirtualizedList | ListView | MetroListView; + _listRef: ?React.ElementRef; _virtualizedListPairs: Array = []; _captureRef = ref => { @@ -501,7 +491,6 @@ class FlatList extends React.PureComponent, void> { getItem, getItemCount, horizontal, - legacyImplementation, numColumns, columnWrapperStyle, onViewableItemsChanged, @@ -519,22 +508,6 @@ class FlatList extends React.PureComponent, void> { 'columnWrapperStyle not supported for single column lists', ); } - if (legacyImplementation) { - invariant( - numColumns === 1, - 'Legacy list does not support multiple columns.', - ); - // Warning: may not have full feature parity and is meant more for debugging and performance - // comparison. - if (!this._hasWarnedLegacy) { - console.warn( - 'FlatList: legacyImplementation is deprecated and will be removed in a ' + - 'future release - some features not supported and performance may suffer. ' + - 'Please migrate to the default implementation.', - ); - this._hasWarnedLegacy = true; - } - } invariant( !(onViewableItemsChanged && viewabilityConfigCallbackPairs), 'FlatList does not support setting both onViewableItemsChanged and ' + @@ -648,27 +621,17 @@ class FlatList extends React.PureComponent, void> { }; render() { - if (this.props.legacyImplementation) { - return ( - - ); - } else { - return ( - - ); - } + return ( + + ); } } diff --git a/Libraries/Lists/MetroListView.js b/Libraries/Lists/MetroListView.js deleted file mode 100644 index 0da36d072ca83e..00000000000000 --- a/Libraries/Lists/MetroListView.js +++ /dev/null @@ -1,202 +0,0 @@ -/** - * Copyright (c) Facebook, Inc. and its affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * @flow - * @format - */ -'use strict'; - -const ListView = require('ListView'); -const React = require('React'); -const RefreshControl = require('RefreshControl'); -const ScrollView = require('ScrollView'); - -const invariant = require('fbjs/lib/invariant'); - -type Item = any; - -type NormalProps = { - FooterComponent?: React.ComponentType<*>, - renderItem: (info: Object) => ?React.Element, - /* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This comment - * suppresses an error when upgrading Flow's support for React. To see the - * error delete this comment and run Flow. */ - renderSectionHeader?: ({section: Object}) => ?React.Element, - SeparatorComponent?: ?React.ComponentType<*>, // not supported yet - - // Provide either `items` or `sections` - items?: ?Array, // By default, an Item is assumed to be {key: string} - sections?: ?Array<{key: string, data: Array}>, - - /** - * If provided, a standard RefreshControl will be added for "Pull to Refresh" functionality. Make - * sure to also set the `refreshing` prop correctly. - */ - onRefresh?: ?Function, - /** - * Set this true while waiting for new data from a refresh. - */ - refreshing?: boolean, - /** - * If true, renders items next to each other horizontally instead of stacked vertically. - */ - horizontal?: ?boolean, -}; -type DefaultProps = { - keyExtractor: (item: Item, index: number) => string, -}; -type Props = NormalProps & DefaultProps; - -/** - * This is just a wrapper around the legacy ListView that matches the new API of FlatList, but with - * some section support tacked on. It is recommended to just use FlatList directly, this component - * is mostly for debugging and performance comparison. - */ -class MetroListView extends React.Component { - scrollToEnd(params?: ?{animated?: ?boolean}) { - throw new Error('scrollToEnd not supported in legacy ListView.'); - } - scrollToIndex(params: { - animated?: ?boolean, - index: number, - viewPosition?: number, - }) { - throw new Error('scrollToIndex not supported in legacy ListView.'); - } - scrollToItem(params: { - animated?: ?boolean, - item: Item, - viewPosition?: number, - }) { - throw new Error('scrollToItem not supported in legacy ListView.'); - } - scrollToLocation(params: { - animated?: ?boolean, - itemIndex: number, - sectionIndex: number, - viewOffset?: number, - viewPosition?: number, - }) { - throw new Error('scrollToLocation not supported in legacy ListView.'); - } - scrollToOffset(params: {animated?: ?boolean, offset: number}) { - const {animated, offset} = params; - // $FlowFixMe Invalid prop usage - this._listRef.scrollTo( - this.props.horizontal ? {x: offset, animated} : {y: offset, animated}, - ); - } - getListRef() { - return this._listRef; - } - setNativeProps(props: Object) { - if (this._listRef) { - this._listRef.setNativeProps(props); - } - } - static defaultProps: DefaultProps = { - keyExtractor: (item, index) => item.key || String(index), - renderScrollComponent: (props: Props) => { - if (props.onRefresh) { - return ( - // $FlowFixMe Invalid prop usage - =0.53.0 site=react_native_fb,react_native_oss) - * This comment suppresses an error when upgrading Flow's support - * for React. To see the error delete this comment and run Flow. - */ - - } - /> - ); - } else { - // $FlowFixMe Invalid prop usage - return ; - } - }, - }; - state = this._computeState(this.props, { - ds: new ListView.DataSource({ - rowHasChanged: (itemA, itemB) => true, - sectionHeaderHasChanged: () => true, - getSectionHeaderData: (dataBlob, sectionID) => - this.state.sectionHeaderData[sectionID], - }), - sectionHeaderData: {}, - }); - UNSAFE_componentWillReceiveProps(newProps: Props) { - this.setState(state => this._computeState(newProps, state)); - } - render() { - return ( - // $FlowFixMe Found when typing ListView - - ); - } - _listRef: ?ListView; - _captureRef = ref => { - this._listRef = ref; - }; - _computeState(props: Props, state) { - const sectionHeaderData = {}; - if (props.sections) { - invariant(!props.items, 'Cannot have both sections and items props.'); - const sections = {}; - props.sections.forEach((sectionIn, ii) => { - const sectionID = 's' + ii; - sections[sectionID] = sectionIn.data; - sectionHeaderData[sectionID] = sectionIn; - }); - return { - ds: state.ds.cloneWithRowsAndSections(sections), - sectionHeaderData, - }; - } else { - invariant(!props.sections, 'Cannot have both sections and items props.'); - return { - // $FlowFixMe Found when typing ListView - ds: state.ds.cloneWithRows(props.items), - sectionHeaderData, - }; - } - } - /* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This comment - * suppresses an error when upgrading Flow's support for React. To see the - * error delete this comment and run Flow. */ - _renderFooter = () => ; - _renderRow = (item, sectionID, rowID, highlightRow) => { - return this.props.renderItem({item, index: rowID}); - }; - _renderSectionHeader = (section, sectionID) => { - const {renderSectionHeader} = this.props; - invariant( - renderSectionHeader, - 'Must provide renderSectionHeader with sections prop', - ); - return renderSectionHeader({section}); - }; - _renderSeparator = (sID, rID) => ( - /* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This comment - * suppresses an error when upgrading Flow's support for React. To see the - * error delete this comment and run Flow. */ - - ); -} - -module.exports = MetroListView;