feat(uptime): Render uptime form on create alert flow (#77768)

Paving the way for uptime alert creation, navigating to /new/uptime will
render the uptime form and will eventually be accessible from the wizard

static/app/views/alerts/create.tsx

@@ -17,6 +17,7 @@ import BuilderBreadCrumbs from 'sentry/views/alerts/builder/builderBreadCrumbs';
 import IssueRuleEditor from 'sentry/views/alerts/rules/issue';
 import MetricRulesCreate from 'sentry/views/alerts/rules/metric/create';
 import MetricRuleDuplicate from 'sentry/views/alerts/rules/metric/duplicate';
+import {UptimeAlertForm} from 'sentry/views/alerts/rules/uptime/uptimeAlertForm';
 import {AlertRuleType} from 'sentry/views/alerts/types';
 import type {
   AlertType as WizardAlertType,
@@ -141,16 +142,29 @@ function Create(props: Props) {
           <LoadingIndicator />
         ) : (
           <Fragment>
-            {(!hasMetricAlerts || alertType === AlertRuleType.ISSUE) && (
+            {organization.features.includes('uptime-api-create-update') &&
+            alertType === AlertRuleType.UPTIME ? (
+              <UptimeAlertForm
+                apiMethod="POST"
+                apiUrl={`/projects/${organization.slug}/${project.slug}/uptime/`}
+                project={project}
+                onSubmitSuccess={response => {
+                  router.push(
+                    normalizeUrl(
+                      `/organizations/${organization.slug}/alerts/rules/uptime/${project.slug}/${response.id}/details`
+                    )
+                  );
+                }}
+              />
+            ) : !hasMetricAlerts || alertType === AlertRuleType.ISSUE ? (
               <IssueRuleEditor
                 {...props}
                 project={project}
                 userTeamIds={teams.map(({id}) => id)}
                 members={members}
               />
-            )}
-
-            {hasMetricAlerts &&
+            ) : (
+              hasMetricAlerts &&
               alertType === AlertRuleType.METRIC &&
               (isDuplicateRule ? (
                 <MetricRuleDuplicate
@@ -170,7 +184,8 @@ function Create(props: Props) {
                   project={project}
                   userTeamIds={teams.map(({id}) => id)}
                 />
-              ))}
+              ))
+            )}
           </Fragment>
         )}
       </Layout.Body>

static/app/views/alerts/list/rules/alertRulesList.tsx

@@ -255,7 +255,9 @@ function AlertRulesList() {
                       const isIssueAlertInstance = isIssueAlert(rule);
                       const keyPrefix = isIssueAlertInstance
                         ? AlertRuleType.ISSUE
-                        : AlertRuleType.METRIC;
+                        : rule.type === CombinedAlertType.UPTIME
+                          ? AlertRuleType.UPTIME
+                          : AlertRuleType.METRIC;
 
                       return (
                         <RuleListRow

static/app/views/alerts/types.tsx

@@ -8,6 +8,7 @@ type Data = [number, {count: number}[]][];
 export enum AlertRuleType {
   METRIC = 'metric',
   ISSUE = 'issue',
+  UPTIME = 'uptime',
 }
 
 export type Incident = {