Added remove todo item functionality

Author: Carlos Alcazar

web-app-redux/src/actions/resultsListAction.js

@@ -3,4 +3,8 @@ export function addTodoItem(todoItem) {
         type: "ADD_TODO_ITEM", todoItem
     }
 }
-   
+export function removeTodoItem(idx) {
+    return {
+        type: "REMOVE_TODO_ITEM", idx
+    }
+}

web-app-redux/src/home/todoResults/todoResults.js

@@ -17,7 +17,7 @@ export class TodoResultsComponent extends React.Component {
                     <tbody>
                         {
                             this.props.resultsList.map((arr, idx)=>{
-                                return(<TodoResultsRow key={`result${idx}`} todoItem={arr}/>)
+                                return(<TodoResultsRow idx={idx} key={`result${idx}`} todoItem={arr}/>)
                             })
                         }
 

web-app-redux/src/home/todoResults/todoResultsRow/todoResultsRow.js

@@ -1,8 +1,16 @@
 import React from 'react';
 import MaterialIcon from 'material-icons-react';
-import { connect }  from 'react-redux'
+import { removeTodoItem } from '../../../actions/resultsListAction'
+import {connect} from 'react-redux'
 
-export class TodoResultsRowComponent extends React.Component {
+class TodoResultsRowComponent extends React.Component {
+    constructor() {
+        super();
+        this.removeRow = this.removeRow.bind(this)
+    }
+    removeRow() {
+        this.props.dispatch(removeTodoItem(this.props.idx))
+    }
 
     render() {
         return (
@@ -13,7 +21,7 @@ export class TodoResultsRowComponent extends React.Component {
                     <div>
                     </div>
                     </span>
-                    <button className="iconContainer">
+                    <button onClick={this.removeRow} className="iconContainer">
                         <MaterialIcon icon="delete" />
                     </button>
                 </td>

web-app-redux/src/reducers/resultsList.js

@@ -3,11 +3,15 @@ const initialState = {
 }
 
 export default function todoApp(state = initialState, action) {
+    let newResultsList = state.resultsList.slice(0)
     switch (action.type) {
         case "ADD_TODO_ITEM":
-            let newResultsList = state.resultsList.slice(0)
             newResultsList.push(action.todoItem)
           return {...state, resultsList: newResultsList}
+        case "REMOVE_TODO_ITEM":
+            newResultsList.splice(action.idx, 1)
+            console.log(newResultsList)
+            return {...state, resultsList: newResultsList}
         default:
           return state
       }