feat(explore): Removes breadcrumbs from the all queries view and adds a create query button (#90833)

Author: edwardgou-sentry

static/app/views/alerts/rules/utils.spec.tsx

@@ -19,7 +19,7 @@ describe('getExploreUrl', () => {
       projectId: '1',
     });
     expect(url).toBe(
-      '/organizations/slug/traces/?dataset=spansRpc&environment=prod&interval=30m&project=1&query=span.op%3Ahttp.client&statsPeriod=7d&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%22p75%28span.duration%29%22%5D%7D'
+      '/organizations/slug/traces/?environment=prod&interval=30m&project=1&query=span.op%3Ahttp.client&statsPeriod=7d&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%22p75%28span.duration%29%22%5D%7D'
     );
   });
   it('should return the correct url for 9998m', () => {
@@ -36,7 +36,7 @@ describe('getExploreUrl', () => {
       projectId: '1',
     });
     expect(url).toBe(
-      '/organizations/slug/traces/?dataset=spansRpc&environment=prod&interval=30m&project=1&query=span.op%3Ahttp.client&statsPeriod=7d&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%22p75%28span.duration%29%22%5D%7D'
+      '/organizations/slug/traces/?environment=prod&interval=30m&project=1&query=span.op%3Ahttp.client&statsPeriod=7d&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%22p75%28span.duration%29%22%5D%7D'
     );
   });
 });

static/app/views/dashboards/utils/getWidgetExploreUrl.spec.tsx

@@ -28,7 +28,7 @@ describe('getWidgetExploreUrl', () => {
 
     // Note: for table widgets the mode is set to samples and the fields are propagated
     expect(url).toBe(
-      '/organizations/org-slug/traces/?dataset=spansRpc&groupBy=span.description&interval=30m&mode=aggregate&statsPeriod=14d&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%22avg%28span.duration%29%22%5D%7D'
+      '/organizations/org-slug/traces/?groupBy=span.description&interval=30m&mode=aggregate&statsPeriod=14d&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%22avg%28span.duration%29%22%5D%7D'
     );
   });
 
@@ -51,7 +51,7 @@ describe('getWidgetExploreUrl', () => {
 
     // Note: for table widgets the mode is set to samples and the fields are propagated
     expect(url).toBe(
-      '/organizations/org-slug/traces/?dataset=spansRpc&field=span.description&field=span.duration&interval=30m&mode=samples&statsPeriod=14d&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%5D%7D'
+      '/organizations/org-slug/traces/?field=span.description&field=span.duration&interval=30m&mode=samples&statsPeriod=14d&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%5D%7D'
     );
   });
 
@@ -75,7 +75,7 @@ describe('getWidgetExploreUrl', () => {
     // Note: for line widgets the mode is set to aggregate
     // The chart type is set to 1 for area charts
     expect(url).toBe(
-      '/organizations/org-slug/traces/?dataset=spansRpc&groupBy=span.description&interval=30m&mode=aggregate&statsPeriod=14d&visualize=%7B%22chartType%22%3A2%2C%22yAxes%22%3A%5B%22avg%28span.duration%29%22%5D%7D'
+      '/organizations/org-slug/traces/?groupBy=span.description&interval=30m&mode=aggregate&statsPeriod=14d&visualize=%7B%22chartType%22%3A2%2C%22yAxes%22%3A%5B%22avg%28span.duration%29%22%5D%7D'
     );
   });
 
@@ -99,7 +99,7 @@ describe('getWidgetExploreUrl', () => {
     // Note: for line widgets the mode is set to aggregate
     // The chart type is set to 1 for area charts
     expect(url).toBe(
-      '/organizations/org-slug/traces/?dataset=spansRpc&groupBy=&interval=30m&mode=aggregate&statsPeriod=14d&visualize=%7B%22chartType%22%3A2%2C%22yAxes%22%3A%5B%22avg%28span.duration%29%22%5D%7D'
+      '/organizations/org-slug/traces/?groupBy=&interval=30m&mode=aggregate&statsPeriod=14d&visualize=%7B%22chartType%22%3A2%2C%22yAxes%22%3A%5B%22avg%28span.duration%29%22%5D%7D'
     );
   });
 
@@ -123,7 +123,7 @@ describe('getWidgetExploreUrl', () => {
 
     // The URL should have the sort and another visualize to plot the sort
     expect(url).toBe(
-      '/organizations/org-slug/traces/?dataset=spansRpc&groupBy=span.description&interval=30m&mode=aggregate&sort=-count%28span.duration%29&statsPeriod=14d&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%22avg%28span.duration%29%22%5D%7D&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%22count%28span.duration%29%22%5D%7D'
+      '/organizations/org-slug/traces/?groupBy=span.description&interval=30m&mode=aggregate&sort=-count%28span.duration%29&statsPeriod=14d&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%22avg%28span.duration%29%22%5D%7D&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%22count%28span.duration%29%22%5D%7D'
     );
   });
 });

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

@@ -1,12 +1,13 @@
-import Breadcrumbs from 'sentry/components/breadcrumbs';
+import {LinkButton} from 'sentry/components/core/button';
 import {ButtonBar} from 'sentry/components/core/button/buttonBar';
 import FeedbackWidgetButton from 'sentry/components/feedback/widget/feedbackWidgetButton';
 import * as Layout from 'sentry/components/layouts/thirds';
 import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle';
+import {IconAdd} from 'sentry/icons/iconAdd';
 import {t} from 'sentry/locale';
 import useOrganization from 'sentry/utils/useOrganization';
 import {SavedQueriesLandingContent} from 'sentry/views/explore/savedQueries/savedQueriesLandingContent';
-import {makeTracesPathname} from 'sentry/views/traces/pathnames';
+import {getExploreUrl} from 'sentry/views/explore/utils';
 
 export default function SavedQueriesView() {
   const organization = useOrganization();
@@ -16,23 +17,19 @@ export default function SavedQueriesView() {
       <Layout.Page>
         <Layout.Header>
           <Layout.HeaderContent>
-            <Breadcrumbs
-              crumbs={[
-                {
-                  label: t('Explore'),
-                  to: makeTracesPathname({organization, path: '/'}),
-                },
-                {
-                  label: t('All Queries'),
-                  to: `/organizations/${organization.slug}/explore/saved-queries/`,
-                },
-              ]}
-            />
             <Layout.Title>{t('All Queries')}</Layout.Title>
           </Layout.HeaderContent>
           <Layout.HeaderActions>
             <ButtonBar gap={1}>
               <FeedbackWidgetButton />
+              <LinkButton
+                priority="primary"
+                icon={<IconAdd />}
+                size="sm"
+                to={getExploreUrl({organization, visualize: []})}
+              >
+                {t('Create Query')}
+              </LinkButton>
             </ButtonBar>
           </Layout.HeaderActions>
         </Layout.Header>

static/app/views/explore/savedQueries/savedQueriesTable.spec.tsx

@@ -125,7 +125,7 @@ describe('SavedQueriesTable', () => {
     });
     expect(await screen.findByText('Query Name')).toHaveAttribute(
       'href',
-      '/organizations/org-slug/traces/?dataset=spansRpc&environment=production&groupBy=&id=1&project=1&title=Query%20Name'
+      '/organizations/org-slug/traces/?environment=production&groupBy=&id=1&project=1&title=Query%20Name'
     );
   });
 
@@ -159,7 +159,7 @@ describe('SavedQueriesTable', () => {
     });
     expect(await screen.findByText('Query Name')).toHaveAttribute(
       'href',
-      '/organizations/org-slug/explore/traces/compare/?dataset=spansRpc&environment=production&id=1&project=1&queries=%7B%22groupBys%22%3A%5B%5D%2C%22yAxes%22%3A%5B%5D%7D&queries=%7B%22groupBys%22%3A%5B%5D%2C%22yAxes%22%3A%5B%5D%7D&title=Query%20Name'
+      '/organizations/org-slug/explore/traces/compare/?environment=production&id=1&project=1&queries=%7B%22groupBys%22%3A%5B%5D%2C%22yAxes%22%3A%5B%5D%7D&queries=%7B%22groupBys%22%3A%5B%5D%2C%22yAxes%22%3A%5B%5D%7D&title=Query%20Name'
     );
   });
 

static/app/views/explore/utils.tsx

@@ -8,7 +8,6 @@ import type {Project} from 'sentry/types/project';
 import {defined} from 'sentry/utils';
 import {dedupeArray} from 'sentry/utils/dedupeArray';
 import {encodeSort} from 'sentry/utils/discover/eventView';
-import {DiscoverDatasets} from 'sentry/utils/discover/types';
 import {decodeSorts} from 'sentry/utils/queryString';
 import {MutableSearch} from 'sentry/utils/tokenizeSearch';
 import {determineSeriesSampleCountAndIsSampled} from 'sentry/views/alerts/rules/metric/utils/determineSeriesSampleCount';
@@ -53,7 +52,6 @@ export function getExploreUrl({
   const {start, end, period: statsPeriod, utc} = selection?.datetime ?? {};
   const {environments, projects} = selection ?? {};
   const queryParams = {
-    dataset: DiscoverDatasets.SPANS_EAP_RPC,
     project: projects,
     environment: environments,
     statsPeriod,
@@ -153,7 +151,6 @@ function getExploreMultiQueryUrl({
   const {start, end, period: statsPeriod, utc} = selection.datetime;
   const {environments, projects} = selection;
   const queryParams = {
-    dataset: DiscoverDatasets.SPANS_EAP_RPC,
     project: projects,
     environment: environments,
     statsPeriod,