Remove browserHistory usage from performance landing utils

Author: shashjar

static/app/views/performance/landing/utils.tsx

@@ -2,10 +2,10 @@ import type {Location} from 'history';
 
 import {t} from 'sentry/locale';
 import type {Project} from 'sentry/types/project';
-import {browserHistory} from 'sentry/utils/browserHistory';
 import type {EventView} from 'sentry/utils/discover/eventView';
 import {decodeScalar} from 'sentry/utils/queryString';
 import {MutableSearch} from 'sentry/utils/tokenizeSearch';
+import type {ReactRouter3Navigate} from 'sentry/utils/useNavigate';
 import {
   platformToPerformanceType,
   ProjectPerformanceType,
@@ -47,14 +47,14 @@ const LANDING_DISPLAYS = [
 
 export function excludeTransaction(
   transaction: string | number,
-  props: {eventView: EventView; location: Location}
+  props: {eventView: EventView; location: Location; navigate: ReactRouter3Navigate}
 ) {
-  const {eventView, location} = props;
+  const {eventView, location, navigate} = props;
 
   const searchConditions = new MutableSearch(eventView.query);
   searchConditions.addFilterValues('!transaction', [`${transaction}`]);
 
-  browserHistory.push({
+  navigate({
     pathname: location.pathname,
     query: {
       ...location.query,

static/app/views/performance/landing/widgets/widgets/lineChartListWidget.tsx

@@ -25,6 +25,7 @@ import {usePageAlert} from 'sentry/utils/performance/contexts/pageAlert';
 import {MutableSearch} from 'sentry/utils/tokenizeSearch';
 import {normalizeUrl} from 'sentry/utils/url/normalizeUrl';
 import {useLocation} from 'sentry/utils/useLocation';
+import {useNavigate} from 'sentry/utils/useNavigate';
 import {withApi} from 'sentry/utils/withApi';
 import {getResourcesEventViewQuery} from 'sentry/views/insights/browser/common/queries/useResourcesQuery';
 import {DEFAULT_RESOURCE_TYPES} from 'sentry/views/insights/browser/resources/settings';
@@ -105,6 +106,7 @@ const integrationEmptyStateWidgets = [
 
 export function LineChartListWidget(props: PerformanceWidgetProps) {
   const location = useLocation();
+  const navigate = useNavigate();
   const mepSetting = useMEPSettingContext();
   const [selectedListIndex, setSelectListIndex] = useState<number>(0);
   const {organization, InteractiveTitle} = props;
@@ -618,6 +620,7 @@ export function LineChartListWidget(props: PerformanceWidgetProps) {
                     excludeTransaction(listItem.transaction!, {
                       eventView: props.eventView,
                       location,
+                      navigate,
                     })
                   }
                 />
@@ -642,6 +645,7 @@ export function LineChartListWidget(props: PerformanceWidgetProps) {
                     excludeTransaction(listItem.transaction!, {
                       eventView: props.eventView,
                       location,
+                      navigate,
                     })
                   }
                 />
@@ -673,6 +677,7 @@ export function LineChartListWidget(props: PerformanceWidgetProps) {
                     excludeTransaction(listItem.transaction!, {
                       eventView: props.eventView,
                       location,
+                      navigate,
                     })
                   }
                 />
@@ -717,6 +722,7 @@ export function LineChartListWidget(props: PerformanceWidgetProps) {
                     excludeTransaction(listItem.transaction!, {
                       eventView: props.eventView,
                       location,
+                      navigate,
                     })
                   }
                 />
@@ -745,6 +751,7 @@ export function LineChartListWidget(props: PerformanceWidgetProps) {
                     excludeTransaction(listItem.transaction!, {
                       eventView: props.eventView,
                       location,
+                      navigate,
                     })
                   }
                 />
@@ -769,6 +776,7 @@ export function LineChartListWidget(props: PerformanceWidgetProps) {
                       excludeTransaction(listItem.transaction!, {
                         eventView: props.eventView,
                         location,
+                        navigate,
                       })
                     }
                   />
@@ -789,6 +797,7 @@ export function LineChartListWidget(props: PerformanceWidgetProps) {
                     excludeTransaction(listItem.transaction!, {
                       eventView: props.eventView,
                       location,
+                      navigate,
                     })
                   }
                 />

static/app/views/performance/landing/widgets/widgets/trendsWidget.tsx

@@ -7,6 +7,7 @@ import {useMetricsCardinalityContext} from 'sentry/utils/performance/contexts/me
 import {TrendsDiscoverQuery} from 'sentry/utils/performance/trends/trendsDiscoverQuery';
 import {MutableSearch} from 'sentry/utils/tokenizeSearch';
 import {useLocation} from 'sentry/utils/useLocation';
+import {useNavigate} from 'sentry/utils/useNavigate';
 import {useProjects} from 'sentry/utils/useProjects';
 import {withProjects} from 'sentry/utils/withProjects';
 import {excludeTransaction} from 'sentry/views/performance/landing/utils';
@@ -52,6 +53,7 @@ const fields = [{field: 'transaction'}, {field: 'project'}];
 
 export function TrendsWidget(props: PerformanceWidgetProps) {
   const location = useLocation();
+  const navigate = useNavigate();
   const {projects} = useProjects();
 
   const {isLoading: isCardinalityCheckLoading, outcome} = useMetricsCardinalityContext();
@@ -180,6 +182,7 @@ export function TrendsWidget(props: PerformanceWidgetProps) {
                 excludeTransaction(listItem.transaction, {
                   eventView: props.eventView,
                   location,
+                  navigate,
                 })
               }
             />