diff --git a/x-pack/plugins/observability/public/components/shared/exploratory_view/series_editor/report_metric_options.tsx b/x-pack/plugins/observability/public/components/shared/exploratory_view/series_editor/report_metric_options.tsx
index 496e7a10f9c4..eca18f0eb0dd 100644
--- a/x-pack/plugins/observability/public/components/shared/exploratory_view/series_editor/report_metric_options.tsx
+++ b/x-pack/plugins/observability/public/components/shared/exploratory_view/series_editor/report_metric_options.tsx
@@ -13,6 +13,8 @@ import {
EuiListGroup,
EuiListGroupItem,
EuiBadge,
+ EuiText,
+ EuiLoadingSpinner,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n/react';
@@ -33,7 +35,7 @@ export function ReportMetricOptions({ seriesId, series, seriesConfig }: Props) {
const [showOptions, setShowOptions] = useState(false);
const metricOptions = seriesConfig?.metricOptions;
- const { indexPatterns } = useAppIndexPatternContext();
+ const { indexPatterns, loading } = useAppIndexPatternContext();
const onChange = (value?: string) => {
setSeries(seriesId, {
@@ -78,6 +80,10 @@ export function ReportMetricOptions({ seriesId, series, seriesConfig }: Props) {
};
});
+ if (!indexPattern && !loading) {
+ return {NO_DATA_AVAILABLE};
+ }
+
return (
<>
{!series.selectedMetricField && (
@@ -88,6 +94,7 @@ export function ReportMetricOptions({ seriesId, series, seriesConfig }: Props) {
onClick={() => setShowOptions((prevState) => !prevState)}
fill
size="s"
+ isLoading={!indexPattern && loading}
>
{SELECT_REPORT_METRIC_LABEL}
@@ -107,19 +114,23 @@ export function ReportMetricOptions({ seriesId, series, seriesConfig }: Props) {
)}
- {series.selectedMetricField && (
- onChange(undefined)}
- iconOnClickAriaLabel={REMOVE_REPORT_METRIC_LABEL}
- >
- {
- seriesConfig?.metricOptions?.find((option) => option.id === series.selectedMetricField)
- ?.label
- }
-
- )}
+ {series.selectedMetricField &&
+ (indexPattern && !loading ? (
+ onChange(undefined)}
+ iconOnClickAriaLabel={REMOVE_REPORT_METRIC_LABEL}
+ >
+ {
+ seriesConfig?.metricOptions?.find(
+ (option) => option.id === series.selectedMetricField
+ )?.label
+ }
+
+ ) : (
+
+ ))}
>
);
}
@@ -137,3 +148,7 @@ const REMOVE_REPORT_METRIC_LABEL = i18n.translate(
defaultMessage: 'Remove report metric',
}
);
+
+const NO_DATA_AVAILABLE = i18n.translate('xpack.observability.expView.seriesEditor.noData', {
+ defaultMessage: 'No data available',
+});