Add event to callback

.github/workflows/publish.yml

@@ -13,7 +13,7 @@ jobs:
         runs-on: ubuntu-latest
         strategy:
             matrix:
-                adapter: ["laravel-echo", "react", "vue"]
+                adapter: ["react"]
         steps:
             - name: Checkout
               uses: actions/checkout@v4
@@ -26,7 +26,7 @@ jobs:
             - uses: actions/setup-node@v4
               with:
                   node-version: "20"
-                  registry-url: "https://registry.npmjs.org"
+                  registry-url: "https://npm.pkg.github.com"
                   cache: pnpm
 
             # Ensure npm 11.5.1 or later is installed
@@ -38,3 +38,6 @@ jobs:
 
             - name: "Publish ${{ matrix.adapter }} to npm"
               run: pnpm -r --filter ./packages/laravel-echo --filter ./packages/${{ matrix.adapter }} build && cd ./packages/${{ matrix.adapter }} && pnpm run release
+              env:
+                NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+                NPM_TOKEN: ${{ secrets.GITHUB_TOKEN }}

packages/react/package.json

@@ -1,5 +1,5 @@
 {
-    "name": "@laravel/echo-react",
+    "name": "@xcoorp/echo-react",
     "version": "2.2.4",
     "description": "React hooks for seamless integration with Laravel Echo.",
     "keywords": [
@@ -11,13 +11,16 @@
     "homepage": "https://github.com/laravel/echo/tree/2.x/packages/react",
     "repository": {
         "type": "git",
-        "url": "https://github.com/laravel/echo"
+        "url": "https://github.com/xcoorp/echo"
     },
     "license": "MIT",
     "author": {
         "name": "Taylor Otwell"
     },
     "type": "module",
+    "publishConfig": {
+        "registry": "https://npm.pkg.github.com"
+    },
     "main": "dist/index.common.js",
     "module": "dist/index.js",
     "types": "dist/index.d.ts",

packages/react/src/hooks/use-echo.ts

@@ -76,7 +76,7 @@ export const useEcho = <
 >(
     channelName: string,
     event: string | string[] = [],
-    callback: (payload: TPayload) => void = () => {},
+    callback: (payload: TPayload, event: string) => void = () => {},
     dependencies: any[] = [],
     visibility: TVisibility = "private" as TVisibility,
 ) => {
@@ -103,7 +103,9 @@ export const useEcho = <
         }
 
         events.forEach((e) => {
-            subscription.current.stopListening(e, callbackFunc);
+            subscription.current.stopListening(e, (payload: TPayload) =>
+                callbackFunc(payload, e),
+            );
         });
 
         listening.current = false;
@@ -115,7 +117,9 @@ export const useEcho = <
         }
 
         events.forEach((e) => {
-            subscription.current.listen(e, callbackFunc);
+            subscription.current.listen(e, (payload: TPayload) =>
+                callbackFunc(payload, e),
+            );
         });
 
         listening.current = true;

packages/react/tests/use-echo.test.ts

@@ -124,18 +124,24 @@ describe("useEcho hook", async () => {
 
         const channel = echoInstance.private(channelName);
 
-        expect(channel.listen).toHaveBeenCalledWith(events[0], mockCallback);
-        expect(channel.listen).toHaveBeenCalledWith(events[1], mockCallback);
+        expect(channel.listen).toHaveBeenCalledWith(
+            events[0],
+            expect.any(Function),
+        );
+        expect(channel.listen).toHaveBeenCalledWith(
+            events[1],
+            expect.any(Function),
+        );
 
         expect(() => unmount()).not.toThrow();
 
         expect(channel.stopListening).toHaveBeenCalledWith(
             events[0],
-            mockCallback,
+            expect.any(Function),
         );
         expect(channel.stopListening).toHaveBeenCalledWith(
             events[1],
-            mockCallback,
+            expect.any(Function),
         );
     });
 
@@ -192,7 +198,7 @@ describe("useEcho hook", async () => {
 
         expect(echoInstance.private(channelName).listen).toHaveBeenCalledWith(
             event,
-            mockCallback,
+            expect.any(Function),
         );
     });
 
@@ -253,15 +259,24 @@ describe("useEcho hook", async () => {
 
         const channel = echoInstance.private(channelName);
 
-        expect(channel.listen).toHaveBeenCalledWith(event, mockCallback);
+        expect(channel.listen).toHaveBeenCalledWith(
+            event,
+            expect.any(Function),
+        );
 
         result.current.stopListening();
 
-        expect(channel.stopListening).toHaveBeenCalledWith(event, mockCallback);
+        expect(channel.stopListening).toHaveBeenCalledWith(
+            event,
+            expect.any(Function),
+        );
 
         result.current.listen();
 
-        expect(channel.listen).toHaveBeenCalledWith(event, mockCallback);
+        expect(channel.listen).toHaveBeenCalledWith(
+            event,
+            expect.any(Function),
+        );
     });
 
     it("can manually stop listening to events", async () => {
@@ -276,7 +291,10 @@ describe("useEcho hook", async () => {
         result.current.stopListening();
 
         const channel = echoInstance.private(channelName);
-        expect(channel.stopListening).toHaveBeenCalledWith(event, mockCallback);
+        expect(channel.stopListening).toHaveBeenCalledWith(
+            event,
+            expect.any(Function),
+        );
     });
 
     it("stopListening is a no-op when not listening", async () => {
@@ -389,22 +407,22 @@ describe("useEchoModel hook", async () => {
 
         expect(channel.listen).toHaveBeenCalledWith(
             `.${events[0]}`,
-            mockCallback,
+            expect.any(Function),
         );
         expect(channel.listen).toHaveBeenCalledWith(
             `.${events[1]}`,
-            mockCallback,
+            expect.any(Function),
         );
 
         expect(() => unmount()).not.toThrow();
 
         expect(channel.stopListening).toHaveBeenCalledWith(
             `.${events[0]}`,
-            mockCallback,
+            expect.any(Function),
         );
         expect(channel.stopListening).toHaveBeenCalledWith(
             `.${events[1]}`,
-            mockCallback,
+            expect.any(Function),
         );
     });
 
@@ -533,7 +551,10 @@ describe("useEchoModel hook", async () => {
         expect(echoInstance.private).toHaveBeenCalledWith(expectedChannelName);
 
         const channel = echoInstance.private(expectedChannelName);
-        expect(channel.listen).toHaveBeenCalledWith(`.${event}`, mockCallback);
+        expect(channel.listen).toHaveBeenCalledWith(
+            `.${event}`,
+            expect.any(Function),
+        );
     });
 
     it("events and listeners are optional", async () => {
@@ -603,18 +624,24 @@ describe("useEchoPublic hook", async () => {
 
         const channel = echoInstance.channel(channelName);
 
-        expect(channel.listen).toHaveBeenCalledWith(events[0], mockCallback);
-        expect(channel.listen).toHaveBeenCalledWith(events[1], mockCallback);
+        expect(channel.listen).toHaveBeenCalledWith(
+            events[0],
+            expect.any(Function),
+        );
+        expect(channel.listen).toHaveBeenCalledWith(
+            events[1],
+            expect.any(Function),
+        );
 
         expect(() => unmount()).not.toThrow();
 
         expect(channel.stopListening).toHaveBeenCalledWith(
             events[0],
-            mockCallback,
+            expect.any(Function),
         );
         expect(channel.stopListening).toHaveBeenCalledWith(
             events[1],
-            mockCallback,
+            expect.any(Function),
         );
     });
 
@@ -757,18 +784,24 @@ describe("useEchoPresence hook", async () => {
 
         const channel = echoInstance.join(channelName);
 
-        expect(channel.listen).toHaveBeenCalledWith(events[0], mockCallback);
-        expect(channel.listen).toHaveBeenCalledWith(events[1], mockCallback);
+        expect(channel.listen).toHaveBeenCalledWith(
+            events[0],
+            expect.any(Function),
+        );
+        expect(channel.listen).toHaveBeenCalledWith(
+            events[1],
+            expect.any(Function),
+        );
 
         expect(() => unmount()).not.toThrow();
 
         expect(channel.stopListening).toHaveBeenCalledWith(
             events[0],
-            mockCallback,
+            expect.any(Function),
         );
         expect(channel.stopListening).toHaveBeenCalledWith(
             events[1],
-            mockCallback,
+            expect.any(Function),
         );
     });