PieChart: Fix right-oriented legends (#116084) (#116159)

* chore(gdev-dashboard): reproduce CSS layout bug in a panel

* fix(table-legend): tweak CSS for right oriented table legend in piechart

* chore(gdev-dashboard): update migrated dashboard file to match

Co-authored-by: Jesse David Peterson <jesdavpet@users.noreply.github.com>

apps/alerting/notifications/pkg/apis/alertingnotifications/v0alpha1/receiver_schema_gen.go

@@ -13,7 +13,7 @@ import (
 // schema is unexported to prevent accidental overwrites
 var (
 	schemaReceiver = resource.NewSimpleSchema("notifications.alerting.grafana.app", "v0alpha1", NewReceiver(), &ReceiverList{}, resource.WithKind("Receiver"),
-		resource.WithPlural("receivers"), resource.WithScope(resource.NamespacedScope), resource.WithSelectableFields([]resource.SelectableField{resource.SelectableField{
+		resource.WithPlural("receivers"), resource.WithScope(resource.NamespacedScope), resource.WithSelectableFields([]resource.SelectableField{{
 			FieldSelector: "spec.title",
 			FieldValueFunc: func(o resource.Object) (string, error) {
 				cast, ok := o.(*Receiver)

apps/dashboard/kinds/v2alpha1/dashboard_spec.cue

@@ -790,8 +790,6 @@ VariableOption: {
 	text: string | [...string]
 	// Value of the option
 	value: string | [...string]
-	// Additional properties for multi-props variables
-	properties?: {[string]: string}
 }
 
 // Query variable specification

apps/dashboard/kinds/v2beta1/dashboard_spec.cue

@@ -794,8 +794,6 @@ VariableOption: {
 	text: string | [...string]
 	// Value of the option
 	value: string | [...string]
-	// Additional properties for multi-props variables
-	properties?: {[string]: string}
 }
 
 // Query variable specification

apps/dashboard/pkg/apis/dashboard/v0alpha1/dashboard_object_gen.go

@@ -301,8 +301,6 @@ var _ resource.ListObject = &DashboardList{}
 
 // Copy methods for all subresource types
 
-
-
 // DeepCopy creates a full deep copy of DashboardStatus
 func (s *DashboardStatus) DeepCopy() *DashboardStatus {
 	cpy := &DashboardStatus{}

apps/dashboard/pkg/apis/dashboard/v1beta1/dashboard_object_gen.go

@@ -301,8 +301,6 @@ var _ resource.ListObject = &DashboardList{}
 
 // Copy methods for all subresource types
 
-
-
 // DeepCopy creates a full deep copy of DashboardStatus
 func (s *DashboardStatus) DeepCopy() *DashboardStatus {
 	cpy := &DashboardStatus{}

apps/dashboard/pkg/apis/dashboard/v2alpha1/dashboard_spec.cue

@@ -794,8 +794,6 @@ VariableOption: {
 	text: string | [...string]
 	// Value of the option
 	value: string | [...string]
-	// Additional properties for multi-props variables
-	properties?: {[string]: string}
 }
 
 // Query variable specification

apps/dashboard/pkg/apis/dashboard/v2alpha1/dashboard_spec_gen.go

@@ -1411,8 +1411,6 @@ type DashboardVariableOption struct {
 	Text DashboardStringOrArrayOfString `json:"text"`
 	// Value of the option
 	Value DashboardStringOrArrayOfString `json:"value"`
-	// Additional properties for multi-props variables
-	Properties map[string]string `json:"properties,omitempty"`
 }
 
 // NewDashboardVariableOption creates a new DashboardVariableOption object.

apps/dashboard/pkg/apis/dashboard/v2beta1/dashboard_spec.cue

@@ -798,8 +798,6 @@ VariableOption: {
 	text: string | [...string]
 	// Value of the option
 	value: string | [...string]
-	// Additional properties for multi-props variables
-	properties?: {[string]: string}
 }
 
 // Query variable specification

apps/dashboard/pkg/apis/dashboard/v2beta1/dashboard_spec_gen.go

@@ -1414,8 +1414,6 @@ type DashboardVariableOption struct {
 	Text DashboardStringOrArrayOfString `json:"text"`
 	// Value of the option
 	Value DashboardStringOrArrayOfString `json:"value"`
-	// Additional properties for multi-props variables
-	Properties map[string]string `json:"properties,omitempty"`
 }
 
 // NewDashboardVariableOption creates a new DashboardVariableOption object.

apps/dashboard/pkg/migration/testdata/dev-dashboards-output/panel-piechart/panel_test_piechart.v42.json

@@ -290,7 +290,7 @@
         ],
         "legend": {
           "displayMode": "table",
-          "placement": "bottom",
+          "placement": "right",
           "showLegend": true,
           "values": [
             "percent"
@@ -304,7 +304,7 @@
           "fields": "",
           "values": false
         },
-        "showLegend": false,
+        "showLegend": true,
         "strokeWidth": 1,
         "text": {}
       },
@@ -323,6 +323,15 @@
         }
       ],
       "title": "Percent",
+      "transformations": [
+        {
+          "id": "renameByRegex",
+          "options": {
+            "regex": "^Backend-(.*)$",
+            "renamePattern": "b-$1"
+          }
+        }
+      ],
       "type": "piechart"
     },
     {
@@ -366,7 +375,7 @@
         ],
         "legend": {
           "displayMode": "table",
-          "placement": "bottom",
+          "placement": "right",
           "showLegend": true,
           "values": [
             "value"
@@ -380,7 +389,7 @@
           "fields": "",
           "values": false
         },
-        "showLegend": false,
+        "showLegend": true,
         "strokeWidth": 1,
         "text": {}
       },
@@ -399,6 +408,15 @@
         }
       ],
       "title": "Value",
+      "transformations": [
+        {
+          "id": "renameByRegex",
+          "options": {
+            "regex": "(.*)",
+            "renamePattern": "$1-how-much-wood-could-a-woodchuck-chuck-if-a-woodchuck-could-chuck-wood"
+          }
+        }
+      ],
       "type": "piechart"
     },
     {

apps/folder/pkg/apis/manifestdata/folder_manifest.go

@@ -18,8 +18,6 @@ import (
 	v1beta1 "github.com/grafana/grafana/apps/folder/pkg/apis/folder/v1beta1"
 )
 
-var ()
-
 var appManifestData = app.ManifestData{
 	AppName:          "folder",
 	Group:            "folder.grafana.app",

devenv/dev-dashboards/panel-piechart/panel_test_piechart.json

@@ -248,7 +248,7 @@
         "legend": {
           "values": ["percent"],
           "displayMode": "table",
-          "placement": "bottom"
+          "placement": "right"
         },
         "pieType": "pie",
         "reduceOptions": {
@@ -256,7 +256,7 @@
           "fields": "",
           "values": false
         },
-        "showLegend": false,
+        "showLegend": true,
         "strokeWidth": 1,
         "text": {}
       },
@@ -272,6 +272,15 @@
       "timeFrom": null,
       "timeShift": null,
       "title": "Percent",
+      "transformations": [
+        {
+          "id": "renameByRegex",
+          "options": {
+            "regex": "^Backend-(.*)$",
+            "renamePattern": "b-$1"
+          }
+        }
+      ],
       "type": "piechart"
     },
     {
@@ -311,7 +320,7 @@
         "legend": {
           "values": ["value"],
           "displayMode": "table",
-          "placement": "bottom"
+          "placement": "right"
         },
         "pieType": "pie",
         "reduceOptions": {
@@ -319,7 +328,7 @@
           "fields": "",
           "values": false
         },
-        "showLegend": false,
+        "showLegend": true,
         "strokeWidth": 1,
         "text": {}
       },
@@ -335,6 +344,15 @@
       "timeFrom": null,
       "timeShift": null,
       "title": "Value",
+      "transformations": [
+        {
+          "id": "renameByRegex",
+          "options": {
+            "regex": "(.*)",
+            "renamePattern": "$1-how-much-wood-could-a-woodchuck-chuck-if-a-woodchuck-could-chuck-wood"
+          }
+        }
+      ],
       "type": "piechart"
     },
     {

docs/sources/alerting/monitor-status/view-alert-rules.md

@@ -41,13 +41,9 @@ Select a group to expand it and view the list of alert rules within that group.
 
 The list view includes a number of filters to simplify managing large volumes of alerts.
 
-## Filter and save searches
-
 Click the **Filter** button to open the filter popup. You can filter by name, label, folder/namespace, evaluation group, data source, contact point, rule source, rule state, rule type, and the health of the alert rule from the popup menu. Click **Apply** at the bottom of the filter popup to enact the filters as you search.
 
-Click the **Saved searches** button to open the list of previously saved searches, or click **+ Save current search** to add your current search to the saved searches list. You can also rename a saved search or set it as a default search. When you set a saved search as the default search, the Alert rules page opens with the search applied.
-
-{{< figure src="/media/docs/alerting/alerting-saved-searches.png" max-width="750px" alt="Alert rule filter options" >}}
+{{< figure src="/media/docs/alerting/alerting-list-view-filter.png" max-width="750px" alt="Alert rule filter options" >}}
 
 ## Change alert rules list view
 

docs/sources/tutorials/alerting-get-started-pt6/index.md

@@ -23,8 +23,6 @@ killercoda:
 
 This tutorial is a continuation of the [Get started with Grafana Alerting - Route alerts using dynamic labels](http://www.grafana.com/tutorials/alerting-get-started-pt5/) tutorial.
 
-{{< youtube id="mqj_hN24zLU" >}}
-
 <!-- USE CASE -->
 
 In this tutorial you will learn how to:

packages/grafana-data/src/types/featureToggles.gen.ts

@@ -400,6 +400,10 @@ export interface FeatureToggles {
   */
   tableSharedCrosshair?: boolean;
   /**
+  * Use the kubernetes API for feature toggle management in the frontend
+  */
+  kubernetesFeatureToggles?: boolean;
+  /**
   * Enabled grafana cloud specific RBAC roles
   */
   cloudRBACRoles?: boolean;

packages/grafana-sql/src/SQLVariableSupport.tsx

@@ -1,174 +0,0 @@
-import { useEffect, useState } from 'react';
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
-
-import {
-  CustomVariableSupport,
-  DataQueryRequest,
-  DataQueryResponse,
-  QueryEditorProps,
-  Field,
-  DataFrame,
-  MetricFindValue,
-} from '@grafana/data';
-import { t } from '@grafana/i18n';
-import { EditorMode, EditorRows, EditorRow, EditorField } from '@grafana/plugin-ui';
-import { Combobox, ComboboxOption } from '@grafana/ui';
-
-import { SqlQueryEditorLazy } from './components/QueryEditorLazy';
-import { SqlDatasource } from './datasource/SqlDatasource';
-import { applyQueryDefaults } from './defaults';
-import { QueryFormat, type SQLQuery, type SQLOptions, type SQLQueryMeta } from './types';
-
-type SQLVariableQuery = { query: string } & SQLQuery;
-
-const refId = 'SQLVariableQueryEditor-VariableQuery';
-
-export class SQLVariableSupport extends CustomVariableSupport<SqlDatasource, SQLQuery> {
-  constructor(readonly datasource: SqlDatasource) {
-    super();
-  }
-  editor = SQLVariablesQueryEditor;
-  query(request: DataQueryRequest<SQLQuery>): Observable<DataQueryResponse> {
-    if (request.targets.length < 1) {
-      throw new Error('no variable query found');
-    }
-    const updatedQuery = migrateVariableQuery(request.targets[0]);
-    return this.datasource.query({ ...request, targets: [updatedQuery] }).pipe(
-      map((d: DataQueryResponse) => {
-        const frames = d.data || [];
-        const metricFindValues = convertDataFramesToMetricFindValues(frames, updatedQuery.meta);
-        return { data: metricFindValues };
-      })
-    );
-  }
-  getDefaultQuery(): Partial<SQLQuery> {
-    return applyQueryDefaults({ refId, editorMode: EditorMode.Builder, format: QueryFormat.Table });
-  }
-}
-
-type SQLVariableQueryEditorProps = QueryEditorProps<SqlDatasource, SQLQuery, SQLOptions>;
-
-const SQLVariablesQueryEditor = (props: SQLVariableQueryEditorProps) => {
-  const query = migrateVariableQuery(props.query);
-  return (
-    <>
-      <SqlQueryEditorLazy {...props} query={query} />
-      <FieldMapping {...props} query={query} />
-    </>
-  );
-};
-
-const FieldMapping = (props: SQLVariableQueryEditorProps) => {
-  const { query, datasource, onChange } = props;
-  const [choices, setChoices] = useState<ComboboxOption[]>([]);
-  useEffect(() => {
-    let isActive = true;
-    // eslint-disable-next-line
-    const subscription = datasource.query({ targets: [query] } as DataQueryRequest<SQLQuery>).subscribe({
-      next: (response) => {
-        if (!isActive) {
-          return;
-        }
-        const fieldNames = (response.data[0] || { fields: [] }).fields.map((f: Field) => f.name);
-        setChoices(fieldNames.map((f: Field) => ({ value: f, label: f })));
-      },
-      error: () => {
-        if (isActive) {
-          setChoices([]);
-        }
-      },
-    });
-    return () => {
-      isActive = false;
-      subscription.unsubscribe();
-    };
-  }, [datasource, query]);
-  const onMetaPropChange = <Key extends keyof SQLQueryMeta, Value extends SQLQueryMeta[Key]>(
-    key: Key,
-    value: Value,
-    meta = query.meta || {}
-  ) => {
-    onChange({ ...query, meta: { ...meta, [key]: value } });
-  };
-  return (
-    <EditorRows>
-      <EditorRow>
-        <EditorField label={t('grafana-sql.components.query-meta.variables.valueField', 'Value Field')}>
-          <Combobox
-            isClearable
-            value={query.meta?.valueField}
-            onChange={(e) => onMetaPropChange('valueField', e?.value)}
-            width={40}
-            options={choices}
-          />
-        </EditorField>
-        <EditorField label={t('grafana-sql.components.query-meta.variables.textField', 'Text Field')}>
-          <Combobox
-            isClearable
-            value={query.meta?.textField}
-            onChange={(e) => onMetaPropChange('textField', e?.value)}
-            width={40}
-            options={choices}
-          />
-        </EditorField>
-      </EditorRow>
-    </EditorRows>
-  );
-};
-
-const migrateVariableQuery = (rawQuery: string | SQLQuery): SQLVariableQuery => {
-  if (typeof rawQuery !== 'string') {
-    return {
-      ...rawQuery,
-      refId: rawQuery.refId || refId,
-      query: rawQuery.rawSql || '',
-    };
-  }
-  return {
-    ...applyQueryDefaults({
-      refId,
-      rawSql: rawQuery,
-      editorMode: rawQuery ? EditorMode.Code : EditorMode.Builder,
-    }),
-    query: rawQuery,
-  };
-};
-
-const convertDataFramesToMetricFindValues = (frames: DataFrame[], meta?: SQLQueryMeta): MetricFindValue[] => {
-  if (!frames.length) {
-    throw new Error('no results found');
-  }
-
-  const frame = frames[0];
-
-  const fields = frame.fields;
-
-  if (fields.length < 1) {
-    throw new Error('no fields found in the response');
-  }
-
-  let textField = fields.find((f) => f.name === '__text');
-  let valueField = fields.find((f) => f.name === '__value');
-  if (meta?.textField) {
-    textField = fields.find((f) => f.name === meta.textField);
-  }
-  if (meta?.valueField) {
-    valueField = fields.find((f) => f.name === meta.valueField);
-  }
-  const resolvedTextField = textField || valueField || fields[0];
-  const resolvedValueField = valueField || textField || fields[0];
-
-  const results: MetricFindValue[] = [];
-  const rowCount = frame.length;
-  for (let i = 0; i < rowCount; i++) {
-    const text = String(resolvedTextField.values[i] ?? '');
-    const value = String(resolvedValueField.values[i] ?? '');
-    const properties: Record<string, string> = {};
-    for (const field of fields) {
-      properties[field.name] = String(field.values[i] ?? '');
-    }
-    results.push({ text, value, properties });
-  }
-  return results;
-};

packages/grafana-sql/src/index.ts

@@ -21,7 +21,6 @@ export { TLSSecretsConfig } from './components/configuration/TLSSecretsConfig';
 export { useMigrateDatabaseFields } from './components/configuration/useMigrateDatabaseFields';
 export { SqlQueryEditorLazy } from './components/QueryEditorLazy';
 export type { QueryHeaderProps } from './components/QueryHeader';
-export { SQLVariableSupport } from './SQLVariableSupport';
 export { createSelectClause, haveColumns } from './utils/sql.utils';
 export { applyQueryDefaults } from './defaults';
 export { makeVariable } from './utils/testHelpers';

packages/grafana-sql/src/locales/en-US/grafana-sql.json

@@ -69,12 +69,6 @@
         "placeholder-select-format": "Select format",
         "run-query": "Run query"
       },
-      "query-meta": {
-        "variables": {
-          "textField": "Text Field",
-          "valueField": "Value Field"
-        }
-      },
       "query-toolbox": {
         "content-hit-ctrlcmdreturn-to-run-query": "Hit CTRL/CMD+Return to run query",
         "tooltip-collapse": "Collapse editor",

packages/grafana-sql/src/types.ts

@@ -50,8 +50,6 @@ export enum QueryFormat {
   Table = 'table',
 }
 
-export type SQLQueryMeta = { valueField?: string; textField?: string };
-
 export interface SQLQuery extends DataQuery {
   alias?: string;
   format?: QueryFormat;
@@ -61,7 +59,6 @@ export interface SQLQuery extends DataQuery {
   sql?: SQLExpression;
   editorMode?: EditorMode;
   rawQuery?: boolean;
-  meta?: SQLQueryMeta;
 }
 
 export interface NameValue {

packages/grafana-ui/src/components/VizLegend/VizLegendTable.tsx

@@ -119,6 +119,7 @@ const getStyles = (theme: GrafanaTheme2) => ({
   table: css({
     width: '100%',
     'th:first-child': {
+      width: '100%',
       borderBottom: `1px solid ${theme.colors.border.weak}`,
     },
   }),

packages/grafana-ui/src/components/VizLegend/VizLegendTableItem.tsx

@@ -134,6 +134,7 @@ const getStyles = (theme: GrafanaTheme2) => {
       label: 'LegendLabelCell',
       maxWidth: 0,
       width: '100%',
+      minWidth: theme.spacing(16),
     }),
     labelCellInner: css({
       label: 'LegendLabelCellInner',

pkg/services/featuremgmt/registry.go

@@ -650,6 +650,13 @@ var (
 			Stage:        FeatureStageExperimental,
 			Owner:        grafanaDatavizSquad,
 		},
+		{
+			Name:         "kubernetesFeatureToggles",
+			Description:  "Use the kubernetes API for feature toggle management in the frontend",
+			Stage:        FeatureStageExperimental,
+			FrontendOnly: true,
+			Owner:        grafanaOperatorExperienceSquad,
+		},
 		{
 			Name:            "cloudRBACRoles",
 			Description:     "Enabled grafana cloud specific RBAC roles",

pkg/services/featuremgmt/toggles_gen.csv

@@ -90,6 +90,7 @@ pdfTables,preview,@grafana/grafana-operator-experience-squad,false,false,false
 canvasPanelPanZoom,preview,@grafana/dataviz-squad,false,false,true
 timeComparison,experimental,@grafana/dataviz-squad,false,false,true
 tableSharedCrosshair,experimental,@grafana/dataviz-squad,false,false,true
+kubernetesFeatureToggles,experimental,@grafana/grafana-operator-experience-squad,false,false,true
 cloudRBACRoles,preview,@grafana/identity-access-team,false,true,false
 alertingQueryOptimization,GA,@grafana/alerting-squad,false,false,false
 jitterAlertRulesWithinGroups,preview,@grafana/alerting-squad,false,true,false

pkg/services/featuremgmt/toggles_gen.json

@@ -2044,8 +2044,7 @@
       "metadata": {
         "name": "kubernetesFeatureToggles",
         "resourceVersion": "1764664939750",
-        "creationTimestamp": "2024-01-18T05:32:44Z",
-        "deletionTimestamp": "2026-01-07T12:02:51Z"
+        "creationTimestamp": "2024-01-18T05:32:44Z"
       },
       "spec": {
         "description": "Use the kubernetes API for feature toggle management in the frontend",

public/app/features/alerting/unified/components/rule-viewer/RuleViewer.test.tsx

@@ -3,8 +3,7 @@ import { render, screen, userEvent, waitFor } from 'test/test-utils';
 import { byLabelText, byRole, byText } from 'testing-library-selector';
 
 import { setPluginLinksHook } from '@grafana/runtime';
-import server from '@grafana/test-utils/server';
-import { mockAlertRuleApi, setupMswServer } from 'app/features/alerting/unified/mockApi';
+import { setupMswServer } from 'app/features/alerting/unified/mockApi';
 import { AlertManagerDataSourceJsonData } from 'app/plugins/datasource/alertmanager/types';
 import { AccessControlAction } from 'app/types/accessControl';
 import { CombinedRule, RuleIdentifier } from 'app/types/unified-alerting';
@@ -23,7 +22,6 @@ import {
   mockPluginLinkExtension,
   mockPromAlertingRule,
   mockRulerGrafanaRecordingRule,
-  mockRulerGrafanaRule,
 } from '../../mocks';
 import { grafanaRulerRule } from '../../mocks/grafanaRulerApi';
 import { grantPermissionsHelper } from '../../test/test-utils';
@@ -132,8 +130,6 @@ const dataSources = {
 };
 
 describe('RuleViewer', () => {
-  const api = mockAlertRuleApi(server);
-
   beforeEach(() => {
     setupDataSources(...Object.values(dataSources));
   });
@@ -253,22 +249,19 @@ describe('RuleViewer', () => {
 
         expect(screen.getAllByRole('row')).toHaveLength(7);
         expect(screen.getAllByRole('row')[1]).toHaveTextContent(/6Provisioning2025-01-18 04:35:17/i);
-        expect(screen.getAllByRole('row')[1]).toHaveTextContent('Updated by provisioning service');
-        expect(screen.getAllByRole('row')[1]).toHaveTextContent('+4-3Latest');
+        expect(screen.getAllByRole('row')[1]).toHaveTextContent('+3-3Latest');
 
         expect(screen.getAllByRole('row')[2]).toHaveTextContent(/5Alerting2025-01-17 04:35:17/i);
-        expect(screen.getAllByRole('row')[2]).toHaveTextContent('+5-6');
+        expect(screen.getAllByRole('row')[2]).toHaveTextContent('+5-5');
 
         expect(screen.getAllByRole('row')[3]).toHaveTextContent(/4different user2025-01-16 04:35:17/i);
-        expect(screen.getAllByRole('row')[3]).toHaveTextContent('Changed alert title and thresholds');
-        expect(screen.getAllByRole('row')[3]).toHaveTextContent('+6-5');
+        expect(screen.getAllByRole('row')[3]).toHaveTextContent('+5-5');
 
         expect(screen.getAllByRole('row')[4]).toHaveTextContent(/3user12025-01-15 04:35:17/i);
-        expect(screen.getAllByRole('row')[4]).toHaveTextContent('+5-10');
+        expect(screen.getAllByRole('row')[4]).toHaveTextContent('+5-9');
 
         expect(screen.getAllByRole('row')[5]).toHaveTextContent(/2User ID foo2025-01-14 04:35:17/i);
-        expect(screen.getAllByRole('row')[5]).toHaveTextContent('Updated evaluation interval and routing');
-        expect(screen.getAllByRole('row')[5]).toHaveTextContent('+12-7');
+        expect(screen.getAllByRole('row')[5]).toHaveTextContent('+11-7');
 
         expect(screen.getAllByRole('row')[6]).toHaveTextContent(/1Unknown 2025-01-13 04:35:17/i);
 
@@ -282,10 +275,9 @@ describe('RuleViewer', () => {
         await renderRuleViewer(mockRule, mockRuleIdentifier, ActiveTab.VersionHistory);
         expect(await screen.findByRole('button', { name: /Compare versions/i })).toBeDisabled();
 
-        // Check for special updated_by values - use getAllByRole since some text appears in multiple columns
-        expect(screen.getAllByRole('cell', { name: /provisioning/i }).length).toBeGreaterThan(0);
-        expect(screen.getByRole('cell', { name: /^alerting$/i })).toBeInTheDocument();
-        expect(screen.getByRole('cell', { name: /^Unknown$/i })).toBeInTheDocument();
+        expect(screen.getByRole('cell', { name: /provisioning/i })).toBeInTheDocument();
+        expect(screen.getByRole('cell', { name: /alerting/i })).toBeInTheDocument();
+        expect(screen.getByRole('cell', { name: /Unknown/i })).toBeInTheDocument();
         expect(screen.getByRole('cell', { name: /user id foo/i })).toBeInTheDocument();
       });
 
@@ -329,47 +321,6 @@ describe('RuleViewer', () => {
         await renderRuleViewer(rule, ruleIdentifier);
         expect(screen.queryByText('Labels')).not.toBeInTheDocument();
       });
-
-      it('shows Notes column when versions have messages', async () => {
-        await renderRuleViewer(mockRule, mockRuleIdentifier, ActiveTab.VersionHistory);
-
-        expect(await screen.findByRole('columnheader', { name: /Notes/i })).toBeInTheDocument();
-        expect(screen.getAllByRole('row')).toHaveLength(7); // 1 header + 6 data rows
-        expect(screen.getByRole('cell', { name: /Updated by provisioning service/i })).toBeInTheDocument();
-        expect(screen.getByRole('cell', { name: /Changed alert title and thresholds/i })).toBeInTheDocument();
-        expect(screen.getByRole('cell', { name: /Updated evaluation interval and routing/i })).toBeInTheDocument();
-      });
-
-      it('does not show Notes column when no versions have messages', async () => {
-        const versionsWithoutMessages = [
-          mockRulerGrafanaRule(
-            {},
-            {
-              uid: grafanaRulerRule.grafana_alert.uid,
-              version: 2,
-              updated: '2025-01-14T09:35:17.000Z',
-              updated_by: { uid: 'foo', name: '' },
-            }
-          ),
-          mockRulerGrafanaRule(
-            {},
-            {
-              uid: grafanaRulerRule.grafana_alert.uid,
-              version: 1,
-              updated: '2025-01-13T09:35:17.000Z',
-              updated_by: null,
-            }
-          ),
-        ];
-        api.getAlertRuleVersionHistory(grafanaRulerRule.grafana_alert.uid, versionsWithoutMessages);
-
-        await renderRuleViewer(mockRule, mockRuleIdentifier, ActiveTab.VersionHistory);
-
-        await screen.findByRole('button', { name: /Compare versions/i });
-
-        expect(screen.getAllByRole('row')).toHaveLength(3); // 1 header + 2 data rows
-        expect(screen.queryByRole('columnheader', { name: /Notes/i })).not.toBeInTheDocument();
-      });
     });
   });
 

public/app/features/alerting/unified/components/rule-viewer/tabs/version-history/VersionHistoryTable.tsx

@@ -1,9 +1,8 @@
-import { css } from '@emotion/css';
 import { useMemo, useState } from 'react';
 
 import { dateTimeFormat, dateTimeFormatTimeAgo } from '@grafana/data';
 import { Trans, t } from '@grafana/i18n';
-import { Badge, Button, Checkbox, Column, InteractiveTable, Stack, Text, useStyles2 } from '@grafana/ui';
+import { Badge, Button, Checkbox, Column, InteractiveTable, Stack, Text } from '@grafana/ui';
 import { GRAFANA_RULES_SOURCE_NAME } from 'app/features/alerting/unified/utils/datasource';
 import { computeVersionDiff } from 'app/features/alerting/unified/utils/diff';
 import { RuleIdentifier } from 'app/types/unified-alerting';
@@ -34,7 +33,6 @@ export function VersionHistoryTable({
   onRestoreError,
   canRestore,
 }: VersionHistoryTableProps) {
-  const styles = useStyles2(getStyles);
   const [showConfirmModal, setShowConfirmModal] = useState(false);
   const [ruleToRestore, setRuleToRestore] = useState<RulerGrafanaRuleDTO<GrafanaRuleDefinition>>();
   const ruleToRestoreUid = ruleToRestore?.grafana_alert?.uid ?? '';
@@ -43,8 +41,6 @@ export function VersionHistoryTable({
     [ruleToRestoreUid]
   );
 
-  const hasAnyNotes = useMemo(() => ruleVersions.some((v) => v.grafana_alert.message), [ruleVersions]);
-
   const showConfirmation = (ruleToRestore: RulerGrafanaRuleDTO<GrafanaRuleDefinition>) => {
     setShowConfirmModal(true);
     setRuleToRestore(ruleToRestore);
@@ -56,15 +52,6 @@ export function VersionHistoryTable({
 
   const unknown = t('alerting.alertVersionHistory.unknown', 'Unknown');
 
-  const notesColumn: Column<RulerGrafanaRuleDTO<GrafanaRuleDefinition>> = {
-    id: 'notes',
-    header: t('core.versionHistory.table.notes', 'Notes'),
-    cell: ({ row }) => {
-      const message = row.original.grafana_alert.message;
-      return message || null;
-    },
-  };
-
   const columns: Array<Column<RulerGrafanaRuleDTO<GrafanaRuleDefinition>>> = [
     {
       disableGrow: true,
@@ -104,12 +91,9 @@ export function VersionHistoryTable({
         if (!value) {
           return unknown;
         }
-        return (
-          <span className={styles.nowrap}>{dateTimeFormat(value) + ' (' + dateTimeFormatTimeAgo(value) + ')'}</span>
-        );
+        return dateTimeFormat(value) + ' (' + dateTimeFormatTimeAgo(value) + ')';
       },
     },
-    ...(hasAnyNotes ? [notesColumn] : []),
     {
       id: 'diff',
       disableGrow: true,
@@ -195,9 +179,3 @@ export function VersionHistoryTable({
     </>
   );
 }
-
-const getStyles = () => ({
-  nowrap: css({
-    whiteSpace: 'nowrap',
-  }),
-});

public/app/features/alerting/unified/mocks/server/handlers/grafanaRuler.ts

@@ -154,7 +154,6 @@ export const rulerRuleVersionHistoryHandler = () => {
         uid: 'service',
         name: '',
       };
-      draft.grafana_alert.message = 'Updated by provisioning service';
     }),
     produce(grafanaRulerRule, (draft: RulerGrafanaRuleDTO<GrafanaRuleDefinition>) => {
       draft.grafana_alert.version = 5;
@@ -172,7 +171,6 @@ export const rulerRuleVersionHistoryHandler = () => {
         uid: 'different',
         name: 'different user',
       };
-      draft.grafana_alert.message = 'Changed alert title and thresholds';
     }),
     produce(grafanaRulerRule, (draft: RulerGrafanaRuleDTO<GrafanaRuleDefinition>) => {
       draft.grafana_alert.version = 3;
@@ -195,7 +193,6 @@ export const rulerRuleVersionHistoryHandler = () => {
         uid: 'foo',
         name: '',
       };
-      draft.grafana_alert.message = 'Updated evaluation interval and routing';
     }),
     produce(grafanaRulerRule, (draft: RulerGrafanaRuleDTO<GrafanaRuleDefinition>) => {
       draft.grafana_alert.version = 1;

public/app/features/dashboard-scene/serialization/sceneVariablesSetToVariables.ts

@@ -284,7 +284,6 @@ function variableValueOptionsToVariableOptions(varState: MultiValueVariable['sta
     value: String(o.value),
     text: o.label,
     selected: Array.isArray(varState.value) ? varState.value.includes(o.value) : varState.value === o.value,
-    ...(o.properties && { properties: o.properties }),
   }));
 }
 

public/app/features/explore/Logs/LogsTable.tsx

@@ -33,7 +33,7 @@ import {
   useStyles2,
 } from '@grafana/ui';
 import { FILTER_FOR_OPERATOR, FILTER_OUT_OPERATOR } from '@grafana/ui/internal';
-import { DATAPLANE_ID_NAME, LogsFrame } from 'app/features/logs/logsFrame';
+import { LogsFrame } from 'app/features/logs/logsFrame';
 
 import { getFieldLinksForExplore } from '../utils/links';
 
@@ -154,9 +154,9 @@ export function LogsTable(props: Props) {
         },
       });
       // `getLinks` and `applyFieldOverrides` are taken from TableContainer.tsx
-      for (const [fieldIdx, field] of frameWithOverrides.fields.entries()) {
+      for (const [index, field] of frameWithOverrides.fields.entries()) {
         // Hide ID field from visualization (it's only needed for row matching)
-        if (logsFrame?.idField && (field.name === logsFrame.idField.name || field.name === DATAPLANE_ID_NAME)) {
+        if (logsFrame?.idField && (field.name === logsFrame.idField.name || field.name === 'id')) {
           field.config = {
             ...field.config,
             custom: {
@@ -180,7 +180,7 @@ export function LogsTable(props: Props) {
         };
 
         // For the first field (time), wrap the cell to include action buttons
-        const isFirstField = fieldIdx === 0;
+        const isFirstField = index === 0;
 
         field.config = {
           ...field.config,
@@ -202,6 +202,7 @@ export function LogsTable(props: Props) {
                         panelState={props.panelState}
                         absoluteRange={props.absoluteRange}
                         logRows={props.logRows}
+                        rowIndex={cellProps.rowIndex}
                       />
                       <span className={styles.firstColumnCell}>
                         {cellProps.field.display?.(cellProps.value).text ?? String(cellProps.value)}

public/app/features/explore/Logs/LogsTableActionButtons.tsx

@@ -1,5 +1,5 @@
 import { css } from '@emotion/css';
-import { useCallback, useState, memo } from 'react';
+import { useCallback, useState } from 'react';
 
 import {
   AbsoluteTimeRange,
@@ -13,7 +13,7 @@ import { t } from '@grafana/i18n';
 import { ClipboardButton, CustomCellRendererProps, IconButton, Modal, useTheme2 } from '@grafana/ui';
 import { getLogsPermalinkRange } from 'app/core/utils/shortLinks';
 import { getUrlStateFromPaneState } from 'app/features/explore/hooks/useStateSync';
-import { LogsFrame, DATAPLANE_ID_NAME } from 'app/features/logs/logsFrame';
+import { LogsFrame } from 'app/features/logs/logsFrame';
 import { getState } from 'app/store/store';
 
 import { getExploreBaseUrl } from './utils/url';
@@ -28,21 +28,26 @@ interface Props extends CustomCellRendererProps {
   index?: number;
 }
 
-export const LogsTableActionButtons = memo((props: Props) => {
+export function LogsTableActionButtons(props: Props) {
   const { exploreId, absoluteRange, logRows, rowIndex, panelState, displayedFields, logsFrame, frame } = props;
+
   const theme = useTheme2();
   const [isInspecting, setIsInspecting] = useState(false);
   // Get logId from the table frame (frame), not the original logsFrame, because
   // the table frame is sorted/transformed and rowIndex refers to the table frame
-  const idFieldName = logsFrame?.idField?.name ?? DATAPLANE_ID_NAME;
-  const idField = frame.fields.find((field) => field.name === idFieldName || field.name === DATAPLANE_ID_NAME);
+  const idFieldName = logsFrame?.idField?.name ?? 'id';
+  const idField = frame.fields.find((field) => field.name === idFieldName || field.name === 'id');
   const logId = idField?.values[rowIndex];
-
   const getLineValue = () => {
-    const logRowById = logRows?.find((row) => row.rowId === logId);
-    return logRowById?.raw ?? '';
+    const bodyFieldName = logsFrame?.bodyField?.name;
+    const bodyField = bodyFieldName
+      ? frame.fields.find((field) => field.name === bodyFieldName)
+      : frame.fields.find((field) => field.type === 'string');
+    return bodyField?.values[rowIndex];
   };
 
+  const lineValue = getLineValue();
+
   const styles = getStyles(theme);
 
   // Generate link to the log line
@@ -100,29 +105,33 @@ export const LogsTableActionButtons = memo((props: Props) => {
   return (
     <>
       <div className={styles.iconWrapper}>
-        <IconButton
-          className={styles.icon}
-          tooltip={t('explore.logs-table.action-buttons.view-log-line', 'View log line')}
-          variant="secondary"
-          aria-label={t('explore.logs-table.action-buttons.view-log-line', 'View log line')}
-          tooltipPlacement="top"
-          size="md"
-          name="eye"
-          onClick={handleViewClick}
-          tabIndex={0}
-        />
-        <ClipboardButton
-          className={styles.icon}
-          icon="share-alt"
-          variant="secondary"
-          fill="text"
-          size="md"
-          tooltip={t('explore.logs-table.action-buttons.copy-link', 'Copy link to log line')}
-          tooltipPlacement="top"
-          tabIndex={0}
-          aria-label={t('explore.logs-table.action-buttons.copy-link', 'Copy link to log line')}
-          getText={getText}
-        />
+        <div className={styles.inspect}>
+          <IconButton
+            className={styles.inspectButton}
+            tooltip={t('explore.logs-table.action-buttons.view-log-line', 'View log line')}
+            variant="secondary"
+            aria-label={t('explore.logs-table.action-buttons.view-log-line', 'View log line')}
+            tooltipPlacement="top"
+            size="md"
+            name="eye"
+            onClick={handleViewClick}
+            tabIndex={0}
+          />
+        </div>
+        <div className={styles.inspect}>
+          <ClipboardButton
+            className={styles.clipboardButton}
+            icon="share-alt"
+            variant="secondary"
+            fill="text"
+            size="md"
+            tooltip={t('explore.logs-table.action-buttons.copy-link', 'Copy link to log line')}
+            tooltipPlacement="top"
+            tabIndex={0}
+            aria-label={t('explore.logs-table.action-buttons.copy-link', 'Copy link to log line')}
+            getText={getText}
+          />
+        </div>
       </div>
       {isInspecting && (
         <Modal
@@ -130,9 +139,9 @@ export const LogsTableActionButtons = memo((props: Props) => {
           isOpen={true}
           title={t('explore.logs-table.action-buttons.inspect-value', 'Inspect value')}
         >
-          <pre>{getLineValue()}</pre>
+          <pre>{lineValue}</pre>
           <Modal.ButtonRow>
-            <ClipboardButton icon="copy" getText={() => getLineValue()}>
+            <ClipboardButton icon="copy" getText={() => lineValue}>
               {t('explore.logs-table.action-buttons.copy-to-clipboard', 'Copy to Clipboard')}
             </ClipboardButton>
           </Modal.ButtonRow>
@@ -140,11 +149,15 @@ export const LogsTableActionButtons = memo((props: Props) => {
       )}
     </>
   );
-});
+}
 
-LogsTableActionButtons.displayName = 'LogsTableActionButtons';
-
-const getStyles = (theme: GrafanaTheme2) => ({
+export const getStyles = (theme: GrafanaTheme2) => ({
+  clipboardButton: css({
+    height: '100%',
+    lineHeight: '1',
+    padding: 0,
+    width: '20px',
+  }),
   iconWrapper: css({
     background: theme.colors.background.secondary,
     boxShadow: theme.shadows.z2,
@@ -153,50 +166,25 @@ const getStyles = (theme: GrafanaTheme2) => ({
     height: '35px',
     left: 0,
     top: 0,
-    padding: 0,
+    padding: `0 ${theme.spacing(0.5)}`,
     position: 'absolute',
     zIndex: 1,
-    alignItems: 'center',
-    // Fix switching icon direction when cell is numeric (rtl)
-    direction: 'ltr',
   }),
-  icon: css({
-    gap: 0,
-    margin: 0,
-    padding: 0,
-    borderRadius: theme.shape.radius.default,
-    width: '28px',
-    height: '32px',
-    display: 'inline-flex',
-    justifyContent: 'center',
-
-    '&:before': {
-      content: '""',
-      position: 'absolute',
-      width: 24,
-      height: 24,
-      top: 0,
-      bottom: 0,
-      left: 0,
-      right: 0,
-      margin: 'auto',
-      borderRadius: theme.shape.radius.default,
-      backgroundColor: theme.colors.background.primary,
-      zIndex: -1,
-      opacity: 0,
-      [theme.transitions.handleMotion('no-preference', 'reduce')]: {
-        transitionDuration: '0.2s',
-        transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
-        transitionProperty: 'opacity',
-      },
+  inspect: css({
+    '& button svg': {
+      marginRight: 'auto',
     },
     '&:hover': {
       color: theme.colors.text.link,
       cursor: 'pointer',
-      background: 'none',
-      '&:before': {
-        opacity: 1,
-      },
     },
+    padding: '5px 3px',
+  }),
+  inspectButton: css({
+    borderRadius: theme.shape.radius.default,
+    display: 'inline-flex',
+    margin: 0,
+    overflow: 'hidden',
+    verticalAlign: 'middle',
   }),
 });

public/app/features/logs/logsFrame.ts

@@ -32,7 +32,7 @@ function getField(cache: FieldCache, name: string, fieldType: FieldType): FieldW
 const DATAPLANE_TIMESTAMP_NAME = 'timestamp';
 const DATAPLANE_BODY_NAME = 'body';
 const DATAPLANE_SEVERITY_NAME = 'severity';
-export const DATAPLANE_ID_NAME = 'id';
+const DATAPLANE_ID_NAME = 'id';
 const DATAPLANE_LABELS_NAME = 'labels';
 
 // NOTE: this is a hot fn, we need to avoid allocating new objects here

public/app/features/panel/panellinks/link_srv.ts

@@ -80,18 +80,18 @@ const buildLabelPath = (label: string) => {
   return label.includes('.') || label.trim().includes(' ') ? `["${label}"]` : `.${label}`;
 };
 
-const isRecord = (value: unknown): value is Record<string, unknown> => {
-  return typeof value === 'object' && value !== null && !Array.isArray(value);
-};
-
 const getVariableValueProperties = (variable: TypedVariableModel): string[] => {
-  function collectFieldPaths(option: Record<string, unknown>, currentPath: string): string[] {
+  if (!('valuesFormat' in variable) || variable.valuesFormat !== 'json') {
+    return [];
+  }
+
+  function collectFieldPaths(option: Record<string, string>, currentPath: string) {
     let paths: string[] = [];
     for (const field in option) {
       if (option.hasOwnProperty(field)) {
         const newPath = `${currentPath}.${field}`;
         const value = option[field];
-        if (isRecord(value)) {
+        if (typeof value === 'object' && value !== null) {
           paths = [...paths, ...collectFieldPaths(value, newPath)];
         }
         paths.push(newPath);
@@ -100,23 +100,11 @@ const getVariableValueProperties = (variable: TypedVariableModel): string[] => {
     return paths;
   }
 
-  if ('valuesFormat' in variable && variable.valuesFormat === 'json') {
-    try {
-      return collectFieldPaths(JSON.parse(variable.query)[0], variable.name);
-    } catch {
-      return [];
-    }
+  try {
+    return collectFieldPaths(JSON.parse(variable.query)[0], variable.name);
+  } catch {
+    return [];
   }
-
-  if ('options' in variable && Array.isArray(variable.options) && variable.options.length > 0) {
-    for (const opt of variable.options) {
-      if ('properties' in opt && isRecord(opt.properties) && Object.keys(opt.properties).length > 0) {
-        return collectFieldPaths(opt.properties, variable.name);
-      }
-    }
-  }
-
-  return [];
 };
 
 export const getPanelLinksVariableSuggestions = (): VariableSuggestion[] => [

public/app/plugins/datasource/grafana-postgresql-datasource/datasource.ts

@@ -11,7 +11,6 @@ import {
   SQLQuery,
   SQLSelectableValue,
   SqlDatasource,
-  SQLVariableSupport,
   formatSQL,
 } from '@grafana/sql';
 
@@ -26,7 +25,6 @@ export class PostgresDatasource extends SqlDatasource {
 
   constructor(instanceSettings: DataSourceInstanceSettings<PostgresOptions>) {
     super(instanceSettings);
-    this.variables = new SQLVariableSupport(this);
   }
 
   getQueryModel(target?: SQLQuery, templateSrv?: TemplateSrv, scopedVars?: ScopedVars): PostgresQueryModel {

public/app/plugins/datasource/tempo/datasource.test.ts

@@ -762,19 +762,6 @@ describe('Tempo service graph view', () => {
     ]);
   });
 
-  it('should escape span with multi line content correctly', () => {
-    const spanContent = [
-      `
-      SELECT * from "my_table"
-      WHERE "data_enabled" = 1
-      ORDER BY "name" ASC`,
-    ];
-    let escaped = getEscapedRegexValues(getEscapedValues(spanContent));
-    expect(escaped).toEqual([
-      '\\n      SELECT \\\\* from \\"my_table\\"\\n      WHERE \\"data_enabled\\" = 1\\n      ORDER BY \\"name\\" ASC',
-    ]);
-  });
-
   it('should get field config correctly', () => {
     let datasourceUid = 's4Jvz8Qnk';
     let tempoDatasourceUid = 'EbPO1fYnz';

public/app/plugins/datasource/tempo/datasource.ts

@@ -1168,7 +1168,7 @@ export function getEscapedRegexValues(values: string[]) {
 }
 
 export function getEscapedValues(values: string[]) {
-  return values.map((value: string) => value.replace(/["\\]/g, '\\$&').replace(/[\n]/g, '\\n'));
+  return values.map((value: string) => value.replace(/["\\]/g, '\\$&'));
 }
 
 export function getFieldConfig(

public/app/types/unified-alerting-dto.ts

@@ -293,7 +293,6 @@ export interface GrafanaRuleDefinition extends PostableGrafanaRuleDefinition {
   updated?: string;
   updated_by?: UpdatedBy | null;
   version?: number;
-  message?: string;
 }
 
 // types for Grafana-managed recording and alerting rules

public/locales/en-US/grafana.json

@@ -4416,7 +4416,6 @@
       },
       "no-properties-changed": "No relevant properties changed",
       "table": {
-        "notes": "Notes",
         "updated": "Date",
         "updatedBy": "Updated By",
         "version": "Version"