public/grafana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Chore: Remove deprecated HorizontalGroup in Dashboards area (#109790)

Browse Source
This commit is contained in:
Laura Fernández
2025-08-19 13:52:57 +02:00
committed by GitHub
parent f5b9d93610
commit ee6a61490a
6 changed files with 19 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.betterer.results
+4 -15
View File
@@ -1881,14 +1881,13 @@ exports[`better eslint`] = {
[0, 0, 0, "Do not re-export imported variable (\`./AddLibraryPanelWidget\`)", "0"]
],
"public/app/features/dashboard/components/AnnotationSettings/AnnotationSettingsEdit.tsx:5381": [
[0, 0, 0, "\'HorizontalGroup\' import from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"],
[0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "0"],
[0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "1"],
[0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "2"],
[0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "3"],
[0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "4"],
[0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "5"],
[0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "6"],
[0, 0, 0, "Using localeCompare() can cause performance issues when sorting large datasets. Consider using Intl.Collator for better performance when sorting arrays, or add an eslint-disable comment if sorting a small, known dataset.", "7"]
[0, 0, 0, "Using localeCompare() can cause performance issues when sorting large datasets. Consider using Intl.Collator for better performance when sorting arrays, or add an eslint-disable comment if sorting a small, known dataset.", "6"]
],
"public/app/features/dashboard/components/DashExportModal/DashboardExporter.test.ts:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"],
@@ -1981,9 +1980,6 @@ exports[`better eslint`] = {
[0, 0, 0, "Unexpected any. Specify a different type.", "1"],
[0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "2"]
],
"public/app/features/dashboard/components/PanelEditor/OverrideCategoryTitle.tsx:5381": [
[0, 0, 0, "\'HorizontalGroup\' import from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
],
"public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx:5381": [
[0, 0, 0, "\'HorizontalGroup\' import from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"]
@@ -2022,9 +2018,6 @@ exports[`better eslint`] = {
[0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "1"],
[0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "2"]
],
"public/app/features/dashboard/components/SaveDashboard/forms/SaveProvisionedDashboardForm.tsx:5381": [
[0, 0, 0, "\'HorizontalGroup\' import from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
],
"public/app/features/dashboard/components/SaveDashboard/useDashboardSave.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"]
],
@@ -2655,9 +2648,8 @@ exports[`better eslint`] = {
[0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "0"]
],
"public/app/features/query/components/QueryGroup.tsx:5381": [
[0, 0, 0, "\'HorizontalGroup\' import from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"],
[0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "1"],
[0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "2"]
[0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "0"],
[0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "1"]
],
"public/app/features/query/state/DashboardQueryRunner/AnnotationsQueryRunner.ts:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]
@@ -2882,9 +2874,6 @@ exports[`better eslint`] = {
[0, 0, 0, "Do not use any type assertions.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"]
],
"public/app/features/variables/editor/VariableEditorEditor.tsx:5381": [
[0, 0, 0, "\'HorizontalGroup\' import from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
],
"public/app/features/variables/editor/VariableEditorList.tsx:5381": [
[0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "0"],
[0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "1"]
public/app/features/dashboard/components/AnnotationSettings/AnnotationSettingsEdit.tsx
+3 -15
View File
@@ -14,19 +14,7 @@ import { selectors } from '@grafana/e2e-selectors';
import { Trans, t } from '@grafana/i18n';
import { getDataSourceSrv, locationService } from '@grafana/runtime';
import { AnnotationPanelFilter } from '@grafana/schema/src/raw/dashboard/x/dashboard_types.gen';
import {
Button,
Checkbox,
Field,
FieldSet,
HorizontalGroup,
Input,
MultiSelect,
Select,
useStyles2,
Stack,
Alert,
} from '@grafana/ui';
import { Button, Checkbox, Field, FieldSet, Input, MultiSelect, Select, useStyles2, Stack, Alert } from '@grafana/ui';
import { ColorValueEditor } from 'app/core/components/OptionsUI/color';
import config from 'app/core/config';
import StandardAnnotationQueryEditor from 'app/features/annotations/components/StandardAnnotationQueryEditor';
@@ -231,9 +219,9 @@ export const AnnotationSettingsEdit = ({ editIdx, dashboard }: Props) => {
'Color to use for the annotation event markers'
)}
>
<HorizontalGroup>
<Stack>
<ColorValueEditor value={annotation?.iconColor} onChange={onColorChange} />
</HorizontalGroup>
</Stack>
</Field>
<Field
label={t('dashboard.annotation-settings-edit.label-show-in', 'Show in')}
public/app/features/dashboard/components/PanelEditor/OverrideCategoryTitle.tsx
+3 -3
View File
@@ -2,7 +2,7 @@ import { css } from '@emotion/css';
import { FieldConfigOptionsRegistry, GrafanaTheme2, ConfigOverrideRule } from '@grafana/data';
import { t } from '@grafana/i18n';
import { Button, HorizontalGroup, Icon, useStyles2 } from '@grafana/ui';
import { Button, Stack, Icon, useStyles2 } from '@grafana/ui';
import { FieldMatcherUIRegistryItem } from '@grafana/ui/internal';
interface Props {
@@ -29,7 +29,7 @@ export const OverrideCategoryTitle = ({
return (
<div>
<HorizontalGroup justify="space-between">
<Stack justifyContent="space-between">
<div>{overrideName}</div>
<Button
variant="secondary"
@@ -39,7 +39,7 @@ export const OverrideCategoryTitle = ({
tooltip={t('dashboard.override-category-title.tooltip-remove-override', 'Remove override')}
aria-label={t('dashboard.override-category-title.aria-label-remove-override', 'Remove override')}
/>
</HorizontalGroup>
</Stack>
{!isExpanded && (
<div className={styles.overrideDetails}>
<div className={styles.options} title={matcherOptions}>
public/app/features/dashboard/components/SaveDashboard/forms/SaveProvisionedDashboardForm.tsx
+3 -3
View File
@@ -3,7 +3,7 @@ import { saveAs } from 'file-saver';
import { useCallback, useState } from 'react';
import { Trans } from '@grafana/i18n';
import { Button, ClipboardButton, HorizontalGroup, TextArea, Stack, TextLink } from '@grafana/ui';
import { Button, ClipboardButton, TextArea, Stack, TextLink } from '@grafana/ui';
import { SaveDashboardFormProps } from '../types';
@@ -55,7 +55,7 @@ export const SaveProvisionedDashboardForm = ({ dashboard, onCancel }: Omit<SaveD
}}
className={styles.json}
/>
<HorizontalGroup>
<Stack>
<Button variant="secondary" onClick={onCancel} fill="outline">
<Trans i18nKey="dashboard.save-provisioned-dashboard-form.cancel">Cancel</Trans>
</Button>
@@ -67,7 +67,7 @@ export const SaveProvisionedDashboardForm = ({ dashboard, onCancel }: Omit<SaveD
<Button type="submit" onClick={saveToFile}>
<Trans i18nKey="dashboard.save-provisioned-dashboard-form.save-json-to-file">Save JSON to file</Trans>
</Button>
</HorizontalGroup>
</Stack>
</Stack>
</>
);
public/app/features/query/components/QueryGroup.tsx
+3 -3
View File
@@ -16,7 +16,7 @@ import { selectors } from '@grafana/e2e-selectors';
import { Trans, t } from '@grafana/i18n';
import { getDataSourceSrv, locationService } from '@grafana/runtime';
import { DataQuery } from '@grafana/schema';
import { Button, HorizontalGroup, InlineFormLabel, Modal, ScrollContainer, stylesFactory } from '@grafana/ui';
import { Button, InlineFormLabel, Modal, ScrollContainer, Stack, stylesFactory } from '@grafana/ui';
import { PluginHelp } from 'app/core/components/PluginHelp/PluginHelp';
import config from 'app/core/config';
import { backendSrv } from 'app/core/services/backend_srv';
@@ -293,7 +293,7 @@ export class QueryGroup extends PureComponent<Props, State> {
const showAddButton = !isSharedDashboardQuery(dsSettings.name);
return (
<HorizontalGroup spacing="md" align="flex-start">
<Stack gap={2} alignItems="flex-start">
{showAddButton && (
<Button
icon="plus"
@@ -318,7 +318,7 @@ export class QueryGroup extends PureComponent<Props, State> {
</Button>
)}
{this.renderExtraActions()}
</HorizontalGroup>
</Stack>
);
}
public/app/features/variables/editor/VariableEditorEditor.tsx
+3 -3
View File
@@ -7,7 +7,7 @@ import { GrafanaTheme2, LoadingState, SelectableValue, VariableHide, VariableTyp
import { selectors } from '@grafana/e2e-selectors';
import { Trans, t } from '@grafana/i18n';
import { locationService } from '@grafana/runtime';
import { Button, HorizontalGroup, Icon, Themeable2, withTheme2 } from '@grafana/ui';
import { Button, Stack, Icon, Themeable2, withTheme2 } from '@grafana/ui';
import { StoreState, ThunkDispatch } from 'app/types/store';
import { VariableHideSelect } from '../../dashboard-scene/settings/variables/components/VariableHideSelect';
@@ -219,7 +219,7 @@ export class VariableEditorEditorUnConnected extends PureComponent<Props, State>
{hasOptions(this.props.variable) ? <VariableValuesPreview options={this.getVariableOptions()} /> : null}
<div style={{ marginTop: '16px' }}>
<HorizontalGroup spacing="md" height="inherit">
<Stack gap={2} height="inherit">
<Button variant="destructive" fill="outline" onClick={this.onModalOpen}>
<Trans i18nKey="variables.variable-editor-editor-un-connected.delete">Delete</Trans>
</Button>
@@ -246,7 +246,7 @@ export class VariableEditorEditorUnConnected extends PureComponent<Props, State>
>
<Trans i18nKey="variables.variable-editor-editor-un-connected.apply">Apply</Trans>
</Button>
</HorizontalGroup>
</Stack>
</div>
</form>
<ConfirmDeleteModal