Praveen Raj praveen001

🎯

Focusing

praveen001 / settings.json

Last active October 10, 2018 17:19

vs code settings

	{
	"editor.multiCursorModifier": "ctrlCmd",
	"editor.snippetSuggestions": "top",
	"gitlens.advanced.messages": {
	"suppressShowKeyBindingsNotice": true,
	"suppressWelcomeNotice": true
	},
	"window.zoomLevel": 0,
	"editor.tabSize": 2,
	"editor.wordWrap": "off",

praveen001 / webSocketConnectEpic.ts

Created July 16, 2019 05:27

Managing WebSocket with Redux Observable

	let webSocketSubject: WebSocketSubject<{}>;
	let onOpenSubject = new Subject();
	let onCloseSubject = new Subject();

	const connectSocket = websocketUrl => {
	onOpenSubject = new Subject();
	onCloseSubject = new Subject();
	webSocketSubject = webSocket({
	url: websocketUrl,
	openObserver: onOpenSubject,

praveen001 / webSocketConnectEpics.ts

Last active July 22, 2019 11:14

WebSocket Redux Observable

	let webSocketSubject: WebSocketSubject<{}>;
	let onOpenSubject = new Subject();
	let onCloseSubject = new Subject();

	// Create the websocket subject
	const createSocket = websocketUrl => {
	onOpenSubject = new Subject();
	onCloseSubject = new Subject();
	webSocketSubject = webSocket({
	url: websocketUrl,

praveen001 / webSocketFailureEpics.ts

Last active July 22, 2019 11:16

Redux Observable WebSocket

	const connectEpic = (action$, state$: StateObservable<IState>) =>
	action$
	.ofType(WebsocketActionTypes.CONNECT)
	.switchMap((action: IConnectWebsocketAction) =>
	connectSocket(state$.value.config.webSocketURL)
	.map(data => receiveMessageFromWebSocket(data))
	.catch(e => of(disconnect(true))) // <-- Handle 1st case by using catch operator
	);

	const connectedEpic = action$ =>

praveen001 / webSocketSendMsgEpics.ts

Created July 22, 2019 10:39

Redux Observable WebSocket

	const sendMessageEpic = action$ =>
	action$.ofType(WebsocketActionTypes.SEND_MESSAGE).map(action => {
	webSocketSubject.next(action.payload);
	return sentMessage();
	});

praveen001 / webSocketDisconnectEpics.ts

Last active July 22, 2019 10:41

Redux Observable WebSocket

	const disconnectEpic = (action$: ActionsObservable<PlaylistAction>) =>
	action$.ofType(WebsocketActionTypes.DISCONNECT).map(() => {
	onCloseSubject.complete();
	webSocketSubject.complete();
	return disconnected();
	});

praveen001 / webSocketEpics.ts

Created July 22, 2019 11:09

Redux Observable WebSocket

	import { combineEpics, StateObservable } from 'redux-observable';
	import { of } from 'rxjs';
	import { Subject } from 'rxjs/Subject';
	import { webSocket, WebSocketSubject } from 'rxjs/webSocket';
	import {
	connected,
	connect,
	disconnected,
	disconnect,
	IConnectWebsocketAction,

praveen001 / webSocketConnectedEpics.ts

Created July 22, 2019 11:14

Redux Observable WebSocket

	// Detect successfull connection by listening to onOpenSubject
	const connectedEpic = action$ =>
	action$.ofType(WebsocketActionTypes.CONNECT).switchMap(() =>
	onOpenSubject.map(() => {
	return connected();
	})
	);

praveen001 / webSocketReceiveEpics.ts

Last active July 22, 2019 11:26

Redux Observable WebSocket

	const connectEpic = (action$, state$: StateObservable<IState>) =>
	action$
	.ofType(WebsocketActionTypes.CONNECT)
	.switchMap((action: IConnectWebsocketAction) =>
	connectSocket(state$.value.eventConfig.webSocketURL)
	.map(data => receiveMessageFromWebSocket(data)) // <-- Map and fire receive action
	);

praveen001 / webSocketRetryEpic.ts

Created July 22, 2019 11:32

Redux Observable WebSocket

	const disconnectEpic = (action$, state$: StateObservable<IState>) =>
	action$
	.ofType(WebsocketActionTypes.DISCONNECT)
	.mergeMap((action: IDisconnectFromWebsocketAction) => {
	if (action.payload.retry) {
	return of(connect(state$.value.config.webSocketURL)) // <-- reconnect
	.delay(5000)
	.startWith(disconnected());
	}
	onCloseSubject.complete();