Apply PR comments

BrunoQuaresma · BrunoQuaresma · commit 013ccfffc8df · 2024-08-09T16:06:58.000Z
diff --git a/site/src/pages/DeploySettingsPage/NotificationsPage/NotificationsPage.tsx b/site/src/pages/DeploySettingsPage/NotificationsPage/NotificationsPage.tsx
@@ -184,7 +184,7 @@ const EventsView: FC<EventsViewProps> = ({
       {availableMethods.includes("smtp") &&
         deploymentValues.notifications?.email.smarthost === "" && (
           <Alert severity="warning">
-            SMTP notifications are enabled, but no smart host has been
+            SMTP notifications are enabled, but no smarthost has been
             configured.
           </Alert>
         )}
diff --git a/site/src/pages/ManagementSettingsPage/Sidebar.tsx b/site/src/pages/ManagementSettingsPage/Sidebar.tsx
@@ -3,6 +3,7 @@ import { useQuery } from "react-query";
 import { useLocation, useParams } from "react-router-dom";
 import { organizationsPermissions } from "api/queries/organizations";
 import { useAuthenticated } from "contexts/auth/RequireAuth";
+import { useDashboard } from "modules/dashboard/useDashboard";
 import {
   canEditOrganization,
   useOrganizationSettings,
@@ -19,6 +20,7 @@ import { type OrganizationWithPermissions, SidebarView } from "./SidebarView";
 export const Sidebar: FC = () => {
   const location = useLocation();
   const { permissions } = useAuthenticated();
+  const { experiments } = useDashboard();
   const { organizations } = useOrganizationSettings();
   const { organization: organizationName } = useParams() as {
     organization?: string;
@@ -54,6 +56,7 @@ export const Sidebar: FC = () => {
       activeOrganizationName={organizationName}
       organizations={editableOrgs}
       permissions={permissions}
+      experiments={experiments}
     />
   );
 };
diff --git a/site/src/pages/ManagementSettingsPage/SidebarView.stories.tsx b/site/src/pages/ManagementSettingsPage/SidebarView.stories.tsx
@@ -35,6 +35,7 @@ const meta: Meta<typeof SidebarView> = {
       },
     ],
     permissions: MockPermissions,
+    experiments: ["notifications"],
   },
 };
 
diff --git a/site/src/pages/ManagementSettingsPage/SidebarView.tsx b/site/src/pages/ManagementSettingsPage/SidebarView.tsx
@@ -4,7 +4,11 @@ import AddIcon from "@mui/icons-material/Add";
 import SettingsIcon from "@mui/icons-material/Settings";
 import type { FC, ReactNode } from "react";
 import { Link, NavLink } from "react-router-dom";
-import type { AuthorizationResponse, Organization } from "api/typesGenerated";
+import type {
+  AuthorizationResponse,
+  Experiments,
+  Organization,
+} from "api/typesGenerated";
 import { Loader } from "components/Loader/Loader";
 import { Sidebar as BaseSidebar } from "components/Sidebar/Sidebar";
 import { Stack } from "components/Stack/Stack";
@@ -26,6 +30,8 @@ interface SidebarProps {
   organizations: OrganizationWithPermissions[] | undefined;
   /** Site-wide permissions. */
   permissions: AuthorizationResponse;
+  /** Active experiments */
+  experiments: Experiments;
 }
 
 /**
@@ -36,13 +42,15 @@ export const SidebarView: FC<SidebarProps> = ({
   activeOrganizationName,
   organizations,
   permissions,
+  experiments,
 }) => {
   // TODO: Do something nice to scroll to the active org.
   return (
     <BaseSidebar>
       <header css={styles.sidebarHeader}>Deployment</header>
       <DeploymentSettingsNavigation
         active={!activeOrganizationName && activeSettings}
+        experiments={experiments}
         permissions={permissions}
       />
       <OrganizationsSettingsNavigation
@@ -59,6 +67,8 @@ interface DeploymentSettingsNavigationProps {
   active: boolean;
   /** Site-wide permissions. */
   permissions: AuthorizationResponse;
+  /** Active experiments */
+  experiments: Experiments;
 }
 
 /**
@@ -71,6 +81,7 @@ interface DeploymentSettingsNavigationProps {
 const DeploymentSettingsNavigation: FC<DeploymentSettingsNavigationProps> = ({
   active,
   permissions,
+  experiments,
 }) => {
   return (
     <div css={{ paddingBottom: 12 }}>
@@ -133,9 +144,11 @@ const DeploymentSettingsNavigation: FC<DeploymentSettingsNavigationProps> = ({
               Users
             </SidebarNavSubItem>
           )}
-          <SidebarNavSubItem href="notifications">
-            Notifications
-          </SidebarNavSubItem>
+          {experiments.includes("notifications") && (
+            <SidebarNavSubItem href="notifications">
+              Notifications
+            </SidebarNavSubItem>
+          )}
         </Stack>
       )}
     </div>
