boolean | |
-| [id](./kibana-plugin-plugins-data-public.aggconfigoptions.id.md) | string | |
-| [params](./kibana-plugin-plugins-data-public.aggconfigoptions.params.md) | Record<string, any> | |
-| [schema](./kibana-plugin-plugins-data-public.aggconfigoptions.schema.md) | string | |
-| [type](./kibana-plugin-plugins-data-public.aggconfigoptions.type.md) | IAggType | |
-
diff --git a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.aggconfigoptions.params.md b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.aggconfigoptions.params.md
deleted file mode 100644
index 45219a837cc33..0000000000000
--- a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.aggconfigoptions.params.md
+++ /dev/null
@@ -1,11 +0,0 @@
-
-
-[Home](./index.md) > [kibana-plugin-plugins-data-public](./kibana-plugin-plugins-data-public.md) > [AggConfigOptions](./kibana-plugin-plugins-data-public.aggconfigoptions.md) > [params](./kibana-plugin-plugins-data-public.aggconfigoptions.params.md)
-
-## AggConfigOptions.params property
-
-Signature:
-
-```typescript
-params?: Recordstring[] | |
-| [makeAgg](./kibana-plugin-plugins-data-public.aggparamtype.makeagg.md) | | (agg: TAggConfig, state?: any) => TAggConfig | |
+| [makeAgg](./kibana-plugin-plugins-data-public.aggparamtype.makeagg.md) | | (agg: TAggConfig, state?: AggConfigSerialized) => TAggConfig | |
diff --git a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.baseformatterspublic.md b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.baseformatterspublic.md
index 50e8f2409ac02..ddbf1a8459d1f 100644
--- a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.baseformatterspublic.md
+++ b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.baseformatterspublic.md
@@ -7,5 +7,5 @@
Signature:
```typescript
-baseFormattersPublic: (import("../../common").IFieldFormatType | typeof DateFormat)[]
+baseFormattersPublic: (import("../../common").FieldFormatInstanceType | typeof DateFormat)[]
```
diff --git a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.md b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.md
index 5ef317a57fb0e..604ac5120922b 100644
--- a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.md
+++ b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.md
@@ -49,7 +49,6 @@
| Interface | Description |
| --- | --- |
-| [AggConfigOptions](./kibana-plugin-plugins-data-public.aggconfigoptions.md) | |
| [AggParamOption](./kibana-plugin-plugins-data-public.aggparamoption.md) | |
| [DataPublicPluginSetup](./kibana-plugin-plugins-data-public.datapublicpluginsetup.md) | |
| [DataPublicPluginStart](./kibana-plugin-plugins-data-public.datapublicpluginstart.md) | |
@@ -118,6 +117,7 @@
| Type Alias | Description |
| --- | --- |
+| [AggConfigOptions](./kibana-plugin-plugins-data-public.aggconfigoptions.md) | |
| [AggParam](./kibana-plugin-plugins-data-public.aggparam.md) | |
| [CustomFilter](./kibana-plugin-plugins-data-public.customfilter.md) | |
| [EsQuerySortValue](./kibana-plugin-plugins-data-public.esquerysortvalue.md) | |
diff --git a/docs/development/plugins/data/server/kibana-plugin-plugins-data-server.plugin.setup.md b/docs/development/plugins/data/server/kibana-plugin-plugins-data-server.plugin.setup.md
index 5c2f542204079..4d7a0b3cfbbca 100644
--- a/docs/development/plugins/data/server/kibana-plugin-plugins-data-server.plugin.setup.md
+++ b/docs/development/plugins/data/server/kibana-plugin-plugins-data-server.plugin.setup.md
@@ -9,7 +9,7 @@
```typescript
setup(core: CoreSetup, { usageCollection }: DataPluginSetupDependencies): {
fieldFormats: {
- register: (customFieldFormat: import("../common").IFieldFormatType) => number;
+ register: (customFieldFormat: import("../common").FieldFormatInstanceType) => number;
};
search: ISearchSetup;
};
@@ -26,7 +26,7 @@ setup(core: CoreSetup, { usageCollection }: DataPluginSetupDependencies): {
`{
fieldFormats: {
- register: (customFieldFormat: import("../common").IFieldFormatType) => number;
+ register: (customFieldFormat: import("../common").FieldFormatInstanceType) => number;
};
search: ISearchSetup;
}`
diff --git a/docs/images/report-automate-csv.png b/docs/images/report-automate-csv.png
new file mode 100644
index 0000000000000..fba77821ae29f
Binary files /dev/null and b/docs/images/report-automate-csv.png differ
diff --git a/docs/images/report-automate-pdf.png b/docs/images/report-automate-pdf.png
new file mode 100644
index 0000000000000..f96eebe6fe02d
Binary files /dev/null and b/docs/images/report-automate-pdf.png differ
diff --git a/docs/logs/images/logs-action-menu.png b/docs/logs/images/logs-action-menu.png
new file mode 100644
index 0000000000000..f1c79b6fa88d1
Binary files /dev/null and b/docs/logs/images/logs-action-menu.png differ
diff --git a/docs/logs/images/logs-view-in-context.png b/docs/logs/images/logs-view-in-context.png
new file mode 100644
index 0000000000000..09a9e89fc3042
Binary files /dev/null and b/docs/logs/images/logs-view-in-context.png differ
diff --git a/docs/logs/using.asciidoc b/docs/logs/using.asciidoc
index 96e7c5fa4d312..4f5992f945c7a 100644
--- a/docs/logs/using.asciidoc
+++ b/docs/logs/using.asciidoc
@@ -69,12 +69,19 @@ To highlight a word or phrase in the logs stream, click *Highlights* and enter y
[float]
[[logs-event-inspector]]
=== Inspect a log event
-To inspect a log event, hover over it, then click the *View details* icon image:logs/images/logs-view-event.png[View event icon] beside the event.
-This opens the *Log event document details* fly-out that shows the fields associated with the log event.
+To inspect a log event, hover over it, then click the *View actions for line* icon image:logs/images/logs-action-menu.png[View actions for line icon]. On the menu that opens, select *View details*. This opens the *Log event document details* fly-out that shows the fields associated with the log event.
To quickly filter the logs stream by one of the field values, in the log event details, click the *View event with filter* icon image:logs/images/logs-view-event-with-filter.png[View event icon] beside the field.
This automatically adds a search filter to the logs stream to filter the entries by this field and value.
+[float]
+[[log-view-in-context]]
+=== View log line in context
+To view a certain line in its context (for example, with other log lines from the same file, or the same cloud container), hover over it, then click the *View actions for line* image:logs/images/logs-action-menu.png[View actions for line icon]. On the menu that opens, select *View in context*. This opens the *View log in context* modal, that shows the log line in its context.
+
+[role="screenshot"]
+image::logs/images/logs-view-in-context.png[View a log line in context]
+
[float]
[[view-log-anomalies]]
=== View log anomalies
diff --git a/docs/user/alerting/action-types.asciidoc b/docs/user/alerting/action-types.asciidoc
index 49e7bd1d77743..8794c389d72bc 100644
--- a/docs/user/alerting/action-types.asciidoc
+++ b/docs/user/alerting/action-types.asciidoc
@@ -41,12 +41,14 @@ see https://www.elastic.co/subscriptions[the subscription page].
[float]
[[create-connectors]]
-=== Connectors
+=== Preconfigured connectors and action types
You can create connectors for actions in <- - - - - - - - - - - - - - - {{tag.name}} - - - - -
- - - -
-
-
-
-
-
- - - - - - -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern.js b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern.js
deleted file mode 100644
index 3239a17f109e4..0000000000000
--- a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern.js
+++ /dev/null
@@ -1,511 +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 { HashRouter } from 'react-router-dom';
-import { IndexHeader } from './index_header';
-import { CreateEditField } from './create_edit_field';
-import { docTitle } from 'ui/doc_title';
-import { KbnUrlProvider } from 'ui/url';
-import { IndicesEditSectionsProvider } from './edit_sections';
-import { fatalError, toastNotifications } from 'ui/notify';
-import { RegistryFieldFormatEditorsProvider } from 'ui/registry/field_format_editors';
-import uiRoutes from 'ui/routes';
-import { uiModules } from 'ui/modules';
-import template from './edit_index_pattern.html';
-import createEditFieldtemplate from './create_edit_field.html';
-import { fieldWildcardMatcher } from '../../../../../../../../plugins/kibana_utils/public';
-import { subscribeWithScope } from '../../../../../../../../plugins/kibana_legacy/public';
-import React from 'react';
-import { render, unmountComponentAtNode } from 'react-dom';
-import { SourceFiltersTable } from './source_filters_table';
-import { IndexedFieldsTable } from './indexed_fields_table';
-import { ScriptedFieldsTable } from './scripted_fields_table';
-import { i18n } from '@kbn/i18n';
-import { I18nContext } from 'ui/i18n';
-import { npStart } from 'ui/new_platform';
-import {
- getEditBreadcrumbs,
- getEditFieldBreadcrumbs,
- getCreateFieldBreadcrumbs,
-} from '../breadcrumbs';
-import { TAB_INDEXED_FIELDS, TAB_SCRIPTED_FIELDS, TAB_SOURCE_FILTERS } from './constants';
-import { createEditIndexPatternPageStateContainer } from './edit_index_pattern_state_container';
-
-const REACT_SOURCE_FILTERS_DOM_ELEMENT_ID = 'reactSourceFiltersTable';
-const REACT_INDEXED_FIELDS_DOM_ELEMENT_ID = 'reactIndexedFieldsTable';
-const REACT_SCRIPTED_FIELDS_DOM_ELEMENT_ID = 'reactScriptedFieldsTable';
-const REACT_INDEX_HEADER_DOM_ELEMENT_ID = 'reactIndexHeader';
-
-const EDIT_FIELD_PATH = '/management/kibana/index_patterns/{{indexPattern.id}}/field/{{name}}';
-
-function updateSourceFiltersTable($scope) {
- $scope.$$postDigest(() => {
- const node = document.getElementById(REACT_SOURCE_FILTERS_DOM_ELEMENT_ID);
- if (!node) {
- return;
- }
-
- render(
-
+
{mappingConflictLabel}
+
-
-
-
-
-
-
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/index.js b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/index.js
index 6beaee60b3788..e05aea3678fe2 100644
--- a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/index.js
+++ b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/index.js
@@ -17,4 +17,159 @@
* under the License.
*/
-import './edit_index_pattern';
+import React from 'react';
+import { HashRouter } from 'react-router-dom';
+import { render, unmountComponentAtNode } from 'react-dom';
+import { RegistryFieldFormatEditorsProvider } from 'ui/registry/field_format_editors';
+import uiRoutes from 'ui/routes';
+import { uiModules } from 'ui/modules';
+import { I18nContext } from 'ui/i18n';
+import { npStart } from 'ui/new_platform';
+import template from './edit_index_pattern.html';
+import createEditFieldtemplate from './create_edit_field.html';
+import {
+ getEditBreadcrumbs,
+ getEditFieldBreadcrumbs,
+ getCreateFieldBreadcrumbs,
+} from '../breadcrumbs';
+import { EditIndexPattern } from './edit_index_pattern';
+import { CreateEditField } from './create_edit_field';
+
+const REACT_EDIT_INDEX_PATTERN_DOM_ELEMENT_ID = 'reactEditIndexPattern';
+
+function destroyEditIndexPattern() {
+ const node = document.getElementById(REACT_EDIT_INDEX_PATTERN_DOM_ELEMENT_ID);
+ node && unmountComponentAtNode(node);
+}
+
+function renderEditIndexPattern($scope, config, $route) {
+ $scope.$$postDigest(() => {
+ const node = document.getElementById(REACT_EDIT_INDEX_PATTERN_DOM_ELEMENT_ID);
+ if (!node) {
+ return;
+ }
+
+ render(
+
-
diff --git a/src/legacy/ui/public/error_auto_create_index/error_auto_create_index.test.js b/src/legacy/ui/public/error_auto_create_index/error_auto_create_index.test.js
deleted file mode 100644
index a8f6318090b1d..0000000000000
--- a/src/legacy/ui/public/error_auto_create_index/error_auto_create_index.test.js
+++ /dev/null
@@ -1,95 +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.
- */
-
-// @ts-ignore
-import './error_auto_create_index.test.mocks';
-import fetchMock from 'fetch-mock/es5/client';
-import { kfetch } from '../kfetch';
-
-import { isAutoCreateIndexError } from './error_auto_create_index';
-
-describe('isAutoCreateIndexError correctly handles KFetchError thrown by kfetch', () => {
- describe('404', () => {
- beforeEach(() => {
- fetchMock.post({
- matcher: '*',
- response: {
- status: 404,
- },
- });
- });
- afterEach(() => fetchMock.restore());
-
- test('should return false', async () => {
- expect.assertions(1);
- try {
- await kfetch({ method: 'POST', pathname: '/my/path' });
- } catch (kfetchError) {
- expect(isAutoCreateIndexError(kfetchError)).toBe(false);
- }
- });
- });
-
- describe('503 error that is not ES_AUTO_CREATE_INDEX_ERROR', () => {
- beforeEach(() => {
- fetchMock.post({
- matcher: '*',
- response: {
- status: 503,
- },
- });
- });
- afterEach(() => fetchMock.restore());
-
- test('should return false', async () => {
- expect.assertions(1);
- try {
- await kfetch({ method: 'POST', pathname: '/my/path' });
- } catch (kfetchError) {
- expect(isAutoCreateIndexError(kfetchError)).toBe(false);
- }
- });
- });
-
- describe('503 error that is ES_AUTO_CREATE_INDEX_ERROR', () => {
- beforeEach(() => {
- fetchMock.post({
- matcher: '*',
- response: {
- body: {
- attributes: {
- code: 'ES_AUTO_CREATE_INDEX_ERROR',
- },
- },
- status: 503,
- },
- });
- });
- afterEach(() => fetchMock.restore());
-
- test('should return true', async () => {
- expect.assertions(1);
- try {
- await kfetch({ method: 'POST', pathname: '/my/path' });
- } catch (kfetchError) {
- expect(isAutoCreateIndexError(kfetchError)).toBe(true);
- }
- });
- });
-});
diff --git a/src/legacy/ui/public/new_platform/new_platform.ts b/src/legacy/ui/public/new_platform/new_platform.ts
index 5ae2e2348aaa1..a15c7cce5511d 100644
--- a/src/legacy/ui/public/new_platform/new_platform.ts
+++ b/src/legacy/ui/public/new_platform/new_platform.ts
@@ -59,7 +59,6 @@ import {
NavigationPublicPluginSetup,
NavigationPublicPluginStart,
} from '../../../../plugins/navigation/public';
-import { VisTypeVegaSetup } from '../../../../plugins/vis_type_vega/public';
import { DiscoverSetup, DiscoverStart } from '../../../../plugins/discover/public';
import {
SavedObjectsManagementPluginSetup,
@@ -88,7 +87,6 @@ export interface PluginsSetup {
usageCollection: UsageCollectionSetup;
advancedSettings: AdvancedSettingsSetup;
management: ManagementSetup;
- visTypeVega: VisTypeVegaSetup;
discover: DiscoverSetup;
visualizations: VisualizationsSetup;
telemetry?: TelemetryPluginSetup;
diff --git a/src/legacy/ui/ui_exports/ui_export_defaults.js b/src/legacy/ui/ui_exports/ui_export_defaults.js
index bb246d97bfe4e..35e1f8b7d2127 100644
--- a/src/legacy/ui/ui_exports/ui_export_defaults.js
+++ b/src/legacy/ui/ui_exports/ui_export_defaults.js
@@ -24,6 +24,7 @@ export const UI_EXPORT_DEFAULTS = {
webpackNoParseRules: [
/node_modules[\/\\](angular|elasticsearch-browser)[\/\\]/,
/node_modules[\/\\](mocha|moment)[\/\\]/,
+ /node_modules[\/\\]vega-lib[\/\\]build[\/\\]vega\.js$/,
],
webpackAliases: {
diff --git a/src/legacy/ui/ui_render/bootstrap/template.js.hbs b/src/legacy/ui/ui_render/bootstrap/template.js.hbs
index 7250fa4fc9eca..8a71c6ccb1506 100644
--- a/src/legacy/ui/ui_render/bootstrap/template.js.hbs
+++ b/src/legacy/ui/ui_render/bootstrap/template.js.hbs
@@ -1,6 +1,7 @@
var kbnCsp = JSON.parse(document.querySelector('kbn-csp').getAttribute('data'));
window.__kbnStrictCsp__ = kbnCsp.strictCsp;
window.__kbnDarkMode__ = {{darkMode}};
+window.__kbnPublicPath__ = {{publicPathMap}};
if (window.__kbnStrictCsp__ && window.__kbnCspNotEnforced__) {
var legacyBrowserError = document.getElementById('kbn_legacy_browser_error');
diff --git a/src/legacy/ui/ui_render/ui_render_mixin.js b/src/legacy/ui/ui_render/ui_render_mixin.js
index 1e84405dd5153..801eecf5b608b 100644
--- a/src/legacy/ui/ui_render/ui_render_mixin.js
+++ b/src/legacy/ui/ui_render/ui_render_mixin.js
@@ -153,11 +153,25 @@ export function uiRenderMixin(kbnServer, server, config) {
`${regularBundlePath}/plugin/kibanaReact/kibanaReact.plugin.js`,
];
+ const uiPluginIds = [...kbnServer.newPlatform.__internals.uiPlugins.public.keys()];
+
+ // These paths should align with the bundle routes configured in
+ // src/optimize/bundles_route/bundles_route.js
+ const publicPathMap = JSON.stringify({
+ core: `${regularBundlePath}/core/`,
+ 'kbn-ui-shared-deps': `${regularBundlePath}/kbn-ui-shared-deps/`,
+ ...uiPluginIds.reduce(
+ (acc, pluginId) => ({ ...acc, [pluginId]: `${regularBundlePath}/plugin/${pluginId}/` }),
+ {}
+ ),
+ });
+
const bootstrap = new AppBootstrap({
templateData: {
darkMode,
jsDependencyPaths,
styleSheetPaths,
+ publicPathMap,
entryBundlePath: isCore
? `${regularBundlePath}/core/core.entry.js`
: `${regularBundlePath}/${app.getId()}.bundle.js`,
diff --git a/src/optimize/bundles_route/bundles_route.js b/src/optimize/bundles_route/bundles_route.js
index 530dabb9a46a3..4030988c8552c 100644
--- a/src/optimize/bundles_route/bundles_route.js
+++ b/src/optimize/bundles_route/bundles_route.js
@@ -72,43 +72,57 @@ export function createBundlesRoute({
}
return [
- buildRouteForBundles(
- `${basePublicPath}/bundles/kbn-ui-shared-deps/`,
- '/bundles/kbn-ui-shared-deps/',
- UiSharedDeps.distDir,
- fileHashCache
- ),
+ buildRouteForBundles({
+ publicPath: `${basePublicPath}/bundles/kbn-ui-shared-deps/`,
+ routePath: '/bundles/kbn-ui-shared-deps/',
+ bundlesPath: UiSharedDeps.distDir,
+ fileHashCache,
+ replacePublicPath: false,
+ }),
...npUiPluginPublicDirs.map(({ id, path }) =>
- buildRouteForBundles(
- `${basePublicPath}/bundles/plugin/${id}/`,
- `/bundles/plugin/${id}/`,
- path,
- fileHashCache
- )
- ),
- buildRouteForBundles(
- `${basePublicPath}/bundles/core/`,
- `/bundles/core/`,
- fromRoot(join('src', 'core', 'target', 'public')),
- fileHashCache
- ),
- buildRouteForBundles(
- `${basePublicPath}/bundles/`,
- '/bundles/',
- regularBundlesPath,
- fileHashCache
+ buildRouteForBundles({
+ publicPath: `${basePublicPath}/bundles/plugin/${id}/`,
+ routePath: `/bundles/plugin/${id}/`,
+ bundlesPath: path,
+ fileHashCache,
+ replacePublicPath: false,
+ })
),
- buildRouteForBundles(
- `${basePublicPath}/built_assets/dlls/`,
- '/built_assets/dlls/',
- dllBundlesPath,
- fileHashCache
- ),
- buildRouteForBundles(`${basePublicPath}/`, '/built_assets/css/', builtCssPath, fileHashCache),
+ buildRouteForBundles({
+ publicPath: `${basePublicPath}/bundles/core/`,
+ routePath: `/bundles/core/`,
+ bundlesPath: fromRoot(join('src', 'core', 'target', 'public')),
+ fileHashCache,
+ replacePublicPath: false,
+ }),
+ buildRouteForBundles({
+ publicPath: `${basePublicPath}/bundles/`,
+ routePath: '/bundles/',
+ bundlesPath: regularBundlesPath,
+ fileHashCache,
+ }),
+ buildRouteForBundles({
+ publicPath: `${basePublicPath}/built_assets/dlls/`,
+ routePath: '/built_assets/dlls/',
+ bundlesPath: dllBundlesPath,
+ fileHashCache,
+ }),
+ buildRouteForBundles({
+ publicPath: `${basePublicPath}/`,
+ routePath: '/built_assets/css/',
+ bundlesPath: builtCssPath,
+ fileHashCache,
+ }),
];
}
-function buildRouteForBundles(publicPath, routePath, bundlesPath, fileHashCache) {
+function buildRouteForBundles({
+ publicPath,
+ routePath,
+ bundlesPath,
+ fileHashCache,
+ replacePublicPath = true,
+}) {
return {
method: 'GET',
path: `${routePath}{path*}`,
@@ -129,6 +143,7 @@ function buildRouteForBundles(publicPath, routePath, bundlesPath, fileHashCache)
bundlesPath,
fileHashCache,
publicPath,
+ replacePublicPath,
});
},
},
diff --git a/src/optimize/bundles_route/dynamic_asset_response.js b/src/optimize/bundles_route/dynamic_asset_response.js
index 7af780a79e430..80c49a26270fd 100644
--- a/src/optimize/bundles_route/dynamic_asset_response.js
+++ b/src/optimize/bundles_route/dynamic_asset_response.js
@@ -52,7 +52,7 @@ import { replacePlaceholder } from '../public_path_placeholder';
* @property {LruCache} options.fileHashCache
*/
export async function createDynamicAssetResponse(options) {
- const { request, h, bundlesPath, publicPath, fileHashCache } = options;
+ const { request, h, bundlesPath, publicPath, fileHashCache, replacePublicPath } = options;
let fd;
try {
@@ -78,11 +78,14 @@ export async function createDynamicAssetResponse(options) {
});
fd = null; // read stream is now responsible for fd
+ const content = replacePublicPath ? replacePlaceholder(read, publicPath) : read;
+ const etag = replacePublicPath ? `${hash}-${publicPath}` : hash;
+
return h
- .response(replacePlaceholder(read, publicPath))
+ .response(content)
.takeover()
.code(200)
- .etag(`${hash}-${publicPath}`)
+ .etag(etag)
.header('cache-control', 'must-revalidate')
.type(request.server.mime.path(path).type);
} catch (error) {
diff --git a/src/plugins/advanced_settings/kibana.json b/src/plugins/advanced_settings/kibana.json
index cac9a6daa8df8..e6ca6e797ba45 100644
--- a/src/plugins/advanced_settings/kibana.json
+++ b/src/plugins/advanced_settings/kibana.json
@@ -1,7 +1,7 @@
{
"id": "advancedSettings",
"version": "kibana",
- "server": false,
+ "server": true,
"ui": true,
"requiredPlugins": ["management"]
}
diff --git a/src/legacy/ui/public/error_auto_create_index/error_auto_create_index.test.mocks.js b/src/plugins/advanced_settings/server/capabilities_provider.ts
similarity index 84%
rename from src/legacy/ui/public/error_auto_create_index/error_auto_create_index.test.mocks.js
rename to src/plugins/advanced_settings/server/capabilities_provider.ts
index 1ac30b85c5a85..083d5f3ffced4 100644
--- a/src/legacy/ui/public/error_auto_create_index/error_auto_create_index.test.mocks.js
+++ b/src/plugins/advanced_settings/server/capabilities_provider.ts
@@ -17,6 +17,9 @@
* under the License.
*/
-import { setup } from '../../../../test_utils/public/http_test_setup';
-
-jest.doMock('ui/new_platform', () => ({ npSetup: { core: setup() } }));
+export const capabilitiesProvider = () => ({
+ advancedSettings: {
+ show: true,
+ save: true,
+ },
+});
diff --git a/src/legacy/core_plugins/vis_type_vega/public/index.ts b/src/plugins/advanced_settings/server/index.ts
similarity index 77%
rename from src/legacy/core_plugins/vis_type_vega/public/index.ts
rename to src/plugins/advanced_settings/server/index.ts
index 34ca0e72190e4..ffcf7cd49a8c3 100644
--- a/src/legacy/core_plugins/vis_type_vega/public/index.ts
+++ b/src/plugins/advanced_settings/server/index.ts
@@ -17,9 +17,8 @@
* under the License.
*/
-import { PluginInitializerContext } from '../../../../core/public';
-import { VegaPlugin as Plugin } from './plugin';
+import { PluginInitializerContext } from 'kibana/server';
+import { AdvancedSettingsServerPlugin } from './plugin';
-export function plugin(initializerContext: PluginInitializerContext) {
- return new Plugin(initializerContext);
-}
+export const plugin = (initContext: PluginInitializerContext) =>
+ new AdvancedSettingsServerPlugin(initContext);
diff --git a/src/legacy/ui/public/error_auto_create_index/error_auto_create_index.ts b/src/plugins/advanced_settings/server/plugin.ts
similarity index 54%
rename from src/legacy/ui/public/error_auto_create_index/error_auto_create_index.ts
rename to src/plugins/advanced_settings/server/plugin.ts
index 09c6bfd93148f..4d7bd34259819 100644
--- a/src/legacy/ui/public/error_auto_create_index/error_auto_create_index.ts
+++ b/src/plugins/advanced_settings/server/plugin.ts
@@ -17,31 +17,28 @@
* under the License.
*/
-import { i18n } from '@kbn/i18n';
-import { get } from 'lodash';
-
-import uiRoutes from '../routes';
-
-import template from './error_auto_create_index.html';
-
-uiRoutes.when('/error/action.auto_create_index', {
- template,
- k7Breadcrumbs: () => [
- {
- text: i18n.translate('common.ui.errorAutoCreateIndex.breadcrumbs.errorText', {
- defaultMessage: 'Error',
- }),
- },
- ],
-});
-
-export function isAutoCreateIndexError(error: object) {
- return (
- get(error, 'res.status') === 503 &&
- get(error, 'body.attributes.code') === 'ES_AUTO_CREATE_INDEX_ERROR'
- );
-}
+import { PluginInitializerContext, CoreSetup, CoreStart, Plugin, Logger } from 'kibana/server';
+import { capabilitiesProvider } from './capabilities_provider';
+
+export class AdvancedSettingsServerPlugin implements Plugin- - -
- - - - - - --
-
-
-
-
-
-
-
-
-
-
-
-
-
- {children}
@@ -61,6 +65,12 @@ jest.mock('@elastic/eui/packages/react-datepicker', () => {
};
});
+
+// Mock React Portal for components that use modals, tooltips, etc
+ReactDOM.createPortal = jest.fn((element) => {
+ return element;
+});
+
jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => {
return {
htmlIdGenerator: () => () => `generated-id`,
@@ -71,7 +81,7 @@ jest.mock('plugins/interpreter/registries', () => ({}));
// Disabling this test due to https://github.com/elastic/eui/issues/2242
jest.mock(
- '../public/components/workpad_header/workpad_export/flyout/__examples__/share_website_flyout.stories',
+ '../public/components/workpad_header/share_menu/flyout/__examples__/share_website_flyout.stories',
() => {
return 'Disabled Panel';
}
diff --git a/x-pack/legacy/plugins/canvas/.storybook/webpack.config.js b/x-pack/legacy/plugins/canvas/.storybook/webpack.config.js
index cc74faeac6a96..963cf831ef698 100644
--- a/x-pack/legacy/plugins/canvas/.storybook/webpack.config.js
+++ b/x-pack/legacy/plugins/canvas/.storybook/webpack.config.js
@@ -177,8 +177,10 @@ module.exports = async ({ config }) => {
}),
// Mock out libs used by a few componets to avoid loading in kibana_legacy and platform
- new webpack.NormalModuleReplacementPlugin(/lib\/notify/, path.resolve(__dirname, '../tasks/mocks/uiNotify')),
+ new webpack.NormalModuleReplacementPlugin(/(lib)?\/notify/, path.resolve(__dirname, '../tasks/mocks/uiNotify')),
new webpack.NormalModuleReplacementPlugin(/lib\/download_workpad/, path.resolve(__dirname, '../tasks/mocks/downloadWorkpad')),
+ new webpack.NormalModuleReplacementPlugin(/(lib)?\/custom_element_service/, path.resolve(__dirname, '../tasks/mocks/customElementService')),
+ new webpack.NormalModuleReplacementPlugin(/(lib)?\/ui_metric/, path.resolve(__dirname, '../tasks/mocks/uiMetric')),
);
// Tell Webpack about relevant extensions
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/area_chart/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/area_chart/header.png
deleted file mode 100644
index 93456066429d9..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/area_chart/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/area_chart/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/area_chart/index.ts
index 0650ac15c656e..df829e8b97676 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/area_chart/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/area_chart/index.ts
@@ -5,14 +5,13 @@
*/
import { ElementFactory } from '../../../types';
-import header from './header.png';
export const areaChart: ElementFactory = () => ({
name: 'areaChart',
- displayName: 'Area chart',
+ displayName: 'Area',
help: 'A line chart with a filled body',
- tags: ['chart'],
- image: header,
+ type: 'chart',
+ icon: 'visArea',
expression: `filters
| demodata
| pointseries x="time" y="mean(price)"
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/bubble_chart/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/bubble_chart/header.png
deleted file mode 100644
index db541fe7c53b8..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/bubble_chart/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/bubble_chart/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/bubble_chart/index.ts
index 7ab510e419769..7ac1d0ac83b0b 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/bubble_chart/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/bubble_chart/index.ts
@@ -5,16 +5,15 @@
*/
import { ElementFactory } from '../../../types';
-import header from './header.png';
export const bubbleChart: ElementFactory = () => ({
name: 'bubbleChart',
- displayName: 'Bubble chart',
- tags: ['chart'],
+ displayName: 'Bubble',
+ type: 'chart',
help: 'A customizable bubble chart',
width: 700,
height: 300,
- image: header,
+ icon: 'heatmap',
expression: `filters
| demodata
| pointseries x="project" y="sum(price)" color="state" size="size(username)"
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/debug/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/debug/header.png
deleted file mode 100644
index 37ab329a49bb8..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/debug/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/debug/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/debug/index.ts
index 914982951d664..ec8477f8f1017 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/debug/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/debug/index.ts
@@ -5,14 +5,12 @@
*/
import { ElementFactory } from '../../../types';
-import header from './header.png';
export const debug: ElementFactory = () => ({
name: 'debug',
- displayName: 'Debug',
- tags: ['text'],
+ displayName: 'Debug data',
help: 'Just dumps the configuration of the element',
- image: header,
+ icon: 'bug',
expression: `demodata
| render as=debug`,
});
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/donut/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/donut/header.png
deleted file mode 100644
index 4bbfb6f8f68fc..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/donut/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/donut/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/donut/index.ts
deleted file mode 100644
index 4ea8037d2073e..0000000000000
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/donut/index.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-
-import { ElementFactory } from '../../../types';
-import header from './header.png';
-
-export const donut: ElementFactory = () => ({
- name: 'donut',
- displayName: 'Donut chart',
- tags: ['chart', 'proportion'],
- help: 'A customizable donut chart',
- image: header,
- expression: `filters
-| demodata
-| pointseries color="project" size="max(price)"
-| pie hole=50 labels=false legend="ne"
-| render`,
-});
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/dropdown_filter/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/dropdown_filter/header.png
deleted file mode 100644
index 727b4d23941fd..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/dropdown_filter/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/dropdown_filter/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/dropdown_filter/index.ts
index bde223d2a606e..bb1c13ca618be 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/dropdown_filter/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/dropdown_filter/index.ts
@@ -5,14 +5,13 @@
*/
import { ElementFactory } from '../../../types';
-import header from './header.png';
export const dropdownFilter: ElementFactory = () => ({
- name: 'dropdown_filter',
- displayName: 'Dropdown filter',
- tags: ['filter'],
+ name: 'dropdownFilter',
+ displayName: 'Dropdown select',
+ type: 'filter',
help: 'A dropdown from which you can select values for an "exactly" filter',
- image: header,
+ icon: 'filter',
height: 50,
expression: `demodata
| dropdownControl valueColumn=project filterColumn=project | render`,
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/filter_debug/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/filter_debug/index.ts
new file mode 100644
index 0000000000000..35a4a75f49c4e
--- /dev/null
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/filter_debug/index.ts
@@ -0,0 +1,16 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { ElementFactory } from '../../../types';
+
+export const filterDebug: ElementFactory = () => ({
+ name: 'filterDebug',
+ displayName: 'Debug filter',
+ help: 'Shows the underlying global filters in a workpad',
+ icon: 'bug',
+ expression: `filters
+| render as=debug`,
+});
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_bar_chart/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_bar_chart/header.png
deleted file mode 100644
index 9b6ee47d88698..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_bar_chart/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_bar_chart/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_bar_chart/index.ts
index 7fddf48c70385..9567336decd5d 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_bar_chart/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_bar_chart/index.ts
@@ -5,14 +5,13 @@
*/
import { ElementFactory } from '../../../types';
-import header from './header.png';
export const horizontalBarChart: ElementFactory = () => ({
name: 'horizontalBarChart',
- displayName: 'Horizontal bar chart',
- tags: ['chart'],
+ displayName: 'Bar horizontal',
+ type: 'chart',
help: 'A customizable horizontal bar chart',
- image: header,
+ icon: 'visBarHorizontal',
expression: `filters
| demodata
| pointseries x="size(cost)" y="project" color="project"
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_bar/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_bar/header.png
deleted file mode 100644
index f28ad4a3ce4be..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_bar/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_bar/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_bar/index.ts
index f4a50a007c5de..529a74893a5de 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_bar/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_bar/index.ts
@@ -6,16 +6,14 @@
import { openSans } from '../../../common/lib/fonts';
import { ElementFactory } from '../../../types';
-import header from './header.png';
export const horizontalProgressBar: ElementFactory = () => ({
name: 'horizontalProgressBar',
- displayName: 'Horizontal progress bar',
- tags: ['chart', 'proportion'],
+ displayName: 'Horizontal bar',
+ type: 'progress',
help: 'Displays progress as a portion of a horizontal bar',
width: 400,
height: 30,
- image: header,
expression: `filters
| demodata
| math "mean(percent_uptime)"
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_pill/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_pill/header.png
deleted file mode 100644
index 2eaeb2e976a78..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_pill/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_pill/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_pill/index.ts
index 9b3aea2e55324..d5eba32325d1a 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_pill/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_pill/index.ts
@@ -6,16 +6,14 @@
import { openSans } from '../../../common/lib/fonts';
import { ElementFactory } from '../../../types';
-import header from './header.png';
export const horizontalProgressPill: ElementFactory = () => ({
name: 'horizontalProgressPill',
- displayName: 'Horizontal progress pill',
- tags: ['chart', 'proportion'],
+ displayName: 'Horizontal pill',
+ type: 'progress',
help: 'Displays progress as a portion of a horizontal pill',
width: 400,
height: 30,
- image: header,
expression: `filters
| demodata
| math "mean(percent_uptime)"
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/image/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/image/header.png
deleted file mode 100644
index 7f29fc64c36b9..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/image/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/image/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/image/index.ts
index eec1e2af61aad..ed7f6a99ddc32 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/image/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/image/index.ts
@@ -5,14 +5,13 @@
*/
import { ElementFactory } from '../../../types';
-import header from './header.png';
export const image: ElementFactory = () => ({
name: 'image',
displayName: 'Image',
- tags: ['graphic'],
+ type: 'image',
help: 'A static image',
- image: header,
+ icon: 'image',
expression: `image dataurl=null mode="contain"
| render`,
});
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/index.ts
index 6c0cd7eb33dc0..ec3b8a7798be1 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/index.ts
@@ -8,8 +8,8 @@ import { applyElementStrings } from '../../i18n/elements';
import { areaChart } from './area_chart';
import { bubbleChart } from './bubble_chart';
import { debug } from './debug';
-import { donut } from './donut';
import { dropdownFilter } from './dropdown_filter';
+import { filterDebug } from './filter_debug';
import { horizontalBarChart } from './horizontal_bar_chart';
import { horizontalProgressBar } from './horizontal_progress_bar';
import { horizontalProgressPill } from './horizontal_progress_pill';
@@ -26,7 +26,6 @@ import { repeatImage } from './repeat_image';
import { revealImage } from './reveal_image';
import { shape } from './shape';
import { table } from './table';
-import { tiltedPie } from './tilted_pie';
import { timeFilter } from './time_filter';
import { verticalBarChart } from './vert_bar_chart';
import { verticalProgressBar } from './vertical_progress_bar';
@@ -39,8 +38,8 @@ const elementSpecs = [
areaChart,
bubbleChart,
debug,
- donut,
dropdownFilter,
+ filterDebug,
image,
horizontalBarChart,
horizontalProgressBar,
@@ -56,7 +55,6 @@ const elementSpecs = [
revealImage,
shape,
table,
- tiltedPie,
timeFilter,
verticalBarChart,
verticalProgressBar,
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/line_chart/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/line_chart/header.png
deleted file mode 100644
index eea133ee3680b..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/line_chart/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/line_chart/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/line_chart/index.ts
index 5b8533eea65bc..d19ddeb00dd67 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/line_chart/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/line_chart/index.ts
@@ -5,14 +5,13 @@
*/
import { ElementFactory } from '../../../types';
-import header from './header.png';
export const lineChart: ElementFactory = () => ({
name: 'lineChart',
- displayName: 'Line chart',
- tags: ['chart'],
+ displayName: 'Line',
+ type: 'chart',
help: 'A customizable line chart',
- image: header,
+ icon: 'visLine',
expression: `filters
| demodata
| pointseries x="time" y="mean(price)"
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/markdown/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/markdown/header.png
deleted file mode 100644
index a8b8550f5baea..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/markdown/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/markdown/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/markdown/index.ts
index 1c7013834cbe4..7b114daa11870 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/markdown/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/markdown/index.ts
@@ -4,15 +4,13 @@
* you may not use this file except in compliance with the Elastic License.
*/
-import header from './header.png';
-
import { ElementFactory } from '../../../types';
export const markdown: ElementFactory = () => ({
name: 'markdown',
- displayName: 'Markdown',
- tags: ['text'],
- help: 'Markup from Markdown',
- image: header,
+ displayName: 'Text',
+ type: 'text',
+ help: 'Add text using Markdown',
+ icon: 'visText',
expression: `filters
| demodata
| markdown "### Welcome to the Markdown element
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/metric/header.png b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/metric/header.png
deleted file mode 100644
index 0510342cdc54a..0000000000000
Binary files a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/metric/header.png and /dev/null differ
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/metric/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/metric/index.ts
index 7e9aca9c01782..7256657903aab 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/metric/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/elements/metric/index.ts
@@ -5,8 +5,6 @@
*/
import { openSans } from '../../../common/lib/fonts';
-import header from './header.png';
-
import { ElementFactory } from '../../../types';
import { SetupInitializer } from '../../plugin';
@@ -14,11 +12,11 @@ export const metricElementInitializer: SetupInitializer ({
- name: strings.chart(),
- color: euiVisPalette[4],
-});
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/filter.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/filter.ts
deleted file mode 100644
index 5249856dec271..0000000000000
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/filter.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-
-import { euiPaletteColorBlind } from '@elastic/eui';
-import { TagFactory } from '../../../public/lib/tag';
-import { TagStrings as strings } from '../../../i18n';
-
-const euiVisPalette = euiPaletteColorBlind();
-
-export const filter: TagFactory = () => ({
- name: strings.filter(),
- color: euiVisPalette[1],
-});
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/graphic.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/graphic.ts
deleted file mode 100644
index 36d66801ef681..0000000000000
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/graphic.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-
-import { euiPaletteColorBlind } from '@elastic/eui';
-import { TagFactory } from '../../../public/lib/tag';
-import { TagStrings as strings } from '../../../i18n';
-const euiVisPalette = euiPaletteColorBlind();
-
-export const graphic: TagFactory = () => ({
- name: strings.graphic(),
- color: euiVisPalette[5],
-});
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/index.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/index.ts
index 2587665a452b5..2e711437c72a8 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/index.ts
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/index.ts
@@ -4,13 +4,8 @@
* you may not use this file except in compliance with the Elastic License.
*/
-import { chart } from './chart';
-import { filter } from './filter';
-import { graphic } from './graphic';
import { presentation } from './presentation';
-import { proportion } from './proportion';
import { report } from './report';
-import { text } from './text';
// Registry expects a function that returns a spec object
-export const tagSpecs = [chart, filter, graphic, presentation, proportion, report, text];
+export const tagSpecs = [presentation, report];
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/proportion.ts b/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/proportion.ts
deleted file mode 100644
index 4d37ecfaa367a..0000000000000
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/tags/proportion.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-
-import { euiPaletteColorBlind } from '@elastic/eui';
-import { TagFactory } from '../../../public/lib/tag';
-import { TagStrings as strings } from '../../../i18n';
-const euiVisPalette = euiPaletteColorBlind();
-
-export const proportion: TagFactory = () => ({
- name: strings.proportion(),
- color: euiVisPalette[3],
-});
diff --git a/x-pack/legacy/plugins/canvas/common/lib/constants.ts b/x-pack/legacy/plugins/canvas/common/lib/constants.ts
index ac8e80b8d7b89..a37dc3fd6a7b3 100644
--- a/x-pack/legacy/plugins/canvas/common/lib/constants.ts
+++ b/x-pack/legacy/plugins/canvas/common/lib/constants.ts
@@ -40,3 +40,4 @@ export const API_ROUTE_SHAREABLE_ZIP = '/public/canvas/zip';
export const API_ROUTE_SHAREABLE_RUNTIME = '/public/canvas/runtime';
export const API_ROUTE_SHAREABLE_RUNTIME_DOWNLOAD = `/public/canvas/${SHAREABLE_RUNTIME_NAME}.js`;
export const CANVAS_EMBEDDABLE_CLASSNAME = `canvasEmbeddable`;
+export const CONTEXT_MENU_TOP_BORDER_CLASSNAME = 'canvasContextMenu--topBorder';
diff --git a/x-pack/legacy/plugins/canvas/i18n/components.ts b/x-pack/legacy/plugins/canvas/i18n/components.ts
index d0a9051d7af87..7bd16c4933ce1 100644
--- a/x-pack/legacy/plugins/canvas/i18n/components.ts
+++ b/x-pack/legacy/plugins/canvas/i18n/components.ts
@@ -15,7 +15,7 @@ export const ComponentStrings = {
}),
getTitleText: () =>
i18n.translate('xpack.canvas.embedObject.titleText', {
- defaultMessage: 'Embed Object',
+ defaultMessage: 'Add from Visualize library',
}),
},
AdvancedFilter: {
@@ -305,21 +305,21 @@ export const ComponentStrings = {
}),
},
ElementControls: {
- getEditTooltip: () =>
- i18n.translate('xpack.canvas.elementControls.editToolTip', {
- defaultMessage: 'Edit',
- }),
- getEditAriaLabel: () =>
- i18n.translate('xpack.canvas.elementControls.editAriaLabel', {
- defaultMessage: 'Edit element',
+ getDeleteAriaLabel: () =>
+ i18n.translate('xpack.canvas.elementControls.deleteAriaLabel', {
+ defaultMessage: 'Delete element',
}),
getDeleteTooltip: () =>
i18n.translate('xpack.canvas.elementControls.deleteToolTip', {
defaultMessage: 'Delete',
}),
- getDeleteAriaLabel: () =>
- i18n.translate('xpack.canvas.elementControls.deleteAriaLabel', {
- defaultMessage: 'Delete element',
+ getEditAriaLabel: () =>
+ i18n.translate('xpack.canvas.elementControls.editAriaLabel', {
+ defaultMessage: 'Edit element',
+ }),
+ getEditTooltip: () =>
+ i18n.translate('xpack.canvas.elementControls.editToolTip', {
+ defaultMessage: 'Edit',
}),
},
ElementSettings: {
@@ -336,53 +336,6 @@ export const ComponentStrings = {
description: 'This tab contains the settings for how data is displayed in a Canvas element',
}),
},
- ElementTypes: {
- getEditElementTitle: () =>
- i18n.translate('xpack.canvas.elementTypes.editElementTitle', {
- defaultMessage: 'Edit element',
- }),
- getDeleteElementTitle: (elementName: string) =>
- i18n.translate('xpack.canvas.elementTypes.deleteElementTitle', {
- defaultMessage: `Delete element '{elementName}'?`,
- values: {
- elementName,
- },
- }),
- getDeleteElementDescription: () =>
- i18n.translate('xpack.canvas.elementTypes.deleteElementDescription', {
- defaultMessage: 'Are you sure you want to delete this element?',
- }),
- getCancelButtonLabel: () =>
- i18n.translate('xpack.canvas.elementTypes.cancelButtonLabel', {
- defaultMessage: 'Cancel',
- }),
- getDeleteButtonLabel: () =>
- i18n.translate('xpack.canvas.elementTypes.deleteButtonLabel', {
- defaultMessage: 'Delete',
- }),
- getAddNewElementTitle: () =>
- i18n.translate('xpack.canvas.elementTypes.addNewElementTitle', {
- defaultMessage: 'Add new elements',
- }),
- getAddNewElementDescription: () =>
- i18n.translate('xpack.canvas.elementTypes.addNewElementDescription', {
- defaultMessage: 'Group and save workpad elements to create new elements',
- }),
- getFindElementPlaceholder: () =>
- i18n.translate('xpack.canvas.elementTypes.findElementPlaceholder', {
- defaultMessage: 'Find element',
- }),
- getElementsTitle: () =>
- i18n.translate('xpack.canvas.elementTypes.elementsTitle', {
- defaultMessage: 'Elements',
- description: 'Title for the "Elements" tab when adding a new element',
- }),
- getMyElementsTitle: () =>
- i18n.translate('xpack.canvas.elementTypes.myElementsTitle', {
- defaultMessage: 'My elements',
- description: 'Title for the "My elements" tab when adding a new element',
- }),
- },
Error: {
getDescription: () =>
i18n.translate('xpack.canvas.errorComponent.description', {
@@ -633,6 +586,61 @@ export const ComponentStrings = {
defaultMessage: 'Delete',
}),
},
+ SavedElementsModal: {
+ getAddNewElementDescription: () =>
+ i18n.translate('xpack.canvas.savedElementsModal.addNewElementDescription', {
+ defaultMessage: 'Group and save workpad elements to create new elements',
+ }),
+ getAddNewElementTitle: () =>
+ i18n.translate('xpack.canvas.savedElementsModal.addNewElementTitle', {
+ defaultMessage: 'Add new elements',
+ }),
+ getCancelButtonLabel: () =>
+ i18n.translate('xpack.canvas.savedElementsModal.cancelButtonLabel', {
+ defaultMessage: 'Cancel',
+ }),
+ getDeleteButtonLabel: () =>
+ i18n.translate('xpack.canvas.savedElementsModal.deleteButtonLabel', {
+ defaultMessage: 'Delete',
+ }),
+ getDeleteElementDescription: () =>
+ i18n.translate('xpack.canvas.savedElementsModal.deleteElementDescription', {
+ defaultMessage: 'Are you sure you want to delete this element?',
+ }),
+ getDeleteElementTitle: (elementName: string) =>
+ i18n.translate('xpack.canvas.savedElementsModal.deleteElementTitle', {
+ defaultMessage: `Delete element '{elementName}'?`,
+ values: {
+ elementName,
+ },
+ }),
+ getEditElementTitle: () =>
+ i18n.translate('xpack.canvas.savedElementsModal.editElementTitle', {
+ defaultMessage: 'Edit element',
+ }),
+ getElementsTitle: () =>
+ i18n.translate('xpack.canvas.savedElementsModal.elementsTitle', {
+ defaultMessage: 'Elements',
+ description: 'Title for the "Elements" tab when adding a new element',
+ }),
+ getFindElementPlaceholder: () =>
+ i18n.translate('xpack.canvas.savedElementsModal.findElementPlaceholder', {
+ defaultMessage: 'Find element',
+ }),
+ getModalTitle: () =>
+ i18n.translate('xpack.canvas.savedElementsModal.modalTitle', {
+ defaultMessage: 'My elements',
+ }),
+ getMyElementsTitle: () =>
+ i18n.translate('xpack.canvas.savedElementsModal.myElementsTitle', {
+ defaultMessage: 'My elements',
+ description: 'Title for the "My elements" tab when adding a new element',
+ }),
+ getSavedElementsModalCloseButtonLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeader.addElementModalCloseButtonLabel', {
+ defaultMessage: 'Close',
+ }),
+ },
ShareWebsiteFlyout: {
getRuntimeStepTitle: () =>
i18n.translate('xpack.canvas.shareWebsiteFlyout.snippetsStep.downloadRuntimeTitle', {
@@ -652,7 +660,7 @@ export const ComponentStrings = {
defaultMessage: 'Share on a website',
}),
getUnsupportedRendererWarning: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.unsupportedRendererWarning', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.unsupportedRendererWarning', {
defaultMessage:
'This workpad contains render functions that are not supported by the {CANVAS} Shareable Workpad Runtime. These elements will not be rendered:',
values: {
@@ -900,6 +908,10 @@ export const ComponentStrings = {
i18n.translate('xpack.canvas.textStylePicker.alignRightOption', {
defaultMessage: 'Align right',
}),
+ getFontColorLabel: () =>
+ i18n.translate('xpack.canvas.textStylePicker.fontColorLabel', {
+ defaultMessage: 'Font Color',
+ }),
getStyleBoldOption: () =>
i18n.translate('xpack.canvas.textStylePicker.styleBoldOption', {
defaultMessage: 'Bold',
@@ -912,10 +924,6 @@ export const ComponentStrings = {
i18n.translate('xpack.canvas.textStylePicker.styleUnderlineOption', {
defaultMessage: 'Underline',
}),
- getFontColorLabel: () =>
- i18n.translate('xpack.canvas.textStylePicker.fontColorLabel', {
- defaultMessage: 'Font Color',
- }),
},
TimePicker: {
getApplyButtonLabel: () =>
@@ -962,6 +970,10 @@ export const ComponentStrings = {
description:
'"stylesheet" refers to the collection of CSS style rules entered by the user.',
}),
+ getBackgroundColorLabel: () =>
+ i18n.translate('xpack.canvas.workpadConfig.backgroundColorLabel', {
+ defaultMessage: 'Background color',
+ }),
getFlipDimensionAriaLabel: () =>
i18n.translate('xpack.canvas.workpadConfig.swapDimensionsAriaLabel', {
defaultMessage: `Swap the page's width and height`,
@@ -1013,10 +1025,6 @@ export const ComponentStrings = {
defaultMessage: 'US Letter',
description: 'This is referring to the dimensions of U.S. standard letter paper.',
}),
- getBackgroundColorLabel: () =>
- i18n.translate('xpack.canvas.workpadConfig.backgroundColorLabel', {
- defaultMessage: 'Background color',
- }),
},
WorkpadCreate: {
getWorkpadCreateButtonLabel: () =>
@@ -1029,14 +1037,6 @@ export const ComponentStrings = {
i18n.translate('xpack.canvas.workpadHeader.addElementButtonLabel', {
defaultMessage: 'Add element',
}),
- getAddElementModalCloseButtonLabel: () =>
- i18n.translate('xpack.canvas.workpadHeader.addElementModalCloseButtonLabel', {
- defaultMessage: 'Close',
- }),
- getEmbedObjectButtonLabel: () =>
- i18n.translate('xpack.canvas.workpadHeader.embedObjectButtonLabel', {
- defaultMessage: 'Embed object',
- }),
getFullScreenButtonAriaLabel: () =>
i18n.translate('xpack.canvas.workpadHeader.fullscreenButtonAriaLabel', {
defaultMessage: 'View fullscreen',
@@ -1080,9 +1080,9 @@ export const ComponentStrings = {
}),
},
WorkpadHeaderControlSettings: {
- getTooltip: () =>
- i18n.translate('xpack.canvas.workpadHeaderControlSettings.settingsTooltip', {
- defaultMessage: 'Control settings',
+ getButtonLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderControlSettings.buttonLabel', {
+ defaultMessage: 'Options',
}),
},
WorkpadHeaderCustomInterval: {
@@ -1105,6 +1105,56 @@ export const ComponentStrings = {
defaultMessage: 'Set a custom interval',
}),
},
+ WorkpadHeaderElementMenu: {
+ getAssetsMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.manageAssetsMenuItemLabel', {
+ defaultMessage: 'Manage assets',
+ }),
+ getChartMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.chartMenuItemLabel', {
+ defaultMessage: 'Chart',
+ }),
+ getElementMenuButtonLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.elementMenuButtonLabel', {
+ defaultMessage: 'Add element',
+ }),
+ getElementMenuLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.elementMenuLabel', {
+ defaultMessage: 'Add an element',
+ }),
+ getEmbedObjectMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.embedObjectMenuItemLabel', {
+ defaultMessage: 'Add from Visualize library',
+ }),
+ getFilterMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.filterMenuItemLabel', {
+ defaultMessage: 'Filter',
+ }),
+ getImageMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.imageMenuItemLabel', {
+ defaultMessage: 'Image',
+ }),
+ getMyElementsMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.myElementsMenuItemLabel', {
+ defaultMessage: 'My elements',
+ }),
+ getOtherMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.otherMenuItemLabel', {
+ defaultMessage: 'Other',
+ }),
+ getProgressMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.progressMenuItemLabel', {
+ defaultMessage: 'Progress',
+ }),
+ getShapeMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.shapeMenuItemLabel', {
+ defaultMessage: 'Shape',
+ }),
+ getTextMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderElementMenu.textMenuItemLabel', {
+ defaultMessage: 'Text',
+ }),
+ },
WorkpadHeaderKioskControls: {
getCycleFormLabel: () =>
i18n.translate('xpack.canvas.workpadHeaderKioskControl.cycleFormLabel', {
@@ -1129,9 +1179,9 @@ export const ComponentStrings = {
defaultMessage: 'Refresh data',
}),
},
- WorkpadHeaderWorkpadExport: {
+ WorkpadHeaderShareMenu: {
getCopyPDFMessage: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.copyPDFMessage', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.copyPDFMessage', {
defaultMessage: 'The {PDF} generation {URL} was copied to your clipboard.',
values: {
PDF,
@@ -1139,15 +1189,15 @@ export const ComponentStrings = {
},
}),
getCopyReportingConfigMessage: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.copyReportingConfigMessage', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.copyReportingConfigMessage', {
defaultMessage: 'Copied reporting configuration to clipboard',
}),
getCopyShareConfigMessage: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.copyShareConfigMessage', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.copyShareConfigMessage', {
defaultMessage: 'Copied share markup to clipboard',
}),
getExportPDFErrorTitle: (workpadName: string) =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.exportPDFErrorMessage', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.exportPDFErrorMessage', {
defaultMessage: "Failed to create {PDF} for '{workpadName}'",
values: {
PDF,
@@ -1155,14 +1205,14 @@ export const ComponentStrings = {
},
}),
getExportPDFMessage: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.exportPDFMessage', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.exportPDFMessage', {
defaultMessage: 'Exporting {PDF}. You can track the progress in Management.',
values: {
PDF,
},
}),
getExportPDFTitle: (workpadName: string) =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.exportPDFTitle', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.exportPDFTitle', {
defaultMessage: "{PDF} export of workpad '{workpadName}'",
values: {
PDF,
@@ -1170,7 +1220,7 @@ export const ComponentStrings = {
},
}),
getPDFPanelCopyAriaLabel: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.pdfPanelCopyAriaLabel', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.pdfPanelCopyAriaLabel', {
defaultMessage:
'Alternatively, you can generate a {PDF} from a script or with Watcher by using this {URL}. Press Enter to copy the {URL} to clipboard.',
values: {
@@ -1179,7 +1229,7 @@ export const ComponentStrings = {
},
}),
getPDFPanelCopyButtonLabel: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.pdfPanelCopyButtonLabel', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.pdfPanelCopyButtonLabel', {
defaultMessage: 'Copy {POST} {URL}',
values: {
POST,
@@ -1187,7 +1237,7 @@ export const ComponentStrings = {
},
}),
getPDFPanelCopyDescription: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.pdfPanelCopyDescription', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.pdfPanelCopyDescription', {
defaultMessage:
'Alternatively, copy this {POST} {URL} to call generation from outside {KIBANA} or from Watcher.',
values: {
@@ -1197,14 +1247,14 @@ export const ComponentStrings = {
},
}),
getPDFPanelGenerateButtonLabel: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.pdfPanelGenerateButtonLabel', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.pdfPanelGenerateButtonLabel', {
defaultMessage: 'Generate {PDF}',
values: {
PDF,
},
}),
getPDFPanelGenerateDescription: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.pdfPanelGenerateDescription', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.pdfPanelGenerateDescription', {
defaultMessage:
'{PDF}s can take a minute or two to generate based on the size of your workpad.',
values: {
@@ -1212,7 +1262,7 @@ export const ComponentStrings = {
},
}),
getShareableZipErrorTitle: (workpadName: string) =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.shareWebsiteErrorTitle', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.shareWebsiteErrorTitle', {
defaultMessage:
"Failed to create {ZIP} file for '{workpadName}'. The workpad may be too large. You'll need to download the files separately.",
values: {
@@ -1221,69 +1271,101 @@ export const ComponentStrings = {
},
}),
getShareDownloadJSONTitle: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.shareDownloadJSONTitle', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.shareDownloadJSONTitle', {
defaultMessage: 'Download as {JSON}',
values: {
JSON,
},
}),
getShareDownloadPDFTitle: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.shareDownloadPDFTitle', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.shareDownloadPDFTitle', {
defaultMessage: '{PDF} reports',
values: {
PDF,
},
}),
+ getShareMenuButtonLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.shareMenuButtonLabel', {
+ defaultMessage: 'Share',
+ }),
getShareWebsiteTitle: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.shareWebsiteTitle', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.shareWebsiteTitle', {
defaultMessage: 'Share on a website',
}),
getShareWorkpadMessage: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.shareWorkpadMessage', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.shareWorkpadMessage', {
defaultMessage: 'Share this workpad',
}),
getUnknownExportErrorMessage: (type: string) =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadExport.unknownExportErrorMessage', {
+ i18n.translate('xpack.canvas.workpadHeaderShareMenu.unknownExportErrorMessage', {
defaultMessage: 'Unknown export type: {type}',
values: {
type,
},
}),
},
- WorkpadHeaderWorkpadZoom: {
+ WorkpadHeaderViewMenu: {
+ getFullscreenMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.fullscreenMenuLabel', {
+ defaultMessage: 'Enter fullscreen mode',
+ }),
+ getHideEditModeLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.hideEditModeLabel', {
+ defaultMessage: 'Hide editing controls',
+ }),
+ getRefreshMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.refreshMenuItemLabel', {
+ defaultMessage: 'Refresh data',
+ }),
+ getShowEditModeLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.showEditModeLabel', {
+ defaultMessage: 'Show editing controls',
+ }),
+ getViewMenuButtonLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.viewMenuButtonLabel', {
+ defaultMessage: 'View',
+ }),
+ getViewMenuLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.viewMenuLabel', {
+ defaultMessage: 'View options',
+ }),
getZoomControlsAriaLabel: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadZoom.zoomControlsAriaLabel', {
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.zoomControlsAriaLabel', {
defaultMessage: 'Zoom controls',
}),
getZoomControlsTooltip: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadZoom.zoomControlsTooltip', {
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.zoomControlsTooltip', {
defaultMessage: 'Zoom controls',
}),
getZoomFitToWindowText: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadZoom.zoomFitToWindowText', {
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.zoomFitToWindowText', {
defaultMessage: 'Fit to window',
}),
getZoomInText: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadZoom.zoomInText', {
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.zoomInText', {
defaultMessage: 'Zoom in',
}),
+ getZoomMenuItemLabel: () =>
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.zoomMenuItemLabel', {
+ defaultMessage: 'Zoom',
+ }),
getZoomOutText: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadZoom.zoomOutText', {
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.zoomOutText', {
defaultMessage: 'Zoom out',
}),
getZoomPanelTitle: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadZoom.zoomPanelTitle', {
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.zoomPanelTitle', {
defaultMessage: 'Zoom',
}),
getZoomPercentage: (scale: number) =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadZoom.zoomResetText', {
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.zoomResetText', {
defaultMessage: '{scalePercentage}%',
values: {
scalePercentage: scale * 100,
},
}),
getZoomResetText: () =>
- i18n.translate('xpack.canvas.workpadHeaderWorkpadZoom.zoomPrecentageValue', {
+ i18n.translate('xpack.canvas.workpadHeaderViewMenu.zoomPrecentageValue', {
defaultMessage: 'Reset',
}),
},
diff --git a/x-pack/legacy/plugins/canvas/i18n/elements/apply_strings.ts b/x-pack/legacy/plugins/canvas/i18n/elements/apply_strings.ts
index 41f88a3c75f90..4464ed5dbf185 100644
--- a/x-pack/legacy/plugins/canvas/i18n/elements/apply_strings.ts
+++ b/x-pack/legacy/plugins/canvas/i18n/elements/apply_strings.ts
@@ -7,8 +7,6 @@
import { ElementFactory } from '../../types';
import { getElementStrings } from './index';
-import { TagStrings } from '../../i18n';
-
/**
* This function takes a set of Canvas Element specification factories, runs them,
* replaces relevant strings (if available) and returns a new factory. We do this
@@ -34,17 +32,6 @@ export const applyElementStrings = (elements: ElementFactory[]) => {
if (displayName) {
result.displayName = displayName;
}
-
- // Set translated tags
- if (result.tags) {
- result.tags = result.tags.map(tag => {
- if (tag in TagStrings) {
- return TagStrings[tag]();
- }
-
- return tag;
- });
- }
}
return () => result;
diff --git a/x-pack/legacy/plugins/canvas/i18n/elements/element_strings.test.ts b/x-pack/legacy/plugins/canvas/i18n/elements/element_strings.test.ts
index ce908ac6c5566..c28229bdab33f 100644
--- a/x-pack/legacy/plugins/canvas/i18n/elements/element_strings.test.ts
+++ b/x-pack/legacy/plugins/canvas/i18n/elements/element_strings.test.ts
@@ -9,8 +9,6 @@ import { coreMock } from '../../../../../../src/core/public/mocks';
const elementSpecs = initializeElements(coreMock.createSetup() as any, {} as any);
-import { TagStrings } from '../tags';
-
describe('ElementStrings', () => {
const elementStrings = getElementStrings();
const elementNames = elementSpecs.map(spec => spec().name);
@@ -37,15 +35,4 @@ describe('ElementStrings', () => {
expect(value).toHaveProperty('help');
});
});
-
- test('All elements should have tags that are defined', () => {
- const tagNames = Object.keys(TagStrings);
-
- elementSpecs.forEach(spec => {
- const element = spec();
- if (element.tags) {
- element.tags.forEach((tagName: string) => expect(tagNames).toContain(tagName));
- }
- });
- });
});
diff --git a/x-pack/legacy/plugins/canvas/i18n/elements/element_strings.ts b/x-pack/legacy/plugins/canvas/i18n/elements/element_strings.ts
index df23dff1c7127..595ef4cb92206 100644
--- a/x-pack/legacy/plugins/canvas/i18n/elements/element_strings.ts
+++ b/x-pack/legacy/plugins/canvas/i18n/elements/element_strings.ts
@@ -23,7 +23,7 @@ interface ElementStringDict {
export const getElementStrings = (): ElementStringDict => ({
areaChart: {
displayName: i18n.translate('xpack.canvas.elements.areaChartDisplayName', {
- defaultMessage: 'Area chart',
+ defaultMessage: 'Area',
}),
help: i18n.translate('xpack.canvas.elements.areaChartHelpText', {
defaultMessage: 'A line chart with a filled body',
@@ -31,7 +31,7 @@ export const getElementStrings = (): ElementStringDict => ({
},
bubbleChart: {
displayName: i18n.translate('xpack.canvas.elements.bubbleChartDisplayName', {
- defaultMessage: 'Bubble chart',
+ defaultMessage: 'Bubble',
}),
help: i18n.translate('xpack.canvas.elements.bubbleChartHelpText', {
defaultMessage: 'A customizable bubble chart',
@@ -39,31 +39,31 @@ export const getElementStrings = (): ElementStringDict => ({
},
debug: {
displayName: i18n.translate('xpack.canvas.elements.debugDisplayName', {
- defaultMessage: 'Debug',
+ defaultMessage: 'Debug data',
}),
help: i18n.translate('xpack.canvas.elements.debugHelpText', {
defaultMessage: 'Just dumps the configuration of the element',
}),
},
- donut: {
- displayName: i18n.translate('xpack.canvas.elements.donutChartDisplayName', {
- defaultMessage: 'Donut chart',
- }),
- help: i18n.translate('xpack.canvas.elements.donutChartHelpText', {
- defaultMessage: 'A customizable donut chart',
- }),
- },
- dropdown_filter: {
+ dropdownFilter: {
displayName: i18n.translate('xpack.canvas.elements.dropdownFilterDisplayName', {
- defaultMessage: 'Dropdown filter',
+ defaultMessage: 'Dropdown select',
}),
help: i18n.translate('xpack.canvas.elements.dropdownFilterHelpText', {
defaultMessage: 'A dropdown from which you can select values for an "exactly" filter',
}),
},
+ filterDebug: {
+ displayName: i18n.translate('xpack.canvas.elements.filterDebugDisplayName', {
+ defaultMessage: 'Debug filters',
+ }),
+ help: i18n.translate('xpack.canvas.elements.filterDebugHelpText', {
+ defaultMessage: 'Shows the underlying global filters in a workpad',
+ }),
+ },
horizontalBarChart: {
displayName: i18n.translate('xpack.canvas.elements.horizontalBarChartDisplayName', {
- defaultMessage: 'Horizontal bar chart',
+ defaultMessage: 'Horizontal bar',
}),
help: i18n.translate('xpack.canvas.elements.horizontalBarChartHelpText', {
defaultMessage: 'A customizable horizontal bar chart',
@@ -71,7 +71,7 @@ export const getElementStrings = (): ElementStringDict => ({
},
horizontalProgressBar: {
displayName: i18n.translate('xpack.canvas.elements.horizontalProgressBarDisplayName', {
- defaultMessage: 'Horizontal progress bar',
+ defaultMessage: 'Horizontal bar',
}),
help: i18n.translate('xpack.canvas.elements.horizontalProgressBarHelpText', {
defaultMessage: 'Displays progress as a portion of a horizontal bar',
@@ -79,7 +79,7 @@ export const getElementStrings = (): ElementStringDict => ({
},
horizontalProgressPill: {
displayName: i18n.translate('xpack.canvas.elements.horizontalProgressPillDisplayName', {
- defaultMessage: 'Horizontal progress pill',
+ defaultMessage: 'Horizontal pill',
}),
help: i18n.translate('xpack.canvas.elements.horizontalProgressPillHelpText', {
defaultMessage: 'Displays progress as a portion of a horizontal pill',
@@ -95,7 +95,7 @@ export const getElementStrings = (): ElementStringDict => ({
},
lineChart: {
displayName: i18n.translate('xpack.canvas.elements.lineChartDisplayName', {
- defaultMessage: 'Line chart',
+ defaultMessage: 'Line',
}),
help: i18n.translate('xpack.canvas.elements.lineChartHelpText', {
defaultMessage: 'A customizable line chart',
@@ -119,7 +119,7 @@ export const getElementStrings = (): ElementStringDict => ({
},
pie: {
displayName: i18n.translate('xpack.canvas.elements.pieDisplayName', {
- defaultMessage: 'Pie chart',
+ defaultMessage: 'Pie',
}),
help: i18n.translate('xpack.canvas.elements.pieHelpText', {
defaultMessage: 'Pie chart',
@@ -135,7 +135,7 @@ export const getElementStrings = (): ElementStringDict => ({
},
progressGauge: {
displayName: i18n.translate('xpack.canvas.elements.progressGaugeDisplayName', {
- defaultMessage: 'Progress gauge',
+ defaultMessage: 'Gauge',
}),
help: i18n.translate('xpack.canvas.elements.progressGaugeHelpText', {
defaultMessage: 'Displays progress as a portion of a gauge',
@@ -143,7 +143,7 @@ export const getElementStrings = (): ElementStringDict => ({
},
progressSemicircle: {
displayName: i18n.translate('xpack.canvas.elements.progressSemicircleDisplayName', {
- defaultMessage: 'Progress semicircle',
+ defaultMessage: 'Semicircle',
}),
help: i18n.translate('xpack.canvas.elements.progressSemicircleHelpText', {
defaultMessage: 'Displays progress as a portion of a semicircle',
@@ -151,7 +151,7 @@ export const getElementStrings = (): ElementStringDict => ({
},
progressWheel: {
displayName: i18n.translate('xpack.canvas.elements.progressWheelDisplayName', {
- defaultMessage: 'Progress wheel',
+ defaultMessage: 'Wheel',
}),
help: i18n.translate('xpack.canvas.elements.progressWheelHelpText', {
defaultMessage: 'Displays progress as a portion of a wheel',
@@ -189,15 +189,7 @@ export const getElementStrings = (): ElementStringDict => ({
defaultMessage: 'A scrollable grid for displaying data in a tabular format',
}),
},
- tiltedPie: {
- displayName: i18n.translate('xpack.canvas.elements.tiltedPieDisplayName', {
- defaultMessage: 'Tilted pie chart',
- }),
- help: i18n.translate('xpack.canvas.elements.tiltedPieHelpText', {
- defaultMessage: 'A customizable tilted pie chart',
- }),
- },
- time_filter: {
+ timeFilter: {
displayName: i18n.translate('xpack.canvas.elements.timeFilterDisplayName', {
defaultMessage: 'Time filter',
}),
@@ -207,7 +199,7 @@ export const getElementStrings = (): ElementStringDict => ({
},
verticalBarChart: {
displayName: i18n.translate('xpack.canvas.elements.verticalBarChartDisplayName', {
- defaultMessage: 'Vertical bar chart',
+ defaultMessage: 'Vertical bar',
}),
help: i18n.translate('xpack.canvas.elements.verticalBarChartHelpText', {
defaultMessage: 'A customizable vertical bar chart',
@@ -215,7 +207,7 @@ export const getElementStrings = (): ElementStringDict => ({
},
verticalProgressBar: {
displayName: i18n.translate('xpack.canvas.elements.verticalProgressBarDisplayName', {
- defaultMessage: 'Vertical progress bar',
+ defaultMessage: 'Vertical bar',
}),
help: i18n.translate('xpack.canvas.elements.verticalProgressBarHelpText', {
defaultMessage: 'Displays progress as a portion of a vertical bar',
@@ -223,7 +215,7 @@ export const getElementStrings = (): ElementStringDict => ({
},
verticalProgressPill: {
displayName: i18n.translate('xpack.canvas.elements.verticalProgressPillDisplayName', {
- defaultMessage: 'Vertical progress pill',
+ defaultMessage: 'Vertical pill',
}),
help: i18n.translate('xpack.canvas.elements.verticalProgressPillHelpText', {
defaultMessage: 'Displays progress as a portion of a vertical pill',
diff --git a/x-pack/legacy/plugins/canvas/i18n/functions/dict/alter_column.ts b/x-pack/legacy/plugins/canvas/i18n/functions/dict/alter_column.ts
index 836c7395ac448..cc601b0ea0e31 100644
--- a/x-pack/legacy/plugins/canvas/i18n/functions/dict/alter_column.ts
+++ b/x-pack/legacy/plugins/canvas/i18n/functions/dict/alter_column.ts
@@ -8,7 +8,7 @@ import { i18n } from '@kbn/i18n';
import { alterColumn } from '../../../canvas_plugin_src/functions/common/alterColumn';
import { FunctionHelp } from '../function_help';
import { FunctionFactory } from '../../../types';
-import { DATATABLE_COLUMN_TYPES } from '../../../common/lib';
+import { DATATABLE_COLUMN_TYPES } from '../../../common/lib/constants';
export const help: FunctionHelp> = {
help: i18n.translate('xpack.canvas.functions.alterColumnHelpText', {
diff --git a/x-pack/legacy/plugins/canvas/i18n/functions/dict/timelion.ts b/x-pack/legacy/plugins/canvas/i18n/functions/dict/timelion.ts
index e105f7e678af3..41bf86055f1e3 100644
--- a/x-pack/legacy/plugins/canvas/i18n/functions/dict/timelion.ts
+++ b/x-pack/legacy/plugins/canvas/i18n/functions/dict/timelion.ts
@@ -5,12 +5,12 @@
*/
import { i18n } from '@kbn/i18n';
-import { timelion } from '../../../public/functions/timelion';
+import { timelionFunctionFactory } from '../../../public/functions/timelion';
import { FunctionHelp } from '../function_help';
import { FunctionFactory } from '../../../types';
import { ELASTICSEARCH, DATEMATH, MOMENTJS_TIMEZONE_URL } from '../../constants';
-export const help: FunctionHelp> = {
+export const help: FunctionHelp>> = {
help: i18n.translate('xpack.canvas.functions.timelionHelpText', {
defaultMessage: 'Use Timelion to extract one or more timeseries from many sources.',
}),
diff --git a/x-pack/legacy/plugins/canvas/i18n/tags.ts b/x-pack/legacy/plugins/canvas/i18n/tags.ts
index 41007c58d738d..9595554260297 100644
--- a/x-pack/legacy/plugins/canvas/i18n/tags.ts
+++ b/x-pack/legacy/plugins/canvas/i18n/tags.ts
@@ -7,32 +7,12 @@
import { i18n } from '@kbn/i18n';
export const TagStrings: { [key: string]: () => string } = {
- chart: () =>
- i18n.translate('xpack.canvas.tags.chartTag', {
- defaultMessage: 'chart',
- }),
- filter: () =>
- i18n.translate('xpack.canvas.tags.filterTag', {
- defaultMessage: 'filter',
- }),
- graphic: () =>
- i18n.translate('xpack.canvas.tags.graphicTag', {
- defaultMessage: 'graphic',
- }),
presentation: () =>
i18n.translate('xpack.canvas.tags.presentationTag', {
defaultMessage: 'presentation',
}),
- proportion: () =>
- i18n.translate('xpack.canvas.tags.proportionTag', {
- defaultMessage: 'proportion',
- }),
report: () =>
i18n.translate('xpack.canvas.tags.reportTag', {
defaultMessage: 'report',
}),
- text: () =>
- i18n.translate('xpack.canvas.tags.textTag', {
- defaultMessage: 'text',
- }),
};
diff --git a/x-pack/legacy/plugins/canvas/public/application.tsx b/x-pack/legacy/plugins/canvas/public/application.tsx
index f75b3b427c41b..f746a24e9b261 100644
--- a/x-pack/legacy/plugins/canvas/public/application.tsx
+++ b/x-pack/legacy/plugins/canvas/public/application.tsx
@@ -30,8 +30,12 @@ import { VALUE_CLICK_TRIGGER, ActionByType } from '../../../../../src/plugins/ui
/* eslint-disable */
import { ACTION_VALUE_CLICK } from '../../../../../src/plugins/data/public/actions/value_click_action';
/* eslint-enable */
+import { init as initStatsReporter } from './lib/ui_metric';
import { CapabilitiesStrings } from '../i18n';
+
+import { startServices, stopServices, services } from './services';
+
const { ReadOnlyBadge: strings } = CapabilitiesStrings;
let restoreAction: ActionByType | undefined;
@@ -50,8 +54,14 @@ export const renderApp = (
{ element }: AppMountParameters,
canvasStore: Store
) => {
+ const canvasServices = Object.entries(services).reduce((reduction, [key, provider]) => {
+ reduction[key] = provider.getService();
+
+ return reduction;
+ }, {} as Record);
+
ReactDOM.render(
-
+
{
onAssetAdd: PropTypes.func.isRequired,
onAssetCopy: PropTypes.func.isRequired,
onAssetDelete: PropTypes.func.isRequired,
+ onClose: PropTypes.func.isRequired,
};
public static defaultProps = {
@@ -60,12 +54,11 @@ export class AssetManager extends PureComponent {
public state = {
deleteId: null,
isLoading: false,
- isModalVisible: false,
};
public render() {
- const { isModalVisible, isLoading } = this.state;
- const { assetValues, onAssetCopy, onAddImageElement } = this.props;
+ const { isLoading } = this.state;
+ const { assetValues, onAssetCopy, onAddImageElement, onClose } = this.props;
const assetModal = (
{
onAssetCopy={onAssetCopy}
onAssetCreate={(createdAsset: AssetType) => {
onAddImageElement(createdAsset.id);
- this.setState({ isModalVisible: false });
+ onClose();
}}
onAssetDelete={(asset: AssetType) => this.setState({ deleteId: asset.id })}
- onClose={() => this.setState({ isModalVisible: false })}
+ onClose={onClose}
onFileUpload={this.handleFileUpload}
/>
);
@@ -95,14 +88,12 @@ export class AssetManager extends PureComponent {
return (
- {strings.getButtonLabel()}
- {isModalVisible ? assetModal : null}
+ {assetModal}
{confirmModal}
);
}
- private showModal = () => this.setState({ isModalVisible: true });
private resetDelete = () => this.setState({ deleteId: null });
private doDelete = () => {
diff --git a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx
index 3dfbb1b1fde3c..8637db8e9f962 100644
--- a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx
+++ b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx
@@ -98,6 +98,7 @@ export const AssetModal: FunctionComponent = props => {
({
+import { State, ExpressionAstExpression, AssetType } from '../../../types';
+
+const mapStateToProps = (state: State) => ({
assets: getAssets(state),
selectedPage: getSelectedPage(state),
});
-const mapDispatchToProps = dispatch => ({
- onAddImageElement: pageId => assetId => {
+const mapDispatchToProps = (dispatch: (action: any) => void) => ({
+ onAddImageElement: (pageId: string) => (assetId: string) => {
const imageElement = elementsRegistry.get('image');
const elementAST = fromExpression(imageElement.expression);
const selector = ['chain', '0', 'arguments', 'dataurl'];
- const subExp = [
+ const subExp: ExpressionAstExpression[] = [
{
type: 'expression',
chain: [
@@ -44,11 +51,11 @@ const mapDispatchToProps = dispatch => ({
],
},
];
- const newAST = set(elementAST, selector, subExp);
+ const newAST = set(elementAST, selector, subExp);
imageElement.expression = toExpression(newAST);
dispatch(addElement(pageId, imageElement));
},
- onAssetAdd: (type, content) => {
+ onAssetAdd: (type: string, content: string) => {
// make the ID here and pass it into the action
const assetId = getId('asset');
dispatch(createAsset(type, content, assetId));
@@ -56,10 +63,14 @@ const mapDispatchToProps = dispatch => ({
// then return the id, so the caller knows the id that will be created
return assetId;
},
- onAssetDelete: assetId => dispatch(removeAsset(assetId)),
+ onAssetDelete: (assetId: string) => dispatch(removeAsset(assetId)),
});
-const mergeProps = (stateProps, dispatchProps, ownProps) => {
+const mergeProps = (
+ stateProps: ReturnType,
+ dispatchProps: ReturnType,
+ ownProps: AssetManagerProps
+) => {
const { assets, selectedPage } = stateProps;
const { onAssetAdd } = dispatchProps;
const assetValues = Object.values(assets); // pull values out of assets object
@@ -70,16 +81,16 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
onAddImageElement: dispatchProps.onAddImageElement(stateProps.selectedPage),
selectedPage,
assetValues,
- onAssetAdd: file => {
+ onAssetAdd: (file: File) => {
const [type, subtype] = get(file, 'type', '').split('/');
if (type === 'image' && VALID_IMAGE_TYPES.indexOf(subtype) >= 0) {
return encode(file).then(dataurl => {
- const type = 'dataurl';
- const existingId = findExistingAsset(type, dataurl, assetValues);
+ const dataurlType = 'dataurl';
+ const existingId = findExistingAsset(dataurlType, dataurl, assetValues);
if (existingId) {
return existingId;
}
- return onAssetAdd(type, dataurl);
+ return onAssetAdd(dataurlType, dataurl);
});
}
@@ -88,7 +99,11 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
};
};
-export const AssetManager = compose(
+export const AssetManager = compose(
connect(mapStateToProps, mapDispatchToProps, mergeProps),
- withProps({ onAssetCopy: asset => notify.success(`Copied '${asset.id}' to clipboard`) })
+ withKibana,
+ withProps(({ kibana }: WithKibanaProps) => ({
+ onAssetCopy: (asset: AssetType) =>
+ kibana.services.canvas.notify.success(`Copied '${asset.id}' to clipboard`),
+ }))
)(Component);
diff --git a/x-pack/legacy/plugins/canvas/public/components/element_types/__examples__/__snapshots__/element_grid.stories.storyshot b/x-pack/legacy/plugins/canvas/public/components/element_types/__examples__/__snapshots__/element_grid.stories.storyshot
deleted file mode 100644
index 6572aa582f48c..0000000000000
--- a/x-pack/legacy/plugins/canvas/public/components/element_types/__examples__/__snapshots__/element_grid.stories.storyshot
+++ /dev/null
@@ -1,797 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots components/Elements/ElementGrid with controls 1`] = `
-;
- /**
- * text to filter out cards
- */
- filterText: string;
- /**
- * tags to filter out cards
- */
- filterTags: string[];
- /**
- * indicate whether or not edit/delete controls should be displayed
- */
- showControls: boolean;
- /**
- * handler invoked when clicking a card
- */
- handleClick: (element: ElementSpec | CustomElement) => void;
- /**
- * click handler for the edit button
- */
- onEdit?: (element: ElementSpec | CustomElement) => void;
- /**
- * click handler for the delete button
- */
- onDelete?: (element: ElementSpec | CustomElement) => void;
-}
-
-export const ElementGrid = ({
- elements,
- filterText,
- filterTags,
- handleClick,
- onEdit,
- onDelete,
- showControls,
-}: Props) => {
- filterText = filterText.toLowerCase();
-
- return (
-
- {map(elements, (element: ElementSpec | CustomElement, index) => {
- const { name, displayName = '', help = '', image, tags = [] } = element;
- const whenClicked = () => handleClick(element);
- let textMatch = false;
- let tagsMatch = false;
-
- if (
- !filterText.length ||
- name.toLowerCase().includes(filterText) ||
- displayName.toLowerCase().includes(filterText) ||
- help.toLowerCase().includes(filterText)
- ) {
- textMatch = true;
- }
-
- if (!filterTags.length || filterTags.every(tag => tags.includes(tag))) {
- tagsMatch = true;
- }
-
- if (!textMatch || !tagsMatch) {
- return null;
- }
-
- return (
-
- onEdit(element)} onDelete={() => onDelete(element)} />
- )}
-
- );
- })}
-
- );
-};
-
-ElementGrid.propTypes = {
- elements: PropTypes.array.isRequired,
- handleClick: PropTypes.func.isRequired,
- showControls: PropTypes.bool,
-};
-
-ElementGrid.defaultProps = {
- showControls: false,
- filterTags: [],
- filterText: '',
-};
diff --git a/x-pack/legacy/plugins/canvas/public/components/element_types/element_types.js b/x-pack/legacy/plugins/canvas/public/components/element_types/element_types.js
deleted file mode 100644
index dabf06a24aeb6..0000000000000
--- a/x-pack/legacy/plugins/canvas/public/components/element_types/element_types.js
+++ /dev/null
@@ -1,224 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-
-import React, { Component, Fragment } from 'react';
-import PropTypes from 'prop-types';
-import {
- EuiModalBody,
- EuiTabbedContent,
- EuiEmptyPrompt,
- EuiSearchBar,
- EuiSpacer,
- EuiOverlayMask,
-} from '@elastic/eui';
-import { map, sortBy } from 'lodash';
-import { ConfirmModal } from '../confirm_modal/confirm_modal';
-import { CustomElementModal } from '../custom_element_modal';
-import { getTagsFilter } from '../../lib/get_tags_filter';
-import { extractSearch } from '../../lib/extract_search';
-import { ComponentStrings } from '../../../i18n';
-import { ElementGrid } from './element_grid';
-
-const { ElementTypes: strings } = ComponentStrings;
-
-const tagType = 'badge';
-export class ElementTypes extends Component {
- static propTypes = {
- addCustomElement: PropTypes.func.isRequired,
- addElement: PropTypes.func.isRequired,
- customElements: PropTypes.array.isRequired,
- elements: PropTypes.object,
- filterTags: PropTypes.arrayOf(PropTypes.string).isRequired,
- findCustomElements: PropTypes.func.isRequired,
- onClose: PropTypes.func.isRequired,
- removeCustomElement: PropTypes.func.isRequired,
- search: PropTypes.string,
- setCustomElements: PropTypes.func.isRequired,
- setSearch: PropTypes.func.isRequired,
- setFilterTags: PropTypes.func.isRequired,
- updateCustomElement: PropTypes.func.isRequired,
- };
-
- state = {
- elementToDelete: null,
- elementToEdit: null,
- };
-
- componentDidMount() {
- // fetch custom elements
- this.props.findCustomElements();
- }
-
- _showEditModal = elementToEdit => this.setState({ elementToEdit });
-
- _hideEditModal = () => this.setState({ elementToEdit: null });
-
- _handleEdit = async (name, description, image) => {
- const { updateCustomElement } = this.props;
- const { elementToEdit } = this.state;
- await updateCustomElement(elementToEdit.id, name, description, image);
- this._hideEditModal();
- };
-
- _showDeleteModal = elementToDelete => this.setState({ elementToDelete });
-
- _hideDeleteModal = () => this.setState({ elementToDelete: null });
-
- _handleDelete = async () => {
- const { removeCustomElement } = this.props;
- const { elementToDelete } = this.state;
- await removeCustomElement(elementToDelete.id);
- this._hideDeleteModal();
- };
-
- _renderEditModal = () => {
- const { elementToEdit } = this.state;
-
- if (!elementToEdit) {
- return null;
- }
-
- return (
-
-
- );
- };
-
- _renderDeleteModal = () => {
- const { elementToDelete } = this.state;
-
- if (!elementToDelete) {
- return null;
- }
-
- return (
- {strings.getAddNewElementTitle()}}
- body={
-
- ),
- },
- ];
-
- return (
-
-
-
-
- {this._renderDeleteModal()}
- {this._renderEditModal()}
-
- );
- }
-}
diff --git a/x-pack/legacy/plugins/canvas/public/components/element_types/index.js b/x-pack/legacy/plugins/canvas/public/components/element_types/index.js
deleted file mode 100644
index 8faaf278a07de..0000000000000
--- a/x-pack/legacy/plugins/canvas/public/components/element_types/index.js
+++ /dev/null
@@ -1,103 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-
-import PropTypes from 'prop-types';
-import { compose, withProps, withState } from 'recompose';
-import { connect } from 'react-redux';
-import { camelCase } from 'lodash';
-import { cloneSubgraphs } from '../../lib/clone_subgraphs';
-import * as customElementService from '../../lib/custom_element_service';
-import { elementsRegistry } from '../../lib/elements_registry';
-import { notify } from '../../lib/notify';
-import { selectToplevelNodes } from '../../state/actions/transient';
-import { insertNodes, addElement } from '../../state/actions/elements';
-import { getSelectedPage } from '../../state/selectors/workpad';
-import { trackCanvasUiMetric, METRIC_TYPE } from '../../lib/ui_metric';
-import { ElementTypes as Component } from './element_types';
-
-const customElementAdded = 'elements-custom-added';
-
-const mapStateToProps = state => ({ pageId: getSelectedPage(state) });
-
-const mapDispatchToProps = dispatch => ({
- selectToplevelNodes: nodes =>
- dispatch(selectToplevelNodes(nodes.filter(e => !e.position.parent).map(e => e.id))),
- insertNodes: (selectedNodes, pageId) => dispatch(insertNodes(selectedNodes, pageId)),
- addElement: (pageId, partialElement) => dispatch(addElement(pageId, partialElement)),
-});
-
-const mergeProps = (stateProps, dispatchProps, ownProps) => {
- const { pageId, ...remainingStateProps } = stateProps;
- const { addElement, insertNodes, selectToplevelNodes } = dispatchProps;
- const { search, setCustomElements, onClose } = ownProps;
-
- return {
- ...remainingStateProps,
- ...ownProps,
- // add built-in element to the page
- addElement: element => {
- addElement(pageId, element);
- onClose();
- },
- // add custom element to the page
- addCustomElement: customElement => {
- const { selectedNodes = [] } = JSON.parse(customElement.content) || {};
- const clonedNodes = selectedNodes && cloneSubgraphs(selectedNodes);
- if (clonedNodes) {
- insertNodes(clonedNodes, pageId); // first clone and persist the new node(s)
- selectToplevelNodes(clonedNodes); // then select the cloned node(s)
- }
- onClose();
- trackCanvasUiMetric(METRIC_TYPE.LOADED, customElementAdded);
- },
- // custom element search
- findCustomElements: async text => {
- try {
- const { customElements } = await customElementService.find(text);
- setCustomElements(customElements);
- } catch (err) {
- notify.error(err, { title: `Couldn't find custom elements` });
- }
- },
- // remove custom element
- removeCustomElement: async id => {
- try {
- await customElementService.remove(id).then();
- const { customElements } = await customElementService.find(search);
- setCustomElements(customElements);
- } catch (err) {
- notify.error(err, { title: `Couldn't delete custom elements` });
- }
- },
- // update custom element
- updateCustomElement: async (id, name, description, image) => {
- try {
- await customElementService.update(id, {
- name: camelCase(name),
- displayName: name,
- image,
- help: description,
- });
- const { customElements } = await customElementService.find(search);
- setCustomElements(customElements);
- } catch (err) {
- notify.error(err, { title: `Couldn't update custom elements` });
- }
- },
- };
-};
-
-export const ElementTypes = compose(
- withState('search', 'setSearch', ''),
- withState('customElements', 'setCustomElements', []),
- withState('filterTags', 'setFilterTags', []),
- withProps(() => ({ elements: elementsRegistry.toJS() })),
- connect(mapStateToProps, mapDispatchToProps, mergeProps)
-)(Component);
-
-ElementTypes.propTypes = {
- onClose: PropTypes.func,
-};
diff --git a/x-pack/legacy/plugins/canvas/public/components/popover/index.ts b/x-pack/legacy/plugins/canvas/public/components/popover/index.ts
index f560da14079b5..63626f08fa43b 100644
--- a/x-pack/legacy/plugins/canvas/public/components/popover/index.ts
+++ b/x-pack/legacy/plugins/canvas/public/components/popover/index.ts
@@ -4,4 +4,4 @@
* you may not use this file except in compliance with the Elastic License.
*/
-export { Popover } from './popover';
+export { Popover, ClosePopoverFn } from './popover';
diff --git a/x-pack/legacy/plugins/canvas/public/components/popover/popover.tsx b/x-pack/legacy/plugins/canvas/public/components/popover/popover.tsx
index 25b2e6587c869..9f3d86576e6a7 100644
--- a/x-pack/legacy/plugins/canvas/public/components/popover/popover.tsx
+++ b/x-pack/legacy/plugins/canvas/public/components/popover/popover.tsx
@@ -24,6 +24,8 @@ interface Props {
className?: string;
}
+export type ClosePopoverFn = () => void;
+
interface State {
isPopoverOpen: boolean;
}
@@ -61,7 +63,7 @@ export class Popover extends Component {
}));
};
- closePopover = () => {
+ closePopover: ClosePopoverFn = () => {
this.setState({
isPopoverOpen: false,
});
diff --git a/x-pack/legacy/plugins/canvas/public/components/render_with_fn/index.js b/x-pack/legacy/plugins/canvas/public/components/render_with_fn/index.js
index 68c3ba79dd488..cc234d2287c0c 100644
--- a/x-pack/legacy/plugins/canvas/public/components/render_with_fn/index.js
+++ b/x-pack/legacy/plugins/canvas/public/components/render_with_fn/index.js
@@ -7,7 +7,7 @@
import { compose, withProps, withPropsOnChange } from 'recompose';
import PropTypes from 'prop-types';
import isEqual from 'react-fast-compare';
-import { notify } from '../../lib/notify';
+import { withKibana } from '../../../../../../../src/plugins/kibana_react/public';
import { RenderWithFn as Component } from './render_with_fn';
import { ElementHandlers } from './lib/handlers';
@@ -19,9 +19,10 @@ export const RenderWithFn = compose(
handlers: Object.assign(new ElementHandlers(), handlers),
})
),
- withProps({
- onError: notify.error,
- })
+ withKibana,
+ withProps(props => ({
+ onError: props.kibana.services.canvas.notify.error,
+ }))
)(Component);
RenderWithFn.propTypes = {
diff --git a/x-pack/legacy/plugins/canvas/public/components/element_types/__examples__/__snapshots__/element_controls.stories.storyshot b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/__examples__/__snapshots__/element_controls.stories.storyshot
similarity index 88%
rename from x-pack/legacy/plugins/canvas/public/components/element_types/__examples__/__snapshots__/element_controls.stories.storyshot
rename to x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/__examples__/__snapshots__/element_controls.stories.storyshot
index 5ce6fe8c85589..6f12f68356467 100644
--- a/x-pack/legacy/plugins/canvas/public/components/element_types/__examples__/__snapshots__/element_controls.stories.storyshot
+++ b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/__examples__/__snapshots__/element_controls.stories.storyshot
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`Storyshots components/Elements/ElementControls has two buttons 1`] = `
+exports[`Storyshots components/SavedElementsModal/ElementControls has two buttons 1`] = `
+
,
+ ,
+]
+`;
+
+exports[`Storyshots components/Assets/AssetManager two assets 1`] = `
+Array [
+ ,
+ ,
+
+
+
+
+
+
+
+
+ Manage workpad assets
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Select or drag and drop images
+
+
+
+
+
+
+
+
+
+
+ + Below are the image assets in this workpad. Any assets that are currently in use cannot be determined at this time. To reclaim space, delete assets. +
+
+
+
+
+
+
+
+ + Import your assets to get started +
+ + +
+
+
+
+
+
+
+
+
+
+
+ 0% space used
+
+
+
,
+ ,
+]
+`;
diff --git a/x-pack/legacy/plugins/canvas/public/components/asset_manager/__examples__/asset_manager.examples.tsx b/x-pack/legacy/plugins/canvas/public/components/asset_manager/__examples__/asset_manager.stories.tsx
similarity index 97%
rename from x-pack/legacy/plugins/canvas/public/components/asset_manager/__examples__/asset_manager.examples.tsx
rename to x-pack/legacy/plugins/canvas/public/components/asset_manager/__examples__/asset_manager.stories.tsx
index 045a3b4f64a44..cb42823ccab7b 100644
--- a/x-pack/legacy/plugins/canvas/public/components/asset_manager/__examples__/asset_manager.examples.tsx
+++ b/x-pack/legacy/plugins/canvas/public/components/asset_manager/__examples__/asset_manager.stories.tsx
@@ -28,12 +28,12 @@ const MARKER: AssetType = {
storiesOf('components/Assets/AssetManager', module)
.add('no assets', () => (
- // @ts-ignore @types/react has not been updated to support defaultProps yet.
+
+
+
+
+
+
+
+ Manage workpad assets
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Select or drag and drop images
+
+
+
+
+
+
+
+
+
+
+ + Below are the image assets in this workpad. Any assets that are currently in use cannot be determined at this time. To reclaim space, delete assets. +
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+ airplane
+
+
+
+
+ (
+ 1
+ kb)
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+ marker
+
+
+
+
+ (
+ 1
+ kb)
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 0% space used
+
+
-
-`;
-
-exports[`Storyshots components/Elements/ElementGrid with controls and filter 1`] = `
-
-
-
-
-
-
-
- 
-
-
-
-
-
-
-
-
-
-
- - sample description -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- - Aenean eu justo auctor, placerat felis non, scelerisque dolor. -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce lobortis aliquet arcu ut turpis duis. -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-`;
-
-exports[`Storyshots components/Elements/ElementGrid with tags filter 1`] = `
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce lobortis aliquet arcu ut turpis duis. -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-`;
-
-exports[`Storyshots components/Elements/ElementGrid with text filter 1`] = `
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- - A static image -
-
-
-
-
- graphic
-
-
-
-
-
-
-`;
-
-exports[`Storyshots components/Elements/ElementGrid without controls 1`] = `
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- - A scrollable grid for displaying data in a tabular format -
-
-
-
-
- text
-
-
-
-
-
-
-`;
diff --git a/x-pack/legacy/plugins/canvas/public/components/element_types/element_grid.tsx b/x-pack/legacy/plugins/canvas/public/components/element_types/element_grid.tsx
deleted file mode 100644
index 852b987fcfd24..0000000000000
--- a/x-pack/legacy/plugins/canvas/public/components/element_types/element_grid.tsx
+++ /dev/null
@@ -1,110 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-import React from 'react';
-import PropTypes from 'prop-types';
-import { map } from 'lodash';
-import { EuiFlexItem, EuiFlexGrid } from '@elastic/eui';
-import { ElementControls } from './element_controls';
-import { CustomElement, ElementSpec } from '../../../types';
-import { ElementCard } from '../element_card';
-
-export interface Props {
- /**
- * list of elements to generate cards for
- */
- elements: Array
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- - A line chart with a filled body -
-
-
-
-
- chart
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- - A static image -
-
-
-
-
- graphic
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- - A scrollable grid for displaying data in a tabular format -
-
-
-
-
- text
-
-
-
-
- {strings.getAddNewElementDescription()}
} - titleSize="s" - /> - ); - - if (customElements.length) { - customElements = this._sortElements(customElements); - customElementContent = ( -
-
- ),
- },
- {
- id: 'customElements',
- name: strings.getMyElementsTitle(),
- content: (
-
+
+`;
+
+exports[`Storyshots components/SavedElementsModal/ElementGrid with text filter 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + sample description +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + Aenean eu justo auctor, placerat felis non, scelerisque dolor. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce lobortis aliquet arcu ut turpis duis. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
diff --git a/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/__examples__/__snapshots__/saved_elements_modal.stories.storyshot b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/__examples__/__snapshots__/saved_elements_modal.stories.storyshot
new file mode 100644
index 0000000000000..c73309ad8b14c
--- /dev/null
+++ b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/__examples__/__snapshots__/saved_elements_modal.stories.storyshot
@@ -0,0 +1,933 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Storyshots components/SavedElementsModal no custom elements 1`] = `
+Array [
+ ,
+ ,
+
+
,
+ ,
+]
+`;
+
+exports[`Storyshots components/SavedElementsModal with custom elements 1`] = `
+Array [
+ ,
+ ,
+
+
+
+
+
+
+
+
+ My elements
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + Add new elements +
+ +
+
+
+ + Group and save workpad elements to create new elements +
+
+
+
+
+
,
+ ,
+]
+`;
+
+exports[`Storyshots components/SavedElementsModal with text filter 1`] = `
+Array [
+ ,
+ ,
+
+
+
+
+
+
+
+
+ My elements
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + sample description +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + Aenean eu justo auctor, placerat felis non, scelerisque dolor. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce lobortis aliquet arcu ut turpis duis. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
,
+ ,
+]
+`;
diff --git a/x-pack/legacy/plugins/canvas/public/components/element_types/__examples__/element_controls.stories.tsx b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/__examples__/element_controls.stories.tsx
similarity index 90%
rename from x-pack/legacy/plugins/canvas/public/components/element_types/__examples__/element_controls.stories.tsx
rename to x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/__examples__/element_controls.stories.tsx
index 52736ac952e53..5210210ebaa74 100644
--- a/x-pack/legacy/plugins/canvas/public/components/element_types/__examples__/element_controls.stories.tsx
+++ b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/__examples__/element_controls.stories.tsx
@@ -9,7 +9,7 @@ import { storiesOf } from '@storybook/react';
import { action } from '@storybook/addon-actions';
import { ElementControls } from '../element_controls';
-storiesOf('components/Elements/ElementControls', module)
+storiesOf('components/SavedElementsModal/ElementControls', module)
.addDecorator(story => (
+
+
+
+
+
+
+
+ My elements
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + Aenean eu justo auctor, placerat felis non, scelerisque dolor. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ (
))
- .add('without controls', () => (
- = ({ onDelete, onEdit })
>
-
@@ -40,6 +45,7 @@ export const ElementControls: FunctionComponent = ({ onDelete, onEdit })
iconType="trash"
aria-label={strings.getDeleteAriaLabel()}
onClick={onDelete}
+ data-test-subj="canvasElementCard__deleteButton"
/>
diff --git a/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/element_grid.tsx b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/element_grid.tsx
new file mode 100644
index 0000000000000..f86e2c0147035
--- /dev/null
+++ b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/element_grid.tsx
@@ -0,0 +1,81 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+import React from 'react';
+import PropTypes from 'prop-types';
+import { map } from 'lodash';
+import { EuiFlexItem, EuiFlexGrid } from '@elastic/eui';
+import { ElementControls } from './element_controls';
+import { CustomElement } from '../../../types';
+import { ElementCard } from '../element_card';
+
+export interface Props {
+ /**
+ * list of elements to generate cards for
+ */
+ elements: CustomElement[];
+ /**
+ * text to filter out cards
+ */
+ filterText: string;
+ /**
+ * handler invoked when clicking a card
+ */
+ onClick: (element: CustomElement) => void;
+ /**
+ * click handler for the edit button
+ */
+ onEdit: (element: CustomElement) => void;
+ /**
+ * click handler for the delete button
+ */
+ onDelete: (element: CustomElement) => void;
+}
+
+export const ElementGrid = ({ elements, filterText, onClick, onEdit, onDelete }: Props) => {
+ filterText = filterText.toLowerCase();
+
+ return (
+
+ {map(elements, (element: CustomElement, index) => {
+ const { name, displayName = '', help = '', image } = element;
+ const whenClicked = () => onClick(element);
+
+ if (
+ filterText.length &&
+ !name.toLowerCase().includes(filterText) &&
+ !displayName.toLowerCase().includes(filterText) &&
+ !help.toLowerCase().includes(filterText)
+ ) {
+ return null;
+ }
+
+ return (
+
+ onEdit(element)} onDelete={() => onDelete(element)} />
+
+ );
+ })}
+
+ );
+};
+
+ElementGrid.propTypes = {
+ elements: PropTypes.array.isRequired,
+ filterText: PropTypes.string.isRequired,
+ onClick: PropTypes.func.isRequired,
+ onEdit: PropTypes.func.isRequired,
+ onDelete: PropTypes.func.isRequired,
+};
+
+ElementGrid.defaultProps = {
+ filterText: '',
+};
diff --git a/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/index.ts b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/index.ts
new file mode 100644
index 0000000000000..60d1d7462daa9
--- /dev/null
+++ b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/index.ts
@@ -0,0 +1,135 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { connect } from 'react-redux';
+import { Dispatch } from 'redux';
+import { compose, withState } from 'recompose';
+import { camelCase } from 'lodash';
+// @ts-ignore Untyped local
+import { cloneSubgraphs } from '../../lib/clone_subgraphs';
+import * as customElementService from '../../lib/custom_element_service';
+import { withKibana } from '../../../../../../../src/plugins/kibana_react/public';
+import { WithKibanaProps } from '../../';
+// @ts-ignore Untyped local
+import { selectToplevelNodes } from '../../state/actions/transient';
+// @ts-ignore Untyped local
+import { insertNodes } from '../../state/actions/elements';
+import { getSelectedPage } from '../../state/selectors/workpad';
+import { trackCanvasUiMetric, METRIC_TYPE } from '../../lib/ui_metric';
+import { SavedElementsModal as Component, Props as ComponentProps } from './saved_elements_modal';
+import { State, PositionedElement, CustomElement } from '../../../types';
+
+const customElementAdded = 'elements-custom-added';
+
+interface OwnProps {
+ onClose: () => void;
+}
+
+interface OwnPropsWithState extends OwnProps {
+ customElements: CustomElement[];
+ setCustomElements: (customElements: CustomElement[]) => void;
+ search: string;
+ setSearch: (search: string) => void;
+}
+
+interface DispatchProps {
+ selectToplevelNodes: (nodes: PositionedElement[]) => void;
+ insertNodes: (selectedNodes: PositionedElement[], pageId: string) => void;
+}
+
+interface StateProps {
+ pageId: string;
+}
+
+const mapStateToProps = (state: State): StateProps => ({
+ pageId: getSelectedPage(state),
+});
+
+const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({
+ selectToplevelNodes: (nodes: PositionedElement[]) =>
+ dispatch(
+ selectToplevelNodes(
+ nodes
+ .filter((e: PositionedElement): boolean => !e.position.parent)
+ .map((e: PositionedElement): string => e.id)
+ )
+ ),
+ insertNodes: (selectedNodes: PositionedElement[], pageId: string) =>
+ dispatch(insertNodes(selectedNodes, pageId)),
+});
+
+const mergeProps = (
+ stateProps: StateProps,
+ dispatchProps: DispatchProps,
+ ownProps: OwnPropsWithState & WithKibanaProps
+): ComponentProps => {
+ const { pageId } = stateProps;
+ const { onClose, search, setCustomElements } = ownProps;
+
+ const findCustomElements = async () => {
+ const { customElements } = await customElementService.find(search);
+ setCustomElements(customElements);
+ };
+
+ return {
+ ...ownProps,
+ // add custom element to the page
+ addCustomElement: (customElement: CustomElement) => {
+ const { selectedNodes = [] } = JSON.parse(customElement.content) || {};
+ const clonedNodes = selectedNodes && cloneSubgraphs(selectedNodes);
+ if (clonedNodes) {
+ dispatchProps.insertNodes(clonedNodes, pageId); // first clone and persist the new node(s)
+ dispatchProps.selectToplevelNodes(clonedNodes); // then select the cloned node(s)
+ }
+ onClose();
+ trackCanvasUiMetric(METRIC_TYPE.LOADED, customElementAdded);
+ },
+ // custom element search
+ findCustomElements: async (text?: string) => {
+ try {
+ await findCustomElements();
+ } catch (err) {
+ ownProps.kibana.services.canvas.notify.error(err, {
+ title: `Couldn't find custom elements`,
+ });
+ }
+ },
+ // remove custom element
+ removeCustomElement: async (id: string) => {
+ try {
+ await customElementService.remove(id);
+ await findCustomElements();
+ } catch (err) {
+ ownProps.kibana.services.canvas.notify.error(err, {
+ title: `Couldn't delete custom elements`,
+ });
+ }
+ },
+ // update custom element
+ updateCustomElement: async (id: string, name: string, description: string, image: string) => {
+ try {
+ await customElementService.update(id, {
+ name: camelCase(name),
+ displayName: name,
+ image,
+ help: description,
+ });
+ await findCustomElements();
+ } catch (err) {
+ ownProps.kibana.services.canvas.notify.error(err, {
+ title: `Couldn't update custom elements`,
+ });
+ }
+ },
+ };
+};
+
+export const SavedElementsModal = compose(
+ withKibana,
+ withState('search', 'setSearch', ''),
+ withState('customElements', 'setCustomElements', []),
+ connect(mapStateToProps, mapDispatchToProps, mergeProps)
+)(Component);
diff --git a/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/saved_elements_modal.tsx b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/saved_elements_modal.tsx
new file mode 100644
index 0000000000000..dba97a15fee5c
--- /dev/null
+++ b/x-pack/legacy/plugins/canvas/public/components/saved_elements_modal/saved_elements_modal.tsx
@@ -0,0 +1,217 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { Fragment, ChangeEvent, FunctionComponent, useState, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import {
+ EuiModal,
+ EuiModalBody,
+ EuiModalFooter,
+ EuiModalHeader,
+ EuiModalHeaderTitle,
+ EuiEmptyPrompt,
+ EuiFieldSearch,
+ EuiSpacer,
+ EuiOverlayMask,
+ EuiButton,
+} from '@elastic/eui';
+import { map, sortBy } from 'lodash';
+import { ComponentStrings } from '../../../i18n';
+import { CustomElement } from '../../../types';
+import { ConfirmModal } from '../confirm_modal/confirm_modal';
+import { CustomElementModal } from '../custom_element_modal';
+import { ElementGrid } from './element_grid';
+
+const { SavedElementsModal: strings } = ComponentStrings;
+
+export interface Props {
+ /**
+ * Adds the custom element to the workpad
+ */
+ addCustomElement: (customElement: CustomElement) => void;
+ /**
+ * Queries ES for custom element saved objects
+ */
+ findCustomElements: () => void;
+ /**
+ * Handler invoked when the modal closes
+ */
+ onClose: () => void;
+ /**
+ * Deletes the custom element
+ */
+ removeCustomElement: (id: string) => void;
+ /**
+ * Saved edits to the custom element
+ */
+ updateCustomElement: (id: string, name: string, description: string, image: string) => void;
+ /**
+ * Array of custom elements to display
+ */
+ customElements: CustomElement[];
+ /**
+ * Text used to filter custom elements list
+ */
+ search: string;
+ /**
+ * Setter for search text
+ */
+ setSearch: (search: string) => void;
+}
+
+export const SavedElementsModal: FunctionComponent = ({
+ search,
+ setSearch,
+ customElements,
+ addCustomElement,
+ findCustomElements,
+ onClose,
+ removeCustomElement,
+ updateCustomElement,
+}) => {
+ const [elementToDelete, setElementToDelete] = useState(null);
+ const [elementToEdit, setElementToEdit] = useState(null);
+
+ useEffect(() => {
+ findCustomElements();
+ });
+
+ const showEditModal = (element: CustomElement) => setElementToEdit(element);
+ const hideEditModal = () => setElementToEdit(null);
+
+ const handleEdit = async (name: string, description: string, image: string) => {
+ if (elementToEdit) {
+ await updateCustomElement(elementToEdit.id, name, description, image);
+ }
+ hideEditModal();
+ };
+
+ const showDeleteModal = (element: CustomElement) => setElementToDelete(element);
+ const hideDeleteModal = () => setElementToDelete(null);
+
+ const handleDelete = async () => {
+ if (elementToDelete) {
+ await removeCustomElement(elementToDelete.id);
+ }
+ hideDeleteModal();
+ };
+
+ const renderEditModal = () => {
+ if (!elementToEdit) {
+ return null;
+ }
+
+ return (
+
+
+ );
+ };
+
+ const renderDeleteModal = () => {
+ if (!elementToDelete) {
+ return null;
+ }
+
+ return (
+ ) => setSearch(e.target.value);
+
+ let customElementContent = (
+ {strings.getAddNewElementTitle()}}
+ body={
+
+
+
+
+ {strings.getModalTitle()}
+
+
+
+
+
+
+
+ {strings.getSavedElementsModalCloseButtonLabel()}
+
+
+
+
+
+ {renderDeleteModal()}
+ {renderEditModal()}
+
+ );
+};
+
+SavedElementsModal.propTypes = {
+ addCustomElement: PropTypes.func.isRequired,
+ findCustomElements: PropTypes.func.isRequired,
+ onClose: PropTypes.func.isRequired,
+ removeCustomElement: PropTypes.func.isRequired,
+ updateCustomElement: PropTypes.func.isRequired,
+};
diff --git a/x-pack/legacy/plugins/canvas/public/components/sidebar_header/__examples__/__snapshots__/sidebar_header.stories.storyshot b/x-pack/legacy/plugins/canvas/public/components/sidebar_header/__examples__/__snapshots__/sidebar_header.stories.storyshot
index d46a509251d35..ac25cbe0b6832 100644
--- a/x-pack/legacy/plugins/canvas/public/components/sidebar_header/__examples__/__snapshots__/sidebar_header.stories.storyshot
+++ b/x-pack/legacy/plugins/canvas/public/components/sidebar_header/__examples__/__snapshots__/sidebar_header.stories.storyshot
@@ -37,6 +37,7 @@ exports[`Storyshots components/Sidebar/SidebarHeader default 1`] = `
{strings.getAddNewElementDescription()}
} + titleSize="s" + /> + ); + + if (customElements.length) { + customElementContent = ( +