import React , { FC , useCallback , useState } from 'react' ; import { EuiButtonEmpty } from '@elastic/eui' ; import { i18n } from '@kbn/i18n' ; import { JobType , ML_SAVED_OBJECT_TYPE , SavedObjectResult , } from '../../../../common/types/saved_objects' ; import type { SpacesPluginStart , ShareToSpaceFlyoutProps } from '../../../../../spaces/public' ; import { ml } from '../../services/ml_api_service' ; import { useToastNotificationService } from '../../services/toast_notification_service' ; interface Props { spacesApi : SpacesPluginStart ; spaceIds : string [ ] ; jobId : string ; jobType : JobType ; refresh ( ) : void ; } const ALL_SPACES_ID = '*' ; const objectNoun = i18n . translate ( 'xpack.ml.management.jobsSpacesList.objectNoun' , { defaultMessage : 'job' , } ) ; export const JobSpacesList = ( { spacesApi , spaceIds , jobId , jobType , refresh } ) => { const { displayErrorToast } = useToastNotificationService ( ) ; const [ showFlyout , setShowFlyout ] = useState ( false ) ; async function changeSpacesHandler ( _objects , spacesToAdd , spacesToMaybeRemove ) { const spacesToRemove = spacesToAdd . includes ( ALL_SPACES_ID ) ? [ ] : spacesToMaybeRemove ; if ( spacesToAdd . length || spacesToRemove . length ) { const resp = await ml . savedObjects . updateJobsSpaces ( jobType , [ jobId ] , spacesToAdd , spacesToRemove ) ; handleApplySpaces ( resp ) ; } onClose ( ) ; } function onClose ( ) { setShowFlyout ( false ) ; refresh ( ) ; } function handleApplySpaces ( resp ) { Object . entries ( resp ) . forEach ( ( [ id , { success , error } ] ) => { if ( success === false ) { const title = i18n . translate ( 'xpack.ml.management.jobsSpacesList.updateSpaces.error' , { defaultMessage : 'Error updating {id}' , values : { id } , } ) ; displayErrorToast ( error , title ) ; } } ) ; } const LazySpaceList = useCallback ( spacesApi . ui . components . getSpaceList , [ spacesApi ] ) ; const LazyShareToSpaceFlyout = useCallback ( spacesApi . ui . components . getShareToSpaceFlyout , [ spacesApi , ] ) ; const shareToSpaceFlyoutProps = { savedObjectTarget : { type : ML_SAVED_OBJECT_TYPE , id : jobId , namespaces : spaceIds , title : jobId , noun : objectNoun , } , behaviorContext : 'outside-space' , changeSpacesHandler , onClose , } ; return ( < > < EuiButtonEmpty onClick = { ( ) => setShowFlyout ( true ) } style = { { height : 'auto' } } data - test - subj = "mlJobListRowManageSpacesButton" > < LazySpaceList namespaces = { spaceIds } displayLimit = { 0 } behaviorContext = "outside-space" / > < /EuiButtonEmpty> { showFlyout && < LazyShareToSpaceFlyout { ... shareToSpaceFlyoutProps } / > } < />); } ;