1import Constants from 'expo-constants'; 2import React from 'react'; 3import { FlatList, StyleSheet } from 'react-native'; 4 5import DoneText from './DoneText'; 6import SuiteResult from './SuiteResult'; 7 8export default function Suites({ suites, done, numFailed, results }) { 9 const ref = React.useRef(null); 10 11 const renderItem = ({ item }) => <SuiteResult r={item} depth={0} />; 12 13 const keyExtractor = (item) => item.get('result').get('id'); 14 15 const scrollToEnd = React.useMemo( 16 () => () => { 17 if (ref.current) ref.current.scrollToEnd({ animated: false }); 18 }, 19 [ref] 20 ); 21 22 React.useEffect(() => { 23 if (done && ref.current) { 24 scrollToEnd(); 25 } 26 }, [ref, done]); 27 28 const ListFooterComponent = () => ( 29 <DoneText done={done} numFailed={numFailed} results={results} /> 30 ); 31 32 return ( 33 <FlatList 34 ref={ref} 35 style={styles.list} 36 contentContainerStyle={styles.contentContainerStyle} 37 data={[...suites]} 38 keyExtractor={keyExtractor} 39 renderItem={renderItem} 40 ListFooterComponent={ListFooterComponent} 41 onContentSizeChange={scrollToEnd} 42 onLayout={scrollToEnd} 43 /> 44 ); 45} 46 47const styles = StyleSheet.create({ 48 contentContainerStyle: { 49 padding: 5, 50 paddingBottom: (Constants.statusBarHeight || 24) + 128, 51 }, 52 list: { 53 flex: 1, 54 }, 55}); 56