Jul 31, 2025 · Jul 31, 2025
diff --git a/site/src/pages/UserSettingsPage/NotificationsPage/NotificationsPage.stories.tsx b/site/src/pages/UserSettingsPage/NotificationsPage/NotificationsPage.stories.tsx
 },
 ],
 user: MockUserOwner,
 permissions: {viewDeploymentConfig: true },
 permissions: {createTemplates: true, createUser: true },
 },
 decorators: [withGlobalSnackbar, withAuthProvider, withDashboardProvider],
 } satisfies Meta<typeof NotificationsPage>;

 export const NonAdmin: Story = {
 parameters: {
 permissions: {viewDeploymentConfig: false },
 permissions: {createTemplates: false, createUser: false },
 },
 };

 export constTemplateCreator: Story = {
 export constTemplateAdmin: Story = {
 parameters: {
 permissions: { viewDeploymentConfig: false, createTemplates: true },
 permissions: { createTemplates: true, createUser: false },
 },
 };

 export const UserAdmin: Story = {
 parameters: {
 permissions: { createTemplates: false, createUser: true },
 },
 };

diff --git a/site/src/pages/UserSettingsPage/NotificationsPage/NotificationsPage.tsx b/site/src/pages/UserSettingsPage/NotificationsPage/NotificationsPage.tsx
 methodIcons,
 methodLabels,
 } from "modules/notifications/utils";
 import type { Permissions } from "modules/permissions";
 import { type FC, Fragment } from "react";
 import { useEffect } from "react";
 import { Helmet } from "react-helmet-async";
 },
 {
 ...systemNotificationTemplates(),
 select: (data: NotificationTemplate[]) => {
 const groups = selectTemplatesByGroup(data);

 let displayedGroups: Record<string, NotificationTemplate[]> = {
 // Members only have access to the "Workspace Notifications" group.
 "Workspace Events": groups["Workspace Events"],
 };

 if (permissions.viewDeploymentConfig) {
 displayedGroups = groups;
 } else if (permissions.createTemplates) {
 displayedGroups["Template Events"] = groups["Template Events"];
 }

 return displayedGroups;
 },
 select: (data: NotificationTemplate[]) => selectTemplatesByGroup(data),
 },
 notificationDispatchMethods(),
 ],
 {ready ? (
 <Stack spacing={4}>
 {Object.entries(templatesByGroup.data).map(([group, templates]) => {
 if (!canSeeNotificationGroup(group, permissions)) {
 return null;
 }

 const allDisabled = templates.some((tpl) => {
 return notificationIsDisabled(disabledPreferences.data, tpl);
 });

 export default NotificationsPage;

 function canSeeNotificationGroup(
 group: string,
 permissions: Permissions,
 ): boolean {
 switch (group) {
 case "Workspace Events":
 return true;
 case "Template Events":
 return permissions.createTemplates;
 case "User Events":
 return permissions.createUser;
 default:
 return false;
 }
 }

 function notificationIsDisabled(
 disabledPreferences: Record<string, boolean>,
 tmpl: NotificationTemplate,
Original file line number	Diff line number	Diff line change
Expand Up		@@ -40,7 +40,7 @@ const meta = {
		},
		],
		user: MockUserOwner,
		permissions: {viewDeploymentConfig: true },
		permissions: {createTemplates: true, createUser: true },
		},
		decorators: [withGlobalSnackbar, withAuthProvider, withDashboardProvider],
		} satisfies Meta<typeof NotificationsPage>;
Expand DownExpand Up		@@ -74,13 +74,19 @@ export const ToggleNotification: Story = {

		export const NonAdmin: Story = {
		parameters: {
		permissions: {viewDeploymentConfig: false },
		permissions: {createTemplates: false, createUser: false },
		},
		};

		export constTemplateCreator: Story = {
		export constTemplateAdmin: Story = {
		parameters: {
		permissions: { viewDeploymentConfig: false, createTemplates: true },
		permissions: { createTemplates: true, createUser: false },
		},
		};

		export const UserAdmin: Story = {
		parameters: {
		permissions: { createTemplates: false, createUser: true },
		},
		};

Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -28,6 +28,7 @@ import {
		methodIcons,
		methodLabels,
		} from "modules/notifications/utils";
		import type { Permissions } from "modules/permissions";
		import { type FC, Fragment } from "react";
		import { useEffect } from "react";
		import { Helmet } from "react-helmet-async";
Expand All		@@ -46,22 +47,7 @@ const NotificationsPage: FC = () => {
		},
		{
		...systemNotificationTemplates(),
		select: (data: NotificationTemplate[]) => {
		const groups = selectTemplatesByGroup(data);

		let displayedGroups: Record<string, NotificationTemplate[]> = {
		// Members only have access to the "Workspace Notifications" group.
		"Workspace Events": groups["Workspace Events"],
		};

		if (permissions.viewDeploymentConfig) {
		displayedGroups = groups;
		} else if (permissions.createTemplates) {
		displayedGroups["Template Events"] = groups["Template Events"];
		}

		return displayedGroups;
		},
		select: (data: NotificationTemplate[]) => selectTemplatesByGroup(data),
		},
		notificationDispatchMethods(),
		],
Expand DownExpand Up		@@ -110,6 +96,10 @@ const NotificationsPage: FC = () => {
		{ready ? (
		<Stack spacing={4}>
		{Object.entries(templatesByGroup.data).map(([group, templates]) => {
		if (!canSeeNotificationGroup(group, permissions)) {
		return null;
		}

		const allDisabled = templates.some((tpl) => {
		return notificationIsDisabled(disabledPreferences.data, tpl);
		});
Expand DownExpand Up		@@ -218,6 +208,22 @@ const NotificationsPage: FC = () => {

		export default NotificationsPage;

		function canSeeNotificationGroup(
		group: string,
		permissions: Permissions,
		): boolean {
		switch (group) {
		case "Workspace Events":
		return true;
		case "Template Events":
		return permissions.createTemplates;
		case "User Events":
		return permissions.createUser;
		default:
		return false;
		}
		}

		function notificationIsDisabled(
		disabledPreferences: Record<string, boolean>,
		tmpl: NotificationTemplate,
Expand Down