8000 fix: update notifications code to use OWWS · coder/coder@423910f · GitHub
[go: up one dir, main page]
Skip to content

Commit 423910f

Browse files
ParkreinerParkreiner
committed
fix: update notifications code to use OWWS
1 parent 9b19ceb commit 423910f

File tree

2 files changed

+34
-45
lines changed

2 files changed

+34
-45
lines changed

‎site/src/api/api.ts

Lines changed: 9 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,6 @@ const getMissingParameters = (
102102
};
103103

104104
/**
105-
*
106105
* @param agentId
107106
* @returns {OneWayWebSocket} A OneWayWebSocket that emits Server-Sent Events.
108107
*/
@@ -125,38 +124,18 @@ export const watchWorkspace = (
125124
});
126125
};
127126

128-
type WatchInboxNotificationsParams = {
127+
type WatchInboxNotificationsParams = Readonly<{
129128
read_status?: "read" | "unread" | "all";
130-
};
129+
}>;
131130

132-
export const watchInboxNotifications = (
133-
onNewNotification: (res: TypesGen.GetInboxNotificationResponse) => void,
131+
export function watchInboxNotifications(
134132
params?: WatchInboxNotificationsParams,
135-
) => {
136-
const searchParams = new URLSearchParams(params);
137-
const socket = createWebSocket(
138-
"/api/v2/notifications/inbox/watch",
139-
searchParams,
140-
);
141-
142-
socket.addEventListener("message", (event) => {
143-
try {
144-
const res = JSON.parse(
145-
event.data,
146-
) as TypesGen.GetInboxNotificationResponse;
147-
onNewNotification(res);
148-
} catch (error) {
149-
console.warn("Error parsing inbox notification: ", error);
150-
}
151-
});
152-
153-
socket.addEventListener("error", (event) => {
154-
console.warn("Watch inbox notifications error: ", event);
155-
socket.close();
133+
): OneWayWebSocket<TypesGen.GetInboxNotificationResponse> {
134+
return new OneWayWebSocket({
135+
apiRoute: "/api/v2/notifications/inbox/watch",
136+
searchParams: params,
156137
});
157-
158-
return socket;
159-
};
138+
}
160139

161140
export const getURLWithSearchParams = (
162141
basePath: string,
@@ -2513,7 +2492,7 @@ function createWebSocket(
< 8000 /td>
25132492
) {
25142493
const protocol = location.protocol === "https:" ? "wss:" : "ws:";
25152494
const socket = new WebSocket(
2516-
`${protocol}//${location.host}${path}?${params.toString()}`,
2495+
`${protocol}//${location.host}${path}?${params}`,
25172496
);
25182497
socket.binaryType = "blob";
25192498
return socket;

‎site/src/modules/notifications/NotificationsInbox/NotificationsInbox.tsx

Lines changed: 25 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import { API, watchInboxNotifications } from "api/api";
1+
import { watchInboxNotifications } from "api/api";
22
import { getErrorDetail, getErrorMessage } from "api/errors";
33
import type {
44
ListInboxNotificationsResponse,
55
UpdateInboxNotificationReadStatusResponse,
66
} from "api/typesGenerated";
77
import { displayError } from "components/GlobalSnackbar/utils";
88
import { useEffectEvent } from "hooks/hookPolyfills";
9-
import { type FC, useEffect, useRef } from "react";
9+
import { type FC, useEffect } from "react";
1010
import { useMutation, useQuery, useQueryClient } from "react-query";
1111
import { InboxPopover } from "./InboxPopover";
1212

@@ -58,21 +58,31 @@ export const NotificationsInbox: FC<NotificationsInboxProps> = ({
5858
);
5959

6060
useEffect(() => {
61-
const socket = watchInboxNotifications(
62-
(res) => {
63-
updateNotificationsCache((prev) => {
64-
return {
65-
unread_count: res.unread_count,
66-
notifications: [res.notification, ...prev.notifications],
67-
};
68-
});
69-
},
70-
{ read_status: "unread" },
71-
);
61+
const socket = watchInboxNotifications({ read_status: "unread" });
7262

73-
return () => {
63+
socket.addEventListener("message", (e) => {
64+
if (e.parseError) {
65+
console.warn("Error parsing inbox notification: ", e.parseError);
66+
return;
67+
}
68+
69+
const msg = e.parsedMessage;
70+
updateNotificationsCache((prev) => {
71+
return {
72+
unread_count: msg.unread_count,
73+
notifications: [msg.notification, ...prev.notifications],
74+
};
75+
});
76+
});
77+
78+
socket.addEventListener("error", () => {
79+
displayError(
80+
"Unable to retrieve latest inbox notifications. Please try refreshing the browser.",
81+
);
7482
socket.close();
75-
};
83+
});
84+
85+
return () => socket.close();
7686
}, [updateNotificationsCache]);
7787

7888
const markAllAsReadMutation = useMutation({

0 commit comments

Comments
 (0)
0