feat(explore): Use rpc layer behind toggle

static/app/actionCreators/events.tsx

@@ -175,6 +175,7 @@ export type EventQuery = {
   referrer?: string;
   sort?: string | string[];
   team?: string | string[];
+  useRpc?: '1';
 };
 
 export type TagSegment = {

static/app/utils/discover/eventView.tsx

@@ -1200,10 +1200,18 @@ class EventView {
         sort,
         per_page: DEFAULT_PER_PAGE,
         query: queryString,
-        dataset: this.dataset,
+        dataset:
+          this.dataset === DiscoverDatasets.SPANS_EAP_RPC
+            ? DiscoverDatasets.SPANS_EAP
+            : this.dataset,
+        useRpc: this.dataset === DiscoverDatasets.SPANS_EAP_RPC ? '1' : undefined,
       }
     ) as EventQuery & LocationQuery;
 
+    if (eventQuery.useRpc !== '1') {
+      delete eventQuery.useRpc;
+    }
+
     if (eventQuery.team && !eventQuery.team.length) {
       delete eventQuery.team;
     }

static/app/utils/discover/types.tsx

@@ -20,6 +20,7 @@ export enum DiscoverDatasets {
   METRICS_ENHANCED = 'metricsEnhanced',
   ISSUE_PLATFORM = 'issuePlatform',
   SPANS_EAP = 'spans',
+  SPANS_EAP_RPC = 'spansRpc',
   SPANS_INDEXED = 'spansIndexed',
   SPANS_METRICS = 'spansMetrics',
   TRANSACTIONS = 'transactions',

static/app/views/explore/hooks/useDataset.tsx

@@ -9,27 +9,39 @@ import {useNavigate} from 'sentry/utils/useNavigate';
 interface Options {
   location: Location;
   navigate: ReturnType<typeof useNavigate>;
+  allowRPC?: boolean;
 }
 
-export function useDataset(): [DiscoverDatasets, (dataset: DiscoverDatasets) => void] {
+interface UseDatasetOptions {
+  allowRPC?: boolean;
+}
+
+export function useDataset(
+  options?: UseDatasetOptions
+): [DiscoverDatasets, (dataset: DiscoverDatasets) => void] {
   const location = useLocation();
   const navigate = useNavigate();
-  const options = {location, navigate};
 
-  return useDatasetImpl(options);
+  return useDatasetImpl({location, navigate, allowRPC: options?.allowRPC});
 }
 
 function useDatasetImpl({
   location,
   navigate,
+  allowRPC,
 }: Options): [DiscoverDatasets, (dataset: DiscoverDatasets) => void] {
   const dataset: DiscoverDatasets = useMemo(() => {
     const rawDataset = decodeScalar(location.query.dataset);
     if (rawDataset === 'spansIndexed') {
       return DiscoverDatasets.SPANS_INDEXED;
     }
+
+    if (allowRPC && rawDataset === 'spansRpc') {
+      return DiscoverDatasets.SPANS_EAP_RPC;
+    }
+
     return DiscoverDatasets.SPANS_EAP;
-  }, [location.query.dataset]);
+  }, [location.query.dataset, allowRPC]);
 
   const setDataset = useCallback(
     (newDataset: DiscoverDatasets) => {

static/app/views/explore/tables/aggregatesTable.tsx

@@ -57,7 +57,7 @@ export function AggregatesTable({setError}: AggregatesTableProps) {
   const {selection} = usePageFilters();
   const topEvents = useTopEvents();
   const organization = useOrganization();
-  const [dataset] = useDataset();
+  const [dataset] = useDataset({allowRPC: true});
   const {groupBys} = useGroupBys();
   const [visualizes] = useVisualizes();
   const fields = useMemo(() => {

static/app/views/explore/tables/spansTable.tsx

@@ -43,7 +43,7 @@ interface SpansTableProps {
 export function SpansTable({setError}: SpansTableProps) {
   const {selection} = usePageFilters();
 
-  const [dataset] = useDataset();
+  const [dataset] = useDataset({allowRPC: true});
   const [fields] = useSampleFields();
   const [sorts, setSorts] = useSorts({fields});
   const [query] = useUserQuery();
@@ -174,7 +174,7 @@ export function SpansTable({setError}: SpansTableProps) {
               <IconWarning data-test-id="error-indicator" color="gray300" size="lg" />
             </TableStatus>
           ) : result.isFetched && result.data?.length ? (
-            result.data?.map((row, i) => (
+            result.data?.slice(0, 50)?.map((row, i) => (
               <TableRow key={i}>
                 {fields.map((field, j) => {
                   return (

static/app/views/explore/toolbar/index.tsx

@@ -19,7 +19,7 @@ interface ExploreToolbarProps {
 }
 
 export function ExploreToolbar({extras}: ExploreToolbarProps) {
-  const [dataset, setDataset] = useDataset();
+  const [dataset, setDataset] = useDataset({allowRPC: true});
   const [resultMode, setResultMode] = useResultMode();
 
   const [sampleFields] = useSampleFields();

static/app/views/explore/toolbar/toolbarDataset.tsx

@@ -19,6 +19,9 @@ export function ToolbarDataset({dataset, setDataset}: ToolbarDatasetProps) {
         <SegmentedControl.Item key={DiscoverDatasets.SPANS_EAP}>
           {t('EAP Spans')}
         </SegmentedControl.Item>
+        <SegmentedControl.Item key={DiscoverDatasets.SPANS_EAP_RPC}>
+          {t('EAP RPC Spans')}
+        </SegmentedControl.Item>
         <SegmentedControl.Item key={DiscoverDatasets.SPANS_INDEXED}>
           {t('Indexed Spans')}
         </SegmentedControl.Item>