feat(client): event proxy (#620)

.changeset/smooth-kings-swim.md

@@ -0,0 +1,32 @@
+---
+"@pluv/client": patch
+---
+
+Added event proxy as a new way to invoke event procedures.
+
+```ts
+// backend
+
+const router = io.router({
+    SEND_MESSAGE: io.procedure
+        .input(z.object({ message: z.string() }))
+        .broadcast(({ message }) => ({ RECEIVE_MESSAGE: { message } })),
+});
+
+// frontend
+const client = createClient(/* ... */);
+
+// Both of the examples below are equivalent.
+
+client.event("RECEIVE_MESSAGE", ({ data }) => {
+    const { message } = data;
+
+    console.log(message);
+});
+
+client.event.RECEIVE_MESSAGE(({ data }) => {
+    const { message } = data;
+
+    console.log(message);
+});
+```

packages/client/src/PluvRoom.ts

@@ -319,11 +319,25 @@ export class PluvRoom<
         this._stateNotifier.subjects["my-presence"].next(null);
     }
 
-    public event = <TEvent extends keyof InferIOOutput<TIO>>(
+    public event = new Proxy(
+        <TEvent extends keyof InferIOOutput<TIO>>(
+            event: TEvent,
+            callback: EventNotifierSubscriptionCallback<TIO, TEvent>,
+        ): (() => void) => {
+            return this._eventNotifier.subscribe(event, callback);
+        },
+        {
+            get(fn, prop) {
+                return (callback: EventNotifierSubscriptionCallback<TIO, any>): (() => void) => {
+                    return fn(prop, callback);
+                };
+            },
+        },
+    ) as (<TEvent extends keyof InferIOOutput<TIO>>(
         event: TEvent,
         callback: EventNotifierSubscriptionCallback<TIO, TEvent>,
-    ): (() => void) => {
-        return this._eventNotifier.subscribe(event, callback);
+    ) => () => void) & {
+        [event in keyof InferIOOutput<TIO>]: (callback: EventNotifierSubscriptionCallback<TIO, event>) => () => void;
     };
 
     public getConnection(): WebSocketConnection {

tests/e2e/src/server/yjs/node/pluv-io.ts

@@ -3,7 +3,6 @@ import { createIO } from "@pluv/io";
 import { platformNode } from "@pluv/platform-node";
 import { z } from "zod";
 import { prisma } from "../../../prisma";
-import { InferIOOutput } from "@pluv/types";
 
 const PLUV_AUTH_SECRET = "secret123";