Getting Invariant Violation for store in AddTodo component

[nodermatt]

Thanks for the great project series!

When I checkout your code and run branch 5 I get an "Invariant Violation error", saying that my root component isn't wrapped with Provider. However, the root component is wrapped with Provider and an instance of store is passed to the store argument.

I posted a screenshot of the error message below and copied the component hierachy.

1st level

export default class App extends React.Component {
  render() {
    return (
      <Provider store={store}>
        <TodoApp />
      </Provider>
    );
  }
}

2nd level

class TodoApp extends Component {
    render() {
        return (
            <View style={styles.container}>
                <AddTodo />

                <View>
                    <VisibleTodos />
                </View>
            </View>
        );
    }
}

3rd level

class AddTodo extends Component {

    state = {
        text: ''
    }

    addTodo = (text) => {
        //redux store 
        this.props.dispatch(addTodo(text))
        this.setState({ text: '' })
    }

    render() {
        return (
            <View style={{ flexDirection: 'row', marginHorizontal: 20 }}>
                <TextInput
                    onChangeText={(text) => this.setState({ text })}
                    value={this.state.text}
                    placeholder="Eg. Create New Video"
                    style={{ borderWidth: 1, borderColor: '#f2f2e1', backgroundColor: '#eaeaea', height: 50, flex: 1, padding: 5 }}
                />
                <TouchableOpacity onPress={() => this.addTodo(this.state.text)}>
                    <View style={{ height: 50, backgroundColor: '#eaeaea', alignItems: 'center', justifyContent: 'center' }}>
                        [Add]
                    </View>
                </TouchableOpacity>
            </View>
        );
    }
}
export default connect()(AddTodo);

[nathvarun]

You're Welcome buddy :).

I just quickly checkout out the branch and it worked for me.
Did you run npm install on the branch?
Also just confirm that the store is imported in the App.js File.

[nodermatt]

Hi @nathvarun thanks for the quick feedback!

You are correct, the branch is working fine. I am not sure where I went wrong, it must have been a detail because I did import the store and pass it to the Provider tag. Also I made sure to install the dependencies. Anyways, closing this issue as it has been proven that it works.

Cheers,
Nic