Implementando função de deletar

Author: acmesquita

src/components/ItemList/index.js

@@ -1,11 +1,21 @@
 import React from 'react';
-
+import { useDispatch } from 'react-redux';
+import { Types } from '../../store/reducer/example-reducer';
 // import { Container } from './styles';
 
 export default function ItemList({ item }) {
+
+  const dispatch = useDispatch();
+
+  function remove() {
+    let id = item.id
+    dispatch({ type: Types.REMOVE, id })
+  }
+
   return (
     <span>
       {item.text} - {item.createAt}
+      <button type="button" onClick={remove}>DELETE</button>
     </span>
   );
 }

src/store/reducer/example-reducer.js

@@ -5,7 +5,8 @@ import { createActions, createReducer } from 'reduxsauce';
  *  Ex.: Type.ADD e add = { type: Type.ADD, params }
  */
 export const { Types, Creators } = createActions({
-  add: ["note"]
+  add: ["note"],
+  remove: ["id"]
 })
 
 const INITIAL_STATE = {
@@ -16,6 +17,10 @@ const add = (state = INITIAL_STATE, action) => {
   return { ...state, data: [...state.data, action.note] }
 }
 
+const remove = (state = INITIAL_STATE, action) => {
+  return { ...state, data: state.data.filter(note => note.id !== action.id) }
+}
+
 /**
  * Criando os reducers
  * Ex.: [Types.ADD]: add == switch actions.type
@@ -27,4 +32,5 @@ const add = (state = INITIAL_STATE, action) => {
 
 export default createReducer(INITIAL_STATE, {
   [Types.ADD]: add,
+  [Types.REMOVE]: remove
 })