feat: add a wrapper around sockette w/ error retry (#1219)

* feat: add a wrapper around sockette w/ error retry

* chore: use import path alias

* perf: reduce retry

src/utils/websocket.ts

@@ -0,0 +1,39 @@
+import Sockette, { type SocketteOptions } from "sockette";
+
+/**
+ * A wrapper of Sockette that will automatically reconnect up to `maxError` before emitting an error event.
+ */
+export const createSockette = (
+  url: string,
+  opt: SocketteOptions,
+  maxError = 10
+) => {
+  let remainRetryCount = maxError;
+
+  return new Sockette(url, {
+    ...opt,
+    // Sockette has a built-in reconnect when ECONNREFUSED feature
+    // Use maxError if opt.maxAttempts is not specified
+    maxAttempts: opt.maxAttempts ?? maxError,
+    onmessage(this: Sockette, ev) {
+      remainRetryCount = maxError; // reset counter
+      opt.onmessage?.call(this, ev);
+    },
+    onerror(this: Sockette, ev) {
+      remainRetryCount -= 1;
+
+      if (remainRetryCount >= 0) {
+        this.close();
+        this.reconnect();
+      } else {
+        opt.onerror?.call(this, ev);
+      }
+    },
+    onmaximum(this: Sockette, ev) {
+      opt.onmaximum?.call(this, ev);
+      // onmaximum will be fired when Sockette reaches built-in reconnect limit,
+      // We will also set remainRetryCount to 0 to prevent further reconnect.
+      remainRetryCount = 0;
+    },
+  });
+};