feat(active-release): Add notification settings active release (#36720)

static/app/data/forms/accountNotificationSettings.tsx

@@ -1,4 +1,4 @@
-import {Field, JsonFormObject} from 'sentry/components/forms/type';
+import {Field} from 'sentry/components/forms/type';
 import {t} from 'sentry/locale';
 
 // TODO: cleanup unused fields and exports
@@ -59,37 +59,3 @@ export const fields: {[key: string]: Field} = {
     help: t("You'll receive notifications about any changes that happen afterwards."),
   },
 };
-
-const formGroups: JsonFormObject[] = [
-  {
-    title: t('Alerts'),
-    fields: [fields.subscribeByDefault],
-  },
-
-  {
-    title: t('Workflow Notifications'),
-    fields: [fields.workflowNotifications],
-  },
-
-  {
-    title: t('Email Routing'),
-    fields: [],
-  },
-
-  {
-    title: t('Weekly Reports'),
-    fields: [],
-  },
-
-  {
-    title: t('Deploy Notifications'),
-    fields: [fields.deployNotifications],
-  },
-
-  {
-    title: t('My Activity'),
-    fields: [fields.personalActivityNotifications, fields.selfAssignOnResolve],
-  },
-];
-
-export default formGroups;

static/app/views/settings/account/accountNotificationFineTuning.tsx

@@ -169,7 +169,11 @@ class AccountNotificationFineTuning extends AsyncView<Props, State> {
     const {params} = this.props;
     const {fineTuneType} = params;
 
-    if (['alerts', 'deploy', 'workflow', 'approval', 'quota'].includes(fineTuneType)) {
+    if (
+      ['alerts', 'deploy', 'workflow', 'activeRelease', 'approval', 'quota'].includes(
+        fineTuneType
+      )
+    ) {
       return <NotificationSettingsByType notificationType={fineTuneType} />;
     }
 

static/app/views/settings/account/notifications/constants.tsx

@@ -28,6 +28,7 @@ export type NotificationSettingsObject = {
 
 export const NOTIFICATION_SETTINGS_TYPES = [
   'alerts',
+  'activeRelease',
   'workflow',
   'deploy',
   'approval',

static/app/views/settings/account/notifications/fields.tsx

@@ -41,6 +41,19 @@ export const ACCOUNT_NOTIFICATION_FIELDS: Record<string, FineTuneField> = {
     defaultValue: '-1',
     defaultFieldName: 'workflowNotifications',
   },
+  activeRelease: {
+    title: 'Issues in My Releases',
+    description: t(
+      'Get a notification when an issue happens shortly after your release.'
+    ),
+    type: 'select',
+    defaultValue: '0',
+    options: [
+      {value: '1', label: t('On')},
+      {value: '0', label: t('Off')},
+    ],
+    defaultFieldName: 'activeReleaseNotifications',
+  },
   deploy: {
     title: t('Deploy Notifications'),
     description: t(

static/app/views/settings/account/notifications/fields2.tsx

@@ -1,3 +1,6 @@
+import {Fragment} from 'react';
+
+import FeatureBadge from 'sentry/components/featureBadge';
 import {Field} from 'sentry/components/forms/type';
 import ExternalLink from 'sentry/components/links/externalLink';
 import {t, tct} from 'sentry/locale';
@@ -14,6 +17,20 @@ export const NOTIFICATION_SETTING_FIELDS: Record<string, Field> = {
     ],
     help: t('Notifications sent from Alert rules that your team has set up.'),
   },
+  activeRelease: {
+    name: 'activeRelease',
+    type: 'select',
+    label: (
+      <Fragment>
+        {t('Issues in My Releases')} <FeatureBadge type="alpha" />
+      </Fragment>
+    ),
+    choices: [
+      ['always', t('On')],
+      ['never', t('Off')],
+    ],
+    help: t('Get a notification when an issue happens shortly after your release.'),
+  },
   workflow: {
     name: 'workflow',
     type: 'select',

static/app/views/settings/account/notifications/notificationSettings.tsx

@@ -94,12 +94,24 @@ class NotificationSettings extends AsyncComponent<Props, State> {
   };
 
   get notificationSettingsType() {
-    const hasFeatureFlag =
-      this.props.organizations.filter(org =>
-        org.features?.includes('slack-overage-notifications')
-      ).length > 0;
     // filter out quotas if the feature flag isn't set
-    return NOTIFICATION_SETTINGS_TYPES.filter(type => type !== 'quota' || hasFeatureFlag);
+    const hasSlackOverage = this.props.organizations.some(org =>
+      org.features?.includes('slack-overage-notifications')
+    );
+    const hasActiveRelease = this.props.organizations.some(org =>
+      org.features?.includes('active-release-monitor-alpha')
+    );
+
+    return NOTIFICATION_SETTINGS_TYPES.filter(type => {
+      if (type === 'quota' && !hasSlackOverage) {
+        return false;
+      }
+      if (type === 'activeRelease' && !hasActiveRelease) {
+        return false;
+      }
+
+      return true;
+    });
   }
 
   getInitialData(): {[key: string]: string} {

static/app/views/settings/account/notifications/utils.tsx

@@ -17,7 +17,7 @@ import ParentLabel from 'sentry/views/settings/account/notifications/parentLabel
  * Which fine-tuning parts are grouped by project
  */
 export const isGroupedByProject = (notificationType: string): boolean =>
-  ['alerts', 'email', 'workflow'].includes(notificationType);
+  ['alerts', 'email', 'workflow', 'activeRelease'].includes(notificationType);
 
 export const getParentKey = (notificationType: string): string => {
   return isGroupedByProject(notificationType) ? 'project' : 'organization';

tests/js/spec/views/settings/account/notifications/notificationSettings.spec.tsx

@@ -53,6 +53,20 @@ describe('NotificationSettings', function () {
       {features: ['slack-overage-notifications']}
     );
 
+    // There are 9 notification setting Selects/Toggles.
+    const fields = wrapper.find('Field');
+    expect(fields).toHaveLength(9);
+  });
+  it('renders active release monitor', function () {
+    const wrapper = createWrapper(
+      {
+        alerts: {user: {me: {email: 'never', slack: 'never'}}},
+        deploy: {user: {me: {email: 'never', slack: 'never'}}},
+        workflow: {user: {me: {email: 'never', slack: 'never'}}},
+      },
+      {features: ['active-release-monitor-alpha']}
+    );
+
     // There are 9 notification setting Selects/Toggles.
     const fields = wrapper.find('Field');
     expect(fields).toHaveLength(9);