@adonisjs/transmit-client 1.0.0 → 1.1.0

package/README.md

@@ -7,7 +7,11 @@
 
 <div align="center">
 
-[![gh-workflow-image]][gh-workflow-url] [![npm-image]][npm-url] ![][typescript-image] [![license-image]][license-url] [![synk-image]][synk-url]
+[![typescript-image]][typescript-url]
+[![gh-workflow-image]][gh-workflow-url]
+[![npm-image]][npm-url]
+[![npm-download-image]][npm-download-url]
+[![license-image]][license-url]
 
 </div>
 
@@ -38,6 +42,8 @@ AdonisJS Transmit Client is a client for the native Server-Sent-Event (SSE) modu
   - [Creating a subscription](#creating-a-subscription)
     - [Unsubscribing](#unsubscribing)
     - [Subscription Request](#subscription-request)
+    - [Authenticated event stream](#authenticated-event-stream)
+    - [Custom UID Generator](#custom-uid-generator)
     - [Reconnecting](#reconnecting)
 - [Events](#events)
 
@@ -130,6 +136,93 @@ const transmit = new Transmit({
 })
 ```
 
+### Authenticated event stream
+
+The `__transmit/events` stream is opened using `EventSource`, which cannot send custom headers. That means `beforeSubscribe`/`beforeUnsubscribe` only affect the subscribe/unsubscribe HTTP calls. If you rely on header-based auth, protect `__transmit/subscribe` and `__transmit/unsubscribe`, or provide a custom `eventSourceFactory` that can send headers.
+
+Example using `@microsoft/fetch-event-source`:
+
+```ts
+import { fetchEventSource } from '@microsoft/fetch-event-source'
+
+function createFetchEventSource(
+  url: string | URL,
+  options: { withCredentials: boolean },
+  headers: Record<string, string>
+) {
+  const controller = new AbortController()
+  const listeners = new Map<string, Set<(event: MessageEvent) => void>>()
+
+  const dispatch = (type: string, data?: string) => {
+    const event = new MessageEvent(type, { data })
+    listeners.get(type)?.forEach((listener) => listener(event))
+  }
+
+  fetchEventSource(url.toString(), {
+    headers,
+    credentials: options.withCredentials ? 'include' : 'omit',
+    signal: controller.signal,
+    onopen: () => dispatch('open'),
+    onmessage: (message) => dispatch(message.event ?? 'message', message.data),
+    onerror: () => {
+      dispatch('error')
+    },
+  })
+
+  return {
+    addEventListener(type: string, listener: (event: MessageEvent) => void) {
+      if (!listeners.has(type)) {
+        listeners.set(type, new Set())
+      }
+      listeners.get(type)!.add(listener)
+    },
+    removeEventListener(type: string, listener: (event: MessageEvent) => void) {
+      listeners.get(type)?.delete(listener)
+    },
+    close() {
+      controller.abort()
+    },
+  } as EventSource
+}
+
+const transmit = new Transmit({
+  baseUrl: 'http://localhost:3333',
+  eventSourceFactory: (url, options) => {
+    return createFetchEventSource(url, options, {
+      Authorization: `Bearer ${token}`,
+    })
+  },
+})
+```
+
+Note: this adapter is minimal and only wires `open`, `error`, and `message` (or custom event names). If you rely on other `EventSource` features like `readyState` or `onopen`, you may want to expand it.
+
+### Custom UID Generator
+
+By default, Transmit uses `crypto.randomUUID()` to generate unique client identifiers. This method only works in [secure contexts](https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts) (HTTPS). If you need to use Transmit over HTTP (e.g., local network deployments), you can provide a custom `uidGenerator` function.
+
+```ts
+const transmit = new Transmit({
+  baseUrl: 'http://localhost:3333',
+  uidGenerator: () => {
+    return Array.from({ length: 16 }, () =>
+      Math.floor(Math.random() * 256).toString(16).padStart(2, '0')
+    ).join('')
+  },
+})
+```
+
+Or using a library like `uuid`:
+
+```ts
+import { v4 as uuid } from 'uuid'
+
+const transmit = new Transmit({
+  baseUrl: 'http://localhost:3333',
+  uidGenerator: () => uuid(),
+})
+```
+
 ### Reconnecting
 
 The transmit client will automatically reconnect to the server when the connection is lost. You can change the number of retries and hook into the reconnect lifecycle as follows:
@@ -149,9 +242,9 @@ const transmit = new Transmit({
 
 # Events
 
-The`Transmit` class uses the [`EventTarget`](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget) class to emits multiple events.
+The `Transmit` class uses the [`EventTarget`](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget) class to emits multiple events.
 
-  ```ts
+```ts
 transmit.on('connected', () => {
   console.log('connected')
 })
@@ -165,17 +258,24 @@ transmit.on('reconnecting', () => {
 })
 ```
 
-[gh-workflow-image]: https://img.shields.io/github/actions/workflow/status/adonisjs/transmit-client/test?style=for-the-badge
-[gh-workflow-url]: https://github.com/adonisjs/transmit-client/actions/workflows/test.yml "Github action"
+That means you can also remove an event listener previously registered, by passing the event listener function itself.
 
-[typescript-image]: https://img.shields.io/badge/Typescript-294E80.svg?style=for-the-badge&logo=typescript
-[typescript-url]: "typescript"
+```ts
+const onConnected = () => {
+  console.log('connected')
+}
 
-[npm-image]: https://img.shields.io/npm/v/@adonisjs/transmit-client.svg?style=for-the-badge&logo=npm
-[npm-url]: https://npmjs.org/package/@adonisjs/transmit-client 'npm'
+transmit.on('connected', onConnected)
+transmit.off('connected', onConnected)
+```
 
+[gh-workflow-image]: https://img.shields.io/github/actions/workflow/status/adonisjs/transmit-client/checks.yml?branch=develop&style=for-the-badge
+[gh-workflow-url]: https://github.com/adonisjs/transmit-client/actions/workflows/checks.yml
+[npm-image]: https://img.shields.io/npm/v/@adonisjs/transmit-client.svg?style=for-the-badge&logo=npm
+[npm-url]: https://www.npmjs.com/package/@adonisjs/transmit-client
+[npm-download-image]: https://img.shields.io/npm/dm/@adonisjs/transmit-client?style=for-the-badge
+[npm-download-url]: https://www.npmjs.com/package/@adonisjs/transmit-client
+[typescript-image]: https://img.shields.io/badge/Typescript-294E80.svg?style=for-the-badge&logo=typescript
+[typescript-url]: https://www.typescriptlang.org
 [license-image]: https://img.shields.io/npm/l/@adonisjs/transmit-client?color=blueviolet&style=for-the-badge
-[license-url]: LICENSE.md 'license'
-
-[synk-image]: https://img.shields.io/snyk/vulnerabilities/github/adonisjs/transmit-client?label=Synk%20Vulnerabilities&style=for-the-badge
-[synk-url]: https://snyk.io/test/github/adonisjs/transmit-client?targetFile=package.json "synk"
+[license-url]: LICENSE.md

package/build/index.d.ts

@@ -1,13 +1,11 @@
-interface HttpClientOptions {
-    baseUrl: string;
-    uid: string;
-}
-declare class HttpClient {
-    #private;
-    constructor(options: HttpClientOptions);
-    send(request: Request): Promise<Response>;
-    createRequest(path: string, body: Record<string, unknown>): Request;
-}
+declare const TransmitStatus: {
+    readonly Initializing: "initializing";
+    readonly Connecting: "connecting";
+    readonly Connected: "connected";
+    readonly Disconnected: "disconnected";
+    readonly Reconnecting: "reconnecting";
+};
+type TransmitStatus = (typeof TransmitStatus)[keyof typeof TransmitStatus];
 
 declare const HookEvent: {
     readonly BeforeSubscribe: "beforeSubscribe";
@@ -32,20 +30,23 @@ declare class Hook {
     onUnsubscription(channel: string): this;
 }
 
-declare const TransmitStatus: {
-    readonly Initializing: "initializing";
-    readonly Connecting: "connecting";
-    readonly Connected: "connected";
-    readonly Disconnected: "disconnected";
-    readonly Reconnecting: "reconnecting";
-};
-type TransmitStatus = (typeof TransmitStatus)[keyof typeof TransmitStatus];
+interface HttpClientOptions {
+    baseUrl: string;
+    uid: string;
+}
+declare class HttpClient {
+    #private;
+    constructor(options: HttpClientOptions);
+    send(request: Request): Promise<Response>;
+    createRequest(path: string, body: Record<string, unknown>): Request;
+}
 
 interface SubscriptionOptions {
     channel: string;
     httpClient: HttpClient;
     getEventSourceStatus: () => TransmitStatus;
     hooks?: Hook;
+    onDelete?: () => void;
 }
 declare class Subscription {
     #private;
@@ -66,8 +67,8 @@ declare class Subscription {
      * Run all registered handlers for the subscription.
      */
     $runHandler(message: unknown): void;
-    create(): Promise<unknown>;
-    forceCreate(): Promise<unknown>;
+    create(): Promise<void>;
+    forceCreate(): Promise<void>;
     delete(): Promise<void>;
     onMessage<T>(handler: (message: T) => void): () => void;
     onMessageOnce<T>(handler: (message: T) => void): void;
@@ -81,8 +82,8 @@ interface TransmitOptions {
     }) => EventSource;
     eventTargetFactory?: () => EventTarget | null;
     httpClientFactory?: (baseUrl: string, uid: string) => HttpClient;
-    beforeSubscribe?: (request: RequestInit) => void;
-    beforeUnsubscribe?: (request: RequestInit) => void;
+    beforeSubscribe?: (request: Request) => void;
+    beforeUnsubscribe?: (request: Request) => void;
     maxReconnectAttempts?: number;
     onReconnectAttempt?: (attempt: number) => void;
     onReconnectFailed?: () => void;
@@ -99,6 +100,7 @@ declare class Transmit {
     constructor(options: TransmitOptions);
     subscription(channel: string): Subscription;
     on(event: Exclude<TransmitStatus, 'connecting'>, callback: (event: CustomEvent) => void): void;
+    off(event: Exclude<TransmitStatus, 'connecting'>, callback: (event: CustomEvent) => void): void;
     close(): void;
 }
 

package/build/index.js

@@ -1,21 +1,11 @@
-var __accessCheck = (obj, member, msg) => {
-  if (!member.has(obj))
-    throw TypeError("Cannot " + msg);
-};
-var __privateGet = (obj, member, getter) => {
-  __accessCheck(obj, member, "read from private field");
-  return getter ? getter.call(obj) : member.get(obj);
-};
-var __privateAdd = (obj, member, value) => {
-  if (member.has(obj))
-    throw TypeError("Cannot add the same private member more than once");
-  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-};
-var __privateSet = (obj, member, value, setter) => {
-  __accessCheck(obj, member, "write to private field");
-  setter ? setter.call(obj, value) : member.set(obj, value);
-  return value;
+var __typeError = (msg) => {
+  throw TypeError(msg);
 };
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
 var __privateWrapper = (obj, member, setter, getter) => ({
   set _(value) {
     __privateSet(obj, member, value, setter);
@@ -24,10 +14,6 @@ var __privateWrapper = (obj, member, setter, getter) => ({
     return __privateGet(obj, member, getter);
   }
 });
-var __privateMethod = (obj, member, method) => {
-  __accessCheck(obj, member, "access private method");
-  return method;
-};
 
 // src/subscription_status.ts
 var SubscriptionStatus = {
@@ -46,29 +32,37 @@ var TransmitStatus = {
 };
 
 // src/subscription.ts
-var _httpClient, _hooks, _channel, _getEventSourceStatus, _handlers, _status;
+var _httpClient, _hooks, _onDelete, _channel, _getEventSourceStatus, _handlers, _createPending, _status;
 var Subscription = class {
   constructor(options) {
     /**
      * HTTP client instance.
      */
-    __privateAdd(this, _httpClient, void 0);
+    __privateAdd(this, _httpClient);
     /**
      * Hook instance.
      */
-    __privateAdd(this, _hooks, void 0);
+    __privateAdd(this, _hooks);
+    /**
+     * Callback to call when the subscription is deleted.
+     */
+    __privateAdd(this, _onDelete);
     /**
      * Channel name.
      */
-    __privateAdd(this, _channel, void 0);
+    __privateAdd(this, _channel);
     /**
      * Event source status getter.
      */
-    __privateAdd(this, _getEventSourceStatus, void 0);
+    __privateAdd(this, _getEventSourceStatus);
     /**
      * Registered message handlers.
      */
     __privateAdd(this, _handlers, /* @__PURE__ */ new Set());
+    /**
+     * Pending create retry promise to avoid stacking timeouts.
+     */
+    __privateAdd(this, _createPending, null);
     /**
      * Current status of the subscription.
      */
@@ -76,6 +70,7 @@ var Subscription = class {
     __privateSet(this, _channel, options.channel);
     __privateSet(this, _httpClient, options.httpClient);
     __privateSet(this, _hooks, options.hooks);
+    __privateSet(this, _onDelete, options.onDelete);
     __privateSet(this, _getEventSourceStatus, options.getEventSourceStatus);
   }
   /**
@@ -101,23 +96,36 @@ var Subscription = class {
    */
   $runHandler(message) {
     for (const handler of __privateGet(this, _handlers)) {
-      handler(message);
+      try {
+        handler(message);
+      } catch (error) {
+        console.error(error);
+      }
     }
   }
   async create() {
     if (this.isCreated) {
       return;
     }
+    if (__privateGet(this, _getEventSourceStatus).call(this) !== TransmitStatus.Connected && __privateGet(this, _createPending)) {
+      return __privateGet(this, _createPending);
+    }
     return this.forceCreate();
   }
   async forceCreate() {
     if (__privateGet(this, _getEventSourceStatus).call(this) !== TransmitStatus.Connected) {
-      return new Promise((resolve) => {
+      if (__privateGet(this, _createPending)) {
+        return __privateGet(this, _createPending);
+      }
+      __privateSet(this, _createPending, new Promise((resolve) => {
         setTimeout(() => {
+          __privateSet(this, _createPending, null);
           resolve(this.create());
         }, 100);
-      });
+      }));
+      return __privateGet(this, _createPending);
     }
+    __privateSet(this, _createPending, null);
     const request = __privateGet(this, _httpClient).createRequest("/__transmit/subscribe", {
       channel: __privateGet(this, _channel)
     });
@@ -135,6 +143,7 @@ var Subscription = class {
     }
   }
   async delete() {
+    var _a;
     if (this.isDeleted || !this.isCreated) {
       return;
     }
@@ -150,6 +159,7 @@ var Subscription = class {
       }
       __privateSet(this, _status, SubscriptionStatus.Deleted);
       __privateGet(this, _hooks)?.onUnsubscription(__privateGet(this, _channel));
+      (_a = __privateGet(this, _onDelete)) == null ? void 0 : _a.call(this);
     } catch (error) {
     }
   }
@@ -168,17 +178,19 @@ var Subscription = class {
 };
 _httpClient = new WeakMap();
 _hooks = new WeakMap();
+_onDelete = new WeakMap();
 _channel = new WeakMap();
 _getEventSourceStatus = new WeakMap();
 _handlers = new WeakMap();
+_createPending = new WeakMap();
 _status = new WeakMap();
 
 // src/http_client.ts
-var _options, _retrieveXsrfToken, retrieveXsrfToken_fn;
+var _options, _HttpClient_instances, retrieveXsrfToken_fn;
 var HttpClient = class {
   constructor(options) {
-    __privateAdd(this, _retrieveXsrfToken);
-    __privateAdd(this, _options, void 0);
+    __privateAdd(this, _HttpClient_instances);
+    __privateAdd(this, _options);
     __privateSet(this, _options, options);
   }
   send(request) {
@@ -189,7 +201,7 @@ var HttpClient = class {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
-        "X-XSRF-TOKEN": __privateMethod(this, _retrieveXsrfToken, retrieveXsrfToken_fn).call(this) ?? ""
+        "X-XSRF-TOKEN": __privateMethod(this, _HttpClient_instances, retrieveXsrfToken_fn).call(this) ?? ""
       },
       body: JSON.stringify({ uid: __privateGet(this, _options).uid, ...body }),
       credentials: "include"
@@ -197,10 +209,9 @@ var HttpClient = class {
   }
 };
 _options = new WeakMap();
-_retrieveXsrfToken = new WeakSet();
+_HttpClient_instances = new WeakSet();
 retrieveXsrfToken_fn = function() {
-  if (typeof document === "undefined")
-    return null;
+  if (typeof document === "undefined") return null;
   const match = document.cookie.match(new RegExp("(^|;\\s*)(XSRF-TOKEN)=([^;]*)"));
   return match ? decodeURIComponent(match[3]) : null;
 };
@@ -261,21 +272,18 @@ var Hook = class {
 _handlers2 = new WeakMap();
 
 // src/transmit.ts
-var _uid, _options2, _subscriptions, _httpClient2, _hooks2, _status2, _eventSource, _eventTarget, _reconnectAttempts, _changeStatus, changeStatus_fn, _connect, connect_fn, _onMessage, onMessage_fn, _onError, onError_fn;
+var _uid, _options2, _subscriptions, _httpClient2, _hooks2, _status2, _eventSource, _eventTarget, _reconnectAttempts, _Transmit_instances, changeStatus_fn, connect_fn, onMessage_fn, onError_fn;
 var Transmit = class {
   constructor(options) {
-    __privateAdd(this, _changeStatus);
-    __privateAdd(this, _connect);
-    __privateAdd(this, _onMessage);
-    __privateAdd(this, _onError);
+    __privateAdd(this, _Transmit_instances);
     /**
      * Unique identifier for this client.
      */
-    __privateAdd(this, _uid, void 0);
+    __privateAdd(this, _uid);
     /**
      * Options for this client.
      */
-    __privateAdd(this, _options2, void 0);
+    __privateAdd(this, _options2);
     /**
      * Registered subscriptions.
      */
@@ -283,11 +291,11 @@ var Transmit = class {
     /**
      * HTTP client instance.
      */
-    __privateAdd(this, _httpClient2, void 0);
+    __privateAdd(this, _httpClient2);
     /**
      * Hook instance.
      */
-    __privateAdd(this, _hooks2, void 0);
+    __privateAdd(this, _hooks2);
     /**
      * Current status of the client.
      */
@@ -295,11 +303,11 @@ var Transmit = class {
     /**
      * EventSource instance.
      */
-    __privateAdd(this, _eventSource, void 0);
+    __privateAdd(this, _eventSource);
     /**
      * EventTarget instance.
      */
-    __privateAdd(this, _eventTarget, void 0);
+    __privateAdd(this, _eventTarget);
     /**
      * Number of reconnect attempts.
      */
@@ -345,7 +353,7 @@ var Transmit = class {
       __privateGet(this, _hooks2).register(HookEvent.OnUnsubscription, options.onUnsubscription);
     }
     __privateSet(this, _options2, options);
-    __privateMethod(this, _connect, connect_fn).call(this);
+    __privateMethod(this, _Transmit_instances, connect_fn).call(this);
   }
   /**
    * Returns the unique identifier of the client.
@@ -354,21 +362,25 @@ var Transmit = class {
     return __privateGet(this, _uid);
   }
   subscription(channel) {
+    if (__privateGet(this, _subscriptions).has(channel)) {
+      return __privateGet(this, _subscriptions).get(channel);
+    }
     const subscription = new Subscription({
       channel,
       httpClient: __privateGet(this, _httpClient2),
       hooks: __privateGet(this, _hooks2),
-      getEventSourceStatus: () => __privateGet(this, _status2)
+      getEventSourceStatus: () => __privateGet(this, _status2),
+      onDelete: () => __privateGet(this, _subscriptions).delete(channel)
     });
-    if (__privateGet(this, _subscriptions).has(channel)) {
-      return __privateGet(this, _subscriptions).get(channel);
-    }
     __privateGet(this, _subscriptions).set(channel, subscription);
     return subscription;
   }
   on(event, callback) {
     __privateGet(this, _eventTarget)?.addEventListener(event, callback);
   }
+  off(event, callback) {
+    __privateGet(this, _eventTarget)?.removeEventListener(event, callback);
+  }
   close() {
     __privateGet(this, _eventSource)?.close();
   }
@@ -382,23 +394,22 @@ _status2 = new WeakMap();
 _eventSource = new WeakMap();
 _eventTarget = new WeakMap();
 _reconnectAttempts = new WeakMap();
-_changeStatus = new WeakSet();
+_Transmit_instances = new WeakSet();
 changeStatus_fn = function(status) {
   __privateSet(this, _status2, status);
   __privateGet(this, _eventTarget)?.dispatchEvent(new CustomEvent(status));
 };
-_connect = new WeakSet();
 connect_fn = function() {
-  __privateMethod(this, _changeStatus, changeStatus_fn).call(this, TransmitStatus.Connecting);
+  __privateMethod(this, _Transmit_instances, changeStatus_fn).call(this, TransmitStatus.Connecting);
   const url = new URL(`${__privateGet(this, _options2).baseUrl}/__transmit/events`);
   url.searchParams.append("uid", __privateGet(this, _uid));
   __privateSet(this, _eventSource, __privateGet(this, _options2).eventSourceFactory(url, {
     withCredentials: true
   }));
-  __privateGet(this, _eventSource).addEventListener("message", __privateMethod(this, _onMessage, onMessage_fn).bind(this));
-  __privateGet(this, _eventSource).addEventListener("error", __privateMethod(this, _onError, onError_fn).bind(this));
+  __privateGet(this, _eventSource).addEventListener("message", __privateMethod(this, _Transmit_instances, onMessage_fn).bind(this));
+  __privateGet(this, _eventSource).addEventListener("error", __privateMethod(this, _Transmit_instances, onError_fn).bind(this));
   __privateGet(this, _eventSource).addEventListener("open", () => {
-    __privateMethod(this, _changeStatus, changeStatus_fn).call(this, TransmitStatus.Connected);
+    __privateMethod(this, _Transmit_instances, changeStatus_fn).call(this, TransmitStatus.Connected);
     __privateSet(this, _reconnectAttempts, 0);
     for (const subscription of __privateGet(this, _subscriptions).values()) {
       if (subscription.isCreated) {
@@ -407,7 +418,6 @@ connect_fn = function() {
     }
   });
 };
-_onMessage = new WeakSet();
 onMessage_fn = function(event) {
   const data = JSON.parse(event.data);
   const subscription = __privateGet(this, _subscriptions).get(data.channel);
@@ -417,15 +427,14 @@ onMessage_fn = function(event) {
   try {
     subscription.$runHandler(data.payload);
   } catch (error) {
-    console.log(error);
+    console.error(error);
   }
 };
-_onError = new WeakSet();
 onError_fn = function() {
   if (__privateGet(this, _status2) !== TransmitStatus.Reconnecting) {
-    __privateMethod(this, _changeStatus, changeStatus_fn).call(this, TransmitStatus.Disconnected);
+    __privateMethod(this, _Transmit_instances, changeStatus_fn).call(this, TransmitStatus.Disconnected);
   }
-  __privateMethod(this, _changeStatus, changeStatus_fn).call(this, TransmitStatus.Reconnecting);
+  __privateMethod(this, _Transmit_instances, changeStatus_fn).call(this, TransmitStatus.Reconnecting);
   __privateGet(this, _hooks2).onReconnectAttempt(__privateGet(this, _reconnectAttempts) + 1);
   if (__privateGet(this, _options2).maxReconnectAttempts && __privateGet(this, _reconnectAttempts) >= __privateGet(this, _options2).maxReconnectAttempts) {
     __privateGet(this, _eventSource).close();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adonisjs/transmit-client",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "A client for the native Server-Sent-Event module of AdonisJS.",
   "keywords": [
     "client",
@@ -29,20 +29,21 @@
     "test": "c8 node --loader ts-node/esm --enable-source-maps bin/test.ts"
   },
   "devDependencies": {
-    "@adonisjs/eslint-config": "^1.1.7",
-    "@adonisjs/prettier-config": "^1.1.7",
-    "@adonisjs/tsconfig": "^1.3.0",
-    "@japa/assert": "^2.0.0-2",
-    "@japa/runner": "^3.0.0-9",
-    "@swc/core": "^1.4.11",
-    "c8": "^9.1.0",
-    "del-cli": "^5.0.0",
-    "eslint": "^8.44.0",
-    "prettier": "^3.0.0",
-    "release-it": "^17.1.1",
+    "@adonisjs/eslint-config": "^3.0.0-next.9",
+    "@adonisjs/prettier-config": "^1.4.5",
+    "@adonisjs/tsconfig": "^1.4.1",
+    "@japa/assert": "^4.2.0",
+    "@japa/runner": "^5.3.0",
+    "@release-it/conventional-changelog": "^10.0.4",
+    "@swc/core": "^1.15.8",
+    "c8": "^10.1.3",
+    "del-cli": "^7.0.0",
+    "eslint": "^9.39.2",
+    "prettier": "^3.8.0",
+    "release-it": "^19.2.3",
     "ts-node": "^10.9.2",
-    "tsup": "^8.0.2",
-    "typescript": "^5.1.6"
+    "tsup": "^8.5.1",
+    "typescript": "^5.9.3"
   },
   "files": [
     "src",
@@ -51,13 +52,18 @@
   "engines": {
     "node": ">=18.16.0"
   },
-  "eslintConfig": {
-    "extends": "@adonisjs/eslint-config/package"
-  },
   "prettier": "@adonisjs/prettier-config",
   "publishConfig": {
-    "access": "public",
-    "tag": "latest"
+    "provenance": true,
+    "access": "public"
+  },
+  "homepage": "https://github.com/adonisjs/transmit-client#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/adonisjs/transmit-client.git"
+  },
+  "bugs": {
+    "url": "https://github.com/adonisjs/transmit-client/issues"
   },
   "tsup": {
     "dts": true,
@@ -72,14 +78,26 @@
   },
   "release-it": {
     "git": {
+      "requireCleanWorkingDir": true,
+      "requireUpstream": true,
       "commitMessage": "chore(release): ${version}",
       "tagAnnotation": "v${version}",
+      "push": true,
       "tagName": "v${version}"
     },
     "github": {
-      "release": true,
-      "releaseName": "v${version}",
-      "web": true
+      "release": true
+    },
+    "npm": {
+      "publish": true,
+      "skipChecks": true
+    },
+    "plugins": {
+      "@release-it/conventional-changelog": {
+        "preset": {
+          "name": "angular"
+        }
+      }
     }
   }
 }

package/src/subscription.ts

@@ -8,15 +8,16 @@
  */
 
 import { SubscriptionStatus } from './subscription_status.js'
-import { HttpClient } from './http_client.js'
-import { Hook } from './hook.js'
 import { TransmitStatus } from './transmit_status.js'
+import type { Hook } from './hook.js'
+import type { HttpClient } from './http_client.js'
 
 interface SubscriptionOptions {
   channel: string
   httpClient: HttpClient
   getEventSourceStatus: () => TransmitStatus
   hooks?: Hook
+  onDelete?: () => void
 }
 
 export class Subscription {
@@ -30,6 +31,11 @@ export class Subscription {
    */
   #hooks: Hook | undefined
 
+  /**
+   * Callback to call when the subscription is deleted.
+   */
+  readonly #onDelete: (() => void) | undefined
+
   /**
    * Channel name.
    */
@@ -45,6 +51,11 @@ export class Subscription {
    */
   #handlers = new Set<(message: any) => void>()
 
+  /**
+   * Pending create retry promise to avoid stacking timeouts.
+   */
+  #createPending: Promise<void> | null = null
+
   /**
    * Current status of the subscription.
    */
@@ -75,6 +86,7 @@ export class Subscription {
     this.#channel = options.channel
     this.#httpClient = options.httpClient
     this.#hooks = options.hooks
+    this.#onDelete = options.onDelete
     this.#getEventSourceStatus = options.getEventSourceStatus
   }
 
@@ -83,7 +95,12 @@ export class Subscription {
    */
   $runHandler(message: unknown) {
     for (const handler of this.#handlers) {
-      handler(message)
+      try {
+        handler(message)
+      } catch (error) {
+        // TODO: Rescue
+        console.error(error)
+      }
     }
   }
 
@@ -92,18 +109,31 @@ export class Subscription {
       return
     }
 
+    if (this.#getEventSourceStatus() !== TransmitStatus.Connected && this.#createPending) {
+      return this.#createPending
+    }
+
     return this.forceCreate()
   }
 
   async forceCreate() {
     if (this.#getEventSourceStatus() !== TransmitStatus.Connected) {
-      return new Promise((resolve) => {
+      if (this.#createPending) {
+        return this.#createPending
+      }
+
+      this.#createPending = new Promise((resolve) => {
         setTimeout(() => {
+          this.#createPending = null
           resolve(this.create())
         }, 100)
       })
+
+      return this.#createPending
     }
 
+    this.#createPending = null
+
     const request = this.#httpClient.createRequest('/__transmit/subscribe', {
       channel: this.#channel,
     })
@@ -149,6 +179,7 @@ export class Subscription {
 
       this.#status = SubscriptionStatus.Deleted
       this.#hooks?.onUnsubscription(this.#channel)
+      this.#onDelete?.()
     } catch (error) {}
   }
 

package/src/transmit.ts

@@ -19,8 +19,8 @@ interface TransmitOptions {
   eventSourceFactory?: (url: string | URL, options: { withCredentials: boolean }) => EventSource
   eventTargetFactory?: () => EventTarget | null
   httpClientFactory?: (baseUrl: string, uid: string) => HttpClient
-  beforeSubscribe?: (request: RequestInit) => void
-  beforeUnsubscribe?: (request: RequestInit) => void
+  beforeSubscribe?: (request: Request) => void
+  beforeUnsubscribe?: (request: Request) => void
   maxReconnectAttempts?: number
   onReconnectAttempt?: (attempt: number) => void
   onReconnectFailed?: () => void
@@ -181,7 +181,7 @@ export class Transmit {
       subscription.$runHandler(data.payload)
     } catch (error) {
       // TODO: Rescue
-      console.log(error)
+      console.error(error)
     }
   }
 
@@ -209,17 +209,18 @@ export class Transmit {
   }
 
   subscription(channel: string) {
+    if (this.#subscriptions.has(channel)) {
+      return this.#subscriptions.get(channel)!
+    }
+
     const subscription = new Subscription({
       channel,
       httpClient: this.#httpClient,
       hooks: this.#hooks,
       getEventSourceStatus: () => this.#status,
+      onDelete: () => this.#subscriptions.delete(channel),
     })
 
-    if (this.#subscriptions.has(channel)) {
-      return this.#subscriptions.get(channel)!
-    }
-
     this.#subscriptions.set(channel, subscription)
 
     return subscription
@@ -230,6 +231,11 @@ export class Transmit {
     this.#eventTarget?.addEventListener(event, callback)
   }
 
+  off(event: Exclude<TransmitStatus, 'connecting'>, callback: (event: CustomEvent) => void) {
+    // @ts-ignore
+    this.#eventTarget?.removeEventListener(event, callback)
+  }
+
   close() {
     this.#eventSource?.close()
   }