Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Explore and Correlations: Replace deprecated layout components #86967

Merged
merged 1 commit into from Apr 29, 2024
Merged

Explore and Correlations: Replace deprecated layout components #86967

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
9 changes: 0 additions & 9 deletions .betterer.results
View file
Open in desktop
Expand Up @@ -2384,9 +2384,6 @@ exports[`better eslint`] = {
[0, 0, 0, "Styles should be written using objects.", "0"],
[0, 0, 0, "Styles should be written using objects.", "1"]
],
"public/app/features/correlations/Forms/CorrelationFormNavigation.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/correlations/components/Wizard/index.ts:5381": [
[0, 0, 0, "Do not use export all (\`export * from ...\`)", "0"],
[0, 0, 0, "Do not use export all (\`export * from ...\`)", "1"]
Expand Down Expand Up @@ -3016,9 +3013,6 @@ exports[`better eslint`] = {
"public/app/features/explore/ContentOutline/ContentOutline.tsx:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]
],
"public/app/features/explore/CorrelationEditorModeBar.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/explore/Logs/LiveLogs.tsx:5381": [
[0, 0, 0, "Styles should be written using objects.", "0"],
[0, 0, 0, "Styles should be written using objects.", "1"],
Expand Down Expand Up @@ -3450,9 +3444,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/explore/extensions/ConfirmNavigationModal.tsx:5381": [
[0, 0, 0, "\'VerticalGroup\' import from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
],
"public/app/features/explore/hooks/useStateSync/index.ts:5381": [
[0, 0, 0, "Do not re-export imported variable (\`./external.utils\`)", "0"]
],
Expand Down
6 changes: 3 additions & 3 deletions public/app/features/correlations/Forms/CorrelationFormNavigation.tsx
View file
Open in desktop
@@ -1,6 +1,6 @@
import React from 'react';

import { Button, HorizontalGroup } from '@grafana/ui';
import { Button, Stack } from '@grafana/ui';
import { Trans, t } from 'app/core/internationalization';

import { useWizardContext } from '../components/Wizard/wizardContext';
Expand All @@ -26,14 +26,14 @@ export const CorrelationFormNavigation = () => {
);

return (
<HorizontalGroup justify="flex-start">
<Stack justifyContent="flex-start">
{currentPage > 0 ? (
<Button variant="secondary" onClick={prevPage}>
<Trans i18nKey="correlations.navigation-form.back-button">Back</Trans>
</Button>
) : undefined}

{isLastPage ? LastPageNext : NextPage}
</HorizontalGroup>
</Stack>
);
};
6 changes: 3 additions & 3 deletions public/app/features/explore/CorrelationEditorModeBar.tsx
View file
Open in desktop
Expand Up @@ -5,7 +5,7 @@ import { useBeforeUnload, useUnmount } from 'react-use';

import { GrafanaTheme2, colorManipulator } from '@grafana/data';
import { reportInteraction } from '@grafana/runtime';
import { Button, HorizontalGroup, Icon, Tooltip, useStyles2 } from '@grafana/ui';
import { Button, Icon, Stack, Tooltip, useStyles2 } from '@grafana/ui';
import { CORRELATION_EDITOR_POST_CONFIRM_ACTION, ExploreItemState, useDispatch, useSelector } from 'app/types';

import { CorrelationUnsavedChangesModal } from './CorrelationUnsavedChangesModal';
Expand Down Expand Up @@ -229,7 +229,7 @@ export const CorrelationEditorModeBar = ({ panes }: { panes: Array<[string, Expl
/>
)}
<div className={styles.correlationEditorTop}>
<HorizontalGroup spacing="md" justify="flex-end">
<Stack gap={2} justifyContent="flex-end" alignItems="center">
<Tooltip content="Correlations editor in Explore is an experimental feature.">
<Icon className={styles.iconColor} name="info-circle" size="xl" />
</Tooltip>
Expand All @@ -256,7 +256,7 @@ export const CorrelationEditorModeBar = ({ panes }: { panes: Array<[string, Expl
>
Exit correlation editor
</Button>
</HorizontalGroup>
</Stack>
</div>
</>
);
Expand Down
6 changes: 3 additions & 3 deletions public/app/features/explore/extensions/ConfirmNavigationModal.tsx
View file
Open in desktop
Expand Up @@ -2,7 +2,7 @@ import React, { ReactElement } from 'react';

import { locationUtil } from '@grafana/data';
import { locationService } from '@grafana/runtime';
import { Button, Modal, VerticalGroup } from '@grafana/ui';
import { Button, Modal, Stack } from '@grafana/ui';

type Props = {
onDismiss: () => void;
Expand All @@ -20,9 +20,9 @@ export function ConfirmNavigationModal(props: Props): ReactElement {

return (
<Modal title={title} isOpen onDismiss={onDismiss}>
<VerticalGroup spacing="sm">
<Stack direction="column" gap={1}>
<p>Do you want to proceed in the current tab or open a new tab?</p>
</VerticalGroup>
</Stack>
<Modal.ButtonRow>
<Button onClick={onDismiss} fill="outline" variant="secondary">
Cancel
Expand Down