Update docs to not use AppMountContext (#52962)

This commit is contained in:
Josh Dover 2019-12-13 13:00:54 -06:00 committed by GitHub
parent 3e6270737a
commit 0dac43516e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 12 deletions

View file

@ -22,9 +22,9 @@ export class MyPlugin implements Plugin {
setup({ application }) {
application.register({
id: 'my-app',
async mount(context, params) {
async mount(params) {
const { renderApp } = await import('./application');
return renderApp(context, params);
return renderApp(params);
},
});
}
@ -38,7 +38,10 @@ import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter, Route } from 'react-router-dom';
export renderApp = (context, { appBasePath, element }) => {
import { CoreStart, AppMountParams } from 'src/core/public';
import { MyPluginDepsStart } from './plugin';
export renderApp = ({ appBasePath, element }: AppMountParams) => {
ReactDOM.render(
// pass `appBasePath` to `basename`
<BrowserRouter basename={appBasePath}>

View file

@ -130,16 +130,16 @@ leverage this pattern.
import React from 'react';
import ReactDOM from 'react-dom';
import { ApplicationMountContext } from '../../src/core/public';
import { CoreStart, AppMountParams } from '../../src/core/public';
import { MyAppRoot } from './components/app.ts';
/**
* This module will be loaded asynchronously to reduce the bundle size of your plugin's main bundle.
*/
export const renderApp = (context: ApplicationMountContext, domElement: HTMLDivElement) => {
ReactDOM.render(<MyAppRoot context={context} />, domElement);
return () => ReactDOM.unmountComponentAtNode(domElement);
export const renderApp = (core: CoreStart, deps: MyPluginDepsStart, { element, appBasePath }: AppMountParams) => {
ReactDOM.render(<MyAppRoot core={core} deps={deps} routerBasePath={appBasePath} />, element);
return () => ReactDOM.unmountComponentAtNode(element);
}
```
@ -152,10 +152,12 @@ export class MyPlugin implements Plugin {
public setup(core) {
core.application.register({
id: 'my-app',
async mount(context, domElement) {
async mount(params) {
// Load application bundle
const { renderApp } = await import('./application/my_app');
return renderApp(context, domElement);
// Get start services
const [coreStart, depsStart] = core.getStartServices();
return renderApp(coreStart, depsStart, params);
}
});
}

View file

@ -189,9 +189,9 @@ export interface AppMountParameters {
* setup({ application }) {
* application.register({
* id: 'my-app',
* async mount(context, params) {
* async mount(params) {
* const { renderApp } = await import('./application');
* return renderApp(context, params);
* return renderApp(params);
* },
* });
* }
@ -204,7 +204,10 @@ export interface AppMountParameters {
* import ReactDOM from 'react-dom';
* import { BrowserRouter, Route } from 'react-router-dom';
*
* export renderApp = (context, { appBasePath, element }) => {
* import { CoreStart, AppMountParams } from 'src/core/public';
* import { MyPluginDepsStart } from './plugin';
*
* export renderApp = ({ appBasePath, element }: AppMountParams) => {
* ReactDOM.render(
* // pass `appBasePath` to `basename`
* <BrowserRouter basename={appBasePath}>