use-enhanced-reducer

Simple custom hook for use React.useReducer with middlewares.

Examples

With logger middleware

import * as React from 'react';
import { useEnhancedReducer, loggerMiddleware } from 'use-enhanced-reducer';

const SomeComponent: React.FunctionComponent<{}> = () => {
	// see logs of actions in console
	const [state, dispatch] = useEnhancedReducer(reducer, initialState, [loggerMiddleware])

	// do something
}

With your custom middleware

import * as React from 'react';
import { useEnhancedReducer, TReducerMiddleware } from 'use-enhanced-reducer';

const customMiddleware: TReducerMiddleware = state => dispatch => action => {
	// do something
};

const SomeComponent: React.FunctionComponent<{}> = () => {
	const [state, dispatch] = useEnhancedReducer(reducer, initialState, [customMiddleware])

	// do something
}