Skip to content

Instantly share code, notes, and snippets.

@mistical2008
Forked from tehSLy/createWSConnection.ts
Created April 18, 2023 04:34
Show Gist options
  • Select an option

  • Save mistical2008/2d511405ca7e79393bf818bb080d8298 to your computer and use it in GitHub Desktop.

Select an option

Save mistical2008/2d511405ca7e79393bf818bb080d8298 to your computer and use it in GitHub Desktop.
import { createEffect, createEvent, createStore, restore } from "effector";
export const createWebSocketConnection = (url: string, retries = 5) => {
const onEvent = createEvent<Event>();
const statusChanged = onEvent.map(({ type }) => type);
const message = createEvent<MessageEvent>();
const send = createEffect();
const $status = restore(statusChanged.filter({ fn: (status) => status === "close" || status === "open" }), "close");
const error = onEvent.filter({fn: ({type}) => type === "error"})
const retry = createEffect();
const $retries = createStore(retries).on(retry, (s) => s - 1);
const createInstance = () => {
const instance = new WebSocket(url);
statuses.forEach((key) => instance.addEventListener(key, onEvent));
send.use((data) => instance.send(JSON.stringify(data)));
instance.addEventListener("message", message);
instance.addEventListener("close", retry);
return () => {
statuses.forEach((key) => instance.removeEventListener(key, onEvent));
instance.removeEventListener("message", message);
instance.removeEventListener("close", retry);
};
};
let clearConnection = createInstance();
$retries.watch((remaining) => retry.use(remaining > 0 ? () => (clearConnection = createInstance()) : () => null));
retry.watch(clearConnection);
return { $status, send, message, error };
};
const statuses: Array<keyof WebSocketEventMap> = ["close", "error", "open"];
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment