From 6feaf8345091335e02c60d07c4b09340bf7f2537 Mon Sep 17 00:00:00 2001
From: Scott Cooper <scttcper@gmail.com>
Date: Tue, 11 Mar 2025 17:16:12 -0700
Subject: [PATCH] ref(ui): Swap React.ReactText with `string | number`

React.ReactText is removed in react 19

part of https://github.com/getsentry/frontend-tsc/issues/68

you can see other failing type changes https://github.com/getsentry/getsentry/actions/runs/13779044085/job/38533796056
---
 static/app/components/activity/note/input.tsx             | 4 ++--
 static/app/components/discover/transactionsList.tsx       | 4 ++--
 static/app/components/discover/transactionsTable.tsx      | 8 ++++----
 static/app/components/gridEditable/index.tsx              | 2 +-
 static/app/utils/discover/discoverQuery.tsx               | 2 +-
 static/app/utils/discover/eventView.tsx                   | 4 ++--
 .../performance/segmentExplorer/tagKeyHistogramQuery.tsx  | 2 +-
 .../performance/segmentExplorer/tagTransactionsQuery.tsx  | 2 +-
 .../utils/performance/vitals/vitalsCardsDiscoverQuery.tsx | 2 +-
 .../utils/performance/vitals/vitalsDetailsTableQuery.tsx  | 2 +-
 .../alerts/rules/metric/details/relatedTransactions.tsx   | 2 +-
 static/app/views/discover/table/cellAction.spec.tsx       | 2 +-
 static/app/views/discover/table/cellAction.tsx            | 8 ++++----
 .../discover/table/quickContext/actionDropdown.spec.tsx   | 2 +-
 .../views/discover/table/quickContext/actionDropdown.tsx  | 2 +-
 static/app/views/discover/table/tableView.tsx             | 2 +-
 .../screenload/components/tables/eventSamplesTable.tsx    | 4 ++--
 .../mobile/screenload/components/tables/screensTable.tsx  | 4 ++--
 static/app/views/issueDetails/streamline/sidebar/note.tsx | 4 ++--
 static/app/views/performance/landing/utils.tsx            | 2 +-
 static/app/views/performance/table.tsx                    | 8 ++++----
 .../transactionSummary/transactionEvents/eventsTable.tsx  | 8 ++++----
 .../transactionSummary/transactionOverview/content.tsx    | 4 ++--
 .../transactionSummary/transactionOverview/index.tsx      | 2 +-
 .../transactionOverview/tagExplorer.tsx                   | 2 +-
 .../transactionSummary/transactionTags/tagValueTable.tsx  | 2 +-
 .../transactionSummary/transactionTags/utils.tsx          | 2 +-
 static/app/views/performance/vitalDetail/table.tsx        | 8 ++++----
 28 files changed, 50 insertions(+), 50 deletions(-)

diff --git a/static/app/components/activity/note/input.tsx b/static/app/components/activity/note/input.tsx
index a1ac2f35ffcc8f..79db458366fef5 100644
--- a/static/app/components/activity/note/input.tsx
+++ b/static/app/components/activity/note/input.tsx
@@ -120,13 +120,13 @@ function NoteInput({
   );
 
   const handleAddMember = useCallback(
-    (id: React.ReactText, display: string) =>
+    (id: string | number, display: string) =>
       setMemberMentions(existing => [...existing, [`${id}`, display]]),
     []
   );
 
   const handleAddTeam = useCallback(
-    (id: React.ReactText, display: string) =>
+    (id: string | number, display: string) =>
       setTeamMentions(existing => [...existing, [`${id}`, display]]),
     []
   );
diff --git a/static/app/components/discover/transactionsList.tsx b/static/app/components/discover/transactionsList.tsx
index 76965b1a7f3e74..91fa61a5cd5cb9 100644
--- a/static/app/components/discover/transactionsList.tsx
+++ b/static/app/components/discover/transactionsList.tsx
@@ -112,8 +112,8 @@ type Props = {
    * The callback to generate a cell action handler for a column
    */
   handleCellAction?: (
-    c: TableColumn<React.ReactText>
-  ) => (a: Actions, v: React.ReactText) => void;
+    c: TableColumn<string | number>
+  ) => (a: Actions, v: string | number) => void;
   /**
    * The callback for when View All Events is clicked.
    */
diff --git a/static/app/components/discover/transactionsTable.tsx b/static/app/components/discover/transactionsTable.tsx
index 1e71ab870f52c9..48ed8e88de96f7 100644
--- a/static/app/components/discover/transactionsTable.tsx
+++ b/static/app/components/discover/transactionsTable.tsx
@@ -29,7 +29,7 @@ import {GridCell, GridCellNumber} from 'sentry/views/performance/styles';
 import type {TrendsDataEvents} from 'sentry/views/performance/trends/types';
 
 type Props = {
-  columnOrder: Array<TableColumn<React.ReactText>>;
+  columnOrder: Array<TableColumn<string | number>>;
   eventView: EventView;
   isLoading: boolean;
   location: Location;
@@ -45,8 +45,8 @@ type Props = {
     ) => LocationDescriptor
   >;
   handleCellAction?: (
-    c: TableColumn<React.ReactText>
-  ) => (a: Actions, v: React.ReactText) => void;
+    c: TableColumn<string | number>
+  ) => (a: Actions, v: string | number) => void;
   referrer?: string;
   titles?: string[];
 };
@@ -127,7 +127,7 @@ function TransactionsTable(props: Props) {
   const renderRow = (
     row: TableDataRow,
     rowIndex: number,
-    colOrder: Array<TableColumn<React.ReactText>>,
+    colOrder: Array<TableColumn<string | number>>,
     tableMeta: MetaType
   ): React.ReactNode[] => {
     const fields = eventView.getFields();
diff --git a/static/app/components/gridEditable/index.tsx b/static/app/components/gridEditable/index.tsx
index 94ddff979af46a..1e919202fd4c81 100644
--- a/static/app/components/gridEditable/index.tsx
+++ b/static/app/components/gridEditable/index.tsx
@@ -36,7 +36,7 @@ export const COL_WIDTH_MINIMUM = 90;
 // - K is a key of T/
 //   - columnKey should have the same set of values as K
 
-type ObjectKey = React.ReactText;
+type ObjectKey = string | number;
 
 export type GridColumn<K = ObjectKey> = {
   key: K;
diff --git a/static/app/utils/discover/discoverQuery.tsx b/static/app/utils/discover/discoverQuery.tsx
index edda9b602bbc9a..b8dc0b988d7920 100644
--- a/static/app/utils/discover/discoverQuery.tsx
+++ b/static/app/utils/discover/discoverQuery.tsx
@@ -8,7 +8,7 @@ import GenericDiscoverQuery, {useGenericDiscoverQuery} from './genericDiscoverQu
  * An individual row in a DiscoverQuery result
  */
 export type TableDataRow = {
-  [key: string]: React.ReactText;
+  [key: string]: string | number;
   id: string;
 };
 
diff --git a/static/app/utils/discover/eventView.tsx b/static/app/utils/discover/eventView.tsx
index 0e640d9aab4451..b6cfec24bf0f25 100644
--- a/static/app/utils/discover/eventView.tsx
+++ b/static/app/utils/discover/eventView.tsx
@@ -779,7 +779,7 @@ class EventView {
     return this.fields.length;
   }
 
-  getColumns(): Array<TableColumn<React.ReactText>> {
+  getColumns(): Array<TableColumn<string | number>> {
     return decodeColumnOrder(this.fields);
   }
 
@@ -1076,7 +1076,7 @@ class EventView {
     return newEventView;
   }
 
-  getSorts(): Array<TableColumnSort<React.ReactText>> {
+  getSorts(): Array<TableColumnSort<string | number>> {
     return this.sorts.map(
       sort =>
         ({
diff --git a/static/app/utils/performance/segmentExplorer/tagKeyHistogramQuery.tsx b/static/app/utils/performance/segmentExplorer/tagKeyHistogramQuery.tsx
index 94340912759914..0485e655143bac 100644
--- a/static/app/utils/performance/segmentExplorer/tagKeyHistogramQuery.tsx
+++ b/static/app/utils/performance/segmentExplorer/tagKeyHistogramQuery.tsx
@@ -10,7 +10,7 @@ import GenericDiscoverQuery from 'sentry/utils/discover/genericDiscoverQuery';
  * An individual row in a Segment explorer result
  */
 export type TableDataRow = {
-  [key: string]: React.ReactText;
+  [key: string]: string | number;
   count: number;
   tags_key: string;
   tags_value: string;
diff --git a/static/app/utils/performance/segmentExplorer/tagTransactionsQuery.tsx b/static/app/utils/performance/segmentExplorer/tagTransactionsQuery.tsx
index 73fc0625dd85f1..507e793accf34d 100644
--- a/static/app/utils/performance/segmentExplorer/tagTransactionsQuery.tsx
+++ b/static/app/utils/performance/segmentExplorer/tagTransactionsQuery.tsx
@@ -6,7 +6,7 @@ import type {
 import GenericDiscoverQuery from 'sentry/utils/discover/genericDiscoverQuery';
 
 export type TableDataRow = {
-  [key: string]: React.ReactText;
+  [key: string]: string | number;
   id: string;
 };
 
diff --git a/static/app/utils/performance/vitals/vitalsCardsDiscoverQuery.tsx b/static/app/utils/performance/vitals/vitalsCardsDiscoverQuery.tsx
index eefe3f33577bb7..fec346914cb8c4 100644
--- a/static/app/utils/performance/vitals/vitalsCardsDiscoverQuery.tsx
+++ b/static/app/utils/performance/vitals/vitalsCardsDiscoverQuery.tsx
@@ -10,7 +10,7 @@ import type {WebVital} from 'sentry/utils/fields';
 import {PERFORMANCE_URL_PARAM} from 'sentry/utils/performance/constants';
 
 export type TableDataRow = {
-  [key: string]: React.ReactText;
+  [key: string]: string | number;
   id: string;
 };
 
diff --git a/static/app/utils/performance/vitals/vitalsDetailsTableQuery.tsx b/static/app/utils/performance/vitals/vitalsDetailsTableQuery.tsx
index 7dec93b9b9f6b7..de955cedc2330f 100644
--- a/static/app/utils/performance/vitals/vitalsDetailsTableQuery.tsx
+++ b/static/app/utils/performance/vitals/vitalsDetailsTableQuery.tsx
@@ -6,7 +6,7 @@ import type {
 import GenericDiscoverQuery from 'sentry/utils/discover/genericDiscoverQuery';
 
 type BaseDataRow = {
-  [key: string]: React.ReactText;
+  [key: string]: string | number;
   count: number;
   count_unique_user: number;
   id: string;
diff --git a/static/app/views/alerts/rules/metric/details/relatedTransactions.tsx b/static/app/views/alerts/rules/metric/details/relatedTransactions.tsx
index d2004b7e873115..4b83be96f402cf 100644
--- a/static/app/views/alerts/rules/metric/details/relatedTransactions.tsx
+++ b/static/app/views/alerts/rules/metric/details/relatedTransactions.tsx
@@ -116,7 +116,7 @@ function RelatedTransactions({
 
   const columnOrder = eventView
     .getColumns()
-    .map((col: TableColumn<React.ReactText>, i: number) => {
+    .map((col: TableColumn<string | number>, i: number) => {
       if (typeof widths[i] === 'number') {
         return {...col, width: widths[i]};
       }
diff --git a/static/app/views/discover/table/cellAction.spec.tsx b/static/app/views/discover/table/cellAction.spec.tsx
index 3f1975e523a829..332c165259af03 100644
--- a/static/app/views/discover/table/cellAction.spec.tsx
+++ b/static/app/views/discover/table/cellAction.spec.tsx
@@ -39,7 +39,7 @@ function renderComponent({
   data?: TableDataRow;
   handleCellAction?: (
     action: Actions,
-    value: React.ReactText | null[] | string[] | null
+    value: string | number | null[] | string[] | null
   ) => void;
 }) {
   return render(
diff --git a/static/app/views/discover/table/cellAction.tsx b/static/app/views/discover/table/cellAction.tsx
index d39f26f95824ae..b5462113958857 100644
--- a/static/app/views/discover/table/cellAction.tsx
+++ b/static/app/views/discover/table/cellAction.tsx
@@ -32,7 +32,7 @@ export function updateQuery(
   results: MutableSearch,
   action: Actions,
   column: TableColumn<keyof TableDataRow>,
-  value: React.ReactText | string[]
+  value: string | number | string[]
 ) {
   const key = column.name;
 
@@ -94,7 +94,7 @@ export function updateQuery(
 export function addToFilter(
   oldFilter: MutableSearch,
   key: string,
-  value: React.ReactText | string[]
+  value: string | number | string[]
 ) {
   // Remove exclusion if it exists.
   oldFilter.removeFilter(`!${key}`);
@@ -113,7 +113,7 @@ export function addToFilter(
 export function excludeFromFilter(
   oldFilter: MutableSearch,
   key: string,
-  value: React.ReactText | string[]
+  value: string | number | string[]
 ) {
   // Negations should stack up.
   const negation = `!${key}`;
@@ -137,7 +137,7 @@ export function excludeFromFilter(
 type CellActionsOpts = {
   column: TableColumn<keyof TableDataRow>;
   dataRow: TableDataRow;
-  handleCellAction: (action: Actions, value: React.ReactText) => void;
+  handleCellAction: (action: Actions, value: string | number) => void;
   /**
    * allow list of actions to display on the context menu
    */
diff --git a/static/app/views/discover/table/quickContext/actionDropdown.spec.tsx b/static/app/views/discover/table/quickContext/actionDropdown.spec.tsx
index 880ce515e7df7b..c60480aa5329a4 100644
--- a/static/app/views/discover/table/quickContext/actionDropdown.spec.tsx
+++ b/static/app/views/discover/table/quickContext/actionDropdown.spec.tsx
@@ -39,7 +39,7 @@ const renderActionDropdown = (
   location: Location,
   eventView: EventView,
   queryKey: string,
-  value: React.ReactText | string[],
+  value: string | number | string[],
   contextValueType: ContextValueType
 ) => {
   const organization = OrganizationFixture();
diff --git a/static/app/views/discover/table/quickContext/actionDropdown.tsx b/static/app/views/discover/table/quickContext/actionDropdown.tsx
index 23e911ee93c3f7..e72dbf7264b402 100644
--- a/static/app/views/discover/table/quickContext/actionDropdown.tsx
+++ b/static/app/views/discover/table/quickContext/actionDropdown.tsx
@@ -37,7 +37,7 @@ type Props = {
   location: Location;
   organization: Organization;
   queryKey: string;
-  value: React.ReactText | string[];
+  value: string | number | string[];
 };
 
 function ActionDropDown(props: Props) {
diff --git a/static/app/views/discover/table/tableView.tsx b/static/app/views/discover/table/tableView.tsx
index e65809ab3129e5..e055b6ca631b56 100644
--- a/static/app/views/discover/table/tableView.tsx
+++ b/static/app/views/discover/table/tableView.tsx
@@ -564,7 +564,7 @@ function TableView(props: TableViewProps) {
     dataRow: TableDataRow,
     column: TableColumn<keyof TableDataRow>
   ) {
-    return (action: Actions, value: React.ReactText) => {
+    return (action: Actions, value: string | number) => {
       const {eventView, organization, location, tableData, isHomepage, queryDataset} =
         props;
 
diff --git a/static/app/views/insights/mobile/screenload/components/tables/eventSamplesTable.tsx b/static/app/views/insights/mobile/screenload/components/tables/eventSamplesTable.tsx
index a492a3b5c458e5..1c06627d4d797f 100644
--- a/static/app/views/insights/mobile/screenload/components/tables/eventSamplesTable.tsx
+++ b/static/app/views/insights/mobile/screenload/components/tables/eventSamplesTable.tsx
@@ -200,10 +200,10 @@ export function EventSamplesTable({
           isLoading={isLoading}
           data={data?.data as TableDataRow[]}
           columnOrder={eventViewColumns
-            .filter((col: TableColumn<React.ReactText>) =>
+            .filter((col: TableColumn<string | number>) =>
               Object.keys(columnNameMap).includes(col.name)
             )
-            .map((col: TableColumn<React.ReactText>) => {
+            .map((col: TableColumn<string | number>) => {
               return {...col, name: columnNameMap[col.key]!};
             })}
           columnSortBy={columnSortBy}
diff --git a/static/app/views/insights/mobile/screenload/components/tables/screensTable.tsx b/static/app/views/insights/mobile/screenload/components/tables/screensTable.tsx
index 1abc2c97f54546..eb59d7b4b459bf 100644
--- a/static/app/views/insights/mobile/screenload/components/tables/screensTable.tsx
+++ b/static/app/views/insights/mobile/screenload/components/tables/screensTable.tsx
@@ -216,11 +216,11 @@ export function ScreensTable({data, eventView, isLoading, pageLinks, onCursor}:
         data={data?.data as TableDataRow[]}
         columnOrder={eventViewColumns
           .filter(
-            (col: TableColumn<React.ReactText>) =>
+            (col: TableColumn<string | number>) =>
               col.name !== SpanMetricsField.PROJECT_ID &&
               !col.name.startsWith('avg_compare')
           )
-          .map((col: TableColumn<React.ReactText>) => {
+          .map((col: TableColumn<string | number>) => {
             return {...col, name: columnNameMap[col.key] ?? col.name};
           })}
         columnSortBy={[
diff --git a/static/app/views/issueDetails/streamline/sidebar/note.tsx b/static/app/views/issueDetails/streamline/sidebar/note.tsx
index 5d89159aa9295c..171fa37dcc4350 100644
--- a/static/app/views/issueDetails/streamline/sidebar/note.tsx
+++ b/static/app/views/issueDetails/streamline/sidebar/note.tsx
@@ -108,13 +108,13 @@ function StreamlinedNoteInput({
   );
 
   const handleAddMember = useCallback(
-    (id: React.ReactText, display: string) =>
+    (id: string | number, display: string) =>
       setMemberMentions(existing => [...existing, [`${id}`, display]]),
     []
   );
 
   const handleAddTeam = useCallback(
-    (id: React.ReactText, display: string) =>
+    (id: string | number, display: string) =>
       setTeamMentions(existing => [...existing, [`${id}`, display]]),
     []
   );
diff --git a/static/app/views/performance/landing/utils.tsx b/static/app/views/performance/landing/utils.tsx
index 8acf1c8a95d4fe..83b775a675ae1e 100644
--- a/static/app/views/performance/landing/utils.tsx
+++ b/static/app/views/performance/landing/utils.tsx
@@ -58,7 +58,7 @@ export const LANDING_DISPLAYS = [
 ];
 
 export function excludeTransaction(
-  transaction: string | React.ReactText,
+  transaction: string | string | number,
   props: {eventView: EventView; location: Location}
 ) {
   const {eventView, location} = props;
diff --git a/static/app/views/performance/table.tsx b/static/app/views/performance/table.tsx
index 666e77b6c307de..8009ed98561325 100644
--- a/static/app/views/performance/table.tsx
+++ b/static/app/views/performance/table.tsx
@@ -181,7 +181,7 @@ class _Table extends Component<Props, State> {
   }
 
   handleCellAction = (column: TableColumn<keyof TableDataRow>, dataRow: TableDataRow) => {
-    return (action: Actions, value: React.ReactText) => {
+    return (action: Actions, value: string | number) => {
       const {eventView, location, organization, projects} = this.props;
 
       trackAnalytics('performance_views.overview.cellaction', {
@@ -513,7 +513,7 @@ class _Table extends Component<Props, State> {
 
     const teamKeyTransactionColumn = eventView
       .getColumns()
-      .find((col: TableColumn<React.ReactText>) => col.name === 'team_key_transaction');
+      .find((col: TableColumn<string | number>) => col.name === 'team_key_transaction');
     return (isHeader: boolean, dataRow?: any) => {
       if (teamKeyTransactionColumn) {
         if (isHeader) {
@@ -573,12 +573,12 @@ class _Table extends Component<Props, State> {
       // remove team_key_transactions from the column order as we'll be rendering it
       // via a prepended column
       .filter(
-        (col: TableColumn<React.ReactText>) =>
+        (col: TableColumn<string | number>) =>
           col.name !== 'team_key_transaction' &&
           !col.name.startsWith('count_miserable') &&
           col.name !== 'project_threshold_config'
       )
-      .map((col: TableColumn<React.ReactText>, i: number) => {
+      .map((col: TableColumn<string | number>, i: number) => {
         if (typeof widths[i] === 'number') {
           return {...col, width: widths[i]};
         }
diff --git a/static/app/views/performance/transactionSummary/transactionEvents/eventsTable.tsx b/static/app/views/performance/transactionSummary/transactionEvents/eventsTable.tsx
index 27efaf051ba45f..98b08ad9d4bafa 100644
--- a/static/app/views/performance/transactionSummary/transactionEvents/eventsTable.tsx
+++ b/static/app/views/performance/transactionSummary/transactionEvents/eventsTable.tsx
@@ -131,7 +131,7 @@ class EventsTable extends Component<Props, State> {
   replayLinkGenerator = generateReplayLink(this.props.routes);
 
   handleCellAction = (column: TableColumn<keyof TableDataRow>) => {
-    return (action: Actions, value: React.ReactText) => {
+    return (action: Actions, value: string | number) => {
       const {eventView, location, organization, excludedTags, applyEnvironmentFilter} =
         this.props;
 
@@ -448,16 +448,16 @@ class EventsTable extends Component<Props, State> {
     const containsSpanOpsBreakdown = !!eventView
       .getColumns()
       .find(
-        (col: TableColumn<React.ReactText>) =>
+        (col: TableColumn<string | number>) =>
           col.name === SPAN_OP_RELATIVE_BREAKDOWN_FIELD
       );
 
     const columnOrder = eventView
       .getColumns()
-      .filter((col: TableColumn<React.ReactText>) =>
+      .filter((col: TableColumn<string | number>) =>
         shouldRenderColumn(containsSpanOpsBreakdown, col.name)
       )
-      .map((col: TableColumn<React.ReactText>, i: number) => {
+      .map((col: TableColumn<string | number>, i: number) => {
         if (typeof widths[i] === 'number') {
           return {...col, width: widths[i]};
         }
diff --git a/static/app/views/performance/transactionSummary/transactionOverview/content.tsx b/static/app/views/performance/transactionSummary/transactionOverview/content.tsx
index ca5d9153cf459a..759e0d191253f8 100644
--- a/static/app/views/performance/transactionSummary/transactionOverview/content.tsx
+++ b/static/app/views/performance/transactionSummary/transactionOverview/content.tsx
@@ -400,8 +400,8 @@ function SummaryContent({
     };
   }
 
-  function handleCellAction(column: TableColumn<React.ReactText>) {
-    return (action: Actions, value: React.ReactText) => {
+  function handleCellAction(column: TableColumn<string | number>) {
+    return (action: Actions, value: string | number) => {
       const searchConditions = normalizeSearchConditions(eventView.query);
 
       updateQuery(searchConditions, action, column, value);
diff --git a/static/app/views/performance/transactionSummary/transactionOverview/index.tsx b/static/app/views/performance/transactionSummary/transactionOverview/index.tsx
index 388af9d67272e9..faad8b0cd7cf77 100644
--- a/static/app/views/performance/transactionSummary/transactionOverview/index.tsx
+++ b/static/app/views/performance/transactionSummary/transactionOverview/index.tsx
@@ -51,7 +51,7 @@ import {ZOOM_END, ZOOM_START} from './latencyChart/utils';
 import SummaryContent, {OTelSummaryContent} from './content';
 
 // Used to cast the totals request to numbers
-// as React.ReactText
+// as string | number
 type TotalValues = Record<string, number>;
 
 type Props = {
diff --git a/static/app/views/performance/transactionSummary/transactionOverview/tagExplorer.tsx b/static/app/views/performance/transactionSummary/transactionOverview/tagExplorer.tsx
index 8bc50c566a4fe4..87c8cd2ce241b6 100644
--- a/static/app/views/performance/transactionSummary/transactionOverview/tagExplorer.tsx
+++ b/static/app/views/performance/transactionSummary/transactionOverview/tagExplorer.tsx
@@ -288,7 +288,7 @@ export class TagExplorer extends Component<Props> {
 
   handleCellAction = (
     column: TableColumn<ColumnKeys>,
-    tagValue: React.ReactText,
+    tagValue: string | number,
     actionRow: any
   ) => {
     return (action: Actions) => {
diff --git a/static/app/views/performance/transactionSummary/transactionTags/tagValueTable.tsx b/static/app/views/performance/transactionSummary/transactionTags/tagValueTable.tsx
index 5aa41cdb86acf6..d757c750850dd8 100644
--- a/static/app/views/performance/transactionSummary/transactionTags/tagValueTable.tsx
+++ b/static/app/views/performance/transactionSummary/transactionTags/tagValueTable.tsx
@@ -125,7 +125,7 @@ export class TagValueTable extends Component<Props, State> {
 
   handleCellAction = (
     column: TableColumn<TagsTableColumnKeys>,
-    tagValue: React.ReactText,
+    tagValue: string | number,
     actionRow: any
   ) => {
     return (action: Actions) => {
diff --git a/static/app/views/performance/transactionSummary/transactionTags/utils.tsx b/static/app/views/performance/transactionSummary/transactionTags/utils.tsx
index f5a8b2c3e07ade..bd5f34e1e5305a 100644
--- a/static/app/views/performance/transactionSummary/transactionTags/utils.tsx
+++ b/static/app/views/performance/transactionSummary/transactionTags/utils.tsx
@@ -69,7 +69,7 @@ export function getTagSortForTagsPage(location: Location) {
 }
 
 // TODO(k-fish): Improve meta of backend response to return these directly
-export function parseHistogramBucketInfo(row: {[key: string]: React.ReactText}) {
+export function parseHistogramBucketInfo(row: {[key: string]: string | number}) {
   const field = Object.keys(row).find(f => f.includes('histogram'));
   if (!field) {
     return undefined;
diff --git a/static/app/views/performance/vitalDetail/table.tsx b/static/app/views/performance/vitalDetail/table.tsx
index b9c60ca2d34c0c..7734d849fe5841 100644
--- a/static/app/views/performance/vitalDetail/table.tsx
+++ b/static/app/views/performance/vitalDetail/table.tsx
@@ -81,7 +81,7 @@ class Table extends Component<Props, State> {
   };
 
   handleCellAction = (column: TableColumn<keyof TableDataRow>) => {
-    return (action: Actions, value: React.ReactText) => {
+    return (action: Actions, value: string | number) => {
       const {eventView, location, organization} = this.props;
 
       trackAnalytics('performance_views.overview.cellaction', {
@@ -272,7 +272,7 @@ class Table extends Component<Props, State> {
     const {eventView} = this.props;
     const teamKeyTransactionColumn = eventView
       .getColumns()
-      .find((col: TableColumn<React.ReactText>) => col.name === 'team_key_transaction');
+      .find((col: TableColumn<string | number>) => col.name === 'team_key_transaction');
     return (isHeader: boolean, dataRow?: any) => {
       if (teamKeyTransactionColumn) {
         if (isHeader) {
@@ -357,9 +357,9 @@ class Table extends Component<Props, State> {
       .getColumns()
       // remove key_transactions from the column order as we'll be rendering it
       // via a prepended column
-      .filter((col: TableColumn<React.ReactText>) => col.name !== 'team_key_transaction')
+      .filter((col: TableColumn<string | number>) => col.name !== 'team_key_transaction')
       .slice(0, -1)
-      .map((col: TableColumn<React.ReactText>, i: number) => {
+      .map((col: TableColumn<string | number>, i: number) => {
         if (typeof widths[i] === 'number') {
           return {...col, width: widths[i]};
         }