Create FlatListExampleIndex

Summary: Changelog: [Internal] Create FlatList example index for 3 levels of navigation

Reviewed By: charlesbdudley

Differential Revision: D30816721

fbshipit-source-id: a3bdae7f385bab3695a9c2dc6fe3148ebdbd12b4

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<typeof FlatListExample> {
-      return <FlatListExample />;
-    },
-  },
-];
+export default ({
+  title: 'Basic',
+  name: 'basic',
+  description: 'Simple list of items',
+  render: () => <FlatListExample />,
+}: RNTesterModuleExample);

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);

packages/rn-tester/js/utils/RNTesterList.android.js

@@ -24,9 +24,10 @@ const Components: Array<RNTesterModuleInfo> = [
     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',

packages/rn-tester/js/utils/RNTesterList.ios.js

@@ -26,8 +26,8 @@ const Components: Array<RNTesterModuleInfo> = [
     supportsTVOS: true,
   },
   {
-    key: 'FlatListExample',
-    module: require('../examples/FlatList/FlatListExample'),
+    key: 'FlatListExampleIndex',
+    module: require('../examples/FlatList/FlatListExampleIndex').default,
     category: 'ListView',
     supportsTVOS: true,
   },