TodoList example is broken

[Svrkota-S]

Do you want to request a feature or report a bug?

Bug in Todo app example on your website. (http://redux.js.org/docs/basics/ExampleTodoList.html)

What is the current behavior?

After you click on item from todo list, it won't get crossed out. At the moment, if you console.log an id in mapDispatchToProps function in VisibleTodoList, you will see it is undefined:

const mapDispatchToProps = dispatch => {
  return {
    onTodoClick: id => {
      console.log(id);
      dispatch(toggleTodo(id))
    }
  }
}

In order to fix this, I had to add variable to reducers.js file that is initially set to 0 and then is incremented every time a new Todo item is added to list in order for Todo items to have unique id:

...

let counter = 0;

...

case ADD_TODO:
      return [
        ...state,
        {
          id: counter++,
          text: action.text,
          completed: false
        }
      ]

Which versions of Redux, and which browser and OS are affected by this issue? Did this work in previous versions of Redux?

I don't know about previous versions of React/Redux because I have just started studying React/Redux.
Browser: Google Chrome 60.0.3112.101 (Official Build) (64-bit)
react: 15.6.1
react-redux: 5.0.6
redux: 3.7.2
OS: Windows 10

[timdorr]

I'm not sure what you're seeing on your end, but that's in the actions/index.js code in that document:

let nextTodoId = 0
export const addTodo = text => {
  return {
    type: 'ADD_TODO',
    id: nextTodoId++,
    text
  }
}