Подменю в ящике - React Native

Question

Привет, я новичок в React native. Я разработал все экраны вместе с навигацией. В Drawer у меня есть меню под названием Reports . Если я щелкну по нему, я хочу показать 2 подменю: Старый отчет и Новый отчет . Я настроил меню ящика для стилизации.

Моя собственная версия React - 0.62. Я использую библиотеку React Navigation (https://reactnavigation.org/) для навигации.

Ниже прилагается скриншот моего меню ящика. Пожалуйста, поделитесь своими идеями.

<View style={{flex:1}}>
        <DrawerContentScrollView {...props}>
            <View style={styles.drawerContent}>
                <View style={styles.userInfoSection}>
                    <View style={{flexDirection:'row'}}>
                        <Avatar.Image
                        source={require('../Assets/user.png')}
                        />
                        <View style={{marginHorizontal:10, justifyContent:'center', width:'70%'}}>
                            <Text style={{color:'gray'}}>k******@gmail.com</Text>
                        </View>                  
                    </View>
                </View>
                <View style={{alignItems:'center', marginVertical:15}}>
                    <View
                    style={{borderBottomColor:'gray',borderWidth:0.5, width:'90%'}}
                    />
                </View>
                <View>
                    <DrawerItem 
                        icon={({color, size}) => (
                            <Icon 
                                name="md-home"
                                size={size}
                                color={Colors.primary}
                            />

                        )}
                        label="Home"
                        onPress={() => props.navigation.navigate('Home')}
                    />

                    <DrawerItem 
                        icon={({color, size}) => (
                            <Icon 
                                name='ios-document'
                                size={size}
                                color={Colors.primary}
                            />
                        )}
                        label='Report'
                        onPress={() => props.navigation.navigate('Report')}
                        />

                    <DrawerItem 
                        icon={({color, size}) => (
                            <Icon 
                                name="ios-notifications"
                                size={size}
                                color={Colors.primary}
                            />

                        )}
                        label='Notifications'
                        onPress={() => props.navigation.navigate('Notification')}
                    />

                </View>
            </View>
        </DrawerContentScrollView>

        <Drawer.Section>
            <DrawerItem 
            icon={({color, size}) => (
                <Icon 
                name="ios-exit"
                color="red"
                size={size}
                />
            )}
            label="SignOut"
            onPress={ () => signOut()}
            />
        </Drawer.Section>
    </View>