Feature: Support multiple actions

README.md

@@ -54,12 +54,14 @@ $ npm i @evilfactory/global-state
     -   `props.reducer`  
     -   `props.initialState`  
     -   `props.children`  
+    -   `props.actions`  
 
 ### Properties
 
 - `reducer` **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** **[| useReducer](https://reactjs.org/docs/hooks-reference.html#usereducer)**
 - `initialState` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** 
 - `children` **[Element](https://developer.mozilla.org/docs/Web/API/Element)** **[| createElement](https://reactjs.org/docs/react-api.html#createelement)**
+- `actions` **([Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array) \| [Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function))** 
 
 ### Examples
 
@@ -85,8 +87,15 @@ function todoReducer(state, action) {
  }
 }
 
+function createTodo(state,action, todo){
+ return action({type: 'ADD_TODO', todo})
+}
+
+// const [state, actions] = useGlobalState() 
+// actions.createTodo({title: 'New Todo Created', status: 'pending'})
+
 ReactDOM.render(
-   <StateProvider reducer={todoReducer} initialState={initialState}>
+   <StateProvider reducer={todoReducer} initialState={initialState} actions={[createTodo]}>
      <App/>
    </StateProvider>
 , document.getElementById('root'))
@@ -111,8 +120,8 @@ const createTodo = (state, action, todo) => {
  })
 } 
 
-const [,addTodo] = useGlobalState(createTodo)
+const [,actions] = useGlobalState(createTodo)
 
-addTodo({title: 'New Task'})
+actions.createTodo({title: 'New Task'})
 ...
 ```

__tests__/index.js

@@ -16,7 +16,10 @@ test('StateProvider & useGlobalState test', () => {
                 default: return state
             } 
         },
-        initialState: {test: false}
+        initialState: {test: false},
+        actions: [
+            function changeTest(state, action){return action({ type: 'TEST' })}
+        ]
     } 
 
     const ShowTest = () => {
@@ -29,10 +32,10 @@ test('StateProvider & useGlobalState test', () => {
     } 
 
     const ChangeTest = () => {
-        const [, dispatch] = useGlobalState()
+        const [, actions] = useGlobalState()
 
         const handleClick = () => {
-            dispatch({
+            actions.changeTest({
                 type: 'TEST'
             }) 
         }

lib/index.js

@@ -20,12 +20,20 @@ import {
  */
 const StateContext = createContext()
 
+/**
+ * @ignore
+ * @var {Object} actions
+ */
+let actions = {}
+const memoActions = []
+
 /**
  * @name <StateProvider/>
  * @param {Object} props
  * @property {Function} reducer **{@link https://reactjs.org/docs/hooks-reference.html#usereducer | useReducer}**
  * @property {Object} initialState
  * @property {Element} children **{@link https://reactjs.org/docs/react-api.html#createelement | createElement}**
+ * @property {Array|Function} actions
  * @description 
  *  **<StateProvider/>** as Wrapper of your `React` Application.
  *
@@ -48,16 +56,35 @@ const StateContext = createContext()
  *  }
  * }
  *
+ * function createTodo(state,action, todo){
+ *  return action({type: 'NEW_TODO', todo})
+ * }
+ *
+ * // const [state, actions] = useGlobalState() 
+ * // actions.createTodo({title: 'New Todo Created', status: 'pending'})
+ *
  * ReactDOM.render(
- *    <StateProvider reducer={todoReducer} initialState={initialState}>
+ *    <StateProvider reducer={todoReducer} initialState={initialState} actions={[createTodo]}>
  *      <App/>
  *    </StateProvider>
  * , document.getElementById('root'))
  *
  */
-export const StateProvider = ({reducer, initialState, children }) => createElement(StateContext.Provider, {
-    value: useReducer(reducer, initialState)
-}, children)
+export const StateProvider = ({reducer, initialState, children, actions:newActions}) => {
+    if(Array.isArray(newActions)){
+        for(let i=0; i<newActions.length;i++){
+            if(typeof newActions[i] === 'function'){
+                actions[newActions[i].name] = newActions[i] 
+            }
+        }
+    } else if(typeof newActions === 'function'){
+        actions[newActions.name] = newActions
+    }
+
+    return createElement(StateContext.Provider, {
+        value: useReducer(reducer, initialState)
+    }, children)
+}
 
 
 /**
@@ -75,14 +102,28 @@ export const StateProvider = ({reducer, initialState, children }) => createEleme
  *  })
  * } 
  *
- * const [,addTodo] = useGlobalState(createTodo)
+ * const [,actions.createTodo] = useGlobalState(createTodo)
  *
- * addTodo({title: 'New Task'})
+ * actions.createTodo({title: 'New Task'})
  * ...
  */
 
 export const useGlobalState = (newAction) => {
     const [state, action] = useContext(StateContext)
     // newAction is action injector
-    return [state, newAction ? newAction.bind(null, state, action) : action ]
+
+    // bind action
+    // Object iteration
+    for(let i in actions){
+        if(!memoActions.includes(i)) {
+            actions[i]=actions[i].bind(null,state, action) 
+            memoActions.push(i)
+        }
+    }
+
+    newAction = newAction ? {
+        [newAction.name]: newAction.bind(null, state, action),
+    } : actions 
+
+    return [state, newAction]
 }