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

Chore: Move Deprecated layout components rule from Betterer to ESlint (#110279)

Browse Source
This commit is contained in:
Laura Fernández
2025-08-29 12:33:14 +02:00
committed by GitHub
parent 97f1ed0b88
commit 65d5265f86
11 changed files with 23 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.betterer.eslint.config.js
-5
View File
@@ -85,11 +85,6 @@ module.exports = [
'error',
{
patterns: [
{
group: ['@grafana/ui*', '*/Layout/*'],
importNames: ['Layout', 'HorizontalGroup', 'VerticalGroup'],
message: 'Use Stack component instead.',
},
{
group: ['@grafana/ui/src/*', '@grafana/runtime/src/*', '@grafana/data/src/*'],
message: 'Import from the public export instead.',
.betterer.results
+2 -25
View File
@@ -2151,22 +2151,14 @@ exports[`better eslint`] = {
[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"]
],
"public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ConfigPublicDashboard/ConfigPublicDashboard.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"]
],
"public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ConfigPublicDashboard/Configuration.tsx:5381": [
[0, 0, 0, "\'VerticalGroup\' 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.", "2"]
],
"public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ConfigPublicDashboard/EmailSharingConfiguration.tsx:5381": [
[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"]
],
"public/app/features/dashboard/components/ShareModal/SharePublicDashboard/CreatePublicDashboard/AcknowledgeCheckboxes.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, "\'VerticalGroup\' import from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "1"]
],
"public/app/features/dashboard/components/ShareModal/ShareSnapshot.tsx:5381": [
[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"],
@@ -2709,9 +2701,6 @@ exports[`better eslint`] = {
"public/app/features/plugins/extensions/usePluginFunctions.tsx:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]
],
"public/app/features/plugins/loader/sharedDependencies.ts:5381": [
[0, 0, 0, "* import is invalid because \'Layout,HorizontalGroup,VerticalGroup\' from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
],
"public/app/features/plugins/sandbox/distortions.ts:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]
],
@@ -3153,9 +3142,6 @@ exports[`better eslint`] = {
"public/app/plugins/datasource/azuremonitor/components/LogsQueryEditor/index.tsx:5381": [
[0, 0, 0, "Do not re-export imported variable (\`./LogsQueryEditor\`)", "0"]
],
"public/app/plugins/datasource/azuremonitor/components/QueryEditor/QueryEditor.test.tsx:5381": [
[0, 0, 0, "* import is invalid because \'Layout,HorizontalGroup,VerticalGroup\' from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
],
"public/app/plugins/datasource/azuremonitor/components/QueryEditor/QueryEditor.tsx:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]
],
@@ -3174,9 +3160,6 @@ exports[`better eslint`] = {
"public/app/plugins/datasource/azuremonitor/components/TracesQueryEditor/index.tsx:5381": [
[0, 0, 0, "Do not re-export imported variable (\`./TracesQueryEditor\`)", "0"]
],
"public/app/plugins/datasource/azuremonitor/components/VariableEditor/VariableEditor.test.tsx:5381": [
[0, 0, 0, "* import is invalid because \'Layout,HorizontalGroup,VerticalGroup\' from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
],
"public/app/plugins/datasource/azuremonitor/components/VariableEditor/VariableEditor.tsx:5381": [
[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"],
@@ -3247,9 +3230,6 @@ exports[`better eslint`] = {
"public/app/plugins/datasource/cloudwatch/components/ConfigEditor/XrayLinkConfig.tsx:5381": [
[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"]
],
"public/app/plugins/datasource/cloudwatch/components/QueryEditor/MetricsQueryEditor/MetricsQueryEditor.test.tsx:5381": [
[0, 0, 0, "* import is invalid because \'Layout,HorizontalGroup,VerticalGroup\' from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
],
"public/app/plugins/datasource/cloudwatch/components/QueryEditor/MetricsQueryEditor/SQLBuilderEditor/index.tsx:5381": [
[0, 0, 0, "Do not re-export imported variable (\`./SQLBuilderEditor\`)", "0"]
],
@@ -3920,9 +3900,6 @@ exports[`better eslint`] = {
"public/app/plugins/panel/live/LivePanel.tsx:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]
],
"public/app/plugins/panel/logs/LogsPanel.test.tsx:5381": [
[0, 0, 0, "* import is invalid because \'Layout,HorizontalGroup,VerticalGroup\' from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
],
"public/app/plugins/panel/logs/types.ts:5381": [
[0, 0, 0, "Do not re-export imported variable (\`./panelcfg.gen\`)", "0"]
],
eslint.config.js
+5
View File
@@ -39,6 +39,11 @@ const baseImportConfig = {
importNames: ['Trans'],
message: 'Please import from @grafana/i18n instead',
},
{
group: ['@grafana/ui*', '*/Layout/*'],
importNames: ['Layout', 'HorizontalGroup', 'VerticalGroup'],
message: 'Use Stack component instead.',
},
{
regex: '\\.test$',
message:
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ConfigPublicDashboard/ConfigPublicDashboard.tsx
+3 -14
View File
@@ -4,18 +4,7 @@ import { useForm } from 'react-hook-form';
import { GrafanaTheme2, TimeRange } from '@grafana/data';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
import { Trans, t } from '@grafana/i18n';
import {
Button,
ClipboardButton,
Field,
HorizontalGroup,
Input,
Stack,
Label,
ModalsController,
Switch,
useStyles2,
} from '@grafana/ui';
import { Button, ClipboardButton, Field, Input, Stack, Label, ModalsController, Switch, useStyles2 } from '@grafana/ui';
import {
useDeletePublicDashboardMutation,
usePauseOrResumePublicDashboardMutation,
@@ -213,7 +202,7 @@ export function ConfigPublicDashboardBase({
justifyContent={isDesktop ? 'flex-end' : 'flex-start'}
alignItems={isDesktop ? 'center' : 'stretch'}
>
<HorizontalGroup justify="flex-end">
<Stack justifyContent="flex-end">
<Button
title={t('public-dashboard.config.revoke-public-URL-button-title', 'Revoke public URL')}
onClick={onRevoke}
@@ -225,7 +214,7 @@ export function ConfigPublicDashboardBase({
>
<Trans i18nKey="public-dashboard.config.revoke-public-URL-button">Revoke public URL</Trans>
</Button>
</HorizontalGroup>
</Stack>
</Stack>
</div>
);
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ConfigPublicDashboard/Configuration.tsx
+3 -3
View File
@@ -3,7 +3,7 @@ import { UseFormRegister } from 'react-hook-form';
import { TimeRange } from '@grafana/data';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
import { Trans, t } from '@grafana/i18n';
import { FieldSet, Label, Switch, TimeRangeInput, Stack, VerticalGroup } from '@grafana/ui';
import { FieldSet, Label, Switch, TimeRangeInput, Stack } from '@grafana/ui';
import { DashboardInteractions } from 'app/features/dashboard-scene/utils/interactions';
import { ConfigPublicDashboardForm } from './ConfigPublicDashboard';
@@ -24,7 +24,7 @@ export const Configuration = ({
return (
<>
<FieldSet disabled={disabled}>
<VerticalGroup spacing="md">
<Stack direction="column" gap={1}>
<Stack direction="column" gap={0.5} justifyContent="space-between">
<Label
description={t(
@@ -80,7 +80,7 @@ export const Configuration = ({
<Trans i18nKey="public-dashboard.settings-configuration.show-annotations-label">Show annotations</Trans>
</Label>
</Stack>
</VerticalGroup>
</Stack>
</FieldSet>
</>
);
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/CreatePublicDashboard/AcknowledgeCheckboxes.tsx
+5 -5
View File
@@ -4,7 +4,7 @@ import { UseFormRegister } from 'react-hook-form';
import { GrafanaTheme2 } from '@grafana/data';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
import { Trans, t } from '@grafana/i18n';
import { Checkbox, FieldSet, HorizontalGroup, LinkButton, useStyles2, VerticalGroup } from '@grafana/ui';
import { Checkbox, FieldSet, LinkButton, useStyles2, Stack } from '@grafana/ui';
import { SharePublicDashboardAcknowledgmentInputs } from './CreatePublicDashboard';
@@ -84,9 +84,9 @@ export const AcknowledgeCheckboxes = ({
</Trans>
</p>
<FieldSet disabled={disabled}>
<VerticalGroup spacing="md">
<Stack direction="column" gap={2}>
{ACKNOWLEDGES.map((acknowledge) => (
<HorizontalGroup key={acknowledge.type} spacing="none" align="center">
<Stack key={acknowledge.type} gap={0} alignItems="center">
<Checkbox
{...register(acknowledge.type, { required: true })}
label={acknowledge.description}
@@ -101,9 +101,9 @@ export const AcknowledgeCheckboxes = ({
rel="noopener noreferrer"
tooltip={acknowledge.info.tooltip}
/>
</HorizontalGroup>
</Stack>
))}
</VerticalGroup>
</Stack>
</FieldSet>
</>
);
public/app/features/plugins/loader/sharedDependencies.ts
+1
View File
@@ -11,6 +11,7 @@ import 'vendor/flot/jquery.flot.gauge';
import * as grafanaData from '@grafana/data';
import * as grafanaRuntime from '@grafana/runtime';
// eslint-disable-next-line no-restricted-imports
import * as grafanaUIraw from '@grafana/ui';
import TableModel from 'app/core/TableModel';
import config from 'app/core/config';
public/app/plugins/datasource/azuremonitor/components/QueryEditor/QueryEditor.test.tsx
+1
View File
@@ -2,6 +2,7 @@ import { render, screen, waitFor, cleanup } from '@testing-library/react';
import { CoreApp } from '@grafana/data';
import { config } from '@grafana/runtime';
// eslint-disable-next-line no-restricted-imports
import * as ui from '@grafana/ui';
import { selectors } from '../../e2e/selectors';
public/app/plugins/datasource/azuremonitor/components/VariableEditor/VariableEditor.test.tsx
+1
View File
@@ -3,6 +3,7 @@ import userEvent from '@testing-library/user-event';
import * as React from 'react';
import { select, openMenu } from 'react-select-event';
// eslint-disable-next-line no-restricted-imports
import * as ui from '@grafana/ui';
import createMockDatasource from '../../mocks/datasource';
public/app/plugins/datasource/cloudwatch/components/QueryEditor/MetricsQueryEditor/MetricsQueryEditor.test.tsx
+1
View File
@@ -2,6 +2,7 @@ import { render, screen, waitFor } from '@testing-library/react';
import selectEvent from 'react-select-event';
import { CustomVariableModel, DataSourceInstanceSettings } from '@grafana/data';
// eslint-disable-next-line no-restricted-imports
import * as ui from '@grafana/ui';
import { CloudWatchDatasource } from '../../../datasource';
public/app/plugins/panel/logs/LogsPanel.test.tsx
+1
View File
@@ -16,6 +16,7 @@ import {
LogSortOrderChangeEvent,
} from '@grafana/data';
import { getAppEvents } from '@grafana/runtime';
// eslint-disable-next-line no-restricted-imports
import * as grafanaUI from '@grafana/ui';
import * as styles from 'app/features/logs/components/getLogRowStyles';
import { LogRowContextModal } from 'app/features/logs/components/log-context/LogRowContextModal';