feat(uptime):add-config-defaults

static/app/views/alerts/rules/uptime/uptimeAlertForm.spec.tsx

@@ -59,10 +59,6 @@ describe('Uptime Alert Form', function () {
 
     await userEvent.click(screen.getByRole('checkbox', {name: 'Allow Sampling'}));
 
-    const name = input('Uptime rule name');
-    await userEvent.clear(name);
-    await userEvent.type(name, 'New Uptime Rule');
-
     await selectEvent.select(input('Owner'), 'Foo Bar');
 
     const updateMock = MockApiClient.addMockResponse({
@@ -77,7 +73,7 @@ describe('Uptime Alert Form', function () {
       expect.objectContaining({
         data: expect.objectContaining({
           environment: 'prod',
-          name: 'New Uptime Rule',
+          name: 'Uptime Check for example.com',
           owner: 'user:1',
           url: 'http://example.com',
           method: 'POST',

static/app/views/alerts/rules/uptime/uptimeAlertForm.tsx

@@ -28,7 +28,6 @@ import type {Organization} from 'sentry/types/organization';
 import type {Project} from 'sentry/types/project';
 import getDuration from 'sentry/utils/duration/getDuration';
 import {useNavigate} from 'sentry/utils/useNavigate';
-import useOrganization from 'sentry/utils/useOrganization';
 import useProjects from 'sentry/utils/useProjects';
 import {makeAlertsPathname} from 'sentry/views/alerts/pathnames';
 import type {UptimeRule} from 'sentry/views/alerts/rules/uptime/types';
@@ -72,21 +71,50 @@ function getFormDataFromRule(rule: UptimeRule) {
   };
 }
 
-export function UptimeAlertForm({project, handleDelete, rule}: Props) {
+export function UptimeAlertForm({project, handleDelete, rule, organization}: Props) {
   const navigate = useNavigate();
-  const organization = useOrganization();
   const {projects} = useProjects();
 
   const initialData = rule
     ? getFormDataFromRule(rule)
-    : {projectSlug: project.slug, method: 'GET', headers: []};
+    : {
+        projectSlug: project.slug,
+        method: 'GET',
+        headers: [],
+        owner:
+          (organization as any).teams?.length === 1
+            ? `team:${(organization as any).teams[0].id}`
+            : undefined,
+      };
 
   const [formModel] = useState(() => new FormModel());
 
   const [knownEnvironments, setEnvironments] = useState<string[]>([]);
   const [newEnvironment, setNewEnvironment] = useState<string | undefined>(undefined);
   const environments = [newEnvironment, ...knownEnvironments].filter(Boolean);
 
+  // Suggest rule name from URL
+  useEffect(() => {
+    if (rule) {
+      return () => {};
+    }
+    return autorun(() => {
+      const url = formModel.getValue('url');
+      const name = formModel.getValue('name');
+      if (url && typeof url === 'string' && !name) {
+        try {
+          const urlObject = new URL(url);
+          const suggestedName = `Uptime Check for ${urlObject.hostname}${
+            urlObject.pathname === '/' ? '' : urlObject.pathname
+          }`;
+          formModel.setValue('name', suggestedName.replace(/\/$/, ''));
+        } catch (e) {
+          // do nothing
+        }
+      }
+    });
+  }, [formModel, rule]);
+
   // XXX(epurkhiser): The forms API endpoint is derived from the selcted
   // project. We don't have an easy way to interpolate this into the <Form />
   // components `apiEndpoint` prop, so instead we setup a mobx observer on
@@ -113,6 +141,9 @@ export function UptimeAlertForm({project, handleDelete, rule}: Props) {
 
         if (selectedProject) {
           setEnvironments(selectedProject.environments);
+          if (selectedProject.environments.length === 1 && !rule) {
+            formModel.setValue('environment', selectedProject.environments[0]);
+          }
         }
       }),
     [formModel, navigate, organization, projects, rule]