Skip to content

Commit 18b3f9a

Browse files
committed
refactored and added tests
1 parent f9ac6d2 commit 18b3f9a

File tree

3 files changed

+98
-23
lines changed

3 files changed

+98
-23
lines changed

site/src/api/queries/notifications.ts

Lines changed: 0 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -149,28 +149,7 @@ export const disableNotification = (
149149
[templateId]: true,
150150
},
151151
});
152-
153-
// Invalidate the user notification preferences query
154-
queryClient.invalidateQueries(userNotificationPreferencesKey(userId));
155-
156152
return result;
157153
},
158-
onSuccess: (_, templateId) => {
159-
const allTemplates = queryClient.getQueryData<NotificationTemplate[]>(
160-
systemNotificationTemplatesKey,
161-
);
162-
const template = allTemplates?.find((t) => t.id === templateId);
163-
164-
if (template) {
165-
displaySuccess(`${template.name} notification has been disabled`);
166-
} else {
167-
displaySuccess("Notification has been disabled");
168-
}
169-
},
170-
onError: () => {
171-
displayError(
172-
"An error occurred when attempting to disable the requested notification",
173-
);
174-
},
175154
} satisfies UseMutationOptions<NotificationPreference[], unknown, string>;
176155
};

site/src/pages/UserSettingsPage/NotificationsPage/NotificationsPage.stories.tsx

Lines changed: 72 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
import type { Meta, StoryObj } from "@storybook/react";
2-
import { spyOn, userEvent, within } from "@storybook/test";
2+
import { spyOn, userEvent, waitFor, within } from "@storybook/test";
33
import { API } from "api/api";
44
import {
55
notificationDispatchMethodsKey,
66
systemNotificationTemplatesKey,
77
userNotificationPreferencesKey,
88
} from "api/queries/notifications";
9+
import { http, HttpResponse } from "msw";
910
import {
1011
MockNotificationMethodsResponse,
1112
MockNotificationPreferences,
@@ -76,3 +77,73 @@ export const NonAdmin: Story = {
7677
permissions: { viewDeploymentValues: false },
7778
},
7879
};
80+
81+
export const DisableValidTemplate: Story = {
82+
parameters: {
83+
msw: {
84+
handlers: [
85+
http.put("/api/v2/users/:userId/notifications/preferences", () => {
86+
return HttpResponse.json([
87+
{ id: "valid-template-id", disabled: true },
88+
]);
89+
}),
90+
],
91+
},
92+
},
93+
play: async ({ canvasElement }) => {
94+
const canvas = within(canvasElement);
95+
96+
const validTemplateId = "valid-template-id";
97+
const validTemplateName = "Valid Template Name";
98+
99+
window.history.pushState({}, "", `?disabled=${validTemplateId}`);
100+
101+
await waitFor(
102+
async () => {
103+
const successMessage = await canvas.findByText(
104+
`${validTemplateName} notification has been disabled`,
105+
);
106+
expect(successMessage).toBeInTheDocument();
107+
},
108+
{ timeout: 10000 },
109+
);
110+
111+
await waitFor(
112+
async () => {
113+
const templateSwitch = await canvas.findByLabelText(validTemplateName);
114+
expect(templateSwitch).not.toBeChecked();
115+
},
116+
{ timeout: 10000 },
117+
);
118+
},
119+
};
120+
121+
export const DisableInvalidTemplate: Story = {
122+
parameters: {
123+
msw: {
124+
handlers: [
125+
http.put("/api/v2/users/:userId/notifications/preferences", () => {
126+
// Mock failed API response
127+
return new HttpResponse(null, { status: 400 });
128+
}),
129+
],
130+
},
131+
},
132+
play: async ({ canvasElement }) => {
133+
const canvas = within(canvasElement);
134+
135+
const invalidTemplateId = "invalid-template-id";
136+
137+
window.history.pushState({}, "", `?disabled=${invalidTemplateId}`);
138+
139+
await waitFor(
140+
async () => {
141+
const errorMessage = await canvas.findByText(
142+
"An error occurred when attempting to disable the requested notification",
143+
);
144+
expect(errorMessage).toBeInTheDocument();
145+
},
146+
{ timeout: 10000 },
147+
);
148+
},
149+
};

site/src/pages/UserSettingsPage/NotificationsPage/NotificationsPage.tsx

Lines changed: 26 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,13 +71,38 @@ export const NotificationsPage: FC = () => {
7171

7272
useEffect(() => {
7373
if (disabledId && templatesByGroup.isSuccess && templatesByGroup.data) {
74-
disableMutation.mutate(disabledId);
74+
searchParams.delete("disabled");
75+
disableMutation
76+
.mutateAsync(disabledId)
77+
.then(() => {
78+
const allTemplates = Object.values(
79+
templatesByGroup.data ?? {},
80+
).flat();
81+
const template = allTemplates.find((t) => t.id === disabledId);
82+
83+
if (template) {
84+
displaySuccess(`${template.name} notification has been disabled`);
85+
} else {
86+
displaySuccess("Notification has been disabled");
87+
}
88+
queryClient.invalidateQueries(
89+
userNotificationPreferences(user.id).queryKey,
90+
);
91+
})
92+
.catch(() => {
93+
displayError(
94+
"An error occurred when attempting to disable the requested notification",
95+
);
96+
});
7597
}
7698
}, [
7799
disabledId,
78100
templatesByGroup.isSuccess,
79101
templatesByGroup.data,
80102
disableMutation,
103+
queryClient,
104+
user.id,
105+
searchParams,
81106
]);
82107

83108
const ready =

0 commit comments

Comments
 (0)