fix websocket

apps/api/src/controllers/live.controller.ts

@@ -111,24 +111,6 @@ export function wsVisitors(
   });
 }
 
-export function wsEvents(connection: { socket: WebSocket }) {
-  redisSub.subscribe('event:saved');
-
-  const message = (channel: string, message: string) => {
-    const event = getSuperJson<IServiceCreateEventPayload>(message);
-    if (event) {
-      connection.socket.send(superjson.stringify(transformMinimalEvent(event)));
-    }
-  };
-
-  redisSub.on('message', message);
-
-  connection.socket.on('close', () => {
-    redisSub.unsubscribe('event:saved');
-    redisSub.off('message', message);
-  });
-}
-
 export async function wsProjectEvents(
   connection: {
     socket: WebSocket;
@@ -139,11 +121,19 @@ export async function wsProjectEvents(
     };
     Querystring: {
       token?: string;
+      type?: string;
     };
   }>
 ) {
   const { params, query } = req;
   const { token } = query;
+  const type = query.type || 'saved';
+  if (!['saved', 'received'].includes(type)) {
+    connection.socket.send('Invalid type');
+    connection.socket.close();
+    return;
+  }
+  const subscribeToEvent = `event:${type}`;
   const decoded = validateClerkJwt(token);
   const userId = decoded?.sub;
   const access = await getProjectAccess({
@@ -151,7 +141,7 @@ export async function wsProjectEvents(
     projectId: params.projectId,
   });
 
-  redisSub.subscribe('event:saved');
+  redisSub.subscribe(subscribeToEvent);
 
   const message = async (channel: string, message: string) => {
     const event = getSuperJson<IServiceCreateEventPayload>(message);
@@ -173,7 +163,7 @@ export async function wsProjectEvents(
   redisSub.on('message', message as any);
 
   connection.socket.on('close', () => {
-    redisSub.unsubscribe('event:saved');
+    redisSub.unsubscribe(subscribeToEvent);
     redisSub.off('message', message as any);
   });
 }

apps/api/src/routes/live.router.ts

@@ -22,7 +22,6 @@ const liveRouter: FastifyPluginCallback = (fastify, opts, done) => {
       { websocket: true },
       controller.wsVisitors
     );
-    fastify.get('/events', { websocket: true }, controller.wsEvents);
     fastify.get(
       '/events/:projectId',
       { websocket: true },

apps/dashboard/src/app/(onboarding)/onboarding/[projectId]/verify/onboarding-verify-listener.tsx

@@ -26,7 +26,7 @@ const VerifyListener = ({ client, events: _events, onVerified }: Props) => {
     _events ?? []
   );
   useWS<IServiceCreateEventPayload>(
-    `/live/events/${client?.projectId}`,
+    `/live/events/${client?.projectId}?type=received`,
     (data) => {
       setEvents((prev) => [...prev, data]);
       onVerified(true);

apps/dashboard/src/hooks/useWS.ts

@@ -24,10 +24,13 @@ export default function useWS<T>(
     .replace(/^http/, 'ws');
   const [baseUrl, setBaseUrl] = useState(`${ws}${path}`);
   const [token, setToken] = useState<string | null>(null);
-  const socketUrl = useMemo(
+  const socketUrl = useMemo(() => {
-    () => (token ? `${baseUrl}?token=${token}` : baseUrl),
+    const parseUrl = new URL(baseUrl);
-    [baseUrl, token]
+    if (token) {
-  );
+      parseUrl.searchParams.set('token', token);
+    }
+    return parseUrl.toString();
+  }, [baseUrl, token]);
 
   const debouncedOnMessage = useMemo(() => {
     if (options?.debounce) {