mirror of
https://github.com/elastic/kibana.git
synced 2025-06-27 18:51:07 -04:00
Closes https://github.com/elastic/kibana/issues/145427 ## Summary This PR adds an example plugin that demonstrates a few uses of the new portable dashboards. It includes the following examples: 1. A by-value dashboard with controls  2. A by-value empty dashboard that allows panels (both by-value and by-reference) to be added where the state can be saved to local storage  3. Two side-by-side by-value empty dashboards with independent redux states  4. A static, by-reference dashboard  5. A static, by-value dashboard  As part of this, I created a new demo embeddable type - the `FilterDebuggerEmbeddable` which, when added to a dashboard, will display the filters + query that it is receiving as an input. You can see how this embeddable works in the GIF for the first example above. ### Checklist - [x] This was checked for [cross-browser compatibility](https://www.elastic.co/support/matrix#matrix_browsers) ### For maintainers - [ ] This was checked for breaking API changes and was [labeled appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
63 lines
2 KiB
TypeScript
63 lines
2 KiB
TypeScript
/*
|
||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||
* or more contributor license agreements. Licensed under the Elastic License
|
||
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
||
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
||
* Side Public License, v 1.
|
||
*/
|
||
|
||
import {
|
||
AppMountParameters,
|
||
AppNavLinkStatus,
|
||
CoreSetup,
|
||
CoreStart,
|
||
Plugin,
|
||
} from '@kbn/core/public';
|
||
import type { DeveloperExamplesSetup } from '@kbn/developer-examples-plugin/public';
|
||
import type { NavigationPublicPluginStart } from '@kbn/navigation-plugin/public';
|
||
import type { DataPublicPluginStart } from '@kbn/data-plugin/public';
|
||
import { DashboardStart } from '@kbn/dashboard-plugin/public';
|
||
|
||
import img from './portable_dashboard_image.png';
|
||
import { PLUGIN_ID } from './constants';
|
||
|
||
interface SetupDeps {
|
||
developerExamples: DeveloperExamplesSetup;
|
||
}
|
||
|
||
export interface PortableDashboardsExampleStartDeps {
|
||
dashboard: DashboardStart;
|
||
data: DataPublicPluginStart;
|
||
navigation: NavigationPublicPluginStart;
|
||
}
|
||
|
||
export class PortableDashboardsExamplePlugin
|
||
implements Plugin<void, void, SetupDeps, PortableDashboardsExampleStartDeps>
|
||
{
|
||
public setup(
|
||
core: CoreSetup<PortableDashboardsExampleStartDeps>,
|
||
{ developerExamples }: SetupDeps
|
||
) {
|
||
core.application.register({
|
||
id: PLUGIN_ID,
|
||
title: 'Portable dashboard examples',
|
||
navLinkStatus: AppNavLinkStatus.hidden,
|
||
async mount(params: AppMountParameters) {
|
||
const [, depsStart] = await core.getStartServices();
|
||
const { renderApp } = await import('./app');
|
||
return renderApp(depsStart, params);
|
||
},
|
||
});
|
||
|
||
developerExamples.register({
|
||
appId: PLUGIN_ID,
|
||
title: 'Portable Dashboards',
|
||
description: `Showcases different ways to embed a dashboard into your app`,
|
||
image: img,
|
||
});
|
||
}
|
||
|
||
public async start(core: CoreStart, { dashboard }: PortableDashboardsExampleStartDeps) {}
|
||
|
||
public stop() {}
|
||
}
|