import React from 'react' ; import ReactDOM from 'react-dom' ; import { i18n } from '@kbn/i18n' ; import { I18nProvider } from '@kbn/i18n-react' ; import { CoreStart } from 'src/core/public' ; import { DashboardCloneModal } from './clone_modal' ; import { KibanaThemeProvider } from '../../services/kibana_react' ; export interface ShowCloneModalProps { onClone : ( newTitle : string , isTitleDuplicateConfirmed : boolean , onTitleDuplicate : ( ) => void ) => Promise < { id ? : string ; } | { error : Error ; } > ; title : string ; theme$ : CoreStart [ 'theme' ] [ 'theme$' ] ; } export function showCloneModal ( { onClone , title , theme$ } ) { const container = document . createElement ( 'div' ) ; const closeModal = ( ) => { ReactDOM . unmountComponentAtNode ( container ) ; document . body . removeChild ( container ) ; } ; const onCloneConfirmed = async ( newTitle , isTitleDuplicateConfirmed , onTitleDuplicate ) => { onClone ( newTitle , isTitleDuplicateConfirmed , onTitleDuplicate ) . then ( ( response ) => { if ( ( response as { error : Error ; } ) . error || ( response as { id ? : string ; } ) . id ) { closeModal ( ) ; } } ) ; } ; document . body . appendChild ( container ) ; const element = ( < I18nProvider > < KibanaThemeProvider theme$ = { theme$ } > < DashboardCloneModal onClone = { onCloneConfirmed } onClose = { closeModal } title = { i18n . translate ( 'dashboard.topNav.showCloneModal.dashboardCopyTitle' , { defaultMessage : '{title} Copy' , values : { title } , } ) } / > < /KibanaThemeProvider> < /I18nProvider>); ReactDOM . render ( element , container ) ; }