Epics without redux-observable.
Epics are a very strong pattern to build maintainable applications with RxJS. They were pioneered by redux-observable, which forces you to use Redux. Epix is for all the cases where you manage your state without Redux.
yarn add epix
or
npm install epix
import { Subject } from 'rxjs';
import { startEpics, ofType } from 'epix';
const action$ = new Subject();
function logMessageEpic(action$) {
return action$.pipe(
ofType('logMessage'),
tap(({ message }) => console.log(message)),
map(() => ({ type: 'logMessageDone' })),
);
}
function doNothingEpic() {
return empty();
}
const epics = [
logMessageEpic,
doNothingEpic,
];
startEpics(epics, action$);
action$.next({
type: 'logMessage',
message: 'Hello world',
});
If you have no idea what's going on here, I recommend getting accustomed with redux-observable first.
This is epix
's replacement of createEpicMiddleware
and combineEpics
in a single function.
epics: Array<Epic>
: your epics. The order matters, epics higher up in the array run before otheraction$: Subject
: the action stream, that actions will go trough.[options: Object]
: pass what you want here. It will be made available to all epics as their second argument.
Define your epics with Epic
as a type.
import { tap, ignoreElements } from 'rxjs/operators';
import { ofType, Epic } from 'epix';
const logMessageEpic: Epic = (action$) => {
return action$.pipe(
ofType('sayHi'),
tap(() => console.log('Hi!')),
ignoreElements(),
);
}
Define an action type.
type Actions = {
type: 'sayHi';
} | {
type: 'sayMyName';
name: string;
};
Use it.
const action$ = new Subject<Actions>();
startEpics<Actions, { logger: (message: string) => {} }>(epics, action$, { logger: console.log });