ref(ui): Convert metric rule create to functional component (#29274)

getsentry · Oct 13, 2021 · 9c49b7e · 9c49b7e
1 parent f26d50a
commit 9c49b7e
Showing 1 changed file with 25 additions and 28 deletions.
diff --git a/static/app/views/alerts/incidentRules/create.tsx b/static/app/views/alerts/incidentRules/create.tsx
@@ -1,4 +1,3 @@
-import {Component} from 'react';
 import {RouteComponentProps} from 'react-router';
 
 import {Organization, Project, Team} from 'app/types';
@@ -33,40 +32,38 @@ type Props = {
 /**
  * Show metric rules form with an empty rule. Redirects to alerts list after creation.
  */
-class IncidentRulesCreate extends Component<Props> {
-  handleSubmitSuccess = () => {
-    const {router} = this.props;
-    const {orgId} = this.props.params;
+function IncidentRulesCreate(props: Props) {
+  function handleSubmitSuccess() {
+    const {router} = props;
+    const {orgId} = props.params;
 
     metric.endTransaction({name: 'saveAlertRule'});
     router.push(`/organizations/${orgId}/alerts/rules/`);
-  };
+  }
 
-  render() {
-    const {project, eventView, wizardTemplate, sessionId, teams, ...props} = this.props;
-    const defaultRule = eventView
-      ? createRuleFromEventView(eventView)
-      : wizardTemplate
-      ? createRuleFromWizardTemplate(wizardTemplate)
-      : createDefaultRule();
+  const {project, eventView, wizardTemplate, sessionId, teams, ...otherProps} = props;
+  const defaultRule = eventView
+    ? createRuleFromEventView(eventView)
+    : wizardTemplate
+    ? createRuleFromWizardTemplate(wizardTemplate)
+    : createDefaultRule();
 
-    const userTeamIds = teams.filter(({isMember}) => isMember).map(({id}) => id);
+  const userTeamIds = teams.filter(({isMember}) => isMember).map(({id}) => id);
 
-    const projectTeamIds = new Set(project.teams.map(({id}) => id));
-    const defaultOwnerId = userTeamIds.find(id => projectTeamIds.has(id)) ?? null;
-    defaultRule.owner = defaultOwnerId && `team:${defaultOwnerId}`;
+  const projectTeamIds = new Set(project.teams.map(({id}) => id));
+  const defaultOwnerId = userTeamIds.find(id => projectTeamIds.has(id)) ?? null;
+  defaultRule.owner = defaultOwnerId && `team:${defaultOwnerId}`;
 
-    return (
-      <RuleForm
-        onSubmitSuccess={this.handleSubmitSuccess}
-        rule={{...defaultRule, projects: [project.slug]}}
-        sessionId={sessionId}
-        project={project}
-        userTeamIds={userTeamIds}
-        {...props}
-      />
-    );
-  }
+  return (
+    <RuleForm
+      onSubmitSuccess={handleSubmitSuccess}
+      rule={{...defaultRule, projects: [project.slug]}}
+      sessionId={sessionId}
+      project={project}
+      userTeamIds={userTeamIds}
+      {...otherProps}
+    />
+  );
 }
 
 export default withTeams(IncidentRulesCreate);