key should be todo.id

Author: neerajsingh0101

ep14-add-id-to-todo/app/components/DisplayList.jsx

@@ -7,7 +7,7 @@ export default class DisplayList extends React.Component {
     return <ul>
             { this.props.todos.map((todo, i) => {
               return <DisplayItem
-                        key={todo.title}
+                        key={todo.id}
                         todo={todo}
                         handleDone={this.props.handleDone}
                         handleDelete={this.props.handleDelete} />;

ep15-use-proptypes/app/components/DisplayList.jsx

@@ -7,7 +7,7 @@ export default class DisplayList extends React.Component {
     return <ul>
             { this.props.todos.map((todo, i) => {
               return <DisplayItem
-                        key={todo.title}
+                        key={todo.id}
                         todo={todo}
                         handleDone={this.props.handleDone}
                         handleDelete={this.props.handleDelete} />;

ep16-new-css/app/components/DisplayList.jsx

@@ -6,7 +6,7 @@ export default class DisplayList extends React.Component {
   render () {
     return <ul id="todo-list">
             { this.props.todos.map((todo, i) => {
-              return  <section id="main" key={todo.title}>
+              return  <section id="main" key={todo.id}>
                         <DisplayItem
                           todo={todo}
                           handleDone={this.props.handleDone}

ep17-edit-todo-part1/app/components/DisplayList.jsx

@@ -6,7 +6,7 @@ export default class DisplayList extends React.Component {
   render () {
     return <ul id="todo-list">
             { this.props.todos.map((todo, i) => {
-              return  <section id="main" key={todo.title}>
+              return  <section id="main" key={todo.id}>
                         <DisplayItem
                           todo={todo}
                           handleDone={this.props.handleDone}

ep18-edit-todo-part2/app/components/DisplayList.jsx

@@ -6,7 +6,7 @@ export default class DisplayList extends React.Component {
   render () {
     return <ul id="todo-list">
             { this.props.todos.map((todo, i) => {
-              return  <section id="main" key={todo.title}>
+              return  <section id="main" key={todo.id}>
                         <DisplayItem
                           todo={todo}
                           handleDone={this.props.handleDone}