ReactNative - Force re-render of child components in react-native-tab-view

Question

How can I re-render tabs (react-native-tab-view) that is using the same shared child component?

I have 3 js files; Parent, TabView and Item.

I have 2 tabs in the parent; All and Downloaded which use the same child component with different props. I can see all items in All including Downloaded items. I would like to update the state of the items in All tab view when I update the state of an item on the Downloaded tab. I've tried passing props and using callbacks but I couldn't get it to update the views on the other tab even with forceUpdate method.

Parent:

renderScene = ({route}) => {
    switch (route.key) {
        case 'all':
            return <DocumentTabView /** ..props all items **/ />
        case 'downloaded':
            return <DocumentTabView /** ..props downloaded only **/ />
        default:
            return <DocumentTabView /** ..props all items **/ />
    }
};

render() {
    return (
        <TabView
            lazy
            navigationState={this.state}
            renderScene={this.renderScene}
            renderHeader={this.renderHeader}
            onIndexChange={this.handleIndexChange}
        />
    );
}

TabView:

render() {
    return (
        <SafeAreaView
            forceInset={{top: 'always'}}
            style={documentStyles.container}>
            <ScrollView
                contentContainerStyle={documentStyles.scrollview}
                refreshControl={
                <RefreshControl
                    refreshing={this.props.isRefreshing}
                    onRefresh={this.props.refreshCallback}
                />
            }>
                {this.state.dataSource.map((item, index) => {
                    return (
                        <Item /** ..props **/ />
                    );
                })}
            </ScrollView>
        </SafeAreaView>
    );
}