ref(discover): Remove usages of deprecatedRouteProps from Discover views

static/app/router/routes.tsx

@@ -1780,7 +1780,6 @@ function buildRoutes(): RouteObject[] {
     {
       path: 'homepage/',
       component: make(() => import('sentry/views/discover/homepage')),
-      deprecatedRouteProps: true,
     },
     traceView,
     {
@@ -1790,20 +1789,17 @@ function buildRoutes(): RouteObject[] {
     {
       path: 'results/',
       component: make(() => import('sentry/views/discover/results')),
-      deprecatedRouteProps: true,
     },
     {
       path: ':eventSlug/',
       component: make(() => import('sentry/views/discover/eventDetails')),
-      deprecatedRouteProps: true,
     },
   ];
   const discoverRoutes: SentryRouteObject = {
     path: '/discover/',
     component: make(() => import('sentry/views/discover')),
     withOrgPath: true,
     children: discoverChildren,
-    deprecatedRouteProps: true,
   };
 
   // Redirects for old LLM monitoring routes

static/app/views/discover/eventDetails.tsx

@@ -9,18 +9,17 @@ import LoadingIndicator from 'sentry/components/loadingIndicator';
 import {normalizeDateTimeParams} from 'sentry/components/organizations/pageFilters/parse';
 import {t} from 'sentry/locale';
 import type {Event} from 'sentry/types/event';
-import type {RouteComponentProps} from 'sentry/types/legacyReactRouter';
 import {useApiQuery} from 'sentry/utils/queryClient';
 import {useLocation} from 'sentry/utils/useLocation';
 import {useNavigate} from 'sentry/utils/useNavigate';
 import useOrganization from 'sentry/utils/useOrganization';
+import {useParams} from 'sentry/utils/useParams';
 import {getTraceDetailsUrl} from 'sentry/views/performance/traceDetails/utils';
 
-type Props = RouteComponentProps<{eventSlug: string}>;
-
-function EventDetails({params}: Props) {
+export default function EventDetails() {
   const organization = useOrganization();
   const location = useLocation();
+  const params = useParams<{eventSlug: string}>();
   const eventSlug = typeof params.eventSlug === 'string' ? params.eventSlug.trim() : '';
   const datetimeSelection = normalizeDateTimeParams(location.query);
   const navigate = useNavigate();
@@ -105,5 +104,3 @@ const LoadingWrapper = styled('div')`
   margin: auto;
   height: 100%;
 `;
-
-export default EventDetails;

static/app/views/discover/homepage.tsx

@@ -1,7 +1,5 @@
 import {useEffect} from 'react';
-import type {Location} from 'history';
 
-import type {Client} from 'sentry/api';
 import LoadingError from 'sentry/components/loadingError';
 import LoadingIndicator from 'sentry/components/loadingIndicator';
 import PageFiltersContainer from 'sentry/components/organizations/pageFilters/container';
@@ -10,41 +8,30 @@ import {
   normalizeDateTimeString,
 } from 'sentry/components/organizations/pageFilters/parse';
 import {getPageFilterStorage} from 'sentry/components/organizations/pageFilters/persistence';
-import type {PageFilters} from 'sentry/types/core';
-import type {InjectedRouter} from 'sentry/types/legacyReactRouter';
 import type {Organization, SavedQuery} from 'sentry/types/organization';
 import EventView from 'sentry/utils/discover/eventView';
 import {useApiQuery, useQueryClient, type ApiQueryKey} from 'sentry/utils/queryClient';
+import useApi from 'sentry/utils/useApi';
 import {useLocation} from 'sentry/utils/useLocation';
 import {useNavigate} from 'sentry/utils/useNavigate';
 import useOrganization from 'sentry/utils/useOrganization';
+import usePageFilters from 'sentry/utils/usePageFilters';
 import usePrevious from 'sentry/utils/usePrevious';
-import withApi from 'sentry/utils/withApi';
-import withOrganization from 'sentry/utils/withOrganization';
-import withPageFilters from 'sentry/utils/withPageFilters';
 import {getSavedQueryWithDataset} from 'sentry/views/discover/savedQuery/utils';
 
 import {Results} from './results';
 
-type Props = {
-  api: Client;
-  loading: boolean;
-  location: Location;
-  organization: Organization;
-  router: InjectedRouter;
-  selection: PageFilters;
-  setSavedQuery: (savedQuery: SavedQuery) => void;
-};
-
 function makeDiscoverHomepageQueryKey(organization: Organization): ApiQueryKey {
   return [`/organizations/${organization.slug}/discover/homepage/`];
 }
 
-function Homepage(props: Props) {
+function Homepage() {
   const organization = useOrganization();
+  const api = useApi();
   const queryClient = useQueryClient();
   const location = useLocation();
   const navigate = useNavigate();
+  const {selection} = usePageFilters();
   const {data, isLoading, isError, refetch} = useApiQuery<SavedQuery>(
     makeDiscoverHomepageQueryKey(organization),
     {
@@ -123,21 +110,23 @@ function Homepage(props: Props) {
 
   return (
     <Results
-      {...props}
-      savedQuery={savedQuery}
+      api={api}
       loading={isLoading}
+      location={location}
+      navigate={navigate}
+      organization={organization}
+      selection={selection}
       setSavedQuery={setSavedQuery}
       isHomepage
+      savedQuery={savedQuery}
     />
   );
 }
 
-function HomepageContainer(props: Props) {
+export default function HomepageContainer() {
   return (
     <PageFiltersContainer skipInitializeUrlParams>
-      <Homepage {...props} />
+      <Homepage />
     </PageFiltersContainer>
   );
 }
-
-export default withApi(withOrganization(withPageFilters(HomepageContainer)));

static/app/views/discover/results.tsx

@@ -33,7 +33,6 @@ import {t, tct, tctCode} from 'sentry/locale';
 import {space} from 'sentry/styles/space';
 import type {PageFilters} from 'sentry/types/core';
 import {SavedSearchType} from 'sentry/types/group';
-import type {InjectedRouter} from 'sentry/types/legacyReactRouter';
 import type {NewQuery, Organization, SavedQuery} from 'sentry/types/organization';
 import {defined, generateQueryWithTag} from 'sentry/utils';
 import {trackAnalytics} from 'sentry/utils/analytics';
@@ -57,6 +56,8 @@ import {setApiQueryData, useApiQuery, useQueryClient} from 'sentry/utils/queryCl
 import {decodeList, decodeScalar} from 'sentry/utils/queryString';
 import normalizeUrl from 'sentry/utils/url/normalizeUrl';
 import useApi from 'sentry/utils/useApi';
+import {useLocation} from 'sentry/utils/useLocation';
+import {useNavigate} from 'sentry/utils/useNavigate';
 import useOrganization from 'sentry/utils/useOrganization';
 import usePageFilters from 'sentry/utils/usePageFilters';
 import {hasDatasetSelector} from 'sentry/views/dashboards/utils';
@@ -82,8 +83,8 @@ type Props = {
   api: Client;
   loading: boolean;
   location: Location;
+  navigate: ReturnType<typeof useNavigate>;
   organization: Organization;
-  router: InjectedRouter;
   selection: PageFilters;
   setSavedQuery: (savedQuery?: SavedQuery) => void;
   isHomepage?: boolean;
@@ -399,8 +400,7 @@ export class Results extends Component<Props, State> {
   }
 
   handleCursor: CursorHandler = (cursor, path, query, _direction) => {
-    const {router} = this.props;
-    router.push({
+    this.props.navigate({
       pathname: path,
       query: {...query, cursor},
     });
@@ -423,7 +423,7 @@ export class Results extends Component<Props, State> {
   };
 
   handleSearch = (query: string) => {
-    const {router, location} = this.props;
+    const {location, navigate} = this.props;
 
     const queryParams = normalizeDateTimeParams({
       ...location.query,
@@ -433,14 +433,14 @@ export class Results extends Component<Props, State> {
     // do not propagate pagination when making a new search
     const searchQueryParams = omit(queryParams, 'cursor');
 
-    router.push({
+    navigate({
       pathname: location.pathname,
       query: searchQueryParams,
     });
   };
 
   handleYAxisChange = (value: string[]) => {
-    const {router, location} = this.props;
+    const {navigate, location} = this.props;
     const isDisplayMultiYAxisSupported = MULTI_Y_AXIS_SUPPORTED_DISPLAY_MODES.includes(
       location.query.display as DisplayModes
     );
@@ -457,7 +457,7 @@ export class Results extends Component<Props, State> {
           : location.query.display,
     };
 
-    router.push({
+    navigate({
       pathname: location.pathname,
       query: newQuery,
     });
@@ -474,14 +474,14 @@ export class Results extends Component<Props, State> {
   };
 
   handleDisplayChange = (value: string) => {
-    const {router, location} = this.props;
+    const {navigate, location} = this.props;
 
     const newQuery = {
       ...location.query,
       display: value,
     };
 
-    router.push({
+    navigate({
       pathname: location.pathname,
       query: newQuery,
     });
@@ -493,15 +493,15 @@ export class Results extends Component<Props, State> {
   };
 
   handleIntervalChange = (value: string | undefined) => {
-    const {router, location} = this.props;
+    const {navigate, location} = this.props;
 
     const newQuery = {
       ...location.query,
       interval: value,
     };
 
     if (location.query.interval !== value) {
-      router.push({
+      navigate({
         pathname: location.pathname,
         query: newQuery,
       });
@@ -514,14 +514,14 @@ export class Results extends Component<Props, State> {
   };
 
   handleTopEventsChange = (value: string) => {
-    const {router, location} = this.props;
+    const {navigate, location} = this.props;
 
     const newQuery = {
       ...location.query,
       topEvents: value,
     };
 
-    router.push({
+    navigate({
       pathname: location.pathname,
       query: newQuery,
     });
@@ -967,12 +967,12 @@ function SavedQueryAPI(props: Omit<Props, 'savedQuery' | 'loading' | 'setSavedQu
   );
 }
 
-export default function ResultsContainer(
-  props: Omit<Props, 'api' | 'organization' | 'selection' | 'loading' | 'setSavedQuery'>
-) {
+export default function ResultsContainer() {
   const api = useApi();
   const organization = useOrganization();
   const {selection} = usePageFilters();
+  const location = useLocation();
+  const navigate = useNavigate();
 
   /**
    * Block `<Results>` from mounting until GSH is ready since there are API
@@ -988,10 +988,9 @@ export default function ResultsContainer(
   return (
     <PageFiltersContainer
       disablePersistence={
-        organization.features.includes('discover-query') &&
-        !!(props.savedQuery || props.location.query.id)
+        organization.features.includes('discover-query') && !!location.query.id
       }
-      skipLoadLastUsed={!!props.savedQuery}
+      skipLoadLastUsed={false}
       // The Discover Results component will manage URL params, including page filters state
       // This avoids an unnecessary re-render when forcing a project filter for team plan users
       skipInitializeUrlParams
@@ -1000,7 +999,8 @@ export default function ResultsContainer(
         api={api}
         organization={organization}
         selection={selection}
-        {...props}
+        location={location}
+        navigate={navigate}
       />
     </PageFiltersContainer>
   );