Async Change Trigger Example slim-redux v0.2

asyncChangeTrigger.js

// async/todo.js
import { asyncChangeTrigger } from 'slim-redux-react';
import { addTodoPending, addTodoSuccess, addTodoFailed } from '../changes/todo';

// First argument is a change trigger mapping
export const addTodo = asyncChangeTrigger({ addTodoPending, addTodoSuccess, addTodoFailed }, (label, state) => {
  // Create todo in state pending confirmation from server
  const newTodoAction = addTodoPending(label);  
  const newTodoId = newTodoAction.payload.id;

  fetch(`/v1/todos`, {
    method: 'post',
    /* ... */
  ).then(data => {
    // Calling our second change trigger to confirm we added the task on the server
    addTodoConfirmed(newTodoId);
  }).catch(e => addTodoFailed(newTodoId);); // Or call addTodoFailed if there was an error with the request
});

// main.js
import { createSlimReduxStore } from 'slim-redux'
import { addTodo } from './async/todo';

const store = createSlimReduxStore({todos:[]});

// Notice how we don't need any sort of registration here.
// We just call this asynchronous change trigger and pass it the name
// of our new todo. The rest is taken care of by the async change
// trigger and will lead to a new todo which is persitetd to the server
addTodo('Get Milk');