fix(dashboards-eap): Open in Explore passing aggregates as fields

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

@@ -9,7 +9,7 @@ describe('getWidgetExploreUrl', () => {
   const organization = OrganizationFixture();
   const selection = PageFiltersFixture();
 
-  it('returns the correct url for table widgets', () => {
+  it('returns the correct aggregate mode url for table widgets with aggregation', () => {
     const widget = WidgetFixture({
       displayType: DisplayType.TABLE,
       queries: [
@@ -28,7 +28,30 @@ 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=avg%28span.duration%29&groupBy=span.description&interval=30m&mode=samples&statsPeriod=14d&visualize=%7B%22chartType%22%3A1%2C%22yAxes%22%3A%5B%22avg%28span.duration%29%22%5D%7D'
+      '/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'
+    );
+  });
+
+  it('returns the correct samples mode url for table widgets without aggregation', () => {
+    const widget = WidgetFixture({
+      displayType: DisplayType.TABLE,
+      queries: [
+        {
+          fields: ['span.description', 'span.duration'],
+          aggregates: [],
+          columns: [],
+          conditions: '',
+          orderby: '',
+          name: '',
+        },
+      ],
+    });
+
+    const url = getWidgetExploreUrl(widget, selection, organization);
+
+    // 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'
     );
   });
 
@@ -52,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&field=span.description&field=avg%28span.duration%29&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/?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'
     );
   });
 
@@ -76,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&field=avg%28span.duration%29&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/?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'
     );
   });
 
@@ -100,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&field=span.description&field=avg%28span.duration%29&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/?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'
     );
   });
 });

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

@@ -40,11 +40,13 @@ export function getWidgetExploreUrl(
   const yAxisOptions = eventView.getYAxisOptions().map(({value}) => value);
   locationQueryParams.yAxes = [
     ...new Set(
-      widget.queries[0]!.aggregates.filter(aggregate => yAxisOptions.includes(aggregate))
+      (widget.displayType === DisplayType.TABLE
+        ? widget.queries[0]!.fields?.filter(isAggregateFieldOrEquation)
+        : widget.queries[0]!.aggregates
+      )?.filter(aggregate => yAxisOptions.includes(aggregate))
     ),
   ].slice(0, 3);
 
-  // Visualization specific transforms
   let exploreMode: Mode | undefined = undefined;
   let chartType: ChartType = ChartType.LINE;
   switch (widget.displayType) {
@@ -62,7 +64,11 @@ export function getWidgetExploreUrl(
       break;
     case DisplayType.TABLE:
     case DisplayType.BIG_NUMBER:
-      exploreMode = Mode.SAMPLES;
+      if (locationQueryParams.yAxes.length > 0) {
+        exploreMode = Mode.AGGREGATE;
+      } else {
+        exploreMode = Mode.SAMPLES;
+      }
       break;
     default:
       break;
@@ -77,8 +83,8 @@ export function getWidgetExploreUrl(
   const query = widget.queries[0]!;
   const queryFields =
     defined(query.fields) && widget.displayType === DisplayType.TABLE
-      ? query.fields
-      : [...query.columns, ...query.aggregates];
+      ? query.fields.filter(field => !isAggregateFieldOrEquation(field))
+      : [...query.columns];
 
   // Updates fields by adding any individual terms from equation fields as a column
   getFieldsFromEquations(queryFields).forEach(term => {
@@ -130,8 +136,8 @@ export function getWidgetExploreUrl(
           ]
         : []),
     ],
-    groupBy,
-    field: decodeList(locationQueryParams.field),
+    groupBy: exploreMode === Mode.SAMPLES ? undefined : groupBy,
+    field: exploreMode === Mode.SAMPLES ? decodeList(queryFields) : undefined,
     query: decodeScalar(locationQueryParams.query),
     sort: locationQueryParams.sort || undefined,
     interval: