DashboardFailed.tsx 919 B

12345678910111213141516171819202122232425262728293031323334353637
  1. import { css } from '@emotion/css';
  2. import React from 'react';
  3. import { GrafanaTheme } from '@grafana/data';
  4. import { Alert, useStyles } from '@grafana/ui';
  5. import { getMessageFromError } from 'app/core/utils/errors';
  6. import { DashboardInitError, AppNotificationSeverity } from 'app/types';
  7. export interface Props {
  8. initError?: DashboardInitError;
  9. }
  10. export const DashboardFailed = ({ initError }: Props) => {
  11. const styles = useStyles(getStyles);
  12. if (!initError) {
  13. return null;
  14. }
  15. return (
  16. <div className={styles.dashboardLoading}>
  17. <Alert severity={AppNotificationSeverity.Error} title={initError.message}>
  18. {getMessageFromError(initError.error)}
  19. </Alert>
  20. </div>
  21. );
  22. };
  23. export const getStyles = (theme: GrafanaTheme) => {
  24. return {
  25. dashboardLoading: css`
  26. height: 60vh;
  27. display: flex;
  28. align-items: center;
  29. justify-content: center;
  30. `,
  31. };
  32. };