/*
 * Copyright OpenSearch Contributors
 * SPDX-License-Identifier: Apache-2.0
 */

import React from 'react';
import { EuiIcon, EuiText, EuiSpacer } from '@elastic/eui';
import { FormattedMessage } from '@osd/i18n/react';

export const EmptyPlaceholder = (props: { icon: string }) => (
  <>
    <EuiText
      className="visWorkspaceNoData"
      textAlign="center"
      color="subdued"
      size="xs"
      data-test-subj="vizWorkspace__noData"
    >
      <EuiIcon type={props.icon} color="subdued" size="xxl" />
      <EuiSpacer size="l" />
      <p>
        <FormattedMessage id="visualization_noData" defaultMessage="No data found" />
      </p>
    </EuiText>
  </>
);