import React from 'react' ; import ReactDOM from 'react-dom' ; import { BrowserRouter as Router , Route , RouteComponentProps } from 'react-router-dom' ; import { EuiPage } from '@elastic/eui' ; import { AppMountParameters , CoreStart } from '../../../../src/core/public' ; import { Page } from './components/page' ; import { DocumentationPage } from './components/documentation' ; import { ViewAlertPage } from './components/view_alert' ; import { TriggersAndActionsUIPublicPluginStart } from '../../../plugins/triggers_actions_ui/public' ; import { AlertingExamplePublicStartDeps } from './plugin' ; import { ViewPeopleInSpaceAlertPage } from './components/view_astros_alert' ; import { KibanaContextProvider } from '../../../../src/plugins/kibana_react/public' ; export interface AlertingExampleComponentParams { http : CoreStart [ 'http' ] ; basename : string ; triggersActionsUi : TriggersAndActionsUIPublicPluginStart ; } const AlertingExampleApp = ( { basename , http , triggersActionsUi , } ) => { return ( < Router basename = { basename } > < EuiPage > < Route path = { `/` } exact = { true } render = { ( ) => ( < Page title = { `Home` } isHome = { true } > < DocumentationPage triggersActionsUi = { triggersActionsUi } /> < /Page>)}/ > < Route path = { `/rule/:id` } render = { ( props ) => { return ( < Page title = { `View Rule` } crumb = { `View Rule ${ props . match . params . id }` } > < ViewAlertPage http = { http } id = { props . match . params . id } / > < /Page>); } } /> < Route path = { `/astros/:id` } render = { ( props ) => { return ( < Page title = { `View People In Space Rule` } crumb = { `Astros ${ props . match . params . id }` } > < ViewPeopleInSpaceAlertPage http = { http } id = { props . match . params . id } / > < /Page>); } } /> < /EuiPage> < /Router>); } ; export const renderApp = ( core , deps , { appBasePath , element } ) => { const { http } = core ; ReactDOM . render ( < KibanaContextProvider services = { { ... core , ... deps } } > < AlertingExampleApp basename = { appBasePath } http = { http } triggersActionsUi = { deps . triggersActionsUi } / > < /KibanaContextProvider>, element); return ( ) => ReactDOM . unmountComponentAtNode ( element ) ; } ;