eventemitter not having any listeners on websocket

import { EventEmitter } from "events";
import { initTRPC } from "@trpc/server";
import { observable } from "@trpc/server/observable";

const ee = new EventEmitter();

const t = initTRPC.create();

export const wsRouter = t.router({
   onAdd: t.procedure.subscription(() => {
      return observable((emit) => {
         const onAdd = (data: any) => {
            console.log("EMIT BABY!");
            emit.next(data);
         };
         ee.on("add", onAdd);
         return () => {
            ee.off("add", onAdd);
         };
      });
   }),
   add: t.procedure.query(async () => {
      const post = "hi";
      ee.emit("add", post);
      return post;
   }),
});

"use client";

import { useEffect } from "react";

import { client } from "~/trpc/ws";

const Page = () => {
   useEffect(() => {
      const subscription = client.ws.onAdd.subscribe(undefined, {
         onData(data) {
            console.log(data);
         },
      });
   }, []);

   return (
      <div>
         <h1>hi</h1>
      </div>
   );
};

export default Page;