Add back and forward support for app actions

src/components/Explore/GroupBySelector.tsx

@@ -8,6 +8,7 @@ import { ALL, ignoredAttributes, maxOptions, MetricFunction, RESOURCE_ATTR, SPAN
 import { AttributesBreakdownScene } from './TracesByService/Tabs/Breakdown/AttributesBreakdownScene';
 import { AttributesComparisonScene } from './TracesByService/Tabs/Comparison/AttributesComparisonScene';
 import { getFiltersVariable, getMetricVariable } from 'utils/utils';
+import { locationService } from '@grafana/runtime';
 
 type Props = {
   options: Array<SelectableValue<string>>;
@@ -122,7 +123,11 @@ export function GroupBySelector({ options, radioAttributes, value, onChange, sho
           value={value && getModifiedSelectOptions(otherAttrOptions).some((x) => x.value === value) ? value : null} // remove value from select when radio button clicked
           placeholder={'Other attributes'}
           options={getModifiedSelectOptions(otherAttrOptions)}
-          onChange={(selected) => onChange(selected?.value ?? defaultOnChangeValue)}
+          onChange={(selected) => {
+            const newSelected = selected?.value ?? defaultOnChangeValue;
+            locationService.partial({ 'var-groupBy': newSelected });
+            onChange(newSelected);
+          }}
           className={styles.select}
           isClearable
           onInputChange={(value: string, { action }: InputActionMeta) => {

src/components/Explore/panels/histogram.ts

@@ -2,6 +2,7 @@ import { getTraceByServiceScene, shouldShowSelection } from '../../../utils/util
 import { ComparisonSelection } from '../../../utils/shared';
 import { reportAppInteraction, USER_EVENTS_ACTIONS, USER_EVENTS_PAGES } from '../../../utils/analytics';
 import { PanelBuilders, SceneFlexItem, SceneFlexLayout, SceneObject } from '@grafana/scenes';
+import { locationService } from '@grafana/runtime';
 
 export function getHistogramVizPanel(scene: SceneObject, yBuckets: number[]) {
   const parent = getTraceByServiceScene(scene);
@@ -22,6 +23,7 @@ export function getHistogramVizPanel(scene: SceneObject, yBuckets: number[]) {
         const rawSelection = args[0];
         // @ts-ignore
         const newSelection: ComparisonSelection = { type: 'manual', raw: rawSelection };
+        locationService.partial({ 'selection': newSelection });
 
         newSelection.timeRange = {
           from: Math.round((rawSelection.x?.from || 0) / 1000),

src/pages/Explore/TraceExploration.tsx

@@ -23,6 +23,7 @@ import {
 import {
   LocationService,
   config,
+  locationService,
   // @ts-ignore
   sidecarServiceSingleton_EXPERIMENTAL,
 } from '@grafana/runtime';
@@ -189,6 +190,8 @@ export class TraceExploration extends SceneObjectBase<TraceExplorationState> {
     if (!signal || this.state.primarySignal === signal) {
       return;
     }
+
+    locationService.partial({ 'primarySignal': signal });
     this.setState({ primarySignal: signal });
   };
 
@@ -197,6 +200,8 @@ export class TraceExploration extends SceneObjectBase<TraceExplorationState> {
     if (!metric || variable.getValue() === metric) {
       return;
     }
+
+    locationService.partial({ 'var-metric': metric });
     variable.changeValueTo(metric);
   };