import React , { Fragment } from 'react' ; import { EuiFlexGroup , EuiFlexItem , EuiIcon , EuiIconTip , EuiLoadingSpinner } from '@elastic/eui' ; import { SNAPSHOT_STATE } from '../../../../../constants' ; import { useServices } from '../../../../../app_context' ; interface Props { state : any ; } export const SnapshotState = ( { state } ) => { const { i18n } = useServices ( ) ; const stateMap = { [ SNAPSHOT_STATE . IN_PROGRESS ] : { icon : < EuiLoadingSpinner size = "m" />, label : i18n . translate ( 'xpack.snapshotRestore.snapshotState.inProgressLabel' , { defaultMessage : 'Taking snapshot…' , } ) , } , [ SNAPSHOT_STATE . SUCCESS ] : { icon : < EuiIcon color = "success" type = "check" / > , label : i18n . translate ( 'xpack.snapshotRestore.snapshotState.completeLabel' , { defaultMessage : 'Snapshot complete' , } ) , } , [ SNAPSHOT_STATE . FAILED ] : { icon : < EuiIcon color = "danger" type = "cross" / > , label : i18n . translate ( 'xpack.snapshotRestore.snapshotState.failedLabel' , { defaultMessage : 'Snapshot failed' , } ) , } , [ SNAPSHOT_STATE . PARTIAL ] : { icon : < EuiIcon color = "warning" type = "alert" / > , label : i18n . translate ( 'xpack.snapshotRestore.snapshotState.partialLabel' , { defaultMessage : 'Partial failure' , } ) , tip : i18n . translate ( 'xpack.snapshotRestore.snapshotState.partialTipDescription' , { defaultMessage : `Global cluster state was stored, but at least one shard wasn't stored successfully. See the 'Failed indices' tab.` , } ) , } , [ SNAPSHOT_STATE . INCOMPATIBLE ] : { icon : < EuiIcon color = "warning" type = "alert" / > , label : i18n . translate ( 'xpack.snapshotRestore.snapshotState.incompatibleLabel' , { defaultMessage : 'Incompatible version' , } ) , tip : i18n . translate ( 'xpack.snapshotRestore.snapshotState.incompatibleTipDescription' , { defaultMessage : `Snapshot was created with a version of Elasticsearch incompatible with the cluster's version.` , } ) , } , } ; if ( ! stateMap [ state ] ) { return state ; } const { icon , label , tip } = stateMap [ state ] ; const iconTip = tip && ( < Fragment > { ' ' } < EuiIconTip content = { tip } / > < /Fragment>); return ( < EuiFlexGroup gutterSize = "xs" alignItems = "center" responsive = { false } > < EuiFlexItem grow = { false } > { icon } < /EuiFlexItem> < EuiFlexItem grow = { false } > { } < div > { label } { iconTip } < /div> < /EuiFlexItem> < /EuiFlexGroup>); } ;