Chore: Remove HorizontalGroup and VerticalGroup from storage (#86888)

This commit is contained in:
Todd Treece 2024-04-25 08:58:25 -04:00 committed by GitHub
parent a68df4be88
commit 32215adb37
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 14 additions and 29 deletions

View File

@ -4227,19 +4227,16 @@ exports[`better eslint`] = {
[0, 0, 0, "Styles should be written using objects.", "4"]
],
"public/app/features/storage/RootView.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"],
[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.", "0"],
[0, 0, 0, "Styles should be written using objects.", "1"]
],
"public/app/features/storage/StoragePage.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.", "4"],
[0, 0, 0, "Styles should be written using objects.", "5"],
[0, 0, 0, "Styles should be written using objects.", "6"]
[0, 0, 0, "Styles should be written using objects.", "5"]
],
"public/app/features/storage/UploadButton.tsx:5381": [
[0, 0, 0, "Styles should be written using objects.", "0"]

View File

@ -3,19 +3,7 @@ import React, { useMemo, useState } from 'react';
import { useAsync } from 'react-use';
import { DataFrame, GrafanaTheme2 } from '@grafana/data';
import {
Alert,
Button,
Card,
FilterInput,
HorizontalGroup,
Icon,
IconName,
TagList,
useStyles2,
VerticalGroup,
InlineField,
} from '@grafana/ui';
import { Alert, Button, Card, FilterInput, Icon, IconName, TagList, useStyles2, Stack, InlineField } from '@grafana/ui';
import { getGrafanaStorage } from './storage';
import { StorageInfo, StorageView } from './types';
@ -62,7 +50,7 @@ export function RootView({ root, onPathChange }: Props) {
const renderRoots = (pfix: string, roots: StorageInfo[]) => {
return (
<VerticalGroup>
<Stack direction="column">
{roots.map((s) => {
const ok = s.ready;
return (
@ -75,9 +63,9 @@ export function RootView({ root, onPathChange }: Props) {
{s.notice?.map((notice) => <Alert key={notice.text} severity={notice.severity} title={notice.text} />)}
<Card.Tags className={styles.clickable}>
<HorizontalGroup>
<Stack>
<TagList tags={getTags(s)} />
</HorizontalGroup>
</Stack>
</Card.Tags>
<Card.Figure className={styles.clickable}>
<Icon name={getIconName(s.config.type)} size="xxxl" className={styles.secondaryTextColor} />
@ -85,7 +73,7 @@ export function RootView({ root, onPathChange }: Props) {
</Card>
);
})}
</VerticalGroup>
</Stack>
);
};

View File

@ -4,7 +4,7 @@ import { useAsync } from 'react-use';
import { DataFrame, GrafanaTheme2, isDataFrame, ValueLinkConfig } from '@grafana/data';
import { locationService } from '@grafana/runtime';
import { useStyles2, Spinner, TabsBar, Tab, Button, HorizontalGroup, Alert, toIconName } from '@grafana/ui';
import { useStyles2, Spinner, TabsBar, Tab, Button, Stack, Box, Alert, toIconName } from '@grafana/ui';
import appEvents from 'app/core/app_events';
import { Page } from 'app/core/components/Page/Page';
import { useNavModel } from 'app/core/hooks/useNavModel';
@ -163,9 +163,9 @@ export default function StoragePage(props: Props) {
return (
<div className={styles.wrapper}>
<HorizontalGroup width="100%" justify="space-between" spacing={'md'} height={25}>
<Box display="flex" justifyContent="space-between" width="100%" height={3}>
<Breadcrumb pathName={path} onPathChange={setPath} rootIcon={toIconName(navModel.node.icon ?? '')} />
<HorizontalGroup>
<Stack>
{canAddFolder && (
<>
<UploadButton path={path} setErrorMessages={setErrorMessages} fileNames={fileNames} setPath={setPath} />
@ -200,8 +200,8 @@ export default function StoragePage(props: Props) {
Delete
</Button>
)}
</HorizontalGroup>
</HorizontalGroup>
</Stack>
</Box>
{errorMessages.length > 0 && getErrorMessages()}