React Native with Redux, access state from actions and stracture problems

i am building a simple application using react native and redux with react-native-router-flux. I am facing a dead-end because of the approach i've chosen to solve the problem. My app has 2 big datasets Products and Categories. I have three screens

  1. Home screen
  2. Category screen
  3. Product screen

When the app boots up , i am making two ajax requests , one to fetch the products and one to fetch the categories. When the requests resolve i am storing data in store

{ products: [...], categories: [...]}

The problem i'm facing is in the Categories Screen. From the categories screen the app renders a list of items and by clicking each of them i dispatch an action to execute Actions['Scene name'] , routing back to the same list component but this time providing the clicked category id. So i'm presenting the whole category tree from parent to children using this technique. The problem arises when there aren't any sub categories and i have to switch to another component and display products.

Every time an action is occurs i have to filter products array ( each item contains an array with product categories ids ) to find the category products

I feel i've dealt with the problem very wrong and i am asking for some guidance for how to store data in redux and navigate between Activities using the router.

A don't know if i've explained the problem enough. Bellow some snippets of my work so far


export const selectCategory = ({ title, id }) => {
    Actions.subCategoryList({ title, id });
    return ({
      payload: id


render() {
            return (
                    style={{ backgroundColor: '#FFF' }}
                    renderItem={({ item }) => <CategoryListItem category={item} />}
                    keyExtractor={(item, index) => index}

        const mapStateToProps = (state, ownProps) => {
        const categories = state.categories.filter((item) => {
            if (item.parentid === return true;
            return false;

        return {
            category_products: state.products.selected_category_products


categoryItemPressed() {

render() {
    const { category } = this.props;

    return (
            onPress={() => this.categoryItemPressed()}
            <View style={this.styles.containerStyle}>
                <Text style={this.styles.textStyle}>{category.title}</Text>

export default connect(null, { selectCategory })(CategoryListItem);