Loki: update HorizontalGroup deprecation (#86995)

* Loki: update HorizontalGroup deprecation

* Update betterer
This commit is contained in:
Matias Chomicki 2024-04-29 14:14:06 +02:00 committed by GitHub
parent c151a97110
commit f1e8d2645f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 10 additions and 12 deletions

View File

@ -5262,7 +5262,7 @@ exports[`better eslint`] = {
[0, 0, 0, "Styles should be written using objects.", "10"]
],
"public/app/plugins/datasource/loki/components/LokiLabelBrowser.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, "Styles should be written using objects.", "0"],
[0, 0, 0, "Styles should be written using objects.", "1"],
[0, 0, 0, "Styles should be written using objects.", "2"],
[0, 0, 0, "Styles should be written using objects.", "3"],
@ -5275,8 +5275,7 @@ exports[`better eslint`] = {
[0, 0, 0, "Styles should be written using objects.", "10"],
[0, 0, 0, "Styles should be written using objects.", "11"],
[0, 0, 0, "Styles should be written using objects.", "12"],
[0, 0, 0, "Styles should be written using objects.", "13"],
[0, 0, 0, "Styles should be written using objects.", "14"]
[0, 0, 0, "Styles should be written using objects.", "13"]
],
"public/app/plugins/datasource/loki/components/monaco-query-field/MonacoQueryField.tsx:5381": [
[0, 0, 0, "Styles should be written using objects.", "0"],
@ -5313,10 +5312,9 @@ exports[`better eslint`] = {
[0, 0, 0, "Do not use any type assertions.", "0"]
],
"public/app/plugins/datasource/loki/querybuilder/components/LokiQueryCodeEditor.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, "Styles should be written using objects.", "0"],
[0, 0, 0, "Styles should be written using objects.", "1"],
[0, 0, 0, "Styles should be written using objects.", "2"],
[0, 0, 0, "Styles should be written using objects.", "3"]
[0, 0, 0, "Styles should be written using objects.", "2"]
],
"public/app/plugins/datasource/loki/querybuilder/components/QueryPattern.tsx:5381": [
[0, 0, 0, "Styles should be written using objects.", "0"],

View File

@ -8,13 +8,13 @@ import { reportInteraction } from '@grafana/runtime';
import {
Button,
HighlightPart,
HorizontalGroup,
Input,
Label,
LoadingPlaceholder,
withTheme2,
BrowserLabel as LokiLabel,
fuzzyMatch,
Stack,
} from '@grafana/ui';
import LokiLanguageProvider from '../LanguageProvider';
@ -533,7 +533,7 @@ export class UnthemedLokiLabelBrowser extends React.Component<BrowserProps, Brow
<div className={cx(styles.status, (status || error) && styles.statusShowing)}>
<span className={error ? styles.error : ''}>{error || status}</span>
</div>
<HorizontalGroup>
<Stack gap={1}>
<Button aria-label="Use selector as logs button" disabled={empty} onClick={this.onClickRunLogsQuery}>
Show logs
</Button>
@ -556,7 +556,7 @@ export class UnthemedLokiLabelBrowser extends React.Component<BrowserProps, Brow
<Button aria-label="Selector clear button" variant="secondary" onClick={this.onClickClear}>
Clear
</Button>
</HorizontalGroup>
</Stack>
</div>
</>
);

View File

@ -3,7 +3,7 @@ import React from 'react';
import { GrafanaTheme2 } from '@grafana/data';
import { config } from '@grafana/runtime';
import { useStyles2, HorizontalGroup, IconButton, Tooltip, Icon } from '@grafana/ui';
import { useStyles2, IconButton, Tooltip, Icon, Stack } from '@grafana/ui';
import { testIds } from '../../components/LokiQueryEditor';
import { LokiQueryField } from '../../components/LokiQueryField';
@ -49,7 +49,7 @@ export function LokiQueryCodeEditor({
{lokiFormatQuery && (
<div className={styles.buttonGroup}>
<div>
<HorizontalGroup spacing="sm">
<Stack gap={1}>
<IconButton
onClick={onClickFormatQueryButton}
name="brackets-curly"
@ -59,7 +59,7 @@ export function LokiQueryCodeEditor({
<Tooltip content={`Use ctrl/cmd + z to undo`}>
<Icon className={styles.hint} name="keyboard" />
</Tooltip>
</HorizontalGroup>
</Stack>
</div>
</div>
)}