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.props.data.length > 0) 18 ref.current.scrollToEnd({ animated: false }); 19 }, 20 [ref] 21 ); 22 23 React.useEffect(() => { 24 if (done && ref.current) { 25 scrollToEnd(); 26 } 27 }, [ref, done]); 28 29 const ListFooterComponent = () => ( 30 <DoneText done={done} numFailed={numFailed} results={results} /> 31 ); 32 33 return ( 34 <FlatList 35 ref={ref} 36 style={styles.list} 37 contentContainerStyle={styles.contentContainerStyle} 38 data={[...suites]} 39 keyExtractor={keyExtractor} 40 renderItem={renderItem} 41 ListFooterComponent={ListFooterComponent} 42 onContentSizeChange={scrollToEnd} 43 onLayout={scrollToEnd} 44 /> 45 ); 46} 47 48const styles = StyleSheet.create({ 49 contentContainerStyle: { 50 padding: 5, 51 paddingBottom: (Constants.statusBarHeight || 24) + 128, 52 }, 53 list: { 54 flex: 1, 55 }, 56}); 57