v2 - com duck pattern

Author: Catharina Mesquita

src/components/ComponentList/index.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import { useSelector, useDispatch } from 'react-redux';
+import { Types } from '../../store/reducer';
 
 export default function ComponentList() {
 
@@ -11,7 +12,7 @@ export default function ComponentList() {
   const dispatch = useDispatch();
 
   function add(){
-    dispatch({ type: 'ADD_REDUCER', title: 'GrafQL'})
+    dispatch({ type: Types.ADD, title: 'GrafQL'})
   }
 
   return (

src/store/index.js

@@ -1,21 +1,6 @@
 import { createStore } from 'redux'
 
-const INITIAL_STATE = {
-  data: [
-    'React Native',
-    'ReactJS',
-    'NodeJS'
-  ]
-}
-
-function reducer(state = INITIAL_STATE, action){
-  switch (action.type) {
-    case 'ADD_REDUCER':
-      return { ...state, data: [ ...state.data, action.title ]}
-    default:
-      return state;
-  }
-}
+import reducer from './reducer'
 
 const store = createStore(reducer)
 

src/store/reducer.js

@@ -0,0 +1,21 @@
+import { createActions, createReducer } from 'reduxsauce';
+
+export const { Types, Creators } = createActions({
+  add: ["title"]
+})
+
+const INITIAL_STATE = {
+  data: [
+    'React Native',
+    'ReactJS',
+    'NodeJS'
+  ]
+}
+
+const add = (state = INITIAL_STATE, action) => {
+  return { ...state, data: [ ...state.data, action.title ]}
+}
+
+export default createReducer(INITIAL_STATE, {
+  [Types.ADD]: add,
+})