- Hello chrome!
-
-
- Partial<Capabilities> | Custom capabilities defined by the app. |
+| [euiIconType](./kibana-plugin-public.appbase.euiicontype.md) | string | A EUI iconType that will be used for the app's icon. This icon takes precendence over the icon property. |
+| [icon](./kibana-plugin-public.appbase.icon.md) | string | A URL to an image file used as an icon. Used as a fallback if euiIconType is not provided. |
+| [id](./kibana-plugin-public.appbase.id.md) | string | |
+| [order](./kibana-plugin-public.appbase.order.md) | number | An ordinal used to sort nav links relative to one another for display. |
+| [title](./kibana-plugin-public.appbase.title.md) | string | The title of the application. |
+| [tooltip$](./kibana-plugin-public.appbase.tooltip$.md) | Observable<string> | An observable for a tooltip shown when hovering over app link. |
+
diff --git a/docs/development/core/public/kibana-plugin-public.appbase.order.md b/docs/development/core/public/kibana-plugin-public.appbase.order.md
new file mode 100644
index 0000000000000..dc0ea14a7b860
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.appbase.order.md
@@ -0,0 +1,13 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [AppBase](./kibana-plugin-public.appbase.md) > [order](./kibana-plugin-public.appbase.order.md)
+
+## AppBase.order property
+
+An ordinal used to sort nav links relative to one another for display.
+
+Signature:
+
+```typescript
+order?: number;
+```
diff --git a/docs/development/core/public/kibana-plugin-public.appbase.title.md b/docs/development/core/public/kibana-plugin-public.appbase.title.md
new file mode 100644
index 0000000000000..4d0fb0c18e814
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.appbase.title.md
@@ -0,0 +1,13 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [AppBase](./kibana-plugin-public.appbase.md) > [title](./kibana-plugin-public.appbase.title.md)
+
+## AppBase.title property
+
+The title of the application.
+
+Signature:
+
+```typescript
+title: string;
+```
diff --git a/docs/development/core/public/kibana-plugin-public.appbase.tooltip$.md b/docs/development/core/public/kibana-plugin-public.appbase.tooltip$.md
new file mode 100644
index 0000000000000..1b8ca490825f9
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.appbase.tooltip$.md
@@ -0,0 +1,13 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [AppBase](./kibana-plugin-public.appbase.md) > [tooltip$](./kibana-plugin-public.appbase.tooltip$.md)
+
+## AppBase.tooltip$ property
+
+An observable for a tooltip shown when hovering over app link.
+
+Signature:
+
+```typescript
+tooltip$?: ObservablerootRoute. |
+| [register(app)](./kibana-plugin-public.applicationsetup.register.md) | Register an mountable application to the system. |
+| [registerMountContext(contextName, provider)](./kibana-plugin-public.applicationsetup.registermountcontext.md) | Register a context provider for application mounting. Will only be available to applications that depend on the plugin that registered this context. |
diff --git a/docs/development/core/public/kibana-plugin-public.applicationsetup.registerapp.md b/docs/development/core/public/kibana-plugin-public.applicationsetup.register.md
similarity index 52%
rename from docs/development/core/public/kibana-plugin-public.applicationsetup.registerapp.md
rename to docs/development/core/public/kibana-plugin-public.applicationsetup.register.md
index f2532ae71ca2f..b4ccb6a01c600 100644
--- a/docs/development/core/public/kibana-plugin-public.applicationsetup.registerapp.md
+++ b/docs/development/core/public/kibana-plugin-public.applicationsetup.register.md
@@ -1,22 +1,22 @@
-[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [ApplicationSetup](./kibana-plugin-public.applicationsetup.md) > [registerApp](./kibana-plugin-public.applicationsetup.registerapp.md)
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [ApplicationSetup](./kibana-plugin-public.applicationsetup.md) > [register](./kibana-plugin-public.applicationsetup.register.md)
-## ApplicationSetup.registerApp() method
+## ApplicationSetup.register() method
-Register an mountable application to the system. Apps will be mounted based on their `rootRoute`.
+Register an mountable application to the system.
Signature:
```typescript
-registerApp(app: App): void;
+register(app: App): void;
```
## Parameters
| Parameter | Type | Description |
| --- | --- | --- |
-| app | App | |
+| app | App | an [App](./kibana-plugin-public.app.md) |
Returns:
diff --git a/docs/development/core/public/kibana-plugin-public.applicationsetup.registermountcontext.md b/docs/development/core/public/kibana-plugin-public.applicationsetup.registermountcontext.md
new file mode 100644
index 0000000000000..0b5bd8eeb36ec
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.applicationsetup.registermountcontext.md
@@ -0,0 +1,25 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [ApplicationSetup](./kibana-plugin-public.applicationsetup.md) > [registerMountContext](./kibana-plugin-public.applicationsetup.registermountcontext.md)
+
+## ApplicationSetup.registerMountContext() method
+
+Register a context provider for application mounting. Will only be available to applications that depend on the plugin that registered this context.
+
+Signature:
+
+```typescript
+registerMountContextT | The key of [AppMountContext](./kibana-plugin-public.appmountcontext.md) this provider's return value should be attached to. |
+| provider | IContextProvider<AppMountContext, T> | A [IContextProvider](./kibana-plugin-public.icontextprovider.md) function |
+
+Returns:
+
+`void`
+
diff --git a/docs/development/core/public/kibana-plugin-public.applicationstart.availableapps.md b/docs/development/core/public/kibana-plugin-public.applicationstart.availableapps.md
deleted file mode 100644
index 8bbd1dfcd31fa..0000000000000
--- a/docs/development/core/public/kibana-plugin-public.applicationstart.availableapps.md
+++ /dev/null
@@ -1,13 +0,0 @@
-
-
-[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [ApplicationStart](./kibana-plugin-public.applicationstart.md) > [availableApps](./kibana-plugin-public.applicationstart.availableapps.md)
-
-## ApplicationStart.availableApps property
-
-Apps available based on the current capabilities. Should be used to show navigation links and make routing decisions.
-
-Signature:
-
-```typescript
-availableApps: readonly App[];
-```
diff --git a/docs/development/core/public/kibana-plugin-public.applicationstart.geturlforapp.md b/docs/development/core/public/kibana-plugin-public.applicationstart.geturlforapp.md
new file mode 100644
index 0000000000000..422fbdf7418c2
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.applicationstart.geturlforapp.md
@@ -0,0 +1,27 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [ApplicationStart](./kibana-plugin-public.applicationstart.md) > [getUrlForApp](./kibana-plugin-public.applicationstart.geturlforapp.md)
+
+## ApplicationStart.getUrlForApp() method
+
+Returns a relative URL to a given app, including the global base path.
+
+Signature:
+
+```typescript
+getUrlForApp(appId: string, options?: {
+ path?: string;
+ }): string;
+```
+
+## Parameters
+
+| Parameter | Type | Description |
+| --- | --- | --- |
+| appId | string | |
+| options | { path?: string; } | |
+
+Returns:
+
+`string`
+
diff --git a/docs/development/core/public/kibana-plugin-public.applicationstart.md b/docs/development/core/public/kibana-plugin-public.applicationstart.md
index 5854a7c65714e..2a60ff449e44e 100644
--- a/docs/development/core/public/kibana-plugin-public.applicationstart.md
+++ b/docs/development/core/public/kibana-plugin-public.applicationstart.md
@@ -15,6 +15,13 @@ export interface ApplicationStart
| Property | Type | Description |
| --- | --- | --- |
-| [availableApps](./kibana-plugin-public.applicationstart.availableapps.md) | readonly App[] | Apps available based on the current capabilities. Should be used to show navigation links and make routing decisions. |
| [capabilities](./kibana-plugin-public.applicationstart.capabilities.md) | RecursiveReadonly<Capabilities> | Gets the read-only capabilities. |
+## Methods
+
+| Method | Description |
+| --- | --- |
+| [getUrlForApp(appId, options)](./kibana-plugin-public.applicationstart.geturlforapp.md) | Returns a relative URL to a given app, including the global base path. |
+| [navigateToApp(appId, options)](./kibana-plugin-public.applicationstart.navigatetoapp.md) | Navigiate to a given app |
+| [registerMountContext(contextName, provider)](./kibana-plugin-public.applicationstart.registermountcontext.md) | Register a context provider for application mounting. Will only be available to applications that depend on the plugin that registered this context. |
+
diff --git a/docs/development/core/public/kibana-plugin-public.applicationstart.navigatetoapp.md b/docs/development/core/public/kibana-plugin-public.applicationstart.navigatetoapp.md
new file mode 100644
index 0000000000000..eef31fe661f54
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.applicationstart.navigatetoapp.md
@@ -0,0 +1,28 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [ApplicationStart](./kibana-plugin-public.applicationstart.md) > [navigateToApp](./kibana-plugin-public.applicationstart.navigatetoapp.md)
+
+## ApplicationStart.navigateToApp() method
+
+Navigiate to a given app
+
+Signature:
+
+```typescript
+navigateToApp(appId: string, options?: {
+ path?: string;
+ state?: any;
+ }): void;
+```
+
+## Parameters
+
+| Parameter | Type | Description |
+| --- | --- | --- |
+| appId | string | |
+| options | { path?: string; state?: any; } | |
+
+Returns:
+
+`void`
+
diff --git a/docs/development/core/public/kibana-plugin-public.applicationstart.registermountcontext.md b/docs/development/core/public/kibana-plugin-public.applicationstart.registermountcontext.md
new file mode 100644
index 0000000000000..fc86aaf658b68
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.applicationstart.registermountcontext.md
@@ -0,0 +1,25 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [ApplicationStart](./kibana-plugin-public.applicationstart.md) > [registerMountContext](./kibana-plugin-public.applicationstart.registermountcontext.md)
+
+## ApplicationStart.registerMountContext() method
+
+Register a context provider for application mounting. Will only be available to applications that depend on the plugin that registered this context.
+
+Signature:
+
+```typescript
+registerMountContextT | The key of [AppMountContext](./kibana-plugin-public.appmountcontext.md) this provider's return value should be attached to. |
+| provider | IContextProvider<AppMountContext, T> | A [IContextProvider](./kibana-plugin-public.icontextprovider.md) function |
+
+Returns:
+
+`void`
+
diff --git a/docs/development/core/public/kibana-plugin-public.appmountcontext.core.md b/docs/development/core/public/kibana-plugin-public.appmountcontext.core.md
new file mode 100644
index 0000000000000..63b3ead814f00
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.appmountcontext.core.md
@@ -0,0 +1,22 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [AppMountContext](./kibana-plugin-public.appmountcontext.md) > [core](./kibana-plugin-public.appmountcontext.core.md)
+
+## AppMountContext.core property
+
+Core service APIs available to mounted applications.
+
+Signature:
+
+```typescript
+core: {
+ application: Pick{ application: Pick<ApplicationStart, 'capabilities' | 'navigateToApp'>; chrome: ChromeStart; docLinks: DocLinksStart; http: HttpStart; i18n: I18nStart; notifications: NotificationsStart; overlays: OverlayStart; uiSettings: UiSettingsClientContract; } | Core service APIs available to mounted applications. |
+
diff --git a/docs/development/core/public/kibana-plugin-public.appmountparameters.appbasepath.md b/docs/development/core/public/kibana-plugin-public.appmountparameters.appbasepath.md
new file mode 100644
index 0000000000000..16c8ffe07fc15
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.appmountparameters.appbasepath.md
@@ -0,0 +1,53 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [AppMountParameters](./kibana-plugin-public.appmountparameters.md) > [appBasePath](./kibana-plugin-public.appmountparameters.appbasepath.md)
+
+## AppMountParameters.appBasePath property
+
+The base path for configuring the application's router.
+
+Signature:
+
+```typescript
+appBasePath: string;
+```
+
+## Example
+
+How to configure react-router with a base path:
+
+```ts
+// inside your plugin's setup function
+export class MyPlugin implements Plugin {
+ setup({ application }) {
+ application.register({
+ id: 'my-app',
+ async mount(context, params) {
+ const { renderApp } = await import('./application');
+ return renderApp(context, params);
+ },
+ });
+}
+
+```
+
+```ts
+// application.tsx
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { BrowserRouter, Route } from 'react-router-dom';
+
+export renderApp = (context, { appBasePath, element }) => {
+ ReactDOM.render(
+ // pass `appBasePath` to `basename`
+ string | The base path for configuring the application's router. |
+| [element](./kibana-plugin-public.appmountparameters.element.md) | HTMLElement | The container element to render the application into. |
+
diff --git a/docs/development/core/public/kibana-plugin-public.appunmount.md b/docs/development/core/public/kibana-plugin-public.appunmount.md
new file mode 100644
index 0000000000000..61782d19ca8c5
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.appunmount.md
@@ -0,0 +1,13 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [AppUnmount](./kibana-plugin-public.appunmount.md)
+
+## AppUnmount type
+
+A function called when an application should be unmounted from the page. This function should be synchronous.
+
+Signature:
+
+```typescript
+export declare type AppUnmount = () => void;
+```
diff --git a/docs/development/core/public/kibana-plugin-public.chromenavlink.order.md b/docs/development/core/public/kibana-plugin-public.chromenavlink.order.md
index e4e2ad2c7a3a7..1fef9fc1dc359 100644
--- a/docs/development/core/public/kibana-plugin-public.chromenavlink.order.md
+++ b/docs/development/core/public/kibana-plugin-public.chromenavlink.order.md
@@ -9,5 +9,5 @@ An ordinal used to sort nav links relative to one another for display.
Signature:
```typescript
-readonly order: number;
+readonly order?: number;
```
diff --git a/docs/development/core/public/kibana-plugin-public.coresetup.application.md b/docs/development/core/public/kibana-plugin-public.coresetup.application.md
new file mode 100644
index 0000000000000..4b39b2c76802b
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.coresetup.application.md
@@ -0,0 +1,13 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [CoreSetup](./kibana-plugin-public.coresetup.md) > [application](./kibana-plugin-public.coresetup.application.md)
+
+## CoreSetup.application property
+
+[ApplicationSetup](./kibana-plugin-public.applicationsetup.md)
+
+Signature:
+
+```typescript
+application: ApplicationSetup;
+```
diff --git a/docs/development/core/public/kibana-plugin-public.coresetup.md b/docs/development/core/public/kibana-plugin-public.coresetup.md
index a4b5b88df36dc..9b94e2db52831 100644
--- a/docs/development/core/public/kibana-plugin-public.coresetup.md
+++ b/docs/development/core/public/kibana-plugin-public.coresetup.md
@@ -16,6 +16,7 @@ export interface CoreSetup
| Property | Type | Description |
| --- | --- | --- |
+| [application](./kibana-plugin-public.coresetup.application.md) | ApplicationSetup | [ApplicationSetup](./kibana-plugin-public.applicationsetup.md) |
| [context](./kibana-plugin-public.coresetup.context.md) | ContextSetup | [ContextSetup](./kibana-plugin-public.contextsetup.md) |
| [fatalErrors](./kibana-plugin-public.coresetup.fatalerrors.md) | FatalErrorsSetup | [FatalErrorsSetup](./kibana-plugin-public.fatalerrorssetup.md) |
| [http](./kibana-plugin-public.coresetup.http.md) | HttpSetup | [HttpSetup](./kibana-plugin-public.httpsetup.md) |
diff --git a/docs/development/core/public/kibana-plugin-public.corestart.application.md b/docs/development/core/public/kibana-plugin-public.corestart.application.md
index 1dd05ff947aeb..c26701ca80529 100644
--- a/docs/development/core/public/kibana-plugin-public.corestart.application.md
+++ b/docs/development/core/public/kibana-plugin-public.corestart.application.md
@@ -9,5 +9,5 @@
Signature:
```typescript
-application: PickPick<ApplicationStart, 'capabilities'> | [ApplicationStart](./kibana-plugin-public.applicationstart.md) |
+| [application](./kibana-plugin-public.corestart.application.md) | ApplicationStart | [ApplicationStart](./kibana-plugin-public.applicationstart.md) |
| [chrome](./kibana-plugin-public.corestart.chrome.md) | ChromeStart | [ChromeStart](./kibana-plugin-public.chromestart.md) |
| [docLinks](./kibana-plugin-public.corestart.doclinks.md) | DocLinksStart | [DocLinksStart](./kibana-plugin-public.doclinksstart.md) |
| [http](./kibana-plugin-public.corestart.http.md) | HttpStart | [HttpStart](./kibana-plugin-public.httpstart.md) |
diff --git a/docs/development/core/public/kibana-plugin-public.legacycoresetup.injectedmetadata.md b/docs/development/core/public/kibana-plugin-public.legacycoresetup.injectedmetadata.md
new file mode 100644
index 0000000000000..f71277e64ff17
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.legacycoresetup.injectedmetadata.md
@@ -0,0 +1,15 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [LegacyCoreSetup](./kibana-plugin-public.legacycoresetup.md) > [injectedMetadata](./kibana-plugin-public.legacycoresetup.injectedmetadata.md)
+
+## LegacyCoreSetup.injectedMetadata property
+
+> Warning: This API is now obsolete.
+>
+>
+
+Signature:
+
+```typescript
+injectedMetadata: InjectedMetadataSetup;
+```
diff --git a/docs/development/core/public/kibana-plugin-public.legacycoresetup.md b/docs/development/core/public/kibana-plugin-public.legacycoresetup.md
new file mode 100644
index 0000000000000..f704bc65d12a5
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.legacycoresetup.md
@@ -0,0 +1,28 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [LegacyCoreSetup](./kibana-plugin-public.legacycoresetup.md)
+
+## LegacyCoreSetup interface
+
+> Warning: This API is now obsolete.
+>
+>
+
+Setup interface exposed to the legacy platform via the `ui/new_platform` module.
+
+Signature:
+
+```typescript
+export interface LegacyCoreSetup extends CoreSetup
+```
+
+## Properties
+
+| Property | Type | Description |
+| --- | --- | --- |
+| [injectedMetadata](./kibana-plugin-public.legacycoresetup.injectedmetadata.md) | InjectedMetadataSetup | |
+
+## Remarks
+
+Some methods are not supported in the legacy platform and while present to make this type compatibile with [CoreSetup](./kibana-plugin-public.coresetup.md), unsupported methods will throw exceptions when called.
+
diff --git a/docs/development/core/public/kibana-plugin-public.legacycorestart.injectedmetadata.md b/docs/development/core/public/kibana-plugin-public.legacycorestart.injectedmetadata.md
new file mode 100644
index 0000000000000..cd818c3f5adc7
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.legacycorestart.injectedmetadata.md
@@ -0,0 +1,15 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [LegacyCoreStart](./kibana-plugin-public.legacycorestart.md) > [injectedMetadata](./kibana-plugin-public.legacycorestart.injectedmetadata.md)
+
+## LegacyCoreStart.injectedMetadata property
+
+> Warning: This API is now obsolete.
+>
+>
+
+Signature:
+
+```typescript
+injectedMetadata: InjectedMetadataStart;
+```
diff --git a/docs/development/core/public/kibana-plugin-public.legacycorestart.md b/docs/development/core/public/kibana-plugin-public.legacycorestart.md
new file mode 100644
index 0000000000000..775c3fb1ffe3d
--- /dev/null
+++ b/docs/development/core/public/kibana-plugin-public.legacycorestart.md
@@ -0,0 +1,28 @@
+
+
+[Home](./index.md) > [kibana-plugin-public](./kibana-plugin-public.md) > [LegacyCoreStart](./kibana-plugin-public.legacycorestart.md)
+
+## LegacyCoreStart interface
+
+> Warning: This API is now obsolete.
+>
+>
+
+Start interface exposed to the legacy platform via the `ui/new_platform` module.
+
+Signature:
+
+```typescript
+export interface LegacyCoreStart extends CoreStart
+```
+
+## Properties
+
+| Property | Type | Description |
+| --- | --- | --- |
+| [injectedMetadata](./kibana-plugin-public.legacycorestart.injectedmetadata.md) | InjectedMetadataStart | |
+
+## Remarks
+
+Some methods are not supported in the legacy platform and while present to make this type compatibile with [CoreStart](./kibana-plugin-public.corestart.md), unsupported methods will throw exceptions when called.
+
diff --git a/docs/development/core/public/kibana-plugin-public.md b/docs/development/core/public/kibana-plugin-public.md
index 5fda9f9159306..ccabdc62c5e7a 100644
--- a/docs/development/core/public/kibana-plugin-public.md
+++ b/docs/development/core/public/kibana-plugin-public.md
@@ -23,8 +23,12 @@ The plugin integrates with the core system via lifecycle events: `setup`
| Interface | Description |
| --- | --- |
+| [App](./kibana-plugin-public.app.md) | Extension of [common app properties](./kibana-plugin-public.appbase.md) with the mount function. |
+| [AppBase](./kibana-plugin-public.appbase.md) | |
| [ApplicationSetup](./kibana-plugin-public.applicationsetup.md) | |
| [ApplicationStart](./kibana-plugin-public.applicationstart.md) | |
+| [AppMountContext](./kibana-plugin-public.appmountcontext.md) | The context object received when applications are mounted to the DOM. |
+| [AppMountParameters](./kibana-plugin-public.appmountparameters.md) | |
| [Capabilities](./kibana-plugin-public.capabilities.md) | The read-only set of capabilities available for the current UI session. Capabilities are simple key-value pairs of (string, boolean), where the string denotes the capability ID, and the boolean is a flag indicating if the capability is enabled or disabled. |
| [ChromeBadge](./kibana-plugin-public.chromebadge.md) | |
| [ChromeBrand](./kibana-plugin-public.chromebrand.md) | |
@@ -54,6 +58,8 @@ The plugin integrates with the core system via lifecycle events: `setup`
| [HttpServiceBase](./kibana-plugin-public.httpservicebase.md) | |
| [I18nStart](./kibana-plugin-public.i18nstart.md) | I18nStart.Context is required by any localizable React component from @kbn/i18n and @elastic/eui packages and is supposed to be used as the topmost component for any i18n-compatible React tree. |
| [IContextContainer](./kibana-plugin-public.icontextcontainer.md) | An object that handles registration of context providers and configuring handlers with context. |
+| [LegacyCoreSetup](./kibana-plugin-public.legacycoresetup.md) | Setup interface exposed to the legacy platform via the ui/new_platform module. |
+| [LegacyCoreStart](./kibana-plugin-public.legacycorestart.md) | Start interface exposed to the legacy platform via the ui/new_platform module. |
| [LegacyNavLink](./kibana-plugin-public.legacynavlink.md) | |
| [NotificationsSetup](./kibana-plugin-public.notificationssetup.md) | |
| [NotificationsStart](./kibana-plugin-public.notificationsstart.md) | |
@@ -80,6 +86,7 @@ The plugin integrates with the core system via lifecycle events: `setup`
| Type Alias | Description |
| --- | --- |
+| [AppUnmount](./kibana-plugin-public.appunmount.md) | A function called when an application should be unmounted from the page. This function should be synchronous. |
| [ChromeHelpExtension](./kibana-plugin-public.chromehelpextension.md) | |
| [ChromeNavLinkUpdateableFields](./kibana-plugin-public.chromenavlinkupdateablefields.md) | |
| [HttpBody](./kibana-plugin-public.httpbody.md) | |
diff --git a/docs/discover/images/saved-query-management-component-all-privileges.png b/docs/discover/images/saved-query-management-component-all-privileges.png
new file mode 100644
index 0000000000000..d3746248f6e27
Binary files /dev/null and b/docs/discover/images/saved-query-management-component-all-privileges.png differ
diff --git a/docs/discover/images/saved-query-management-component-delete-query-button.png b/docs/discover/images/saved-query-management-component-delete-query-button.png
new file mode 100644
index 0000000000000..23af8022069b6
Binary files /dev/null and b/docs/discover/images/saved-query-management-component-delete-query-button.png differ
diff --git a/docs/discover/images/saved-query-management-component-save-as-new-query.png b/docs/discover/images/saved-query-management-component-save-as-new-query.png
new file mode 100644
index 0000000000000..4ba4d1d660268
Binary files /dev/null and b/docs/discover/images/saved-query-management-component-save-as-new-query.png differ
diff --git a/docs/discover/images/saved-query-management-component-save-as-new.png b/docs/discover/images/saved-query-management-component-save-as-new.png
new file mode 100644
index 0000000000000..0899df5c608f5
Binary files /dev/null and b/docs/discover/images/saved-query-management-component-save-as-new.png differ
diff --git a/docs/discover/images/saved-query-save-form-default-filters.png b/docs/discover/images/saved-query-save-form-default-filters.png
new file mode 100644
index 0000000000000..948e474251a37
Binary files /dev/null and b/docs/discover/images/saved-query-save-form-default-filters.png differ
diff --git a/docs/discover/search.asciidoc b/docs/discover/search.asciidoc
index 9286b3ce31ba5..790cc669927c1 100644
--- a/docs/discover/search.asciidoc
+++ b/docs/discover/search.asciidoc
@@ -55,10 +55,10 @@ query language you can also submit queries using the {ref}/query-dsl.html[Elasti
[[save-open-search]]
-=== Saving and Opening Searches
-Saving searches enables you to reload them into Discover and use them as the basis
-for <App 2
')],
+ ]);
+ legacyApps = new Map([
+ ['legacyApp1', { id: 'legacyApp1' }],
+ ['baseApp:legacyApp2', { id: 'baseApp:legacyApp2' }],
+ ]) as Map
+ basename: /asdf/app/app1
+ html: App 1
+
+ basename: /asdf/app/app2
+ html:
App 2
+
+
Hello application!
,
+ } as InternalApplicationStart;
const chrome = chromeServiceMock.createStartContract();
- chrome.getComponent.mockReturnValue(Hello chrome!
);
+ chrome.getHeaderComponent.mockReturnValue(Hello chrome!
);
+ const injectedMetadata = injectedMetadataServiceMock.createStartContract();
+ injectedMetadata.getLegacyMode.mockReturnValue(legacyMode);
const targetDomElement = document.createElement('div');
- const start = rendering.start({ chrome, targetDomElement });
+ const start = rendering.start({ application, chrome, injectedMetadata, targetDomElement });
return { start, targetDomElement };
};
- it('renders into provided DOM element', () => {
+ it('renders application service into provided DOM element', () => {
const { targetDomElement } = getService();
- expect(targetDomElement).toMatchInlineSnapshot(`
-
-
-`);
+ expect(targetDomElement.querySelector('div.application')).toMatchInlineSnapshot(`
+
-
-
+
+ `);
});
- it('returns a div for the legacy service to render into', () => {
- const {
- start: { legacyTargetDomElement },
- targetDomElement,
- } = getService();
- legacyTargetDomElement.innerHTML = 'Hello legacy!';
- expect(targetDomElement.querySelector('#legacy')).toMatchInlineSnapshot(`
-
- Hello legacy!
-
-`);
+ it('contains wrapper divs', () => {
+ const { targetDomElement } = getService();
+ expect(targetDomElement.querySelector('div.app-wrapper')).toBeDefined();
+ expect(targetDomElement.querySelector('div.app-wrapper-pannel')).toBeDefined();
+ });
+
+ describe('legacyMode', () => {
+ it('renders into provided DOM element', () => {
+ const { targetDomElement } = getService({ legacyMode: true });
+ expect(targetDomElement).toMatchInlineSnapshot(`
+
+ Hello application!
+
+
+
+ `);
+ });
+
+ it('returns a div for the legacy service to render into', () => {
+ const {
+ start: { legacyTargetDomElement },
+ targetDomElement,
+ } = getService({ legacyMode: true });
+ expect(targetDomElement.contains(legacyTargetDomElement!)).toBe(true);
+ });
});
});
diff --git a/src/core/public/rendering/rendering_service.tsx b/src/core/public/rendering/rendering_service.tsx
index cbb931bf59ef9..2e066feca8bf3 100644
--- a/src/core/public/rendering/rendering_service.tsx
+++ b/src/core/public/rendering/rendering_service.tsx
@@ -22,9 +22,13 @@ import ReactDOM from 'react-dom';
import { I18nProvider } from '@kbn/i18n/react';
import { InternalChromeStart } from '../chrome';
+import { InternalApplicationStart } from '../application';
+import { InjectedMetadataStart } from '../injected_metadata';
interface StartDeps {
+ application: InternalApplicationStart;
chrome: InternalChromeStart;
+ injectedMetadata: InjectedMetadataStart;
targetDomElement: HTMLDivElement;
}
@@ -39,28 +43,40 @@ interface StartDeps {
* @internal
*/
export class RenderingService {
- start({ chrome, targetDomElement }: StartDeps) {
- const chromeUi = chrome.getComponent();
- const legacyRef = React.createRef
+
+
+ Hello chrome!
+
+
+
{chromeUi}
-
+ {!legacyMode && (
+
+
+ )}
+
+ {legacyMode && }
+
+ {appUi}
+ {
mountpoint.current = el;
}}
diff --git a/src/legacy/core_plugins/data/public/expressions/expression_runner.ts b/src/legacy/core_plugins/data/public/expressions/expression_runner.ts
deleted file mode 100644
index 86a36c9409a48..0000000000000
--- a/src/legacy/core_plugins/data/public/expressions/expression_runner.ts
+++ /dev/null
@@ -1,75 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import { Ast, fromExpression } from '@kbn/interpreter/common';
-
-import { RequestAdapter, DataAdapter } from '../../../../../plugins/inspector/public';
-import { RenderFunctionsRegistry, Interpreter, Result } from './expressions_service';
-
-export interface ExpressionRunnerOptions {
- // TODO use the real types here once they are ready
- context?: object;
- getInitialContext?: () => object;
- element?: Element;
-}
-
-export type ExpressionRunner = (
- expression: string | Ast,
- options: ExpressionRunnerOptions
-) => Promise;
-
-export const createRunFn = (
- renderersRegistry: RenderFunctionsRegistry,
- interpreterPromise: Promise
-): ExpressionRunner => async (expressionOrAst, { element, context, getInitialContext }) => {
- // TODO: make interpreter initialization synchronous to avoid this
- const interpreter = await interpreterPromise;
- const ast =
- typeof expressionOrAst === 'string' ? fromExpression(expressionOrAst) : expressionOrAst;
-
- const response = await interpreter.interpretAst(ast, context || { type: 'null' }, {
- getInitialContext: getInitialContext || (() => ({})),
- inspectorAdapters: {
- // TODO connect real adapters
- requests: new RequestAdapter(),
- data: new DataAdapter(),
- },
- });
-
- if (response.type === 'error') {
- throw response;
- }
-
- if (element) {
- if (response.type === 'render' && response.as && renderersRegistry.get(response.as) !== null) {
- renderersRegistry.get(response.as).render(element, response.value, {
- onDestroy: fn => {
- // TODO implement
- },
- done: () => {
- // TODO implement
- },
- });
- } else {
- throw response;
- }
- }
-
- return response;
-};
diff --git a/src/legacy/core_plugins/data/public/expressions/expressions_service.test.tsx b/src/legacy/core_plugins/data/public/expressions/expressions_service.test.tsx
deleted file mode 100644
index 83313e5a2b2fe..0000000000000
--- a/src/legacy/core_plugins/data/public/expressions/expressions_service.test.tsx
+++ /dev/null
@@ -1,276 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import { fromExpression, Ast } from '@kbn/interpreter/common';
-
-import {
- ExpressionsService,
- RenderFunctionsRegistry,
- RenderFunction,
- Interpreter,
- ExpressionsServiceDependencies,
- Result,
- ExpressionsSetup,
-} from './expressions_service';
-import { mount } from 'enzyme';
-import React from 'react';
-
-const waitForInterpreterRun = async () => {
- // Wait for two ticks with empty callback queues
- // This makes sure the runFn promise and actual interpretAst
- // promise have been resolved and processed
- await new Promise(resolve => setTimeout(resolve));
- await new Promise(resolve => setTimeout(resolve));
-};
-
-const RENDERER_ID = 'mockId';
-
-describe('expressions_service', () => {
- let interpretAstMock: jest.Mocked['interpretAst'];
- let interpreterMock: jest.Mocked;
- let renderFunctionMock: jest.Mocked;
- let setupPluginsMock: ExpressionsServiceDependencies;
- const expressionResult: Result = { type: 'render', as: RENDERER_ID, value: {} };
-
- let api: ExpressionsSetup;
- let testExpression: string;
- let testAst: Ast;
-
- beforeEach(() => {
- interpretAstMock = jest.fn((..._) => Promise.resolve(expressionResult));
- interpreterMock = { interpretAst: interpretAstMock };
- renderFunctionMock = ({
- render: jest.fn(),
- } as unknown) as jest.Mocked;
- setupPluginsMock = {
- interpreter: {
- getInterpreter: () => Promise.resolve({ interpreter: interpreterMock }),
- renderersRegistry: ({
- get: (id: string) => (id === RENDERER_ID ? renderFunctionMock : null),
- } as unknown) as RenderFunctionsRegistry,
- },
- };
- api = new ExpressionsService().setup(setupPluginsMock);
- testExpression = 'test | expression';
- testAst = fromExpression(testExpression);
- });
-
- describe('expression_runner', () => {
- it('should return run function', () => {
- expect(typeof api.run).toBe('function');
- });
-
- it('should call the interpreter with parsed expression', async () => {
- await api.run(testExpression, { element: document.createElement('div') });
- expect(interpreterMock.interpretAst).toHaveBeenCalledWith(
- testAst,
- expect.anything(),
- expect.anything()
- );
- });
-
- it('should call the interpreter with given context and getInitialContext functions', async () => {
- const getInitialContext = () => ({});
- const context = {};
-
- await api.run(testExpression, { getInitialContext, context });
- const interpretCall = interpreterMock.interpretAst.mock.calls[0];
-
- expect(interpretCall[1]).toBe(context);
- expect(interpretCall[2].getInitialContext).toBe(getInitialContext);
- });
-
- it('should call the interpreter with passed in ast', async () => {
- await api.run(testAst, { element: document.createElement('div') });
- expect(interpreterMock.interpretAst).toHaveBeenCalledWith(
- testAst,
- expect.anything(),
- expect.anything()
- );
- });
-
- it('should return the result of the interpreter run', async () => {
- const response = await api.run(testAst, {});
- expect(response).toBe(expressionResult);
- });
-
- it('should reject the promise if the response is not renderable but an element is passed', async () => {
- const unexpectedResult = { type: 'datatable', value: {} };
- interpretAstMock.mockReturnValue(Promise.resolve(unexpectedResult));
- expect(
- api.run(testAst, {
- element: document.createElement('div'),
- })
- ).rejects.toBe(unexpectedResult);
- });
-
- it('should reject the promise if the renderer is not known', async () => {
- const unexpectedResult = { type: 'render', as: 'unknown_id' };
- interpretAstMock.mockReturnValue(Promise.resolve(unexpectedResult));
- expect(
- api.run(testAst, {
- element: document.createElement('div'),
- })
- ).rejects.toBe(unexpectedResult);
- });
-
- it('should not reject the promise on unknown renderer if the runner is not rendering', async () => {
- const unexpectedResult = { type: 'render', as: 'unknown_id' };
- interpretAstMock.mockReturnValue(Promise.resolve(unexpectedResult));
- expect(api.run(testAst, {})).resolves.toBe(unexpectedResult);
- });
-
- it('should reject the promise if the response is an error', async () => {
- const errorResult = { type: 'error', error: {} };
- interpretAstMock.mockReturnValue(Promise.resolve(errorResult));
- expect(api.run(testAst, {})).rejects.toBe(errorResult);
- });
-
- it('should reject the promise if there are syntax errors', async () => {
- expect(api.run('|||', {})).rejects.toBeInstanceOf(Error);
- });
-
- it('should call the render function with the result and element', async () => {
- const element = document.createElement('div');
-
- await api.run(testAst, { element });
- expect(renderFunctionMock.render).toHaveBeenCalledWith(
- element,
- expressionResult.value,
- expect.anything()
- );
- expect(interpreterMock.interpretAst).toHaveBeenCalledWith(
- testAst,
- expect.anything(),
- expect.anything()
- );
- });
- });
-
- describe('expression_renderer', () => {
- it('should call interpreter and render function when called through react component', async () => {
- const ExpressionRenderer = api.ExpressionRenderer;
-
- mount(;
+import { Start as IInspector } from '../../../../../plugins/inspector/public';
-export interface Interpreter {
- interpretAst(ast: Ast, context: Context, handlers: Handlers): Promise;
+export interface ExpressionsServiceStartDependencies {
+ inspector: IInspector;
}
-
-type InterpreterGetter = () => Promise<{ interpreter: Interpreter }>;
-
-export interface ExpressionsServiceDependencies {
- interpreter: {
- renderersRegistry: RenderFunctionsRegistry;
- getInterpreter: InterpreterGetter;
- };
-}
-
/**
* Expressions Service
* @internal
*/
export class ExpressionsService {
- public setup({
- interpreter: { renderersRegistry, getInterpreter },
- }: ExpressionsServiceDependencies) {
- const run = createRunFn(
- renderersRegistry,
- getInterpreter().then(({ interpreter }) => interpreter)
- );
+ public setup() {
+ // eslint-disable-next-line
+ const { getInterpreter } = require('../../../interpreter/public/interpreter');
+ getInterpreter()
+ .then(setInterpreter)
+ .catch((e: Error) => {
+ throw new Error('interpreter is not initialized');
+ });
+
+ return {
+ registerType: npSetup.plugins.data.expressions.registerType,
+ registerFunction: npSetup.plugins.data.expressions.registerFunction,
+ registerRenderer: npSetup.plugins.data.expressions.registerRenderer,
+ };
+ }
+
+ public start({ inspector }: ExpressionsServiceStartDependencies) {
+ const ExpressionRenderer = createRenderer(loader);
+ setInspector(inspector);
return {
- /**
- * **experimential** This API is experimential and might be removed in the future
- * without notice
- *
- * Executes the given expression string or ast and renders the result into the
- * given DOM element.
- *
- *
- * @param expressionOrAst
- * @param element
- */
- run,
- /**
- * **experimential** This API is experimential and might be removed in the future
- * without notice
- *
- * Component which executes and renders the given expression in a div element.
- * The expression is re-executed on updating the props.
- *
- * This is a React bridge of the `run` method
- * @param props
- */
- ExpressionRenderer: createRenderer(run),
+ execute,
+ render,
+ loader,
+
+ ExpressionRenderer,
};
}
@@ -128,3 +72,4 @@ export class ExpressionsService {
/** @public */
export type ExpressionsSetup = ReturnType;
+export type ExpressionsStart = ReturnType;
diff --git a/src/legacy/core_plugins/data/public/expressions/index.ts b/src/legacy/core_plugins/data/public/expressions/index.ts
index fceefce44f81f..ae51804a85fb5 100644
--- a/src/legacy/core_plugins/data/public/expressions/index.ts
+++ b/src/legacy/core_plugins/data/public/expressions/index.ts
@@ -17,6 +17,5 @@
* under the License.
*/
-export { ExpressionsService, ExpressionsSetup } from './expressions_service';
+export { ExpressionsService, ExpressionsSetup, ExpressionsStart } from './expressions_service';
export { ExpressionRenderer, ExpressionRendererProps } from './expression_renderer';
-export { ExpressionRunner } from './expression_runner';
diff --git a/src/legacy/core_plugins/data/public/expressions/lib/_types.ts b/src/legacy/core_plugins/data/public/expressions/lib/_types.ts
new file mode 100644
index 0000000000000..b3185fda2c178
--- /dev/null
+++ b/src/legacy/core_plugins/data/public/expressions/lib/_types.ts
@@ -0,0 +1,86 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { TimeRange } from 'src/plugins/data/public';
+import { Filter } from '@kbn/es-query';
+import { Adapters } from '../../../../../ui/public/inspector';
+import { Query } from '../../query';
+import { ExpressionAST } from '../../../../../../plugins/data/common/expressions/types';
+
+export { ExpressionAST, TimeRange, Adapters, Filter, Query };
+
+export type RenderId = number;
+export type Data = any;
+export type event = any;
+export type Context = object;
+
+export interface SearchContext {
+ type: 'kibana_context';
+ filters?: Filter[];
+ query?: Query;
+ timeRange?: TimeRange;
+}
+
+export type IGetInitialContext = () => SearchContext | Context;
+
+export interface IExpressionLoaderParams {
+ searchContext?: SearchContext;
+ context?: Context;
+ variables?: Record;
+ disableCaching?: boolean;
+ customFunctions?: [];
+ customRenderers?: [];
+}
+
+export interface IInterpreterHandlers {
+ getInitialContext: IGetInitialContext;
+ inspectorAdapters?: Adapters;
+}
+
+export interface IInterpreterResult {
+ type: string;
+ as?: string;
+ value?: unknown;
+ error?: unknown;
+}
+
+export interface IInterpreterRenderHandlers {
+ done: () => void;
+ onDestroy: (fn: () => void) => void;
+ reload: () => void;
+ update: (params: any) => void;
+ event: (event: event) => void;
+}
+
+export interface IInterpreterRenderFunction {
+ name: string;
+ displayName: string;
+ help: string;
+ validate: () => void;
+ reuseDomNode: boolean;
+ render: (domNode: Element, data: unknown, handlers: IInterpreterRenderHandlers) => void;
+}
+
+export interface IInterpreter {
+ interpretAst(
+ ast: ExpressionAST,
+ context: Context,
+ handlers: IInterpreterHandlers
+ ): Promise;
+}
diff --git a/src/legacy/core_plugins/data/public/expressions/lib/execute.test.ts b/src/legacy/core_plugins/data/public/expressions/lib/execute.test.ts
new file mode 100644
index 0000000000000..978d0c834ca8e
--- /dev/null
+++ b/src/legacy/core_plugins/data/public/expressions/lib/execute.test.ts
@@ -0,0 +1,94 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { execute, ExpressionDataHandler } from './execute';
+import { fromExpression } from '@kbn/interpreter/common';
+import { ExpressionAST } from '../../../../../../plugins/data/common/expressions/types';
+
+jest.mock('../services', () => ({
+ getInterpreter: () => {
+ return {
+ interpretAst: async (expression: ExpressionAST) => {
+ return {};
+ },
+ };
+ },
+}));
+
+describe('execute helper function', () => {
+ it('returns ExpressionDataHandler instance', () => {
+ const response = execute('');
+ expect(response).toBeInstanceOf(ExpressionDataHandler);
+ });
+});
+
+describe('ExpressionDataHandler', () => {
+ const expressionString = '';
+
+ describe('constructor', () => {
+ it('accepts expression string', () => {
+ const expressionDataHandler = new ExpressionDataHandler(expressionString, {});
+ expect(expressionDataHandler.getExpression()).toEqual(expressionString);
+ });
+
+ it('accepts expression AST', () => {
+ const expressionAST = fromExpression(expressionString) as ExpressionAST;
+ const expressionDataHandler = new ExpressionDataHandler(expressionAST, {});
+ expect(expressionDataHandler.getExpression()).toEqual(expressionString);
+ expect(expressionDataHandler.getAst()).toEqual(expressionAST);
+ });
+
+ it('allows passing in context', () => {
+ const expressionDataHandler = new ExpressionDataHandler(expressionString, {
+ context: { test: 'hello' },
+ });
+ expect(expressionDataHandler.getExpression()).toEqual(expressionString);
+ });
+
+ it('allows passing in search context', () => {
+ const expressionDataHandler = new ExpressionDataHandler(expressionString, {
+ searchContext: { type: 'kibana_context', filters: [] },
+ });
+ expect(expressionDataHandler.getExpression()).toEqual(expressionString);
+ });
+ });
+
+ describe('getData()', () => {
+ it('returns a promise', () => {
+ const expressionDataHandler = new ExpressionDataHandler(expressionString, {});
+ expect(expressionDataHandler.getData()).toBeInstanceOf(Promise);
+ });
+
+ it('promise resolves with data', async () => {
+ const expressionDataHandler = new ExpressionDataHandler(expressionString, {});
+ expect(await expressionDataHandler.getData()).toEqual({});
+ });
+ });
+
+ it('cancel() aborts request', () => {
+ const expressionDataHandler = new ExpressionDataHandler(expressionString, {});
+ expressionDataHandler.cancel();
+ });
+
+ it('inspect() returns correct inspector adapters', () => {
+ const expressionDataHandler = new ExpressionDataHandler(expressionString, {});
+ expect(expressionDataHandler.inspect()).toHaveProperty('requests');
+ expect(expressionDataHandler.inspect()).toHaveProperty('data');
+ });
+});
diff --git a/src/legacy/core_plugins/data/public/expressions/lib/execute.ts b/src/legacy/core_plugins/data/public/expressions/lib/execute.ts
new file mode 100644
index 0000000000000..4cc1cead3e03c
--- /dev/null
+++ b/src/legacy/core_plugins/data/public/expressions/lib/execute.ts
@@ -0,0 +1,115 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { fromExpression } from '@kbn/interpreter/target/common';
+import { DataAdapter, RequestAdapter, Adapters } from '../../../../../../plugins/inspector/public';
+import { getInterpreter } from '../services';
+import { ExpressionAST, IExpressionLoaderParams, IInterpreterResult } from './_types';
+
+/**
+ * The search context describes a specific context (filters, time range and query)
+ * that will be applied to the expression for execution. Not every expression will
+ * be effected by that. You have to use special functions
+ * that will pick up this search context and forward it to following functions that
+ * understand it.
+ */
+
+export class ExpressionDataHandler {
+ private abortController: AbortController;
+ private expression: string;
+ private ast: ExpressionAST;
+
+ private inspectorAdapters: Adapters;
+ private promise: Promise;
+
+ constructor(expression: string | ExpressionAST, params: IExpressionLoaderParams) {
+ if (typeof expression === 'string') {
+ this.expression = expression;
+ this.ast = fromExpression(expression) as ExpressionAST;
+ } else {
+ this.ast = expression;
+ this.expression = '';
+ }
+
+ this.abortController = new AbortController();
+ this.inspectorAdapters = this.getActiveInspectorAdapters();
+
+ const getInitialContext = () => ({
+ type: 'kibana_context',
+ ...params.searchContext,
+ });
+
+ const defaultContext = { type: 'null' };
+
+ const interpreter = getInterpreter();
+ this.promise = interpreter.interpretAst(this.ast, params.context || defaultContext, {
+ getInitialContext,
+ inspectorAdapters: this.inspectorAdapters,
+ });
+ }
+
+ cancel = () => {
+ this.abortController.abort();
+ };
+
+ getData = async () => {
+ return await this.promise;
+ };
+
+ getExpression = () => {
+ return this.expression;
+ };
+
+ getAst = () => {
+ return this.ast;
+ };
+
+ inspect = () => {
+ return this.inspectorAdapters;
+ };
+
+ /**
+ * Returns an object of all inspectors for this vis object.
+ * This must only be called after this.type has properly be initialized,
+ * since we need to read out data from the the vis type to check which
+ * inspectors are available.
+ */
+ private getActiveInspectorAdapters = (): Adapters => {
+ const adapters: Adapters = {};
+
+ // Add the requests inspector adapters if the vis type explicitly requested it via
+ // inspectorAdapters.requests: true in its definition or if it's using the courier
+ // request handler, since that will automatically log its requests.
+ adapters.requests = new RequestAdapter();
+
+ // Add the data inspector adapter if the vis type requested it or if the
+ // vis is using courier, since we know that courier supports logging
+ // its data.
+ adapters.data = new DataAdapter();
+
+ return adapters;
+ };
+}
+
+export function execute(
+ expression: string | ExpressionAST,
+ params: IExpressionLoaderParams = {}
+): ExpressionDataHandler {
+ return new ExpressionDataHandler(expression, params);
+}
diff --git a/src/legacy/core_plugins/data/public/expressions/lib/loader.test.ts b/src/legacy/core_plugins/data/public/expressions/lib/loader.test.ts
new file mode 100644
index 0000000000000..ee9efd9d3373b
--- /dev/null
+++ b/src/legacy/core_plugins/data/public/expressions/lib/loader.test.ts
@@ -0,0 +1,118 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { first } from 'rxjs/operators';
+import { loader, ExpressionLoader } from './loader';
+import { fromExpression } from '@kbn/interpreter/common';
+import { IInterpreterRenderHandlers } from './_types';
+import { Observable } from 'rxjs';
+import { ExpressionAST } from '../../../../../../plugins/data/common/expressions/types';
+
+const element: HTMLElement = null as any;
+
+jest.mock('../services', () => ({
+ getInterpreter: () => {
+ return {
+ interpretAst: async (expression: ExpressionAST) => {
+ return { type: 'render', as: 'test' };
+ },
+ };
+ },
+}));
+
+jest.mock('../../../../interpreter/public/registries', () => {
+ const _registry: Record = {};
+ _registry.test = {
+ render: (el: HTMLElement, value: any, handlers: IInterpreterRenderHandlers) => {
+ handlers.done();
+ },
+ };
+ return {
+ renderersRegistry: {
+ get: (id: string) => {
+ return _registry[id];
+ },
+ },
+ };
+});
+
+describe('execute helper function', () => {
+ it('returns ExpressionDataHandler instance', () => {
+ const response = loader(element, '', {});
+ expect(response).toBeInstanceOf(ExpressionLoader);
+ });
+});
+
+describe('ExpressionDataHandler', () => {
+ const expressionString = '';
+
+ describe('constructor', () => {
+ it('accepts expression string', () => {
+ const expressionDataHandler = new ExpressionLoader(element, expressionString, {});
+ expect(expressionDataHandler.getExpression()).toEqual(expressionString);
+ });
+
+ it('accepts expression AST', () => {
+ const expressionAST = fromExpression(expressionString) as ExpressionAST;
+ const expressionDataHandler = new ExpressionLoader(element, expressionAST, {});
+ expect(expressionDataHandler.getExpression()).toEqual(expressionString);
+ expect(expressionDataHandler.getAst()).toEqual(expressionAST);
+ });
+
+ it('creates observables', () => {
+ const expressionLoader = new ExpressionLoader(element, expressionString, {});
+ expect(expressionLoader.events$).toBeInstanceOf(Observable);
+ expect(expressionLoader.render$).toBeInstanceOf(Observable);
+ expect(expressionLoader.update$).toBeInstanceOf(Observable);
+ expect(expressionLoader.data$).toBeInstanceOf(Observable);
+ });
+ });
+
+ it('emits on $data when data is available', async () => {
+ const expressionLoader = new ExpressionLoader(element, expressionString, {});
+ const response = await expressionLoader.data$.pipe(first()).toPromise();
+ expect(response).toEqual({ type: 'render', as: 'test' });
+ });
+
+ it('emits on render$ when rendering is done', async () => {
+ const expressionLoader = new ExpressionLoader(element, expressionString, {});
+ const response = await expressionLoader.render$.pipe(first()).toPromise();
+ expect(response).toBe(1);
+ });
+
+ it('allows updating configuration', async () => {
+ const expressionLoader = new ExpressionLoader(element, expressionString, {});
+ let response = await expressionLoader.render$.pipe(first()).toPromise();
+ expect(response).toBe(1);
+ expressionLoader.update('', {});
+ response = await expressionLoader.render$.pipe(first()).toPromise();
+ expect(response).toBe(2);
+ });
+
+ it('cancel() aborts request', () => {
+ const expressionDataHandler = new ExpressionLoader(element, expressionString, {});
+ expressionDataHandler.cancel();
+ });
+
+ it('inspect() returns correct inspector adapters', () => {
+ const expressionDataHandler = new ExpressionLoader(element, expressionString, {});
+ expect(expressionDataHandler.inspect()).toHaveProperty('data');
+ expect(expressionDataHandler.inspect()).toHaveProperty('requests');
+ });
+});
diff --git a/src/legacy/core_plugins/data/public/expressions/lib/loader.ts b/src/legacy/core_plugins/data/public/expressions/lib/loader.ts
new file mode 100644
index 0000000000000..e3353ab676be6
--- /dev/null
+++ b/src/legacy/core_plugins/data/public/expressions/lib/loader.ts
@@ -0,0 +1,130 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { Observable, Subject } from 'rxjs';
+import { first, share } from 'rxjs/operators';
+import { Adapters, InspectorSession } from '../../../../../../plugins/inspector/public';
+import { execute, ExpressionDataHandler } from './execute';
+import { ExpressionRenderHandler } from './render';
+import { RenderId, Data, IExpressionLoaderParams, ExpressionAST } from './_types';
+import { getInspector } from '../services';
+
+export class ExpressionLoader {
+ data$: Observable;
+ update$: Observable;
+ render$: Observable;
+ events$: Observable;
+
+ private dataHandler: ExpressionDataHandler;
+ private renderHandler: ExpressionRenderHandler;
+ private dataSubject: Subject;
+ private data: Data;
+
+ constructor(
+ element: HTMLElement,
+ expression: string | ExpressionAST,
+ params: IExpressionLoaderParams
+ ) {
+ this.dataSubject = new Subject();
+ this.data$ = this.dataSubject.asObservable().pipe(share());
+
+ this.renderHandler = new ExpressionRenderHandler(element);
+ this.render$ = this.renderHandler.render$;
+ this.update$ = this.renderHandler.update$;
+ this.events$ = this.renderHandler.events$;
+
+ this.update$.subscribe(({ newExpression, newParams }) => {
+ this.update(newExpression, newParams);
+ });
+
+ this.data$.subscribe(data => {
+ this.render(data);
+ });
+
+ this.execute(expression, params);
+ // @ts-ignore
+ this.dataHandler = this.dataHandler;
+ }
+
+ destroy() {}
+
+ cancel() {
+ this.dataHandler.cancel();
+ }
+
+ getExpression(): string {
+ return this.dataHandler.getExpression();
+ }
+
+ getAst(): ExpressionAST {
+ return this.dataHandler.getAst();
+ }
+
+ getElement(): HTMLElement {
+ return this.renderHandler.getElement();
+ }
+
+ openInspector(title: string): InspectorSession {
+ return getInspector().open(this.inspect(), {
+ title,
+ });
+ }
+
+ inspect(): Adapters {
+ return this.dataHandler.inspect();
+ }
+
+ update(expression: string | ExpressionAST, params: IExpressionLoaderParams): Promise {
+ const promise = this.render$.pipe(first()).toPromise();
+
+ if (expression !== null) {
+ this.execute(expression, params);
+ } else {
+ this.render(this.data);
+ }
+ return promise;
+ }
+
+ private execute = async (
+ expression: string | ExpressionAST,
+ params: IExpressionLoaderParams
+ ): Promise => {
+ if (this.dataHandler) {
+ this.dataHandler.cancel();
+ }
+ this.dataHandler = execute(expression, params);
+ const data = await this.dataHandler.getData();
+ this.dataSubject.next(data);
+ return data;
+ };
+
+ private async render(data: Data): Promise {
+ return this.renderHandler.render(data);
+ }
+}
+
+export type IExpressionLoader = (
+ element: HTMLElement,
+ expression: string | ExpressionAST,
+ params: IExpressionLoaderParams
+) => ExpressionLoader;
+
+export const loader: IExpressionLoader = (element, expression, params) => {
+ return new ExpressionLoader(element, expression, params);
+};
diff --git a/src/legacy/core_plugins/data/public/expressions/lib/render.test.ts b/src/legacy/core_plugins/data/public/expressions/lib/render.test.ts
new file mode 100644
index 0000000000000..1bb2f8d6554b2
--- /dev/null
+++ b/src/legacy/core_plugins/data/public/expressions/lib/render.test.ts
@@ -0,0 +1,88 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { render, ExpressionRenderHandler } from './render';
+import { Observable } from 'rxjs';
+import { IInterpreterRenderHandlers } from './_types';
+
+const element: HTMLElement = null as any;
+
+jest.mock('../../../../interpreter/public/registries', () => {
+ const _registry: Record = {};
+ _registry.test = {
+ render: (el: HTMLElement, value: any, handlers: IInterpreterRenderHandlers) => {
+ handlers.done();
+ },
+ };
+ return {
+ renderersRegistry: {
+ get: (id: string) => {
+ return _registry[id];
+ },
+ },
+ };
+});
+
+describe('render helper function', () => {
+ it('returns ExpressionRenderHandler instance', () => {
+ const response = render(element, {});
+ expect(response).toBeInstanceOf(ExpressionRenderHandler);
+ });
+});
+
+describe('ExpressionRenderHandler', () => {
+ const data = { type: 'render', as: 'test' };
+
+ it('constructor creates observers', () => {
+ const expressionRenderHandler = new ExpressionRenderHandler(element);
+ expect(expressionRenderHandler.events$).toBeInstanceOf(Observable);
+ expect(expressionRenderHandler.render$).toBeInstanceOf(Observable);
+ expect(expressionRenderHandler.update$).toBeInstanceOf(Observable);
+ });
+
+ it('getElement returns the element', () => {
+ const expressionRenderHandler = new ExpressionRenderHandler(element);
+ expect(expressionRenderHandler.getElement()).toBe(element);
+ });
+
+ describe('render()', () => {
+ it('throws if invalid data is provided', async () => {
+ const expressionRenderHandler = new ExpressionRenderHandler(element);
+ await expect(expressionRenderHandler.render({})).rejects.toThrow();
+ });
+
+ it('throws if renderer does not exist', async () => {
+ const expressionRenderHandler = new ExpressionRenderHandler(element);
+ await expect(
+ expressionRenderHandler.render({ type: 'render', as: 'something' })
+ ).rejects.toThrow();
+ });
+
+ it('returns a promise', () => {
+ const expressionRenderHandler = new ExpressionRenderHandler(element);
+ expect(expressionRenderHandler.render(data)).toBeInstanceOf(Promise);
+ });
+
+ it('resolves a promise once rendering is complete', async () => {
+ const expressionRenderHandler = new ExpressionRenderHandler(element);
+ const response = await expressionRenderHandler.render(data);
+ expect(response).toBe(1);
+ });
+ });
+});
diff --git a/src/legacy/core_plugins/data/public/expressions/lib/render.ts b/src/legacy/core_plugins/data/public/expressions/lib/render.ts
new file mode 100644
index 0000000000000..250fa14c9de1d
--- /dev/null
+++ b/src/legacy/core_plugins/data/public/expressions/lib/render.ts
@@ -0,0 +1,99 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { Observable } from 'rxjs';
+import * as Rx from 'rxjs';
+import { share, first } from 'rxjs/operators';
+import { renderersRegistry } from '../../../../interpreter/public/registries';
+import { event, RenderId, Data, IInterpreterRenderHandlers } from './_types';
+
+export class ExpressionRenderHandler {
+ render$: Observable;
+ update$: Observable;
+ events$: Observable;
+
+ private element: HTMLElement;
+ private destroyFn?: any;
+ private renderCount: number = 0;
+ private handlers: IInterpreterRenderHandlers;
+
+ constructor(element: HTMLElement) {
+ this.element = element;
+
+ const eventsSubject = new Rx.Subject();
+ this.events$ = eventsSubject.asObservable().pipe(share());
+
+ const renderSubject = new Rx.Subject();
+ this.render$ = renderSubject.asObservable().pipe(share());
+
+ const updateSubject = new Rx.Subject();
+ this.update$ = updateSubject.asObservable().pipe(share());
+
+ this.handlers = {
+ onDestroy: (fn: any) => {
+ this.destroyFn = fn;
+ },
+ done: () => {
+ this.renderCount++;
+ renderSubject.next(this.renderCount);
+ },
+ reload: () => {
+ updateSubject.next(null);
+ },
+ update: params => {
+ updateSubject.next(params);
+ },
+ event: data => {
+ eventsSubject.next(data);
+ },
+ };
+ }
+
+ render = async (data: Data) => {
+ if (data.type !== 'render' || !data.as) {
+ throw new Error('invalid data provided to expression renderer');
+ }
+
+ if (!renderersRegistry.get(data.as)) {
+ throw new Error(`invalid renderer id '${data.as}'`);
+ }
+
+ const promise = this.render$.pipe(first()).toPromise();
+
+ renderersRegistry.get(data.as).render(this.element, data.value, this.handlers);
+
+ return promise;
+ };
+
+ destroy = () => {
+ if (this.destroyFn) {
+ this.destroyFn();
+ }
+ };
+
+ getElement = () => {
+ return this.element;
+ };
+}
+
+export function render(element: HTMLElement, data: Data): ExpressionRenderHandler {
+ const handler = new ExpressionRenderHandler(element);
+ handler.render(data);
+ return handler;
+}
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/legend.js b/src/legacy/core_plugins/data/public/expressions/services.ts
similarity index 56%
rename from src/legacy/core_plugins/metrics/public/visualizations/components/legend.js
rename to src/legacy/core_plugins/data/public/expressions/services.ts
index 38e3bd3d05921..73f627f8dc886 100644
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/legend.js
+++ b/src/legacy/core_plugins/data/public/expressions/services.ts
@@ -17,25 +17,25 @@
* under the License.
*/
-import PropTypes from 'prop-types';
-import React from 'react';
-import { VerticalLegend } from './vertical_legend';
-import { HorizontalLegend } from './horizontal_legend';
+import { IInterpreter } from './lib/_types';
+import { Start as IInspector } from '../../../../../plugins/inspector/public';
-export function Legend(props) {
- if (props.legendPosition === 'bottom') {
- return {
};
public render() {
+ if (!this.props.uiSettings) {
+ return null;
+ }
const classes = classNames('globalFilterBar', this.props.className);
return (
diff --git a/src/legacy/core_plugins/data/public/index.ts b/src/legacy/core_plugins/data/public/index.ts
index 4e1e83d71afe8..8bf13a24f1775 100644
--- a/src/legacy/core_plugins/data/public/index.ts
+++ b/src/legacy/core_plugins/data/public/index.ts
@@ -18,7 +18,7 @@
*/
// /// Define plugin function
-import { DataPlugin as Plugin, DataSetup } from './plugin';
+import { DataPlugin as Plugin, DataSetup, DataStart } from './plugin';
export function plugin() {
return new Plugin();
@@ -28,7 +28,9 @@ export function plugin() {
/** @public types */
export type DataSetup = DataSetup;
-export { ExpressionRenderer, ExpressionRendererProps, ExpressionRunner } from './expressions';
+export type DataStart = DataStart;
+
+export { ExpressionRenderer, ExpressionRendererProps } from './expressions';
export { FilterBar, ApplyFiltersPopover } from './filter';
export {
Field,
diff --git a/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_pattern.test.js b/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_pattern.test.ts
similarity index 61%
rename from src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_pattern.test.js
rename to src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_pattern.test.ts
index b7fcb79da3269..d89a4a35e6e9f 100644
--- a/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_pattern.test.js
+++ b/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_pattern.test.ts
@@ -17,18 +17,23 @@
* under the License.
*/
-import _ from 'lodash';
-import mockLogstashFields from '../../../../../../fixtures/logstash_fields';
-import { stubbedSavedObjectIndexPattern } from '../../../../../../fixtures/stubbed_saved_object_index_pattern';
+import { defaults, pluck, last, get } from 'lodash';
import { IndexedArray } from 'ui/indexed_array';
+import { IndexPattern } from './index_pattern';
+
+// @ts-ignore
import { DuplicateField } from 'ui/errors';
+// @ts-ignore
+import mockLogStashFields from '../../../../../../fixtures/logstash_fields';
+// @ts-ignore
-import { IndexPattern } from './index_pattern';
+import { stubbedSavedObjectIndexPattern } from '../../../../../../fixtures/stubbed_saved_object_index_pattern';
+import { Field } from '../index_patterns_service';
jest.mock('ui/registry/field_formats', () => ({
fieldFormats: {
getDefaultInstance: jest.fn(),
- }
+ },
}));
jest.mock('ui/utils/mapping_setup', () => ({
@@ -36,16 +41,16 @@ jest.mock('ui/utils/mapping_setup', () => ({
id: true,
title: true,
fieldFormatMap: {
- _deserialize: jest.fn().mockImplementation(() => ([])),
+ _deserialize: jest.fn().mockImplementation(() => []),
},
- }))
+ })),
}));
jest.mock('ui/notify', () => ({
toastNotifications: {
addDanger: jest.fn(),
addError: jest.fn(),
- }
+ },
}));
jest.mock('ui/saved_objects', () => {
@@ -54,32 +59,32 @@ jest.mock('ui/saved_objects', () => {
};
});
-let mockFieldsFetcherResponse = [];
+let mockFieldsFetcherResponse: any[] = [];
+
jest.mock('./_fields_fetcher', () => ({
createFieldsFetcher: jest.fn().mockImplementation(() => ({
fetch: jest.fn().mockImplementation(() => {
return new Promise(resolve => resolve(mockFieldsFetcherResponse));
}),
every: jest.fn(),
- }))
+ })),
}));
-let object;
+let object: any = {};
+
const savedObjectsClient = {
create: jest.fn(),
get: jest.fn().mockImplementation(() => object),
update: jest.fn().mockImplementation(async (type, id, body, { version }) => {
if (object._version !== version) {
- throw {
+ throw new Object({
res: {
- status: 409
- }
- };
+ status: 409,
+ },
+ });
}
-
object.attributes.title = body.title;
object._version += 'a';
-
return {
id: object._id,
_version: object._version,
@@ -96,35 +101,44 @@ const config = {
};
const apiClient = {
+ _getUrl: jest.fn(),
getFieldsForTimePattern: jest.fn(),
getFieldsForWildcard: jest.fn(),
};
// helper function to create index patterns
-function create(id, payload) {
- const indexPattern = new IndexPattern(id, cfg => config.get(cfg), savedObjectsClient, apiClient, patternCache);
+function create(id: string, payload?: any): Promise {
+ const indexPattern = new IndexPattern(
+ id,
+ (cfg: any) => config.get(cfg),
+ savedObjectsClient as any,
+ apiClient,
+ patternCache
+ );
setDocsourcePayload(id, payload);
return indexPattern.init();
}
-function setDocsourcePayload(id, providedPayload) {
- object = _.defaults(providedPayload || {}, stubbedSavedObjectIndexPattern(id));
+function setDocsourcePayload(id: string | null, providedPayload: any) {
+ object = defaults(providedPayload || {}, stubbedSavedObjectIndexPattern(id));
}
describe('IndexPattern', () => {
const indexPatternId = 'test-pattern';
- let indexPattern;
+
+ let indexPattern: IndexPattern;
+
// create an indexPattern instance for each test
- beforeEach(function () {
- return create(indexPatternId).then(function (pattern) {
+ beforeEach(() => {
+ return create(indexPatternId).then((pattern: IndexPattern) => {
indexPattern = pattern;
});
});
- describe('api', function () {
- it('should have expected properties', function () {
+ describe('api', () => {
+ test('should have expected properties', () => {
expect(indexPattern).toHaveProperty('refreshFields');
expect(indexPattern).toHaveProperty('popularizeField');
expect(indexPattern).toHaveProperty('getScriptedFields');
@@ -140,16 +154,16 @@ describe('IndexPattern', () => {
});
});
- describe('init', function () {
- it('should append the found fields', function () {
+ describe('init', () => {
+ test('should append the found fields', () => {
expect(savedObjectsClient.get).toHaveBeenCalled();
- expect(indexPattern.fields).toHaveLength(mockLogstashFields().length);
+ expect(indexPattern.fields).toHaveLength(mockLogStashFields().length);
expect(indexPattern.fields).toBeInstanceOf(IndexedArray);
});
});
- describe('fields', function () {
- it('should have expected properties on fields', function () {
+ describe('fields', () => {
+ test('should have expected properties on fields', function() {
expect(indexPattern.fields[0]).toHaveProperty('displayName');
expect(indexPattern.fields[0]).toHaveProperty('filterable');
expect(indexPattern.fields[0]).toHaveProperty('format');
@@ -158,42 +172,45 @@ describe('IndexPattern', () => {
});
});
- describe('getScriptedFields', function () {
- it('should return all scripted fields', function () {
- const scriptedNames = _(mockLogstashFields()).where({ scripted: true }).pluck('name').value();
- const respNames = _.pluck(indexPattern.getScriptedFields(), 'name');
+ describe('getScriptedFields', () => {
+ test('should return all scripted fields', () => {
+ const scriptedNames = mockLogStashFields()
+ .filter((item: Field) => item.scripted === true)
+ .map((item: Field) => item.name);
+ const respNames = pluck(indexPattern.getScriptedFields(), 'name');
+
expect(respNames).toEqual(scriptedNames);
});
});
- describe('getNonScriptedFields', function () {
- it('should return all non-scripted fields', function () {
- const notScriptedNames = _(mockLogstashFields()).where({ scripted: false }).pluck('name').value();
- const respNames = _.pluck(indexPattern.getNonScriptedFields(), 'name');
+ describe('getNonScriptedFields', () => {
+ test('should return all non-scripted fields', () => {
+ const notScriptedNames = mockLogStashFields()
+ .filter((item: Field) => item.scripted === false)
+ .map((item: Field) => item.name);
+ const respNames = pluck(indexPattern.getNonScriptedFields(), 'name');
+
expect(respNames).toEqual(notScriptedNames);
});
-
});
- describe('refresh fields', function () {
- it('should fetch fields from the fieldsFetcher', async function () {
+ describe('refresh fields', () => {
+ test('should fetch fields from the fieldsFetcher', async () => {
expect(indexPattern.fields.length).toBeGreaterThan(2);
- mockFieldsFetcherResponse = [
- { name: 'foo' },
- { name: 'bar' }
- ];
+ mockFieldsFetcherResponse = [{ name: 'foo' }, { name: 'bar' }];
await indexPattern.refreshFields();
mockFieldsFetcherResponse = [];
const newFields = indexPattern.getNonScriptedFields();
+
expect(newFields).toHaveLength(2);
expect(newFields.map(f => f.name)).toEqual(['foo', 'bar']);
});
- it('should preserve the scripted fields', async function () {
+ test('should preserve the scripted fields', async () => {
// add spy to indexPattern.getScriptedFields
// sinon.spy(indexPattern, 'getScriptedFields');
@@ -202,13 +219,16 @@ describe('IndexPattern', () => {
// called to append scripted fields to the response from mapper.getFieldsForIndexPattern
// sinon.assert.calledOnce(indexPattern.getScriptedFields);
- expect(indexPattern.getScriptedFields().map(f => f.name))
- .toEqual(mockLogstashFields().filter(f => f.scripted).map(f => f.name));
+ expect(indexPattern.getScriptedFields().map(f => f.name)).toEqual(
+ mockLogStashFields()
+ .filter((f: Field) => f.scripted)
+ .map((f: Field) => f.name)
+ );
});
});
- describe('add and remove scripted fields', function () {
- it('should append the scripted field', function () {
+ describe('add and remove scripted fields', () => {
+ test('should append the scripted field', async () => {
// keep a copy of the current scripted field count
// const saveSpy = sinon.spy(indexPattern, 'save');
const oldCount = indexPattern.getScriptedFields().length;
@@ -217,107 +237,128 @@ describe('IndexPattern', () => {
const scriptedField = {
name: 'new scripted field',
script: 'false',
- type: 'boolean'
+ type: 'boolean',
};
- indexPattern.addScriptedField(scriptedField.name, scriptedField.script, scriptedField.type);
+
+ await indexPattern.addScriptedField(
+ scriptedField.name,
+ scriptedField.script,
+ scriptedField.type,
+ 'lang'
+ );
+
const scriptedFields = indexPattern.getScriptedFields();
// expect(saveSpy.callCount).to.equal(1);
expect(scriptedFields).toHaveLength(oldCount + 1);
expect(indexPattern.fields.byName[scriptedField.name].name).toEqual(scriptedField.name);
});
- it('should remove scripted field, by name', function () {
+ test('should remove scripted field, by name', async () => {
// const saveSpy = sinon.spy(indexPattern, 'save');
const scriptedFields = indexPattern.getScriptedFields();
const oldCount = scriptedFields.length;
- const scriptedField = _.last(scriptedFields);
+ const scriptedField = last(scriptedFields);
- indexPattern.removeScriptedField(scriptedField.name);
+ await indexPattern.removeScriptedField(scriptedField.name);
// expect(saveSpy.callCount).to.equal(1);
expect(indexPattern.getScriptedFields().length).toEqual(oldCount - 1);
expect(indexPattern.fields.byName[scriptedField.name]).toEqual(undefined);
});
- it('should not allow duplicate names', async () => {
+ test('should not allow duplicate names', async () => {
const scriptedFields = indexPattern.getScriptedFields();
- const scriptedField = _.last(scriptedFields);
+ const scriptedField = last(scriptedFields);
expect.assertions(1);
try {
- await indexPattern.addScriptedField(scriptedField.name, '\'new script\'', 'string');
+ await indexPattern.addScriptedField(scriptedField.name, "'new script'", 'string', 'lang');
} catch (e) {
expect(e).toBeInstanceOf(DuplicateField);
}
});
});
- describe('popularizeField', function () {
- it('should increment the popularity count by default', function () {
+ describe('popularizeField', () => {
+ test('should increment the popularity count by default', () => {
// const saveSpy = sinon.stub(indexPattern, 'save');
- indexPattern.fields.forEach(function (field) {
- const oldCount = field.count;
+ indexPattern.fields.forEach(async field => {
+ const oldCount = field.count || 0;
- indexPattern.popularizeField(field.name);
+ await indexPattern.popularizeField(field.name);
// expect(saveSpy.callCount).to.equal(i + 1);
expect(field.count).toEqual(oldCount + 1);
});
});
- it('should increment the popularity count', function () {
+ test('should increment the popularity count', () => {
// const saveSpy = sinon.stub(indexPattern, 'save');
- indexPattern.fields.forEach(function (field) {
- const oldCount = field.count;
+ indexPattern.fields.forEach(async field => {
+ const oldCount = field.count || 0;
const incrementAmount = 4;
- indexPattern.popularizeField(field.name, incrementAmount);
+ await indexPattern.popularizeField(field.name, incrementAmount);
// expect(saveSpy.callCount).to.equal(i + 1);
expect(field.count).toEqual(oldCount + incrementAmount);
});
});
- it('should decrement the popularity count', function () {
- indexPattern.fields.forEach(function (field) {
- const oldCount = field.count;
+ test('should decrement the popularity count', () => {
+ indexPattern.fields.forEach(async field => {
+ const oldCount = field.count || 0;
const incrementAmount = 4;
const decrementAmount = -2;
- indexPattern.popularizeField(field.name, incrementAmount);
- indexPattern.popularizeField(field.name, decrementAmount);
+ await indexPattern.popularizeField(field.name, incrementAmount);
+ await indexPattern.popularizeField(field.name, decrementAmount);
expect(field.count).toEqual(oldCount + incrementAmount + decrementAmount);
});
});
- it('should not go below 0', function () {
- indexPattern.fields.forEach(function (field) {
+ test('should not go below 0', () => {
+ indexPattern.fields.forEach(async field => {
const decrementAmount = -Number.MAX_VALUE;
- indexPattern.popularizeField(field.name, decrementAmount);
+
+ await indexPattern.popularizeField(field.name, decrementAmount);
+
expect(field.count).toEqual(0);
});
});
});
- it('should handle version conflicts', async () => {
+ test('should handle version conflicts', async () => {
setDocsourcePayload(null, {
- _version: 'foo',
_id: 'foo',
+ _version: 'foo',
attributes: {
- title: 'something'
- }
+ title: 'something',
+ },
});
// Create a normal index pattern
- const pattern = new IndexPattern('foo', cfg => config.get(cfg), savedObjectsClient, apiClient, patternCache);
+ const pattern = new IndexPattern(
+ 'foo',
+ (cfg: any) => config.get(cfg),
+ savedObjectsClient as any,
+ apiClient,
+ patternCache
+ );
await pattern.init();
- expect(pattern.version).toBe('fooa');
+ expect(get(pattern, 'version')).toBe('fooa');
// Create the same one - we're going to handle concurrency
- const samePattern = new IndexPattern('foo', cfg => config.get(cfg), savedObjectsClient, apiClient, patternCache);
+ const samePattern = new IndexPattern(
+ 'foo',
+ (cfg: any) => config.get(cfg),
+ savedObjectsClient as any,
+ apiClient,
+ patternCache
+ );
await samePattern.init();
- expect(samePattern.version).toBe('fooaa');
+ expect(get(samePattern, 'version')).toBe('fooaa');
// This will conflict because samePattern did a save (from refreshFields)
// but the resave should work fine
diff --git a/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns.test.js b/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns.test.ts
similarity index 68%
rename from src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns.test.js
rename to src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns.test.ts
index 039910e8d3b23..8fc5c89e5d17c 100644
--- a/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns.test.js
+++ b/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns.test.ts
@@ -17,66 +17,65 @@
* under the License.
*/
+// eslint-disable-next-line max-classes-per-file
import { IndexPatterns } from './index_patterns';
+import { SavedObjectsClientContract, UiSettingsClientContract } from 'kibana/public';
jest.mock('../errors', () => ({
IndexPatternMissingIndices: jest.fn(),
}));
-
jest.mock('ui/registry/field_formats', () => ({
fieldFormats: {
getDefaultInstance: jest.fn(),
- }
+ },
}));
jest.mock('ui/notify', () => ({
toastNotifications: {
addDanger: jest.fn(),
- }
+ },
}));
jest.mock('./index_pattern', () => {
class IndexPattern {
init = async () => {
return this;
- }
+ };
}
return {
- IndexPattern
+ IndexPattern,
};
});
jest.mock('./index_patterns_api_client', () => {
class IndexPatternsApiClient {
- getFieldsForWildcard = async () => ({})
+ getFieldsForWildcard = async () => ({});
}
return {
- IndexPatternsApiClient
+ IndexPatternsApiClient,
};
});
-const savedObjectsClient = {
- create: jest.fn(),
- get: jest.fn(),
- update: jest.fn()
-};
-
-const config = {
- get: jest.fn(),
-};
+describe('IndexPatterns', () => {
+ let indexPatterns: IndexPatterns;
+ beforeEach(() => {
+ const savedObjectsClient = {} as SavedObjectsClientContract;
+ const uiSettings = {} as UiSettingsClientContract;
-describe('IndexPatterns', () => {
- const indexPatterns = new IndexPatterns(config, savedObjectsClient);
+ indexPatterns = new IndexPatterns(uiSettings, savedObjectsClient);
+ });
- it('does not cache gets without an id', function () {
+ test('does not cache gets without an id', () => {
expect(indexPatterns.get()).not.toBe(indexPatterns.get());
});
- it('does cache gets for the same id', function () {
- expect(indexPatterns.get(1)).toBe(indexPatterns.get(1));
+ test('does cache gets for the same id', () => {
+ const id = '1';
+
+ expect(indexPatterns.get(id)).toBe(indexPatterns.get(id));
});
});
diff --git a/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.js b/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.js
deleted file mode 100644
index bea4c6c489c9b..0000000000000
--- a/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.js
+++ /dev/null
@@ -1,65 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import { http } from './index_patterns_api_client.test.mock';
-import { IndexPatternsApiClient } from './index_patterns_api_client';
-
-describe('IndexPatternsApiClient', () => {
- it('uses the right URI to fetch fields for time patterns', async function () {
- const fetchSpy = jest.spyOn(http, 'fetch').mockImplementation(() => ({}));
- const indexPatternsApiClient = new IndexPatternsApiClient();
- await indexPatternsApiClient.getFieldsForTimePattern();
-
- expect(fetchSpy).toHaveBeenCalledWith('/api/index_patterns/_fields_for_time_pattern', {
- credentials: 'same-origin',
- headers: { 'Content-Type': 'application/json' },
- method: 'GET',
- prependBasePath: true,
- query: {},
- });
- });
-
- it('uses the right URI to fetch fields for wildcard', async function () {
- const fetchSpy = jest.spyOn(http, 'fetch').mockImplementation(() => ({}));
- const indexPatternsApiClient = new IndexPatternsApiClient();
- await indexPatternsApiClient.getFieldsForWildcard();
-
- expect(fetchSpy).toHaveBeenCalledWith('/api/index_patterns/_fields_for_wildcard', {
- credentials: 'same-origin',
- headers: { 'Content-Type': 'application/json' },
- method: 'GET',
- prependBasePath: true,
- query: {},
- });
- });
-
- it('uses the right URI to fetch fields for wildcard given a type', async function () {
- const fetchSpy = jest.spyOn(http, 'fetch').mockImplementation(() => ({}));
- const indexPatternsApiClient = new IndexPatternsApiClient();
- await indexPatternsApiClient.getFieldsForWildcard({ type: 'rollup' });
-
- expect(fetchSpy).toHaveBeenCalledWith('/api/index_patterns/rollup/_fields_for_wildcard', {
- credentials: 'same-origin',
- headers: { 'Content-Type': 'application/json' },
- method: 'GET',
- prependBasePath: true,
- query: {},
- });
- });
-});
diff --git a/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.mock.js b/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.mock.ts
similarity index 99%
rename from src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.mock.js
rename to src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.mock.ts
index a793fa6a25bea..06933dc409052 100644
--- a/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.mock.js
+++ b/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.mock.ts
@@ -17,7 +17,6 @@
* under the License.
*/
-
import { setup } from '../../../../../../test_utils/public/http_test_setup';
export const { http } = setup(injectedMetadata => {
diff --git a/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.ts b/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.ts
new file mode 100644
index 0000000000000..944108e1501f1
--- /dev/null
+++ b/src/legacy/core_plugins/data/public/index_patterns/index_patterns/index_patterns_api_client.test.ts
@@ -0,0 +1,63 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { http } from './index_patterns_api_client.test.mock';
+import { IndexPatternsApiClient } from './index_patterns_api_client';
+
+const requestData = {
+ credentials: 'same-origin',
+ headers: { 'Content-Type': 'application/json' },
+ method: 'GET',
+ prependBasePath: true,
+ query: {},
+};
+
+describe('IndexPatternsApiClient', () => {
+ let fetchSpy: jest.Mock;
+ let indexPatternsApiClient: IndexPatternsApiClient;
+
+ beforeEach(() => {
+ fetchSpy = jest.spyOn(http, 'fetch').mockImplementation(() => Promise.resolve({}));
+ indexPatternsApiClient = new IndexPatternsApiClient();
+ });
+
+ test('uses the right URI to fetch fields for time patterns', async function() {
+ const expectedPath = '/api/index_patterns/_fields_for_time_pattern';
+
+ await indexPatternsApiClient.getFieldsForTimePattern();
+
+ expect(fetchSpy).toHaveBeenCalledWith(expectedPath, requestData);
+ });
+
+ test('uses the right URI to fetch fields for wildcard', async function() {
+ const expectedPath = '/api/index_patterns/_fields_for_wildcard';
+
+ await indexPatternsApiClient.getFieldsForWildcard();
+
+ expect(fetchSpy).toHaveBeenCalledWith(expectedPath, requestData);
+ });
+
+ test('uses the right URI to fetch fields for wildcard given a type', async function() {
+ const expectedPath = '/api/index_patterns/rollup/_fields_for_wildcard';
+
+ await indexPatternsApiClient.getFieldsForWildcard({ type: 'rollup' });
+
+ expect(fetchSpy).toHaveBeenCalledWith(expectedPath, requestData);
+ });
+});
diff --git a/src/legacy/core_plugins/data/public/legacy.ts b/src/legacy/core_plugins/data/public/legacy.ts
index 14350a6284191..3d86a200eab9b 100644
--- a/src/legacy/core_plugins/data/public/legacy.ts
+++ b/src/legacy/core_plugins/data/public/legacy.ts
@@ -34,9 +34,7 @@
* data that will eventually be injected by the new platform.
*/
-import { npSetup } from 'ui/new_platform';
-// @ts-ignore
-import { renderersRegistry } from 'plugins/interpreter/registries';
+import { npSetup, npStart } from 'ui/new_platform';
// @ts-ignore
import { getInterpreter } from 'plugins/interpreter/interpreter';
import { LegacyDependenciesPlugin } from './shim/legacy_dependencies_plugin';
@@ -47,8 +45,9 @@ const legacyPlugin = new LegacyDependenciesPlugin();
export const setup = dataPlugin.setup(npSetup.core, {
__LEGACY: legacyPlugin.setup(),
- interpreter: {
- renderersRegistry,
- getInterpreter,
- },
+ inspector: npSetup.plugins.inspector,
+});
+
+export const start = dataPlugin.start(npStart.core, {
+ inspector: npStart.plugins.inspector,
});
diff --git a/src/legacy/core_plugins/data/public/plugin.ts b/src/legacy/core_plugins/data/public/plugin.ts
index a38e55e8139ed..b62c8106bc168 100644
--- a/src/legacy/core_plugins/data/public/plugin.ts
+++ b/src/legacy/core_plugins/data/public/plugin.ts
@@ -18,12 +18,16 @@
*/
import { CoreSetup, CoreStart, Plugin } from '../../../../core/public';
-import { ExpressionsService, ExpressionsSetup } from './expressions';
+import { ExpressionsService, ExpressionsSetup, ExpressionsStart } from './expressions';
import { SearchService, SearchSetup } from './search';
import { QueryService, QuerySetup } from './query';
import { FilterService, FilterSetup } from './filter';
import { IndexPatternsService, IndexPatternsSetup } from './index_patterns';
import { LegacyDependenciesPluginSetup } from './shim/legacy_dependencies_plugin';
+import {
+ Start as InspectorStart,
+ Setup as InspectorSetup,
+} from '../../../../plugins/inspector/public';
/**
* Interface for any dependencies on other plugins' `setup` contracts.
@@ -32,7 +36,11 @@ import { LegacyDependenciesPluginSetup } from './shim/legacy_dependencies_plugin
*/
export interface DataPluginSetupDependencies {
__LEGACY: LegacyDependenciesPluginSetup;
- interpreter: any;
+ inspector: InspectorSetup;
+}
+
+export interface DataPluginStartDependencies {
+ inspector: InspectorStart;
}
/**
@@ -48,6 +56,10 @@ export interface DataSetup {
search: SearchSetup;
}
+export interface DataStart {
+ expressions: ExpressionsStart;
+}
+
/**
* Data Plugin - public
*
@@ -59,7 +71,7 @@ export interface DataSetup {
* in the setup/start interfaces. The remaining items exported here are either types,
* or static code.
*/
-export class DataPlugin implements Plugin {
+export class DataPlugin implements Plugin {
// Exposed services, sorted alphabetically
private readonly expressions: ExpressionsService = new ExpressionsService();
private readonly filter: FilterService = new FilterService();
@@ -67,7 +79,7 @@ export class DataPlugin implements Plugin = ({
}
const saveQueryForm = (
-
+
{savedQueryDescriptionText}
diff --git a/src/legacy/core_plugins/data/public/search/search_bar/index.tsx b/src/legacy/core_plugins/data/public/search/search_bar/index.tsx
index 8d98e4d2f9b7a..3fbfec364fad9 100644
--- a/src/legacy/core_plugins/data/public/search/search_bar/index.tsx
+++ b/src/legacy/core_plugins/data/public/search/search_bar/index.tsx
@@ -18,7 +18,7 @@
*/
import { Filter } from '@kbn/es-query';
-import { RefreshInterval, TimeRange } from 'ui/timefilter';
+import { RefreshInterval, TimeRange } from 'src/plugins/data/public';
import { Query } from '../../query/query_bar';
export * from './components';
diff --git a/src/legacy/ui/public/timefilter/get_time.test.ts b/src/legacy/core_plugins/data/public/timefilter/get_time.test.ts
similarity index 100%
rename from src/legacy/ui/public/timefilter/get_time.test.ts
rename to src/legacy/core_plugins/data/public/timefilter/get_time.test.ts
diff --git a/src/legacy/ui/public/timefilter/get_time.ts b/src/legacy/core_plugins/data/public/timefilter/get_time.ts
similarity index 100%
rename from src/legacy/ui/public/timefilter/get_time.ts
rename to src/legacy/core_plugins/data/public/timefilter/get_time.ts
diff --git a/src/legacy/core_plugins/data/public/timefilter/index.ts b/src/legacy/core_plugins/data/public/timefilter/index.ts
new file mode 100644
index 0000000000000..da57bca126b0f
--- /dev/null
+++ b/src/legacy/core_plugins/data/public/timefilter/index.ts
@@ -0,0 +1,22 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+export { Timefilter } from './timefilter';
+export { TimeHistory } from './time_history';
+export { getTime } from './get_time';
diff --git a/src/legacy/ui/public/timefilter/lib/diff_time_picker_vals.test.ts b/src/legacy/core_plugins/data/public/timefilter/lib/diff_time_picker_vals.test.ts
similarity index 100%
rename from src/legacy/ui/public/timefilter/lib/diff_time_picker_vals.test.ts
rename to src/legacy/core_plugins/data/public/timefilter/lib/diff_time_picker_vals.test.ts
diff --git a/src/legacy/ui/public/timefilter/lib/diff_time_picker_vals.ts b/src/legacy/core_plugins/data/public/timefilter/lib/diff_time_picker_vals.ts
similarity index 100%
rename from src/legacy/ui/public/timefilter/lib/diff_time_picker_vals.ts
rename to src/legacy/core_plugins/data/public/timefilter/lib/diff_time_picker_vals.ts
diff --git a/src/legacy/ui/public/timefilter/lib/parse_querystring.ts b/src/legacy/core_plugins/data/public/timefilter/lib/parse_querystring.ts
similarity index 100%
rename from src/legacy/ui/public/timefilter/lib/parse_querystring.ts
rename to src/legacy/core_plugins/data/public/timefilter/lib/parse_querystring.ts
diff --git a/src/legacy/ui/public/timefilter/time_history.ts b/src/legacy/core_plugins/data/public/timefilter/time_history.ts
similarity index 94%
rename from src/legacy/ui/public/timefilter/time_history.ts
rename to src/legacy/core_plugins/data/public/timefilter/time_history.ts
index 66957ec5987c9..98e759fb27a9d 100644
--- a/src/legacy/ui/public/timefilter/time_history.ts
+++ b/src/legacy/core_plugins/data/public/timefilter/time_history.ts
@@ -19,7 +19,7 @@
import moment from 'moment';
import { TimeRange } from 'src/plugins/data/public';
-import { PersistedLog } from '../persisted_log';
+import { PersistedLog } from 'ui/persisted_log';
export class TimeHistory {
private history: PersistedLog;
@@ -52,5 +52,3 @@ export class TimeHistory {
return this.history.get();
}
}
-
-export const timeHistory = new TimeHistory();
diff --git a/src/legacy/ui/public/timefilter/timefilter.test.mocks.ts b/src/legacy/core_plugins/data/public/timefilter/timefilter.test.mocks.ts
similarity index 93%
rename from src/legacy/ui/public/timefilter/timefilter.test.mocks.ts
rename to src/legacy/core_plugins/data/public/timefilter/timefilter.test.mocks.ts
index f6d50167e45db..7354916c3fc35 100644
--- a/src/legacy/ui/public/timefilter/timefilter.test.mocks.ts
+++ b/src/legacy/core_plugins/data/public/timefilter/timefilter.test.mocks.ts
@@ -17,7 +17,7 @@
* under the License.
*/
-import { chromeServiceMock } from '../../../../core/public/mocks';
+import { chromeServiceMock } from '../../../../../core/public/mocks';
jest.doMock('ui/new_platform', () => ({
npStart: {
diff --git a/src/legacy/ui/public/timefilter/timefilter.test.ts b/src/legacy/core_plugins/data/public/timefilter/timefilter.test.ts
similarity index 91%
rename from src/legacy/ui/public/timefilter/timefilter.test.ts
rename to src/legacy/core_plugins/data/public/timefilter/timefilter.test.ts
index f8885d842ef69..47896189aa080 100644
--- a/src/legacy/ui/public/timefilter/timefilter.test.ts
+++ b/src/legacy/core_plugins/data/public/timefilter/timefilter.test.ts
@@ -19,46 +19,38 @@
import './timefilter.test.mocks';
-jest.mock(
- 'ui/chrome',
- () => ({
- getBasePath: () => `/some/base/path`,
- getUiSettingsClient: () => {
- return {
- get: (key: string) => {
- switch (key) {
- case 'timepicker:timeDefaults':
- return { from: 'now-15m', to: 'now' };
- case 'timepicker:refreshIntervalDefaults':
- return { pause: false, value: 0 };
- default:
- throw new Error(`Unexpected config key: ${key}`);
- }
- },
- };
- },
- }),
- { virtual: true }
-);
-
-jest.mock(
- 'ui/timefilter/lib/parse_querystring',
- () => ({
- parseQueryString: () => {
- return {
- // Can not access local variable from within a mock
- // @ts-ignore
- forceNow: global.nowTime,
- };
- },
- }),
- { virtual: true }
-);
+jest.mock('ui/chrome', () => ({
+ getBasePath: () => `/some/base/path`,
+ getUiSettingsClient: () => {
+ return {
+ get: (key: string) => {
+ switch (key) {
+ case 'timepicker:timeDefaults':
+ return { from: 'now-15m', to: 'now' };
+ case 'timepicker:refreshIntervalDefaults':
+ return { pause: false, value: 0 };
+ default:
+ throw new Error(`Unexpected config key: ${key}`);
+ }
+ },
+ };
+ },
+}));
+
+jest.mock('./lib/parse_querystring', () => ({
+ parseQueryString: () => {
+ return {
+ // Can not access local variable from within a mock
+ // @ts-ignore
+ forceNow: global.nowTime,
+ };
+ },
+}));
import sinon from 'sinon';
import expect from '@kbn/expect';
import moment from 'moment';
-import { timefilter } from './timefilter';
+import { timefilter } from 'ui/timefilter';
import { Subscription } from 'rxjs';
import { TimeRange, RefreshInterval } from 'src/plugins/data/public';
diff --git a/src/legacy/ui/public/timefilter/timefilter.ts b/src/legacy/core_plugins/data/public/timefilter/timefilter.ts
similarity index 69%
rename from src/legacy/ui/public/timefilter/timefilter.ts
rename to src/legacy/core_plugins/data/public/timefilter/timefilter.ts
index 729575a833e37..b07060018f9d7 100644
--- a/src/legacy/ui/public/timefilter/timefilter.ts
+++ b/src/legacy/core_plugins/data/public/timefilter/timefilter.ts
@@ -20,18 +20,18 @@
import _ from 'lodash';
import { Subject, BehaviorSubject } from 'rxjs';
import moment, { Moment } from 'moment';
-import { subscribeWithScope } from 'ui/utils/subscribe_with_scope';
-import chrome from 'ui/chrome';
-import { UiSettingsClientContract } from 'src/core/public';
import { RefreshInterval, TimeRange } from 'src/plugins/data/public';
import { IndexPattern } from 'src/legacy/core_plugins/data/public';
-import { IScope } from 'angular';
-import { timeHistory } from './time_history';
+import { TimeHistory } from './time_history';
import { areRefreshIntervalsDifferent, areTimeRangesDifferent } from './lib/diff_time_picker_vals';
-import uiRoutes from '../routes';
import { parseQueryString } from './lib/parse_querystring';
import { calculateBounds, getTime } from './get_time';
+export interface TimefilterConfig {
+ timeDefaults: TimeRange;
+ refreshIntervalDefaults: RefreshInterval;
+}
+
// Timefilter accepts moment input but always returns string output
export type InputTimeRange =
| TimeRange
@@ -53,13 +53,15 @@ export class Timefilter {
private _time: TimeRange;
private _refreshInterval!: RefreshInterval;
+ private _history: TimeHistory;
public isTimeRangeSelectorEnabled: boolean = false;
public isAutoRefreshSelectorEnabled: boolean = false;
- constructor(uiSettings: UiSettingsClientContract) {
- this._time = uiSettings.get('timepicker:timeDefaults');
- this.setRefreshInterval(uiSettings.get('timepicker:refreshIntervalDefaults'));
+ constructor(config: TimefilterConfig, timeHistory: TimeHistory) {
+ this._history = timeHistory;
+ this._time = config.timeDefaults;
+ this.setRefreshInterval(config.refreshIntervalDefaults);
}
getEnabledUpdated$ = () => {
@@ -106,7 +108,7 @@ export class Timefilter {
from: newTime.from,
to: newTime.to,
};
- timeHistory.add(this._time);
+ this._history.add(this._time);
this.timeUpdate$.next();
this.fetch$.next();
}
@@ -221,64 +223,3 @@ export class Timefilter {
this.autoRefreshFetch$.next();
};
}
-
-export const timefilter = new Timefilter(chrome.getUiSettingsClient());
-
-// TODO
-// remove everything underneath once globalState is no longer an angular service
-// and listener can be registered without angular.
-function convertISO8601(stringTime: string): string {
- const obj = moment(stringTime, 'YYYY-MM-DDTHH:mm:ss.SSSZ', true);
- return obj.isValid() ? obj.toString() : stringTime;
-}
-
-// Currently some parts of Kibana (index patterns, timefilter) rely on addSetupWork in the uiRouter
-// and require it to be executed to properly function.
-// This function is exposed for applications that do not use uiRoutes like APM
-// Kibana issue https://github.com/elastic/kibana/issues/19110 tracks the removal of this dependency on uiRouter
-export const registerTimefilterWithGlobalState = _.once((globalState: any, $rootScope: IScope) => {
- const uiSettings = chrome.getUiSettingsClient();
- const timeDefaults = uiSettings.get('timepicker:timeDefaults');
- const refreshIntervalDefaults = uiSettings.get('timepicker:refreshIntervalDefaults');
-
- timefilter.setTime(_.defaults(globalState.time || {}, timeDefaults));
- timefilter.setRefreshInterval(
- _.defaults(globalState.refreshInterval || {}, refreshIntervalDefaults)
- );
-
- globalState.on('fetch_with_changes', () => {
- // clone and default to {} in one
- const newTime: TimeRange = _.defaults({}, globalState.time, timeDefaults);
- const newRefreshInterval: RefreshInterval = _.defaults(
- {},
- globalState.refreshInterval,
- refreshIntervalDefaults
- );
-
- if (newTime) {
- if (newTime.to) newTime.to = convertISO8601(newTime.to);
- if (newTime.from) newTime.from = convertISO8601(newTime.from);
- }
-
- timefilter.setTime(newTime);
- timefilter.setRefreshInterval(newRefreshInterval);
- });
-
- const updateGlobalStateWithTime = () => {
- globalState.time = timefilter.getTime();
- globalState.refreshInterval = timefilter.getRefreshInterval();
- globalState.save();
- };
-
- subscribeWithScope($rootScope, timefilter.getRefreshIntervalUpdate$(), {
- next: updateGlobalStateWithTime,
- });
-
- subscribeWithScope($rootScope, timefilter.getTimeUpdate$(), {
- next: updateGlobalStateWithTime,
- });
-});
-
-uiRoutes.addSetupWork((globalState, $rootScope) => {
- return registerTimefilterWithGlobalState(globalState, $rootScope);
-});
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/api/execute_trigger_actions.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/api/execute_trigger_actions.ts
index 5c6216fb629ac..b7bf7e33e7c9d 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/api/execute_trigger_actions.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/api/execute_trigger_actions.ts
@@ -18,9 +18,9 @@
*/
import { EmbeddableApiPure } from './types';
-import { Action, ActionContext, buildContextMenuForActions, openContextMenu } from '../lib';
+import { Action, buildContextMenuForActions, openContextMenu } from '../lib';
-const executeSingleAction = async (action: Action, actionContext: ActionContext) => {
+const executeSingleAction = async (action: Action, actionContext: A) => {
const href = action.getHref(actionContext);
// TODO: Do we need a `getHref()` special case?
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/api/types.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/api/types.ts
index e68b3b89f5eb0..18073d2b90083 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/api/types.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/api/types.ts
@@ -24,7 +24,6 @@ import {
EmbeddableFactory,
ExecuteTriggerActions,
GetEmbeddableFactories,
- TriggerContext,
} from '../lib';
export interface EmbeddableApi {
@@ -35,7 +34,7 @@ export interface EmbeddableApi {
getEmbeddableFactories: GetEmbeddableFactories;
getTrigger: (id: string) => Trigger;
getTriggerActions: (id: string) => Action[];
- getTriggerCompatibleActions: (triggerId: string, context: TriggerContext) => Promise;
+ getTriggerCompatibleActions: (triggerId: string, context: C) => Promise>>;
registerAction: (action: Action) => void;
// TODO: Make `registerEmbeddableFactory` receive only `factory` argument.
registerEmbeddableFactory: (id: string, factory: EmbeddableFactory) => void;
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/index.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/index.ts
index 4cceceb57824f..79bdd65f9cfcd 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/index.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/index.ts
@@ -26,7 +26,6 @@ export {
APPLY_FILTER_TRIGGER,
PANEL_BADGE_TRIGGER,
Action,
- ActionContext,
Adapters,
AddPanelAction,
ApplyFilterAction,
@@ -59,7 +58,6 @@ export {
PropertySpec,
SavedObjectMetaData,
Trigger,
- TriggerContext,
ViewMode,
isErrorEmbeddable,
openAddPanelFlyout,
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/action.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/action.ts
index 1002915de1d93..5569a3938bc72 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/action.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/action.ts
@@ -17,20 +17,7 @@
* under the License.
*/
-import { IEmbeddable } from '../embeddables';
-
-export interface ActionContext<
- TEmbeddable extends IEmbeddable = IEmbeddable,
- TTriggerContext extends {} = {}
-> {
- embeddable: TEmbeddable;
- triggerContext?: TTriggerContext;
-}
-
-export abstract class Action<
- TEmbeddable extends IEmbeddable = IEmbeddable,
- TTriggerContext extends {} = {}
-> {
+export abstract class Action {
/**
* Determined the order when there is more than one action matched to a trigger.
* Higher numbers are displayed first.
@@ -43,7 +30,7 @@ export abstract class Action<
/**
* Optional EUI icon type that can be displayed along with the title.
*/
- public getIconType(context: ActionContext): string | undefined {
+ public getIconType(context: ActionContext): string | undefined {
return undefined;
}
@@ -51,27 +38,25 @@ export abstract class Action<
* Returns a title to be displayed to the user.
* @param context
*/
- public abstract getDisplayName(context: ActionContext): string;
+ public abstract getDisplayName(context: ActionContext): string;
/**
* Returns a promise that resolves to true if this action is compatible given the context,
* otherwise resolves to false.
*/
- public async isCompatible(
- context: ActionContext
- ): Promise {
+ public async isCompatible(context: ActionContext): Promise {
return true;
}
/**
* If this returns something truthy, this is used in addition to the `execute` method when clicked.
*/
- public getHref(context: ActionContext): string | undefined {
+ public getHref(context: ActionContext): string | undefined {
return undefined;
}
/**
* Executes the action.
*/
- public abstract execute(context: ActionContext): void;
+ public abstract async execute(context: ActionContext): Promise;
}
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/apply_filter_action.test.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/apply_filter_action.test.ts
index e32500af1d7fd..c14f258b5641c 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/apply_filter_action.test.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/apply_filter_action.test.ts
@@ -48,9 +48,7 @@ describe('isCompatible()', () => {
}),
}),
} as any,
- triggerContext: {
- filters: [],
- },
+ filters: [],
});
expect(result).toBe(true);
});
@@ -65,9 +63,7 @@ describe('isCompatible()', () => {
}),
}),
} as any,
- triggerContext: {
- filters: [],
- },
+ filters: [],
});
expect(result).toBe(false);
});
@@ -83,25 +79,8 @@ describe('isCompatible()', () => {
}),
}),
} as any,
- triggerContext: {
- // filters: [],
- } as any,
- });
+ } as any);
expect(result1).toBe(false);
-
- const result2 = await action.isCompatible({
- embeddable: {
- getRoot: () => ({
- getInput: () => ({
- filters: [],
- }),
- }),
- } as any,
- // triggerContext: {
- // filters: [],
- // } as any
- });
- expect(result2).toBe(false);
});
});
@@ -125,42 +104,41 @@ describe('execute()', () => {
const error = expectError(() =>
action.execute({
embeddable: getEmbeddable(),
- triggerContext: {},
} as any)
);
expect(error).toBeInstanceOf(Error);
});
- test('updates filter input on success', () => {
+ test('updates filter input on success', async done => {
const action = new ApplyFilterAction();
const [embeddable, root] = getEmbeddable();
- action.execute({
+ await action.execute({
embeddable,
- triggerContext: {
- filters: ['FILTER' as any],
- },
+ filters: ['FILTER' as any],
});
expect(root.updateInput).toHaveBeenCalledTimes(1);
expect(root.updateInput.mock.calls[0][0]).toMatchObject({
filters: ['FILTER'],
});
+
+ done();
});
- test('checks if action isCompatible', () => {
+ test('checks if action isCompatible', async done => {
const action = new ApplyFilterAction();
const spy = jest.spyOn(action, 'isCompatible');
const [embeddable] = getEmbeddable();
- action.execute({
+ await action.execute({
embeddable,
- triggerContext: {
- filters: ['FILTER' as any],
- },
+ filters: ['FILTER' as any],
});
expect(spy).toHaveBeenCalledTimes(1);
+
+ done();
});
});
});
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/apply_filter_action.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/apply_filter_action.ts
index c7b12629eeabe..24549a64bfc23 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/apply_filter_action.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/apply_filter_action.ts
@@ -20,14 +20,18 @@
import { i18n } from '@kbn/i18n';
import { Filter } from '@kbn/es-query';
import { IEmbeddable, EmbeddableInput } from '../embeddables';
-import { Action, ActionContext } from './action';
+import { Action } from './action';
import { IncompatibleActionError } from '../errors';
export const APPLY_FILTER_ACTION = 'APPLY_FILTER_ACTION';
type RootEmbeddable = IEmbeddable;
+interface ActionContext {
+ embeddable: IEmbeddable;
+ filters: Filter[];
+}
-export class ApplyFilterAction extends Action {
+export class ApplyFilterAction extends Action {
public readonly type = APPLY_FILTER_ACTION;
constructor() {
@@ -40,30 +44,27 @@ export class ApplyFilterAction extends Action) {
+ public async isCompatible(context: ActionContext) {
+ if (context.embeddable === undefined) {
+ return false;
+ }
const root = context.embeddable.getRoot() as RootEmbeddable;
- return Boolean(
- root.getInput().filters !== undefined &&
- context.triggerContext &&
- context.triggerContext.filters !== undefined
- );
+ return Boolean(root.getInput().filters !== undefined && context.filters !== undefined);
}
- public execute({
- embeddable,
- triggerContext,
- }: ActionContext) {
- if (!triggerContext) {
- throw new Error('Applying a filter requires a filter as context');
+ public async execute({ embeddable, filters }: ActionContext) {
+ if (!filters || !embeddable) {
+ throw new Error('Applying a filter requires a filter and embeddable as context');
}
- const root = embeddable.getRoot() as RootEmbeddable;
- if (!this.isCompatible({ triggerContext, embeddable })) {
+ if (!(await this.isCompatible({ embeddable, filters }))) {
throw new IncompatibleActionError();
}
+ const root = embeddable.getRoot() as RootEmbeddable;
+
root.updateInput({
- filters: triggerContext.filters,
+ filters,
});
}
}
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/edit_panel_action.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/edit_panel_action.ts
index 5edd82bd14a37..0b37491212810 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/edit_panel_action.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/edit_panel_action.ts
@@ -18,13 +18,18 @@
*/
import { i18n } from '@kbn/i18n';
-import { Action, ActionContext } from './action';
+import { Action } from './action';
import { GetEmbeddableFactory, ViewMode } from '../types';
import { EmbeddableFactoryNotFoundError } from '../errors';
+import { IEmbeddable } from '../embeddables';
export const EDIT_PANEL_ACTION_ID = 'editPanel';
-export class EditPanelAction extends Action {
+interface ActionContext {
+ embeddable: IEmbeddable;
+}
+
+export class EditPanelAction extends Action {
public readonly type = EDIT_PANEL_ACTION_ID;
constructor(private readonly getEmbeddableFactory: GetEmbeddableFactory) {
super(EDIT_PANEL_ACTION_ID);
@@ -56,8 +61,8 @@ export class EditPanelAction extends Action {
return Boolean(canEditEmbeddable && inDashboardEditMode);
}
- public execute() {
- return undefined;
+ public async execute() {
+ return;
}
public getHref({ embeddable }: ActionContext): string {
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/index.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/index.ts
index ae0df0a2122c6..7deace8345af9 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/index.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/index.ts
@@ -17,6 +17,6 @@
* under the License.
*/
-export { Action, ActionContext } from './action';
+export { Action } from './action';
export * from './apply_filter_action';
export * from './edit_panel_action';
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/context_menu_actions/build_eui_context_menu_panels.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/context_menu_actions/build_eui_context_menu_panels.ts
index b51a40a3ef2d9..5b1998834a2ed 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/context_menu_actions/build_eui_context_menu_panels.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/context_menu_actions/build_eui_context_menu_panels.ts
@@ -20,21 +20,21 @@
import { EuiContextMenuPanelDescriptor, EuiContextMenuPanelItemDescriptor } from '@elastic/eui';
import _ from 'lodash';
import { i18n } from '@kbn/i18n';
-import { Action, ActionContext } from '../actions';
+import { Action } from '../actions';
/**
* Transforms an array of Actions to the shape EuiContextMenuPanel expects.
*/
-export async function buildContextMenuForActions({
+export async function buildContextMenuForActions({
actions,
actionContext,
closeMenu,
}: {
- actions: Action[];
- actionContext: ActionContext;
+ actions: Array>;
+ actionContext: A;
closeMenu: () => void;
}): Promise {
- const menuItems = await buildEuiContextMenuPanelItems({
+ const menuItems = await buildEuiContextMenuPanelItems({
actions,
actionContext,
closeMenu,
@@ -52,13 +52,13 @@ export async function buildContextMenuForActions({
/**
* Transform an array of Actions into the shape needed to build an EUIContextMenu
*/
-async function buildEuiContextMenuPanelItems({
+async function buildEuiContextMenuPanelItems({
actions,
actionContext,
closeMenu,
}: {
- actions: Action[];
- actionContext: ActionContext;
+ actions: Array>;
+ actionContext: A;
closeMenu: () => void;
}) {
const items: EuiContextMenuPanelItemDescriptor[] = [];
@@ -88,13 +88,13 @@ async function buildEuiContextMenuPanelItems({
* @param {Embeddable} embeddable
* @return {EuiContextMenuPanelItemDescriptor}
*/
-function convertPanelActionToContextMenuItem({
+function convertPanelActionToContextMenuItem({
action,
actionContext,
closeMenu,
}: {
- action: Action;
- actionContext: ActionContext;
+ action: Action;
+ actionContext: A;
closeMenu: () => void;
}): EuiContextMenuPanelItemDescriptor {
const menuPanelItem: EuiContextMenuPanelItemDescriptor = {
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/embeddable_panel.tsx b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/embeddable_panel.tsx
index c06f4ed99e8fd..172a5a76c4b21 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/embeddable_panel.tsx
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/embeddable_panel.tsx
@@ -37,7 +37,7 @@ import { AddPanelAction } from './panel_header/panel_actions/add_panel/add_panel
import { CustomizePanelTitleAction } from './panel_header/panel_actions/customize_title/customize_panel_action';
import { PanelHeader } from './panel_header/panel_header';
import { InspectPanelAction } from './panel_header/panel_actions/inspect_panel_action';
-import { EditPanelAction, Action, ActionContext } from '../actions';
+import { EditPanelAction, Action } from '../actions';
import { CustomizePanelModal } from './panel_header/panel_actions/customize_title/customize_panel_modal';
import { Start as InspectorStartContract } from '../../../../../../../../plugins/inspector/public';
@@ -192,7 +192,7 @@ export class EmbeddablePanel extends React.Component {
});
const createGetUserData = (overlays: CoreStart['overlays']) =>
- async function getUserData(context: ActionContext) {
+ async function getUserData(context: { embeddable: IEmbeddable }) {
return new Promise<{ title: string | undefined }>(resolve => {
const session = overlays.openModal(
{
test('Is not compatible when embeddable is not a container', async () => {
expect(
- await action.isCompatible({
- embeddable,
- })
+ // @ts-ignore
+ await action.isCompatible({ embeddable })
).toBe(false);
});
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/add_panel/add_panel_action.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/add_panel/add_panel_action.ts
index 5c660f392d42c..7a49927e47251 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/add_panel/add_panel_action.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/add_panel/add_panel_action.ts
@@ -18,14 +18,19 @@
*/
import { i18n } from '@kbn/i18n';
import { ViewMode, GetEmbeddableFactory, GetEmbeddableFactories } from '../../../../types';
-import { Action, ActionContext } from '../../../../actions';
+import { Action } from '../../../../actions';
import { openAddPanelFlyout } from './open_add_panel_flyout';
import { NotificationsStart } from '../../../../../../../../../../../core/public';
import { KibanaReactOverlays } from '../../../../../../../../../../../plugins/kibana_react/public';
+import { IContainer } from '../../../../containers';
export const ADD_PANEL_ACTION_ID = 'ADD_PANEL_ACTION_ID';
-export class AddPanelAction extends Action {
+interface ActionContext {
+ embeddable: IContainer;
+}
+
+export class AddPanelAction extends Action {
public readonly type = ADD_PANEL_ACTION_ID;
constructor(
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/customize_title/customize_panel_action.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/customize_title/customize_panel_action.ts
index 51001de0fefb5..d91cee3048c1f 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/customize_title/customize_panel_action.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/customize_title/customize_panel_action.ts
@@ -18,14 +18,19 @@
*/
import { i18n } from '@kbn/i18n';
-import { Action, ActionContext } from '../../../../actions';
+import { Action } from '../../../../actions';
import { ViewMode } from '../../../../types';
+import { IEmbeddable } from '../../../../embeddables';
const CUSTOMIZE_PANEL_ACTION_ID = 'CUSTOMIZE_PANEL_ACTION_ID';
type GetUserData = (context: ActionContext) => Promise<{ title: string | undefined }>;
-export class CustomizePanelTitleAction extends Action {
+interface ActionContext {
+ embeddable: IEmbeddable;
+}
+
+export class CustomizePanelTitleAction extends Action {
public readonly type = CUSTOMIZE_PANEL_ACTION_ID;
constructor(private readonly getDataFromUser: GetUserData) {
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/inspect_panel_action.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/inspect_panel_action.ts
index 06ba48a5e23b2..3e4e2a36d46b9 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/inspect_panel_action.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/inspect_panel_action.ts
@@ -18,12 +18,17 @@
*/
import { i18n } from '@kbn/i18n';
-import { Action, ActionContext } from '../../../actions';
+import { Action } from '../../../actions';
import { Start as InspectorStartContract } from '../../../../../../../../../../plugins/inspector/public';
+import { IEmbeddable } from '../../../embeddables';
export const INSPECT_PANEL_ACTION_ID = 'openInspector';
-export class InspectPanelAction extends Action {
+interface ActionContext {
+ embeddable: IEmbeddable;
+}
+
+export class InspectPanelAction extends Action {
public readonly type = INSPECT_PANEL_ACTION_ID;
constructor(private readonly inspector: InspectorStartContract) {
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/remove_panel_action.test.tsx b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/remove_panel_action.test.tsx
index 6421f4e85730c..22e3be89f1ae9 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/remove_panel_action.test.tsx
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/remove_panel_action.test.tsx
@@ -28,7 +28,7 @@ import {
} from '../../../test_samples/embeddables/filterable_embeddable';
import { FilterableEmbeddableFactory } from '../../../test_samples/embeddables/filterable_embeddable_factory';
import { FilterableContainer } from '../../../test_samples/embeddables/filterable_container';
-import { GetEmbeddableFactory } from '../../../types';
+import { GetEmbeddableFactory, ViewMode } from '../../../types';
import { ContactCardEmbeddable } from '../../../test_samples/embeddables/contact_card/contact_card_embeddable';
const embeddableFactories = new Map();
@@ -45,7 +45,7 @@ beforeEach(async () => {
query: { match: {} },
};
container = new FilterableContainer(
- { id: 'hello', panels: {}, filters: [derivedFilter] },
+ { id: 'hello', panels: {}, filters: [derivedFilter], viewMode: ViewMode.EDIT },
getFactory
);
@@ -55,6 +55,7 @@ beforeEach(async () => {
FilterableEmbeddable
>(FILTERABLE_EMBEDDABLE, {
id: '123',
+ viewMode: ViewMode.EDIT,
});
if (isErrorEmbeddable(filterableEmbeddable)) {
@@ -68,7 +69,7 @@ test('Removes the embeddable', async () => {
const removePanelAction = new RemovePanelAction();
expect(container.getChild(embeddable.id)).toBeDefined();
- removePanelAction.execute({ embeddable });
+ await removePanelAction.execute({ embeddable });
expect(container.getChild(embeddable.id)).toBeUndefined();
});
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/remove_panel_action.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/remove_panel_action.ts
index f8fc9d02992d4..2a61857d17f77 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/remove_panel_action.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/panel/panel_header/panel_actions/remove_panel_action.ts
@@ -19,8 +19,9 @@
import { i18n } from '@kbn/i18n';
import { ContainerInput, IContainer } from '../../../containers';
import { ViewMode } from '../../../types';
-import { Action, ActionContext } from '../../../actions';
+import { Action } from '../../../actions';
import { IncompatibleActionError } from '../../../errors';
+import { IEmbeddable } from '../../../embeddables';
export const REMOVE_PANEL_ACTION = 'deletePanel';
@@ -28,13 +29,17 @@ interface ExpandedPanelInput extends ContainerInput {
expandedPanelId: string;
}
+interface ActionContext {
+ embeddable: IEmbeddable;
+}
+
function hasExpandedPanelInput(
container: IContainer
): container is IContainer<{}, ExpandedPanelInput> {
return (container as IContainer<{}, ExpandedPanelInput>).getInput().expandedPanelId !== undefined;
}
-export class RemovePanelAction extends Action {
+export class RemovePanelAction extends Action {
public readonly type = REMOVE_PANEL_ACTION;
constructor() {
super(REMOVE_PANEL_ACTION);
@@ -63,8 +68,8 @@ export class RemovePanelAction extends Action {
);
}
- public execute({ embeddable }: ActionContext) {
- if (!embeddable.parent || !this.isCompatible({ embeddable })) {
+ public async execute({ embeddable }: ActionContext) {
+ if (!embeddable.parent || !(await this.isCompatible({ embeddable }))) {
throw new IncompatibleActionError();
}
embeddable.parent.removeEmbeddable(embeddable.id);
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/edit_mode_action.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/edit_mode_action.ts
index d2e893887808b..f87ff835f59cc 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/edit_mode_action.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/edit_mode_action.ts
@@ -18,11 +18,15 @@
*/
import { ViewMode } from '../../types';
-import { Action, ActionContext } from '../../actions';
+import { Action } from '../../actions';
+import { IEmbeddable } from '../../embeddables';
export const EDIT_MODE_ACTION = 'EDIT_MODE_ACTION';
-export class EditModeAction extends Action {
+interface ActionContext {
+ embeddable: IEmbeddable;
+}
+export class EditModeAction extends Action {
public readonly type = EDIT_MODE_ACTION;
constructor() {
@@ -37,7 +41,7 @@ export class EditModeAction extends Action {
return context.embeddable.getInput().viewMode === ViewMode.EDIT;
}
- execute() {
+ async execute() {
return;
}
}
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/hello_world_action.tsx b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/hello_world_action.tsx
index bfd7ac6541f01..356679b5e4501 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/hello_world_action.tsx
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/hello_world_action.tsx
@@ -35,7 +35,7 @@ export class HelloWorldAction extends Action {
return 'Hello World Action!';
}
- public execute() {
+ public async execute() {
const flyoutSession = this.overlays.openFlyout(
flyoutSession && flyoutSession.close()}>
Hello World, I am a hello world action!
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/restricted_action.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/restricted_action.ts
index 950b843816c7a..16aede6da18d1 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/restricted_action.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/restricted_action.ts
@@ -17,15 +17,15 @@
* under the License.
*/
-import { Action, ActionContext } from '../../actions';
+import { Action } from '../../actions';
export const RESTRICTED_ACTION = 'RESTRICTED_ACTION';
-export class RestrictedAction extends Action {
+export class RestrictedAction extends Action {
public readonly type = RESTRICTED_ACTION;
- private isCompatibleFn: (context: ActionContext) => boolean;
- constructor(isCompatible: (context: ActionContext) => boolean) {
+ private isCompatibleFn: (context: A) => boolean;
+ constructor(isCompatible: (context: A) => boolean) {
super(RESTRICTED_ACTION);
this.isCompatibleFn = isCompatible;
}
@@ -34,9 +34,9 @@ export class RestrictedAction extends Action {
return `I am only sometimes compatible`;
}
- async isCompatible(context: ActionContext) {
+ async isCompatible(context: A) {
return this.isCompatibleFn(context);
}
- execute() {}
+ async execute() {}
}
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/say_hello_action.tsx b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/say_hello_action.tsx
index e64d0e8cec58c..1a884148498aa 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/say_hello_action.tsx
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/say_hello_action.tsx
@@ -17,7 +17,7 @@
* under the License.
*/
-import { Action, ActionContext } from '../../actions';
+import { Action } from '../../actions';
import { EmbeddableInput, Embeddable, EmbeddableOutput, IEmbeddable } from '../../embeddables';
import { IncompatibleActionError } from '../../errors';
@@ -36,7 +36,12 @@ export function hasFullNameOutput(
);
}
-export class SayHelloAction extends Action {
+interface ActionContext {
+ embeddable: Embeddable;
+ message?: string;
+}
+
+export class SayHelloAction extends Action {
public readonly type = SAY_HELLO_ACTION;
private sayHello: (name: string) => void;
@@ -53,9 +58,7 @@ export class SayHelloAction extends Action {
// Can use typescript generics to get compiler time warnings for immediate feedback if
// the context is not compatible.
- async isCompatible(
- context: ActionContext>
- ) {
+ async isCompatible(context: ActionContext) {
// Option 1: only compatible with Greeting Embeddables.
// return context.embeddable.type === CONTACT_CARD_EMBEDDABLE;
@@ -63,20 +66,15 @@ export class SayHelloAction extends Action {
return hasFullNameOutput(context.embeddable);
}
- async execute(
- context: ActionContext<
- Embeddable,
- { message?: string }
- >
- ) {
+ async execute(context: ActionContext) {
if (!(await this.isCompatible(context))) {
throw new IncompatibleActionError();
}
const greeting = `Hello, ${context.embeddable.getOutput().fullName}`;
- if (context.triggerContext && context.triggerContext.message) {
- this.sayHello(`${greeting}. ${context.triggerContext.message}`);
+ if (context.message) {
+ this.sayHello(`${greeting}. ${context.message}`);
} else {
this.sayHello(greeting);
}
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/send_message_action.tsx b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/send_message_action.tsx
index 9ac8232725299..0f54f80398f20 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/send_message_action.tsx
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/test_samples/actions/send_message_action.tsx
@@ -18,7 +18,7 @@
*/
import React from 'react';
import { EuiFlyoutBody } from '@elastic/eui';
-import { Action, ActionContext, IncompatibleActionError } from '../..';
+import { Action, IncompatibleActionError } from '../..';
import { Embeddable, EmbeddableInput } from '../../embeddables';
import { GetMessageModal } from './get_message_modal';
import { FullNameEmbeddableOutput, hasFullNameOutput } from './say_hello_action';
@@ -26,6 +26,10 @@ import { CoreStart } from '../../../../../../../../../core/public';
export const SEND_MESSAGE_ACTION = 'SEND_MESSAGE_ACTION';
+interface ActionContext {
+ embeddable: Embeddable;
+ message: string;
+}
export class SendMessageAction extends Action {
public readonly type = SEND_MESSAGE_ACTION;
@@ -37,28 +41,18 @@ export class SendMessageAction extends Action {
return 'Send message';
}
- async isCompatible(
- context: ActionContext>
- ) {
+ async isCompatible(context: ActionContext) {
return hasFullNameOutput(context.embeddable);
}
- async sendMessage(
- context: ActionContext>,
- message: string
- ) {
+ async sendMessage(context: ActionContext, message: string) {
const greeting = `Hello, ${context.embeddable.getOutput().fullName}`;
const content = message ? `${greeting}. ${message}` : greeting;
this.overlays.openFlyout({content} );
}
- async execute(
- context: ActionContext<
- Embeddable,
- { message?: string }
- >
- ) {
+ async execute(context: ActionContext) {
if (!(await this.isCompatible(context))) {
throw new IncompatibleActionError();
}
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/types.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/types.ts
index 9d10a0f059f3c..925afe07ff539 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/types.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/types.ts
@@ -17,9 +17,7 @@
* under the License.
*/
-import { Action, ActionContext } from './actions';
-import { IEmbeddable } from './embeddables';
-import { IContainer } from './containers';
+import { Action } from './actions';
import { EmbeddableFactory } from './embeddables/embeddable_factory';
import { Adapters } from '../../../../../../../plugins/inspector/public';
@@ -55,18 +53,10 @@ export interface SavedObjectMetaData {
showSavedObject?(savedObject: any): any;
}
-export interface TriggerContext {
- embeddable: IEmbeddable;
- container?: IContainer;
-}
-
-export type ExecuteTriggerActions = (
- triggerId: string,
- actionContext: ActionContext
-) => Promise;
-export type GetActionsCompatibleWithTrigger = (
+export type ExecuteTriggerActions = (triggerId: string, actionContext: A) => Promise;
+export type GetActionsCompatibleWithTrigger = (
triggerId: string,
- context: TriggerContext
+ context: C
) => Promise;
export type GetEmbeddableFactory = (id: string) => EmbeddableFactory | undefined;
export type GetEmbeddableFactories = () => IterableIterator;
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/apply_filter_action.test.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/apply_filter_action.test.ts
index 7cd56290bf781..6e5d2182b7063 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/apply_filter_action.test.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/apply_filter_action.test.ts
@@ -85,7 +85,7 @@ test('ApplyFilterAction applies the filter to the root of the container tree', a
query: { match: { extension: { query: 'foo' } } },
};
- applyFilterAction.execute({ embeddable, triggerContext: { filters: [filter] } });
+ await applyFilterAction.execute({ embeddable, filters: [filter] });
expect(root.getInput().filters.length).toBe(1);
expect(node1.getInput().filters.length).toBe(1);
expect(embeddable.getInput().filters.length).toBe(1);
@@ -124,6 +124,7 @@ test('ApplyFilterAction is incompatible if the root container does not accept a
throw new Error();
}
+ // @ts-ignore
expect(await applyFilterAction.isCompatible({ embeddable })).toBe(false);
});
@@ -160,6 +161,7 @@ test('trying to execute on incompatible context throws an error ', async () => {
}
async function check() {
+ // @ts-ignore
await applyFilterAction.execute({ embeddable });
}
await expect(check()).rejects.toThrow(Error);
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/execute_trigger_actions.test.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/execute_trigger_actions.test.ts
index a2406a548b0cb..1b5a80af52987 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/execute_trigger_actions.test.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/execute_trigger_actions.test.ts
@@ -19,7 +19,7 @@
import { testPlugin, TestPluginReturn } from './test_plugin';
import { of } from './helpers';
-import { ActionContext, Action, openContextMenu } from '../lib';
+import { Action, openContextMenu, IEmbeddable } from '../lib';
import {
ContactCardEmbeddable,
CONTACT_USER_TRIGGER,
@@ -31,11 +31,11 @@ jest.mock('../lib/context_menu_actions');
const executeFn = jest.fn();
const openContextMenuSpy = (openContextMenu as any) as jest.SpyInstance;
-class TestAction extends Action {
+class TestAction extends Action {
public readonly type = 'testAction';
- public checkCompatibility: (context: ActionContext) => boolean;
+ public checkCompatibility: (context: A) => boolean;
- constructor(id: string, checkCompatibility: (context: ActionContext) => boolean) {
+ constructor(id: string, checkCompatibility: (context: A) => boolean) {
super(id);
this.checkCompatibility = checkCompatibility;
}
@@ -44,11 +44,11 @@ class TestAction extends Action {
return 'test';
}
- async isCompatible(context: ActionContext) {
+ async isCompatible(context: A) {
return this.checkCompatibility(context);
}
- execute(context: ActionContext) {
+ async execute(context: unknown) {
executeFn(context);
}
}
@@ -124,7 +124,10 @@ test('does not execute an incompatible action', async () => {
title: 'My trigger',
actionIds: ['test1'],
};
- const action = new TestAction('test1', ({ embeddable }) => embeddable.id === 'executeme');
+ const action = new TestAction<{ embeddable: IEmbeddable }>(
+ 'test1',
+ ({ embeddable }) => embeddable.id === 'executeme'
+ );
const embeddable = new ContactCardEmbeddable(
{
id: 'executeme',
@@ -187,7 +190,7 @@ test('passes whole action context to isCompatible()', async () => {
title: 'My trigger',
actionIds: ['test'],
};
- const action = new TestAction('test', ({ triggerContext }) => {
+ const action = new TestAction<{ triggerContext: any }>('test', ({ triggerContext }) => {
expect(triggerContext).toEqual({
foo: 'bar',
});
diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/get_trigger_compatible_actions.test.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/get_trigger_compatible_actions.test.ts
index ba926458cce13..f70bfcb080ae9 100644
--- a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/get_trigger_compatible_actions.test.ts
+++ b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/tests/get_trigger_compatible_actions.test.ts
@@ -22,7 +22,7 @@ import { HelloWorldAction } from '../lib/test_samples/actions/hello_world_action
import { SayHelloAction } from '../lib/test_samples/actions/say_hello_action';
import { RestrictedAction } from '../lib/test_samples/actions/restricted_action';
import { EmptyEmbeddable } from '../lib/test_samples/embeddables/empty_embeddable';
-import { ActionContext, CONTEXT_MENU_TRIGGER } from '../lib';
+import { CONTEXT_MENU_TRIGGER, IEmbeddable } from '../lib';
import { of } from './helpers';
let action: SayHelloAction;
@@ -73,7 +73,7 @@ test('getTriggerCompatibleActions returns attached actions', async () => {
test('filters out actions not applicable based on the context', async () => {
const { setup, doStart } = embeddables;
- const restrictedAction = new RestrictedAction((context: ActionContext) => {
+ const restrictedAction = new RestrictedAction<{ embeddable: IEmbeddable }>(context => {
return context.embeddable.id === 'accept';
});
diff --git a/src/legacy/core_plugins/kibana/common/field_formats/types/__tests__/string.js b/src/legacy/core_plugins/kibana/common/field_formats/types/__tests__/string.js
index 04c0b9a045d38..659d040189891 100644
--- a/src/legacy/core_plugins/kibana/common/field_formats/types/__tests__/string.js
+++ b/src/legacy/core_plugins/kibana/common/field_formats/types/__tests__/string.js
@@ -70,4 +70,11 @@ describe('String Format', function () {
expect(string.convert(value)).to.be(value);
});
+ it('decode a URL Param string', function () {
+ const string = new StringFormat({
+ transform: 'urlparam'
+ });
+ expect(string.convert('%EC%95%88%EB%85%95%20%ED%82%A4%EB%B0%94%EB%82%98')).to.be('안녕 키바나');
+ });
+
});
diff --git a/src/legacy/core_plugins/kibana/common/field_formats/types/string.js b/src/legacy/core_plugins/kibana/common/field_formats/types/string.js
index acab65058159d..9440f740c7659 100644
--- a/src/legacy/core_plugins/kibana/common/field_formats/types/string.js
+++ b/src/legacy/core_plugins/kibana/common/field_formats/types/string.js
@@ -26,7 +26,8 @@ const TRANSFORM_OPTIONS = [
{ kind: 'upper', text: 'Upper Case' },
{ kind: 'title', text: 'Title Case' },
{ kind: 'short', text: 'Short Dots' },
- { kind: 'base64', text: 'Base64 Decode' }
+ { kind: 'base64', text: 'Base64 Decode' },
+ { kind: 'urlparam', text: 'URL Param Decode' }
];
const DEFAULT_TRANSFORM_OPTION = false;
@@ -57,6 +58,7 @@ export function createStringFormat(FieldFormat) {
case 'title': return this._toTitleCase(val);
case 'short': return shortenDottedString(val);
case 'base64': return this._base64Decode(val);
+ case 'urlparam': return decodeURIComponent(val);
default: return asPrettyString(val);
}
}
diff --git a/src/legacy/core_plugins/kibana/public/dashboard/dashboard_app.tsx b/src/legacy/core_plugins/kibana/public/dashboard/dashboard_app.tsx
index a0fe853484eee..1f65ccebb67d9 100644
--- a/src/legacy/core_plugins/kibana/public/dashboard/dashboard_app.tsx
+++ b/src/legacy/core_plugins/kibana/public/dashboard/dashboard_app.tsx
@@ -36,7 +36,7 @@ import {
import { KbnUrl } from 'ui/url/kbn_url';
import { Filter } from '@kbn/es-query';
-import { TimeRange } from 'ui/timefilter';
+import { TimeRange } from 'src/plugins/data/public';
import { IndexPattern } from 'ui/index_patterns';
import { IPrivate } from 'ui/private';
import { StaticIndexPattern, Query, SavedQuery } from 'plugins/data';
diff --git a/src/legacy/core_plugins/kibana/public/dashboard/dashboard_app_controller.tsx b/src/legacy/core_plugins/kibana/public/dashboard/dashboard_app_controller.tsx
index 081ad3fa3a95d..5b4a4c99d403a 100644
--- a/src/legacy/core_plugins/kibana/public/dashboard/dashboard_app_controller.tsx
+++ b/src/legacy/core_plugins/kibana/public/dashboard/dashboard_app_controller.tsx
@@ -33,8 +33,7 @@ import { FilterBarQueryFilterProvider } from 'ui/filter_manager/query_filter';
import { docTitle } from 'ui/doc_title/doc_title';
-// @ts-ignore
-import { showSaveModal } from 'ui/saved_objects/show_saved_object_save_modal';
+import { showSaveModal, SaveResult } from 'ui/saved_objects/show_saved_object_save_modal';
import { showShareContextMenu, ShareContextMenuExtensionsRegistryProvider } from 'ui/share';
import { migrateLegacyQuery } from 'ui/utils/migrate_legacy_query';
@@ -604,7 +603,7 @@ export class DashboardAppController {
* @return {Promise}
* @resolved {String} - The id of the doc
*/
- function save(saveOptions: SaveOptions): Promise<{ id?: string } | { error: Error }> {
+ function save(saveOptions: SaveOptions): Promise {
return saveDashboard(angular.toJson, timefilter, dashboardStateManager, saveOptions)
.then(function(id) {
if (id) {
@@ -695,7 +694,7 @@ export class DashboardAppController {
isTitleDuplicateConfirmed,
onTitleDuplicate,
};
- return save(saveOptions).then((response: { id?: string } | { error: Error }) => {
+ return save(saveOptions).then((response: SaveResult) => {
// If the save wasn't successful, put the original values back.
if (!(response as { id: string }).id) {
dashboardStateManager.setTitle(currentTitle);
diff --git a/src/legacy/core_plugins/kibana/public/dashboard/dashboard_state.test.ts b/src/legacy/core_plugins/kibana/public/dashboard/dashboard_state.test.ts
index 40e65f5683ee2..be76f498c8911 100644
--- a/src/legacy/core_plugins/kibana/public/dashboard/dashboard_state.test.ts
+++ b/src/legacy/core_plugins/kibana/public/dashboard/dashboard_state.test.ts
@@ -23,7 +23,8 @@ import { DashboardStateManager } from './dashboard_state_manager';
import { getAppStateMock, getSavedDashboardMock } from './__tests__';
import { AppStateClass } from 'ui/state_management/app_state';
import { DashboardAppState } from './types';
-import { Timefilter, TimeRange } from 'ui/timefilter';
+import { TimeRange } from 'src/plugins/data/public';
+import { Timefilter } from 'ui/timefilter';
import { ViewMode } from '../../../embeddable_api/public/np_ready/public';
describe('DashboardState', function() {
diff --git a/src/legacy/core_plugins/kibana/public/dashboard/lib/update_saved_dashboard.ts b/src/legacy/core_plugins/kibana/public/dashboard/lib/update_saved_dashboard.ts
index 93f487ba6d502..707b5a0f5f5f5 100644
--- a/src/legacy/core_plugins/kibana/public/dashboard/lib/update_saved_dashboard.ts
+++ b/src/legacy/core_plugins/kibana/public/dashboard/lib/update_saved_dashboard.ts
@@ -19,7 +19,8 @@
import _ from 'lodash';
import { AppState } from 'ui/state_management/app_state';
-import { Timefilter, RefreshInterval } from 'ui/timefilter';
+import { Timefilter } from 'ui/timefilter';
+import { RefreshInterval } from 'src/plugins/data/public';
import { FilterUtils } from './filter_utils';
import { SavedObjectDashboard } from '../saved_dashboard/saved_dashboard';
diff --git a/src/legacy/core_plugins/kibana/public/dashboard/listing/dashboard_listing.js b/src/legacy/core_plugins/kibana/public/dashboard/listing/dashboard_listing.js
index a8cd8ffcb77f9..d8216361562e2 100644
--- a/src/legacy/core_plugins/kibana/public/dashboard/listing/dashboard_listing.js
+++ b/src/legacy/core_plugins/kibana/public/dashboard/listing/dashboard_listing.js
@@ -19,14 +19,10 @@
import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
-import { injectI18n, FormattedMessage } from '@kbn/i18n/react';
+import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
-import {
- EuiLink,
- EuiButton,
- EuiEmptyPrompt,
-} from '@elastic/eui';
+import { EuiLink, EuiButton, EuiEmptyPrompt } from '@elastic/eui';
import { TableListView } from './../../table_list_view';
@@ -37,8 +33,7 @@ export const EMPTY_FILTER = '';
// and not supporting server-side paging.
// This component does not try to tackle these problems (yet) and is just feature matching the legacy component
// TODO support server side sorting/paging once title and description are sortable on the server.
-class DashboardListingUi extends React.Component {
-
+export class DashboardListing extends React.Component {
constructor(props) {
super(props);
}
@@ -54,21 +49,15 @@ class DashboardListingUi extends React.Component {
listingLimit={this.props.listingLimit}
initialFilter={this.props.initialFilter}
noItemsFragment={this.getNoItemsMessage()}
- entityName={
- i18n.translate('kbn.dashboard.listing.table.entityName', {
- defaultMessage: 'dashboard'
- })
- }
- entityNamePlural={
- i18n.translate('kbn.dashboard.listing.table.entityNamePlural', {
- defaultMessage: 'dashboards'
- })
- }
- tableListTitle={
- i18n.translate('kbn.dashboard.listing.dashboardsTitle', {
- defaultMessage: 'Dashboards'
- })
- }
+ entityName={i18n.translate('kbn.dashboard.listing.table.entityName', {
+ defaultMessage: 'dashboard',
+ })}
+ entityNamePlural={i18n.translate('kbn.dashboard.listing.table.entityNamePlural', {
+ defaultMessage: 'dashboards',
+ })}
+ tableListTitle={i18n.translate('kbn.dashboard.listing.dashboardsTitle', {
+ defaultMessage: 'Dashboards',
+ })}
/>
);
}
@@ -146,7 +135,6 @@ class DashboardListingUi extends React.Component {
/>
);
-
}
getTableColumns() {
@@ -154,7 +142,7 @@ class DashboardListingUi extends React.Component {
{
field: 'title',
name: i18n.translate('kbn.dashboard.listing.table.titleColumnName', {
- defaultMessage: 'Title'
+ defaultMessage: 'Title',
}),
sortable: true,
render: (field, record) => (
@@ -164,22 +152,22 @@ class DashboardListingUi extends React.Component {
>
{field}
- )
+ ),
},
{
field: 'description',
name: i18n.translate('kbn.dashboard.listing.table.descriptionColumnName', {
- defaultMessage: 'Description'
+ defaultMessage: 'Description',
}),
dataType: 'string',
sortable: true,
- }
+ },
];
return tableColumns;
}
}
-DashboardListingUi.propTypes = {
+DashboardListing.propTypes = {
createItem: PropTypes.func.isRequired,
findItems: PropTypes.func.isRequired,
deleteItems: PropTypes.func.isRequired,
@@ -190,8 +178,6 @@ DashboardListingUi.propTypes = {
initialFilter: PropTypes.string,
};
-DashboardListingUi.defaultProps = {
+DashboardListing.defaultProps = {
initialFilter: EMPTY_FILTER,
};
-
-export const DashboardListing = injectI18n(DashboardListingUi);
diff --git a/src/legacy/core_plugins/kibana/public/dashboard/listing/dashboard_listing.test.js b/src/legacy/core_plugins/kibana/public/dashboard/listing/dashboard_listing.test.js
index 866cc7300310d..57de395525e1b 100644
--- a/src/legacy/core_plugins/kibana/public/dashboard/listing/dashboard_listing.test.js
+++ b/src/legacy/core_plugins/kibana/public/dashboard/listing/dashboard_listing.test.js
@@ -17,63 +17,54 @@
* under the License.
*/
-jest.mock('ui/notify',
+jest.mock(
+ 'ui/notify',
() => ({
toastNotifications: {
addWarning: () => {},
- }
- }), { virtual: true });
+ },
+ }),
+ { virtual: true }
+);
-jest.mock('lodash',
+jest.mock(
+ 'lodash',
() => ({
...require.requireActual('lodash'),
// mock debounce to fire immediately with no internal timer
- debounce: function (func) {
+ debounce: func => {
function debounced(...args) {
return func.apply(this, args);
}
return debounced;
- }
- }), { virtual: true });
+ },
+ }),
+ { virtual: true }
+);
import React from 'react';
-import { shallowWithIntl } from 'test_utils/enzyme_helpers';
+import { shallow } from 'enzyme';
-import {
- DashboardListing,
-} from './dashboard_listing';
+import { DashboardListing } from './dashboard_listing';
-const find = (num) => {
+const find = num => {
const hits = [];
for (let i = 0; i < num; i++) {
hits.push({
id: `dashboard${i}`,
title: `dashboard${i} title`,
- description: `dashboard${i} desc`
+ description: `dashboard${i} desc`,
});
}
return Promise.resolve({
total: num,
- hits: hits
+ hits: hits,
});
};
test('renders empty page in before initial fetch to avoid flickering', () => {
- const component = shallowWithIntl(
- = {
- visualizations,
+ visualizations: setupVisualizations,
data: npSetup.plugins.data,
};
diff --git a/src/legacy/core_plugins/metrics/public/lib/create_brush_handler.js b/src/legacy/core_plugins/metrics/public/lib/create_brush_handler.js
index 4bd3bd641e9a6..0a7b10ff1aabb 100644
--- a/src/legacy/core_plugins/metrics/public/lib/create_brush_handler.js
+++ b/src/legacy/core_plugins/metrics/public/lib/create_brush_handler.js
@@ -19,10 +19,12 @@
import moment from 'moment';
-export const brushHandler = timefilter => ranges => {
+const TIME_MODE = 'absolute';
+
+export const createBrushHandler = timefilter => (from, to) => {
timefilter.setTime({
- from: moment(ranges.xaxis.from).toISOString(),
- to: moment(ranges.xaxis.to).toISOString(),
- mode: 'absolute',
+ from: moment(from).toISOString(),
+ to: moment(to).toISOString(),
+ mode: TIME_MODE,
});
};
diff --git a/src/legacy/core_plugins/metrics/public/lib/__tests__/create_brush_handler.test.js b/src/legacy/core_plugins/metrics/public/lib/create_brush_handler.test.js
similarity index 65%
rename from src/legacy/core_plugins/metrics/public/lib/__tests__/create_brush_handler.test.js
rename to src/legacy/core_plugins/metrics/public/lib/create_brush_handler.test.js
index f78ed52ea52a4..76d88b6b8dfb9 100644
--- a/src/legacy/core_plugins/metrics/public/lib/__tests__/create_brush_handler.test.js
+++ b/src/legacy/core_plugins/metrics/public/lib/create_brush_handler.test.js
@@ -17,14 +17,12 @@
* under the License.
*/
-import { brushHandler } from '../create_brush_handler';
+import { createBrushHandler } from './create_brush_handler';
import moment from 'moment';
-import { expect } from 'chai';
describe('brushHandler', () => {
let mockTimefilter;
let onBrush;
- let range;
beforeEach(() => {
mockTimefilter = {
@@ -33,14 +31,15 @@ describe('brushHandler', () => {
this.time = time;
},
};
- onBrush = brushHandler(mockTimefilter);
+ onBrush = createBrushHandler(mockTimefilter);
});
- test('returns brushHandler() that updates timefilter', () => {
- range = { xaxis: { from: '2017-01-01T00:00:00Z', to: '2017-01-01T00:10:00Z' } };
- onBrush(range);
- expect(mockTimefilter.time.from).to.equal(moment(range.xaxis.from).toISOString());
- expect(mockTimefilter.time.to).to.equal(moment(range.xaxis.to).toISOString());
- expect(mockTimefilter.time.mode).to.equal('absolute');
+ it('returns brushHandler() that updates timefilter', () => {
+ const from = '2017-01-01T00:00:00Z';
+ const to = '2017-01-01T00:10:00Z';
+ onBrush(from, to);
+ expect(mockTimefilter.time.from).toEqual(moment(from).toISOString());
+ expect(mockTimefilter.time.to).toEqual(moment(to).toISOString());
+ expect(mockTimefilter.time.mode).toEqual('absolute');
});
});
diff --git a/src/legacy/core_plugins/metrics/public/metrics_type.ts b/src/legacy/core_plugins/metrics/public/metrics_type.ts
index 35182fbe25265..00f54a90b3b0f 100644
--- a/src/legacy/core_plugins/metrics/public/metrics_type.ts
+++ b/src/legacy/core_plugins/metrics/public/metrics_type.ts
@@ -22,7 +22,7 @@ import { i18n } from '@kbn/i18n';
// @ts-ignore
import { defaultFeedbackMessage } from 'ui/vis/default_feedback_message';
-import { visFactory } from '../../visualizations/public';
+import { visFactory } from '../../visualizations/public/np_ready/public';
// @ts-ignore
import { createMetricsRequestHandler } from './request_handler';
diff --git a/src/legacy/core_plugins/metrics/public/plugin.ts b/src/legacy/core_plugins/metrics/public/plugin.ts
index e1eca37970604..5c103a3ae4b08 100644
--- a/src/legacy/core_plugins/metrics/public/plugin.ts
+++ b/src/legacy/core_plugins/metrics/public/plugin.ts
@@ -18,7 +18,7 @@
*/
import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from '../../../../core/public';
import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public';
-import { VisualizationsSetup } from '../../visualizations/public';
+import { VisualizationsSetup } from '../../visualizations/public/np_ready/public';
import { createMetricsFn } from './metrics_fn';
import { createMetricsTypeDefinition } from './metrics_type';
@@ -39,7 +39,7 @@ export class MetricsPlugin implements Plugin, void> {
public async setup(core: CoreSetup, { data, visualizations }: MetricsPluginSetupDependencies) {
data.expressions.registerFunction(createMetricsFn);
- visualizations.types.VisTypesRegistryProvider.register(createMetricsTypeDefinition);
+ visualizations.types.registerVisualization(createMetricsTypeDefinition);
}
public start(core: CoreStart) {
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/_legend.scss b/src/legacy/core_plugins/metrics/public/visualizations/components/_legend.scss
deleted file mode 100644
index 429e7c682f21e..0000000000000
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/_legend.scss
+++ /dev/null
@@ -1,92 +0,0 @@
-// LEGEND
-
-.tvbLegend {
- @include euiFontSizeXS;
- display: flex;
- width: 200px;
- padding: $euiSizeXS 0;
- overflow: auto;
-}
-
-.tvbLegend__toggle {
- align-self: flex-start;
- color: $tvbValueColor;
-
- .tvbVisTimeSeries--reversed & {
- color: $tvbValueColorReversed;
- }
-}
-
-.tvbLegend__series {
- flex-grow: 1;
-}
-
-.tvbLegend__item {
- cursor: pointer;
- padding: $euiSizeXS;
- border-bottom: 1px solid $tvbLineColor;
- display: flex;
- max-width: 170px;
-
- &.disabled {
- opacity: .5;
- }
-
- &:first-child {
- border-top: 1px solid $tvbLineColor;
- }
-
- .tvbVisTimeSeries--reversed & {
- border-color: $tvbLineColorReversed;
- }
-}
-
-.tvbLegend__button {
- text-align: left;
- display: flex;
- width: 100%;
-}
-
-.tvbLegend__itemLabel {
- @include euiTextTruncate;
- flex-grow: 1;
-
- span {
- color: $euiTextColor;
- margin-left: $euiSizeXS;
-
- .tvbVisTimeSeries--reversed & {
- color: $tvbTextColorReversed;
- }
- }
-}
-
-.tvbLegend__itemValue {
- font-weight: $euiFontWeightSemiBold;
- color: $tvbValueColor;
- margin-left: $euiSizeXS;
-
- .tvbVisTimeSeries--reversed & {
- color: $tvbValueColorReversed;
- }
-}
-
-.tvbLegend--horizontal {
- width: auto;
- display: flex;
-
- .tvbLegend__series {
- display: flex;
- flex-wrap: wrap;
- }
-
- .tvbLegend__item {
- max-width: inherit;
- margin-right: $euiSizeM;
- border: none;
- }
-
- .tvbLegend__itemLabel {
- flex: 0 1 auto;
- }
-}
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/_timeseries_chart.scss b/src/legacy/core_plugins/metrics/public/visualizations/components/_timeseries_chart.scss
deleted file mode 100644
index 7bda2cc78e05b..0000000000000
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/_timeseries_chart.scss
+++ /dev/null
@@ -1,132 +0,0 @@
-@import '@elastic/eui/src/components/tool_tip/variables';
-@import '@elastic/eui/src/components/tool_tip/mixins';
-
-.tvbVisTimeSeries {
- position: relative;
- display: flex;
- flex-direction: column;
- flex: 1 0 auto;
-}
-
-.tvbVisTimeSeries__content {
- position: absolute;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- display: flex;
- flex: 1 0 auto;
- // TODO: Remove once tooltips are portaled
- overflow: visible; // Ensures the tooltip doesn't cause scrollbars
-}
-
-.tvbVisTimeSeries__visualization {
- cursor: crosshair;
- display: flex;
- flex-direction: column;
- flex: 1 0 auto;
- position: relative;
-
- > .tvbVisTimeSeries__container {
- min-width: 1px;
- width: 100%;
- height: 100%;
- }
-}
-
-.tvbVisTimeSeries__container {
- @include euiFontSizeXS;
- position: relative;
- display: flex;
- flex-direction: column;
- flex: 1 0 auto;
-}
-
-.tvbVisTimeSeries__axisLabel {
- font-weight: $euiFontWeightBold;
- color: $tvbTextColor;
- text-align: center;
- min-height: 1.2em;
-
- &.tvbVisTimeSeries__axisLabel--reversed {
- color: $tvbTextColorReversed;
- }
-}
-
-// TOOLTIP
-
-// EUITODO: Use EuiTooltip or somehow portal the current one
-.tvbTooltip__container {
- pointer-events: none;
- position: absolute;
- z-index: $euiZLevel9;
- display: flex;
- align-items: center;
- padding: 0 $euiSizeS;
- transform: translate(0, -50%);
-}
-
-.tvbTooltip__container--right {
- flex-direction: row-reverse;
-}
-
-.tvbTooltip {
- @include euiToolTipStyle;
- @include euiFontSizeXS;
- padding: $euiSizeS;
-}
-
-.tvbTooltip__caret {
- $tempArrowSize: $euiSizeM;
- width: $tempArrowSize;
- height: $tempArrowSize;
- border-radius: $euiBorderRadius / 2;
- background-color: tintOrShade($euiColorFullShade, 25%, 90%);
- transform-origin: center;
- transform: rotateZ(45deg);
-
- .tvbTooltip__container--left & {
- margin-right: (($tempArrowSize/2) + 1px) * -1;
- }
-
- .tvbTooltip__container--right & {
- margin-left: (($tempArrowSize/2) + 1px) * -1;
- }
-}
-
-.tvbTooltip__item {
- display: flex;
-}
-
-/**
- * 1. Ensure tvbTooltip__label text wraps nicely.
- * 2. Create consistent space between the dot icon and the label.
- */
-.tvbTooltip__labelContainer {
- display: flex;
- flex-wrap: wrap;
- flex-grow: 1;
- min-width: 1px; /* 1 */
- margin-left: $euiSizeXS; /* 2 */
-}
-
-/**
- * 1. Ensure text wraps nicely.
- */
-.tvbTooltip__label {
- flex-grow: 1;
- margin-right: $euiSizeXS;
- word-wrap: break-word; /* 1 */
- overflow-wrap: break-word; /* 1 */
- min-width: 1px; /* 1 */
-}
-
-.tvbTooltip__icon,
-.tvbTooltip__value {
- flex-shrink: 0;
-}
-
-.tvbTooltip__timestamp {
- color: transparentize($euiColorGhost, .3);
- white-space: nowrap;
-}
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/flot_chart.js b/src/legacy/core_plugins/metrics/public/visualizations/components/flot_chart.js
deleted file mode 100644
index bb900ee3f7b38..0000000000000
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/flot_chart.js
+++ /dev/null
@@ -1,346 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { findDOMNode } from 'react-dom';
-import _ from 'lodash';
-import $ from 'ui/flot-charts';
-import { eventBus } from '../lib/events';
-import { Resize } from './resize';
-import { calculateBarWidth } from '../lib/calculate_bar_width';
-import { calculateFillColor } from '../lib/calculate_fill_color';
-import { COLORS } from '../lib/colors';
-
-export class FlotChart extends Component {
- constructor(props) {
- super(props);
- this.handleResize = this.handleResize.bind(this);
- }
-
- shouldComponentUpdate(props) {
- if (!this.plot) return true;
- if (props.reversed !== this.props.reversed) {
- return true;
- }
-
- // if the grid changes we need to re-render
- if (props.showGrid !== this.props.showGrid) return true;
-
- if (props.yaxes && this.props.yaxes) {
- // We need to rerender if the axis change
- const valuesChanged = props.yaxes.some((axis, i) => {
- if (this.props.yaxes[i]) {
- return (
- axis.position !== this.props.yaxes[i].position ||
- axis.max !== this.props.yaxes[i].max ||
- axis.min !== this.props.yaxes[i].min ||
- axis.axisFormatter !== this.props.yaxes[i].axisFormatter ||
- axis.mode !== this.props.yaxes[i].mode ||
- axis.axisFormatterTemplate !== this.props.yaxes[i].axisFormatterTemplate
- );
- }
- });
- if (props.yaxes.length !== this.props.yaxes.length || valuesChanged) {
- return true;
- }
- }
- return false;
- }
-
- shutdownChart() {
- if (!this.plot) return;
- $(this.target).off('plothover', this.props.plothover);
- if (this.props.onMouseOver) $(this.target).off('plothover', this.handleMouseOver);
- if (this.props.onMouseLeave) $(this.target).off('mouseleave', this.handleMouseLeave);
- if (this.props.onBrush) $(this.target).off('plotselected', this.brushChart);
- this.plot.shutdown();
- if (this.props.crosshair) {
- $(this.target).off('plothover', this.handlePlotover);
- eventBus.off('thorPlotover', this.handleThorPlotover);
- eventBus.off('thorPlotleave', this.handleThorPlotleave);
- }
- }
-
- componentWillUnmount() {
- this.shutdownChart();
- }
-
- filterByShow(show) {
- if (show) {
- return metric => {
- return show.some(id => _.startsWith(id, metric.id));
- };
- }
- return () => true;
- }
-
- componentWillReceiveProps(newProps) {
- if (this.plot) {
- const { series } = newProps;
- const options = this.plot.getOptions();
- _.set(options, 'series.bars.barWidth', calculateBarWidth(series));
- _.set(options, 'xaxes[0].ticks', this.calculateTicks());
- this.plot.setData(this.calculateData(series, newProps.show));
- this.plot.setupGrid();
- this.plot.draw();
- if (!_.isEqual(this.props.series, newProps.series)) this.handleDraw(this.plot);
- } else {
- this.renderChart();
- }
- }
-
- componentDidMount() {
- this.renderChart();
- }
-
- componentDidUpdate() {
- this.shutdownChart();
- this.renderChart();
- }
-
- calculateData(data, show) {
- return _(data)
- .filter(this.filterByShow(show))
- .map(set => {
- if (_.isPlainObject(set)) {
- return {
- ...set,
- lines: this.computeColor(set.lines, set.color),
- bars: this.computeColor(set.bars, set.color),
- };
- }
- return {
- color: '#990000',
- data: set,
- };
- })
- .reverse()
- .value();
- }
-
- computeColor(style, color) {
- if (style && style.show) {
- const { fill, fillColor } = calculateFillColor(color, style.fill);
- return {
- ...style,
- fill,
- fillColor,
- };
- }
- return style;
- }
-
- handleDraw(plot) {
- if (this.props.onDraw) this.props.onDraw(plot);
- }
-
- getOptions(props) {
- const yaxes = props.yaxes || [{}];
-
- const lineColor = COLORS.lineColor;
- const textColor = props.reversed ? COLORS.textColorReversed : COLORS.textColor;
-
- const borderWidth = { bottom: 1, top: 0, left: 0, right: 0 };
-
- if (yaxes.some(y => y.position === 'left')) borderWidth.left = 1;
- if (yaxes.some(y => y.position === 'right')) borderWidth.right = 1;
-
- if (props.showGrid) {
- borderWidth.top = 1;
- borderWidth.left = 1;
- borderWidth.right = 1;
- }
-
- const opts = {
- legend: { show: false },
- yaxes: yaxes.map(axis => {
- axis.tickLength = props.showGrid ? null : 0;
- return axis;
- }),
- yaxis: {
- color: lineColor,
- font: { color: textColor, size: 11 },
- tickFormatter: props.tickFormatter,
- },
- xaxis: {
- tickLength: props.showGrid ? null : 0,
- color: lineColor,
- timezone: 'browser',
- mode: 'time',
- font: { color: textColor, size: 11 },
- ticks: this.calculateTicks(),
- },
- series: {
- shadowSize: 0,
- },
- grid: {
- margin: 0,
- borderWidth,
- borderColor: lineColor,
- hoverable: true,
- mouseActiveRadius: 200,
- },
- };
-
- if (props.crosshair) {
- _.set(opts, 'crosshair', {
- mode: 'x',
- color: '#C66',
- lineWidth: 1,
- });
- }
-
- if (props.onBrush) {
- _.set(opts, 'selection', { mode: 'x', color: textColor });
- }
-
- if (props.xAxisFormatter) {
- _.set(opts, 'xaxis.tickFormatter', props.xAxisFormatter);
- }
-
- _.set(opts, 'series.bars.barWidth', calculateBarWidth(props.series));
- return _.assign(opts, props.options);
- }
-
- calculateTicks() {
- const sample = this.props.xAxisFormatter(new Date());
- const tickLetterWidth = 7;
- const tickPadding = 45;
- const ticks = Math.floor(
- this.target.clientWidth / (sample.length * tickLetterWidth + tickPadding)
- );
- return ticks;
- }
-
- handleResize() {
- const resize = findDOMNode(this.resize);
- if (!this.rendered) {
- this.renderChart();
- return;
- }
-
- if (resize && resize.clientHeight > 0 && resize.clientHeight > 0) {
- if (!this.plot) return;
- const options = this.plot.getOptions();
- _.set(options, 'xaxes[0].ticks', this.calculateTicks());
- this.plot.resize();
- this.plot.setupGrid();
- this.plot.draw();
- this.handleDraw(this.plot);
- }
- }
-
- renderChart() {
- const resize = findDOMNode(this.resize);
-
- if (resize.clientWidth > 0 && resize.clientHeight > 0) {
- this.rendered = true;
- const { series } = this.props;
- const data = this.calculateData(series, this.props.show);
-
- this.plot = $.plot(this.target, data, this.getOptions(this.props));
- this.handleDraw(this.plot);
-
- _.defer(() => this.handleResize());
-
- this.handleMouseOver = (...args) => {
- if (this.props.onMouseOver) this.props.onMouseOver(...args, this.plot);
- };
-
- this.handleMouseLeave = (...args) => {
- if (this.props.onMouseLeave) this.props.onMouseLeave(...args, this.plot);
- };
-
- $(this.target).on('plothover', this.handleMouseOver);
- $(this.target).on('mouseleave', this.handleMouseLeave);
-
- if (this.props.crosshair) {
- this.handleThorPlotover = (e, pos, item, originalPlot) => {
- if (this.plot !== originalPlot) {
- this.plot.setCrosshair({ x: _.get(pos, 'x') });
- this.props.plothover(e, pos, item);
- }
- };
-
- this.handlePlotover = (e, pos, item) =>
- eventBus.trigger('thorPlotover', [pos, item, this.plot]);
- this.handlePlotleave = () => eventBus.trigger('thorPlotleave');
- this.handleThorPlotleave = e => {
- if (this.plot) this.plot.clearCrosshair();
- if (this.props.plothover) this.props.plothover(e);
- };
-
- $(this.target).on('plothover', this.handlePlotover);
- $(this.target).on('mouseleave', this.handlePlotleave);
- eventBus.on('thorPlotover', this.handleThorPlotover);
- eventBus.on('thorPlotleave', this.handleThorPlotleave);
- }
-
- if (_.isFunction(this.props.plothover)) {
- $(this.target).bind('plothover', this.props.plothover);
- }
-
- $(this.target).on('mouseleave', () => {
- eventBus.trigger('thorPlotleave');
- });
-
- if (_.isFunction(this.props.onBrush)) {
- this.brushChart = (e, ranges) => {
- this.props.onBrush(ranges);
- this.plot.clearSelection();
- };
-
- $(this.target).on('plotselected', this.brushChart);
- }
- }
- }
-
- render() {
- return (
- (this.resize = el)}
- className="tvbVisTimeSeries__container"
- >
-
+
);
}
}
-
-TimeseriesVisualization.propTypes = {
- backgroundColor: PropTypes.string,
- className: PropTypes.string,
- model: PropTypes.object,
- onBrush: PropTypes.func,
- onChange: PropTypes.func,
- visData: PropTypes.object,
- dateFormat: PropTypes.string,
- getConfig: PropTypes.func,
-};
diff --git a/src/legacy/core_plugins/metrics/public/components/vis_types/top_n/vis.js b/src/legacy/core_plugins/metrics/public/components/vis_types/top_n/vis.js
index 57de7f018f134..7d09f33acdecc 100644
--- a/src/legacy/core_plugins/metrics/public/components/vis_types/top_n/vis.js
+++ b/src/legacy/core_plugins/metrics/public/components/vis_types/top_n/vis.js
@@ -17,8 +17,8 @@
* under the License.
*/
-import { tickFormatter } from '../../lib/tick_formatter';
-import { TopN } from '../../../visualizations/components/top_n';
+import { createTickFormatter } from '../../lib/tick_formatter';
+import { TopN } from '../../../visualizations/views/top_n';
import { getLastValue } from '../../../../common/get_last_value';
import { isBackgroundInverted } from '../../../../common/set_is_reversed';
import { replaceVars } from '../../lib/replace_vars';
@@ -54,7 +54,7 @@ export function TopNVisualization(props) {
const id = first(item.id.split(/:/));
const seriesConfig = model.series.find(s => s.id === id);
if (seriesConfig) {
- const formatter = tickFormatter(
+ const tickFormatter = createTickFormatter(
seriesConfig.formatter,
seriesConfig.value_template,
props.getConfig
@@ -73,7 +73,7 @@ export function TopNVisualization(props) {
return {
...item,
color,
- tickFormatter: formatter,
+ tickFormatter,
};
}
return item;
diff --git a/src/legacy/core_plugins/metrics/public/index.scss b/src/legacy/core_plugins/metrics/public/index.scss
index 5083c5156be23..86fbfb52dbe64 100644
--- a/src/legacy/core_plugins/metrics/public/index.scss
+++ b/src/legacy/core_plugins/metrics/public/index.scss
@@ -17,4 +17,4 @@
@import './components/index';
// Visualizations
-@import './visualizations/components/index';
+@import './visualizations/views/index';
diff --git a/src/legacy/core_plugins/metrics/public/legacy.ts b/src/legacy/core_plugins/metrics/public/legacy.ts
index 49420e4b51273..8dc24503772db 100644
--- a/src/legacy/core_plugins/metrics/public/legacy.ts
+++ b/src/legacy/core_plugins/metrics/public/legacy.ts
@@ -20,12 +20,12 @@
import { PluginInitializerContext } from 'kibana/public';
import { npSetup, npStart } from 'ui/new_platform';
-import { visualizations } from '../../visualizations/public';
+import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy';
import { MetricsPluginSetupDependencies } from './plugin';
import { plugin } from '.';
const plugins: Readonly (this.target = el)} className="tvbVisTimeSeries__container" />
-
- );
- }
-}
-
-FlotChart.defaultProps = {
- showGrid: true,
-};
-
-FlotChart.propTypes = {
- crosshair: PropTypes.bool,
- onBrush: PropTypes.func,
- onPlotCreate: PropTypes.func,
- onMouseOver: PropTypes.func,
- onMouseLeave: PropTypes.func,
- options: PropTypes.object,
- plothover: PropTypes.func,
- reversed: PropTypes.bool,
- series: PropTypes.array,
- show: PropTypes.array,
- tickFormatter: PropTypes.func,
- showGrid: PropTypes.bool,
- yaxes: PropTypes.array,
-};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/horizontal_legend.js b/src/legacy/core_plugins/metrics/public/visualizations/components/horizontal_legend.js
deleted file mode 100644
index 3bdb904d8d9c1..0000000000000
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/horizontal_legend.js
+++ /dev/null
@@ -1,80 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import PropTypes from 'prop-types';
-import React from 'react';
-import { createLegendSeries } from '../lib/create_legend_series';
-import reactcss from 'reactcss';
-import { htmlIdGenerator, EuiButtonIcon } from '@elastic/eui';
-import { injectI18n } from '@kbn/i18n/react';
-
-export const HorizontalLegend = injectI18n(function(props) {
- const rows = props.series.map(createLegendSeries(props));
- const htmlId = htmlIdGenerator();
- const styles = reactcss(
- {
- hideLegend: {
- legend: {
- display: 'none',
- },
- },
- },
- { hideLegend: !props.showLegend }
- );
-
- let legendToggleIcon = 'arrowDown';
- if (!props.showLegend) {
- legendToggleIcon = 'arrowUp';
- }
- return (
- "rgb(0, 156, 224)",
+ }
+ }
+ data={
+ Array [
+ Array [
+ 1556917200000,
+ 7,
+ ],
+ Array [
+ 1557003600000,
+ 9,
+ ],
+ ]
+ }
+ enableHistogramMode={true}
+ groupId="groupId:yaxis_main_group"
+ hideInLegend={false}
+ histogramModeAlignment="center"
+ id="id:61ca57f1-469d-11e7-af02-69e470af7417:Rome"
+ name="Rome"
+ stackAsPercentage={false}
+ timeZone="local"
+ xAccessor={0}
+ xScaleType="time"
+ yAccessors={
+ Array [
+ 1,
+ ]
+ }
+ yScaleType="linear"
+/>
+`;
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/decorators/__snapshots__/bar_decorator.test.js.snap b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/decorators/__snapshots__/bar_decorator.test.js.snap
new file mode 100644
index 0000000000000..78133f2dda7cc
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/decorators/__snapshots__/bar_decorator.test.js.snap
@@ -0,0 +1,55 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/decorators/bar_decorator.js "rgb(0, 156, 224)",
+ }
+ }
+ data={
+ Array [
+ Array [
+ 1556917200000,
+ 7,
+ ],
+ Array [
+ 1557003600000,
+ 9,
+ ],
+ ]
+ }
+ enableHistogramMode={true}
+ groupId="groupId:yaxis_main_group"
+ hideInLegend={false}
+ histogramModeAlignment="center"
+ id="id:61ca57f1-469d-11e7-af02-69e470af7417:Rome"
+ name="Rome"
+ stackAsPercentage={false}
+ timeZone="local"
+ xAccessor={0}
+ xScaleType="time"
+ yAccessors={
+ Array [
+ 1,
+ ]
+ }
+ yScaleType="linear"
+/>
+`;
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/decorators/area_decorator.js b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/decorators/area_decorator.js
new file mode 100644
index 0000000000000..536064139e6ea
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/decorators/area_decorator.js
@@ -0,0 +1,81 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import React from 'react';
+import { getSpecId, getGroupId, ScaleType, AreaSeries } from '@elastic/charts';
+import { getSeriesColors, getAreaStyles } from '../utils/series_styles';
+import { ChartsEntities } from '../model/charts';
+import { X_ACCESSOR_INDEX, Y_ACCESSOR_INDEXES } from '../../../constants';
+
+export function AreaSeriesDecorator({
+ seriesId,
+ seriesGroupId,
+ name,
+ data,
+ hideInLegend,
+ lines,
+ color,
+ stackAccessors,
+ stackAsPercentage,
+ points,
+ xScaleType,
+ yScaleType,
+ timeZone,
+ enableHistogramMode,
+ useDefaultGroupDomain,
+ sortIndex,
+}) {
+ const id = getSpecId(seriesId);
+ const groupId = getGroupId(seriesGroupId);
+ const customSeriesColors = getSeriesColors(color, id);
+ const areaSeriesStyle = getAreaStyles({ points, lines, color });
+
+ const seriesSettings = {
+ id,
+ name,
+ groupId,
+ data,
+ customSeriesColors,
+ hideInLegend,
+ xAccessor: X_ACCESSOR_INDEX,
+ yAccessors: Y_ACCESSOR_INDEXES,
+ stackAccessors,
+ stackAsPercentage,
+ xScaleType,
+ yScaleType,
+ timeZone,
+ enableHistogramMode,
+ useDefaultGroupDomain,
+ sortIndex,
+ ...areaSeriesStyle,
+ };
+
+ if (enableHistogramMode) {
+ seriesSettings.histogramModeAlignment = 'center';
+ }
+
+ return
+
+ );
+};
+
+TimeSeries.defaultProps = {
+ showGrid: true,
+ legend: true,
+ legendPosition: 'right',
+};
+
+TimeSeries.propTypes = {
+ isDarkMode: PropTypes.bool,
+ showGrid: PropTypes.bool,
+ legend: PropTypes.bool,
+ legendPosition: PropTypes.string,
+ xAxisLabel: PropTypes.string,
+ series: PropTypes.array,
+ yAxis: PropTypes.array,
+ onBrush: PropTypes.func,
+ xAxisFormatter: PropTypes.func,
+ annotations: PropTypes.array,
+ enableHistogramMode: PropTypes.bool.isRequired,
+};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/model/__snapshots__/charts.test.js.snap b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/model/__snapshots__/charts.test.js.snap
new file mode 100644
index 0000000000000..541265c05057a
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/model/__snapshots__/charts.test.js.snap
@@ -0,0 +1,41 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/model/charts.js ChartsEntities should match a snapshot of ChartsEntities 1`] = `
+Object {
+ "AreaChart": Object {
+ "color": [Function],
+ "data": [Function],
+ "enableHistogramMode": [Function],
+ "hideInLegend": [Function],
+ "lines": [Function],
+ "name": [Function],
+ "points": [Function],
+ "seriesGroupId": [Function],
+ "seriesId": [Function],
+ "sortIndex": [Function],
+ "stackAccessors": [Function],
+ "stackAsPercentage": [Function],
+ "timeZone": [Function],
+ "useDefaultGroupDomain": [Function],
+ "xScaleType": [Function],
+ "yScaleType": [Function],
+ },
+ "BarChart": Object {
+ "bars": [Function],
+ "color": [Function],
+ "data": [Function],
+ "enableHistogramMode": [Function],
+ "hideInLegend": [Function],
+ "name": [Function],
+ "seriesGroupId": [Function],
+ "seriesId": [Function],
+ "sortIndex": [Function],
+ "stackAccessors": [Function],
+ "stackAsPercentage": [Function],
+ "timeZone": [Function],
+ "useDefaultGroupDomain": [Function],
+ "xScaleType": [Function],
+ "yScaleType": [Function],
+ },
+}
+`;
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/model/charts.js b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/model/charts.js
new file mode 100644
index 0000000000000..b14b84dcd1fe4
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/model/charts.js
@@ -0,0 +1,70 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import PropTypes from 'prop-types';
+
+const Chart = {
+ seriesId: PropTypes.string.isRequired,
+ seriesGroupId: PropTypes.string.isRequired,
+ name: PropTypes.string.isRequired,
+ /**
+ * @example
+ * [[1556917200000, 6], [1556231200000, 16]]
+ */
+ data: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.number)).isRequired,
+ hideInLegend: PropTypes.bool.isRequired,
+ color: PropTypes.string.isRequired,
+ stackAsPercentage: PropTypes.bool.isRequired,
+ stackAccessors: PropTypes.arrayOf(PropTypes.number),
+ xScaleType: PropTypes.string,
+ yScaleType: PropTypes.string,
+ timeZone: PropTypes.string.isRequired,
+ enableHistogramMode: PropTypes.bool.isRequired,
+ useDefaultGroupDomain: PropTypes.bool,
+ sortIndex: PropTypes.number,
+};
+
+const BarChart = {
+ ...Chart,
+ bars: PropTypes.shape({
+ fill: PropTypes.number,
+ lineWidth: PropTypes.number,
+ show: PropTypes.boolean,
+ }).isRequired,
+};
+
+const AreaChart = {
+ ...Chart,
+ lines: PropTypes.shape({
+ fill: PropTypes.number,
+ lineWidth: PropTypes.number,
+ show: PropTypes.bool,
+ steps: PropTypes.oneOfType([PropTypes.number, PropTypes.bool]),
+ }).isRequired,
+ points: PropTypes.shape({
+ lineWidth: PropTypes.number,
+ radius: PropTypes.number,
+ show: PropTypes.bool,
+ }).isRequired,
+};
+
+export const ChartsEntities = {
+ BarChart,
+ AreaChart,
+};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/model/charts.test.js b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/model/charts.test.js
new file mode 100644
index 0000000000000..80bc78111ca03
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/model/charts.test.js
@@ -0,0 +1,28 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { ChartsEntities } from './charts';
+
+describe('src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/model/charts.js', () => {
+ describe('ChartsEntities', () => {
+ test('should match a snapshot of ChartsEntities', () => {
+ expect(ChartsEntities).toMatchSnapshot();
+ });
+ });
+});
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/__snapshots__/series_styles.test.js.snap b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/__snapshots__/series_styles.test.js.snap
new file mode 100644
index 0000000000000..607580d1f37f8
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/__snapshots__/series_styles.test.js.snap
@@ -0,0 +1,90 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.js getAreaStyles() should match a snapshot 1`] = `
+Object {
+ "areaSeriesStyle": Object {
+ "area": Object {
+ "fill": "rgb(224, 0, 221)",
+ "opacity": 0,
+ "visible": true,
+ },
+ "line": Object {
+ "stroke": "rgb(224, 0, 221)",
+ "strokeWidth": 1,
+ "visible": true,
+ },
+ "point": Object {
+ "radius": 1,
+ "stroke": "rgb(224, 0, 221)",
+ "strokeWidth": 1,
+ "visible": true,
+ },
+ },
+ "curve": 6,
+}
+`;
+
+exports[`src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.js getAreaStyles() should set default values if points, lines and color are empty 1`] = `
+Object {
+ "areaSeriesStyle": Object {
+ "area": Object {
+ "fill": "",
+ "opacity": undefined,
+ "visible": false,
+ },
+ "line": Object {
+ "stroke": "",
+ "strokeWidth": 0,
+ "visible": false,
+ },
+ "point": Object {
+ "radius": 0.5,
+ "stroke": "#000",
+ "strokeWidth": 5,
+ "visible": false,
+ },
+ },
+ "curve": 9,
+}
+`;
+
+exports[`src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.js getBarStyles() should match a snapshot 1`] = `
+Object {
+ "barSeriesStyle": Object {
+ "rect": Object {
+ "fill": "rgb(224, 0, 221)",
+ "opacity": 0.5,
+ },
+ "rectBorder": Object {
+ "stroke": "rgb(224, 0, 221)",
+ "strokeWidth": 2,
+ "visible": true,
+ },
+ },
+}
+`;
+
+exports[`src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.js getBarStyles() should set default values if bars and colors are empty 1`] = `
+Object {
+ "barSeriesStyle": Object {
+ "rect": Object {
+ "fill": "#000",
+ "opacity": 1,
+ },
+ "rectBorder": Object {
+ "stroke": "#000",
+ "strokeWidth": 0,
+ "visible": true,
+ },
+ },
+}
+`;
+
+exports[`src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.js getSeriesColors() should match a snapshot 1`] = `
+Map {
+ Object {
+ "colorValues": Array [],
+ "specId": "IT",
+ } => "rgb(224, 0, 221)",
+}
+`;
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.js b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.js
new file mode 100644
index 0000000000000..63be14790c6c5
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.js
@@ -0,0 +1,67 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { CurveType } from '@elastic/charts';
+
+const DEFAULT_COLOR = '#000';
+
+export const getAreaStyles = ({ points, lines, color }) => ({
+ areaSeriesStyle: {
+ line: {
+ stroke: color,
+ strokeWidth: Number(lines.lineWidth) || 0,
+ visible: Boolean(lines.show && lines.lineWidth),
+ },
+ area: {
+ fill: color,
+ opacity: lines.fill <= 0 ? 0 : lines.fill,
+ visible: Boolean(lines.show),
+ },
+ point: {
+ radius: points.radius || 0.5,
+ stroke: color || DEFAULT_COLOR,
+ strokeWidth: points.lineWidth || 5,
+ visible: points.lineWidth > 0 && Boolean(points.show),
+ },
+ },
+ curve: lines.steps ? CurveType.CURVE_STEP : CurveType.LINEAR,
+});
+
+export const getBarStyles = ({ show = true, lineWidth = 0, fill = 1 }, color) => ({
+ barSeriesStyle: {
+ rectBorder: {
+ stroke: color || DEFAULT_COLOR,
+ strokeWidth: lineWidth,
+ visible: show,
+ },
+ rect: {
+ fill: color || DEFAULT_COLOR,
+ opacity: fill,
+ },
+ },
+});
+
+export const getSeriesColors = (color, specId) => {
+ const map = new Map();
+ const seriesColorsValues = { specId, colorValues: [] };
+
+ map.set(seriesColorsValues, color);
+
+ return map;
+};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.test.js b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.test.js
new file mode 100644
index 0000000000000..ac0a7610f2660
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.test.js
@@ -0,0 +1,82 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { getBarStyles, getSeriesColors, getAreaStyles } from './series_styles';
+
+describe('src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/series_styles.js', () => {
+ let bars;
+ let color;
+ let specId;
+ let points;
+ let lines;
+
+ beforeEach(() => {
+ bars = {
+ fill: 0.5,
+ lineWidth: 2,
+ show: true,
+ };
+ color = 'rgb(224, 0, 221)';
+ specId = 'IT';
+ points = {
+ lineWidth: 1,
+ show: true,
+ radius: 1,
+ };
+ lines = {
+ fill: 0,
+ lineWidth: 1,
+ show: true,
+ steps: true,
+ };
+ });
+
+ describe('getBarStyles()', () => {
+ test('should match a snapshot', () => {
+ expect(getBarStyles(bars, color)).toMatchSnapshot();
+ });
+
+ test('should set default values if bars and colors are empty', () => {
+ bars = {};
+ color = '';
+
+ expect(getBarStyles(bars, color)).toMatchSnapshot();
+ });
+ });
+
+ describe('getSeriesColors()', () => {
+ test('should match a snapshot', () => {
+ expect(getSeriesColors(color, specId)).toMatchSnapshot();
+ });
+ });
+
+ describe('getAreaStyles()', () => {
+ test('should match a snapshot', () => {
+ expect(getAreaStyles({ points, lines, color })).toMatchSnapshot();
+ });
+
+ test('should set default values if points, lines and color are empty', () => {
+ points = {};
+ lines = {};
+ color = '';
+
+ expect(getAreaStyles({ points, lines, color })).toMatchSnapshot();
+ });
+ });
+});
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/stack_format.js b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/stack_format.js
new file mode 100644
index 0000000000000..20c655c995a5e
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/stack_format.js
@@ -0,0 +1,31 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { STACK_ACCESSORS, STACKED_OPTIONS } from '../../../constants';
+
+export const getStackAccessors = stack => {
+ switch (stack) {
+ case STACKED_OPTIONS.STACKED:
+ case STACKED_OPTIONS.STACKED_WITHIN_SERIES:
+ case STACKED_OPTIONS.PERCENT:
+ return STACK_ACCESSORS;
+ default:
+ return undefined;
+ }
+};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/lib/__tests__/calcualte_bar_width.test.js b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/stack_format.test.js
similarity index 50%
rename from src/legacy/core_plugins/metrics/public/visualizations/lib/__tests__/calcualte_bar_width.test.js
rename to src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/stack_format.test.js
index bf5fd0174e96b..aecdb9324d958 100644
--- a/src/legacy/core_plugins/metrics/public/visualizations/lib/__tests__/calcualte_bar_width.test.js
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/stack_format.test.js
@@ -17,17 +17,21 @@
* under the License.
*/
-import { expect } from 'chai';
-import { calculateBarWidth } from '../calculate_bar_width';
+import { getStackAccessors } from './stack_format';
+import { X_ACCESSOR_INDEX, STACKED_OPTIONS } from '../../../constants';
-describe('calculateBarWidth(series, divisor, multiplier)', () => {
- it('returns default bar width', () => {
- const series = [{ data: [[100, 100], [200, 100]] }];
- expect(calculateBarWidth(series)).to.equal(70);
- });
+describe('src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/utils/stack_format.js', () => {
+ describe('getStackAccessors()', () => {
+ test('should return an accessor if the stack is stacked', () => {
+ expect(getStackAccessors(STACKED_OPTIONS.STACKED)).toEqual([X_ACCESSOR_INDEX]);
+ });
+
+ test('should return an accessor if the stack is percent', () => {
+ expect(getStackAccessors(STACKED_OPTIONS.PERCENT)).toEqual([X_ACCESSOR_INDEX]);
+ });
- it('returns custom bar width', () => {
- const series = [{ data: [[100, 100], [200, 100]] }];
- expect(calculateBarWidth(series, 2)).to.equal(200);
+ test('should return undefined if the stack does not match with STACKED and PERCENT', () => {
+ expect(getStackAccessors(STACKED_OPTIONS.NONE)).toBeUndefined();
+ });
});
});
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/top_n.js b/src/legacy/core_plugins/metrics/public/visualizations/views/top_n.js
similarity index 63%
rename from src/legacy/core_plugins/metrics/public/visualizations/components/top_n.js
rename to src/legacy/core_plugins/metrics/public/visualizations/views/top_n.js
index ea8f795b7620d..5734d101a09d2 100644
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/top_n.js
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/top_n.js
@@ -22,6 +22,12 @@ import React, { Component } from 'react';
import { getLastValue } from '../../../common/get_last_value';
import reactcss from 'reactcss';
+const RENDER_MODES = {
+ POSITIVE: 'positive',
+ NEGATIVE: 'negative',
+ MIXED: 'mixed',
+};
+
export class TopN extends Component {
constructor(props) {
super(props);
@@ -59,20 +65,61 @@ export class TopN extends Component {
};
}
- renderRow(maxValue) {
+ static getRenderMode = (min, max) => {
+ if (min >= 0) {
+ return RENDER_MODES.POSITIVE;
+ } else if (max < 0) {
+ return RENDER_MODES.NEGATIVE;
+ }
+ return RENDER_MODES.MIXED;
+ };
+
+ static calcInnerBarStyles = (renderMode, isPositive) => {
+ if (renderMode === RENDER_MODES.MIXED) {
+ return {
+ [isPositive ? 'marginLeft' : 'marginRight']: '50%',
+ };
+ }
+ return {};
+ };
+
+ static calcInnerBarDivStyles = (item, width, isPositive) => {
+ return {
+ backgroundColor: item.color,
+ width: width + '%',
+ float: isPositive ? 'left' : 'right',
+ };
+ };
+
+ static calcDomain = (renderMode, min, max) => {
+ if (renderMode === RENDER_MODES.MIXED) {
+ return Math.max(max, Math.abs(min));
+ } else if (renderMode === RENDER_MODES.NEGATIVE) {
+ return Math.abs(min);
+ }
+
+ return max;
+ };
+
+ renderRow({ min, max }) {
return item => {
+ const renderMode = TopN.getRenderMode(min, max);
const key = `${item.id || item.label}`;
const lastValue = getLastValue(item.data);
const formatter = item.tickFormatter || this.props.tickFormatter;
- const value = formatter(lastValue);
- const width = `${100 * (lastValue / maxValue)}%`;
- const backgroundColor = item.color;
+ const isPositiveValue = lastValue >= 0;
+
+ const intervalLength = TopN.calcDomain(renderMode, min, max);
+ const width = 100 * (Math.abs(lastValue) / intervalLength);
+
const styles = reactcss(
{
default: {
innerBar: {
- width,
- backgroundColor,
+ ...TopN.calcInnerBarStyles(renderMode, isPositiveValue),
+ },
+ innerBarValue: {
+ ...TopN.calcInnerBarDivStyles(item, width, isPositiveValue),
},
label: {
maxWidth: this.state.labelMaxWidth,
@@ -92,10 +139,12 @@ export class TopN extends Component {
{item.label}
-
+
- {value}
+ {formatter(lastValue)}
);
@@ -104,12 +153,20 @@ export class TopN extends Component {
render() {
if (!this.props.series) return null;
- const maxValue = this.props.series.reduce((max, series) => {
- const lastValue = getLastValue(series.data);
- return lastValue > max ? lastValue : max;
- }, 0);
- const rows = this.props.series.map(this.renderRow(maxValue));
+ const intervalSettings = this.props.series.reduce(
+ (acc, series, index) => {
+ const value = getLastValue(series.data);
+
+ return {
+ min: !index || value < acc.min ? value : acc.min,
+ max: !index || value > acc.max ? value : acc.max,
+ };
+ },
+ { min: undefined, max: undefined }
+ );
+
+ const rows = this.props.series.map(this.renderRow(intervalSettings));
let className = 'tvbVisTopN';
if (this.props.reversed) {
className += ' tvbVisTopN--reversed';
diff --git a/src/legacy/core_plugins/metrics/server/lib/vis_data/__tests__/helpers/get_default_decoration.js b/src/legacy/core_plugins/metrics/server/lib/vis_data/__tests__/helpers/get_default_decoration.js
index c9c4f24fa566c..5cc94dda6d21a 100644
--- a/src/legacy/core_plugins/metrics/server/lib/vis_data/__tests__/helpers/get_default_decoration.js
+++ b/src/legacy/core_plugins/metrics/server/lib/vis_data/__tests__/helpers/get_default_decoration.js
@@ -22,35 +22,34 @@ import { getDefaultDecoration } from '../../helpers/get_default_decoration';
describe('getDefaultDecoration', () => {
describe('stack option', () => {
- it('should set a stack option to false', () => {
+ it('should set a stack option to none', () => {
const series = {
id: 'test_id',
+ stacked: 'none',
};
- expect(getDefaultDecoration(series)).to.have.property('stack', false);
-
- series.stacked = 'none';
- expect(getDefaultDecoration(series)).to.have.property('stack', false);
+ expect(getDefaultDecoration(series)).to.have.property('stack', 'none');
});
- it('should set a stack option to true', () => {
+ it('should set a stack option to stacked/percent', () => {
const series = {
stacked: 'stacked',
id: 'test_id',
};
- expect(getDefaultDecoration(series)).to.have.property('stack', true);
+ expect(getDefaultDecoration(series)).to.have.property('stack', 'stacked');
series.stacked = 'percent';
- expect(getDefaultDecoration(series)).to.have.property('stack', true);
+
+ expect(getDefaultDecoration(series)).to.have.property('stack', 'percent');
});
- it('should set a stack option to be series id', () => {
+ it('should set a stack option to stacked_within_series', () => {
const series = {
stacked: 'stacked_within_series',
id: 'test_id',
};
- expect(getDefaultDecoration(series)).to.have.property('stack', series.id);
+ expect(getDefaultDecoration(series)).to.have.property('stack', 'stacked_within_series');
});
});
diff --git a/src/legacy/core_plugins/metrics/server/lib/vis_data/helpers/get_default_decoration.js b/src/legacy/core_plugins/metrics/server/lib/vis_data/helpers/get_default_decoration.js
index 2f3b8959d5d68..b63eb5488a755 100644
--- a/src/legacy/core_plugins/metrics/server/lib/vis_data/helpers/get_default_decoration.js
+++ b/src/legacy/core_plugins/metrics/server/lib/vis_data/helpers/get_default_decoration.js
@@ -21,21 +21,10 @@ export const getDefaultDecoration = series => {
const pointSize =
series.point_size != null ? Number(series.point_size) : Number(series.line_width);
const showPoints = series.chart_type === 'line' && pointSize !== 0;
- let stack;
- switch (series.stacked) {
- case 'stacked':
- case 'percent':
- stack = true;
- break;
- case 'stacked_within_series':
- stack = series.id;
- break;
- default:
- stack = false;
- }
return {
- stack,
+ seriesId: series.id,
+ stack: series.stacked,
lines: {
show: series.chart_type === 'line' && series.line_width !== 0,
fill: Number(series.fill),
diff --git a/src/legacy/core_plugins/metrics/server/lib/vis_data/response_processors/series/__tests__/series_agg.js b/src/legacy/core_plugins/metrics/server/lib/vis_data/response_processors/series/__tests__/series_agg.js
index 2bdcdf0fdabd3..17dbde16e306e 100644
--- a/src/legacy/core_plugins/metrics/server/lib/vis_data/response_processors/series/__tests__/series_agg.js
+++ b/src/legacy/core_plugins/metrics/server/lib/vis_data/response_processors/series/__tests__/series_agg.js
@@ -109,6 +109,7 @@ describe('seriesAgg(resp, panel, series)', () => {
color: '#F00',
label: 'Total CPU',
stack: false,
+ seriesId: 'test',
lines: { show: true, fill: 0, lineWidth: 1, steps: false },
points: { show: true, radius: 1, lineWidth: 1 },
bars: { fill: 0, lineWidth: 1, show: false },
diff --git a/src/legacy/core_plugins/metrics/server/lib/vis_data/response_processors/series/__tests__/std_sibling.js b/src/legacy/core_plugins/metrics/server/lib/vis_data/response_processors/series/__tests__/std_sibling.js
index af24eb1be81c4..f8c98adc5d023 100644
--- a/src/legacy/core_plugins/metrics/server/lib/vis_data/response_processors/series/__tests__/std_sibling.js
+++ b/src/legacy/core_plugins/metrics/server/lib/vis_data/response_processors/series/__tests__/std_sibling.js
@@ -98,6 +98,7 @@ describe('stdSibling(resp, panel, series)', () => {
label: 'Overall Std. Deviation of Average of cpu',
color: 'rgb(255, 0, 0)',
stack: false,
+ seriesId: 'test',
lines: { show: true, fill: 0, lineWidth: 1, steps: false },
points: { show: true, radius: 1, lineWidth: 1 },
bars: { fill: 0, lineWidth: 1, show: false },
diff --git a/src/legacy/core_plugins/region_map/public/__tests__/region_map_visualization.js b/src/legacy/core_plugins/region_map/public/__tests__/region_map_visualization.js
index a5c2296bd8b99..b0b40f8ff704e 100644
--- a/src/legacy/core_plugins/region_map/public/__tests__/region_map_visualization.js
+++ b/src/legacy/core_plugins/region_map/public/__tests__/region_map_visualization.js
@@ -39,7 +39,7 @@ import afterdatachangePng from './afterdatachange.png';
import afterdatachangeandresizePng from './afterdatachangeandresize.png';
import aftercolorchangePng from './aftercolorchange.png';
import changestartupPng from './changestartup.png';
-import { visualizations } from '../../../visualizations/public';
+import { setup } from '../../../visualizations/public/np_ready/public/legacy';
import { createRegionMapVisualization } from '../region_map_visualization';
import { createRegionMapTypeDefinition } from '../region_map_type';
@@ -48,7 +48,6 @@ const THRESHOLD = 0.45;
const PIXEL_DIFF = 96;
describe('RegionMapsVisualizationTests', function () {
-
let domNode;
let RegionMapsVisualization;
let Vis;
@@ -61,83 +60,87 @@ describe('RegionMapsVisualizationTests', function () {
const _makeJsonAjaxCallOld = ChoroplethLayer.prototype._makeJsonAjaxCall;
const dummyTableGroup = {
- columns: [{
- 'id': 'col-0',
- 'aggConfig': {
- 'id': '2',
- 'enabled': true,
- 'type': 'terms',
- 'schema': 'segment',
- 'params': { 'field': 'geo.dest', 'size': 5, 'order': 'desc', 'orderBy': '1' }
- }, 'title': 'geo.dest: Descending'
- }, {
- 'id': 'col-1',
- 'aggConfig': { 'id': '1', 'enabled': true, 'type': 'count', 'schema': 'metric', 'params': {} },
- 'title': 'Count'
- }],
+ columns: [
+ {
+ id: 'col-0',
+ aggConfig: {
+ id: '2',
+ enabled: true,
+ type: 'terms',
+ schema: 'segment',
+ params: { field: 'geo.dest', size: 5, order: 'desc', orderBy: '1' },
+ },
+ title: 'geo.dest: Descending',
+ },
+ {
+ id: 'col-1',
+ aggConfig: { id: '1', enabled: true, type: 'count', schema: 'metric', params: {} },
+ title: 'Count',
+ },
+ ],
rows: [
{ 'col-0': 'CN', 'col-1': 26 },
{ 'col-0': 'IN', 'col-1': 17 },
{ 'col-0': 'US', 'col-1': 6 },
{ 'col-0': 'DE', 'col-1': 4 },
- { 'col-0': 'BR', 'col-1': 3 }
- ]
+ { 'col-0': 'BR', 'col-1': 3 },
+ ],
};
beforeEach(ngMock.module('kibana'));
let getManifestStub;
- beforeEach(ngMock.inject((Private, $injector) => {
- const serviceSettings = $injector.get('serviceSettings');
- const uiSettings = $injector.get('config');
- const regionmapsConfig = {
- includeElasticMapsService: true,
- layers: []
- };
-
- dependencies = {
- serviceSettings,
- $injector,
- regionmapsConfig,
- uiSettings
- };
-
- visualizations.types.VisTypesRegistryProvider.register(() =>
- createRegionMapTypeDefinition(dependencies)
- );
-
- Vis = Private(visModule.VisProvider);
- RegionMapsVisualization = createRegionMapVisualization(dependencies);
- indexPattern = Private(LogstashIndexPatternStubProvider);
-
- ChoroplethLayer.prototype._makeJsonAjaxCall = async function () {
- //simulate network call
- return new Promise((resolve)=> {
- setTimeout(() => {
- resolve(worldJson);
- }, 10);
- });
- };
-
- getManifestStub = serviceSettings.__debugStubManifestCalls(async (url) => {
- //simulate network calls
- if (url.startsWith('https://foobar')) {
- return EMS_CATALOGUE;
- } else if (url.startsWith('https://tiles.foobar')) {
- return EMS_TILES;
- } else if (url.startsWith('https://files.foobar')) {
- return EMS_FILES;
- } else if (url.startsWith('https://raster-style.foobar')) {
- if (url.includes('osm-bright-desaturated')) {
- return EMS_STYLE_ROAD_MAP_DESATURATED;
- } else if (url.includes('osm-bright')) {
- return EMS_STYLE_ROAD_MAP_BRIGHT;
- } else if (url.includes('dark-matter')) {
- return EMS_STYLE_DARK_MAP;
+ beforeEach(
+ ngMock.inject((Private, $injector) => {
+ const serviceSettings = $injector.get('serviceSettings');
+ const uiSettings = $injector.get('config');
+ const regionmapsConfig = {
+ includeElasticMapsService: true,
+ layers: [],
+ };
+
+ dependencies = {
+ serviceSettings,
+ $injector,
+ regionmapsConfig,
+ uiSettings,
+ };
+
+ setup.types.registerVisualization(() => createRegionMapTypeDefinition(dependencies));
+
+ Vis = Private(visModule.VisProvider);
+ RegionMapsVisualization = createRegionMapVisualization(dependencies);
+ indexPattern = Private(LogstashIndexPatternStubProvider);
+
+ ChoroplethLayer.prototype._makeJsonAjaxCall = async function () {
+ //simulate network call
+ return new Promise(resolve => {
+ setTimeout(() => {
+ resolve(worldJson);
+ }, 10);
+ });
+ };
+
+ getManifestStub = serviceSettings.__debugStubManifestCalls(async url => {
+ //simulate network calls
+ if (url.startsWith('https://foobar')) {
+ return EMS_CATALOGUE;
+ } else if (url.startsWith('https://tiles.foobar')) {
+ return EMS_TILES;
+ } else if (url.startsWith('https://files.foobar')) {
+ return EMS_FILES;
+ } else if (url.startsWith('https://raster-style.foobar')) {
+ if (url.includes('osm-bright-desaturated')) {
+ return EMS_STYLE_ROAD_MAP_DESATURATED;
+ } else if (url.includes('osm-bright')) {
+ return EMS_STYLE_ROAD_MAP_BRIGHT;
+ } else if (url.includes('dark-matter')) {
+ return EMS_STYLE_DARK_MAP;
+ }
}
- }
- });
- }));
+ });
+ })
+ );
afterEach(function () {
ChoroplethLayer.prototype._makeJsonAjaxCall = _makeJsonAjaxCallOld;
@@ -145,15 +148,13 @@ describe('RegionMapsVisualizationTests', function () {
});
describe('RegionMapVisualization - basics', function () {
-
beforeEach(async function () {
setupDOM('512px', '512px');
imageComparator = new ImageComparator();
-
vis = new Vis(indexPattern, {
- type: 'region_map'
+ type: 'region_map',
});
vis.params.bucket = {
@@ -163,19 +164,25 @@ describe('RegionMapsVisualizationTests', function () {
accessor: 1,
};
- vis.params.selectedJoinField = { 'name': 'iso2', 'description': 'Two letter abbreviation' };
+ vis.params.selectedJoinField = { name: 'iso2', description: 'Two letter abbreviation' };
vis.params.selectedLayer = {
- 'attribution': ' = {
- visualizations,
+ visualizations: setupVisualizations,
data: npSetup.plugins.data,
// Temporary solution
diff --git a/src/legacy/core_plugins/region_map/public/plugin.ts b/src/legacy/core_plugins/region_map/public/plugin.ts
index 995a96b7a19c7..4afee7269c578 100644
--- a/src/legacy/core_plugins/region_map/public/plugin.ts
+++ b/src/legacy/core_plugins/region_map/public/plugin.ts
@@ -24,7 +24,7 @@ import {
UiSettingsClientContract,
} from '../../../../core/public';
import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public';
-import { VisualizationsSetup } from '../../visualizations/public';
+import { VisualizationsSetup } from '../../visualizations/public/np_ready/public';
import { LegacyDependenciesPlugin, LegacyDependenciesPluginSetup } from './shim';
@@ -70,7 +70,7 @@ export class RegionMapPlugin implements Plugin, void> {
data.expressions.registerFunction(createRegionMapFn);
- visualizations.types.VisTypesRegistryProvider.register(() =>
+ visualizations.types.registerVisualization(() =>
createRegionMapTypeDefinition(visualizationDependencies)
);
}
diff --git a/src/legacy/core_plugins/region_map/public/region_map_type.js b/src/legacy/core_plugins/region_map/public/region_map_type.js
index 10aaeb1060bc0..9b28aa96eccbc 100644
--- a/src/legacy/core_plugins/region_map/public/region_map_type.js
+++ b/src/legacy/core_plugins/region_map/public/region_map_type.js
@@ -25,7 +25,7 @@ import { createRegionMapVisualization } from './region_map_visualization';
import { Status } from 'ui/vis/update_status';
import { RegionMapOptions } from './components/region_map_options';
-import { visFactory } from '../../visualizations/public';
+import { visFactory } from '../../visualizations/public/np_ready/public';
// TODO: reference to TILE_MAP plugin should be removed
import { ORIGIN } from '../../tile_map/common/origin';
@@ -40,8 +40,11 @@ export function createRegionMapTypeDefinition(dependencies) {
return visFactory.createBaseVisualization({
name: 'region_map',
title: i18n.translate('regionMap.mapVis.regionMapTitle', { defaultMessage: 'Region Map' }),
- description: i18n.translate('regionMap.mapVis.regionMapDescription', { defaultMessage: 'Show metrics on a thematic map. Use one of the \
-provided base maps, or add your own. Darker colors represent higher values.' }),
+ description: i18n.translate('regionMap.mapVis.regionMapDescription', {
+ defaultMessage:
+ 'Show metrics on a thematic map. Use one of the \
+provided base maps, or add your own. Darker colors represent higher values.',
+ }),
icon: 'visMapRegion',
visConfig: {
defaults: {
@@ -56,45 +59,59 @@ provided base maps, or add your own. Darker colors represent higher values.' }),
mapZoom: 2,
mapCenter: [0, 0],
outlineWeight: 1,
- showAllShapes: true//still under consideration
- }
+ showAllShapes: true, //still under consideration
+ },
},
requiresUpdateStatus: [Status.AGGS, Status.PARAMS, Status.RESIZE, Status.DATA, Status.UI_STATE],
visualization,
editorConfig: {
- optionsTemplate: (props) =>
- ( (
+ = {
- visualizations,
+ visualizations: setupVisualizations,
data: npSetup.plugins.data,
// Temporary solution
diff --git a/src/legacy/core_plugins/tile_map/public/map_types.ts b/src/legacy/core_plugins/tile_map/public/map_types.ts
new file mode 100644
index 0000000000000..d4240fc8a579a
--- /dev/null
+++ b/src/legacy/core_plugins/tile_map/public/map_types.ts
@@ -0,0 +1,25 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+export enum MapTypes {
+ ScaledCircleMarkers = 'Scaled Circle Markers',
+ ShadedCircleMarkers = 'Shaded Circle Markers',
+ ShadedGeohashGrid = 'Shaded Geohash Grid',
+ Heatmap = 'Heatmap',
+}
diff --git a/src/legacy/core_plugins/tile_map/public/plugin.ts b/src/legacy/core_plugins/tile_map/public/plugin.ts
index f5ce0df297125..1309c37a4c73a 100644
--- a/src/legacy/core_plugins/tile_map/public/plugin.ts
+++ b/src/legacy/core_plugins/tile_map/public/plugin.ts
@@ -24,7 +24,7 @@ import {
UiSettingsClientContract,
} from '../../../../core/public';
import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public';
-import { VisualizationsSetup } from '../../visualizations/public';
+import { VisualizationsSetup } from '../../visualizations/public/np_ready/public';
import { LegacyDependenciesPlugin, LegacyDependenciesPluginSetup } from './shim';
@@ -64,7 +64,7 @@ export class TileMapPlugin implements Plugin, void> {
data.expressions.registerFunction(() => createTileMapFn(visualizationDependencies));
- visualizations.types.VisTypesRegistryProvider.register(() =>
+ visualizations.types.registerVisualization(() =>
createTileMapTypeDefinition(visualizationDependencies)
);
}
diff --git a/src/legacy/core_plugins/tile_map/public/tile_map_type.js b/src/legacy/core_plugins/tile_map/public/tile_map_type.js
index 05dbe0fa9f9df..d96d8ad9be786 100644
--- a/src/legacy/core_plugins/tile_map/public/tile_map_type.js
+++ b/src/legacy/core_plugins/tile_map/public/tile_map_type.js
@@ -27,8 +27,9 @@ import { colorSchemas } from 'ui/vislib/components/color/truncated_colormaps';
import { convertToGeoJson } from 'ui/vis/map/convert_to_geojson';
import { createTileMapVisualization } from './tile_map_visualization';
-import { visFactory } from '../../visualizations/public';
+import { visFactory } from '../../visualizations/public/np_ready/public';
import { TileMapOptions } from './components/tile_map_options';
+import { MapTypes } from './map_types';
export function createTileMapTypeDefinition(dependencies) {
const CoordinateMapsVisualization = createTileMapVisualization(dependencies);
@@ -64,48 +65,53 @@ export function createTileMapTypeDefinition(dependencies) {
editorConfig: {
collections: {
colorSchemas,
- legendPositions: [{
- value: 'bottomleft',
- text: i18n.translate('tileMap.vis.editorConfig.legendPositions.bottomLeftText', {
- defaultMessage: 'Bottom left',
- }),
- }, {
- value: 'bottomright',
- text: i18n.translate('tileMap.vis.editorConfig.legendPositions.bottomRightText', {
- defaultMessage: 'Bottom right',
- }),
- }, {
- value: 'topleft',
- text: i18n.translate('tileMap.vis.editorConfig.legendPositions.topLeftText', {
- defaultMessage: 'Top left',
- }),
- }, {
- value: 'topright',
- text: i18n.translate('tileMap.vis.editorConfig.legendPositions.topRightText', {
- defaultMessage: 'Top right',
- }),
- }],
+ legendPositions: [
+ {
+ value: 'bottomleft',
+ text: i18n.translate('tileMap.vis.editorConfig.legendPositions.bottomLeftText', {
+ defaultMessage: 'Bottom left',
+ }),
+ },
+ {
+ value: 'bottomright',
+ text: i18n.translate('tileMap.vis.editorConfig.legendPositions.bottomRightText', {
+ defaultMessage: 'Bottom right',
+ }),
+ },
+ {
+ value: 'topleft',
+ text: i18n.translate('tileMap.vis.editorConfig.legendPositions.topLeftText', {
+ defaultMessage: 'Top left',
+ }),
+ },
+ {
+ value: 'topright',
+ text: i18n.translate('tileMap.vis.editorConfig.legendPositions.topRightText', {
+ defaultMessage: 'Top right',
+ }),
+ },
+ ],
mapTypes: [
{
- value: 'Scaled Circle Markers',
+ value: MapTypes.ScaledCircleMarkers,
text: i18n.translate('tileMap.vis.editorConfig.mapTypes.scaledCircleMarkersText', {
defaultMessage: 'Scaled circle markers',
}),
},
{
- value: 'Shaded Circle Markers',
+ value: MapTypes.ShadedCircleMarkers,
text: i18n.translate('tileMap.vis.editorConfig.mapTypes.shadedCircleMarkersText', {
defaultMessage: 'Shaded circle markers',
}),
},
{
- value: 'Shaded Geohash Grid',
+ value: MapTypes.ShadedGeohashGrid,
text: i18n.translate('tileMap.vis.editorConfig.mapTypes.shadedGeohashGridText', {
defaultMessage: 'Shaded geohash grid',
}),
},
{
- value: 'Heatmap',
+ value: MapTypes.Heatmap,
text: i18n.translate('tileMap.vis.editorConfig.mapTypes.heatmapText', {
defaultMessage: 'Heatmap',
}),
@@ -113,7 +119,7 @@ export function createTileMapTypeDefinition(dependencies) {
],
tmsLayers: [],
},
- optionsTemplate: (props) => = {
- visualizations,
+ visualizations: setupVisualizations,
data: npSetup.plugins.data,
};
diff --git a/src/legacy/core_plugins/vis_type_markdown/public/markdown_vis.ts b/src/legacy/core_plugins/vis_type_markdown/public/markdown_vis.ts
index 7b2f8f6c236b2..2f1a46f1d8f3f 100644
--- a/src/legacy/core_plugins/vis_type_markdown/public/markdown_vis.ts
+++ b/src/legacy/core_plugins/vis_type_markdown/public/markdown_vis.ts
@@ -19,7 +19,7 @@
import { i18n } from '@kbn/i18n';
-import { visFactory, DefaultEditorSize } from '../../visualizations/public';
+import { visFactory, DefaultEditorSize } from '../../visualizations/public/np_ready/public';
import { MarkdownVisWrapper } from './markdown_vis_controller';
import { MarkdownOptions } from './markdown_options';
diff --git a/src/legacy/core_plugins/vis_type_markdown/public/plugin.ts b/src/legacy/core_plugins/vis_type_markdown/public/plugin.ts
index 286b233280382..5f9c82ca89290 100644
--- a/src/legacy/core_plugins/vis_type_markdown/public/plugin.ts
+++ b/src/legacy/core_plugins/vis_type_markdown/public/plugin.ts
@@ -19,7 +19,7 @@
import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from '../../../../core/public';
import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public';
-import { VisualizationsSetup } from '../../visualizations/public';
+import { VisualizationsSetup } from '../../visualizations/public/np_ready/public';
import { markdownVis } from './markdown_vis';
import { createMarkdownVisFn } from './markdown_fn';
@@ -39,7 +39,7 @@ export class MarkdownPlugin implements Plugin {
}
public setup(core: CoreSetup, { data, visualizations }: MarkdownPluginSetupDependencies) {
- visualizations.types.VisTypesRegistryProvider.register(() => markdownVis);
+ visualizations.types.registerVisualization(() => markdownVis);
data.expressions.registerFunction(createMarkdownVisFn);
}
diff --git a/src/legacy/core_plugins/vis_type_metric/public/__tests__/metric_vis.js b/src/legacy/core_plugins/vis_type_metric/public/__tests__/metric_vis.js
index 7adf7007e8603..ce77c64d77651 100644
--- a/src/legacy/core_plugins/vis_type_metric/public/__tests__/metric_vis.js
+++ b/src/legacy/core_plugins/vis_type_metric/public/__tests__/metric_vis.js
@@ -24,7 +24,7 @@ import expect from '@kbn/expect';
import { VisProvider } from 'ui/vis';
import LogstashIndexPatternStubProvider from 'fixtures/stubbed_logstash_index_pattern';
-import { visualizations } from '../../../visualizations/public';
+import { setup as setupVisualizations } from '../../../visualizations/public/np_ready/public/legacy';
import { createMetricVisTypeDefinition } from '../metric_vis_type';
describe('metric_vis - createMetricVisTypeDefinition', () => {
@@ -32,48 +32,52 @@ describe('metric_vis - createMetricVisTypeDefinition', () => {
let vis;
beforeEach(ngMock.module('kibana'));
- beforeEach(ngMock.inject((Private) => {
- setup = () => {
- const Vis = Private(VisProvider);
- const metricVisType = createMetricVisTypeDefinition();
-
- visualizations.types.VisTypesRegistryProvider.register(() =>
- metricVisType
- );
-
- const indexPattern = Private(LogstashIndexPatternStubProvider);
-
- indexPattern.stubSetFieldFormat('ip', 'url', {
- urlTemplate: 'http://ip.info?address={{value}}',
- labelTemplate: 'ip[{{value}}]'
- });
-
- vis = new Vis(indexPattern, {
- type: 'metric',
- aggs: [{ id: '1', type: 'top_hits', schema: 'metric', params: { field: 'ip' } }],
- });
-
- vis.params.dimensions = {
- metrics: [{
- accessor: 0, format: {
- id: 'url', params: {
- urlTemplate: 'http://ip.info?address={{value}}',
- labelTemplate: 'ip[{{value}}]'
- }
- }
- }]
- };
-
- const el = document.createElement('div');
- const Controller = metricVisType.visualization;
- const controller = new Controller(el, vis);
- const render = (esResponse) => {
- controller.render(esResponse, vis.params);
+ beforeEach(
+ ngMock.inject(Private => {
+ setup = () => {
+ const Vis = Private(VisProvider);
+ const metricVisType = createMetricVisTypeDefinition();
+
+ setupVisualizations.types.registerVisualization(() => metricVisType);
+
+ const indexPattern = Private(LogstashIndexPatternStubProvider);
+
+ indexPattern.stubSetFieldFormat('ip', 'url', {
+ urlTemplate: 'http://ip.info?address={{value}}',
+ labelTemplate: 'ip[{{value}}]',
+ });
+
+ vis = new Vis(indexPattern, {
+ type: 'metric',
+ aggs: [{ id: '1', type: 'top_hits', schema: 'metric', params: { field: 'ip' } }],
+ });
+
+ vis.params.dimensions = {
+ metrics: [
+ {
+ accessor: 0,
+ format: {
+ id: 'url',
+ params: {
+ urlTemplate: 'http://ip.info?address={{value}}',
+ labelTemplate: 'ip[{{value}}]',
+ },
+ },
+ },
+ ],
+ };
+
+ const el = document.createElement('div');
+ const Controller = metricVisType.visualization;
+ const controller = new Controller(el, vis);
+ const render = esResponse => {
+ controller.render(esResponse, vis.params);
+ };
+
+ return { el, render };
};
-
- return { el, render };
- };
- }));
+ })
+ );
it('renders html value from field formatter', () => {
const { el, render } = setup();
@@ -81,12 +85,14 @@ describe('metric_vis - createMetricVisTypeDefinition', () => {
const ip = '235.195.237.208';
render({
columns: [{ id: 'col-0', name: 'ip' }],
- rows: [{ 'col-0': ip }]
+ rows: [{ 'col-0': ip }],
});
const $link = $(el)
.find('a[href]')
- .filter(function () { return this.href.includes('ip.info'); });
+ .filter(function () {
+ return this.href.includes('ip.info');
+ });
expect($link).to.have.length(1);
expect($link.text()).to.be(`ip[${ip}]`);
diff --git a/src/legacy/core_plugins/vis_type_metric/public/legacy.ts b/src/legacy/core_plugins/vis_type_metric/public/legacy.ts
index 4ab399977d7b1..2eea4c70309de 100644
--- a/src/legacy/core_plugins/vis_type_metric/public/legacy.ts
+++ b/src/legacy/core_plugins/vis_type_metric/public/legacy.ts
@@ -20,13 +20,13 @@
import { PluginInitializerContext } from 'kibana/public';
import { npSetup, npStart } from 'ui/new_platform';
-import { visualizations } from '../../visualizations/public';
+import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy';
import { MetricVisPluginSetupDependencies } from './plugin';
import { LegacyDependenciesPlugin } from './shim';
import { plugin } from '.';
const plugins: Readonly = {
- visualizations,
+ visualizations: setupVisualizations,
data: npSetup.plugins.data,
// Temporary solution
diff --git a/src/legacy/core_plugins/vis_type_metric/public/metric_vis_type.ts b/src/legacy/core_plugins/vis_type_metric/public/metric_vis_type.ts
index 76e88888ef7f2..eba61edeeb84a 100644
--- a/src/legacy/core_plugins/vis_type_metric/public/metric_vis_type.ts
+++ b/src/legacy/core_plugins/vis_type_metric/public/metric_vis_type.ts
@@ -26,7 +26,7 @@ import { vislibColorMaps } from 'ui/vislib/components/color/colormaps';
// @ts-ignore
import { MetricVisComponent } from './components/metric_vis_controller';
-import { visFactory } from '../../visualizations/public';
+import { visFactory } from '../../visualizations/public/np_ready/public';
export const createMetricVisTypeDefinition = () => {
return visFactory.createReactVisualization({
diff --git a/src/legacy/core_plugins/vis_type_metric/public/plugin.ts b/src/legacy/core_plugins/vis_type_metric/public/plugin.ts
index d99df03fcc560..66a3bb007e379 100644
--- a/src/legacy/core_plugins/vis_type_metric/public/plugin.ts
+++ b/src/legacy/core_plugins/vis_type_metric/public/plugin.ts
@@ -20,7 +20,7 @@
import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from '../../../../core/public';
import { LegacyDependenciesPlugin } from './shim';
import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public';
-import { VisualizationsSetup } from '../../visualizations/public';
+import { VisualizationsSetup } from '../../visualizations/public/np_ready/public';
import { createMetricVisFn } from './metric_vis_fn';
// @ts-ignore
@@ -48,7 +48,7 @@ export class MetricVisPlugin implements Plugin {
__LEGACY.setup();
data.expressions.registerFunction(createMetricVisFn);
- visualizations.types.VisTypesRegistryProvider.register(createMetricVisTypeDefinition);
+ visualizations.types.registerVisualization(createMetricVisTypeDefinition);
}
public start(core: CoreStart) {
diff --git a/src/legacy/core_plugins/vis_type_table/public/__tests__/table_vis_controller.js b/src/legacy/core_plugins/vis_type_table/public/__tests__/table_vis_controller.js
index 4253efd4689cf..9110c8dcb8486 100644
--- a/src/legacy/core_plugins/vis_type_table/public/__tests__/table_vis_controller.js
+++ b/src/legacy/core_plugins/vis_type_table/public/__tests__/table_vis_controller.js
@@ -28,7 +28,7 @@ import { AppStateProvider } from 'ui/state_management/app_state';
import { tabifyAggResponse } from 'ui/agg_response/tabify';
import { createTableVisTypeDefinition } from '../table_vis_type';
-import { visualizations } from '../../../visualizations/public';
+import { setup as setupVisualizations } from '../../../visualizations/public/np_ready/public/legacy';
describe('Table Vis - Controller', async function () {
let $rootScope;
@@ -44,68 +44,73 @@ describe('Table Vis - Controller', async function () {
let legacyDependencies;
beforeEach(ngMock.module('kibana', 'kibana/table_vis'));
- beforeEach(ngMock.inject(function ($injector) {
- Private = $injector.get('Private');
- legacyDependencies = {
- // eslint-disable-next-line new-cap
- createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization
- };
-
- visualizations.types.VisTypesRegistryProvider.register(() =>
- createTableVisTypeDefinition(legacyDependencies)
- );
-
- $rootScope = $injector.get('$rootScope');
- $compile = $injector.get('$compile');
- fixtures = require('fixtures/fake_hierarchical_data');
- AppState = Private(AppStateProvider);
- Vis = Private(VisProvider);
- tableAggResponse = legacyResponseHandlerProvider().handler;
- }));
+ beforeEach(
+ ngMock.inject(function ($injector) {
+ Private = $injector.get('Private');
+ legacyDependencies = {
+ // eslint-disable-next-line new-cap
+ createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization,
+ };
+
+ setupVisualizations.types.registerVisualization(() =>
+ createTableVisTypeDefinition(legacyDependencies)
+ );
+
+ $rootScope = $injector.get('$rootScope');
+ $compile = $injector.get('$compile');
+ fixtures = require('fixtures/fake_hierarchical_data');
+ AppState = Private(AppStateProvider);
+ Vis = Private(VisProvider);
+ tableAggResponse = legacyResponseHandlerProvider().handler;
+ })
+ );
function OneRangeVis(params) {
- return new Vis(
- Private(FixturesStubbedLogstashIndexPatternProvider),
- {
- type: 'table',
- params: params || {},
- aggs: [
- { type: 'count', schema: 'metric' },
- {
- type: 'range',
- schema: 'bucket',
- params: {
- field: 'bytes',
- ranges: [
- { from: 0, to: 1000 },
- { from: 1000, to: 2000 }
- ]
- }
- }
- ]
- }
- );
+ return new Vis(Private(FixturesStubbedLogstashIndexPatternProvider), {
+ type: 'table',
+ params: params || {},
+ aggs: [
+ { type: 'count', schema: 'metric' },
+ {
+ type: 'range',
+ schema: 'bucket',
+ params: {
+ field: 'bytes',
+ ranges: [{ from: 0, to: 1000 }, { from: 1000, to: 2000 }],
+ },
+ },
+ ],
+ });
}
const dimensions = {
- buckets: [{
- accessor: 0,
- }], metrics: [{
- accessor: 1,
- format: { id: 'range' },
- }]
+ buckets: [
+ {
+ accessor: 0,
+ },
+ ],
+ metrics: [
+ {
+ accessor: 1,
+ format: { id: 'range' },
+ },
+ ],
};
// basically a parameterized beforeEach
function initController(vis) {
- vis.aggs.aggs.forEach(function (agg, i) { agg.id = 'agg_' + (i + 1); });
+ vis.aggs.aggs.forEach(function (agg, i) {
+ agg.id = 'agg_' + (i + 1);
+ });
tabifiedResponse = tabifyAggResponse(vis.aggs, fixtures.oneRangeBucket);
$rootScope.vis = vis;
$rootScope.visParams = vis.params;
$rootScope.uiState = new AppState({ uiState: {} }).makeStateful('uiState');
$rootScope.renderComplete = () => {};
- $rootScope.newScope = function (scope) { $scope = scope; };
+ $rootScope.newScope = function (scope) {
+ $scope = scope;
+ };
$el = $('
-
- );
-});
-
-HorizontalLegend.propTypes = {
- legendPosition: PropTypes.string,
- onClick: PropTypes.func,
- onToggle: PropTypes.func,
- series: PropTypes.array,
- showLegend: PropTypes.bool,
- seriesValues: PropTypes.object,
- seriesFilter: PropTypes.array,
- tickFormatter: PropTypes.func,
-};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/resize.js b/src/legacy/core_plugins/metrics/public/visualizations/components/resize.js
deleted file mode 100644
index e6aa9831cf1a8..0000000000000
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/resize.js
+++ /dev/null
@@ -1,81 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import { findDOMNode } from 'react-dom';
-
-export class Resize extends Component {
- constructor(props) {
- super(props);
- this.state = {};
- this.handleResize = this.handleResize.bind(this);
- }
-
- checkSize() {
- const el = findDOMNode(this.el);
- if (!el) return;
- this.timeout = setTimeout(() => {
- const { currentHeight, currentWidth } = this.state;
- if (
- currentHeight !== el.parentNode.clientHeight ||
- currentWidth !== el.parentNode.clientWidth
- ) {
- this.setState({
- currentWidth: el.parentNode.clientWidth,
- currentHeight: el.parentNode.clientHeight,
- });
- this.handleResize();
- }
- clearTimeout(this.timeout);
- this.checkSize();
- }, this.props.frequency);
- }
-
- componentDidMount() {
- this.checkSize();
- }
-
- componentWillUnmount() {
- clearTimeout(this.timeout);
- }
-
- handleResize() {
- if (this.props.onResize) this.props.onResize();
- }
-
- render() {
- const style = this.props.style || {};
- const className = this.props.className || '';
- return (
-
- {rows}
-
- (this.el = el)}>
- {this.props.children}
-
- );
- }
-}
-
-Resize.defaultProps = {
- frequency: 500,
-};
-
-Resize.propTypes = {
- frequency: PropTypes.number,
- onResize: PropTypes.func,
-};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/timeseries.js b/src/legacy/core_plugins/metrics/public/visualizations/components/timeseries.js
deleted file mode 100644
index 2fe676efa58aa..0000000000000
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/timeseries.js
+++ /dev/null
@@ -1,201 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import classNames from 'classnames';
-import _ from 'lodash';
-import { getLastValue } from '../../../common/get_last_value';
-import { isBackgroundInverted } from '../../../common/set_is_reversed';
-import { TimeseriesChart } from './timeseries_chart';
-import { Legend } from './legend';
-import { eventBus } from '../lib/events';
-import reactcss from 'reactcss';
-
-export class Timeseries extends Component {
- constructor(props) {
- super(props);
- const values = this.getLastValues(props);
- this.state = {
- showLegend: props.legend != null ? props.legend : true,
- values: values || {},
- show: _.keys(values) || [],
- ignoreLegendUpdates: false,
- ignoreVisibilityUpdates: false,
- };
- this.toggleFilter = this.toggleFilter.bind(this);
- this.handleHideClick = this.handleHideClick.bind(this);
- this.plothover = this.plothover.bind(this);
- }
-
- filterLegend(id) {
- if (!_.has(this.state.values, id)) return [];
- const notAllShown = _.keys(this.state.values).length !== this.state.show.length;
- const isCurrentlyShown = _.includes(this.state.show, id);
- const show = [];
- if (notAllShown && isCurrentlyShown) {
- this.setState({ ignoreVisibilityUpdates: false, show: Object.keys(this.state.values) });
- } else {
- show.push(id);
- this.setState({ ignoreVisibilityUpdates: true, show: [id] });
- }
- return show;
- }
-
- toggleFilter(event, id) {
- const show = this.filterLegend(id);
- if (_.isFunction(this.props.onFilter)) {
- this.props.onFilter(show);
- }
- eventBus.trigger('toggleFilter', id, this);
- }
-
- getLastValues(props) {
- const values = {};
- props.series.forEach(row => {
- // we need a valid identifier
- if (!row.id) row.id = row.label;
- values[row.id] = getLastValue(row.data);
- });
- return values;
- }
-
- updateLegend(pos, item) {
- const values = {};
- if (pos) {
- this.props.series.forEach(row => {
- if (row.data && Array.isArray(row.data)) {
- if (
- item &&
- row.data[item.dataIndex] &&
- row.data[item.dataIndex][0] === item.datapoint[0]
- ) {
- values[row.id] = row.data[item.dataIndex][1];
- } else {
- let closest;
- for (let i = 0; i < row.data.length; i++) {
- closest = i;
- if (row.data[i] && pos.x < row.data[i][0]) break;
- }
- if (!row.data[closest]) return (values[row.id] = null);
- const [, value] = row.data[closest];
- values[row.id] = (value != null && value) || null;
- }
- }
- });
- } else {
- _.assign(values, this.getLastValues(this.props));
- }
-
- this.setState({ values });
- }
-
- componentWillReceiveProps(props) {
- if (props.legend !== this.props.legend) this.setState({ showLegend: props.legend });
- if (!this.state.ignoreLegendUpdates) {
- const values = this.getLastValues(props);
- const currentKeys = _.keys(this.state.values);
- const keys = _.keys(values);
- const diff = _.difference(keys, currentKeys);
- const nextState = { values: values };
- if (diff.length && !this.state.ignoreVisibilityUpdates) {
- nextState.show = keys;
- }
- this.setState(nextState);
- }
- }
-
- plothover(event, pos, item) {
- this.updateLegend(pos, item);
- }
-
- handleHideClick() {
- this.setState({ showLegend: !this.state.showLegend });
- }
-
- render() {
- const classes = classNames('tvbVisTimeSeries', {
- 'tvbVisTimeSeries--reversed': isBackgroundInverted(this.props.backgroundColor),
- });
-
- const styles = reactcss(
- {
- bottomLegend: {
- content: {
- flexDirection: 'column',
- },
- },
- },
- { bottomLegend: this.props.legendPosition === 'bottom' }
- );
- return (
-
-
- );
- }
-}
-
-Timeseries.defaultProps = {
- legend: true,
- showGrid: true,
-};
-
-Timeseries.propTypes = {
- legend: PropTypes.bool,
- legendPosition: PropTypes.string,
- onFilter: PropTypes.func,
- series: PropTypes.array,
- annotations: PropTypes.array,
- backgroundColor: PropTypes.string,
- options: PropTypes.object,
- tickFormatter: PropTypes.func,
- showGrid: PropTypes.bool,
- xaxisLabel: PropTypes.string,
- dateFormat: PropTypes.string,
-};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/timeseries_chart.js b/src/legacy/core_plugins/metrics/public/visualizations/components/timeseries_chart.js
deleted file mode 100644
index aa00c93ccf4b6..0000000000000
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/timeseries_chart.js
+++ /dev/null
@@ -1,229 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import classNames from 'classnames';
-import { isBackgroundInverted, isBackgroundDark } from '../../../common/set_is_reversed';
-import moment from 'moment';
-import reactcss from 'reactcss';
-import { FlotChart } from './flot_chart';
-import { Annotation } from './annotation';
-import { EuiIcon } from '@elastic/eui';
-
-export function scaleUp(value) {
- return window.devicePixelRatio * value;
-}
-
-export function scaleDown(value) {
- return value / window.devicePixelRatio;
-}
-
-export class TimeseriesChart extends Component {
- constructor(props) {
- super(props);
- this.state = {
- annotations: [],
- showTooltip: false,
- mouseHoverTimer: false,
- };
- this.handleMouseLeave = this.handleMouseLeave.bind(this);
- this.handleMouseOver = this.handleMouseOver.bind(this);
- this.renderAnnotations = this.renderAnnotations.bind(this);
- this.handleDraw = this.handleDraw.bind(this);
- }
-
- calculateLeftRight(item, plot) {
- const canvas = plot.getCanvas();
- const point = plot.pointOffset({ x: item.datapoint[0], y: item.datapoint[1] });
- const edge = (scaleUp(point.left) + 10) / canvas.width;
- let right;
- let left;
- if (edge > 0.5) {
- right = scaleDown(canvas.width) - point.left;
- left = null;
- } else {
- right = null;
- left = point.left;
- }
- return [left, right];
- }
-
- handleDraw(plot) {
- if (!plot || !this.props.annotations) return;
- const annotations = this.props.annotations.reduce((acc, anno) => {
- return acc.concat(
- anno.series.map(series => {
- return {
- series,
- plot,
- key: `${anno.id}-${series[0]}`,
- icon: anno.icon,
- color: anno.color,
- };
- })
- );
- }, []);
- this.setState({ annotations });
- }
-
- handleMouseOver(e, pos, item, plot) {
- if (typeof this.state.mouseHoverTimer === 'number') {
- window.clearTimeout(this.state.mouseHoverTimer);
- }
-
- if (item) {
- const plotOffset = plot.getPlotOffset();
- const point = plot.pointOffset({ x: item.datapoint[0], y: item.datapoint[1] });
- const [left, right] = this.calculateLeftRight(item, plot);
- const top = point.top;
- this.setState({
- showTooltip: true,
- item,
- left,
- right,
- top: top + 10,
- bottom: plotOffset.bottom,
- });
- }
- }
-
- handleMouseLeave() {
- this.state.mouseHoverTimer = window.setTimeout(() => {
- this.setState({ showTooltip: false });
- }, 250);
- }
-
- renderAnnotations(annotation) {
- return (
-
-
-
-
-
-
-
-
- );
- }
-
- const params = {
- crosshair: this.props.crosshair,
- onPlotCreate: this.handlePlotCreate,
- onBrush: this.props.onBrush,
- onMouseLeave: this.handleMouseLeave,
- onMouseOver: this.handleMouseOver,
- onDraw: this.handleDraw,
- options: this.props.options,
- plothover: this.props.plothover,
- reversed: isBackgroundDark(this.props.backgroundColor),
- series: this.props.series,
- annotations: this.props.annotations,
- showGrid: this.props.showGrid,
- show: this.props.show,
- tickFormatter: this.props.tickFormatter,
- yaxes: this.props.yaxes,
- xAxisFormatter: this.props.xAxisFormatter,
- };
-
- const annotations = this.state.annotations.map(this.renderAnnotations);
- const axisLabelClass = classNames('tvbVisTimeSeries__axisLabel', {
- 'tvbVisTimeSeries__axisLabel--reversed': isBackgroundInverted(this.props.backgroundColor),
- });
-
- return (
-
-
-
- {moment(item.datapoint[0]).format(this.props.dateFormat)}
-
-
-
-
-
- {item.series.label}
- {formatter(value)}
- (this.container = el)} className="tvbVisTimeSeries__container">
- {tooltip}
- {annotations}
-
- );
- }
-}
-
-TimeseriesChart.defaultProps = {
- showGrid: true,
- dateFormat: 'll LTS',
-};
-
-TimeseriesChart.propTypes = {
- crosshair: PropTypes.bool,
- onBrush: PropTypes.func,
- options: PropTypes.object,
- plothover: PropTypes.func,
- backgroundColor: PropTypes.string,
- series: PropTypes.array,
- annotations: PropTypes.array,
- show: PropTypes.array,
- tickFormatter: PropTypes.func,
- yaxes: PropTypes.array,
- showGrid: PropTypes.bool,
- xaxisLabel: PropTypes.string,
- dateFormat: PropTypes.string,
-};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/vertical_legend.js b/src/legacy/core_plugins/metrics/public/visualizations/components/vertical_legend.js
deleted file mode 100644
index 47c3c357d6f1b..0000000000000
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/vertical_legend.js
+++ /dev/null
@@ -1,91 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import PropTypes from 'prop-types';
-import React from 'react';
-import { createLegendSeries } from '../lib/create_legend_series';
-import reactcss from 'reactcss';
-import { htmlIdGenerator, EuiButtonIcon } from '@elastic/eui';
-import { injectI18n } from '@kbn/i18n/react';
-
-export const VerticalLegend = injectI18n(function(props) {
- const rows = props.series.map(createLegendSeries(props));
- const htmlId = htmlIdGenerator();
- const hideLegend = !props.showLegend;
- const leftLegend = props.legendPosition === 'left';
-
- const styles = reactcss(
- {
- default: {
- legend: { width: 200 },
- },
- leftLegend: {
- legend: { order: '-1' },
- control: { order: '2' },
- },
- hideLegend: {
- legend: { width: 24 },
- series: { display: 'none' },
- },
- },
- { hideLegend, leftLegend }
- );
-
- const openIcon = leftLegend ? 'arrowRight' : 'arrowLeft';
- const closeIcon = leftLegend ? 'arrowLeft' : 'arrowRight';
- const legendToggleIcon = hideLegend ? `${openIcon}` : `${closeIcon}`;
-
- return (
- {this.props.xaxisLabel}
-
-
- );
-});
-
-VerticalLegend.propTypes = {
- legendPosition: PropTypes.string,
- onClick: PropTypes.func,
- onToggle: PropTypes.func,
- series: PropTypes.array,
- showLegend: PropTypes.bool,
- seriesValues: PropTypes.object,
- seriesFilter: PropTypes.array,
- tickFormatter: PropTypes.func,
-};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/lib/calculate_bar_width.js b/src/legacy/core_plugins/metrics/public/visualizations/constants/chart.js
similarity index 59%
rename from src/legacy/core_plugins/metrics/public/visualizations/lib/calculate_bar_width.js
rename to src/legacy/core_plugins/metrics/public/visualizations/constants/chart.js
index a58246c446882..2e7eae438de12 100644
--- a/src/legacy/core_plugins/metrics/public/visualizations/lib/calculate_bar_width.js
+++ b/src/legacy/core_plugins/metrics/public/visualizations/constants/chart.js
@@ -17,15 +17,25 @@
* under the License.
*/
-import _ from 'lodash';
-// bar sizes are measured in milliseconds so this assumes that the different
-// between timestamps is in milliseconds. A normal bar size is 70% which gives
-// enough spacing for the bar.
-export const calculateBarWidth = (series, multiplier = 0.7) => {
- const first = _.first(series);
- try {
- return (first.data[1][0] - first.data[0][0]) * multiplier;
- } catch (e) {
- return 1000; // 1000 ms
- }
+export const COLORS = {
+ LINE_COLOR: 'rgba(105,112,125,0.2)',
+ TEXT_COLOR: 'rgba(0,0,0,0.4)',
+ TEXT_COLOR_REVERSED: 'rgba(255,255,255,0.5)',
+ VALUE_COLOR: 'rgba(0,0,0,0.7)',
+ VALUE_COLOR_REVERSED: 'rgba(255,255,255,0.8)',
+};
+
+export const GRID_LINE_CONFIG = {
+ stroke: 'rgba(125,125,125,0.1)',
+};
+
+export const X_ACCESSOR_INDEX = 0;
+export const STACK_ACCESSORS = [0];
+export const Y_ACCESSOR_INDEXES = [1];
+
+export const STACKED_OPTIONS = {
+ NONE: 'none',
+ PERCENT: 'percent',
+ STACKED: 'stacked',
+ STACKED_WITHIN_SERIES: 'stacked_within_series',
};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/constants/icons.js b/src/legacy/core_plugins/metrics/public/visualizations/constants/icons.js
new file mode 100644
index 0000000000000..4c55a9dfbd387
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/constants/icons.js
@@ -0,0 +1,57 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { bombIcon } from '../../components/svg/bomb_icon';
+import { fireIcon } from '../../components/svg/fire_icon';
+
+export const ICON_NAMES = {
+ ASTERISK: 'fa-asterisk',
+ BELL: 'fa-bell',
+ BOLT: 'fa-bolt',
+ BOMB: 'fa-bomb',
+ BUG: 'fa-bug',
+ COMMENT: 'fa-comment',
+ EXCLAMATION_CIRCLE: 'fa-exclamation-circle',
+ EXCLAMATION_TRIANGLE: 'fa-exclamation-triangle',
+ FIRE: 'fa-fire',
+ FLAG: 'fa-flag',
+ HEART: 'fa-heart',
+ MAP_MARKER: 'fa-map-marker',
+ MAP_PIN: 'fa-map-pin',
+ STAR: 'fa-star',
+ TAG: 'fa-tag',
+};
+
+export const ICON_TYPES_MAP = {
+ [ICON_NAMES.ASTERISK]: 'asterisk',
+ [ICON_NAMES.BELL]: 'bell',
+ [ICON_NAMES.BOLT]: 'bolt',
+ [ICON_NAMES.BOMB]: bombIcon,
+ [ICON_NAMES.BUG]: 'bug',
+ [ICON_NAMES.COMMENT]: 'editorComment',
+ [ICON_NAMES.EXCLAMATION_CIRCLE]: 'alert', // TODO: Change as an exclamation mark is added
+ [ICON_NAMES.EXCLAMATION_TRIANGLE]: 'alert',
+ [ICON_NAMES.FIRE]: fireIcon,
+ [ICON_NAMES.FLAG]: 'flag',
+ [ICON_NAMES.HEART]: 'heart',
+ [ICON_NAMES.MAP_MARKER]: 'mapMarker',
+ [ICON_NAMES.MAP_PIN]: 'pinFilled',
+ [ICON_NAMES.STAR]: 'starFilled',
+ [ICON_NAMES.TAG]: 'tag',
+};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/lib/events.js b/src/legacy/core_plugins/metrics/public/visualizations/constants/index.js
similarity index 93%
rename from src/legacy/core_plugins/metrics/public/visualizations/lib/events.js
rename to src/legacy/core_plugins/metrics/public/visualizations/constants/index.js
index 3bfcfa72032fd..0264b0bcfa9e0 100644
--- a/src/legacy/core_plugins/metrics/public/visualizations/lib/events.js
+++ b/src/legacy/core_plugins/metrics/public/visualizations/constants/index.js
@@ -17,6 +17,5 @@
* under the License.
*/
-import $ from 'jquery';
-
-export const eventBus = $({});
+export * from './chart';
+export * from './icons';
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/lib/__tests__/calculate_fill_color.test.js b/src/legacy/core_plugins/metrics/public/visualizations/lib/__tests__/calculate_fill_color.test.js
deleted file mode 100644
index c43c0a16f24dc..0000000000000
--- a/src/legacy/core_plugins/metrics/public/visualizations/lib/__tests__/calculate_fill_color.test.js
+++ /dev/null
@@ -1,56 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import { expect } from 'chai';
-import { calculateFillColor } from '../calculate_fill_color';
-
-describe('calculateFillColor(color, fill)', () => {
- it('should return "fill" and "fillColor" properties', () => {
- const color = 'rgb(255,0,0)';
- const fill = 1;
- const data = calculateFillColor(color, fill);
-
- expect(data.fill).to.be.true;
- expect(data.fillColor).to.be.a('string');
- });
-
- it('should set "fill" property to false in case of 0 opacity', () => {
- const color = 'rgb(255, 0, 0)';
- const fill = 0;
- const data = calculateFillColor(color, fill);
-
- expect(data.fill).to.be.false;
- });
-
- it('should return the opacity less than 1', () => {
- const color = 'rgba(255, 0, 0, 0.9)';
- const fill = 10;
- const data = calculateFillColor(color, fill);
-
- expect(data.fillColor).to.equal('rgba(255, 0, 0, 0.9)');
- });
-
- it('should sum fill and color opacity', () => {
- const color = 'rgba(255, 0, 0, 0.5)';
- const fill = 0.5;
- const data = calculateFillColor(color, fill);
-
- expect(data.fillColor).to.equal('rgba(255, 0, 0, 0.25)');
- });
-});
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/lib/__tests__/get_value_by.test.js b/src/legacy/core_plugins/metrics/public/visualizations/lib/__tests__/get_value_by.test.js
deleted file mode 100644
index 6acbb1196d123..0000000000000
--- a/src/legacy/core_plugins/metrics/public/visualizations/lib/__tests__/get_value_by.test.js
+++ /dev/null
@@ -1,36 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import { getValueBy } from '../get_value_by';
-import { expect } from 'chai';
-
-describe('getValueBy(fn, data)', () => {
- it("returns max for getValueBy('max', data) ", () => {
- const data = [[0, 5], [1, 3], [2, 4], [3, 6], [4, 5]];
- expect(getValueBy('max', data)).to.equal(6);
- });
- it('returns 0 if data is not array', () => {
- const data = '1';
- expect(getValueBy('max', data)).to.equal(0);
- });
- it('returns value if data is number', () => {
- const data = 1;
- expect(getValueBy('max', data)).to.equal(1);
- });
-});
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/lib/active_cursor.js b/src/legacy/core_plugins/metrics/public/visualizations/lib/active_cursor.js
new file mode 100644
index 0000000000000..427ced4dc3f2a
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/lib/active_cursor.js
@@ -0,0 +1,25 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+// TODO: Remove bus when action/triggers are available with LegacyPluginApi or metric is converted to Embeddable
+import $ from 'jquery';
+
+export const ACTIVE_CURSOR = 'ACTIVE_CURSOR';
+
+export const eventBus = $({});
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/lib/create_legend_series.js b/src/legacy/core_plugins/metrics/public/visualizations/lib/create_legend_series.js
deleted file mode 100644
index 1e4e35f8a366a..0000000000000
--- a/src/legacy/core_plugins/metrics/public/visualizations/lib/create_legend_series.js
+++ /dev/null
@@ -1,48 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import React from 'react';
-import _ from 'lodash';
-import { EuiIcon } from '@elastic/eui';
-
-export const createLegendSeries = props => (row, index = 0) => {
- function tickFormatter(value) {
- if (_.isFunction(props.tickFormatter)) return props.tickFormatter(value);
- return value;
- }
- const key = `tvbLegend__item${row.id}${index}`;
- const formatter = row.tickFormatter || tickFormatter;
- const value = formatter(props.seriesValues[row.id]);
- const classes = ['tvbLegend__item'];
-
- if (!_.includes(props.seriesFilter, row.id)) classes.push('disabled');
- if (row.label == null || row.legend === false)
- return ;
- return (
-
- {rows}
-
-
-
-
- );
-};
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/_annotation.scss b/src/legacy/core_plugins/metrics/public/visualizations/views/_annotation.scss
similarity index 100%
rename from src/legacy/core_plugins/metrics/public/visualizations/components/_annotation.scss
rename to src/legacy/core_plugins/metrics/public/visualizations/views/_annotation.scss
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/_gauge.scss b/src/legacy/core_plugins/metrics/public/visualizations/views/_gauge.scss
similarity index 100%
rename from src/legacy/core_plugins/metrics/public/visualizations/components/_gauge.scss
rename to src/legacy/core_plugins/metrics/public/visualizations/views/_gauge.scss
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/_index.scss b/src/legacy/core_plugins/metrics/public/visualizations/views/_index.scss
similarity index 62%
rename from src/legacy/core_plugins/metrics/public/visualizations/components/_index.scss
rename to src/legacy/core_plugins/metrics/public/visualizations/views/_index.scss
index c5ce0ff8c8513..ddd5604801806 100644
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/_index.scss
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/_index.scss
@@ -1,6 +1,5 @@
@import './annotation';
@import './gauge';
@import './metric';
-@import './legend';
-@import './timeseries_chart';
+
@import './top_n';
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/_metric.scss b/src/legacy/core_plugins/metrics/public/visualizations/views/_metric.scss
similarity index 100%
rename from src/legacy/core_plugins/metrics/public/visualizations/components/_metric.scss
rename to src/legacy/core_plugins/metrics/public/visualizations/views/_metric.scss
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/_top_n.scss b/src/legacy/core_plugins/metrics/public/visualizations/views/_top_n.scss
similarity index 91%
rename from src/legacy/core_plugins/metrics/public/visualizations/components/_top_n.scss
rename to src/legacy/core_plugins/metrics/public/visualizations/views/_top_n.scss
index 6392e437bc0a6..fb6be95dba2a2 100644
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/_top_n.scss
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/_top_n.scss
@@ -35,7 +35,12 @@
}
.tvbVisTopN__innerBar {
- min-height: $euiSize;
+ position: relative;
+
+ > div {
+ width: 100%;
+ min-height: $euiSize;
+ }
}
.tvbVisTopN--reversed {
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/annotation.js b/src/legacy/core_plugins/metrics/public/visualizations/views/annotation.js
similarity index 100%
rename from src/legacy/core_plugins/metrics/public/visualizations/components/annotation.js
rename to src/legacy/core_plugins/metrics/public/visualizations/views/annotation.js
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/gauge.js b/src/legacy/core_plugins/metrics/public/visualizations/views/gauge.js
similarity index 100%
rename from src/legacy/core_plugins/metrics/public/visualizations/components/gauge.js
rename to src/legacy/core_plugins/metrics/public/visualizations/views/gauge.js
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/gauge_vis.js b/src/legacy/core_plugins/metrics/public/visualizations/views/gauge_vis.js
similarity index 98%
rename from src/legacy/core_plugins/metrics/public/visualizations/components/gauge_vis.js
rename to src/legacy/core_plugins/metrics/public/visualizations/views/gauge_vis.js
index 28f00bddd4e57..aa4ac99243397 100644
--- a/src/legacy/core_plugins/metrics/public/visualizations/components/gauge_vis.js
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/gauge_vis.js
@@ -22,7 +22,7 @@ import React, { Component } from 'react';
import _ from 'lodash';
import reactcss from 'reactcss';
import { calculateCoordinates } from '../lib/calculate_coordinates';
-import { COLORS } from '../lib/colors';
+import { COLORS } from '../constants/chart';
export class GaugeVis extends Component {
constructor(props) {
@@ -118,7 +118,7 @@ export class GaugeVis extends Component {
cx: 60,
cy: 60,
fill: 'rgba(0,0,0,0)',
- stroke: COLORS.lineColor,
+ stroke: COLORS.LINE_COLOR,
strokeDasharray: `${sliceSize * size} ${size}`,
strokeWidth: this.props.innerLine,
},
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/components/metric.js b/src/legacy/core_plugins/metrics/public/visualizations/views/metric.js
similarity index 100%
rename from src/legacy/core_plugins/metrics/public/visualizations/components/metric.js
rename to src/legacy/core_plugins/metrics/public/visualizations/views/metric.js
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/lib/calculate_fill_color.js b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/__mocks__/@elastic/charts.js
similarity index 61%
rename from src/legacy/core_plugins/metrics/public/visualizations/lib/calculate_fill_color.js
rename to src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/__mocks__/@elastic/charts.js
index 878cc518ef384..cb59bef63681b 100644
--- a/src/legacy/core_plugins/metrics/public/visualizations/lib/calculate_fill_color.js
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/__mocks__/@elastic/charts.js
@@ -17,16 +17,29 @@
* under the License.
*/
-import Color from 'color';
+export const CurveType = {
+ CURVE_CARDINAL: 0,
+ CURVE_NATURAL: 1,
+ CURVE_MONOTONE_X: 2,
+ CURVE_MONOTONE_Y: 3,
+ CURVE_BASIS: 4,
+ CURVE_CATMULL_ROM: 5,
+ CURVE_STEP: 6,
+ CURVE_STEP_AFTER: 7,
+ CURVE_STEP_BEFORE: 8,
+ LINEAR: 9,
+};
-export const calculateFillColor = (color, fill = 1) => {
- const initialColor = new Color(color).rgb();
+export const ScaleType = {
+ Linear: 'linear',
+ Ordinal: 'ordinal',
+ Log: 'log',
+ Sqrt: 'sqrt',
+ Time: 'time',
+};
- const opacity = Math.min(Number(fill), 1) * initialColor.valpha;
- const [r, g, b] = initialColor.color;
+export const getSpecId = x => `id:${x}`;
+export const getGroupId = x => `groupId:${x}`;
- return {
- fill: opacity > 0,
- fillColor: new Color([r, g, b, Number(opacity.toFixed(2))]).string(),
- };
-};
+export const BarSeries = () => null;
+export const AreaSeries = () => null;
diff --git a/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/decorators/__snapshots__/area_decorator.test.js.snap b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/decorators/__snapshots__/area_decorator.test.js.snap
new file mode 100644
index 0000000000000..822de4cef0813
--- /dev/null
+++ b/src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/decorators/__snapshots__/area_decorator.test.js.snap
@@ -0,0 +1,63 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`src/legacy/core_plugins/metrics/public/visualizations/views/timeseries/decorators/area_decorator.js
+
+
Made with NaturalEarth | Elastic Maps Service
', - 'name': 'World Countries', - 'format': 'geojson', - 'url': 'https://vector-staging.maps.elastic.co/blob/5715999101812736?elastic_tile_service_tos=agree&my_app_version=7.0.0-alpha1', - 'fields': [{ 'name': 'iso2', 'description': 'Two letter abbreviation' }, { - 'name': 'iso3', - 'description': 'Three letter abbreviation' - }, { 'name': 'name', 'description': 'Country name' }], - 'created_at': '2017-07-31T16:00:19.996450', - 'id': 5715999101812736, - 'layerId': 'elastic_maps_service.World Countries' + attribution: + 'Made with NaturalEarth | Elastic Maps Service
', + name: 'World Countries', + format: 'geojson', + url: + 'https://vector-staging.maps.elastic.co/blob/5715999101812736?elastic_tile_service_tos=agree&my_app_version=7.0.0-alpha1', + fields: [ + { name: 'iso2', description: 'Two letter abbreviation' }, + { + name: 'iso3', + description: 'Three letter abbreviation', + }, + { name: 'name', description: 'Country name' }, + ], + created_at: '2017-07-31T16:00:19.996450', + id: 5715999101812736, + layerId: 'elastic_maps_service.World Countries', }; }); @@ -184,7 +191,6 @@ describe('RegionMapsVisualizationTests', function () { imageComparator.destroy(); }); - it('should instantiate at zoom level 2', async function () { const regionMapsVisualization = new RegionMapsVisualization(domNode, vis); await regionMapsVisualization.render(dummyTableGroup, vis.params, { @@ -192,7 +198,7 @@ describe('RegionMapsVisualizationTests', function () { params: true, aggs: true, data: true, - uiState: false + uiState: false, }); const mismatchedPixels = await compareImage(initialPng); regionMapsVisualization.destroy(); @@ -206,35 +212,33 @@ describe('RegionMapsVisualizationTests', function () { params: true, aggs: true, data: true, - uiState: false + uiState: false, }); //this will actually create an empty image - vis.params.selectedJoinField = { 'name': 'iso3', 'description': 'Three letter abbreviation' }; - vis.params.isDisplayWarning = false;//so we don't get notifications + vis.params.selectedJoinField = { name: 'iso3', description: 'Three letter abbreviation' }; + vis.params.isDisplayWarning = false; //so we don't get notifications await regionMapsVisualization.render(dummyTableGroup, vis.params, { resize: false, params: true, aggs: false, data: false, - uiState: false + uiState: false, }); const mismatchedPixels = await compareImage(toiso3Png); regionMapsVisualization.destroy(); expect(mismatchedPixels).to.be.lessThan(PIXEL_DIFF); - }); it('should resize', async function () { - const regionMapsVisualization = new RegionMapsVisualization(domNode, vis); await regionMapsVisualization.render(dummyTableGroup, vis.params, { resize: false, params: true, aggs: true, data: true, - uiState: false + uiState: false, }); domNode.style.width = '256px'; @@ -244,7 +248,7 @@ describe('RegionMapsVisualizationTests', function () { params: false, aggs: false, data: false, - uiState: false + uiState: false, }); const mismatchedPixelsAfterFirstResize = await compareImage(afterresizePng); @@ -255,7 +259,7 @@ describe('RegionMapsVisualizationTests', function () { params: false, aggs: false, data: false, - uiState: false + uiState: false, }); const mismatchedPixelsAfterSecondResize = await compareImage(initialPng); @@ -265,32 +269,31 @@ describe('RegionMapsVisualizationTests', function () { }); it('should redo data', async function () { - const regionMapsVisualization = new RegionMapsVisualization(domNode, vis); await regionMapsVisualization.render(dummyTableGroup, vis.params, { resize: false, params: true, aggs: true, data: true, - uiState: false + uiState: false, }); const newTableGroup = _.cloneDeep(dummyTableGroup); - newTableGroup.rows.pop();//remove one shape + newTableGroup.rows.pop(); //remove one shape await regionMapsVisualization.render(newTableGroup, vis.params, { resize: false, params: false, aggs: false, data: true, - uiState: false + uiState: false, }); const mismatchedPixelsAfterDataChange = await compareImage(afterdatachangePng); const anotherTableGroup = _.cloneDeep(newTableGroup); - anotherTableGroup.rows.pop();//remove one shape + anotherTableGroup.rows.pop(); //remove one shape domNode.style.width = '412px'; domNode.style.height = '112px'; await regionMapsVisualization.render(anotherTableGroup, vis.params, { @@ -298,9 +301,11 @@ describe('RegionMapsVisualizationTests', function () { params: false, aggs: false, data: true, - uiState: false + uiState: false, }); - const mismatchedPixelsAfterDataChangeAndResize = await compareImage(afterdatachangeandresizePng); + const mismatchedPixelsAfterDataChangeAndResize = await compareImage( + afterdatachangeandresizePng + ); regionMapsVisualization.destroy(); expect(mismatchedPixelsAfterDataChange).to.be.lessThan(PIXEL_DIFF); @@ -314,18 +319,18 @@ describe('RegionMapsVisualizationTests', function () { params: true, aggs: true, data: true, - uiState: false + uiState: false, }); const newTableGroup = _.cloneDeep(dummyTableGroup); - newTableGroup.rows.pop();//remove one shape + newTableGroup.rows.pop(); //remove one shape vis.params.colorSchema = 'Blues'; await regionMapsVisualization.render(newTableGroup, vis.params, { resize: false, params: true, aggs: false, data: true, - uiState: false + uiState: false, }); const mismatchedPixelsAfterDataAndColorChange = await compareImage(aftercolorchangePng); @@ -342,7 +347,7 @@ describe('RegionMapsVisualizationTests', function () { params: true, aggs: true, data: true, - uiState: false + uiState: false, }); const mismatchedPixels = await compareImage(changestartupPng); @@ -350,7 +355,6 @@ describe('RegionMapsVisualizationTests', function () { expect(mismatchedPixels).to.be.lessThan(PIXEL_DIFF); }); - }); async function compareImage(expectedImageSource) { diff --git a/src/legacy/core_plugins/region_map/public/legacy.ts b/src/legacy/core_plugins/region_map/public/legacy.ts index 5e01e7ee56e2f..7adbc2117d7ee 100644 --- a/src/legacy/core_plugins/region_map/public/legacy.ts +++ b/src/legacy/core_plugins/region_map/public/legacy.ts @@ -20,7 +20,7 @@ import { PluginInitializerContext } from 'kibana/public'; import { npSetup, npStart } from 'ui/new_platform'; -import { visualizations } from '../../visualizations/public'; +import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy'; import { RegionMapPluginSetupDependencies, RegionMapsConfig } from './plugin'; import { LegacyDependenciesPlugin } from './shim'; import { plugin } from '.'; @@ -30,7 +30,7 @@ const regionmapsConfig = npSetup.core.injectedMetadata.getInjectedVar( ) as RegionMapsConfig; const plugins: Readonly')
.attr('ng-controller', 'KbnTableVisController')
@@ -157,7 +162,7 @@ describe('Table Vis - Controller', async function () {
it('sets the sort on the scope when it is passed as a vis param', async function () {
const sortObj = {
columnIndex: 1,
- direction: 'asc'
+ direction: 'asc',
};
const vis = new OneRangeVis({ sort: sortObj });
initController(vis);
@@ -181,7 +186,6 @@ describe('Table Vis - Controller', async function () {
});
it('passes partialRows:true to tabify based on the vis params', function () {
-
const vis = new OneRangeVis({ showPartialRows: true });
initController(vis);
@@ -189,7 +193,6 @@ describe('Table Vis - Controller', async function () {
});
it('passes partialRows:false to tabify based on the vis params', function () {
-
const vis = new OneRangeVis({ showPartialRows: false });
initController(vis);
diff --git a/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table.js b/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table.js
index b0476ae224866..8521ee729f313 100644
--- a/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table.js
+++ b/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table.js
@@ -31,10 +31,9 @@ import { round } from 'lodash';
import { VisFactoryProvider } from 'ui/vis/vis_factory';
import { createTableVisTypeDefinition } from '../../table_vis_type';
-import { visualizations } from '../../../../visualizations/public';
+import { setup } from '../../../../visualizations/public/np_ready/public/legacy';
describe('Table Vis - AggTable Directive', function () {
-
let $rootScope;
let $compile;
let Vis;
@@ -51,19 +50,21 @@ describe('Table Vis - AggTable Directive', function () {
const vis2 = new Vis(indexPattern, {
type: 'table',
params: {
- showMetricsAtAllLevels: true
+ showMetricsAtAllLevels: true,
},
aggs: [
{ type: 'avg', schema: 'metric', params: { field: 'bytes' } },
{ type: 'terms', schema: 'bucket', params: { field: 'extension' } },
{ type: 'terms', schema: 'bucket', params: { field: 'geo.src' } },
- { type: 'terms', schema: 'bucket', params: { field: 'machine.os' } }
- ]
+ { type: 'terms', schema: 'bucket', params: { field: 'machine.os' } },
+ ],
});
vis2.aggs.aggs.forEach(function (agg, i) {
agg.id = 'agg_' + (i + 1);
});
- tabifiedData.threeTermBuckets = tabifyAggResponse(vis2.aggs, fixtures.threeTermBuckets, { metricsAtAllLevels: true });
+ tabifiedData.threeTermBuckets = tabifyAggResponse(vis2.aggs, fixtures.threeTermBuckets, {
+ metricsAtAllLevels: true,
+ });
const vis3 = new Vis(indexPattern, {
type: 'table',
@@ -71,41 +72,54 @@ describe('Table Vis - AggTable Directive', function () {
{ type: 'avg', schema: 'metric', params: { field: 'bytes' } },
{ type: 'min', schema: 'metric', params: { field: '@timestamp' } },
{ type: 'terms', schema: 'bucket', params: { field: 'extension' } },
- { type: 'date_histogram', schema: 'bucket', params: { field: '@timestamp', interval: 'd' } },
- { type: 'derivative', schema: 'metric',
- params: { metricAgg: 'custom', customMetric: { id: '5-orderAgg', type: 'count' } } },
- { type: 'top_hits', schema: 'metric', params: { field: 'bytes', aggregate: { val: 'min' }, size: 1 } }
- ]
+ {
+ type: 'date_histogram',
+ schema: 'bucket',
+ params: { field: '@timestamp', interval: 'd' },
+ },
+ {
+ type: 'derivative',
+ schema: 'metric',
+ params: { metricAgg: 'custom', customMetric: { id: '5-orderAgg', type: 'count' } },
+ },
+ {
+ type: 'top_hits',
+ schema: 'metric',
+ params: { field: 'bytes', aggregate: { val: 'min' }, size: 1 },
+ },
+ ],
});
vis3.aggs.aggs.forEach(function (agg, i) {
agg.id = 'agg_' + (i + 1);
});
- tabifiedData.oneTermOneHistogramBucketWithTwoMetricsOneTopHitOneDerivative =
- tabifyAggResponse(vis3.aggs, fixtures.oneTermOneHistogramBucketWithTwoMetricsOneTopHitOneDerivative);
+ tabifiedData.oneTermOneHistogramBucketWithTwoMetricsOneTopHitOneDerivative = tabifyAggResponse(
+ vis3.aggs,
+ fixtures.oneTermOneHistogramBucketWithTwoMetricsOneTopHitOneDerivative
+ );
};
beforeEach(ngMock.module('kibana'));
- beforeEach(ngMock.inject(function ($injector, Private, config) {
- legacyDependencies = {
- // eslint-disable-next-line new-cap
- createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization
- };
+ beforeEach(
+ ngMock.inject(function ($injector, Private, config) {
+ legacyDependencies = {
+ // eslint-disable-next-line new-cap
+ createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization,
+ };
- visualizations.types.VisTypesRegistryProvider.register(() =>
- createTableVisTypeDefinition(legacyDependencies)
- );
+ setup.types.registerVisualization(() => createTableVisTypeDefinition(legacyDependencies));
- tableAggResponse = legacyResponseHandlerProvider().handler;
- indexPattern = Private(FixturesStubbedLogstashIndexPatternProvider);
- Vis = Private(VisProvider);
- settings = config;
+ tableAggResponse = legacyResponseHandlerProvider().handler;
+ indexPattern = Private(FixturesStubbedLogstashIndexPatternProvider);
+ Vis = Private(VisProvider);
+ settings = config;
- $rootScope = $injector.get('$rootScope');
- $compile = $injector.get('$compile');
+ $rootScope = $injector.get('$rootScope');
+ $compile = $injector.get('$compile');
- init();
- }));
+ init();
+ })
+ );
let $scope;
beforeEach(function () {
@@ -115,12 +129,16 @@ describe('Table Vis - AggTable Directive', function () {
$scope.$destroy();
});
-
it('renders a simple response properly', async function () {
- $scope.dimensions = { metrics: [{ accessor: 0, format: { id: 'number' }, params: {} }], buckets: [] };
+ $scope.dimensions = {
+ metrics: [{ accessor: 0, format: { id: 'number' }, params: {} }],
+ buckets: [],
+ };
$scope.table = (await tableAggResponse(tabifiedData.metricOnly, $scope.dimensions)).tables[0];
- const $el = $compile('`)($scope);
+ const $el = $compile(
+ ``
+ )($scope);
$scope.$digest();
const $tableScope = $el.isolateScope();
const aggTable = $tableScope.aggTable;
$tableScope.table = {
columns: [],
- rows: []
+ rows: [],
};
$tableScope.exportTitle = expected;
$scope.$digest();
diff --git a/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table_group.js b/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table_group.js
index 5b9974d6ff4d5..7998a92a4759f 100644
--- a/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table_group.js
+++ b/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table_group.js
@@ -28,7 +28,7 @@ import { tabifyAggResponse } from 'ui/agg_response/tabify';
import { VisFactoryProvider } from 'ui/vis/vis_factory';
import { createTableVisTypeDefinition } from '../../table_vis_type';
-import { visualizations } from '../../../../visualizations/public';
+import { setup } from '../../../../visualizations/public/np_ready/public/legacy';
describe('Table Vis - AggTableGroup Directive', function () {
let $rootScope;
@@ -49,8 +49,8 @@ describe('Table Vis - AggTableGroup Directive', function () {
{ type: 'avg', schema: 'metric', params: { field: 'bytes' } },
{ type: 'terms', schema: 'split', params: { field: 'extension' } },
{ type: 'terms', schema: 'segment', params: { field: 'geo.src' } },
- { type: 'terms', schema: 'segment', params: { field: 'machine.os' } }
- ]
+ { type: 'terms', schema: 'segment', params: { field: 'machine.os' } },
+ ],
});
vis2.aggs.aggs.forEach(function (agg, i) {
agg.id = 'agg_' + (i + 1);
@@ -59,25 +59,25 @@ describe('Table Vis - AggTableGroup Directive', function () {
};
beforeEach(ngMock.module('kibana'));
- beforeEach(ngMock.inject(function ($injector, Private) {
- legacyDependencies = {
- // eslint-disable-next-line new-cap
- createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization
- };
+ beforeEach(
+ ngMock.inject(function ($injector, Private) {
+ legacyDependencies = {
+ // eslint-disable-next-line new-cap
+ createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization,
+ };
- visualizations.types.VisTypesRegistryProvider.register(() =>
- createTableVisTypeDefinition(legacyDependencies)
- );
+ setup.types.registerVisualization(() => createTableVisTypeDefinition(legacyDependencies));
- tableAggResponse = legacyResponseHandlerProvider().handler;
- indexPattern = Private(FixturesStubbedLogstashIndexPatternProvider);
- Vis = Private(VisProvider);
+ tableAggResponse = legacyResponseHandlerProvider().handler;
+ indexPattern = Private(FixturesStubbedLogstashIndexPatternProvider);
+ Vis = Private(VisProvider);
- $rootScope = $injector.get('$rootScope');
- $compile = $injector.get('$compile');
+ $rootScope = $injector.get('$rootScope');
+ $compile = $injector.get('$compile');
- init();
- }));
+ init();
+ })
+ );
let $scope;
beforeEach(function () {
@@ -88,13 +88,18 @@ describe('Table Vis - AggTableGroup Directive', function () {
});
it('renders a simple split response properly', async function () {
- $scope.dimensions = { metrics: [{ accessor: 0, format: { id: 'number' }, params: {} }], buckets: [] };
+ $scope.dimensions = {
+ metrics: [{ accessor: 0, format: { id: 'number' }, params: {} }],
+ buckets: [],
+ };
$scope.group = await tableAggResponse(tabifiedData.metricOnly, $scope.dimensions);
$scope.sort = {
columnIndex: null,
- direction: null
+ direction: null,
};
- const $el = $(' = {
- visualizations,
+ visualizations: setupVisualizations,
data: npSetup.plugins.data,
// Temporary solution
diff --git a/src/legacy/core_plugins/vis_type_table/public/plugin.ts b/src/legacy/core_plugins/vis_type_table/public/plugin.ts
index 21b6e21d6d639..6a39e8079a9fd 100644
--- a/src/legacy/core_plugins/vis_type_table/public/plugin.ts
+++ b/src/legacy/core_plugins/vis_type_table/public/plugin.ts
@@ -16,7 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { VisualizationsSetup } from '../../visualizations/public';
+import { VisualizationsSetup } from '../../visualizations/public/np_ready/public';
import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public';
import {
@@ -63,7 +63,7 @@ export class TableVisPlugin implements Plugin, void> {
data.expressions.registerFunction(createTableVisFn);
- visualizations.types.VisTypesRegistryProvider.register(() =>
+ visualizations.types.registerVisualization(() =>
createTableVisTypeDefinition(visualizationDependencies)
);
}
diff --git a/src/legacy/core_plugins/vis_type_tagcloud/public/legacy.ts b/src/legacy/core_plugins/vis_type_tagcloud/public/legacy.ts
index 01b2d99ce509c..6a5e06b6e6978 100644
--- a/src/legacy/core_plugins/vis_type_tagcloud/public/legacy.ts
+++ b/src/legacy/core_plugins/vis_type_tagcloud/public/legacy.ts
@@ -20,12 +20,12 @@
import { PluginInitializerContext } from 'kibana/public';
import { npSetup, npStart } from 'ui/new_platform';
-import { visualizations } from '../../visualizations/public';
+import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy';
import { TagCloudPluginSetupDependencies } from './plugin';
import { plugin } from '.';
const plugins: Readonly = {
- visualizations,
+ visualizations: setupVisualizations,
data: npSetup.plugins.data,
};
diff --git a/src/legacy/core_plugins/vis_type_tagcloud/public/plugin.ts b/src/legacy/core_plugins/vis_type_tagcloud/public/plugin.ts
index e7f633b4af377..e13e9896e3940 100644
--- a/src/legacy/core_plugins/vis_type_tagcloud/public/plugin.ts
+++ b/src/legacy/core_plugins/vis_type_tagcloud/public/plugin.ts
@@ -19,7 +19,7 @@
import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from '../../../../core/public';
import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public';
-import { VisualizationsSetup } from '../../visualizations/public';
+import { VisualizationsSetup } from '../../visualizations/public/np_ready/public';
import { createTagCloudFn } from './tag_cloud_fn';
import { createTagCloudTypeDefinition } from './tag_cloud_type';
@@ -40,7 +40,7 @@ export class TagCloudPlugin implements Plugin {
public setup(core: CoreSetup, { data, visualizations }: TagCloudPluginSetupDependencies) {
data.expressions.registerFunction(createTagCloudFn);
- visualizations.types.VisTypesRegistryProvider.register(createTagCloudTypeDefinition);
+ visualizations.types.registerVisualization(createTagCloudTypeDefinition);
}
public start(core: CoreStart) {
diff --git a/src/legacy/core_plugins/vis_type_tagcloud/public/tag_cloud_type.ts b/src/legacy/core_plugins/vis_type_tagcloud/public/tag_cloud_type.ts
index 0b4d90522cc44..421821d93b045 100644
--- a/src/legacy/core_plugins/vis_type_tagcloud/public/tag_cloud_type.ts
+++ b/src/legacy/core_plugins/vis_type_tagcloud/public/tag_cloud_type.ts
@@ -23,7 +23,7 @@ import { Status } from 'ui/vis/update_status';
import { Schemas } from 'ui/vis/editors/default/schemas';
import { TagCloudOptions } from './components/tag_cloud_options';
-import { visFactory } from '../../visualizations/public';
+import { visFactory } from '../../visualizations/public/np_ready/public';
// @ts-ignore
import { TagCloudVisualization } from './components/tag_cloud_visualization';
diff --git a/src/legacy/core_plugins/vis_type_vega/public/__tests__/vega_visualization.js b/src/legacy/core_plugins/vis_type_vega/public/__tests__/vega_visualization.js
index 681f4486a02d7..012f144983e98 100644
--- a/src/legacy/core_plugins/vis_type_vega/public/__tests__/vega_visualization.js
+++ b/src/legacy/core_plugins/vis_type_vega/public/__tests__/vega_visualization.js
@@ -41,10 +41,10 @@ import vegaMapImage256 from './vega_map_image_256.png';
import { VegaParser } from '../data_model/vega_parser';
import { SearchCache } from '../data_model/search_cache';
-import { visualizations } from '../../../visualizations/public';
+import { setup } from '../../../visualizations/public/np_ready/public/legacy';
import { createVegaTypeDefinition } from '../vega_type';
-const THRESHOLD = 0.10;
+const THRESHOLD = 0.1;
const PIXEL_DIFF = 30;
describe('VegaVisualizations', () => {
@@ -57,22 +57,24 @@ describe('VegaVisualizations', () => {
let vegaVisualizationDependencies;
beforeEach(ngMock.module('kibana'));
- beforeEach(ngMock.inject((Private, $injector) => {
- vegaVisualizationDependencies = {
- es: $injector.get('es'),
- serviceSettings: $injector.get('serviceSettings'),
- uiSettings: $injector.get('config'),
- };
+ beforeEach(
+ ngMock.inject((Private, $injector) => {
+ vegaVisualizationDependencies = {
+ es: $injector.get('es'),
+ serviceSettings: $injector.get('serviceSettings'),
+ uiSettings: $injector.get('config'),
+ };
- visualizations.types.VisTypesRegistryProvider.register(() =>
- createVegaTypeDefinition(vegaVisualizationDependencies)
- );
+ setup.types.registerVisualization(() =>
+ createVegaTypeDefinition(vegaVisualizationDependencies)
+ );
- Vis = Private(visModule.VisProvider);
+ Vis = Private(visModule.VisProvider);
- VegaVisualization = createVegaVisualization(vegaVisualizationDependencies);
- indexPattern = Private(LogstashIndexPatternStubProvider);
- }));
+ VegaVisualization = createVegaVisualization(vegaVisualizationDependencies);
+ indexPattern = Private(LogstashIndexPatternStubProvider);
+ })
+ );
describe('VegaVisualization - basics', () => {
beforeEach(async function () {
@@ -105,15 +107,12 @@ describe('VegaVisualizations', () => {
await vegaVis.render(vegaParser, vis.params, { resize: true });
const mismatchedPixels2 = await compareImage(vegaliteImage256);
expect(mismatchedPixels2).to.be.lessThan(PIXEL_DIFF);
-
} finally {
vegaVis.destroy();
}
-
});
it('should show vega graph', async function () {
-
let vegaVis;
try {
vegaVis = new VegaVisualization(domNode, vis);
@@ -127,20 +126,16 @@ describe('VegaVisualizations', () => {
} finally {
vegaVis.destroy();
}
-
});
it('should show vegatooltip on mouseover over a vega graph', async () => {
-
let vegaVis;
try {
-
vegaVis = new VegaVisualization(domNode, vis);
const vegaParser = new VegaParser(vegaTooltipGraph, new SearchCache());
await vegaParser.parseAsync();
await vegaVis.render(vegaParser, vis.params, { data: true });
-
const $el = $(domNode);
const offset = $el.offset();
@@ -160,27 +155,24 @@ describe('VegaVisualizations', () => {
expect(tooltip).to.be.ok();
expect(tooltip.innerHTML).to.be(
'' +
- '
');
+ '' +
+ '
'
+ );
vegaVis.destroy();
tooltip = document.getElementById('vega-kibana-tooltip');
expect(tooltip).to.not.be.ok();
-
} finally {
vegaVis.destroy();
}
-
});
it('should show vega blank rectangle on top of a map (vegamap)', async () => {
-
let vegaVis;
try {
-
vegaVis = new VegaVisualization(domNode, vis);
const vegaParser = new VegaParser(vegaMapGraph, new SearchCache());
await vegaParser.parseAsync();
@@ -191,19 +183,17 @@ describe('VegaVisualizations', () => {
await vegaVis.render(vegaParser, vis.params, { data: true });
const mismatchedPixels = await compareImage(vegaMapImage256);
expect(mismatchedPixels).to.be.lessThan(PIXEL_DIFF);
-
} finally {
vegaVis.destroy();
}
-
});
it('should add a small subpixel value to the height of the canvas to avoid getting it set to 0', async () => {
let vegaVis;
try {
-
vegaVis = new VegaVisualization(domNode, vis);
- const vegaParser = new VegaParser(`{
+ const vegaParser = new VegaParser(
+ `{
"$schema": "https://vega.github.io/schema/vega/v3.json",
"marks": [
{
@@ -222,7 +212,9 @@ describe('VegaVisualizations', () => {
}
}
]
- }`, new SearchCache());
+ }`,
+ new SearchCache()
+ );
await vegaParser.parseAsync();
domNode.style.width = '256px';
@@ -240,10 +232,8 @@ describe('VegaVisualizations', () => {
vegaVis.destroy();
}
});
-
});
-
async function compareImage(expectedImageSource) {
const elementList = domNode.querySelectorAll('canvas');
expect(elementList.length).to.equal(1);
@@ -267,5 +257,4 @@ describe('VegaVisualizations', () => {
domNode.innerHTML = '';
document.body.removeChild(domNode);
}
-
});
diff --git a/src/legacy/core_plugins/vis_type_vega/public/legacy.ts b/src/legacy/core_plugins/vis_type_vega/public/legacy.ts
index 5136046b31a97..15cf97beb5717 100644
--- a/src/legacy/core_plugins/vis_type_vega/public/legacy.ts
+++ b/src/legacy/core_plugins/vis_type_vega/public/legacy.ts
@@ -20,13 +20,13 @@
import { PluginInitializerContext } from 'kibana/public';
import { npSetup, npStart } from 'ui/new_platform';
-import { visualizations } from '../../visualizations/public';
+import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy';
import { VegaPluginSetupDependencies } from './plugin';
import { LegacyDependenciesPlugin } from './shim';
import { plugin } from '.';
const plugins: Readonly = {
- visualizations,
+ visualizations: setupVisualizations,
data: npSetup.plugins.data,
// Temporary solution
diff --git a/src/legacy/core_plugins/vis_type_vega/public/plugin.ts b/src/legacy/core_plugins/vis_type_vega/public/plugin.ts
index 039ef49cb2289..b2a6fade883ca 100644
--- a/src/legacy/core_plugins/vis_type_vega/public/plugin.ts
+++ b/src/legacy/core_plugins/vis_type_vega/public/plugin.ts
@@ -25,7 +25,7 @@ import {
} from '../../../../core/public';
import { LegacyDependenciesPlugin, LegacyDependenciesPluginSetup } from './shim';
import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public';
-import { VisualizationsSetup } from '../../visualizations/public';
+import { VisualizationsSetup } from '../../visualizations/public/np_ready/public';
import { createVegaFn } from './vega_fn';
import { createVegaTypeDefinition } from './vega_type';
@@ -61,7 +61,7 @@ export class VegaPlugin implements Plugin, void> {
data.expressions.registerFunction(() => createVegaFn(visualizationDependencies));
- visualizations.types.VisTypesRegistryProvider.register(() =>
+ visualizations.types.registerVisualization(() =>
createVegaTypeDefinition(visualizationDependencies)
);
}
diff --git a/src/legacy/core_plugins/vis_type_vega/public/vega_request_handler.ts b/src/legacy/core_plugins/vis_type_vega/public/vega_request_handler.ts
index a930e369c3e1c..22a71bd999d54 100644
--- a/src/legacy/core_plugins/vis_type_vega/public/vega_request_handler.ts
+++ b/src/legacy/core_plugins/vis_type_vega/public/vega_request_handler.ts
@@ -17,7 +17,8 @@
* under the License.
*/
import { Filter } from '@kbn/es-query';
-import { timefilter, TimeRange } from 'ui/timefilter';
+import { timefilter } from 'ui/timefilter';
+import { TimeRange } from 'src/plugins/data/public';
import { Query } from 'src/legacy/core_plugins/data/public';
// @ts-ignore
diff --git a/src/legacy/core_plugins/vis_type_vega/public/vega_type.ts b/src/legacy/core_plugins/vis_type_vega/public/vega_type.ts
index 6ffcd8867ffea..d1f04c794e3c6 100644
--- a/src/legacy/core_plugins/vis_type_vega/public/vega_type.ts
+++ b/src/legacy/core_plugins/vis_type_vega/public/vega_type.ts
@@ -25,7 +25,7 @@ import { DefaultEditorSize } from 'ui/vis/editor_size';
import { defaultFeedbackMessage } from 'ui/vis/default_feedback_message';
import vegaEditorTemplate from './vega_editor_template.html';
-import { visFactory } from '../../visualizations/public';
+import { visFactory } from '../../visualizations/public/np_ready/public';
import { VegaVisualizationDependencies } from './plugin';
import { createVegaRequestHandler } from './vega_request_handler';
diff --git a/src/legacy/core_plugins/visualizations/index.ts b/src/legacy/core_plugins/visualizations/index.ts
index bb9ef1588bdc2..3642071667f48 100644
--- a/src/legacy/core_plugins/visualizations/index.ts
+++ b/src/legacy/core_plugins/visualizations/index.ts
@@ -25,7 +25,7 @@ export default function VisualizationsPlugin(kibana: any) {
const config: Legacy.PluginSpecOptions = {
id: 'visualizations',
require: ['data'],
- publicDir: resolve(__dirname, 'public'),
+ publicDir: resolve(__dirname, 'public/np_ready/public'),
config: (Joi: any) => {
return Joi.object({
enabled: Joi.boolean().default(true),
diff --git a/src/legacy/core_plugins/visualizations/public/index.ts b/src/legacy/core_plugins/visualizations/public/index.ts
deleted file mode 100644
index 10fef3112335b..0000000000000
--- a/src/legacy/core_plugins/visualizations/public/index.ts
+++ /dev/null
@@ -1,71 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import { FiltersService, FiltersSetup } from './filters';
-import { TypesService, TypesSetup } from './types';
-
-class VisualizationsPlugin {
- private readonly filters: FiltersService;
- private readonly types: TypesService;
-
- constructor() {
- this.filters = new FiltersService();
- this.types = new TypesService();
- }
-
- public setup() {
- return {
- filters: this.filters.setup(),
- types: this.types.setup(),
- };
- }
-
- public stop() {
- this.filters.stop();
- this.types.stop();
- }
-}
-
-/**
- * We export visualizations here so that users importing from 'plugins/visualizations'
- * will automatically receive the response value of the `setup` contract, mimicking
- * the data that will eventually be injected by the new platform.
- */
-export const visualizations = new VisualizationsPlugin().setup();
-
-/** @public */
-export interface VisualizationsSetup {
- filters: FiltersSetup;
- types: TypesSetup;
-}
-
-/** @public types */
-export {
- Vis,
- visFactory,
- DefaultEditorSize,
- VisParams,
- VisProvider,
- VisState,
- // VisualizationController,
- // VisType,
- VisTypeAlias,
- VisTypesRegistry,
- Status,
-} from './types';
diff --git a/src/legacy/core_plugins/visualizations/public/np_ready/kibana.json b/src/legacy/core_plugins/visualizations/public/np_ready/kibana.json
new file mode 100644
index 0000000000000..8ecf3dfce6e94
--- /dev/null
+++ b/src/legacy/core_plugins/visualizations/public/np_ready/kibana.json
@@ -0,0 +1,9 @@
+{
+ "id": "visualizations",
+ "version": "kibana",
+ "requiredPlugins": [
+ ],
+ "server": false,
+ "ui": true
+ }
+
\ No newline at end of file
diff --git a/src/legacy/core_plugins/visualizations/public/filters/filters_service.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/filters/filters_service.ts
similarity index 87%
rename from src/legacy/core_plugins/visualizations/public/filters/filters_service.ts
rename to src/legacy/core_plugins/visualizations/public/np_ready/public/filters/filters_service.ts
index 60c26d7cbdc1d..51709f365dbbd 100644
--- a/src/legacy/core_plugins/visualizations/public/filters/filters_service.ts
+++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/filters/filters_service.ts
@@ -17,8 +17,10 @@
* under the License.
*/
-// @ts-ignore
-import { VisFiltersProvider, createFilter } from 'ui/vis/vis_filters';
+interface SetupDependecies {
+ VisFiltersProvider: any;
+ createFilter: any;
+}
/**
* Vis Filters Service
@@ -26,7 +28,7 @@ import { VisFiltersProvider, createFilter } from 'ui/vis/vis_filters';
* @internal
*/
export class FiltersService {
- public setup() {
+ public setup({ VisFiltersProvider, createFilter }: SetupDependecies) {
return {
VisFiltersProvider,
createFilter,
diff --git a/src/legacy/core_plugins/visualizations/public/filters/index.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/filters/index.ts
similarity index 100%
rename from src/legacy/core_plugins/visualizations/public/filters/index.ts
rename to src/legacy/core_plugins/visualizations/public/np_ready/public/filters/index.ts
diff --git a/src/dev/build/tasks/nodejs/__tests__/node_shasums.js b/src/legacy/core_plugins/visualizations/public/np_ready/public/index.ts
similarity index 57%
rename from src/dev/build/tasks/nodejs/__tests__/node_shasums.js
rename to src/legacy/core_plugins/visualizations/public/np_ready/public/index.ts
index 3e400283dbd80..d38acaa3cf3f2 100644
--- a/src/dev/build/tasks/nodejs/__tests__/node_shasums.js
+++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/index.ts
@@ -17,13 +17,29 @@
* under the License.
*/
-import expect from '@kbn/expect';
+import { PluginInitializerContext } from 'src/core/public';
+import { VisualizationsPublicPlugin, Setup } from './plugin';
-import { getNodeShasums } from '../node_shasums';
+/** @public */
+export type VisualizationsSetup = Setup;
-describe('src/dev/build/tasks/nodejs/node_shasums', () => {
- it('resolves to an object with shasums for node downloads for version', async () => {
- const shasums = await getNodeShasums('8.9.4');
- expect(shasums).to.have.property('node-v8.9.4.tar.gz');
- });
-});
+/** @public types */
+export {
+ Vis,
+ visFactory,
+ DefaultEditorSize,
+ VisParams,
+ VisProvider,
+ VisState,
+ // VisualizationController,
+ // VisType,
+ VisTypeAlias,
+ VisTypesRegistry,
+ Status,
+} from './types';
+
+export function plugin(initializerContext: PluginInitializerContext) {
+ return new VisualizationsPublicPlugin(initializerContext);
+}
+
+export { VisualizationsPublicPlugin as Plugin };
diff --git a/src/legacy/core_plugins/visualizations/public/np_ready/public/legacy.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/legacy.ts
new file mode 100644
index 0000000000000..04a49294bd0c6
--- /dev/null
+++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/legacy.ts
@@ -0,0 +1,50 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+/* eslint-disable @kbn/eslint/no-restricted-paths */
+import { npSetup, npStart } from 'ui/new_platform';
+// @ts-ignore
+import { VisFiltersProvider, createFilter } from 'ui/vis/vis_filters';
+// @ts-ignore
+import { defaultFeedbackMessage } from 'ui/vis/default_feedback_message';
+// @ts-ignore
+import { VisProvider as Vis } from 'ui/vis/index.js';
+// @ts-ignore
+import { VisFactoryProvider } from 'ui/vis/vis_factory';
+import { VisTypesRegistryProvider } from 'ui/registry/vis_types';
+/* eslint-enable @kbn/eslint/no-restricted-paths */
+
+import { visTypeAliasRegistry } from './types/vis_type_alias_registry';
+
+import { plugin } from '.';
+
+const pluginInstance = plugin({} as any);
+
+export const setup = pluginInstance.setup(npSetup.core, {
+ __LEGACY: {
+ VisFiltersProvider,
+ createFilter,
+
+ Vis,
+ VisFactoryProvider,
+ VisTypesRegistryProvider,
+ defaultFeedbackMessage,
+ visTypeAliasRegistry,
+ },
+});
+export const start = pluginInstance.start(npStart.core);
diff --git a/src/legacy/core_plugins/visualizations/public/np_ready/public/mocks.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/mocks.ts
new file mode 100644
index 0000000000000..df5e4d25dedcc
--- /dev/null
+++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/mocks.ts
@@ -0,0 +1,92 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+/* eslint-disable @kbn/eslint/no-restricted-paths */
+jest.mock('ui/vis/vis_filters');
+jest.mock('ui/vis/default_feedback_message');
+jest.mock('ui/vis/index.js');
+jest.mock('ui/vis/vis_factory');
+jest.mock('ui/registry/vis_types');
+// @ts-ignore
+import { VisFiltersProvider, createFilter } from 'ui/vis/vis_filters';
+// @ts-ignore
+import { defaultFeedbackMessage } from 'ui/vis/default_feedback_message';
+// @ts-ignore
+import { VisProvider as Vis } from 'ui/vis/index.js';
+// @ts-ignore
+import { VisFactoryProvider } from 'ui/vis/vis_factory';
+import { VisTypesRegistryProvider } from 'ui/registry/vis_types';
+/* eslint-enable @kbn/eslint/no-restricted-paths */
+jest.mock('./types/vis_type_alias_registry');
+import { visTypeAliasRegistry } from './types/vis_type_alias_registry';
+
+import { Plugin } from '.';
+import { coreMock } from '../../../../../../core/public/mocks';
+
+export type Setup = jest.Mocked>;
+export type Start = jest.Mocked>;
+
+const createSetupContract = (): Setup => ({
+ filters: {
+ VisFiltersProvider: jest.fn(),
+ createFilter: jest.fn(),
+ },
+ types: {
+ Vis,
+ VisFactoryProvider: jest.fn(),
+ registerVisualization: jest.fn(),
+ defaultFeedbackMessage,
+ visTypeAliasRegistry: {
+ add: jest.fn(),
+ get: jest.fn(),
+ },
+ },
+});
+
+const createStartContract = (): Start => {};
+
+const createInstance = () => {
+ const plugin = new Plugin({} as any);
+
+ const setup = plugin.setup(coreMock.createSetup(), {
+ __LEGACY: {
+ VisFiltersProvider,
+ createFilter,
+
+ Vis,
+ VisFactoryProvider,
+ VisTypesRegistryProvider,
+ defaultFeedbackMessage,
+ visTypeAliasRegistry,
+ },
+ });
+ const doStart = () => plugin.start(coreMock.createStart());
+
+ return {
+ plugin,
+ setup,
+ doStart,
+ };
+};
+
+export const visualizationsPluginMock = {
+ createSetupContract,
+ createStartContract,
+ createInstance,
+};
diff --git a/src/legacy/core_plugins/visualizations/public/np_ready/public/plugin.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/plugin.ts
new file mode 100644
index 0000000000000..abf5974b77532
--- /dev/null
+++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/plugin.ts
@@ -0,0 +1,88 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from 'src/core/public';
+
+import { FiltersService, FiltersSetup } from './filters';
+import { TypesService, TypesSetup } from './types';
+import { VisTypeAliasRegistry } from './types/vis_type_alias_registry';
+
+interface SetupDependencies {
+ __LEGACY: {
+ VisFiltersProvider: any;
+ createFilter: any;
+
+ Vis: any;
+ VisFactoryProvider: any;
+ VisTypesRegistryProvider: any;
+ defaultFeedbackMessage: any;
+ visTypeAliasRegistry: VisTypeAliasRegistry;
+ };
+}
+
+export interface Setup {
+ filters: FiltersSetup;
+ types: TypesSetup;
+}
+
+export type Start = void;
+
+export class VisualizationsPublicPlugin implements Plugin {
+ private readonly filters: FiltersService;
+ private readonly types: TypesService;
+
+ constructor(initializerContext: PluginInitializerContext) {
+ this.filters = new FiltersService();
+ this.types = new TypesService();
+ }
+
+ public setup(core: CoreSetup, { __LEGACY }: SetupDependencies) {
+ const {
+ VisFiltersProvider,
+ createFilter,
+ Vis,
+ VisFactoryProvider,
+ VisTypesRegistryProvider,
+ defaultFeedbackMessage,
+ visTypeAliasRegistry,
+ } = __LEGACY;
+
+ return {
+ filters: this.filters.setup({
+ VisFiltersProvider,
+ createFilter,
+ }),
+ types: this.types.setup({
+ Vis,
+ VisFactoryProvider,
+ VisTypesRegistryProvider,
+ defaultFeedbackMessage,
+ visTypeAliasRegistry,
+ }),
+ };
+ }
+
+ public start(core: CoreStart) {
+ // Do nothing yet...
+ }
+
+ public stop() {
+ this.filters.stop();
+ this.types.stop();
+ }
+}
diff --git a/src/legacy/core_plugins/visualizations/public/types/index.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/types/index.ts
similarity index 100%
rename from src/legacy/core_plugins/visualizations/public/types/index.ts
rename to src/legacy/core_plugins/visualizations/public/np_ready/public/types/index.ts
diff --git a/src/legacy/core_plugins/visualizations/public/types/types_service.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/types/types_service.ts
similarity index 72%
rename from src/legacy/core_plugins/visualizations/public/types/types_service.ts
rename to src/legacy/core_plugins/visualizations/public/np_ready/public/types/types_service.ts
index cb5328812b406..28574917ba1bb 100644
--- a/src/legacy/core_plugins/visualizations/public/types/types_service.ts
+++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/types/types_service.ts
@@ -17,18 +17,23 @@
* under the License.
*/
+/* eslint-disable @kbn/eslint/no-restricted-paths */
// @ts-ignore
-import { defaultFeedbackMessage } from 'ui/vis/default_feedback_message';
-// @ts-ignore
-import { VisProvider as Vis } from 'ui/vis/index.js';
-// @ts-ignore
-import { VisFactoryProvider, visFactory } from 'ui/vis/vis_factory';
+import { visFactory } from 'ui/vis/vis_factory';
// @ts-ignore
import { DefaultEditorSize } from 'ui/vis/editor_size';
-import { VisTypesRegistryProvider } from 'ui/registry/vis_types';
import * as types from 'ui/vis/vis';
+/* eslint-enable @kbn/eslint/no-restricted-paths */
-import { visTypeAliasRegistry, VisTypeAlias } from './vis_type_alias_registry';
+import { VisTypeAliasRegistry, VisTypeAlias } from './vis_type_alias_registry';
+
+interface SetupDependencies {
+ Vis: any;
+ VisFactoryProvider: any;
+ VisTypesRegistryProvider: any;
+ defaultFeedbackMessage: any;
+ visTypeAliasRegistry: VisTypeAliasRegistry;
+}
/**
* Vis Types Service
@@ -36,11 +41,19 @@ import { visTypeAliasRegistry, VisTypeAlias } from './vis_type_alias_registry';
* @internal
*/
export class TypesService {
- public setup() {
+ public setup({
+ Vis,
+ VisFactoryProvider,
+ VisTypesRegistryProvider,
+ defaultFeedbackMessage,
+ visTypeAliasRegistry,
+ }: SetupDependencies) {
return {
Vis,
VisFactoryProvider,
- VisTypesRegistryProvider,
+ registerVisualization: (registerFn: () => any) => {
+ VisTypesRegistryProvider.register(registerFn);
+ },
defaultFeedbackMessage, // make default in base vis type, or move?
visTypeAliasRegistry,
};
diff --git a/src/legacy/core_plugins/visualizations/public/types/vis_type_alias_registry.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/types/vis_type_alias_registry.ts
similarity index 90%
rename from src/legacy/core_plugins/visualizations/public/types/vis_type_alias_registry.ts
rename to src/legacy/core_plugins/visualizations/public/np_ready/public/types/vis_type_alias_registry.ts
index 91040cf966567..eb84f93a0d3ba 100644
--- a/src/legacy/core_plugins/visualizations/public/types/vis_type_alias_registry.ts
+++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/types/vis_type_alias_registry.ts
@@ -52,7 +52,12 @@ export interface VisTypeAlias {
const registry: VisTypeAlias[] = [];
-export const visTypeAliasRegistry = {
+export interface VisTypeAliasRegistry {
+ get: () => VisTypeAlias[];
+ add: (newVisTypeAlias: VisTypeAlias) => void;
+}
+
+export const visTypeAliasRegistry: VisTypeAliasRegistry = {
get: () => [...registry],
add: (newVisTypeAlias: VisTypeAlias) => {
if (registry.find(visTypeAlias => visTypeAlias.name === newVisTypeAlias.name)) {
diff --git a/src/legacy/ui/field_formats/__tests__/field_format.js b/src/legacy/ui/field_formats/__tests__/field_format.js
deleted file mode 100644
index bf8ff9f33b18c..0000000000000
--- a/src/legacy/ui/field_formats/__tests__/field_format.js
+++ /dev/null
@@ -1,180 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import _ from 'lodash';
-import expect from '@kbn/expect';
-import { asPrettyString } from '../../../core_plugins/kibana/common/utils/as_pretty_string';
-import { FieldFormat } from '../field_format';
-
-describe('FieldFormat class', function () {
-
- let TestFormat;
-
- beforeEach(function () {
- TestFormat = class _TestFormat extends FieldFormat {
- static id = 'test-format';
- static title = 'Test Format';
- _convert(val) {
- return asPrettyString(val);
- }
- };
- });
-
- describe('params', function () {
- it('accepts its params via the constructor', function () {
- const f = new TestFormat({ foo: 'bar' });
- expect(f.param('foo')).to.be('bar');
- });
-
- it('allows reading a clone of the params', function () {
- const params = { foo: 'bar' };
- const f = new TestFormat(params);
- const output = f.params();
- expect(output).to.eql(params);
- expect(output).to.not.be(params);
- });
- });
-
- describe('type', function () {
- it('links the constructor class to instances as the `type`', function () {
- const f = new TestFormat();
- expect(f.type).to.be(TestFormat);
- });
- });
-
- describe('toJSON', function () {
- it('serializes to a version a basic id and param pair', function () {
- const f = new TestFormat({ foo: 'bar' });
- const ser = JSON.parse(JSON.stringify(f));
- expect(ser).to.eql({ id: 'test-format', params: { foo: 'bar' } });
- });
-
- it('removes param values that match the defaults', function () {
- TestFormat.prototype.getParamDefaults = function () {
- return { foo: 'bar' };
- };
-
- const f = new TestFormat({ foo: 'bar', baz: 'bar' });
- const ser = JSON.parse(JSON.stringify(f));
- expect(ser.params).to.eql({ baz: 'bar' });
- });
-
- it('removes the params entirely if they are empty', function () {
- const f = new TestFormat();
- const ser = JSON.parse(JSON.stringify(f));
- expect(ser).to.not.have.property('params');
- });
- });
-
- describe('converters', function () {
- describe('#getConverterFor', function () {
- it('returns a converter for a specific content type', function () {
- const f = new TestFormat();
- expect(f.getConverterFor('html')()).to.be.a('string');
- expect(f.getConverterFor('text')()).to.be.a('string');
- });
- });
-
- describe('#_convert, the instance method or methods used to format values', function () {
- it('can be a function, which gets converted to a text and html converter', function () {
- TestFormat.prototype._convert = function () {
- return 'formatted';
- };
-
- const f = new TestFormat();
- const text = f.getConverterFor('text');
- const html = f.getConverterFor('html');
- expect(text).to.not.be(html);
- expect(text('formatted')).to.be('formatted');
- expect(html('formatted')).to.be('formatted');
- });
-
- it('can be an object, with separate text and html converter', function () {
- TestFormat.prototype._convert = {
- text: _.constant('formatted text'),
- html: _.constant('formatted html'),
- };
-
- const f = new TestFormat();
- const text = f.getConverterFor('text');
- const html = f.getConverterFor('html');
- expect(text).to.not.be(html);
- expect(text('formatted text')).to.be('formatted text');
- expect(html('formatted html')).to.be('formatted html');
- });
-
- it('does not escape the output of the text converter', function () {
- TestFormat.prototype._convert = _.constant('');
- const f = new TestFormat();
- expect(f.convert('', 'text')).to.contain('<');
- });
-
- it('does escape the output of the text converter if used in an html context', function () {
- TestFormat.prototype._convert = _.constant('');
- const f = new TestFormat();
- expect(_.trimRight(_.trimLeft(f.convert('', 'html'), ''), ''))
- .to.not.contain('<');
- });
-
- it('does not escape the output of an html specific converter', function () {
- TestFormat.prototype._convert = {
- text: _.constant('![]()
'),
- html: _.constant('![]()
'),
- };
-
- const f = new TestFormat();
- expect(f.convert('', 'text')).to.be('![]()
');
- expect(f.convert('', 'html')).to.be('![]()
');
- });
- });
-
- describe('#convert', function () {
- it('formats a value, defaulting to text content type', function () {
- TestFormat.prototype._convert = {
- text: _.constant('text'),
- html: _.constant('html'),
- };
-
- const f = new TestFormat();
- expect(f.convert('val')).to.be('text');
- });
-
- it('formats a value as html, when specified via second param', function () {
- TestFormat.prototype._convert = {
- text: _.constant('text'),
- html: _.constant('html'),
- };
-
- const f = new TestFormat();
- expect(f.convert('val', 'html')).to.be('html');
- });
-
- it('formats a value as " - " when no value is specified', function () {
- const f = new TestFormat();
- expect(f.convert()).to.be(' - ');
- });
-
- it('formats a list of values as text', function () {
- const f = new TestFormat();
- expect(f.convert(['one', 'two', 'three'])).to.be('["one","two","three"]');
- });
- });
-
- });
-});
diff --git a/src/legacy/ui/field_formats/__tests__/field_formats_mixin.js b/src/legacy/ui/field_formats/__tests__/field_formats_mixin.js
deleted file mode 100644
index 8f513fe28c98b..0000000000000
--- a/src/legacy/ui/field_formats/__tests__/field_formats_mixin.js
+++ /dev/null
@@ -1,83 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import expect from '@kbn/expect';
-import sinon from 'sinon';
-
-import { FieldFormat } from '../field_format';
-import * as FieldFormatsServiceNS from '../field_formats_service';
-import { fieldFormatsMixin } from '../field_formats_mixin';
-
-describe('server.registerFieldFormat(createFormat)', () => {
- const sandbox = sinon.createSandbox();
-
- let registerFieldFormat;
- let fieldFormatServiceFactory;
- const serverMock = { decorate() {} };
- beforeEach(async () => {
- sandbox.stub(serverMock);
- await fieldFormatsMixin({}, serverMock);
- [[,, fieldFormatServiceFactory], [,, registerFieldFormat]] = serverMock.decorate.args;
- });
-
- afterEach(() => sandbox.restore());
-
- it('throws if createFormat is not a function', () => {
- expect(() => registerFieldFormat()).to.throwError(error => {
- expect(error.message).to.match(/createFormat is not a function/i);
- });
- });
-
- it('calls the createFormat() function with the FieldFormat class', () => {
- const createFormat = sinon.stub();
- registerFieldFormat(createFormat);
- sinon.assert.calledOnce(createFormat);
- sinon.assert.calledWithExactly(createFormat, sinon.match.same(FieldFormat));
- });
-
- it('passes the returned class to the FieldFormatsService', async () => {
- const { FieldFormatsService: ActualFFS } = FieldFormatsServiceNS;
- sandbox.stub(FieldFormatsServiceNS, 'FieldFormatsService').callsFake((...args) => {
- return new ActualFFS(...args);
- });
-
- const { FieldFormatsService } = FieldFormatsServiceNS;
- class FooFormat {
- static id = 'foo'
- }
- registerFieldFormat(() => FooFormat);
-
- const fieldFormats = await fieldFormatServiceFactory({
- getAll: () => ({}),
- getDefaults: () => ({})
- });
-
- sinon.assert.calledOnce(FieldFormatsService);
- sinon.assert.calledWithExactly(
- FieldFormatsService,
- // array of fieldFormat classes
- [sinon.match.same(FooFormat)],
- // getConfig() function
- sinon.match.func
- );
-
- const format = fieldFormats.getInstance({ id: 'foo' });
- expect(format).to.be.a(FooFormat);
- });
-});
diff --git a/src/legacy/ui/field_formats/__tests__/field_formats_service.js b/src/legacy/ui/field_formats/__tests__/field_formats_service.js
deleted file mode 100644
index 9ae80462c2a07..0000000000000
--- a/src/legacy/ui/field_formats/__tests__/field_formats_service.js
+++ /dev/null
@@ -1,52 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import expect from '@kbn/expect';
-import { FieldFormat } from '../field_format';
-import { FieldFormatsService } from '../field_formats_service';
-import { createNumberFormat } from '../../../core_plugins/kibana/common/field_formats/types/number';
-
-describe('FieldFormatsService', function () {
-
- const config = {};
- config['format:defaultTypeMap'] = {
- 'number': { 'id': 'number', 'params': {} },
- '_default_': { 'id': 'string', 'params': {} }
- };
- config['format:number:defaultPattern'] = '0,0.[000]';
- const getConfig = (key) => config[key];
- const fieldFormatClasses = [createNumberFormat(FieldFormat)];
-
- let fieldFormats;
- beforeEach(function () {
- fieldFormats = new FieldFormatsService(fieldFormatClasses, getConfig);
- });
-
- it('FieldFormats are accessible via getType method', function () {
- const Type = fieldFormats.getType('number');
- expect(Type.id).to.be('number');
- });
-
- it('getDefaultInstance returns default FieldFormat instance for fieldType', function () {
- const instance = fieldFormats.getDefaultInstance('number', getConfig);
- expect(instance.type.id).to.be('number');
- expect(instance.convert('0.33333')).to.be('0.333');
- });
-
-});
diff --git a/src/legacy/ui/field_formats/content_types.js b/src/legacy/ui/field_formats/content_types.js
deleted file mode 100644
index 39a5cac7b9027..0000000000000
--- a/src/legacy/ui/field_formats/content_types.js
+++ /dev/null
@@ -1,84 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import _ from 'lodash';
-import { asPrettyString } from '../../core_plugins/kibana/common/utils/as_pretty_string';
-import { getHighlightHtml } from '../../core_plugins/kibana/common/highlight/highlight_html';
-
-const types = {
- html: function (format, convert) {
- function recurse(value, field, hit, meta) {
- if (value == null) {
- return asPrettyString(value);
- }
-
- if (!value || typeof value.map !== 'function') {
- return convert.call(format, value, field, hit, meta);
- }
-
- const subVals = value.map(v => {
- return recurse(v, field, hit, meta);
- });
- const useMultiLine = subVals.some(sub => {
- return sub.indexOf('\n') > -1;
- });
-
- return subVals.join(',' + (useMultiLine ? '\n' : ' '));
- }
-
- return function (...args) {
- return `${recurse(...args)}`;
- };
- },
-
- text: function (format, convert) {
- return function recurse(value) {
- if (!value || typeof value.map !== 'function') {
- return convert.call(format, value);
- }
-
- // format a list of values. In text contexts we just use JSON encoding
- return JSON.stringify(value.map(recurse));
- };
- }
-};
-
-function fallbackText(value) {
- return asPrettyString(value);
-}
-
-function fallbackHtml(value, field, hit) {
- const formatted = _.escape(this.convert(value, 'text'));
-
- if (!hit || !hit.highlight || !hit.highlight[field.name]) {
- return formatted;
- } else {
- return getHighlightHtml(formatted, hit.highlight[field.name]);
- }
-}
-
-export function contentTypesSetup(format) {
- const src = format._convert || {};
- const converters = format._convert = {};
-
- converters.text = types.text(format, src.text || fallbackText);
- converters.html = types.html(format, src.html || fallbackHtml);
-
- return format._convert;
-}
diff --git a/src/legacy/ui/field_formats/content_types/html_content_type.ts b/src/legacy/ui/field_formats/content_types/html_content_type.ts
new file mode 100644
index 0000000000000..21cdb21d16895
--- /dev/null
+++ b/src/legacy/ui/field_formats/content_types/html_content_type.ts
@@ -0,0 +1,76 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { escape, isFunction } from 'lodash';
+import { FieldFormatConvert, IFieldFormat, HtmlConventTypeConvert } from '../types';
+
+// @ts-ignore
+import { asPrettyString } from '../../../core_plugins/kibana/common/utils/as_pretty_string';
+// @ts-ignore
+import { getHighlightHtml } from '../../../core_plugins/kibana/common/highlight/highlight_html';
+
+const CONTEXT_TYPE = 'html';
+
+const getConvertFn = (
+ format: IFieldFormat,
+ fieldFormatConvert: FieldFormatConvert
+): HtmlConventTypeConvert => {
+ const fallbackHtml: HtmlConventTypeConvert = (value, field, hit) => {
+ const formatted = escape(format.convert(value, 'text'));
+
+ return !field || !hit || !hit.highlight || !hit.highlight[field.name]
+ ? formatted
+ : getHighlightHtml(formatted, hit.highlight[field.name]);
+ };
+
+ return (fieldFormatConvert[CONTEXT_TYPE] || fallbackHtml) as HtmlConventTypeConvert;
+};
+
+export const setup = (
+ format: IFieldFormat,
+ fieldFormatConvert: FieldFormatConvert
+): FieldFormatConvert => {
+ const convert = getConvertFn(format, fieldFormatConvert);
+
+ const recurse: HtmlConventTypeConvert = (value, field, hit, meta) => {
+ if (value == null) {
+ return asPrettyString(value);
+ }
+
+ if (!value || !isFunction(value.map)) {
+ return convert.call(format, value, field, hit, meta);
+ }
+
+ const subValues = value.map((v: any) => {
+ return recurse(v, field, hit, meta);
+ });
+ const useMultiLine = subValues.some((sub: any) => {
+ return sub.indexOf('\n') > -1;
+ });
+
+ return subValues.join(',' + (useMultiLine ? '\n' : ' '));
+ };
+
+ const wrap: HtmlConventTypeConvert = (value, field, hit, meta) => {
+ return `${recurse(value, field, hit, meta)}`;
+ };
+
+ return {
+ [CONTEXT_TYPE]: wrap,
+ };
+};
diff --git a/src/legacy/ui/field_formats/content_types/index.ts b/src/legacy/ui/field_formats/content_types/index.ts
new file mode 100644
index 0000000000000..b5d98a7bc8393
--- /dev/null
+++ b/src/legacy/ui/field_formats/content_types/index.ts
@@ -0,0 +1,21 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+export { setup as textContentTypeSetup } from './text_content_type';
+export { setup as htmlContentTypeSetup } from './html_content_type';
diff --git a/src/legacy/ui/field_formats/content_types/text_content_type.ts b/src/legacy/ui/field_formats/content_types/text_content_type.ts
new file mode 100644
index 0000000000000..0a6983f8f1a87
--- /dev/null
+++ b/src/legacy/ui/field_formats/content_types/text_content_type.ts
@@ -0,0 +1,47 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { isFunction } from 'lodash';
+import { IFieldFormat, FieldFormatConvert, TextContextTypeConvert } from '../types';
+
+// @ts-ignore
+import { asPrettyString } from '../../../core_plugins/kibana/common/utils/as_pretty_string';
+
+const CONTEXT_TYPE = 'text';
+
+const getConvertFn = (fieldFormatConvert: FieldFormatConvert): TextContextTypeConvert =>
+ (fieldFormatConvert[CONTEXT_TYPE] || asPrettyString) as TextContextTypeConvert;
+
+export const setup = (
+ format: IFieldFormat,
+ fieldFormatConvert: FieldFormatConvert
+): FieldFormatConvert => {
+ const convert = getConvertFn(fieldFormatConvert);
+
+ const recurse: TextContextTypeConvert = value => {
+ if (!value || !isFunction(value.map)) {
+ return convert.call(format, value);
+ }
+
+ // format a list of values. In text contexts we just use JSON encoding
+ return JSON.stringify(value.map(recurse));
+ };
+
+ return { [CONTEXT_TYPE]: recurse };
+};
diff --git a/src/legacy/ui/field_formats/converters/custom.ts b/src/legacy/ui/field_formats/converters/custom.ts
new file mode 100644
index 0000000000000..bc9b421127228
--- /dev/null
+++ b/src/legacy/ui/field_formats/converters/custom.ts
@@ -0,0 +1,32 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { FieldFormat } from '../field_format';
+import { FieldFormatConvert } from '../types';
+
+const ID = 'custom';
+
+export const createCustomFieldFormat = (convert: FieldFormatConvert) =>
+ class CustomFieldFormat extends FieldFormat {
+ static id = ID;
+
+ public get _convert() {
+ return convert;
+ }
+ };
diff --git a/src/legacy/ui/field_formats/field_format.js b/src/legacy/ui/field_formats/field_format.js
deleted file mode 100644
index 21e4946a86b48..0000000000000
--- a/src/legacy/ui/field_formats/field_format.js
+++ /dev/null
@@ -1,123 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import _ from 'lodash';
-import { contentTypesSetup } from './content_types';
-
-export function FieldFormat(params) {
- // give the constructor a more appropriate name
- this.type = this.constructor;
-
- // keep the params and defaults separate
- this._params = params || {};
-
- // one content type, so assume text
- if (_.isFunction(this._convert)) {
- this._convert = { text: this._convert };
- }
-
- contentTypesSetup(this);
-}
-
-FieldFormat.from = function (converter) {
- class FieldFormatFromConverter extends FieldFormat {}
- FieldFormatFromConverter.prototype._convert = converter;
- return FieldFormatFromConverter;
-};
-
-/**
- * Convert a raw value to a formated string
- * @param {any} value
- * @param {string} [contentType=text] - optional content type, the only two contentTypes
- * currently supported are "html" and "text", which helps
- * formatters adjust to different contexts
- * @return {string} - the formatted string, which is assumed to be html, safe for
- * injecting into the DOM or a DOM attribute
- */
-FieldFormat.prototype.convert = function (value, contentType) {
- return this.getConverterFor(contentType)(value);
-};
-
-/**
- * Get a convert function that is bound to a specific contentType
- * @param {string} [contentType=text]
- * @return {function} - a bound converter function
- */
-FieldFormat.prototype.getConverterFor = function (contentType) {
- return this._convert[contentType || 'text'];
-};
-
-/**
- * Get parameter defaults
- * @return {object} - parameter defaults
- */
-FieldFormat.prototype.getParamDefaults = function () {
- return {};
-};
-
-/**
- * Get the value of a param. This value may be a default value.
- *
- * @param {string} name - the param name to fetch
- * @return {any}
- */
-FieldFormat.prototype.param = function (name) {
- const val = this._params[name];
- if (val || val === false || val === 0) {
- // truthy, false, or 0 are fine
- // '', NaN, null, undefined, etc are not
- return val;
- }
-
- return this.getParamDefaults()[name];
-};
-
-/**
- * Get all of the params in a single object
- * @return {object}
- */
-FieldFormat.prototype.params = function () {
- return _.cloneDeep(_.defaults({}, this._params, this.getParamDefaults()));
-};
-
-/**
- * serialize this format to a simple POJO, with only the params
- * that are not default
- *
- * @return {object}
- */
-FieldFormat.prototype.toJSON = function () {
- const type = this.type;
- const defaults = this.getParamDefaults();
-
- let params = _.transform(this._params, function (uniqParams, val, param) {
- if (val !== defaults[param]) {
- uniqParams[param] = val;
- }
- }, {});
-
- if (!_.size(params)) {
- params = undefined;
- }
-
- return {
- id: type.id,
- params: params
- };
-};
diff --git a/src/legacy/ui/field_formats/field_format.test.ts b/src/legacy/ui/field_formats/field_format.test.ts
new file mode 100644
index 0000000000000..05912d5b5f4a8
--- /dev/null
+++ b/src/legacy/ui/field_formats/field_format.test.ts
@@ -0,0 +1,187 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { constant, trimRight, trimLeft, get } from 'lodash';
+import { FieldFormat } from './field_format';
+import { FieldFormatConvert } from './types';
+
+// @ts-ignore
+import { asPrettyString } from '../../core_plugins/kibana/common/utils/as_pretty_string';
+
+const getTestFormat = (
+ _convert: FieldFormatConvert = {
+ text: (val: string) => asPrettyString(val),
+ },
+ _params?: any
+) =>
+ new (class TestFormat extends FieldFormat {
+ static id = 'test-format';
+ static title = 'Test Format';
+
+ public get _convert() {
+ return _convert;
+ }
+ })(_params);
+
+describe('FieldFormat class', () => {
+ describe('params', () => {
+ test('accepts its params via the constructor', () => {
+ const f = getTestFormat(undefined, { foo: 'bar' });
+ const fooParam = f.param('foo');
+
+ expect(fooParam).toBe('bar');
+ });
+
+ test('allows reading a clone of the params', () => {
+ const params = { foo: 'bar' };
+ const f = getTestFormat(undefined, params);
+ const output = f.params();
+
+ expect(output).toEqual(params);
+ expect(output).not.toBe(params);
+ });
+ });
+
+ describe('type', () => {
+ test('links the constructor class to instances as the `type`', () => {
+ const f = getTestFormat();
+
+ expect(get(f.type, 'id')).toBe('test-format');
+ expect(get(f.type, 'title')).toBe('Test Format');
+ });
+ });
+
+ describe('toJSON', () => {
+ it('serializes to a version a basic id and param pair', () => {
+ const f = getTestFormat(undefined, { foo: 'bar' });
+ const ser = JSON.parse(JSON.stringify(f));
+
+ expect(ser).toEqual({ id: 'test-format', params: { foo: 'bar' } });
+ });
+
+ it('removes the params entirely if they are empty', () => {
+ const f = getTestFormat();
+ const ser = JSON.parse(JSON.stringify(f));
+
+ expect(ser).not.toHaveProperty('params');
+ });
+ });
+
+ describe('converters', () => {
+ describe('#getConverterFor', () => {
+ it('returns a converter for a specific content type', () => {
+ const f = getTestFormat();
+ const htmlConverter = f.getConverterFor('html');
+ const textConverter = f.getConverterFor('text');
+
+ expect(htmlConverter && typeof htmlConverter('')).toBe('string');
+ expect(textConverter && typeof textConverter('')).toBe('string');
+ });
+ });
+
+ describe('#_convert, the instance method or methods used to format values', () => {
+ it('can be a function, which gets converted to a text and html converter', () => {
+ const f = getTestFormat({
+ text: () => 'formatted',
+ });
+ const text = f.getConverterFor('text');
+ const html = f.getConverterFor('html');
+
+ expect(text).not.toBe(html);
+ expect(text && text('formatted')).toBe('formatted');
+ expect(html && html('formatted')).toBe('formatted');
+ });
+
+ it('can be an object, with separate text and html converter', () => {
+ const f = getTestFormat({
+ text: constant('formatted text'),
+ html: constant('formatted html'),
+ });
+ const text = f.getConverterFor('text');
+ const html = f.getConverterFor('html');
+
+ expect(text).not.toBe(html);
+ expect(text && text('formatted text')).toBe('formatted text');
+ expect(html && html('formatted html')).toBe('formatted html');
+ });
+
+ it('does not escape the output of the text converter', () => {
+ const f = getTestFormat({
+ text: constant(''),
+ });
+
+ expect(f.convert('', 'text')).toContain('<');
+ });
+
+ it('does escape the output of the text converter if used in an html context', () => {
+ const f = getTestFormat({
+ text: constant(''),
+ });
+
+ const expected = trimRight(
+ trimLeft(f.convert('', 'html'), ''),
+ ''
+ );
+
+ expect(expected).not.toContain('<');
+ });
+
+ it('does not escape the output of an html specific converter', function() {
+ const f = getTestFormat({
+ text: constant('![]()
'),
+ html: constant('![]()
'),
+ });
+ expect(f.convert('', 'text')).toBe('![]()
');
+ expect(f.convert('', 'html')).toBe('![]()
');
+ });
+ });
+
+ describe('#convert', () => {
+ it('formats a value, defaulting to text content type', () => {
+ const f = getTestFormat({
+ text: constant('text'),
+ html: constant('html'),
+ });
+
+ expect(f.convert('val')).toBe('text');
+ });
+
+ it('formats a value as html, when specified via second param', () => {
+ const f = getTestFormat({
+ text: constant('text'),
+ html: constant('html'),
+ });
+
+ expect(f.convert('val', 'html')).toBe('html');
+ });
+
+ it('formats a value as " - " when no value is specified', () => {
+ const f = getTestFormat();
+
+ expect(f.convert(undefined)).toBe(' - ');
+ });
+
+ it('formats a list of values as text', () => {
+ const f = getTestFormat();
+
+ expect(f.convert(['one', 'two', 'three'])).toBe('["one","two","three"]');
+ });
+ });
+ });
+});
diff --git a/src/legacy/ui/field_formats/field_format.ts b/src/legacy/ui/field_formats/field_format.ts
new file mode 100644
index 0000000000000..226631660b8a0
--- /dev/null
+++ b/src/legacy/ui/field_formats/field_format.ts
@@ -0,0 +1,191 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { isFunction, transform, size, cloneDeep, get, defaults } from 'lodash';
+import { createCustomFieldFormat } from './converters/custom';
+import { ContentType, FieldFormatConvert, FieldFormatConvertFunction } from './types';
+
+import { htmlContentTypeSetup, textContentTypeSetup } from './content_types';
+
+const DEFAULT_CONTEXT_TYPE = 'text';
+
+export abstract class FieldFormat {
+ /**
+ * @property {string} - Field Format Id
+ * @static
+ * @public
+ */
+ static id: string;
+ /**
+ * @property {string} - Field Format Title
+ * @static
+ * @public
+ */
+ static title: string;
+
+ /**
+ * @property {string} - Field Format Type
+ * @private
+ */
+ static fieldType: string;
+
+ /**
+ * @property {FieldFormatConvert}
+ * @private
+ */
+ _convert: FieldFormatConvert = FieldFormat.setupContentType(this, get(this, '_convert', {}));
+
+ /**
+ * @property {Function} - ref to child class
+ * @private
+ */
+ type: any = this.constructor;
+
+ constructor(public _params: any = {}) {}
+
+ /**
+ * Convert a raw value to a formatted string
+ * @param {any} value
+ * @param {string} [contentType=text] - optional content type, the only two contentTypes
+ * currently supported are "html" and "text", which helps
+ * formatters adjust to different contexts
+ * @return {string} - the formatted string, which is assumed to be html, safe for
+ * injecting into the DOM or a DOM attribute
+ * @public
+ */
+ convert(value: any, contentType: ContentType = DEFAULT_CONTEXT_TYPE): string {
+ const converter = this.getConverterFor(contentType);
+
+ if (converter) {
+ return converter.call(this, value);
+ }
+
+ return value;
+ }
+
+ /**
+ * Get a convert function that is bound to a specific contentType
+ * @param {string} [contentType=text]
+ * @return {function} - a bound converter function
+ * @public
+ */
+ getConverterFor(
+ contentType: ContentType = DEFAULT_CONTEXT_TYPE
+ ): FieldFormatConvertFunction | null {
+ if (this._convert) {
+ return this._convert[contentType];
+ }
+
+ return null;
+ }
+
+ /**
+ * Get parameter defaults
+ * @return {object} - parameter defaults
+ * @public
+ */
+ getParamDefaults(): Record {
+ return {};
+ }
+
+ /**
+ * Get the value of a param. This value may be a default value.
+ *
+ * @param {string} name - the param name to fetch
+ * @return {any}
+ * @public
+ */
+ param(name: string): any {
+ const val = get(this._params, name);
+
+ if (val || val === false || val === 0) {
+ // truthy, false, or 0 are fine
+ // '', NaN, null, undefined, etc are not
+ return val;
+ }
+
+ return get(this.getParamDefaults(), name);
+ }
+
+ /**
+ * Get all of the params in a single object
+ * @return {object}
+ * @public
+ */
+ params(): Record {
+ return cloneDeep(defaults({}, this._params, this.getParamDefaults()));
+ }
+
+ /**
+ * Serialize this format to a simple POJO, with only the params
+ * that are not default
+ *
+ * @return {object}
+ * @public
+ */
+ toJSON() {
+ const id = get(this.type, 'id');
+ const defaultsParams = this.getParamDefaults() || {};
+
+ const params = transform(
+ this._params,
+ (uniqParams, val, param) => {
+ if (param && val !== get(defaultsParams, param)) {
+ uniqParams[param] = val;
+ }
+ },
+ {}
+ );
+
+ return {
+ id,
+ params: size(params) ? params : undefined,
+ };
+ }
+
+ static from(convertFn: FieldFormatConvertFunction) {
+ return createCustomFieldFormat(FieldFormat.toConvertObject(convertFn));
+ }
+
+ private static setupContentType(
+ fieldFormat: IFieldFormat,
+ convert: FieldFormatConvert | FieldFormatConvertFunction
+ ): FieldFormatConvert {
+ const convertObject = FieldFormat.toConvertObject(convert);
+
+ return {
+ ...textContentTypeSetup(fieldFormat, convertObject),
+ ...htmlContentTypeSetup(fieldFormat, convertObject),
+ };
+ }
+
+ private static toConvertObject(
+ convert: FieldFormatConvert | FieldFormatConvertFunction
+ ): FieldFormatConvert {
+ if (isFunction(convert)) {
+ return {
+ [DEFAULT_CONTEXT_TYPE]: convert,
+ };
+ }
+ return convert;
+ }
+}
+
+export type FieldFormatConvert = { [key: string]: Function } | FieldFormatConvertFunction;
+export type IFieldFormat = PublicMethodsOf;
diff --git a/src/legacy/ui/field_formats/index.js b/src/legacy/ui/field_formats/index.ts
similarity index 92%
rename from src/legacy/ui/field_formats/index.js
rename to src/legacy/ui/field_formats/index.ts
index 1bbad4800a363..cb15ba7a6b0ae 100644
--- a/src/legacy/ui/field_formats/index.js
+++ b/src/legacy/ui/field_formats/index.ts
@@ -17,5 +17,5 @@
* under the License.
*/
-export { fieldFormatsMixin } from './field_formats_mixin';
+export { fieldFormatsMixin } from './mixin/field_formats_mixin';
export { FieldFormat } from './field_format';
diff --git a/src/legacy/ui/field_formats/field_formats_mixin.js b/src/legacy/ui/field_formats/mixin/field_formats_mixin.ts
similarity index 72%
rename from src/legacy/ui/field_formats/field_formats_mixin.js
rename to src/legacy/ui/field_formats/mixin/field_formats_mixin.ts
index 76c72102ebff7..6f20ab8cdf51f 100644
--- a/src/legacy/ui/field_formats/field_formats_mixin.js
+++ b/src/legacy/ui/field_formats/mixin/field_formats_mixin.ts
@@ -17,27 +17,29 @@
* under the License.
*/
-import _ from 'lodash';
+import { has } from 'lodash';
+import { Legacy } from 'kibana';
import { FieldFormatsService } from './field_formats_service';
-import { FieldFormat } from './field_format';
+import { FieldFormat } from '../field_format';
-export function fieldFormatsMixin(kbnServer, server) {
- const fieldFormatClasses = [];
+export function fieldFormatsMixin(kbnServer: any, server: Legacy.Server) {
+ const fieldFormatClasses: FieldFormat[] = [];
// for use outside of the request context, for special cases
- server.decorate('server', 'fieldFormatServiceFactory', async function (uiSettings) {
+ server.decorate('server', 'fieldFormatServiceFactory', async function(uiSettings) {
const uiConfigs = await uiSettings.getAll();
const uiSettingDefaults = await uiSettings.getDefaults();
- Object.keys(uiSettingDefaults).forEach((key) => {
- if (_.has(uiConfigs, key) && uiSettingDefaults[key].type === 'json') {
+ Object.keys(uiSettingDefaults).forEach(key => {
+ if (has(uiConfigs, key) && uiSettingDefaults[key].type === 'json') {
uiConfigs[key] = JSON.parse(uiConfigs[key]);
}
});
- const getConfig = (key) => uiConfigs[key];
+ const getConfig = (key: string) => uiConfigs[key];
+
return new FieldFormatsService(fieldFormatClasses, getConfig);
});
- server.decorate('server', 'registerFieldFormat', (createFormat) => {
+ server.decorate('server', 'registerFieldFormat', createFormat => {
fieldFormatClasses.push(createFormat(FieldFormat));
});
}
diff --git a/src/legacy/ui/field_formats/mixin/field_formats_service.test.ts b/src/legacy/ui/field_formats/mixin/field_formats_service.test.ts
new file mode 100644
index 0000000000000..32f1579510c64
--- /dev/null
+++ b/src/legacy/ui/field_formats/mixin/field_formats_service.test.ts
@@ -0,0 +1,59 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { FieldFormat } from '../field_format';
+import { FieldFormatsService } from './field_formats_service';
+
+// @ts-ignore
+import { createNumberFormat } from '../../../core_plugins/kibana/common/field_formats/types/number';
+
+const getConfig = (key: string) => {
+ switch (key) {
+ case 'format:defaultTypeMap':
+ return {
+ number: { id: 'number', params: {} },
+ _default_: { id: 'string', params: {} },
+ };
+ case 'format:number:defaultPattern':
+ return '0,0.[000]';
+ }
+};
+
+describe('FieldFormatsService', function() {
+ let fieldFormatsService: FieldFormatsService;
+
+ beforeEach(function() {
+ const fieldFormatClasses = [createNumberFormat(FieldFormat)];
+
+ fieldFormatsService = new FieldFormatsService(fieldFormatClasses, getConfig);
+ });
+
+ test('FieldFormats are accessible via getType method', function() {
+ const Type = fieldFormatsService.getType('number');
+
+ expect(Type.id).toBe('number');
+ });
+
+ test('getDefaultInstance returns default FieldFormat instance for fieldType', function() {
+ const instance = fieldFormatsService.getDefaultInstance('number');
+
+ expect(instance.type.id).toBe('number');
+ expect(instance.convert('0.33333')).toBe('0.333');
+ });
+});
diff --git a/src/legacy/ui/field_formats/field_formats_service.js b/src/legacy/ui/field_formats/mixin/field_formats_service.ts
similarity index 66%
rename from src/legacy/ui/field_formats/field_formats_service.js
rename to src/legacy/ui/field_formats/mixin/field_formats_service.ts
index 9584f78046c35..779157f5c418b 100644
--- a/src/legacy/ui/field_formats/field_formats_service.js
+++ b/src/legacy/ui/field_formats/mixin/field_formats_service.ts
@@ -17,11 +17,20 @@
* under the License.
*/
-import _ from 'lodash';
+import { indexBy, Dictionary } from 'lodash';
+import { FieldFormat } from '../field_format';
+
+interface FieldFormatConfig {
+ id: string;
+ params?: Record;
+}
export class FieldFormatsService {
- constructor(fieldFormatClasses, getConfig) {
- this._fieldFormats = _.indexBy(fieldFormatClasses, 'id');
+ getConfig: any;
+ _fieldFormats: Dictionary;
+
+ constructor(fieldFormatClasses: FieldFormat[], getConfig: Function) {
+ this._fieldFormats = indexBy(fieldFormatClasses, 'id');
this.getConfig = getConfig;
}
@@ -30,9 +39,9 @@ export class FieldFormatsService {
* using the format:defaultTypeMap config map
*
* @param {String} fieldType - the field type
- * @return {String}
+ * @return {FieldFormatConfig}
*/
- getDefaultConfig(fieldType) {
+ getDefaultConfig(fieldType: string): FieldFormatConfig {
const defaultMap = this.getConfig('format:defaultTypeMap');
return defaultMap[fieldType] || defaultMap._default_;
}
@@ -43,21 +52,19 @@ export class FieldFormatsService {
* @param {String} fieldType
* @return {FieldFormat}
*/
- getDefaultInstance(fieldType) {
- const conf = this.getDefaultConfig(fieldType);
- const FieldFormat = this._fieldFormats[conf.id];
- return new FieldFormat(conf.params, this.getConfig);
+ getDefaultInstance(fieldType: string): FieldFormat {
+ return this.getInstance(this.getDefaultConfig(fieldType));
}
/**
* Get the fieldFormat instance for a field format configuration.
*
- * @param {Object} conf:id, conf:params
+ * @param {FieldFormatConfig} field format config
* @return {FieldFormat}
*/
- getInstance(conf) {
- const FieldFormat = this._fieldFormats[conf.id];
- return new FieldFormat(conf.params, this.getConfig);
+ getInstance(conf: FieldFormatConfig): FieldFormat {
+ // @ts-ignore
+ return new this._fieldFormats[conf.id](conf.params, this.getConfig);
}
/**
@@ -66,7 +73,7 @@ export class FieldFormatsService {
* @param {String} fieldFormatId - the FieldFormat id
* @return {FieldFormat}
*/
- getType(fieldFormatId) {
+ getType(fieldFormatId: string): any {
return this._fieldFormats[fieldFormatId];
}
}
diff --git a/src/legacy/ui/field_formats/types.ts b/src/legacy/ui/field_formats/types.ts
new file mode 100644
index 0000000000000..f5238422020c2
--- /dev/null
+++ b/src/legacy/ui/field_formats/types.ts
@@ -0,0 +1,45 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { Field } from '../../core_plugins/data/public/index_patterns';
+
+/** @public **/
+export type ContentType = 'html' | 'text';
+
+/** @public **/
+export { IFieldFormat } from './field_format';
+
+/** @internal **/
+export type HtmlConventTypeConvert = (
+ value: any,
+ field?: Field,
+ hit?: Record,
+ meta?: any
+) => string;
+
+/** @internal **/
+export type TextContextTypeConvert = (value: any) => string;
+
+/** @internal **/
+export type FieldFormatConvertFunction = HtmlConventTypeConvert | TextContextTypeConvert;
+
+/** @internal **/
+export interface FieldFormatConvert {
+ [key: string]: FieldFormatConvertFunction;
+}
diff --git a/src/legacy/ui/public/_index.scss b/src/legacy/ui/public/_index.scss
index 1c3a9c006acfd..e7d85b8cc3f8e 100644
--- a/src/legacy/ui/public/_index.scss
+++ b/src/legacy/ui/public/_index.scss
@@ -19,6 +19,7 @@
@import './exit_full_screen/index';
@import './field_editor/index';
@import './notify/index';
+@import './saved_objects/index';
@import './share/index';
@import './style_compile/index';
diff --git a/src/legacy/ui/public/chrome/chrome.js b/src/legacy/ui/public/chrome/chrome.js
index 8f58da9107673..a5a0521013a6e 100644
--- a/src/legacy/ui/public/chrome/chrome.js
+++ b/src/legacy/ui/public/chrome/chrome.js
@@ -95,7 +95,6 @@ const waitForBootstrap = new Promise(resolve => {
document.body.setAttribute('id', `${internals.app.id}-app`);
chrome.setupAngular();
- // targetDomElement.setAttribute('id', 'kibana-body');
targetDomElement.setAttribute('kbn-chrome', 'true');
targetDomElement.setAttribute('ng-class', '{ \'hidden-chrome\': !chrome.getVisible() }');
targetDomElement.className = 'app-wrapper';
diff --git a/src/legacy/ui/public/chrome/directives/kbn_chrome.js b/src/legacy/ui/public/chrome/directives/kbn_chrome.js
index d81a1ceb5f288..755cb8b42d363 100644
--- a/src/legacy/ui/public/chrome/directives/kbn_chrome.js
+++ b/src/legacy/ui/public/chrome/directives/kbn_chrome.js
@@ -77,15 +77,21 @@ export function kbnChromeProvider(chrome, internals) {
// Non-scope based code (e.g., React)
// Banners
- ReactDOM.render(
-
- ,
- document.getElementById('globalBannerList')
- );
+ const bannerListContainer = document.getElementById('globalBannerList');
+ // Banners not supported in New Platform yet
+ // https://github.com/elastic/kibana/issues/41986
+ if (bannerListContainer) {
+ ReactDOM.render(
+
+ ,
+ bannerListContainer
+ );
+ }
+
return chrome;
}
diff --git a/src/legacy/ui/public/field_editor/components/field_format_editor/editors/string/__snapshots__/string.test.js.snap b/src/legacy/ui/public/field_editor/components/field_format_editor/editors/string/__snapshots__/string.test.js.snap
index 1b48a8e6a7250..5561fbec68b3b 100644
--- a/src/legacy/ui/public/field_editor/components/field_format_editor/editors/string/__snapshots__/string.test.js.snap
+++ b/src/legacy/ui/public/field_editor/components/field_format_editor/editors/string/__snapshots__/string.test.js.snap
@@ -58,6 +58,10 @@ exports[`StringFormatEditor should render normally 1`] = `
"input": "SGVsbG8gd29ybGQ=",
"output": "SGVSBG8GD29YBGQ=",
},
+ Object {
+ "input": "%EC%95%88%EB%85%95%20%ED%82%A4%EB%B0%94%EB%82%98",
+ "output": "%EC%95%88%EB%85%95%20%ED%82%A4%EB%B0%94%EB%82%98",
+ },
]
}
/>
diff --git a/src/legacy/ui/public/field_editor/components/field_format_editor/editors/string/string.js b/src/legacy/ui/public/field_editor/components/field_format_editor/editors/string/string.js
index 8d3c1d9fca1c8..9aacc7899afee 100644
--- a/src/legacy/ui/public/field_editor/components/field_format_editor/editors/string/string.js
+++ b/src/legacy/ui/public/field_editor/components/field_format_editor/editors/string/string.js
@@ -44,7 +44,8 @@ export class StringFormatEditor extends DefaultFormatEditor {
'STAY CALM!',
'com.organizations.project.ClassName',
'hostname.net',
- 'SGVsbG8gd29ybGQ='
+ 'SGVsbG8gd29ybGQ=',
+ '%EC%95%88%EB%85%95%20%ED%82%A4%EB%B0%94%EB%82%98'
];
}
diff --git a/src/legacy/ui/public/legacy_compat/angular_config.tsx b/src/legacy/ui/public/legacy_compat/angular_config.tsx
index 1e22003b32833..28d57e9f8e8c9 100644
--- a/src/legacy/ui/public/legacy_compat/angular_config.tsx
+++ b/src/legacy/ui/public/legacy_compat/angular_config.tsx
@@ -33,7 +33,7 @@ import * as Rx from 'rxjs';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n/react';
-import { InternalCoreStart } from 'kibana/public';
+import { CoreStart, LegacyCoreStart } from 'kibana/public';
import { fatalError } from 'ui/notify';
import { capabilities } from 'ui/capabilities';
@@ -77,7 +77,7 @@ export const configureAppAngularModule = (angularModule: IModule) => {
.run($setupUrlOverflowHandling(newPlatform));
};
-const getEsUrl = (newPlatform: InternalCoreStart) => {
+const getEsUrl = (newPlatform: CoreStart) => {
const a = document.createElement('a');
a.href = newPlatform.http.basePath.prepend('/elasticsearch');
const protocolPort = /https/.test(a.protocol) ? 443 : 80;
@@ -90,7 +90,7 @@ const getEsUrl = (newPlatform: InternalCoreStart) => {
};
};
-const setupCompileProvider = (newPlatform: InternalCoreStart) => (
+const setupCompileProvider = (newPlatform: LegacyCoreStart) => (
$compileProvider: ICompileProvider
) => {
if (!newPlatform.injectedMetadata.getLegacyMetadata().devMode) {
@@ -98,7 +98,7 @@ const setupCompileProvider = (newPlatform: InternalCoreStart) => (
}
};
-const setupLocationProvider = (newPlatform: InternalCoreStart) => (
+const setupLocationProvider = (newPlatform: CoreStart) => (
$locationProvider: ILocationProvider
) => {
$locationProvider.html5Mode({
@@ -110,7 +110,7 @@ const setupLocationProvider = (newPlatform: InternalCoreStart) => (
$locationProvider.hashPrefix('');
};
-export const $setupXsrfRequestInterceptor = (newPlatform: InternalCoreStart) => {
+export const $setupXsrfRequestInterceptor = (newPlatform: LegacyCoreStart) => {
const version = newPlatform.injectedMetadata.getLegacyMetadata().version;
// Configure jQuery prefilter
@@ -145,7 +145,7 @@ export const $setupXsrfRequestInterceptor = (newPlatform: InternalCoreStart) =>
* @param {HttpService} $http
* @return {undefined}
*/
-const capture$httpLoadingCount = (newPlatform: InternalCoreStart) => (
+const capture$httpLoadingCount = (newPlatform: CoreStart) => (
$rootScope: IRootScopeService,
$http: IHttpService
) => {
@@ -166,7 +166,7 @@ const capture$httpLoadingCount = (newPlatform: InternalCoreStart) => (
* lets us integrate with the angular router so that we can automatically clear
* the breadcrumbs if we switch to a Kibana app that does not use breadcrumbs correctly
*/
-const $setupBreadcrumbsAutoClear = (newPlatform: InternalCoreStart) => (
+const $setupBreadcrumbsAutoClear = (newPlatform: CoreStart) => (
$rootScope: IRootScopeService,
$injector: any
) => {
@@ -213,7 +213,7 @@ const $setupBreadcrumbsAutoClear = (newPlatform: InternalCoreStart) => (
* lets us integrate with the angular router so that we can automatically clear
* the badge if we switch to a Kibana app that does not use the badge correctly
*/
-const $setupBadgeAutoClear = (newPlatform: InternalCoreStart) => (
+const $setupBadgeAutoClear = (newPlatform: CoreStart) => (
$rootScope: IRootScopeService,
$injector: any
) => {
@@ -253,7 +253,7 @@ const $setupBadgeAutoClear = (newPlatform: InternalCoreStart) => (
* the helpExtension if we switch to a Kibana app that does not set its own
* helpExtension
*/
-const $setupHelpExtensionAutoClear = (newPlatform: InternalCoreStart) => (
+const $setupHelpExtensionAutoClear = (newPlatform: CoreStart) => (
$rootScope: IRootScopeService,
$injector: any
) => {
@@ -285,7 +285,7 @@ const $setupHelpExtensionAutoClear = (newPlatform: InternalCoreStart) => (
});
};
-const $setupUrlOverflowHandling = (newPlatform: InternalCoreStart) => (
+const $setupUrlOverflowHandling = (newPlatform: CoreStart) => (
$location: ILocationService,
$rootScope: IRootScopeService,
Private: any,
diff --git a/src/legacy/ui/public/new_platform/new_platform.ts b/src/legacy/ui/public/new_platform/new_platform.ts
index 5e0eb2feeb450..4f55349e3efe2 100644
--- a/src/legacy/ui/public/new_platform/new_platform.ts
+++ b/src/legacy/ui/public/new_platform/new_platform.ts
@@ -16,7 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { InternalCoreSetup, InternalCoreStart } from '../../../../core/public';
+import { LegacyCoreSetup, LegacyCoreStart } from '../../../../core/public';
import { Plugin as DataPlugin } from '../../../../plugins/data/public';
import {
Setup as InspectorSetup,
@@ -34,12 +34,12 @@ export interface PluginsStart {
}
export const npSetup = {
- core: (null as unknown) as InternalCoreSetup,
+ core: (null as unknown) as LegacyCoreSetup,
plugins: {} as PluginsSetup,
};
export const npStart = {
- core: (null as unknown) as InternalCoreStart,
+ core: (null as unknown) as LegacyCoreStart,
plugins: {} as PluginsStart,
};
@@ -48,18 +48,18 @@ export const npStart = {
* @internal
*/
export function __reset__() {
- npSetup.core = (null as unknown) as InternalCoreSetup;
+ npSetup.core = (null as unknown) as LegacyCoreSetup;
npSetup.plugins = {} as any;
- npStart.core = (null as unknown) as InternalCoreStart;
+ npStart.core = (null as unknown) as LegacyCoreStart;
npStart.plugins = {} as any;
}
-export function __setup__(coreSetup: InternalCoreSetup, plugins: PluginsSetup) {
+export function __setup__(coreSetup: LegacyCoreSetup, plugins: PluginsSetup) {
npSetup.core = coreSetup;
npSetup.plugins = plugins;
}
-export function __start__(coreStart: InternalCoreStart, plugins: PluginsStart) {
+export function __start__(coreStart: LegacyCoreStart, plugins: PluginsStart) {
npStart.core = coreStart;
npStart.plugins = plugins;
}
diff --git a/src/legacy/ui/public/saved_objects/_index.scss b/src/legacy/ui/public/saved_objects/_index.scss
new file mode 100644
index 0000000000000..50a192b6a7b17
--- /dev/null
+++ b/src/legacy/ui/public/saved_objects/_index.scss
@@ -0,0 +1 @@
+@import '../../../../plugins/kibana_react/public/saved_objects/index';
diff --git a/src/legacy/ui/public/saved_objects/show_saved_object_save_modal.js b/src/legacy/ui/public/saved_objects/show_saved_object_save_modal.tsx
similarity index 52%
rename from src/legacy/ui/public/saved_objects/show_saved_object_save_modal.js
rename to src/legacy/ui/public/saved_objects/show_saved_object_save_modal.tsx
index bd2fbba3aa145..6aea3c72e0c34 100644
--- a/src/legacy/ui/public/saved_objects/show_saved_object_save_modal.js
+++ b/src/legacy/ui/public/saved_objects/show_saved_object_save_modal.tsx
@@ -21,7 +21,25 @@ import React from 'react';
import ReactDOM from 'react-dom';
import { I18nContext } from 'ui/i18n';
-export function showSaveModal(saveModal) {
+/**
+ * Represents the result of trying to persist the saved object.
+ * Contains `error` prop if something unexpected happened (e.g. network error).
+ * Contains an `id` if persisting was successful. If `id` and
+ * `error` are undefined, persisting was not successful, but the
+ * modal can still recover (e.g. the name of the saved object was already taken).
+ */
+export type SaveResult = { id?: string } | { error: Error };
+
+function isSuccess(result: SaveResult): result is { id?: string } {
+ return 'id' in result;
+}
+
+interface MinimalSaveModalProps {
+ onSave: (...args: any[]) => Promise;
+ onClose: () => void;
+}
+
+export function showSaveModal(saveModal: React.ReactElement) {
const container = document.createElement('div');
const closeModal = () => {
ReactDOM.unmountComponentAtNode(container);
@@ -30,21 +48,19 @@ export function showSaveModal(saveModal) {
const onSave = saveModal.props.onSave;
- const onSaveConfirmed = (...args) => {
- onSave(...args).then(({ id, error }) => {
- if (id || error) {
- closeModal();
- }
- });
+ const onSaveConfirmed: MinimalSaveModalProps['onSave'] = async (...args) => {
+ const response = await onSave(...args);
+ // close modal if we either hit an error or the saved object got an id
+ if (Boolean(isSuccess(response) ? response.id : response.error)) {
+ closeModal();
+ }
+ return response;
};
document.body.appendChild(container);
- const element = React.cloneElement(
- saveModal,
- {
- onSave: onSaveConfirmed,
- onClose: closeModal
- }
- );
+ const element = React.cloneElement(saveModal, {
+ onSave: onSaveConfirmed,
+ onClose: closeModal,
+ });
ReactDOM.render({element} , container);
}
diff --git a/src/legacy/ui/public/timefilter/index.ts b/src/legacy/ui/public/timefilter/index.ts
index 5f5fcf6b19c7f..34f2a367a217c 100644
--- a/src/legacy/ui/public/timefilter/index.ts
+++ b/src/legacy/ui/public/timefilter/index.ts
@@ -17,8 +17,16 @@
* under the License.
*/
-export { TimeRange, RefreshInterval } from '../../../../plugins/data/public';
+import uiRoutes from 'ui/routes';
+import { registerTimefilterWithGlobalState, getTimefilterConfig } from './setup_router';
+import { Timefilter, TimeHistory } from '../../../core_plugins/data/public/timefilter';
-export { timefilter, Timefilter, registerTimefilterWithGlobalState } from './timefilter';
-export { timeHistory, TimeHistory } from './time_history';
-export { getTime } from './get_time';
+const config = getTimefilterConfig();
+
+export { Timefilter, TimeHistory, getTime } from '../../../core_plugins/data/public/timefilter';
+export const timeHistory = new TimeHistory();
+export const timefilter = new Timefilter(config, timeHistory);
+
+uiRoutes.addSetupWork((globalState, $rootScope) => {
+ return registerTimefilterWithGlobalState(timefilter, globalState, $rootScope);
+});
diff --git a/src/legacy/ui/public/timefilter/setup_router.ts b/src/legacy/ui/public/timefilter/setup_router.ts
new file mode 100644
index 0000000000000..cbd03df455da3
--- /dev/null
+++ b/src/legacy/ui/public/timefilter/setup_router.ts
@@ -0,0 +1,89 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import _ from 'lodash';
+import { IScope } from 'angular';
+import moment from 'moment';
+import { subscribeWithScope } from 'ui/utils/subscribe_with_scope';
+import chrome from 'ui/chrome';
+import { RefreshInterval, TimeRange } from 'src/plugins/data/public';
+import { Timefilter } from '../../../core_plugins/data/public/timefilter';
+
+// TODO
+// remove everything underneath once globalState is no longer an angular service
+// and listener can be registered without angular.
+function convertISO8601(stringTime: string): string {
+ const obj = moment(stringTime, 'YYYY-MM-DDTHH:mm:ss.SSSZ', true);
+ return obj.isValid() ? obj.toString() : stringTime;
+}
+
+export function getTimefilterConfig() {
+ const settings = chrome.getUiSettingsClient();
+ return {
+ timeDefaults: settings.get('timepicker:timeDefaults'),
+ refreshIntervalDefaults: settings.get('timepicker:refreshIntervalDefaults'),
+ };
+}
+
+// Currently some parts of Kibana (index patterns, timefilter) rely on addSetupWork in the uiRouter
+// and require it to be executed to properly function.
+// This function is exposed for applications that do not use uiRoutes like APM
+// Kibana issue https://github.com/elastic/kibana/issues/19110 tracks the removal of this dependency on uiRouter
+export const registerTimefilterWithGlobalState = _.once(
+ (timefilter: Timefilter, globalState: any, $rootScope: IScope) => {
+ // settings have to be re-fetched here, to make sure that settings changed by overrideLocalDefault are taken into account.
+ const config = getTimefilterConfig();
+ timefilter.setTime(_.defaults(globalState.time || {}, config.timeDefaults));
+ timefilter.setRefreshInterval(
+ _.defaults(globalState.refreshInterval || {}, config.refreshIntervalDefaults)
+ );
+
+ globalState.on('fetch_with_changes', () => {
+ // clone and default to {} in one
+ const newTime: TimeRange = _.defaults({}, globalState.time, config.timeDefaults);
+ const newRefreshInterval: RefreshInterval = _.defaults(
+ {},
+ globalState.refreshInterval,
+ config.refreshIntervalDefaults
+ );
+
+ if (newTime) {
+ if (newTime.to) newTime.to = convertISO8601(newTime.to);
+ if (newTime.from) newTime.from = convertISO8601(newTime.from);
+ }
+
+ timefilter.setTime(newTime);
+ timefilter.setRefreshInterval(newRefreshInterval);
+ });
+
+ const updateGlobalStateWithTime = () => {
+ globalState.time = timefilter.getTime();
+ globalState.refreshInterval = timefilter.getRefreshInterval();
+ globalState.save();
+ };
+
+ subscribeWithScope($rootScope, timefilter.getRefreshIntervalUpdate$(), {
+ next: updateGlobalStateWithTime,
+ });
+
+ subscribeWithScope($rootScope, timefilter.getTimeUpdate$(), {
+ next: updateGlobalStateWithTime,
+ });
+ }
+);
diff --git a/src/legacy/ui/public/vis/agg_configs.ts b/src/legacy/ui/public/vis/agg_configs.ts
index e3edbef40c654..e16784bb6e2f2 100644
--- a/src/legacy/ui/public/vis/agg_configs.ts
+++ b/src/legacy/ui/public/vis/agg_configs.ts
@@ -27,8 +27,8 @@
*/
import _ from 'lodash';
+import { TimeRange } from 'src/plugins/data/public';
import { Schemas } from '../visualize/loader/pipeline_helpers/build_pipeline';
-import { TimeRange } from '../timefilter';
import { Schema } from '../vis/editors/default/schemas';
import { AggConfig, AggConfigOptions } from './agg_config';
import { AggGroupNames } from './editors/default/agg_groups';
diff --git a/src/legacy/ui/public/vis/request_handlers/courier.js b/src/legacy/ui/public/vis/request_handlers/courier.js
index cdd5158c5701d..b6f05f6228ea3 100644
--- a/src/legacy/ui/public/vis/request_handlers/courier.js
+++ b/src/legacy/ui/public/vis/request_handlers/courier.js
@@ -24,7 +24,7 @@ import { calculateObjectHash } from '../lib/calculate_object_hash';
import { getRequestInspectorStats, getResponseInspectorStats } from '../../courier/utils/courier_inspector_utils';
import { tabifyAggResponse } from '../../agg_response/tabify/tabify';
import { buildTabularInspectorData } from '../../inspector/build_tabular_inspector_data';
-import { getTime } from '../../timefilter/get_time';
+import { getTime } from '../../timefilter';
const CourierRequestHandlerProvider = function () {
diff --git a/src/legacy/ui/public/vis/request_handlers/request_handlers.d.ts b/src/legacy/ui/public/vis/request_handlers/request_handlers.d.ts
index 213f1e6252a6d..03751e189210a 100644
--- a/src/legacy/ui/public/vis/request_handlers/request_handlers.d.ts
+++ b/src/legacy/ui/public/vis/request_handlers/request_handlers.d.ts
@@ -17,7 +17,7 @@
* under the License.
*/
-import { TimeRange } from 'ui/timefilter';
+import { TimeRange } from 'src/plugins/data/public';
import { Query } from 'src/legacy/core_plugins/data/public';
import { Filter } from '@kbn/es-query';
import { AggConfigs } from 'ui/vis/agg_configs';
diff --git a/src/legacy/ui/public/visualize/loader/types.ts b/src/legacy/ui/public/visualize/loader/types.ts
index 595a0649ec5ef..bb1113d212261 100644
--- a/src/legacy/ui/public/visualize/loader/types.ts
+++ b/src/legacy/ui/public/visualize/loader/types.ts
@@ -18,7 +18,7 @@
*/
import { Filter } from '@kbn/es-query';
-import { TimeRange } from 'ui/timefilter';
+import { TimeRange } from 'src/plugins/data/public';
import { Query } from 'src/legacy/core_plugins/data/public';
import { SavedObject } from 'ui/saved_objects/saved_object';
diff --git a/src/legacy/ui/ui_bundles/ui_bundles_controller.js b/src/legacy/ui/ui_bundles/ui_bundles_controller.js
index a4521268ea121..5e9ae0abbb183 100644
--- a/src/legacy/ui/ui_bundles/ui_bundles_controller.js
+++ b/src/legacy/ui/ui_bundles/ui_bundles_controller.js
@@ -25,6 +25,7 @@ import { existsSync } from 'fs';
import del from 'del';
import { makeRe } from 'minimatch';
import mkdirp from 'mkdirp';
+import jsonStableStringify from 'json-stable-stringify';
import { IS_KIBANA_DISTRIBUTABLE } from '../../utils';
@@ -48,6 +49,21 @@ function getWebpackAliases(pluginSpecs) {
}, {});
}
+function sortAllArrays(input) {
+ if (Array.isArray(input)) {
+ return input
+ .map(i => sortAllArrays(i))
+ .sort((a, b) => typeof a === 'string' && typeof b === 'string' ? a.localeCompare(b) : 0);
+ }
+
+ if (typeof input === 'object') {
+ return Object.entries(input)
+ .map(([key, value]) => [key, sortAllArrays(value)]);
+ }
+
+ return input;
+}
+
export class UiBundlesController {
constructor(kbnServer) {
const { config, uiApps, uiExports, pluginSpecs } = kbnServer;
@@ -59,9 +75,7 @@ export class UiBundlesController {
sourceMaps: config.get('optimize.sourceMaps'),
kbnVersion: config.get('pkg.version'),
buildNum: config.get('pkg.buildNum'),
- plugins: pluginSpecs
- .map(spec => spec.getId())
- .sort((a, b) => a.localeCompare(b))
+ appExtensions: sortAllArrays(uiExports.appExtensions),
};
this._filter = makeRe(config.get('optimize.bundleFilter') || '*', {
@@ -81,6 +95,13 @@ export class UiBundlesController {
this._postLoaders = [];
this._bundles = [];
+ // create a bundle for core-only with no modules
+ this.add({
+ id: 'core',
+ modules: [],
+ template: appEntryTemplate
+ });
+
// create a bundle for each uiApp
for (const uiApp of uiApps) {
this.add({
@@ -143,7 +164,9 @@ export class UiBundlesController {
}
getContext() {
- return JSON.stringify(this._context, null, ' ');
+ return jsonStableStringify(this._context, {
+ space: ' '
+ });
}
resolvePath(...args) {
diff --git a/src/legacy/ui/ui_render/ui_render_mixin.js b/src/legacy/ui/ui_render/ui_render_mixin.js
index 47d13184bfd0a..7e6609c4b5487 100644
--- a/src/legacy/ui/ui_render/ui_render_mixin.js
+++ b/src/legacy/ui/ui_render/ui_render_mixin.js
@@ -102,9 +102,7 @@ export function uiRenderMixin(kbnServer, server, config) {
async handler(request, h) {
const { id } = request.params;
const app = server.getUiAppById(id) || server.getHiddenUiAppById(id);
- if (!app) {
- throw Boom.notFound(`Unknown app: ${id}`);
- }
+ const isCore = !app;
const uiSettings = request.getUiSettingsService();
const darkMode = !authEnabled || request.auth.isAuthenticated
@@ -130,7 +128,9 @@ export function uiRenderMixin(kbnServer, server, config) {
),
`${regularBundlePath}/${darkMode ? 'dark' : 'light'}_theme.style.css`,
`${regularBundlePath}/commons.style.css`,
- `${regularBundlePath}/${app.getId()}.style.css`,
+ ...(
+ !isCore ? [`${regularBundlePath}/${app.getId()}.style.css`] : []
+ ),
...kbnServer.uiExports.styleSheetPaths
.filter(path => (
path.theme === '*' || path.theme === (darkMode ? 'dark' : 'light')
@@ -145,7 +145,7 @@ export function uiRenderMixin(kbnServer, server, config) {
const bootstrap = new AppBootstrap({
templateData: {
- appId: app.getId(),
+ appId: isCore ? 'core' : app.getId(),
regularBundlePath,
dllBundlePath,
styleSheetPaths,
@@ -164,12 +164,11 @@ export function uiRenderMixin(kbnServer, server, config) {
});
server.route({
- path: '/app/{id}',
+ path: '/app/{id}/{any*}',
method: 'GET',
async handler(req, h) {
const id = req.params.id;
const app = server.getUiAppById(id);
- if (!app) throw Boom.notFound('Unknown app ' + id);
try {
if (kbnServer.status.isGreen()) {
@@ -183,9 +182,15 @@ export function uiRenderMixin(kbnServer, server, config) {
}
});
- async function getLegacyKibanaPayload({ app, translations, request, includeUserProvidedConfig }) {
+ async function getUiSettings({ request, includeUserProvidedConfig }) {
const uiSettings = request.getUiSettingsService();
+ return props({
+ defaults: uiSettings.getDefaults(),
+ user: includeUserProvidedConfig && uiSettings.getUserProvided()
+ });
+ }
+ async function getLegacyKibanaPayload({ app, translations, request, includeUserProvidedConfig }) {
return {
app,
translations,
@@ -198,16 +203,15 @@ export function uiRenderMixin(kbnServer, server, config) {
basePath: request.getBasePath(),
serverName: config.get('server.name'),
devMode: config.get('env.dev'),
- uiSettings: await props({
- defaults: uiSettings.getDefaults(),
- user: includeUserProvidedConfig && uiSettings.getUserProvided()
- })
+ uiSettings: await getUiSettings({ request, includeUserProvidedConfig }),
};
}
async function renderApp({ app, h, includeUserProvidedConfig = true, injectedVarsOverrides = {} }) {
const request = h.request;
const basePath = request.getBasePath();
+ const uiSettings = await getUiSettings({ request, includeUserProvidedConfig });
+ app = app || { getId: () => 'core' };
const legacyMetadata = await getLegacyKibanaPayload({
app,
@@ -228,13 +232,14 @@ export function uiRenderMixin(kbnServer, server, config) {
bootstrapScriptUrl: `${basePath}/bundles/app/${app.getId()}/bootstrap.js`,
i18n: (id, options) => i18n.translate(id, options),
locale: i18n.getLocale(),
- darkMode: get(legacyMetadata.uiSettings.user, ['theme:darkMode', 'userValue'], false),
+ darkMode: get(uiSettings.user, ['theme:darkMode', 'userValue'], false),
injectedMetadata: {
version: kbnServer.version,
buildNumber: config.get('pkg.buildNum'),
branch: config.get('pkg.branch'),
basePath,
+ legacyMode: app.getId() !== 'core',
i18n: {
translationsUrl: `${basePath}/translations/${i18n.getLocale()}.json`,
},
@@ -245,7 +250,7 @@ export function uiRenderMixin(kbnServer, server, config) {
request,
mergeVariables(
injectedVarsOverrides,
- await server.getInjectedUiAppVars(app.getId()),
+ app ? await server.getInjectedUiAppVars(app.getId()) : {},
defaultInjectedVars,
),
),
diff --git a/src/legacy/ui/ui_render/views/ui_app.pug b/src/legacy/ui/ui_render/views/ui_app.pug
index 5bbcc51e7745c..95b321e09b500 100644
--- a/src/legacy/ui/ui_render/views/ui_app.pug
+++ b/src/legacy/ui/ui_render/views/ui_app.pug
@@ -114,7 +114,7 @@ block content
}
}
- .kibanaWelcomeView(id="kbn_loading_message", style="display: none;")
+ .kibanaWelcomeView(id="kbn_loading_message", style="display: none;", data-test-subj="kbnLoadingMessage")
.kibanaLoaderWrap
.kibanaLoader
.kibanaWelcomeLogoCircle
diff --git a/src/plugins/data/common/expressions/expression_types/kibana_context.ts b/src/plugins/data/common/expressions/expression_types/kibana_context.ts
index 5ee3f7abbbdb0..0a3e8a4db87f6 100644
--- a/src/plugins/data/common/expressions/expression_types/kibana_context.ts
+++ b/src/plugins/data/common/expressions/expression_types/kibana_context.ts
@@ -18,8 +18,8 @@
*/
import { Filter } from '@kbn/es-query';
+import { TimeRange } from 'src/plugins/data/public';
import { Query } from '../../query/types';
-import { TimeRange } from '../../timefilter/types';
const name = 'kibana_context';
diff --git a/src/plugins/kibana_react/public/saved_objects/__snapshots__/saved_object_save_modal.test.tsx.snap b/src/plugins/kibana_react/public/saved_objects/__snapshots__/saved_object_save_modal.test.tsx.snap
index 47b4a5219068f..5bf5c8be05ed8 100644
--- a/src/plugins/kibana_react/public/saved_objects/__snapshots__/saved_object_save_modal.test.tsx.snap
+++ b/src/plugins/kibana_react/public/saved_objects/__snapshots__/saved_object_save_modal.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`SavedObjectSaveModal should render matching snapshot 1`] = `
onSubmit={[Function]}
>
-
diff --git a/src/plugins/kibana_react/public/saved_objects/_index.scss b/src/plugins/kibana_react/public/saved_objects/_index.scss
new file mode 100644
index 0000000000000..6c773c7f777be
--- /dev/null
+++ b/src/plugins/kibana_react/public/saved_objects/_index.scss
@@ -0,0 +1 @@
+@import './saved_object_save_modal';
diff --git a/src/plugins/kibana_react/public/saved_objects/saved_object_save_modal.scss b/src/plugins/kibana_react/public/saved_objects/saved_object_save_modal.scss
new file mode 100644
index 0000000000000..b8758f692b7f7
--- /dev/null
+++ b/src/plugins/kibana_react/public/saved_objects/saved_object_save_modal.scss
@@ -0,0 +1,3 @@
+.kbnSavedObjectSaveModal {
+ width: $euiSizeXXL * 10;
+}
\ No newline at end of file
diff --git a/src/plugins/kibana_react/public/saved_objects/saved_object_save_modal.tsx b/src/plugins/kibana_react/public/saved_objects/saved_object_save_modal.tsx
index 27da5d90646b3..4d4e429417085 100644
--- a/src/plugins/kibana_react/public/saved_objects/saved_object_save_modal.tsx
+++ b/src/plugins/kibana_react/public/saved_objects/saved_object_save_modal.tsx
@@ -35,8 +35,9 @@ import {
import { FormattedMessage } from '@kbn/i18n/react';
import React from 'react';
import { EuiText } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
-interface OnSaveProps {
+export interface OnSaveProps {
newTitle: string;
newCopyOnSave: boolean;
isTitleDuplicateConfirmed: boolean;
@@ -72,14 +73,14 @@ export class SavedObjectSaveModal extends React.Component {
};
public render() {
- const { isTitleDuplicateConfirmed, hasTitleDuplicate, title, isLoading } = this.state;
+ const { isTitleDuplicateConfirmed, hasTitleDuplicate, title } = this.state;
return (
@@ -204,6 +190,34 @@ export class SavedObjectSaveModal extends React.Component {
this.saveSavedObject();
};
+ private renderConfirmButton = () => {
+ const { isLoading, title, hasTitleDuplicate } = this.state;
+
+ let confirmLabel: string | React.ReactNode = hasTitleDuplicate
+ ? i18n.translate('kibana-react.savedObjects.saveModal.confirmSaveButtonLabel', {
+ defaultMessage: 'Confirm save',
+ })
+ : i18n.translate('kibana-react.savedObjects.saveModal.saveButtonLabel', {
+ defaultMessage: 'Save',
+ });
+
+ if (this.props.confirmButtonLabel) {
+ confirmLabel = this.props.confirmButtonLabel;
+ }
+
+ return (
+
+ {confirmLabel}
+
+ );
+ };
+
private renderDuplicateTitleCallout = () => {
if (!this.state.hasTitleDuplicate) {
return;
@@ -230,10 +244,14 @@ export class SavedObjectSaveModal extends React.Component {
objectType: this.props.objectType,
confirmSaveLabel: (
- (
}
export const nextTick = () => new Promise(res => process.nextTick(res));
+
+export function shallowWithI18nProvider(child: ReactElement) {
+ const wrapped = shallow({child} );
+ const name = typeof child.type === 'string' ? child.type : child.type.name;
+ return wrapped.find(name).dive();
+}
+
+export function mountWithI18nProvider(child: ReactElement) {
+ const wrapped = mount({child} );
+ const name = typeof child.type === 'string' ? child.type : child.type.name;
+ return wrapped.find(name);
+}
diff --git a/test/functional/apps/dashboard/dashboard_filter_bar.js b/test/functional/apps/dashboard/dashboard_filter_bar.js
index 312066000c63c..a48393e11b19c 100644
--- a/test/functional/apps/dashboard/dashboard_filter_bar.js
+++ b/test/functional/apps/dashboard/dashboard_filter_bar.js
@@ -133,10 +133,10 @@ export default function ({ getService, getPageObjects }) {
await PageObjects.dashboard.setTimepickerInDataRange();
});
- it('are added when pie chart legend item is clicked', async function () {
- await dashboardAddPanel.addVisualization('Rendering Test: pie');
+ it('are added when a cell magnifying glass is clicked', async function () {
+ await dashboardAddPanel.addSavedSearch('Rendering-Test:-saved-search');
await PageObjects.dashboard.waitForRenderComplete();
- await pieChart.filterByLegendItem('4,886');
+ await testSubjects.click('docTableCellFilter');
const filterCount = await filterBar.getFilterCount();
expect(filterCount).to.equal(1);
diff --git a/test/functional/apps/dashboard/dashboard_filtering.js b/test/functional/apps/dashboard/dashboard_filtering.js
index 15b444cb74151..862ed8c87d347 100644
--- a/test/functional/apps/dashboard/dashboard_filtering.js
+++ b/test/functional/apps/dashboard/dashboard_filtering.js
@@ -74,7 +74,6 @@ export default function ({ getService, getPageObjects }) {
it('tsvb time series shows no data message', async () => {
expect(await testSubjects.exists('noTSVBDataMessage')).to.be(true);
- await dashboardExpect.tsvbTimeSeriesLegendCount(0);
});
it('metric value shows no data', async () => {
@@ -134,11 +133,6 @@ export default function ({ getService, getPageObjects }) {
await dashboardExpect.goalAndGuageLabelsExist(['0', '0%']);
});
- it('tsvb time series shows no data message', async () => {
- expect(await testSubjects.exists('noTSVBDataMessage')).to.be(true);
- await dashboardExpect.tsvbTimeSeriesLegendCount(0);
- });
-
it('metric value shows no data', async () => {
await dashboardExpect.metricValuesExist(['-']);
});
@@ -195,11 +189,6 @@ export default function ({ getService, getPageObjects }) {
await dashboardExpect.goalAndGuageLabelsExist(['39.958%', '7,544']);
});
- it('tsvb time series', async () => {
- expect(await testSubjects.exists('noTSVBDataMessage')).to.be(false);
- await dashboardExpect.tsvbTimeSeriesLegendCount(10);
- });
-
it('metric value', async () => {
await dashboardExpect.metricValuesExist(['101']);
});
diff --git a/test/functional/apps/dashboard/dashboard_grid.js b/test/functional/apps/dashboard/dashboard_grid.js
index 958d61176ded2..a0c22ca85b91b 100644
--- a/test/functional/apps/dashboard/dashboard_grid.js
+++ b/test/functional/apps/dashboard/dashboard_grid.js
@@ -25,7 +25,6 @@ export default function ({ getService, getPageObjects }) {
const PageObjects = getPageObjects(['dashboard']);
describe('dashboard grid', function () {
- this.tags(['skipFirefox']);
before(async () => {
await PageObjects.dashboard.gotoDashboardLandingPage();
diff --git a/test/functional/apps/dashboard/embeddable_rendering.js b/test/functional/apps/dashboard/embeddable_rendering.js
index 831622716f381..e21964495e46e 100644
--- a/test/functional/apps/dashboard/embeddable_rendering.js
+++ b/test/functional/apps/dashboard/embeddable_rendering.js
@@ -50,7 +50,6 @@ export default function ({ getService, getPageObjects }) {
await dashboardExpect.tagCloudWithValuesFound(['CN', 'IN', 'US', 'BR', 'ID']);
// TODO add test for 'region map viz'
// TODO add test for 'tsvb gauge' viz
- await dashboardExpect.tsvbTimeSeriesLegendCount(1);
// TODO add test for 'geo map' viz
// This tests the presence of the two input control embeddables
await dashboardExpect.inputControlItemCount(5);
@@ -86,7 +85,6 @@ export default function ({ getService, getPageObjects }) {
await dashboardExpect.tsvbMetricValuesExist(['0']);
await dashboardExpect.tsvbMarkdownWithValuesExists(['Hi Avg last bytes: 0']);
await dashboardExpect.tsvbTableCellCount(0);
- await dashboardExpect.tsvbTimeSeriesLegendCount(1);
await dashboardExpect.tsvbTopNValuesExist(['0']);
await dashboardExpect.vegaTextsDoNotExist(['5,000']);
};
diff --git a/test/functional/apps/dashboard/full_screen_mode.js b/test/functional/apps/dashboard/full_screen_mode.js
index 1f935e9b9aa1b..2a534a66d43e4 100644
--- a/test/functional/apps/dashboard/full_screen_mode.js
+++ b/test/functional/apps/dashboard/full_screen_mode.js
@@ -21,7 +21,6 @@ import expect from '@kbn/expect';
export default function ({ getService, getPageObjects }) {
const retry = getService('retry');
- const browser = getService('browser');
const dashboardPanelActions = getService('dashboardPanelActions');
const PageObjects = getPageObjects(['dashboard', 'common']);
@@ -69,7 +68,7 @@ export default function ({ getService, getPageObjects }) {
it('exits when the text button is clicked on', async () => {
const logoButton = await PageObjects.dashboard.getExitFullScreenLogoButton();
- await browser.moveMouseTo(logoButton);
+ await logoButton.moveMouseTo();
await PageObjects.dashboard.clickExitFullScreenTextButton();
await retry.try(async () => {
diff --git a/test/functional/apps/discover/_discover.js b/test/functional/apps/discover/_discover.js
index 3cb5d0a71cce5..c29542e6a4035 100644
--- a/test/functional/apps/discover/_discover.js
+++ b/test/functional/apps/discover/_discover.js
@@ -160,7 +160,7 @@ export default function ({ getService, getPageObjects }) {
const newDurationHours = await PageObjects.timePicker.getTimeDurationInHours();
expect(Math.round(newDurationHours)).to.be(3);
- const rowData = await PageObjects.discover.getDocTableIndex(1);
+ const rowData = await PageObjects.discover.getDocTableField(1);
expect(rowData).to.have.string('Sep 20, 2015 @ 02:56:02.323');
});
diff --git a/test/functional/apps/management/index.js b/test/functional/apps/management/index.js
index c9b444e501789..4d4031b4e489b 100644
--- a/test/functional/apps/management/index.js
+++ b/test/functional/apps/management/index.js
@@ -33,7 +33,7 @@ export default function ({ getService, loadTestFile }) {
});
describe('', function () {
- this.tags('ciGroup1');
+ this.tags('ciGroup7');
loadTestFile(require.resolve('./_create_index_pattern_wizard'));
loadTestFile(require.resolve('./_index_pattern_create_delete'));
@@ -45,7 +45,7 @@ export default function ({ getService, loadTestFile }) {
});
describe('', function () {
- this.tags('ciGroup2');
+ this.tags('ciGroup8');
loadTestFile(require.resolve('./_index_pattern_filter'));
loadTestFile(require.resolve('./_scripted_fields_filter'));
diff --git a/test/functional/apps/visualize/_tsvb_time_series.ts b/test/functional/apps/visualize/_tsvb_time_series.ts
index 0a2400a367a76..fa79190a5bf94 100644
--- a/test/functional/apps/visualize/_tsvb_time_series.ts
+++ b/test/functional/apps/visualize/_tsvb_time_series.ts
@@ -75,7 +75,7 @@ export default function({ getPageObjects, getService }: FtrProviderContext) {
await visualBuilder.changePanelPreview();
await visualBuilder.cloneSeries();
- const legend = await visualBuilder.getLegentItems();
+ const legend = await visualBuilder.getLegendItems();
const series = await visualBuilder.getSeries();
expect(legend.length).to.be(2);
expect(series.length).to.be(2);
@@ -108,8 +108,7 @@ export default function({ getPageObjects, getService }: FtrProviderContext) {
expect(actualCount).to.be(expectedLegendValue);
});
- // FLAKY: https://github.com/elastic/kibana/issues/40458
- it('should show the correct count in the legend with "Human readable" duration formatter', async () => {
+ it.skip('should show the correct count in the legend with "Human readable" duration formatter', async () => {
await visualBuilder.clickSeriesOption();
await visualBuilder.changeDataFormatter('Duration');
await visualBuilder.setDurationFormatterSettings({ to: 'Human readable' });
@@ -127,7 +126,8 @@ export default function({ getPageObjects, getService }: FtrProviderContext) {
expect(actualCountMin).to.be('3 hours');
});
- describe('Dark mode', () => {
+ // --reversed class is not implemented in @elastic\chart
+ describe.skip('Dark mode', () => {
before(async () => {
await kibanaServer.uiSettings.update({
'theme:darkMode': true,
diff --git a/test/functional/apps/visualize/index.ts b/test/functional/apps/visualize/index.ts
index 68a00b29d107e..2a13b6fea9158 100644
--- a/test/functional/apps/visualize/index.ts
+++ b/test/functional/apps/visualize/index.ts
@@ -40,7 +40,7 @@ export default function({ getService, loadTestFile }: FtrProviderContext) {
});
describe('', function() {
- this.tags('ciGroup3');
+ this.tags('ciGroup9');
loadTestFile(require.resolve('./_embedding_chart'));
loadTestFile(require.resolve('./_chart_types'));
@@ -50,7 +50,7 @@ export default function({ getService, loadTestFile }: FtrProviderContext) {
});
describe('', function() {
- this.tags('ciGroup4');
+ this.tags('ciGroup10');
loadTestFile(require.resolve('./_inspector'));
loadTestFile(require.resolve('./_experimental_vis'));
@@ -62,7 +62,7 @@ export default function({ getService, loadTestFile }: FtrProviderContext) {
});
describe('', function() {
- this.tags('ciGroup5');
+ this.tags('ciGroup11');
loadTestFile(require.resolve('./_line_chart'));
loadTestFile(require.resolve('./_pie_chart'));
@@ -76,7 +76,7 @@ export default function({ getService, loadTestFile }: FtrProviderContext) {
});
describe('', function() {
- this.tags('ciGroup6');
+ this.tags('ciGroup12');
loadTestFile(require.resolve('./_tag_cloud'));
loadTestFile(require.resolve('./_tile_map'));
diff --git a/test/functional/page_objects/common_page.js b/test/functional/page_objects/common_page.js
index 651d82608961a..fc47a53a092e8 100644
--- a/test/functional/page_objects/common_page.js
+++ b/test/functional/page_objects/common_page.js
@@ -151,11 +151,22 @@ export function CommonPageProvider({ getService, getPageObjects }) {
navigateToApp(appName, { basePath = '', shouldLoginIfPrompted = true, shouldAcceptAlert = true, hash = '' } = {}) {
const self = this;
- const appConfig = config.get(['apps', appName]);
- const appUrl = getUrl.noAuth(config.get('servers.kibana'), {
- pathname: `${basePath}${appConfig.pathname}`,
- hash: hash || appConfig.hash,
- });
+
+ let appUrl;
+ if (config.has(['apps', appName])) {
+ // Legacy applications
+ const appConfig = config.get(['apps', appName]);
+ appUrl = getUrl.noAuth(config.get('servers.kibana'), {
+ pathname: `${basePath}${appConfig.pathname}`,
+ hash: hash || appConfig.hash,
+ });
+ } else {
+ appUrl = getUrl.noAuth(config.get('servers.kibana'), {
+ pathname: `${basePath}/app/${appName}`,
+ hash
+ });
+ }
+
log.debug('navigating to ' + appName + ' url: ' + appUrl);
function navigateTo(url) {
@@ -359,7 +370,7 @@ export function CommonPageProvider({ getService, getPageObjects }) {
throw new Error('Toast is not visible yet');
}
});
- await browser.moveMouseTo(toast);
+ await toast.moveMouseTo();
const title = await (await find.byCssSelector('.euiToastHeader__title')).getVisibleText();
log.debug(title);
await find.clickByCssSelector('.euiToast__closeButton');
@@ -370,7 +381,7 @@ export function CommonPageProvider({ getService, getPageObjects }) {
const toasts = await find.allByCssSelector('.euiToast');
for (const toastElement of toasts) {
try {
- await browser.moveMouseTo(toastElement);
+ await toastElement.moveMouseTo();
const closeBtn = await toastElement.findByCssSelector('.euiToast__closeButton');
await closeBtn.click();
} catch (err) {
diff --git a/test/functional/page_objects/discover_page.js b/test/functional/page_objects/discover_page.js
index 6954bed438478..dfe8dc1071d46 100644
--- a/test/functional/page_objects/discover_page.js
+++ b/test/functional/page_objects/discover_page.js
@@ -193,6 +193,13 @@ export function DiscoverPageProvider({ getService, getPageObjects }) {
return await row.getVisibleText();
}
+ async getDocTableField(index) {
+ const field = await find.byCssSelector(
+ `tr.kbnDocTable__row:nth-child(${index}) > [data-test-subj='docTableField']`
+ );
+ return await field.getVisibleText();
+ }
+
async clickDocSortDown() {
await find.clickByCssSelector('.fa-sort-down');
}
diff --git a/test/functional/page_objects/visual_builder_page.ts b/test/functional/page_objects/visual_builder_page.ts
index c64d623979313..5f34e5c4f8637 100644
--- a/test/functional/page_objects/visual_builder_page.ts
+++ b/test/functional/page_objects/visual_builder_page.ts
@@ -67,11 +67,14 @@ export function VisualBuilderPageProvider({ getService, getPageObjects }: FtrPro
}
public async checkTimeSeriesChartIsPresent() {
- await testSubjects.existOrFail('timeseriesChart');
+ const isPresent = await find.existsByCssSelector('.tvbVisTimeSeries');
+ if (!isPresent) {
+ throw new Error(`TimeSeries chart is not loaded`);
+ }
}
public async checkTimeSeriesLegendIsPresent() {
- const isPresent = await find.existsByCssSelector('.tvbLegend');
+ const isPresent = await find.existsByCssSelector('.echLegend');
if (!isPresent) {
throw new Error(`TimeSeries legend is not loaded`);
}
@@ -239,7 +242,7 @@ export function VisualBuilderPageProvider({ getService, getPageObjects }: FtrPro
formatter: 'Bytes' | 'Number' | 'Percent' | 'Duration' | 'Custom'
) {
const formatterEl = await find.byCssSelector('[id$="row"] .euiComboBox');
- await comboBox.setElement(formatterEl, formatter);
+ await comboBox.setElement(formatterEl, formatter, { clickWithMouse: true });
}
/**
@@ -260,11 +263,11 @@ export function VisualBuilderPageProvider({ getService, getPageObjects }: FtrPro
}) {
if (from) {
const fromCombobox = await find.byCssSelector('[id$="from-row"] .euiComboBox');
- await comboBox.setElement(fromCombobox, from);
+ await comboBox.setElement(fromCombobox, from, { clickWithMouse: true });
}
if (to) {
const toCombobox = await find.byCssSelector('[id$="to-row"] .euiComboBox');
- await comboBox.setElement(toCombobox, to);
+ await comboBox.setElement(toCombobox, to, { clickWithMouse: true });
}
if (decimalPlaces) {
const decimalPlacesInput = await find.byCssSelector('[id$="decimal"]');
@@ -291,9 +294,11 @@ export function VisualBuilderPageProvider({ getService, getPageObjects }: FtrPro
await el.type(value);
}
- public async getRhythmChartLegendValue() {
+ public async getRhythmChartLegendValue(nth = 0) {
await PageObjects.visualize.waitForVisualizationRenderingStabilized();
- const metricValue = await find.byCssSelector('.tvbLegend__itemValue');
+ const metricValue = (await find.allByCssSelector(
+ `.echLegendItem .echLegendItem__displayValue`
+ ))[nth];
await metricValue.moveMouseTo();
return await metricValue.getVisibleText();
}
@@ -447,7 +452,7 @@ export function VisualBuilderPageProvider({ getService, getPageObjects }: FtrPro
public async clickColorPicker(): Promise {
const picker = await find.byCssSelector('.tvbColorPicker button');
- await browser.clickMouseButton(picker);
+ await picker.clickMouseButton();
}
public async setBackgroundColor(colorHex: string): Promise {
@@ -502,8 +507,8 @@ export function VisualBuilderPageProvider({ getService, getPageObjects }: FtrPro
await PageObjects.visualize.waitForRenderingCount(prevRenderingCount + 1);
}
- public async getLegentItems(): Promise {
- return await testSubjects.findAll('tsvbLegendItem');
+ public async getLegendItems(): Promise {
+ return await find.allByCssSelector('.echLegendItem');
}
public async getSeries(): Promise {
diff --git a/test/functional/page_objects/visualize_page.js b/test/functional/page_objects/visualize_page.js
index db6656deed7cb..d02638d37aa49 100644
--- a/test/functional/page_objects/visualize_page.js
+++ b/test/functional/page_objects/visualize_page.js
@@ -1187,7 +1187,7 @@ export function VisualizePageProvider({ getService, getPageObjects, updateBaseli
await retry.try(async () => {
const table = await testSubjects.find('tableVis');
const cell = await table.findByCssSelector(`tbody tr:nth-child(${row}) td:nth-child(${column})`);
- await browser.moveMouseTo(cell);
+ await cell.moveMouseTo();
const filterBtn = await testSubjects.findDescendant('filterForCellValue', cell);
await filterBtn.click();
});
diff --git a/test/functional/services/browser.ts b/test/functional/services/browser.ts
index d52be4b90c043..ccd32590e941c 100644
--- a/test/functional/services/browser.ts
+++ b/test/functional/services/browser.ts
@@ -155,49 +155,26 @@ export async function BrowserProvider({ getService }: FtrProviderContext) {
}
/**
- * Moves the remote environment’s mouse cursor to the specified element or relative
- * position.
+ * Moves the remote environment’s mouse cursor to the specified point {x, y} which is
+ * offset to browser page top left corner.
* https://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/lib/input_exports_Actions.html#move
*
- * @param {WebElementWrapper} element Optional
- * @param {number} xOffset Optional
- * @param {number} yOffset Optional
+ * @param {x: number, y: number} point on browser page
* @return {Promise}
*/
- public async moveMouseTo(element: any, xOffset: number, yOffset: number): Promise;
- public async moveMouseTo(element: WebElementWrapper): Promise;
- public async moveMouseTo(
- element: WebElementWrapper,
- xOffset?: number,
- yOffset?: number
- ): Promise {
+ public async moveMouseTo(point: { x: number; y: number }): Promise {
if (this.isW3CEnabled) {
- // Workaround for scrolling bug in W3C mode: move pointer to { x: 0, y: 0 }
- // https://github.com/mozilla/geckodriver/issues/776
await this.getActions()
.move({ x: 0, y: 0 })
.perform();
- if (element instanceof WebElementWrapper) {
- await this.getActions()
- .move({ x: xOffset || 10, y: yOffset || 10, origin: element._webElement })
- .perform();
- } else {
- await this.getActions()
- .move({ origin: { x: xOffset, y: yOffset } })
- .perform();
- }
+ await this.getActions()
+ .move({ x: point.x, y: point.y, origin: 'pointer' })
+ .perform();
} else {
- if (element instanceof WebElementWrapper) {
- await this.getActions()
- .pause(this.getActions().mouse)
- .move({ origin: element._webElement })
- .perform();
- } else {
- await this.getActions()
- .pause(this.getActions().mouse)
- .move({ origin: { x: xOffset, y: yOffset } })
- .perform();
- }
+ await this.getActions()
+ .pause(this.getActions().mouse)
+ .move({ x: point.x, y: point.y, origin: 'pointer' })
+ .perform();
}
}
@@ -213,70 +190,47 @@ export async function BrowserProvider({ getService }: FtrProviderContext) {
from: { offset: { x: any; y: any }; location: any },
to: { offset: { x: any; y: any }; location: any }
) {
- // tslint:disable-next-line:variable-name
- let _from;
- // tslint:disable-next-line:variable-name
- let _to;
- // tslint:disable-next-line:variable-name
- const _fromOffset = from.offset
- ? { x: from.offset.x || 0, y: from.offset.y || 0 }
- : { x: 0, y: 0 };
- // tslint:disable-next-line:variable-name
- const _toOffset = to.offset ? { x: to.offset.x || 0, y: to.offset.y || 0 } : { x: 0, y: 0 };
- // tslint:disable-next-line:variable-name
- const _convertPointW3C = async (point: any, offset: { x: any; y: any }) => {
- if (point.location instanceof WebElementWrapper) {
- const position = await point.location.getPosition();
- return {
- x: Math.round(position.x + offset.x),
- y: Math.round(position.y + offset.y),
- };
- } else {
- return {
- x: Math.round(point.location.x + offset.x),
- y: Math.round(point.location.y + offset.y),
- };
- }
- };
- // tslint:disable-next-line:variable-name
- const _convertPoint = (point: any) => {
- return point.location instanceof WebElementWrapper
- ? point.location._webElement
- : point.location;
- };
-
if (this.isW3CEnabled) {
- // tslint:disable-next-line:variable-name
- _from = await _convertPointW3C(from, _fromOffset);
- // tslint:disable-next-line:variable-name
- _to = await _convertPointW3C(to, _toOffset);
- // tslint:disable-next-line:variable-name
- const _offset = { x: _to.x - _from.x, y: _to.y - _from.y };
+ // The offset should be specified in pixels relative to the center of the element's bounding box
+ const getW3CPoint = (data: any) => {
+ if (!data.offset) {
+ data.offset = {};
+ }
+ return data.location instanceof WebElementWrapper
+ ? { x: data.offset.x || 0, y: data.offset.y || 0, origin: data.location._webElement }
+ : { x: data.location.x, y: data.location.y, origin: 'pointer' };
+ };
+ const startPoint = getW3CPoint(from);
+ const endPoint = getW3CPoint(to);
+ await this.getActions()
+ .move({ x: 0, y: 0 })
+ .perform();
return await this.getActions()
- .move({ x: _from.x, y: _from.y, origin: 'pointer' })
+ .move(startPoint)
.press()
- .move({ x: _offset.x, y: _offset.y, origin: 'pointer' })
+ .move(endPoint)
.release()
.perform();
} else {
- // until Chromedriver is not supporting W3C Webdriver Actions API
- // tslint:disable-next-line:variable-name
- _from = _convertPoint(from);
- // tslint:disable-next-line:variable-name
- _to = _convertPoint(to);
- if (from.location instanceof WebElementWrapper && typeof to.location.x === 'number') {
+ // The offset should be specified in pixels relative to the top-left corner of the element's bounding box
+ const getOffset: any = (offset: { x: number; y: number }) =>
+ offset ? { x: offset.x || 0, y: offset.y || 0 } : { x: 0, y: 0 };
+
+ if (from.location instanceof WebElementWrapper === false) {
+ throw new Error('Dragging point should be WebElementWrapper instance');
+ } else if (typeof to.location.x === 'number') {
return await this.getActions()
- .move({ origin: _from })
+ .move({ origin: from.location._webElement })
.press()
- .move({ x: _to.x, y: _to.y, origin: 'pointer' })
+ .move({ x: to.location.x, y: to.location.y, origin: 'pointer' })
.release()
.perform();
} else {
return await new LegacyActionSequence(driver)
- .mouseMove(_from, _fromOffset)
+ .mouseMove(from.location._webElement, getOffset(from.offset))
.mouseDown()
- .mouseMove(_to, _toOffset)
+ .mouseMove(to.location._webElement, getOffset(to.offset))
.mouseUp()
.perform();
}
@@ -320,34 +274,29 @@ export async function BrowserProvider({ getService }: FtrProviderContext) {
}
/**
- * Inserts an action for moving the mouse x and y pixels relative to the specified origin.
- * The origin may be defined as the mouse's current position, the viewport, or the center
- * of a specific WebElement. Then adds an action for left-click (down/up) with the mouse.
+ * Moves the remote environment’s mouse cursor to the specified point {x, y} which is
+ * offset to browser page top left corner.
+ * Then adds an action for left-click (down/up) with the mouse.
* https://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/lib/input_exports_Actions.html#click
*
- * @param {WebElementWrapper} element Optional
- * @param {number} xOffset Optional
- * @param {number} yOffset Optional
+ * @param {x: number, y: number} point on browser page
* @return {Promise}
*/
- public async clickMouseButton(element: any, xOffset: number, yOffset: number): Promise;
- public async clickMouseButton(element: WebElementWrapper): Promise;
- public async clickMouseButton(...args: unknown[]): Promise {
- const arg0 = args[0];
- if (arg0 instanceof WebElementWrapper) {
+ public async clickMouseButton(point: { x: number; y: number }): Promise {
+ if (this.isW3CEnabled) {
await this.getActions()
- .pause(this.getActions().mouse)
- .move({ origin: arg0._webElement })
+ .move({ x: 0, y: 0 })
+ .perform();
+ await this.getActions()
+ .move({ x: point.x, y: point.y, origin: 'pointer' })
.click()
.perform();
- } else if (isNaN(args[1] as number) || isNaN(args[2] as number) === false) {
+ } else {
await this.getActions()
.pause(this.getActions().mouse)
- .move({ origin: { x: args[1], y: args[2] } })
+ .move({ x: point.x, y: point.y, origin: 'pointer' })
.click()
.perform();
- } else {
- throw new Error('Element or coordinates should be provided');
}
}
@@ -378,16 +327,10 @@ export async function BrowserProvider({ getService }: FtrProviderContext) {
* @param {WebElementWrapper} element
* @return {Promise}
*/
- public async doubleClick(element?: WebElementWrapper): Promise {
- if (element instanceof WebElementWrapper) {
- await this.getActions()
- .doubleClick(element._webElement)
- .perform();
- } else {
- await this.getActions()
- .doubleClick()
- .perform();
- }
+ public async doubleClick(): Promise {
+ await this.getActions()
+ .doubleClick()
+ .perform();
}
/**
diff --git a/test/functional/services/combo_box.ts b/test/functional/services/combo_box.ts
index b8267f0b4cbe3..5ecd8cd883c8a 100644
--- a/test/functional/services/combo_box.ts
+++ b/test/functional/services/combo_box.ts
@@ -46,13 +46,21 @@ export function ComboBoxProvider({ getService, getPageObjects }: FtrProviderCont
await this.setElement(comboBox, value);
}
+ private async clickOption(isMouseClick: boolean, element: WebElementWrapper) {
+ return isMouseClick ? await element.clickMouseButton() : await element.click();
+ }
+
/**
* set value inside combobox element
*
* @param comboBoxElement
* @param value
*/
- public async setElement(comboBoxElement: WebElementWrapper, value: string): Promise {
+ public async setElement(
+ comboBoxElement: WebElementWrapper,
+ value: string,
+ options = { clickWithMouse: false }
+ ): Promise {
log.debug(`comboBox.setElement, value: ${value}`);
const isOptionSelected = await this.isOptionSelected(comboBoxElement, value);
@@ -65,21 +73,22 @@ export function ComboBoxProvider({ getService, getPageObjects }: FtrProviderCont
await this.openOptionsList(comboBoxElement);
if (value !== undefined) {
- const options = await find.allByCssSelector(
+ const selectOptions = await find.allByCssSelector(
`.euiFilterSelectItem[title^="${value.toString().trim()}"]`,
WAIT_FOR_EXISTS_TIME
);
- if (options.length > 0) {
- await options[0].click();
+ if (selectOptions.length > 0) {
+ await this.clickOption(options.clickWithMouse, selectOptions[0]);
} else {
// if it doesn't find the item which text starts with value, it will choose the first option
- await find.clickByCssSelector('.euiFilterSelectItem');
+ const firstOption = await find.byCssSelector('.euiFilterSelectItem');
+ await this.clickOption(options.clickWithMouse, firstOption);
}
} else {
- await find.clickByCssSelector('.euiFilterSelectItem');
+ const firstOption = await find.byCssSelector('.euiFilterSelectItem');
+ await this.clickOption(options.clickWithMouse, firstOption);
}
-
await this.closeOptionsList(comboBoxElement);
}
@@ -241,11 +250,11 @@ export function ComboBoxProvider({ getService, getPageObjects }: FtrProviderCont
value: string
): Promise {
log.debug(`comboBox.isOptionSelected, value: ${value}`);
- const selectedOptions = await comboBoxElement.findAllByClassName(
- 'euiComboBoxPill',
- WAIT_FOR_EXISTS_TIME
- );
- return selectedOptions.length === 1 && (await selectedOptions[0].getVisibleText()) === value;
+ const $ = await comboBoxElement.parseDomContent();
+ const selectedOptions = $('.euiComboBoxPill')
+ .toArray()
+ .map(option => $(option).text());
+ return selectedOptions.length === 1 && selectedOptions[0] === value;
}
}
diff --git a/test/functional/services/dashboard/expectations.js b/test/functional/services/dashboard/expectations.js
index b6bede32b769c..abafe89c40941 100644
--- a/test/functional/services/dashboard/expectations.js
+++ b/test/functional/services/dashboard/expectations.js
@@ -62,14 +62,6 @@ export function DashboardExpectProvider({ getService, getPageObjects }) {
});
}
- async tsvbTimeSeriesLegendCount(expectedCount) {
- log.debug(`DashboardExpect.tsvbTimeSeriesLegendCount(${expectedCount})`);
- await retry.try(async () => {
- const tsvbLegendItems = await testSubjects.findAll('tsvbLegendItem', findTimeout);
- expect(tsvbLegendItems.length).to.be(expectedCount);
- });
- }
-
async fieldSuggestions(expectedFields) {
log.debug(`DashboardExpect.fieldSuggestions(${expectedFields})`);
const fields = await filterBar.getFilterEditorFields();
diff --git a/test/functional/services/dashboard/panel_actions.js b/test/functional/services/dashboard/panel_actions.js
index 051074eb9b3d0..b7327f4af6d17 100644
--- a/test/functional/services/dashboard/panel_actions.js
+++ b/test/functional/services/dashboard/panel_actions.js
@@ -26,7 +26,6 @@ const OPEN_INSPECTOR_TEST_SUBJ = 'embeddablePanelAction-openInspector';
export function DashboardPanelActionsProvider({ getService, getPageObjects }) {
const log = getService('log');
- const browser = getService('browser');
const testSubjects = getService('testSubjects');
const PageObjects = getPageObjects(['header', 'common']);
@@ -45,7 +44,7 @@ export function DashboardPanelActionsProvider({ getService, getPageObjects }) {
async toggleContextMenu(parent) {
log.debug('toggleContextMenu');
- await (parent ? browser.moveMouseTo(parent) : testSubjects.moveMouseTo('dashboardPanelTitle'));
+ await (parent ? parent.moveMouseTo() : testSubjects.moveMouseTo('dashboardPanelTitle'));
const toggleMenuItem = await this.findContextMenu(parent);
await toggleMenuItem.click();
}
diff --git a/test/functional/services/inspector.js b/test/functional/services/inspector.js
index 9c25ebea48b4f..d7c3109251aaf 100644
--- a/test/functional/services/inspector.js
+++ b/test/functional/services/inspector.js
@@ -22,7 +22,6 @@ import expect from '@kbn/expect';
export function InspectorProvider({ getService }) {
const log = getService('log');
const retry = getService('retry');
- const browser = getService('browser');
const renderable = getService('renderable');
const flyout = getService('flyout');
const testSubjects = getService('testSubjects');
@@ -132,7 +131,7 @@ export function InspectorProvider({ getService }) {
await retry.try(async () => {
const table = await testSubjects.find('inspectorTable');
const cell = await table.findByCssSelector(`tbody tr:nth-child(${row}) td:nth-child(${column})`);
- await browser.moveMouseTo(cell);
+ await cell.moveMouseTo();
const filterBtn = await testSubjects.findDescendant('filterForInspectorCellValue', cell);
await filterBtn.click();
});
@@ -143,7 +142,7 @@ export function InspectorProvider({ getService }) {
await retry.try(async () => {
const table = await testSubjects.find('inspectorTable');
const cell = await table.findByCssSelector(`tbody tr:nth-child(${row}) td:nth-child(${column})`);
- await browser.moveMouseTo(cell);
+ await cell.moveMouseTo();
const filterBtn = await testSubjects.findDescendant('filterOutInspectorCellValue', cell);
await filterBtn.click();
});
diff --git a/test/functional/services/lib/web_element_wrapper/web_element_wrapper.ts b/test/functional/services/lib/web_element_wrapper/web_element_wrapper.ts
index b05485618da01..65478c4e5ccd2 100644
--- a/test/functional/services/lib/web_element_wrapper/web_element_wrapper.ts
+++ b/test/functional/services/lib/web_element_wrapper/web_element_wrapper.ts
@@ -58,6 +58,7 @@ export class WebElementWrapper {
private Keys: IKey = this.webDriver.Key;
private driver: WebDriver = this.webDriver.driver;
public LegacyAction: any = this.webDriver.LegacyActionSequence;
+ public isW3CEnabled: boolean = (this.webDriver.driver as any).executor_.w3c === true;
public static create(
webElement: WebElement | WebElementWrapper,
@@ -149,6 +150,12 @@ export class WebElementWrapper {
}
}
+ private getActions(): any {
+ return this.isW3CEnabled
+ ? (this.driver as any).actions()
+ : (this.driver as any).actions({ bridge: true });
+ }
+
/**
* Returns whether or not the element would be visible to an actual user. This means
* that the following types of elements are considered to be not displayed:
@@ -402,29 +409,81 @@ export class WebElementWrapper {
}
/**
- * Moves the remote environment’s mouse cursor to the current element
+ * Moves the remote environment’s mouse cursor to the current element with optional offset
* https://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/lib/input_exports_Actions.html#move
- *
+ * @param { xOffset: 0, yOffset: 0 } options
* @return {Promise}
*/
- public async moveMouseTo() {
+ public async moveMouseTo(options = { xOffset: 0, yOffset: 0 }) {
await this.retryCall(async function moveMouseTo(wrapper) {
await wrapper.scrollIntoViewIfNecessary();
- if (wrapper.browserType === Browsers.Firefox) {
- const actions = (wrapper.driver as any).actions();
- await actions.move({ x: 0, y: 0 }).perform();
- await actions.move({ x: 10, y: 10, origin: wrapper._webElement }).perform();
+ if (wrapper.isW3CEnabled) {
+ await wrapper
+ .getActions()
+ .move({ x: 0, y: 0 })
+ .perform();
+ await wrapper
+ .getActions()
+ .move({ x: options.xOffset, y: options.yOffset, origin: wrapper._webElement })
+ .perform();
} else {
- const mouse = (wrapper.driver.actions() as any).mouse();
- const actions = (wrapper.driver as any).actions({ bridge: true });
- await actions
- .pause(mouse)
- .move({ origin: wrapper._webElement })
+ await wrapper
+ .getActions()
+ .pause(wrapper.getActions().mouse)
+ .move({ x: options.xOffset, y: options.yOffset, origin: wrapper._webElement })
.perform();
}
});
}
+ /**
+ * Inserts an action for moving the mouse to element center, unless optional offset is provided.
+ * Then adds an action for left-click (down/up) with the mouse.
+ * https://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/lib/input_exports_Actions.html#click
+ *
+ * @param { xOffset: 0, yOffset: 0 } options Optional
+ * @return {Promise}
+ */
+ public async clickMouseButton(options = { xOffset: 0, yOffset: 0 }): Promise {
+ await this.retryCall(async function clickMouseButton(wrapper) {
+ await wrapper.scrollIntoViewIfNecessary();
+ if (wrapper.isW3CEnabled) {
+ await wrapper
+ .getActions()
+ .move({ x: 0, y: 0 })
+ .perform();
+ await wrapper
+ .getActions()
+ .move({ x: options.xOffset, y: options.yOffset, origin: wrapper._webElement })
+ .click()
+ .perform();
+ } else {
+ await wrapper
+ .getActions()
+ .pause(wrapper.getActions().mouse)
+ .move({ x: options.xOffset, y: options.yOffset, origin: wrapper._webElement })
+ .click()
+ .perform();
+ }
+ });
+ }
+
+ /**
+ * Inserts action for performing a double left-click with the mouse.
+ * https://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/lib/input_exports_Actions.html#doubleClick
+ * @param {WebElementWrapper} element
+ * @return {Promise
This is a long title
' + - '| fieldA: | value of fld1 |
| fld2: | 42 |
| fieldA: | value of fld1 |
| fld2: | 42 |