diff --git a/packages/rn-tester/js/examples/FlatList/FlatListExample.js b/packages/rn-tester/js/examples/FlatList/FlatList-basic.js similarity index 94% rename from packages/rn-tester/js/examples/FlatList/FlatListExample.js rename to packages/rn-tester/js/examples/FlatList/FlatList-basic.js index 93d7eb2de4b..7d55e4ea6d4 100644 --- a/packages/rn-tester/js/examples/FlatList/FlatListExample.js +++ b/packages/rn-tester/js/examples/FlatList/FlatList-basic.js @@ -10,12 +10,19 @@ 'use strict'; -const RNTesterPage = require('../../components/RNTesterPage'); -const React = require('react'); - -const infoLog = require('react-native/Libraries/Utilities/infoLog'); - -const { +import type {RNTesterModuleExample} from '../../types/RNTesterTypes'; +import * as React from 'react'; +import { + Alert, + Animated, + Platform, + StyleSheet, + TextInput, + View, +} from 'react-native'; +import RNTesterPage from '../../components/RNTesterPage'; +import infoLog from 'react-native/Libraries/Utilities/infoLog'; +import { FooterComponent, HeaderComponent, ItemComponent, @@ -28,15 +35,7 @@ const { getItemLayout, pressItem, renderSmallSwitchOption, -} = require('../../components/ListExampleShared'); -const { - Alert, - Animated, - Platform, - StyleSheet, - TextInput, - View, -} = require('react-native'); +} from '../../components/ListExampleShared'; import type {Item} from '../../components/ListExampleShared'; @@ -340,15 +339,9 @@ const styles = StyleSheet.create({ }, }); -exports.title = 'FlatList'; -exports.category = 'ListView'; -exports.documentationURL = 'https://reactnative.dev/docs/flatlist'; -exports.description = 'Performant, scrollable list of data.'; -exports.examples = [ - { - title: 'Simple list of items', - render: function(): React.Element { - return ; - }, - }, -]; +export default ({ + title: 'Basic', + name: 'basic', + description: 'Simple list of items', + render: () => , +}: RNTesterModuleExample); diff --git a/packages/rn-tester/js/examples/FlatList/FlatListExampleIndex.js b/packages/rn-tester/js/examples/FlatList/FlatListExampleIndex.js new file mode 100644 index 00000000000..48681613aa4 --- /dev/null +++ b/packages/rn-tester/js/examples/FlatList/FlatListExampleIndex.js @@ -0,0 +1,22 @@ +/** + * 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 strict-local + * @format + */ + +import type {RNTesterModule} from '../../types/RNTesterTypes'; +import BasicExample from './FlatList-basic'; + +export default ({ + framework: 'React', + title: 'FlatList', + category: 'ListView', + documentationURL: 'https://reactnative.dev/docs/flatlist', + description: 'Performant, scrollable list of data.', + showIndividualExamples: true, + examples: [BasicExample], +}: RNTesterModule); diff --git a/packages/rn-tester/js/utils/RNTesterList.android.js b/packages/rn-tester/js/utils/RNTesterList.android.js index f528ca65eb4..a9e51dd8143 100644 --- a/packages/rn-tester/js/utils/RNTesterList.android.js +++ b/packages/rn-tester/js/utils/RNTesterList.android.js @@ -24,9 +24,10 @@ const Components: Array = [ module: require('../examples/Button/ButtonExample'), }, { - key: 'FlatListExample', + key: 'FlatListExampleIndex', + module: require('../examples/FlatList/FlatListExampleIndex').default, category: 'ListView', - module: require('../examples/FlatList/FlatListExample'), + supportsTVOS: true, }, { key: 'FlatList-withSeparators', diff --git a/packages/rn-tester/js/utils/RNTesterList.ios.js b/packages/rn-tester/js/utils/RNTesterList.ios.js index 6eec793053f..a2d868e3cc6 100644 --- a/packages/rn-tester/js/utils/RNTesterList.ios.js +++ b/packages/rn-tester/js/utils/RNTesterList.ios.js @@ -26,8 +26,8 @@ const Components: Array = [ supportsTVOS: true, }, { - key: 'FlatListExample', - module: require('../examples/FlatList/FlatListExample'), + key: 'FlatListExampleIndex', + module: require('../examples/FlatList/FlatListExampleIndex').default, category: 'ListView', supportsTVOS: true, },