feat(nav): Update alert links from explore/insights/crons (#85254)

malwilley · web-flow · commit 6c9398613357 · 2025-02-14T12:01:26.000-08:00
diff --git a/static/app/views/explore/components/chartContextMenu.tsx b/static/app/views/explore/components/chartContextMenu.tsx
@@ -42,7 +42,7 @@ function ChartContextMenu({
       query,
       pageFilters: pageFilters.selection,
       aggregate: yAxis,
-      orgSlug: organization.slug,
+      organization,
       dataset: Dataset.EVENTS_ANALYTICS_PLATFORM,
       interval,
     }),
diff --git a/static/app/views/explore/toolbar/toolbarSaveAs.tsx b/static/app/views/explore/toolbar/toolbarSaveAs.tsx
@@ -46,7 +46,7 @@ export function ToolbarSaveAs() {
       query,
       pageFilters: pageFilters.selection,
       aggregate: yAxis,
-      orgSlug: organization.slug,
+      organization,
       dataset: Dataset.EVENTS_ANALYTICS_PLATFORM,
       interval,
     }),
diff --git a/static/app/views/insights/common/utils/getAlertsUrl.spec.tsx b/static/app/views/insights/common/utils/getAlertsUrl.spec.tsx
@@ -1,3 +1,4 @@
+import {OrganizationFixture} from 'sentry-fixture/organization';
 import {PageFiltersFixture} from 'sentry-fixture/pageFilters';
 
 import {initializeOrg} from 'sentry-test/initializeOrg';
@@ -16,7 +17,7 @@ describe('getAlertsUrl', function () {
       project,
       aggregate,
       query,
-      orgSlug,
+      organization: OrganizationFixture({slug: orgSlug}),
       pageFilters,
     });
     expect(url).toBe(
@@ -31,7 +32,7 @@ describe('getAlertsUrl', function () {
       project,
       aggregate,
       query,
-      orgSlug,
+      organization: OrganizationFixture({slug: orgSlug}),
       pageFilters,
       dataset: Dataset.EVENTS_ANALYTICS_PLATFORM,
     });
diff --git a/static/app/views/insights/common/utils/getAlertsUrl.tsx b/static/app/views/insights/common/utils/getAlertsUrl.tsx
@@ -1,22 +1,23 @@
 import * as qs from 'query-string';
 
 import type {PageFilters} from 'sentry/types/core';
+import type {Organization} from 'sentry/types/organization';
 import type {Project} from 'sentry/types/project';
-import normalizeUrl from 'sentry/utils/url/normalizeUrl';
+import {makeAlertsPathname} from 'sentry/views/alerts/pathnames';
 import {Dataset} from 'sentry/views/alerts/rules/metric/types';
 
 export function getAlertsUrl({
   project,
   query,
   aggregate,
-  orgSlug,
+  organization,
   pageFilters,
   name,
   interval,
   dataset = Dataset.GENERIC_METRICS,
 }: {
   aggregate: string;
-  orgSlug: string;
+  organization: Organization;
   pageFilters: PageFilters;
   dataset?: Dataset;
   interval?: string;
@@ -38,8 +39,12 @@ export function getAlertsUrl({
     name,
     interval: supportedInterval,
   };
-  return normalizeUrl(
-    `/organizations/${orgSlug}/alerts/new/metric/?${qs.stringify(queryParams)}`
+
+  return (
+    makeAlertsPathname({
+      path: `/new/metric/`,
+      organization,
+    }) + `?${qs.stringify(queryParams)}`
   );
 }
 
diff --git a/static/app/views/insights/uptime/components/overviewTimeline/overviewRow.tsx b/static/app/views/insights/uptime/components/overviewTimeline/overviewRow.tsx
@@ -16,6 +16,7 @@ import getDuration from 'sentry/utils/duration/getDuration';
 import {useLocation} from 'sentry/utils/useLocation';
 import useOrganization from 'sentry/utils/useOrganization';
 import useProjectFromSlug from 'sentry/utils/useProjectFromSlug';
+import {makeAlertsPathname} from 'sentry/views/alerts/pathnames';
 import type {UptimeRule} from 'sentry/views/alerts/rules/uptime/types';
 
 import {checkStatusPrecedent, statusToText, tickStyle} from '../../timelineConfig';
@@ -51,7 +52,10 @@ export function OverviewRow({uptimeRule, timeWindowConfig, singleRuleView}: Prop
     <DetailsArea>
       <DetailsLink
         to={{
-          pathname: `/organizations/${organization.slug}/alerts/rules/uptime/${uptimeRule.projectSlug}/${uptimeRule.id}/details/`,
+          pathname: makeAlertsPathname({
+            path: `/rules/uptime/${uptimeRule.projectSlug}/${uptimeRule.id}/details/`,
+            organization,
+          }),
           query,
         }}
       >
diff --git a/static/app/views/insights/uptime/views/overview.tsx b/static/app/views/insights/uptime/views/overview.tsx
@@ -26,6 +26,7 @@ import useRouteAnalyticsParams from 'sentry/utils/routeAnalytics/useRouteAnalyti
 import {useLocation} from 'sentry/utils/useLocation';
 import {useNavigate} from 'sentry/utils/useNavigate';
 import useOrganization from 'sentry/utils/useOrganization';
+import {makeAlertsPathname} from 'sentry/views/alerts/pathnames';
 import type {UptimeRule} from 'sentry/views/alerts/rules/uptime/types';
 import {ModulePageProviders} from 'sentry/views/insights/common/components/modulePageProviders';
 import {BackendHeader} from 'sentry/views/insights/pages/backend/backendPageHeader';
@@ -108,7 +109,10 @@ export default function UptimeOverview() {
               }
               size="sm"
               priority="primary"
-              to={`/organizations/${organization.slug}/alerts/new/uptime/`}
+              to={makeAlertsPathname({
+                path: `/new/uptime/`,
+                organization,
+              })}
               icon={<IconAdd isCircled />}
             >
               {t('Add Uptime Monitor')}
@@ -157,7 +161,10 @@ export default function UptimeOverview() {
                   <LinkButton
                     size="sm"
                     priority="primary"
-                    to={`/organizations/${organization.slug}/alerts/new/uptime/`}
+                    to={makeAlertsPathname({
+                      path: `/new/uptime/`,
+                      organization,
+                    })}
                     icon={<IconAdd isCircled />}
                   >
                     {t('Add Uptime Monitor')}
diff --git a/static/app/views/monitors/components/monitorForm.tsx b/static/app/views/monitors/components/monitorForm.tsx
@@ -30,6 +30,7 @@ import commonTheme from 'sentry/utils/theme';
 import useOrganization from 'sentry/utils/useOrganization';
 import usePageFilters from 'sentry/utils/usePageFilters';
 import useProjects from 'sentry/utils/useProjects';
+import {makeAlertsPathname} from 'sentry/views/alerts/pathnames';
 import {getScheduleIntervals} from 'sentry/views/monitors/utils';
 import {crontabAsText} from 'sentry/views/monitors/utils/crontabAsText';
 
@@ -494,7 +495,10 @@ function MonitorForm({
           {monitor?.config.alert_rule_id && (
             <AlertLink
               priority="muted"
-              to={`/organizations/${organization.slug}/alerts/rules/${monitor.project.slug}/${monitor.config.alert_rule_id}/`}
+              to={makeAlertsPathname({
+                path: `/rules/${monitor.project.slug}/${monitor.config.alert_rule_id}/`,
+                organization,
+              })}
               withoutMarginBottom
             >
               {t('Customize this monitors notification configuration in Alerts')}
diff --git a/static/app/views/monitors/components/monitorHeader.tsx b/static/app/views/monitors/components/monitorHeader.tsx
@@ -2,6 +2,8 @@ import {Breadcrumbs} from 'sentry/components/breadcrumbs';
 import IdBadge from 'sentry/components/idBadge';
 import * as Layout from 'sentry/components/layouts/thirds';
 import {t} from 'sentry/locale';
+import useOrganization from 'sentry/utils/useOrganization';
+import {makeAlertsPathname} from 'sentry/views/alerts/pathnames';
 
 import type {Monitor} from '../types';
 
@@ -18,11 +20,15 @@ interface Props {
 }
 
 export function MonitorHeader({monitor, orgSlug, onUpdate, linkToAlerts}: Props) {
+  const organization = useOrganization();
   const crumbs = [
     {
       label: linkToAlerts ? t('Alerts') : t('Crons'),
       to: linkToAlerts
-        ? `/organizations/${orgSlug}/alerts/rules/`
+        ? makeAlertsPathname({
+            path: `/rules/`,
+            organization,
+          })
         : `/organizations/${orgSlug}/crons/`,
       preservePageFilters: true,
     },
diff --git a/static/app/views/monitors/components/monitorHeaderActions.tsx b/static/app/views/monitors/components/monitorHeaderActions.tsx
@@ -8,7 +8,9 @@ import {t} from 'sentry/locale';
 import {browserHistory} from 'sentry/utils/browserHistory';
 import normalizeUrl from 'sentry/utils/url/normalizeUrl';
 import useApi from 'sentry/utils/useApi';
+import useOrganization from 'sentry/utils/useOrganization';
 import usePageFilters from 'sentry/utils/usePageFilters';
+import {makeAlertsPathname} from 'sentry/views/alerts/pathnames';
 
 import type {Monitor} from '../types';
 
@@ -26,6 +28,7 @@ type Props = {
 
 function MonitorHeaderActions({monitor, orgSlug, onUpdate, linkToAlerts}: Props) {
   const api = useApi();
+  const organization = useOrganization();
   const {selection} = usePageFilters();
 
   const endpointOptions = {
@@ -81,7 +84,10 @@ function MonitorHeaderActions({monitor, orgSlug, onUpdate, linkToAlerts}: Props)
         icon={<IconEdit />}
         to={{
           pathname: linkToAlerts
-            ? `/organizations/${orgSlug}/alerts/crons-rules/${monitor.project.slug}/${monitor.slug}/`
+            ? makeAlertsPathname({
+                path: `/crons-rules/${monitor.project.slug}/${monitor.slug}/`,
+                organization,
+              })
             : `/organizations/${orgSlug}/crons/${monitor.project.slug}/${monitor.slug}/edit/`,
           // TODO(davidenwang): Right now we have to pass the environment
           // through the URL so that when we save the monitor and are
diff --git a/static/app/views/monitors/components/newMonitorButton.tsx b/static/app/views/monitors/components/newMonitorButton.tsx
@@ -2,6 +2,7 @@ import type {LinkButtonProps} from 'sentry/components/button';
 import {LinkButton} from 'sentry/components/button';
 import useOrganization from 'sentry/utils/useOrganization';
 import usePageFilters from 'sentry/utils/usePageFilters';
+import {makeAlertsPathname} from 'sentry/views/alerts/pathnames';
 
 interface Props extends Omit<LinkButtonProps, 'to' | 'external'> {
   /**
@@ -18,7 +19,10 @@ export function NewMonitorButton({linkToAlerts, ...props}: Props) {
     <LinkButton
       to={{
         pathname: linkToAlerts
-          ? `/organizations/${organization.slug}/alerts/new/crons/`
+          ? makeAlertsPathname({
+              path: `/new/crons/`,
+              organization,
+            })
           : `/organizations/${organization.slug}/crons/create/`,
         query: linkToAlerts ? undefined : {project: selection.projects},
       }}
diff --git a/static/app/views/monitors/components/overviewTimeline/overviewRow.tsx b/static/app/views/monitors/components/overviewTimeline/overviewRow.tsx
@@ -20,6 +20,7 @@ import {space} from 'sentry/styles/space';
 import type {ObjectStatus} from 'sentry/types/core';
 import {useLocation} from 'sentry/utils/useLocation';
 import useOrganization from 'sentry/utils/useOrganization';
+import {makeAlertsPathname} from 'sentry/views/alerts/pathnames';
 import type {Monitor} from 'sentry/views/monitors/types';
 import {scheduleAsText} from 'sentry/views/monitors/utils/scheduleAsText';
 
@@ -80,7 +81,10 @@ export function OverviewRow({
 
   const to = linkToAlerts
     ? {
-        pathname: `/organizations/${organization.slug}/alerts/rules/crons/${monitor.project.slug}/${monitor.slug}/details/`,
+        pathname: makeAlertsPathname({
+          path: `/rules/crons/${monitor.project.slug}/${monitor.slug}/details/`,
+          organization,
+        }),
         query,
       }
     : {
