grafana/public/app/features/explore/NoData.tsx
Josh Hunt 3c6e0e8ef8
Chore: ESlint import order (#44959)
* Add and configure eslint-plugin-import

* Fix the lint:ts npm command

* Autofix + prettier all the files

* Manually fix remaining files

* Move jquery code in jest-setup to external file to safely reorder imports

* Resolve issue caused by circular dependencies within Prometheus

* Update .betterer.results

* Fix missing // @ts-ignore

* ignore iconBundle.ts

* Fix missing // @ts-ignore
2022-04-22 14:33:13 +01:00

36 lines
929 B
TypeScript

import { css, cx } from '@emotion/css';
import React from 'react';
import { GrafanaTheme2 } from '@grafana/data/src';
import { useStyles2 } from '@grafana/ui';
export const NoData = () => {
const css = useStyles2(getStyles);
return (
<>
<div data-testid="explore-no-data" className={cx([css.wrapper, 'panel-container'])}>
<span className={cx([css.message])}>{'No data'}</span>
</div>
</>
);
};
const getStyles = (theme: GrafanaTheme2) => ({
wrapper: css`
label: no-data-card;
padding: ${theme.spacing(3)};
background: ${theme.colors.background.primary};
border-radius: ${theme.shape.borderRadius(2)};
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex-grow: 1;
`,
message: css`
font-size: ${theme.typography.h2.fontSize};
padding: ${theme.spacing(4)};
color: ${theme.colors.text.disabled};
`,
});