(this.resize = el)} className="tvbVisMetric__resize">
-
(this.inner = el)} className="tvbVisMetric__inner" style={styles.inner}>
-
- {primaryLabel}
+
+ {(resizeRef) => (
+
+
(this.resize = el)} className="tvbVisMetric__resize">
(this.inner = el)}
+ className="tvbVisMetric__inner"
+ style={styles.inner}
>
- {/* eslint-disable-next-line react/no-danger */}
-
+
+ {primaryLabel}
+
+ {/* eslint-disable-next-line react/no-danger */}
+
+
+
+ {secondarySnippet}
+ {additionalLabel}
- {secondarySnippet}
- {additionalLabel}
-
+ )}
+
);
}
}
diff --git a/src/plugins/vis_types/timeseries/server/lib/vis_data/request_processors/table/types.ts b/src/plugins/vis_types/timeseries/server/lib/vis_data/request_processors/table/types.ts
index b84aee949471b5..6ab50858fe98b4 100644
--- a/src/plugins/vis_types/timeseries/server/lib/vis_data/request_processors/table/types.ts
+++ b/src/plugins/vis_types/timeseries/server/lib/vis_data/request_processors/table/types.ts
@@ -7,8 +7,8 @@
*/
import type { IUiSettingsClient } from 'kibana/server';
+import { EsQueryConfig } from '@kbn/es-query';
import type { FetchedIndexPattern, Panel } from '../../../../../common/types';
-import type { EsQueryConfig } from '../../../../../../../data/common';
import type { SearchCapabilities } from '../../../search_strategies';
import type { VisTypeTimeseriesVisDataRequest } from '../../../../types';
diff --git a/src/plugins/visualizations/public/embeddable/visualize_embeddable.tsx b/src/plugins/visualizations/public/embeddable/visualize_embeddable.tsx
index b52a3f3a6040e1..9c328a175c10b6 100644
--- a/src/plugins/visualizations/public/embeddable/visualize_embeddable.tsx
+++ b/src/plugins/visualizations/public/embeddable/visualize_embeddable.tsx
@@ -12,14 +12,13 @@ import { i18n } from '@kbn/i18n';
import React from 'react';
import { render } from 'react-dom';
import { EuiLoadingChart } from '@elastic/eui';
-import { Filter } from '@kbn/es-query';
+import { Filter, onlyDisabledFiltersChanged } from '@kbn/es-query';
import { KibanaThemeProvider } from '../../../kibana_react/public';
import { VISUALIZE_EMBEDDABLE_TYPE } from './constants';
import {
IndexPattern,
TimeRange,
Query,
- esFilters,
TimefilterContract,
} from '../../../../plugins/data/public';
import {
@@ -239,7 +238,7 @@ export class VisualizeEmbeddable
}
// Check if filters has changed
- if (!esFilters.onlyDisabledFiltersChanged(this.input.filters, this.filters)) {
+ if (!onlyDisabledFiltersChanged(this.input.filters, this.filters)) {
this.filters = this.input.filters;
dirty = true;
}
diff --git a/src/plugins/visualizations/public/plugin.ts b/src/plugins/visualizations/public/plugin.ts
index 59d7c25c6f41d5..eae4f704b7c3cc 100644
--- a/src/plugins/visualizations/public/plugin.ts
+++ b/src/plugins/visualizations/public/plugin.ts
@@ -57,7 +57,6 @@ import {
import { VisualizeLocatorDefinition } from '../common/locator';
import { showNewVisModal } from './wizard';
import { createVisEditorsRegistry, VisEditorsRegistry } from './vis_editors_registry';
-import { esFilters } from '../../../plugins/data/public';
import { FeatureCatalogueCategory } from '../../home/public';
import type { VisualizeServices } from './visualize_app/types';
@@ -189,7 +188,7 @@ export class VisualizationsPlugin
),
map(({ state }) => ({
...state,
- filters: state.filters?.filter(esFilters.isFilterPinned),
+ filters: data.query.filterManager.getGlobalFilters(),
}))
),
},
diff --git a/src/plugins/visualizations/public/visualize_app/utils/get_visualize_list_item_link.test.ts b/src/plugins/visualizations/public/visualize_app/utils/get_visualize_list_item_link.test.ts
index e138acf2e9e859..7fe571b25f98cb 100644
--- a/src/plugins/visualizations/public/visualize_app/utils/get_visualize_list_item_link.test.ts
+++ b/src/plugins/visualizations/public/visualize_app/utils/get_visualize_list_item_link.test.ts
@@ -9,8 +9,8 @@
import { getVisualizeListItemLink } from './get_visualize_list_item_link';
import { ApplicationStart } from 'kibana/public';
import { createHashHistory } from 'history';
+import { FilterStateStore } from '@kbn/es-query';
import { createKbnUrlStateStorage } from '../../../../kibana_utils/public';
-import { esFilters } from '../../../../data/public';
import { GLOBAL_STATE_STORAGE_KEY } from '../../../common/constants';
jest.mock('../../services', () => {
@@ -104,7 +104,7 @@ describe('listing item link is correct for each app', () => {
},
query: { query: 'q1' },
$state: {
- store: esFilters.FilterStateStore.GLOBAL_STATE,
+ store: FilterStateStore.GLOBAL_STATE,
},
},
];
diff --git a/src/plugins/visualizations/public/visualize_app/utils/use/use_visualize_app_state.tsx b/src/plugins/visualizations/public/visualize_app/utils/use/use_visualize_app_state.tsx
index 661717f99ed888..c6e8f9efdd0358 100644
--- a/src/plugins/visualizations/public/visualize_app/utils/use/use_visualize_app_state.tsx
+++ b/src/plugins/visualizations/public/visualize_app/utils/use/use_visualize_app_state.tsx
@@ -11,6 +11,7 @@ import { cloneDeep, isEqual } from 'lodash';
import { map } from 'rxjs/operators';
import { EventEmitter } from 'events';
import { i18n } from '@kbn/i18n';
+import { FilterStateStore } from '@kbn/es-query';
import {
KibanaThemeProvider,
@@ -18,7 +19,7 @@ import {
toMountPoint,
} from '../../../../../kibana_react/public';
import { migrateLegacyQuery } from '../migrate_legacy_query';
-import { esFilters, connectToQueryState } from '../../../../../data/public';
+import { connectToQueryState } from '../../../../../data/public';
import {
VisualizeServices,
VisualizeAppStateContainer,
@@ -87,7 +88,7 @@ export const useVisualizeAppState = (
),
},
{
- filters: esFilters.FilterStateStore.APP_STATE,
+ filters: FilterStateStore.APP_STATE,
query: true,
}
);
diff --git a/test/api_integration/apis/home/sample_data.ts b/test/api_integration/apis/home/sample_data.ts
index 1a324ef844e2e7..6636a490118b44 100644
--- a/test/api_integration/apis/home/sample_data.ts
+++ b/test/api_integration/apis/home/sample_data.ts
@@ -21,8 +21,7 @@ export default function ({ getService }: FtrProviderContext) {
const FLIGHTS_CANVAS_APPLINK_PATH =
'/app/canvas#/workpad/workpad-a474e74b-aedc-47c3-894a-db77e62c41e0'; // includes default ID of the flights canvas applink path
- // Failing: See https://github.com/elastic/kibana/issues/121051
- describe.skip('sample data apis', () => {
+ describe('sample data apis', () => {
before(async () => {
await esArchiver.emptyKibanaIndex();
});
@@ -63,22 +62,23 @@ export default function ({ getService }: FtrProviderContext) {
});
});
- it('should load elasticsearch index containing sample data with dates relative to current time', async () => {
- const resp = await es.search<{ timestamp: string }>({
- index: 'kibana_sample_data_flights',
- body: {
- sort: [{ timestamp: { order: 'desc' } }],
- },
- });
+ // Failing: See https://github.com/elastic/kibana/issues/121051
+ describe.skip('dates', () => {
+ it('should load elasticsearch index containing sample data with dates relative to current time', async () => {
+ const resp = await es.search<{ timestamp: string }>({
+ index: 'kibana_sample_data_flights',
+ body: {
+ sort: [{ timestamp: { order: 'desc' } }],
+ },
+ });
- const doc = resp.hits.hits[0];
- const docMilliseconds = Date.parse(doc._source!.timestamp);
- const nowMilliseconds = Date.now();
- const delta = Math.abs(nowMilliseconds - docMilliseconds);
- expect(delta).to.be.lessThan(MILLISECOND_IN_WEEK * 5);
- });
+ const doc = resp.hits.hits[0];
+ const docMilliseconds = Date.parse(doc._source!.timestamp);
+ const nowMilliseconds = Date.now();
+ const delta = Math.abs(nowMilliseconds - docMilliseconds);
+ expect(delta).to.be.lessThan(MILLISECOND_IN_WEEK * 5);
+ });
- describe('parameters', () => {
it('should load elasticsearch index containing sample data with dates relative to now parameter', async () => {
const nowString = `2000-01-01T00:00:00`;
await supertest.post(`${apiPath}/flights?now=${nowString}`).set('kbn-xsrf', 'kibana');
diff --git a/test/functional/apps/discover/_context_encoded_url_param.ts b/test/functional/apps/discover/_context_encoded_url_param.ts
new file mode 100644
index 00000000000000..83ac63afd915fd
--- /dev/null
+++ b/test/functional/apps/discover/_context_encoded_url_param.ts
@@ -0,0 +1,55 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import expect from '@kbn/expect';
+import { FtrProviderContext } from '../../ftr_provider_context';
+
+export default function ({ getService, getPageObjects }: FtrProviderContext) {
+ const dataGrid = getService('dataGrid');
+ const kibanaServer = getService('kibanaServer');
+ const PageObjects = getPageObjects(['common', 'discover', 'timePicker', 'settings', 'header']);
+ const testSubjects = getService('testSubjects');
+ const es = getService('es');
+
+ describe('context encoded id param', () => {
+ before(async function () {
+ await PageObjects.common.navigateToApp('settings');
+ await es.transport.request({
+ path: '/includes-plus-symbol-doc-id/_doc/1+1=2',
+ method: 'PUT',
+ body: {
+ username: 'Dmitry',
+ '@timestamp': '2015-09-21T09:30:23',
+ },
+ });
+ await PageObjects.settings.createIndexPattern('includes-plus-symbol-doc-id');
+
+ await kibanaServer.uiSettings.update({ 'doc_table:legacy': false });
+ await PageObjects.timePicker.setDefaultAbsoluteRangeViaUiSettings();
+ await PageObjects.common.navigateToApp('discover');
+ });
+
+ it('should navigate to context page correctly', async () => {
+ await PageObjects.discover.selectIndexPattern('includes-plus-symbol-doc-id');
+ await PageObjects.header.waitUntilLoadingHasFinished();
+
+ // navigate to the context view
+ await dataGrid.clickRowToggle({ rowIndex: 0 });
+ const [, surroundingActionEl] = await dataGrid.getRowActions({
+ isAnchorRow: false,
+ rowIndex: 0,
+ });
+ await surroundingActionEl.click();
+ await PageObjects.header.waitUntilLoadingHasFinished();
+
+ const headerElement = await testSubjects.find('contextDocumentSurroundingHeader');
+
+ expect(await headerElement.getVisibleText()).to.be('Documents surrounding #1+1=2');
+ });
+ });
+}
diff --git a/test/functional/apps/discover/_runtime_fields_editor.ts b/test/functional/apps/discover/_runtime_fields_editor.ts
index 4757807cb7ac1e..2e21b2e1f8ec6c 100644
--- a/test/functional/apps/discover/_runtime_fields_editor.ts
+++ b/test/functional/apps/discover/_runtime_fields_editor.ts
@@ -31,8 +31,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await fieldEditor.save();
};
- // Failing: https://github.com/elastic/kibana/issues/111922
- describe.skip('discover integration with runtime fields editor', function describeIndexTests() {
+ describe('discover integration with runtime fields editor', function describeIndexTests() {
before(async function () {
await security.testUser.setRoles(['kibana_admin', 'test_logstash_reader']);
await esArchiver.loadIfNeeded('test/functional/fixtures/es_archiver/logstash_functional');
@@ -63,7 +62,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
it('allows creation of a new field', async function () {
await createRuntimeField('runtimefield');
await PageObjects.header.waitUntilLoadingHasFinished();
- await retry.waitFor('fieldNames to include runtimefield', async () => {
+ await retry.waitForWithTimeout('fieldNames to include runtimefield', 5000, async () => {
const fieldNames = await PageObjects.discover.getAllFieldNames();
return fieldNames.includes('runtimefield');
});
@@ -76,7 +75,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await fieldEditor.confirmSave();
await PageObjects.header.waitUntilLoadingHasFinished();
- await retry.waitFor('fieldNames to include edits', async () => {
+ await retry.waitForWithTimeout('fieldNames to include edits', 5000, async () => {
const fieldNames = await PageObjects.discover.getAllFieldNames();
return fieldNames.includes('runtimefield edited');
});
@@ -105,7 +104,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.discover.removeField('delete');
await fieldEditor.confirmDelete();
await PageObjects.header.waitUntilLoadingHasFinished();
- await retry.waitFor('fieldNames to include edits', async () => {
+ await retry.waitForWithTimeout('fieldNames to include edits', 5000, async () => {
const fieldNames = await PageObjects.discover.getAllFieldNames();
return !fieldNames.includes('delete');
});
@@ -127,16 +126,22 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await rowActions[idxToClick].click();
});
- await retry.waitFor('doc viewer is displayed with runtime field', async () => {
- const hasDocHit = await testSubjects.exists('doc-hit');
- if (!hasDocHit) {
- // Maybe loading has not completed
- throw new Error('test subject doc-hit is not yet displayed');
+ await retry.waitForWithTimeout(
+ 'doc viewer is displayed with runtime field',
+ 5000,
+ async () => {
+ const hasDocHit = await testSubjects.exists('doc-hit');
+ if (!hasDocHit) {
+ // Maybe loading has not completed
+ throw new Error('test subject doc-hit is not yet displayed');
+ }
+ const runtimeFieldsRow = await testSubjects.exists(
+ 'tableDocViewRow-discover runtimefield'
+ );
+
+ return hasDocHit && runtimeFieldsRow;
}
- const runtimeFieldsRow = await testSubjects.exists('tableDocViewRow-discover runtimefield');
-
- return hasDocHit && runtimeFieldsRow;
- });
+ );
});
});
}
diff --git a/test/functional/apps/discover/index.ts b/test/functional/apps/discover/index.ts
index 13658215e9e592..1241b0e892e9c2 100644
--- a/test/functional/apps/discover/index.ts
+++ b/test/functional/apps/discover/index.ts
@@ -53,5 +53,6 @@ export default function ({ getService, loadTestFile }: FtrProviderContext) {
loadTestFile(require.resolve('./_date_nested'));
loadTestFile(require.resolve('./_search_on_page_load'));
loadTestFile(require.resolve('./_chart_hidden'));
+ loadTestFile(require.resolve('./_context_encoded_url_param'));
});
}
diff --git a/test/functional/services/lib/compare_pngs.ts b/test/functional/services/lib/compare_pngs.ts
index 521781c5a6d2bb..5fb0c4d6ad1dc6 100644
--- a/test/functional/services/lib/compare_pngs.ts
+++ b/test/functional/services/lib/compare_pngs.ts
@@ -9,6 +9,8 @@
import { parse, join } from 'path';
import Jimp from 'jimp';
import { ToolingLog } from '@kbn/dev-utils';
+import { promises as fs } from 'fs';
+import path from 'path';
interface PngDescriptor {
path: string;
@@ -102,3 +104,53 @@ export async function comparePngs(
}
return percent;
}
+
+export async function checkIfPngsMatch(
+ actualpngPath: string,
+ baselinepngPath: string,
+ screenshotsDirectory: string,
+ log: any
+) {
+ log.debug(`checkIfpngsMatch: ${actualpngPath} vs ${baselinepngPath}`);
+ // Copy the pngs into the screenshot session directory, as that's where the generated pngs will automatically be
+ // stored.
+ const sessionDirectoryPath = path.resolve(screenshotsDirectory, 'session');
+ const failureDirectoryPath = path.resolve(screenshotsDirectory, 'failure');
+
+ await fs.mkdir(sessionDirectoryPath, { recursive: true });
+ await fs.mkdir(failureDirectoryPath, { recursive: true });
+
+ const actualpngFileName = path.basename(actualpngPath, '.png');
+ const baselinepngFileName = path.basename(baselinepngPath, '.png');
+
+ const baselineCopyPath = path.resolve(
+ sessionDirectoryPath,
+ `${baselinepngFileName}_baseline.png`
+ );
+ const actualCopyPath = path.resolve(sessionDirectoryPath, `${actualpngFileName}_actual.png`);
+
+ // Don't cause a test failure if the baseline snapshot doesn't exist - we don't have all OS's covered and we
+ // don't want to start causing failures for other devs working on OS's which are lacking snapshots. We have
+ // mac and linux covered which is better than nothing for now.
+ try {
+ log.debug(`writeFile: ${baselineCopyPath}`);
+ await fs.writeFile(baselineCopyPath, await fs.readFile(baselinepngPath));
+ } catch (error) {
+ throw new Error(`No baseline png found at ${baselinepngPath}`);
+ }
+ log.debug(`writeFile: ${actualCopyPath}`);
+ await fs.writeFile(actualCopyPath, await fs.readFile(actualpngPath));
+
+ let diffTotal = 0;
+
+ const diffPngPath = path.resolve(failureDirectoryPath, `${baselinepngFileName}-${1}.png`);
+ diffTotal += await comparePngs(
+ actualCopyPath,
+ baselineCopyPath,
+ diffPngPath,
+ sessionDirectoryPath,
+ log
+ );
+
+ return diffTotal;
+}
diff --git a/test/plugin_functional/test_suites/saved_objects_management/hidden_types.ts b/test/plugin_functional/test_suites/saved_objects_management/hidden_types.ts
index 8e7adb504ebee3..439ece04e615f2 100644
--- a/test/plugin_functional/test_suites/saved_objects_management/hidden_types.ts
+++ b/test/plugin_functional/test_suites/saved_objects_management/hidden_types.ts
@@ -21,7 +21,8 @@ export default function ({ getService, getPageObjects }: PluginFunctionalProvide
const esArchiver = getService('esArchiver');
const testSubjects = getService('testSubjects');
- describe('saved objects management with hidden types', () => {
+ // Failing: See https://github.com/elastic/kibana/issues/116059
+ describe.skip('saved objects management with hidden types', () => {
before(async () => {
await esArchiver.load(
'test/functional/fixtures/es_archiver/saved_objects_management/hidden_types'
diff --git a/x-pack/examples/embedded_lens_example/public/app.tsx b/x-pack/examples/embedded_lens_example/public/app.tsx
index f1b683f2430f7a..510d9469c78780 100644
--- a/x-pack/examples/embedded_lens_example/public/app.tsx
+++ b/x-pack/examples/embedded_lens_example/public/app.tsx
@@ -17,37 +17,32 @@ import {
EuiPageHeader,
EuiPageHeaderSection,
EuiTitle,
- EuiCallOut,
} from '@elastic/eui';
-import { IndexPattern } from 'src/plugins/data/public';
-import { CoreStart } from 'kibana/public';
-import { ViewMode } from '../../../../src/plugins/embeddable/public';
-import {
+
+import type { DataView } from 'src/plugins/data_views/public';
+import type { CoreStart } from 'kibana/public';
+import type { StartDependencies } from './plugin';
+import type {
TypedLensByValueInput,
PersistedIndexPatternLayer,
XYState,
LensEmbeddableInput,
+ FormulaPublicApi,
DateHistogramIndexPatternColumn,
} from '../../../plugins/lens/public';
-import { StartDependencies } from './plugin';
+
+import { ViewMode } from '../../../../src/plugins/embeddable/public';
// Generate a Lens state based on some app-specific input parameters.
// `TypedLensByValueInput` can be used for type-safety - it uses the same interfaces as Lens-internal code.
function getLensAttributes(
- defaultIndexPattern: IndexPattern,
- color: string
+ color: string,
+ dataView: DataView,
+ formula: FormulaPublicApi
): TypedLensByValueInput['attributes'] {
- const dataLayer: PersistedIndexPatternLayer = {
- columnOrder: ['col1', 'col2'],
+ const baseLayer: PersistedIndexPatternLayer = {
+ columnOrder: ['col1'],
columns: {
- col2: {
- dataType: 'number',
- isBucketed: false,
- label: 'Count of records',
- operationType: 'count',
- scale: 'ratio',
- sourceField: 'Records',
- },
col1: {
dataType: 'date',
isBucketed: true,
@@ -55,11 +50,18 @@ function getLensAttributes(
operationType: 'date_histogram',
params: { interval: 'auto' },
scale: 'interval',
- sourceField: defaultIndexPattern.timeFieldName!,
+ sourceField: dataView.timeFieldName!,
} as DateHistogramIndexPatternColumn,
},
};
+ const dataLayer = formula.insertOrReplaceFormulaColumn(
+ 'col2',
+ { formula: 'count()' },
+ baseLayer,
+ dataView
+ );
+
const xyConfig: XYState = {
axisTitlesVisibilitySettings: { x: true, yLeft: true, yRight: true },
fittingFunction: 'None',
@@ -85,12 +87,12 @@ function getLensAttributes(
title: 'Prefilled from example app',
references: [
{
- id: defaultIndexPattern.id!,
+ id: dataView.id!,
name: 'indexpattern-datasource-current-indexpattern',
type: 'index-pattern',
},
{
- id: defaultIndexPattern.id!,
+ id: dataView.id!,
name: 'indexpattern-datasource-layer-layer1',
type: 'index-pattern',
},
@@ -99,7 +101,7 @@ function getLensAttributes(
datasourceStates: {
indexpattern: {
layers: {
- layer1: dataLayer,
+ layer1: dataLayer!,
},
},
},
@@ -113,19 +115,22 @@ function getLensAttributes(
export const App = (props: {
core: CoreStart;
plugins: StartDependencies;
- defaultIndexPattern: IndexPattern | null;
+ defaultDataView: DataView;
+ formula: FormulaPublicApi;
}) => {
const [color, setColor] = useState('green');
const [isLoading, setIsLoading] = useState(false);
const [isSaveModalVisible, setIsSaveModalVisible] = useState(false);
- const LensComponent = props.plugins.lens.EmbeddableComponent;
- const LensSaveModalComponent = props.plugins.lens.SaveModalComponent;
-
const [time, setTime] = useState({
from: 'now-5d',
to: 'now',
});
+ const LensComponent = props.plugins.lens.EmbeddableComponent;
+ const LensSaveModalComponent = props.plugins.lens.SaveModalComponent;
+
+ const attributes = getLensAttributes(color, props.defaultDataView, props.formula);
+
return (
@@ -147,138 +152,122 @@ export const App = (props: {
the series which causes Lens to re-render. The Edit button will take the current
configuration and navigate to a prefilled editor.
- {props.defaultIndexPattern && props.defaultIndexPattern.isTimeBased() ? (
- <>
-
-
- {
- // eslint-disable-next-line no-bitwise
- const newColor = '#' + ((Math.random() * 0xffffff) << 0).toString(16);
- setColor(newColor);
- }}
- >
- Change color
-
-
-
- {
- props.plugins.lens.navigateToPrefilledEditor(
- {
- id: '',
- timeRange: time,
- attributes: getLensAttributes(props.defaultIndexPattern!, color),
- },
- {
- openInNewTab: true,
- }
- );
- // eslint-disable-next-line no-bitwise
- const newColor = '#' + ((Math.random() * 0xffffff) << 0).toString(16);
- setColor(newColor);
- }}
- >
- Edit in Lens (new tab)
-
-
-
- {
- props.plugins.lens.navigateToPrefilledEditor(
- {
- id: '',
- timeRange: time,
- attributes: getLensAttributes(props.defaultIndexPattern!, color),
- },
- {
- openInNewTab: false,
- }
- );
- }}
- >
- Edit in Lens (same tab)
-
-
-
- {
- setIsSaveModalVisible(true);
- }}
- >
- Save Visualization
-
-
-
- {
- setTime({
- from: '2015-09-18T06:31:44.000Z',
- to: '2015-09-23T18:31:44.000Z',
- });
- }}
- >
- Change time range
-
-
-
- {
- setIsLoading(val);
+
+
+
+ {
+ // eslint-disable-next-line no-bitwise
+ const newColor = '#' + ((Math.random() * 0xffffff) << 0).toString(16);
+ setColor(newColor);
}}
- onBrushEnd={({ range }) => {
- setTime({
- from: new Date(range[0]).toISOString(),
- to: new Date(range[1]).toISOString(),
- });
+ >
+ Change color
+
+
+
+ {
+ props.plugins.lens.navigateToPrefilledEditor(
+ {
+ id: '',
+ timeRange: time,
+ attributes,
+ },
+ {
+ openInNewTab: true,
+ }
+ );
+ // eslint-disable-next-line no-bitwise
+ const newColor = '#' + ((Math.random() * 0xffffff) << 0).toString(16);
+ setColor(newColor);
+ }}
+ >
+ Edit in Lens (new tab)
+
+
+
+ {
+ props.plugins.lens.navigateToPrefilledEditor(
+ {
+ id: '',
+ timeRange: time,
+ attributes,
+ },
+ {
+ openInNewTab: false,
+ }
+ );
}}
- onFilter={(_data) => {
- // call back event for on filter event
+ >
+ Edit in Lens (same tab)
+
+
+
+ {
+ setIsSaveModalVisible(true);
}}
- onTableRowClick={(_data) => {
- // call back event for on table row click event
+ >
+ Save Visualization
+
+
+
+ {
+ setTime({
+ from: '2015-09-18T06:31:44.000Z',
+ to: '2015-09-23T18:31:44.000Z',
+ });
}}
- viewMode={ViewMode.VIEW}
- />
- {isSaveModalVisible && (
- {}}
- onClose={() => setIsSaveModalVisible(false)}
- />
- )}
-
- ) : (
-
- This demo only works if your default index pattern is set and time based
-
+ >
+ Change time range
+
+
+
+ {
+ setIsLoading(val);
+ }}
+ onBrushEnd={({ range }) => {
+ setTime({
+ from: new Date(range[0]).toISOString(),
+ to: new Date(range[1]).toISOString(),
+ });
+ }}
+ onFilter={(_data) => {
+ // call back event for on filter event
+ }}
+ onTableRowClick={(_data) => {
+ // call back event for on table row click event
+ }}
+ viewMode={ViewMode.VIEW}
+ />
+ {isSaveModalVisible && (
+ {}}
+ onClose={() => setIsSaveModalVisible(false)}
+ />
)}
diff --git a/x-pack/examples/embedded_lens_example/public/mount.tsx b/x-pack/examples/embedded_lens_example/public/mount.tsx
index 58ec3632232707..e438b6946b8b6f 100644
--- a/x-pack/examples/embedded_lens_example/public/mount.tsx
+++ b/x-pack/examples/embedded_lens_example/public/mount.tsx
@@ -7,8 +7,10 @@
import * as React from 'react';
import { render, unmountComponentAtNode } from 'react-dom';
-import { CoreSetup, AppMountParameters } from 'kibana/public';
-import { StartDependencies } from './plugin';
+import { EuiCallOut } from '@elastic/eui';
+
+import type { CoreSetup, AppMountParameters } from 'kibana/public';
+import type { StartDependencies } from './plugin';
export const mount =
(coreSetup: CoreSetup) =>
@@ -16,20 +18,27 @@ export const mount =
const [core, plugins] = await coreSetup.getStartServices();
const { App } = await import('./app');
- const deps = {
- core,
- plugins,
- };
-
- const defaultIndexPattern = await plugins.data.indexPatterns.getDefault();
+ const defaultDataView = await plugins.data.indexPatterns.getDefault();
+ const { formula } = await plugins.lens.stateHelperApi();
const i18nCore = core.i18n;
const reactElement = (
-
+ {defaultDataView && defaultDataView.isTimeBased() ? (
+
+ ) : (
+
+ This demo only works if your default index pattern is set and time based
+
+ )}
);
+
render(reactElement, element);
return () => unmountComponentAtNode(element);
};
diff --git a/x-pack/plugins/apm/dev_docs/routing_and_linking.md b/x-pack/plugins/apm/dev_docs/routing_and_linking.md
index 562af3d01ef779..d5c1d6c6306354 100644
--- a/x-pack/plugins/apm/dev_docs/routing_and_linking.md
+++ b/x-pack/plugins/apm/dev_docs/routing_and_linking.md
@@ -46,7 +46,7 @@ To be able to use the parameters, you can use `useApmParams`, which will automat
```ts
const {
path: { serviceName }, // string
- query: { transactionType } // string | undefined
+ query: { transactionType }, // string | undefined
} = useApmParams('/services/:serviceName');
```
@@ -64,13 +64,16 @@ For links that stay inside APM, the preferred way of linking is to call the `use
```ts
const apmRouter = useApmRouter();
-const serviceOverviewLink = apmRouter.link('/services/:serviceName', { path: { serviceName: 'opbeans-java' }, query: { transactionType: 'request' }});
+const serviceOverviewLink = apmRouter.link('/services/:serviceName', {
+ path: { serviceName: 'opbeans-java' },
+ query: { transactionType: 'request' },
+});
```
- If you're not in React context, you can also import `apmRouter` directly and call its `link` function - but you have to prepend the basePath manually in that case.
+If you're not in React context, you can also import `apmRouter` directly and call its `link` function - but you have to prepend the basePath manually in that case.
-We also have the [`getLegacyApmHref` function and `APMLink` component](../public/components/shared/Links/apm/APMLink.tsx), but we should consider them deprecated, in favor of `router.link`. Other components inside that directory contain other functions and components that provide the same functionality for linking to more specific sections inside the APM plugin.
+We also have the [`getLegacyApmHref` function and `APMLink` component](../public/components/shared/links/apm/APMLink.tsx), but we should consider them deprecated, in favor of `router.link`. Other components inside that directory contain other functions and components that provide the same functionality for linking to more specific sections inside the APM plugin.
### Cross-app linking
-Other helpers and components in [the Links directory](../public/components/shared/Links) allow linking to other Kibana apps.
+Other helpers and components in [the Links directory](../public/components/shared/links) allow linking to other Kibana apps.
diff --git a/x-pack/plugins/apm/public/application/application.test.tsx b/x-pack/plugins/apm/public/application/application.test.tsx
index 12170ac20b7dff..396e853ca54a7f 100644
--- a/x-pack/plugins/apm/public/application/application.test.tsx
+++ b/x-pack/plugins/apm/public/application/application.test.tsx
@@ -20,13 +20,13 @@ import { disableConsoleWarning } from '../utils/testHelpers';
import { dataPluginMock } from 'src/plugins/data/public/mocks';
import { embeddablePluginMock } from 'src/plugins/embeddable/public/mocks';
import { ApmPluginSetupDeps, ApmPluginStartDeps } from '../plugin';
-import { RumHome } from '../components/app/RumDashboard/RumHome';
+import { RumHome } from '../components/app/rum_dashboard/rum_home';
jest.mock('../services/rest/data_view', () => ({
createStaticDataView: () => Promise.resolve(undefined),
}));
-jest.mock('../components/app/RumDashboard/RumHome', () => ({
+jest.mock('../components/app/rum_dashboard/rum_home', () => ({
RumHome: () => Home Mock
,
}));
diff --git a/x-pack/plugins/apm/public/application/uxApp.tsx b/x-pack/plugins/apm/public/application/uxApp.tsx
index cfb1a5c354c2da..dde7cfe5399d37 100644
--- a/x-pack/plugins/apm/public/application/uxApp.tsx
+++ b/x-pack/plugins/apm/public/application/uxApp.tsx
@@ -21,18 +21,18 @@ import {
useUiSetting$,
} from '../../../../../src/plugins/kibana_react/public';
import { APMRouteDefinition } from '../application/routes';
-import { ScrollToTopOnPathChange } from '../components/app/Main/ScrollToTopOnPathChange';
+import { ScrollToTopOnPathChange } from '../components/app/main/ScrollToTopOnPathChange';
import {
RumHome,
DASHBOARD_LABEL,
-} from '../components/app/RumDashboard/RumHome';
+} from '../components/app/rum_dashboard/rum_home';
import { ApmPluginContext } from '../context/apm_plugin/apm_plugin_context';
import { UrlParamsProvider } from '../context/url_params_context/url_params_context';
import { ConfigSchema } from '../index';
import { ApmPluginSetupDeps, ApmPluginStartDeps } from '../plugin';
import { createCallApmApi } from '../services/rest/createCallApmApi';
import { createStaticDataView } from '../services/rest/data_view';
-import { UXActionMenu } from '../components/app/RumDashboard/ActionMenu';
+import { UXActionMenu } from '../components/app/rum_dashboard/action_menu';
import { redirectTo } from '../components/routing/redirect_to';
import {
InspectorContextProvider,
diff --git a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/ServicePage/FormRowSelect.tsx b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/ServicePage/FormRowSelect.tsx
index 45c8ddaf2f4dff..b45a513bf9d648 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/ServicePage/FormRowSelect.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/ServicePage/FormRowSelect.tsx
@@ -11,7 +11,7 @@ import {
EuiSelectOption,
EuiFormRow,
} from '@elastic/eui';
-import { SelectWithPlaceholder } from '../../../../../shared/SelectWithPlaceholder';
+import { SelectWithPlaceholder } from '../../../../../shared/select_with_placeholder';
interface Props {
title: string;
diff --git a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/ServicePage/ServicePage.tsx b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/ServicePage/ServicePage.tsx
index d71751805ce416..50f4e34a1c6b4d 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/ServicePage/ServicePage.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/ServicePage/ServicePage.tsx
@@ -17,7 +17,7 @@ import {
} from '../../../../../../../common/agent_configuration/all_option';
import { useFetcher, FETCH_STATUS } from '../../../../../../hooks/use_fetcher';
import { FormRowSelect } from './FormRowSelect';
-import { APMLink } from '../../../../../shared/Links/apm/APMLink';
+import { APMLink } from '../../../../../shared/links/apm/apm_link';
interface Props {
newConfig: AgentConfigurationIntake;
diff --git a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/SettingsPage/SettingFormRow.tsx b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/SettingsPage/SettingFormRow.tsx
index cee38e4186454f..ccc483182d772a 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/SettingsPage/SettingFormRow.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/SettingsPage/SettingFormRow.tsx
@@ -24,7 +24,7 @@ import {
amountAndUnitToString,
amountAndUnitToObject,
} from '../../../../../../../common/agent_configuration/amount_and_unit';
-import { SelectWithPlaceholder } from '../../../../../shared/SelectWithPlaceholder';
+import { SelectWithPlaceholder } from '../../../../../shared/select_with_placeholder';
function FormRow({
setting,
diff --git a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/index.tsx b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/index.tsx
index a0ca7daf826106..eaf7bb711e54e9 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/AgentConfigurationCreateEdit/index.tsx
@@ -16,7 +16,7 @@ import {
AgentConfigurationIntake,
} from '../../../../../../common/agent_configuration/configuration_types';
import { FetcherResult } from '../../../../../hooks/use_fetcher';
-import { fromQuery, toQuery } from '../../../../shared/Links/url_helpers';
+import { fromQuery, toQuery } from '../../../../shared/links/url_helpers';
import { ServicePage } from './ServicePage/ServicePage';
import { SettingsPage } from './SettingsPage/SettingsPage';
diff --git a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/List/index.tsx b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/List/index.tsx
index 4804e52b16d4fc..15efd28756b0b6 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/List/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/agent_configurations/List/index.tsx
@@ -23,9 +23,9 @@ import { getOptionLabel } from '../../../../../../common/agent_configuration/all
import { useApmPluginContext } from '../../../../../context/apm_plugin/use_apm_plugin_context';
import { FETCH_STATUS } from '../../../../../hooks/use_fetcher';
import { useTheme } from '../../../../../hooks/use_theme';
-import { LoadingStatePrompt } from '../../../../shared/LoadingStatePrompt';
+import { LoadingStatePrompt } from '../../../../shared/loading_state_prompt';
import { ITableColumn, ManagedTable } from '../../../../shared/managed_table';
-import { TimestampTooltip } from '../../../../shared/TimestampTooltip';
+import { TimestampTooltip } from '../../../../shared/timestamp_tooltip';
import { ConfirmDeleteModal } from './ConfirmDeleteModal';
type Config =
diff --git a/x-pack/plugins/apm/public/components/app/Settings/agent_keys/agent_keys_table.tsx b/x-pack/plugins/apm/public/components/app/Settings/agent_keys/agent_keys_table.tsx
index ccd409f1798a5f..e1ced3fabcd77b 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/agent_keys/agent_keys_table.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/agent_keys/agent_keys_table.tsx
@@ -12,7 +12,7 @@ import {
EuiBasicTableColumn,
EuiInMemoryTableProps,
} from '@elastic/eui';
-import { TimestampTooltip } from '../../../shared/TimestampTooltip';
+import { TimestampTooltip } from '../../../shared/timestamp_tooltip';
import { ApiKey } from '../../../../../../security/common/model';
import { ConfirmDeleteModal } from './confirm_delete_modal';
diff --git a/x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/jobs_list.tsx b/x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/jobs_list.tsx
index 1faab4092361d0..15b2d393a97a0c 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/jobs_list.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/jobs_list.tsx
@@ -27,9 +27,9 @@ import { useApmPluginContext } from '../../../../context/apm_plugin/use_apm_plug
import { FETCH_STATUS } from '../../../../hooks/use_fetcher';
import { useMlManageJobsHref } from '../../../../hooks/use_ml_manage_jobs_href';
import { callApmApi } from '../../../../services/rest/createCallApmApi';
-import { MLExplorerLink } from '../../../shared/Links/MachineLearningLinks/MLExplorerLink';
-import { MLManageJobsLink } from '../../../shared/Links/MachineLearningLinks/MLManageJobsLink';
-import { LoadingStatePrompt } from '../../../shared/LoadingStatePrompt';
+import { MLExplorerLink } from '../../../shared/links/machine_learning_links/mlexplorer_link';
+import { MLManageJobsLink } from '../../../shared/links/machine_learning_links/mlmanage_jobs_link';
+import { LoadingStatePrompt } from '../../../shared/loading_state_prompt';
import { ITableColumn, ManagedTable } from '../../../shared/managed_table';
import { MLCallout, shouldDisplayMlCallout } from '../../../shared/ml_callout';
import { AnomalyDetectionApiResponse } from './index';
diff --git a/x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/jobs_list_status.tsx b/x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/jobs_list_status.tsx
index 6145e9f9ca7da0..1df6dc0332b2a8 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/jobs_list_status.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/jobs_list_status.tsx
@@ -8,7 +8,7 @@ import { EuiBadge, EuiFlexGroup, EuiFlexItem, EuiToolTip } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
import { DATAFEED_STATE, JOB_STATE } from '../../../../../../ml/common';
-import { MLManageJobsLink } from '../../../shared/Links/MachineLearningLinks/MLManageJobsLink';
+import { MLManageJobsLink } from '../../../shared/links/machine_learning_links/mlmanage_jobs_link';
export function JobsListStatus({
jobId,
diff --git a/x-pack/plugins/apm/public/components/app/Settings/custom_link/custom_link_table.tsx b/x-pack/plugins/apm/public/components/app/Settings/custom_link/custom_link_table.tsx
index b6f344751b59bb..5ce98f8b10884c 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/custom_link/custom_link_table.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/custom_link/custom_link_table.tsx
@@ -18,9 +18,9 @@ import { isEmpty } from 'lodash';
import React, { useState } from 'react';
import { CustomLink } from '../../../../../common/custom_link/custom_link_types';
import { useApmPluginContext } from '../../../../context/apm_plugin/use_apm_plugin_context';
-import { LoadingStatePrompt } from '../../../shared/LoadingStatePrompt';
+import { LoadingStatePrompt } from '../../../shared/loading_state_prompt';
import { ITableColumn, ManagedTable } from '../../../shared/managed_table';
-import { TimestampTooltip } from '../../../shared/TimestampTooltip';
+import { TimestampTooltip } from '../../../shared/timestamp_tooltip';
interface Props {
items: CustomLink[];
diff --git a/x-pack/plugins/apm/public/components/app/Settings/schema/confirm_switch_modal.tsx b/x-pack/plugins/apm/public/components/app/Settings/schema/confirm_switch_modal.tsx
index 1847ea90bd7fa6..375a4b5ac11566 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/schema/confirm_switch_modal.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/schema/confirm_switch_modal.tsx
@@ -16,7 +16,7 @@ import {
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { useUiTracker } from '../../../../../../observability/public';
-import { ElasticDocsLink } from '../../../shared/Links/ElasticDocsLink';
+import { ElasticDocsLink } from '../../../shared/links/elastic_docs_link';
interface Props {
onConfirm: () => void;
diff --git a/x-pack/plugins/apm/public/components/app/Settings/schema/migrated/card_footer_content.tsx b/x-pack/plugins/apm/public/components/app/Settings/schema/migrated/card_footer_content.tsx
index 62b4b242b1b688..6017d16ba2dad6 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/schema/migrated/card_footer_content.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/schema/migrated/card_footer_content.tsx
@@ -9,8 +9,8 @@ import { EuiButton, EuiSpacer, EuiText } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n-react';
import React from 'react';
-import { APMLink } from '../../../../shared/Links/apm/APMLink';
-import { useFleetCloudAgentPolicyHref } from '../../../../shared/Links/kibana';
+import { APMLink } from '../../../../shared/links/apm/apm_link';
+import { useFleetCloudAgentPolicyHref } from '../../../../shared/links/kibana';
export function CardFooterContent() {
const fleetCloudAgentPolicyHref = useFleetCloudAgentPolicyHref();
diff --git a/x-pack/plugins/apm/public/components/app/Settings/schema/migrated/upgrade_available_card.tsx b/x-pack/plugins/apm/public/components/app/Settings/schema/migrated/upgrade_available_card.tsx
index eee8ca66dd08f3..8741cd76676982 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/schema/migrated/upgrade_available_card.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/schema/migrated/upgrade_available_card.tsx
@@ -9,7 +9,7 @@ import { EuiCard, EuiIcon, EuiLink } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n-react';
import React from 'react';
-import { useUpgradeApmPackagePolicyHref } from '../../../../shared/Links/kibana';
+import { useUpgradeApmPackagePolicyHref } from '../../../../shared/links/kibana';
import { CardFooterContent } from './card_footer_content';
export function UpgradeAvailableCard({
diff --git a/x-pack/plugins/apm/public/components/app/Settings/schema/schema_overview.tsx b/x-pack/plugins/apm/public/components/app/Settings/schema/schema_overview.tsx
index d9540115d0d70b..4c50b47a4b9a61 100644
--- a/x-pack/plugins/apm/public/components/app/Settings/schema/schema_overview.tsx
+++ b/x-pack/plugins/apm/public/components/app/Settings/schema/schema_overview.tsx
@@ -22,7 +22,7 @@ import React from 'react';
import semverLt from 'semver/functions/lt';
import { SUPPORTED_APM_PACKAGE_VERSION } from '../../../../../common/fleet';
import { PackagePolicy } from '../../../../../../fleet/common/types';
-import { ElasticDocsLink } from '../../../shared/Links/ElasticDocsLink';
+import { ElasticDocsLink } from '../../../shared/links/elastic_docs_link';
import rocketLaunchGraphic from './blog-rocket-720x420.png';
import { MigrationInProgressPanel } from './migration_in_progress_panel';
import { UpgradeAvailableCard } from './migrated/upgrade_available_card';
diff --git a/x-pack/plugins/apm/public/components/app/correlations/failed_transactions_correlations.tsx b/x-pack/plugins/apm/public/components/app/correlations/failed_transactions_correlations.tsx
index c642ca7bd577ff..2d09abc15f8540 100644
--- a/x-pack/plugins/apm/public/components/app/correlations/failed_transactions_correlations.tsx
+++ b/x-pack/plugins/apm/public/components/app/correlations/failed_transactions_correlations.tsx
@@ -38,8 +38,8 @@ import { useLocalStorage } from '../../../hooks/useLocalStorage';
import { FETCH_STATUS } from '../../../hooks/use_fetcher';
import { useTheme } from '../../../hooks/use_theme';
-import { ImpactBar } from '../../shared/ImpactBar';
-import { push } from '../../shared/Links/url_helpers';
+import { ImpactBar } from '../../shared/impact_bar';
+import { push } from '../../shared/links/url_helpers';
import { CorrelationsTable } from './correlations_table';
import { FailedTransactionsCorrelationsHelpPopover } from './failed_transactions_correlations_help_popover';
diff --git a/x-pack/plugins/apm/public/components/app/correlations/latency_correlations.test.tsx b/x-pack/plugins/apm/public/components/app/correlations/latency_correlations.test.tsx
index 0656ab045efc25..5bf7e30a3df5d4 100644
--- a/x-pack/plugins/apm/public/components/app/correlations/latency_correlations.test.tsx
+++ b/x-pack/plugins/apm/public/components/app/correlations/latency_correlations.test.tsx
@@ -25,7 +25,7 @@ import {
mockApmPluginContextValue,
MockApmPluginContextWrapper,
} from '../../../context/apm_plugin/mock_apm_plugin_context';
-import { fromQuery } from '../../shared/Links/url_helpers';
+import { fromQuery } from '../../shared/links/url_helpers';
import { LatencyCorrelations } from './latency_correlations';
diff --git a/x-pack/plugins/apm/public/components/app/correlations/latency_correlations.tsx b/x-pack/plugins/apm/public/components/app/correlations/latency_correlations.tsx
index f79e9555957170..5b37a14b4e4e5c 100644
--- a/x-pack/plugins/apm/public/components/app/correlations/latency_correlations.tsx
+++ b/x-pack/plugins/apm/public/components/app/correlations/latency_correlations.tsx
@@ -33,7 +33,7 @@ import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_
import { FETCH_STATUS } from '../../../hooks/use_fetcher';
import { TransactionDistributionChart } from '../../shared/charts/transaction_distribution_chart';
-import { push } from '../../shared/Links/url_helpers';
+import { push } from '../../shared/links/url_helpers';
import { CorrelationsTable } from './correlations_table';
import { LatencyCorrelationsHelpPopover } from './latency_correlations_help_popover';
diff --git a/x-pack/plugins/apm/public/components/app/correlations/use_failed_transactions_correlations.test.tsx b/x-pack/plugins/apm/public/components/app/correlations/use_failed_transactions_correlations.test.tsx
index 929cc4f7f4cd3f..d68c11f981a0f5 100644
--- a/x-pack/plugins/apm/public/components/app/correlations/use_failed_transactions_correlations.test.tsx
+++ b/x-pack/plugins/apm/public/components/app/correlations/use_failed_transactions_correlations.test.tsx
@@ -17,7 +17,7 @@ import {
} from '../../../context/apm_plugin/mock_apm_plugin_context';
import { delay } from '../../../utils/testHelpers';
-import { fromQuery } from '../../shared/Links/url_helpers';
+import { fromQuery } from '../../shared/links/url_helpers';
import { useFailedTransactionsCorrelations } from './use_failed_transactions_correlations';
diff --git a/x-pack/plugins/apm/public/components/app/correlations/use_latency_correlations.test.tsx b/x-pack/plugins/apm/public/components/app/correlations/use_latency_correlations.test.tsx
index 90d976c389c589..c2c5a63a2ab030 100644
--- a/x-pack/plugins/apm/public/components/app/correlations/use_latency_correlations.test.tsx
+++ b/x-pack/plugins/apm/public/components/app/correlations/use_latency_correlations.test.tsx
@@ -17,7 +17,7 @@ import {
} from '../../../context/apm_plugin/mock_apm_plugin_context';
import { delay } from '../../../utils/testHelpers';
-import { fromQuery } from '../../shared/Links/url_helpers';
+import { fromQuery } from '../../shared/links/url_helpers';
import { useLatencyCorrelations } from './use_latency_correlations';
diff --git a/x-pack/plugins/apm/public/components/app/error_group_details/detail_view/exception_stacktrace.tsx b/x-pack/plugins/apm/public/components/app/error_group_details/detail_view/exception_stacktrace.tsx
index 77d54e0dad698a..85ad5c5336c8c2 100644
--- a/x-pack/plugins/apm/public/components/app/error_group_details/detail_view/exception_stacktrace.tsx
+++ b/x-pack/plugins/apm/public/components/app/error_group_details/detail_view/exception_stacktrace.tsx
@@ -8,8 +8,8 @@
import { EuiTitle } from '@elastic/eui';
import React from 'react';
import { Exception } from '../../../../../typings/es_schemas/raw/error_raw';
-import { Stacktrace } from '../../../shared/Stacktrace';
-import { CauseStacktrace } from '../../../shared/Stacktrace/cause_stacktrace';
+import { Stacktrace } from '../../../shared/stacktrace';
+import { CauseStacktrace } from '../../../shared/stacktrace/cause_stacktrace';
interface ExceptionStacktraceProps {
codeLanguage?: string;
diff --git a/x-pack/plugins/apm/public/components/app/error_group_details/detail_view/index.tsx b/x-pack/plugins/apm/public/components/app/error_group_details/detail_view/index.tsx
index 5438fce7c48819..af7283af8c5264 100644
--- a/x-pack/plugins/apm/public/components/app/error_group_details/detail_view/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/error_group_details/detail_view/index.tsx
@@ -23,15 +23,15 @@ import { euiStyled } from '../../../../../../../../src/plugins/kibana_react/comm
import type { APIReturnType } from '../../../../services/rest/createCallApmApi';
import type { APMError } from '../../../../../typings/es_schemas/ui/apm_error';
import type { ApmUrlParams } from '../../../../context/url_params_context/types';
-import { TransactionDetailLink } from '../../../shared/Links/apm/transaction_detail_link';
-import { DiscoverErrorLink } from '../../../shared/Links/DiscoverLinks/DiscoverErrorLink';
-import { fromQuery, toQuery } from '../../../shared/Links/url_helpers';
-import { ErrorMetadata } from '../../../shared/MetadataTable/ErrorMetadata';
-import { Stacktrace } from '../../../shared/Stacktrace';
-import { Summary } from '../../../shared/Summary';
-import { HttpInfoSummaryItem } from '../../../shared/Summary/http_info_summary_item';
-import { UserAgentSummaryItem } from '../../../shared/Summary/UserAgentSummaryItem';
-import { TimestampTooltip } from '../../../shared/TimestampTooltip';
+import { TransactionDetailLink } from '../../../shared/links/apm/transaction_detail_link';
+import { DiscoverErrorLink } from '../../../shared/links/discover_links/discover_error_link';
+import { fromQuery, toQuery } from '../../../shared/links/url_helpers';
+import { ErrorMetadata } from '../../../shared/metadata_table/error_metadata';
+import { Stacktrace } from '../../../shared/stacktrace';
+import { Summary } from '../../../shared/summary';
+import { HttpInfoSummaryItem } from '../../../shared/summary/http_info_summary_item';
+import { UserAgentSummaryItem } from '../../../shared/summary/user_agent_summary_item';
+import { TimestampTooltip } from '../../../shared/timestamp_tooltip';
import {
ErrorTab,
exceptionStacktraceTab,
diff --git a/x-pack/plugins/apm/public/components/app/error_group_overview/error_group_list/index.tsx b/x-pack/plugins/apm/public/components/app/error_group_overview/error_group_list/index.tsx
index e252eba15ade15..65681a398d8e65 100644
--- a/x-pack/plugins/apm/public/components/app/error_group_overview/error_group_list/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/error_group_overview/error_group_list/index.tsx
@@ -19,11 +19,11 @@ import { NOT_AVAILABLE_LABEL } from '../../../../../common/i18n';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
import { APIReturnType } from '../../../../services/rest/createCallApmApi';
import { truncate, unit } from '../../../../utils/style';
-import { ErrorDetailLink } from '../../../shared/Links/apm/ErrorDetailLink';
-import { ErrorOverviewLink } from '../../../shared/Links/apm/ErrorOverviewLink';
-import { APMQueryParams } from '../../../shared/Links/url_helpers';
+import { ErrorDetailLink } from '../../../shared/links/apm/error_detail_link';
+import { ErrorOverviewLink } from '../../../shared/links/apm/error_overview_link';
+import { APMQueryParams } from '../../../shared/links/url_helpers';
import { ITableColumn, ManagedTable } from '../../../shared/managed_table';
-import { TimestampTooltip } from '../../../shared/TimestampTooltip';
+import { TimestampTooltip } from '../../../shared/timestamp_tooltip';
import { SparkPlot } from '../../../shared/charts/spark_plot';
const GroupIdLink = euiStyled(ErrorDetailLink)`
diff --git a/x-pack/plugins/apm/public/components/app/infra_overview/index.tsx b/x-pack/plugins/apm/public/components/app/infra_overview/index.tsx
new file mode 100644
index 00000000000000..c1360ba3b13ad2
--- /dev/null
+++ b/x-pack/plugins/apm/public/components/app/infra_overview/index.tsx
@@ -0,0 +1,24 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+import { EuiEmptyPrompt, EuiLoadingLogo } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import React from 'react';
+
+export function InfraOverview() {
+ return (
+ }
+ title={
+
+ {i18n.translate('xpack.apm.infra.announcement', {
+ defaultMessage: 'Infrastructure data coming soon',
+ })}
+
+ }
+ />
+ );
+}
diff --git a/x-pack/plugins/apm/public/components/app/Main/ScrollToTopOnPathChange.tsx b/x-pack/plugins/apm/public/components/app/main/ScrollToTopOnPathChange.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/Main/ScrollToTopOnPathChange.tsx
rename to x-pack/plugins/apm/public/components/app/main/ScrollToTopOnPathChange.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/ActionMenu/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/action_menu/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/ActionMenu/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/action_menu/index.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/ActionMenu/inpector_link.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/action_menu/inpector_link.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/ActionMenu/inpector_link.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/action_menu/inpector_link.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/Breakdowns/BreakdownFilter.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/breakdowns/breakdown_filter.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/Breakdowns/BreakdownFilter.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/breakdowns/breakdown_filter.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/ChartWrapper/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/chart_wrapper/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/ChartWrapper/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/chart_wrapper/index.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/Charts/PageLoadDistChart.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/charts/page_load_dist_chart.tsx
similarity index 93%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/Charts/PageLoadDistChart.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/charts/page_load_dist_chart.tsx
index 51349ff22a9621..8b34ad8980774a 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/Charts/PageLoadDistChart.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/charts/page_load_dist_chart.tsx
@@ -28,13 +28,13 @@ import {
EUI_CHARTS_THEME_LIGHT,
} from '@elastic/eui/dist/eui_charts_theme';
import styled from 'styled-components';
-import { PercentileAnnotations } from '../PageLoadDistribution/PercentileAnnotations';
+import { PercentileAnnotations } from '../page_load_distribution/percentile_annotations';
import { I18LABELS } from '../translations';
-import { ChartWrapper } from '../ChartWrapper';
-import { PercentileRange } from '../PageLoadDistribution';
+import { ChartWrapper } from '../chart_wrapper';
+import { PercentileRange } from '../page_load_distribution';
import { BreakdownItem } from '../../../../../typings/ui_filters';
import { useUiSetting$ } from '../../../../../../../../src/plugins/kibana_react/public';
-import { BreakdownSeries } from '../PageLoadDistribution/BreakdownSeries';
+import { BreakdownSeries } from '../page_load_distribution/breakdown_series';
interface PageLoadData {
pageLoadDistribution: Array<{ x: number; y: number }>;
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/Charts/PageViewsChart.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/charts/page_views_chart.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/Charts/PageViewsChart.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/charts/page_views_chart.tsx
index e5ee427e166771..059feb0915fdbd 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/Charts/PageViewsChart.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/charts/page_views_chart.tsx
@@ -29,8 +29,8 @@ import React from 'react';
import { useHistory } from 'react-router-dom';
import { useUiSetting$ } from '../../../../../../../../src/plugins/kibana_react/public';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
-import { fromQuery, toQuery } from '../../../shared/Links/url_helpers';
-import { ChartWrapper } from '../ChartWrapper';
+import { fromQuery, toQuery } from '../../../shared/links/url_helpers';
+import { ChartWrapper } from '../chart_wrapper';
import { I18LABELS } from '../translations';
interface Props {
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/Charts/VisitorBreakdownChart.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/charts/visitor_breakdown_chart.tsx
similarity index 98%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/Charts/VisitorBreakdownChart.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/charts/visitor_breakdown_chart.tsx
index 149e9b8ee763a1..89f49a9669b451 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/Charts/VisitorBreakdownChart.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/charts/visitor_breakdown_chart.tsx
@@ -22,7 +22,7 @@ import {
EUI_CHARTS_THEME_LIGHT,
} from '@elastic/eui/dist/eui_charts_theme';
import { useUiSetting$ } from '../../../../../../../../src/plugins/kibana_react/public';
-import { ChartWrapper } from '../ChartWrapper';
+import { ChartWrapper } from '../chart_wrapper';
import { I18LABELS } from '../translations';
const StyleChart = styled.div`
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/ClientMetrics/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/client_metrics/index.tsx
similarity index 91%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/ClientMetrics/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/client_metrics/index.tsx
index 7c48531d21990c..a017d1b5304e3c 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/ClientMetrics/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/client_metrics/index.tsx
@@ -14,9 +14,9 @@ import {
EuiSpacer,
} from '@elastic/eui';
import { I18LABELS } from '../translations';
-import { getPercentileLabel } from '../UXMetrics/translations';
+import { getPercentileLabel } from '../ux_metrics/translations';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
-import { Metrics } from './Metrics';
+import { Metrics } from './metrics';
export function ClientMetrics() {
const {
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/ClientMetrics/Metrics.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/client_metrics/metrics.tsx
similarity index 95%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/ClientMetrics/Metrics.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/client_metrics/metrics.tsx
index ded242e2ce558a..82dac9cc8f0163 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/ClientMetrics/Metrics.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/client_metrics/metrics.tsx
@@ -18,9 +18,9 @@ import {
} from '@elastic/eui';
import { useFetcher } from '../../../../hooks/use_fetcher';
import { I18LABELS } from '../translations';
-import { useUxQuery } from '../hooks/useUxQuery';
-import { formatToSec } from '../UXMetrics/KeyUXMetrics';
-import { CsmSharedContext } from '../CsmSharedContext';
+import { useUxQuery } from '../hooks/use_ux_query';
+import { formatToSec } from '../ux_metrics/key_ux_metrics';
+import { CsmSharedContext } from '../csm_shared_context';
const ClFlexGroup = styled(EuiFlexGroup)`
flex-direction: row;
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/CsmSharedContext/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/csm_shared_context/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/CsmSharedContext/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/csm_shared_context/index.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/empty_state_loading.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/empty_state_loading.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/empty_state_loading.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/empty_state_loading.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/hooks/use_call_api.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/hooks/use_call_api.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/hooks/use_call_api.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/hooks/use_call_api.ts
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/hooks/useHasRumData.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/hooks/use_has_rum_data.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/hooks/useHasRumData.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/hooks/use_has_rum_data.ts
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/hooks/useLocalUIFilters.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/hooks/use_local_ui_filters.ts
similarity index 95%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/hooks/useLocalUIFilters.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/hooks/use_local_ui_filters.ts
index 8045e4947dcb0b..5c0bc7fdfd462d 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/hooks/useLocalUIFilters.ts
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/hooks/use_local_ui_filters.ts
@@ -15,10 +15,10 @@ import {
import {
fromQuery,
toQuery,
-} from '../../../../components/shared/Links/url_helpers';
+} from '../../../../components/shared/links/url_helpers';
import { removeUndefinedProps } from '../../../../context/url_params_context/helpers';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
-import { getExcludedName } from '../LocalUIFilters';
+import { getExcludedName } from '../local_ui_filters';
export type FiltersUIHook = ReturnType;
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/hooks/useUxQuery.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/hooks/use_ux_query.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/hooks/useUxQuery.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/hooks/use_ux_query.ts
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/ImpactfulMetrics/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/impactful_metrics/index.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/ImpactfulMetrics/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/impactful_metrics/index.tsx
index b696a46f59bd12..640ab0b0daad22 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/ImpactfulMetrics/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/impactful_metrics/index.tsx
@@ -7,7 +7,7 @@
import React from 'react';
import { EuiFlexItem, EuiPanel, EuiFlexGroup, EuiSpacer } from '@elastic/eui';
-import { JSErrors } from './JSErrors';
+import { JSErrors } from './js_errors';
export function ImpactfulMetrics() {
return (
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/ImpactfulMetrics/JSErrors.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/impactful_metrics/js_errors.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/ImpactfulMetrics/JSErrors.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/impactful_metrics/js_errors.tsx
index 96ec397f5f94fa..9f7ad5d053fa4a 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/ImpactfulMetrics/JSErrors.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/impactful_metrics/js_errors.tsx
@@ -21,8 +21,8 @@ import { FormattedMessage } from '@kbn/i18n-react';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
import { FETCH_STATUS, useFetcher } from '../../../../hooks/use_fetcher';
import { I18LABELS } from '../translations';
-import { CsmSharedContext } from '../CsmSharedContext';
-import { ErrorDetailLink } from '../../../shared/Links/apm/ErrorDetailLink';
+import { CsmSharedContext } from '../csm_shared_context';
+import { ErrorDetailLink } from '../../../shared/links/apm/error_detail_link';
interface JSErrorItem {
errorMessage: string;
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/index.tsx
similarity index 86%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/index.tsx
index ee11c301441b6d..d3eadeaf016c01 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/index.tsx
@@ -8,8 +8,8 @@
import { EuiSpacer } from '@elastic/eui';
import React from 'react';
import { useTrackPageview } from '../../../../../observability/public';
-import { LocalUIFilters } from './LocalUIFilters';
-import { RumDashboard } from './RumDashboard';
+import { LocalUIFilters } from './local_ui_filters';
+import { RumDashboard } from './rum_dashboard';
export function RumOverview() {
useTrackPageview({ app: 'ux', path: 'home' });
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/index.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/index.tsx
index 655bf93e4fb934..1c54713125c7ea 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/index.tsx
@@ -16,7 +16,7 @@ import {
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { ESFilter } from 'src/core/types/elasticsearch';
-import { useLocalUIFilters } from '../hooks/useLocalUIFilters';
+import { useLocalUIFilters } from '../hooks/use_local_ui_filters';
import {
uxFiltersByName,
UxLocalUIFilterName,
@@ -24,8 +24,8 @@ import {
} from '../../../../../common/ux_ui_filter';
import { useBreakpoints } from '../../../../hooks/use_breakpoints';
import { FieldValueSuggestions } from '../../../../../../observability/public';
-import { URLFilter } from '../URLFilter';
-import { SelectedFilters } from './SelectedFilters';
+import { URLFilter } from '../url_filter';
+import { SelectedFilters } from './selected_filters';
import {
SERVICE_NAME,
TRANSACTION_TYPE,
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/queries.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/queries.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/queries.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/queries.ts
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/SelectedFilters.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/selected_filters.tsx
similarity index 98%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/SelectedFilters.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/selected_filters.tsx
index d9f9154c5c100e..787bcd88266e23 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/SelectedFilters.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/selected_filters.tsx
@@ -11,7 +11,7 @@ import { i18n } from '@kbn/i18n';
import styled from 'styled-components';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
import { FilterValueLabel } from '../../../../../../observability/public';
-import { FiltersUIHook } from '../hooks/useLocalUIFilters';
+import { FiltersUIHook } from '../hooks/use_local_ui_filters';
import { UxLocalUIFilterName } from '../../../../../common/ux_ui_filter';
import { IndexPattern } from '../../../../../../../../src/plugins/data/common';
import { SelectedWildcards } from './selected_wildcards';
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/selected_wildcards.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/selected_wildcards.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/selected_wildcards.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/selected_wildcards.tsx
index 6a9dfd1fddd11a..d18381cee77af1 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/selected_wildcards.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/selected_wildcards.tsx
@@ -10,7 +10,7 @@ import { useCallback } from 'react';
import { useHistory } from 'react-router-dom';
import { FilterValueLabel } from '../../../../../../observability/public';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
-import { fromQuery, toQuery } from '../../../shared/Links/url_helpers';
+import { fromQuery, toQuery } from '../../../shared/links/url_helpers';
import { TRANSACTION_URL } from '../../../../../common/elasticsearch_fieldnames';
import { IndexPattern } from '../../../../../../../../src/plugins/data_views/common';
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/use_data_view.test.js b/x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/use_data_view.test.js
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/use_data_view.test.js
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/use_data_view.test.js
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/use_data_view.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/use_data_view.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/use_data_view.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/local_ui_filters/use_data_view.ts
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/PageLoadDistribution/BreakdownSeries.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/breakdown_series.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/PageLoadDistribution/BreakdownSeries.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/breakdown_series.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/PageLoadDistribution/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/index.tsx
similarity index 95%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/PageLoadDistribution/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/index.tsx
index 0daf620dc50098..e8e24c121ea6d5 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/PageLoadDistribution/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/index.tsx
@@ -17,10 +17,10 @@ import { FormattedMessage } from '@kbn/i18n-react';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
import { useFetcher } from '../../../../hooks/use_fetcher';
import { I18LABELS } from '../translations';
-import { BreakdownFilter } from '../Breakdowns/BreakdownFilter';
-import { PageLoadDistChart } from '../Charts/PageLoadDistChart';
+import { BreakdownFilter } from '../breakdowns/breakdown_filter';
+import { PageLoadDistChart } from '../charts/page_load_dist_chart';
import { BreakdownItem } from '../../../../../typings/ui_filters';
-import { ResetPercentileZoom } from './ResetPercentileZoom';
+import { ResetPercentileZoom } from './reset_percentile_zoom';
import { createExploratoryViewUrl } from '../../../../../../observability/public';
import { useKibana } from '../../../../../../../../src/plugins/kibana_react/public';
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/PageLoadDistribution/PercentileAnnotations.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/percentile_annotations.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/PageLoadDistribution/PercentileAnnotations.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/percentile_annotations.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/PageLoadDistribution/ResetPercentileZoom.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/reset_percentile_zoom.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/PageLoadDistribution/ResetPercentileZoom.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/reset_percentile_zoom.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/PageLoadDistribution/use_breakdowns.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/use_breakdowns.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/PageLoadDistribution/use_breakdowns.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/use_breakdowns.ts
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/PageViewsTrend/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/page_views_trend/index.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/PageViewsTrend/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/page_views_trend/index.tsx
index a334c1e23892a3..2510420d3eac40 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/PageViewsTrend/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/page_views_trend/index.tsx
@@ -17,8 +17,8 @@ import { FormattedMessage } from '@kbn/i18n-react';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
import { useFetcher } from '../../../../hooks/use_fetcher';
import { I18LABELS } from '../translations';
-import { BreakdownFilter } from '../Breakdowns/BreakdownFilter';
-import { PageViewsChart } from '../Charts/PageViewsChart';
+import { BreakdownFilter } from '../breakdowns/breakdown_filter';
+import { PageViewsChart } from '../charts/page_views_chart';
import { BreakdownItem } from '../../../../../typings/ui_filters';
import { createExploratoryViewUrl } from '../../../../../../observability/public';
import { useKibana } from '../../../../../../../../src/plugins/kibana_react/public';
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/Panels/PageLoadAndViews.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/panels/page_load_and_views.tsx
similarity index 86%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/Panels/PageLoadAndViews.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/panels/page_load_and_views.tsx
index 9dd83fd1c8fd1f..1d6a65317122ca 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/Panels/PageLoadAndViews.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/panels/page_load_and_views.tsx
@@ -7,8 +7,8 @@
import React from 'react';
import { EuiFlexGroup, EuiFlexItem, EuiPanel } from '@elastic/eui';
-import { PageLoadDistribution } from '../PageLoadDistribution';
-import { PageViewsTrend } from '../PageViewsTrend';
+import { PageLoadDistribution } from '../page_load_distribution';
+import { PageViewsTrend } from '../page_views_trend';
export function PageLoadAndViews() {
return (
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/Panels/VisitorBreakdowns.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/panels/visitor_breakdowns.tsx
similarity index 86%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/Panels/VisitorBreakdowns.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/panels/visitor_breakdowns.tsx
index ff79feaa924f37..04127ec702262c 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/Panels/VisitorBreakdowns.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/panels/visitor_breakdowns.tsx
@@ -7,8 +7,8 @@
import React from 'react';
import { EuiFlexGroup, EuiFlexItem, EuiPanel } from '@elastic/eui';
-import { VisitorBreakdown } from '../VisitorBreakdown';
-import { VisitorBreakdownMap } from '../VisitorBreakdownMap';
+import { VisitorBreakdown } from '../visitor_breakdown';
+import { VisitorBreakdownMap } from '../visitor_breakdown_map';
export function VisitorBreakdownsPanel() {
return (
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/Panels/WebApplicationSelect.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/panels/web_application_select.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/Panels/WebApplicationSelect.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/panels/web_application_select.tsx
index ecba89b2651ac9..9c5494c1ea5330 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/Panels/WebApplicationSelect.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/panels/web_application_select.tsx
@@ -6,7 +6,7 @@
*/
import React from 'react';
-import { ServiceNameFilter } from '../URLFilter/ServiceNameFilter';
+import { ServiceNameFilter } from '../url_filter/service_name_filter';
import { useFetcher } from '../../../../hooks/use_fetcher';
import { RUM_AGENT_NAMES } from '../../../../../common/agent_name';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/RumDashboard.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/rum_dashboard.tsx
similarity index 76%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/RumDashboard.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/rum_dashboard.tsx
index 4ed011441c81bd..d6b454bd948f76 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/RumDashboard.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/rum_dashboard.tsx
@@ -7,12 +7,12 @@
import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
import React from 'react';
-import { UXMetrics } from './UXMetrics';
-import { ImpactfulMetrics } from './ImpactfulMetrics';
-import { PageLoadAndViews } from './Panels/PageLoadAndViews';
-import { VisitorBreakdownsPanel } from './Panels/VisitorBreakdowns';
+import { UXMetrics } from './ux_metrics';
+import { ImpactfulMetrics } from './impactful_metrics';
+import { PageLoadAndViews } from './panels/page_load_and_views';
+import { VisitorBreakdownsPanel } from './panels/visitor_breakdowns';
import { useBreakpoints } from '../../../hooks/use_breakpoints';
-import { ClientMetrics } from './ClientMetrics';
+import { ClientMetrics } from './client_metrics';
export function RumDashboard() {
const { isSmall } = useBreakpoints();
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/rum_datepicker/index.test.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/rum_datepicker/index.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/rum_datepicker/index.test.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/rum_datepicker/index.test.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/rum_datepicker/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/rum_datepicker/index.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/rum_datepicker/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/rum_datepicker/index.tsx
index 9bc18d772a4a10..4e39ad4397b41e 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/rum_datepicker/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/rum_datepicker/index.tsx
@@ -7,7 +7,7 @@
import React from 'react';
import { useUxUrlParams } from '../../../../context/url_params_context/use_ux_url_params';
import { useDateRangeRedirect } from '../../../../hooks/use_date_range_redirect';
-import { DatePicker } from '../../../shared/DatePicker';
+import { DatePicker } from '../../../shared/date_picker';
export function RumDatePicker() {
const {
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/RumHome.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/rum_home.tsx
similarity index 90%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/RumHome.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/rum_home.tsx
index 54c34121ea0cb3..bb0427d462d545 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/RumHome.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/rum_home.tsx
@@ -8,15 +8,15 @@
import React, { Fragment } from 'react';
import { i18n } from '@kbn/i18n';
import { EuiFlexGroup, EuiTitle, EuiFlexItem } from '@elastic/eui';
-import { RumOverview } from '../RumDashboard';
-import { CsmSharedContextProvider } from './CsmSharedContext';
-import { WebApplicationSelect } from './Panels/WebApplicationSelect';
+import { RumOverview } from '../rum_dashboard';
+import { CsmSharedContextProvider } from './csm_shared_context';
+import { WebApplicationSelect } from './panels/web_application_select';
import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_context';
-import { UxEnvironmentFilter } from '../../shared/EnvironmentFilter';
-import { UserPercentile } from './UserPercentile';
+import { UxEnvironmentFilter } from '../../shared/environment_filter';
+import { UserPercentile } from './user_percentile';
import { useBreakpoints } from '../../../hooks/use_breakpoints';
import { KibanaPageTemplateProps } from '../../../../../../../src/plugins/kibana_react/public';
-import { useHasRumData } from './hooks/useHasRumData';
+import { useHasRumData } from './hooks/use_has_rum_data';
import { RumDatePicker } from './rum_datepicker';
import { EmptyStateLoading } from './empty_state_loading';
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/translations.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/translations.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/translations.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/translations.ts
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/index.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/index.tsx
index cac899665d98b5..558092db4a4582 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/index.tsx
@@ -8,8 +8,8 @@
import React, { useCallback } from 'react';
import { useHistory } from 'react-router-dom';
import { omit } from 'lodash';
-import { URLSearch } from './URLSearch';
-import { fromQuery, toQuery } from '../../../shared/Links/url_helpers';
+import { URLSearch } from './url_search';
+import { fromQuery, toQuery } from '../../../shared/links/url_helpers';
import { removeUndefinedProps } from '../../../../context/url_params_context/helpers';
export function URLFilter() {
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/ServiceNameFilter/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/service_name_filter/index.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/ServiceNameFilter/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/service_name_filter/index.tsx
index f6891a5d8fb672..b3560f0ebc97b8 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/ServiceNameFilter/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/service_name_filter/index.tsx
@@ -10,7 +10,7 @@ import { i18n } from '@kbn/i18n';
import React, { useEffect, useCallback } from 'react';
import { useHistory } from 'react-router-dom';
import { useLegacyUrlParams } from '../../../../../context/url_params_context/use_url_params';
-import { fromQuery, toQuery } from '../../../../shared/Links/url_helpers';
+import { fromQuery, toQuery } from '../../../../shared/links/url_helpers';
interface Props {
serviceNames: string[];
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/url_search/index.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/url_search/index.tsx
index e34270f963599d..9ecb2f31112ea8 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/url_search/index.tsx
@@ -10,8 +10,8 @@ import { isEqual, map } from 'lodash';
import { i18n } from '@kbn/i18n';
import { useLegacyUrlParams } from '../../../../../context/url_params_context/use_url_params';
import { I18LABELS } from '../../translations';
-import { formatToSec } from '../../UXMetrics/KeyUXMetrics';
-import { getPercentileLabel } from '../../UXMetrics/translations';
+import { formatToSec } from '../../ux_metrics/key_ux_metrics';
+import { getPercentileLabel } from '../../ux_metrics/translations';
import { SelectableUrlList } from '../../../../../../../observability/public';
import { selectableRenderOptions, UrlOption } from './render_option';
import { useUrlSearch } from './use_url_search';
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/render_option.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/url_search/render_option.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/render_option.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/url_search/render_option.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/use_url_search.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/url_search/use_url_search.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/use_url_search.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/url_search/use_url_search.tsx
index 8228ab4c6e83e7..e7a025985fca7a 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/use_url_search.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/url_search/use_url_search.tsx
@@ -8,7 +8,7 @@
import useDebounce from 'react-use/lib/useDebounce';
import { useState } from 'react';
import { useFetcher } from '../../../../../hooks/use_fetcher';
-import { useUxQuery } from '../../hooks/useUxQuery';
+import { useUxQuery } from '../../hooks/use_ux_query';
import { useLegacyUrlParams } from '../../../../../context/url_params_context/use_url_params';
interface Props {
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/UserPercentile/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/user_percentile/index.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/UserPercentile/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/user_percentile/index.tsx
index 7d05b188e9bbed..a1e70f4f25d218 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/UserPercentile/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/user_percentile/index.tsx
@@ -10,7 +10,7 @@ import React, { useCallback, useEffect } from 'react';
import { EuiSelect } from '@elastic/eui';
import { useHistory } from 'react-router-dom';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
-import { fromQuery, toQuery } from '../../../shared/Links/url_helpers';
+import { fromQuery, toQuery } from '../../../shared/links/url_helpers';
import { I18LABELS } from '../translations';
const DEFAULT_P = 50;
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/utils/test_helper.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/utils/test_helper.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/utils/test_helper.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/utils/test_helper.tsx
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/FormatToSec.test.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/format_to_sec.test.ts
similarity index 94%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/FormatToSec.test.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/format_to_sec.test.ts
index ca29bb4ce29441..3bb1e8bd923f1a 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/FormatToSec.test.ts
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/format_to_sec.test.ts
@@ -5,7 +5,7 @@
* 2.0.
*/
-import { formatToSec } from './KeyUXMetrics';
+import { formatToSec } from './key_ux_metrics';
describe('FormatToSec', () => {
test('it returns the expected value', () => {
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/index.tsx
similarity index 93%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/index.tsx
index ab6843f94ee439..cc1223de7b1771 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/index.tsx
@@ -15,11 +15,11 @@ import {
EuiTitle,
} from '@elastic/eui';
import { I18LABELS } from '../translations';
-import { KeyUXMetrics } from './KeyUXMetrics';
+import { KeyUXMetrics } from './key_ux_metrics';
import { useFetcher } from '../../../../hooks/use_fetcher';
-import { useUxQuery } from '../hooks/useUxQuery';
+import { useUxQuery } from '../hooks/use_ux_query';
import { getCoreVitalsComponent } from '../../../../../../observability/public';
-import { CsmSharedContext } from '../CsmSharedContext';
+import { CsmSharedContext } from '../csm_shared_context';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
import { getPercentileLabel } from './translations';
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/KeyUXMetrics.test.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/key_ux_metrics.test.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/KeyUXMetrics.test.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/key_ux_metrics.test.tsx
index e1253b41a45f59..2f92e5efedf420 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/KeyUXMetrics.test.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/key_ux_metrics.test.tsx
@@ -8,7 +8,7 @@
import React from 'react';
import { render } from '@testing-library/react';
import * as fetcherHook from '../../../../hooks/use_fetcher';
-import { KeyUXMetrics } from './KeyUXMetrics';
+import { KeyUXMetrics } from './key_ux_metrics';
describe('KeyUXMetrics', () => {
it('renders metrics with correct formats', () => {
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/KeyUXMetrics.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/key_ux_metrics.tsx
similarity index 98%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/KeyUXMetrics.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/key_ux_metrics.tsx
index 4eaf0dccc3225f..3e1c64c484edb9 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/KeyUXMetrics.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/key_ux_metrics.tsx
@@ -22,7 +22,7 @@ import {
TBT_TOOLTIP,
} from './translations';
import { useFetcher } from '../../../../hooks/use_fetcher';
-import { useUxQuery } from '../hooks/useUxQuery';
+import { useUxQuery } from '../hooks/use_ux_query';
import { UXMetrics } from '../../../../../../observability/public';
export function formatToSec(
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/translations.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/translations.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/translations.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/ux_metrics/translations.ts
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/ux_overview_fetchers.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/ux_overview_fetchers.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/ux_overview_fetchers.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/ux_overview_fetchers.ts
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdown/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown/index.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdown/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown/index.tsx
index 7a19690a4582ef..822cb0f591bce4 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdown/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown/index.tsx
@@ -7,7 +7,7 @@
import React from 'react';
import { EuiFlexGroup, EuiFlexItem, EuiTitle, EuiSpacer } from '@elastic/eui';
-import { VisitorBreakdownChart } from '../Charts/VisitorBreakdownChart';
+import { VisitorBreakdownChart } from '../charts/visitor_breakdown_chart';
import { I18LABELS, VisitorBreakdownLabel } from '../translations';
import { useFetcher } from '../../../../hooks/use_fetcher';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/__mocks__/regions_layer.mock.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/__mocks__/regions_layer.mock.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/__mocks__/regions_layer.mock.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/__mocks__/regions_layer.mock.ts
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/__snapshots__/EmbeddedMap.test.tsx.snap b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/__snapshots__/embedded_map.test.tsx.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/__snapshots__/EmbeddedMap.test.tsx.snap
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/__snapshots__/embedded_map.test.tsx.snap
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/__snapshots__/MapToolTip.test.tsx.snap b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/__snapshots__/map_tooltip.test.tsx.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/__snapshots__/MapToolTip.test.tsx.snap
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/__snapshots__/map_tooltip.test.tsx.snap
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/__stories__/MapTooltip.stories.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/__stories__/MapTooltip.stories.tsx
similarity index 92%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/__stories__/MapTooltip.stories.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/__stories__/MapTooltip.stories.tsx
index 8263db648cd398..da4aad4102195f 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/__stories__/MapTooltip.stories.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/__stories__/MapTooltip.stories.tsx
@@ -7,10 +7,10 @@
import { storiesOf } from '@storybook/react';
import React from 'react';
-import { MapToolTip } from '../MapToolTip';
-import { COUNTRY_NAME, TRANSACTION_DURATION_COUNTRY } from '../useLayerList';
+import { MapToolTip } from '../map_tooltip';
+import { COUNTRY_NAME, TRANSACTION_DURATION_COUNTRY } from '../use_layer_list';
-storiesOf('app/RumDashboard/VisitorsRegionMap', module).add(
+storiesOf('app/rum_dashboard/VisitorsRegionMap', module).add(
'Tooltip',
() => {
const loadFeatureProps = async () => {
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/EmbeddedMap.test.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/embedded_map.test.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/EmbeddedMap.test.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/embedded_map.test.tsx
index f286f963b4fa0f..572661dc8cea4f 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/EmbeddedMap.test.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/embedded_map.test.tsx
@@ -8,7 +8,7 @@
import { render } from 'enzyme';
import React from 'react';
-import { EmbeddedMap } from './EmbeddedMap';
+import { EmbeddedMap } from './embedded_map';
import { KibanaContextProvider } from '../../../../../../../../src/plugins/kibana_react/public';
import { embeddablePluginMock } from '../../../../../../../../src/plugins/embeddable/public/mocks';
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/EmbeddedMap.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/embedded_map.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/EmbeddedMap.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/embedded_map.tsx
index 17a380f4d5e35c..32dcf3d5d34397 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/EmbeddedMap.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/embedded_map.tsx
@@ -20,12 +20,12 @@ import {
ViewMode,
isErrorEmbeddable,
} from '../../../../../../../../src/plugins/embeddable/public';
-import { useLayerList } from './useLayerList';
+import { useLayerList } from './use_layer_list';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
import { useApmPluginContext } from '../../../../context/apm_plugin/use_apm_plugin_context';
import type { RenderTooltipContentParams } from '../../../../../../maps/public';
-import { MapToolTip } from './MapToolTip';
-import { useMapFilters } from './useMapFilters';
+import { MapToolTip } from './map_tooltip';
+import { useMapFilters } from './use_map_filters';
import { EmbeddableStart } from '../../../../../../../../src/plugins/embeddable/public';
const EmbeddedPanel = styled.div`
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/index.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/index.tsx
similarity index 93%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/index.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/index.tsx
index 142337ef3e160d..253f989b389a8d 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/index.tsx
@@ -7,7 +7,7 @@
import React from 'react';
import { EuiTitle, EuiSpacer } from '@elastic/eui';
-import { EmbeddedMap } from './EmbeddedMap';
+import { EmbeddedMap } from './embedded_map';
import { I18LABELS } from '../translations';
export function VisitorBreakdownMap() {
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/MapToolTip.test.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/map_tooltip.test.tsx
similarity index 93%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/MapToolTip.test.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/map_tooltip.test.tsx
index be3b28f07cdaf8..6d59b15876d20e 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/MapToolTip.test.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/map_tooltip.test.tsx
@@ -8,7 +8,7 @@
import { render, shallow } from 'enzyme';
import React from 'react';
-import { MapToolTip } from './MapToolTip';
+import { MapToolTip } from './map_tooltip';
describe('Map Tooltip', () => {
test('it shallow renders', () => {
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/MapToolTip.tsx b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/map_tooltip.tsx
similarity index 99%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/MapToolTip.tsx
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/map_tooltip.tsx
index e923795fad95f1..56f1ae20144734 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/MapToolTip.tsx
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/map_tooltip.tsx
@@ -19,7 +19,7 @@ import {
REGION_NAME,
TRANSACTION_DURATION_COUNTRY,
TRANSACTION_DURATION_REGION,
-} from './useLayerList';
+} from './use_layer_list';
import type { RenderTooltipContentParams } from '../../../../../../maps/public';
import { I18LABELS } from '../translations';
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/useLayerList.test.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/use_layer_list.test.ts
similarity index 92%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/useLayerList.test.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/use_layer_list.test.ts
index 254d15f025c1b9..7c0cbf694aed7d 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/useLayerList.test.ts
+++ b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/use_layer_list.test.ts
@@ -7,7 +7,7 @@
import { renderHook } from '@testing-library/react-hooks';
import { mockLayerList } from './__mocks__/regions_layer.mock';
-import { useLayerList } from './useLayerList';
+import { useLayerList } from './use_layer_list';
describe('useLayerList', () => {
test('it returns the region layer', () => {
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/useLayerList.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/use_layer_list.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/useLayerList.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/use_layer_list.ts
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/useMapFilters.ts b/x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/use_map_filters.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/useMapFilters.ts
rename to x-pack/plugins/apm/public/components/app/rum_dashboard/visitor_breakdown_map/use_map_filters.ts
diff --git a/x-pack/plugins/apm/public/components/app/service_inventory/index.tsx b/x-pack/plugins/apm/public/components/app/service_inventory/index.tsx
index 163082cf044cd0..549ccc8e692597 100644
--- a/x-pack/plugins/apm/public/components/app/service_inventory/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_inventory/index.tsx
@@ -22,7 +22,7 @@ import { useLocalStorage } from '../../../hooks/useLocalStorage';
import { useAnyOfApmParams } from '../../../hooks/use_apm_params';
import { FETCH_STATUS, useFetcher } from '../../../hooks/use_fetcher';
import { useTimeRange } from '../../../hooks/use_time_range';
-import { useUpgradeAssistantHref } from '../../shared/Links/kibana';
+import { useUpgradeAssistantHref } from '../../shared/links/kibana';
import { SearchBar } from '../../shared/search_bar';
import { getTimeRangeComparison } from '../../shared/time_comparison/get_time_range_comparison';
import { ServiceList } from './service_list';
diff --git a/x-pack/plugins/apm/public/components/app/service_inventory/service_list/index.tsx b/x-pack/plugins/apm/public/components/app/service_inventory/service_list/index.tsx
index fe91b14e64e8ac..2d83f1f46bd388 100644
--- a/x-pack/plugins/apm/public/components/app/service_inventory/service_list/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_inventory/service_list/index.tsx
@@ -36,7 +36,7 @@ import { APIReturnType } from '../../../../services/rest/createCallApmApi';
import { unit } from '../../../../utils/style';
import { ApmRoutes } from '../../../routing/apm_route_config';
import { AggregatedTransactionsBadge } from '../../../shared/aggregated_transactions_badge';
-import { EnvironmentBadge } from '../../../shared/EnvironmentBadge';
+import { EnvironmentBadge } from '../../../shared/environment_badge';
import { ListMetric } from '../../../shared/list_metric';
import { ITableColumn, ManagedTable } from '../../../shared/managed_table';
import { ServiceLink } from '../../../shared/service_link';
diff --git a/x-pack/plugins/apm/public/components/app/service_map/Controls.tsx b/x-pack/plugins/apm/public/components/app/service_map/Controls.tsx
index a48fb77b45585c..9236d9c21a6c64 100644
--- a/x-pack/plugins/apm/public/components/app/service_map/Controls.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_map/Controls.tsx
@@ -11,9 +11,9 @@ import React, { useContext, useEffect, useState } from 'react';
import { euiStyled } from '../../../../../../../src/plugins/kibana_react/common';
import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_context';
import { useTheme } from '../../../hooks/use_theme';
-import { getLegacyApmHref } from '../../shared/Links/apm/APMLink';
+import { getLegacyApmHref } from '../../shared/links/apm/apm_link';
import { useLegacyUrlParams } from '../../../context/url_params_context/use_url_params';
-import { APMQueryParams } from '../../shared/Links/url_helpers';
+import { APMQueryParams } from '../../shared/links/url_helpers';
import { CytoscapeContext } from './Cytoscape';
import { getAnimationOptions, getNodeHeight } from './cytoscape_options';
import { useAnyOfApmParams } from '../../../hooks/use_apm_params';
diff --git a/x-pack/plugins/apm/public/components/app/service_map/Popover/anomaly_detection.tsx b/x-pack/plugins/apm/public/components/app/service_map/Popover/anomaly_detection.tsx
index 1ceb90ff838ad1..dd728be30c71a4 100644
--- a/x-pack/plugins/apm/public/components/app/service_map/Popover/anomaly_detection.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_map/Popover/anomaly_detection.tsx
@@ -26,7 +26,7 @@ import {
import { TRANSACTION_REQUEST } from '../../../../../common/transaction_types';
import { asDuration, asInteger } from '../../../../../common/utils/formatters';
import { useTheme } from '../../../../hooks/use_theme';
-import { MLSingleMetricLink } from '../../../shared/Links/MachineLearningLinks/MLSingleMetricLink';
+import { MLSingleMetricLink } from '../../../shared/links/machine_learning_links/mlsingle_metric_link';
import { popoverWidth } from '../cytoscape_options';
const HealthStatusTitle = euiStyled(EuiTitle)`
diff --git a/x-pack/plugins/apm/public/components/app/service_map/empty_prompt.tsx b/x-pack/plugins/apm/public/components/app/service_map/empty_prompt.tsx
index 6c7a8718dee584..ce9dbe7ce417f7 100644
--- a/x-pack/plugins/apm/public/components/app/service_map/empty_prompt.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_map/empty_prompt.tsx
@@ -8,7 +8,7 @@
import { EuiEmptyPrompt } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
-import { SetupInstructionsLink } from '../../shared/Links/SetupInstructionsLink';
+import { SetupInstructionsLink } from '../../shared/links/setup_instructions_link';
export function EmptyPrompt() {
return (
diff --git a/x-pack/plugins/apm/public/components/app/service_node_overview/index.tsx b/x-pack/plugins/apm/public/components/app/service_node_overview/index.tsx
index 04bb578b0c4348..0436c27cdd6b7b 100644
--- a/x-pack/plugins/apm/public/components/app/service_node_overview/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_node_overview/index.tsx
@@ -22,7 +22,7 @@ import { useApmParams } from '../../../hooks/use_apm_params';
import { useFetcher, FETCH_STATUS } from '../../../hooks/use_fetcher';
import { useTimeRange } from '../../../hooks/use_time_range';
import { truncate, unit } from '../../../utils/style';
-import { ServiceNodeMetricOverviewLink } from '../../shared/Links/apm/ServiceNodeMetricOverviewLink';
+import { ServiceNodeMetricOverviewLink } from '../../shared/links/apm/service_node_metric_overview_link';
import { ITableColumn, ManagedTable } from '../../shared/managed_table';
const INITIAL_PAGE_SIZE = 25;
diff --git a/x-pack/plugins/apm/public/components/app/service_overview/index.tsx b/x-pack/plugins/apm/public/components/app/service_overview/index.tsx
index 6f3b5c71af8109..9e5508a5810df7 100644
--- a/x-pack/plugins/apm/public/components/app/service_overview/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_overview/index.tsx
@@ -26,7 +26,7 @@ import { useApmParams } from '../../../hooks/use_apm_params';
import { AggregatedTransactionsBadge } from '../../shared/aggregated_transactions_badge';
import { useApmRouter } from '../../../hooks/use_apm_router';
import { useTimeRange } from '../../../hooks/use_time_range';
-import { replace } from '../../shared/Links/url_helpers';
+import { replace } from '../../shared/links/url_helpers';
/**
* The height a chart should be if it's next to a table with 5 rows and a title.
diff --git a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_errors_table/get_columns.tsx b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_errors_table/get_columns.tsx
index aba1073bfe9c27..fea48dee5d6c05 100644
--- a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_errors_table/get_columns.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_errors_table/get_columns.tsx
@@ -11,8 +11,8 @@ import React from 'react';
import { asInteger } from '../../../../../common/utils/formatters';
import { APIReturnType } from '../../../../services/rest/createCallApmApi';
import { SparkPlot } from '../../../shared/charts/spark_plot';
-import { ErrorDetailLink } from '../../../shared/Links/apm/ErrorDetailLink';
-import { TimestampTooltip } from '../../../shared/TimestampTooltip';
+import { ErrorDetailLink } from '../../../shared/links/apm/error_detail_link';
+import { TimestampTooltip } from '../../../shared/timestamp_tooltip';
import { TruncateWithTooltip } from '../../../shared/truncate_with_tooltip';
type ErrorGroupMainStatistics =
diff --git a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_errors_table/index.tsx b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_errors_table/index.tsx
index 28824b3b8a399d..d9658f9d5e0472 100644
--- a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_errors_table/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_errors_table/index.tsx
@@ -19,7 +19,7 @@ import { useApmServiceContext } from '../../../../context/apm_service/use_apm_se
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
import { FETCH_STATUS, useFetcher } from '../../../../hooks/use_fetcher';
import { APIReturnType } from '../../../../services/rest/createCallApmApi';
-import { ErrorOverviewLink } from '../../../shared/Links/apm/ErrorOverviewLink';
+import { ErrorOverviewLink } from '../../../shared/links/apm/error_overview_link';
import { getTimeRangeComparison } from '../../../shared/time_comparison/get_time_range_comparison';
import { OverviewTableContainer } from '../../../shared/overview_table_container';
import { getColumns } from './get_columns';
diff --git a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/get_columns.tsx b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/get_columns.tsx
index 853ea37112ad8f..ae543adf2b852c 100644
--- a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/get_columns.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/get_columns.tsx
@@ -25,8 +25,8 @@ import {
asTransactionRate,
} from '../../../../../common/utils/formatters';
import { APIReturnType } from '../../../../services/rest/createCallApmApi';
-import { MetricOverviewLink } from '../../../shared/Links/apm/MetricOverviewLink';
-import { ServiceNodeMetricOverviewLink } from '../../../shared/Links/apm/ServiceNodeMetricOverviewLink';
+import { MetricOverviewLink } from '../../../shared/links/apm/metric_overview_link';
+import { ServiceNodeMetricOverviewLink } from '../../../shared/links/apm/service_node_metric_overview_link';
import { ListMetric } from '../../../shared/list_metric';
import { getLatencyColumnLabel } from '../../../shared/transactions_table/get_latency_column_label';
import { TruncateWithTooltip } from '../../../shared/truncate_with_tooltip';
diff --git a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/instance_actions_menu/index.tsx b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/instance_actions_menu/index.tsx
index e5e460e3b28123..932f2f5d215e78 100644
--- a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/instance_actions_menu/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/instance_actions_menu/index.tsx
@@ -20,8 +20,8 @@ import { SERVICE_NODE_NAME } from '../../../../../../common/elasticsearch_fieldn
import { useApmPluginContext } from '../../../../../context/apm_plugin/use_apm_plugin_context';
import { FETCH_STATUS } from '../../../../../hooks/use_fetcher';
import { pushNewItemToKueryBar } from '../../../../shared/kuery_bar/utils';
-import { useMetricOverviewHref } from '../../../../shared/Links/apm/MetricOverviewLink';
-import { useServiceNodeMetricOverviewHref } from '../../../../shared/Links/apm/ServiceNodeMetricOverviewLink';
+import { useMetricOverviewHref } from '../../../../shared/links/apm/metric_overview_link';
+import { useServiceNodeMetricOverviewHref } from '../../../../shared/links/apm/service_node_metric_overview_link';
import { useInstanceDetailsFetcher } from '../use_instance_details_fetcher';
import { getMenuSections } from './menu_sections';
diff --git a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/instance_actions_menu/menu_sections.ts b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/instance_actions_menu/menu_sections.ts
index 7e7f30065c9585..7a537125203ead 100644
--- a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/instance_actions_menu/menu_sections.ts
+++ b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/instance_actions_menu/menu_sections.ts
@@ -9,7 +9,7 @@ import { i18n } from '@kbn/i18n';
import { IBasePath } from 'kibana/public';
import moment from 'moment';
import { APIReturnType } from '../../../../../services/rest/createCallApmApi';
-import { getInfraHref } from '../../../../shared/Links/InfraLink';
+import { getInfraHref } from '../../../../shared/links/infra_link';
import {
Action,
getNonEmptySections,
diff --git a/x-pack/plugins/apm/public/components/app/trace_overview/trace_list.tsx b/x-pack/plugins/apm/public/components/app/trace_overview/trace_list.tsx
index 40283ae1929473..e5f3c7bcbee4e7 100644
--- a/x-pack/plugins/apm/public/components/app/trace_overview/trace_list.tsx
+++ b/x-pack/plugins/apm/public/components/app/trace_overview/trace_list.tsx
@@ -18,9 +18,9 @@ import {
import { useApmParams } from '../../../hooks/use_apm_params';
import { APIReturnType } from '../../../services/rest/createCallApmApi';
import { truncate } from '../../../utils/style';
-import { EmptyMessage } from '../../shared/EmptyMessage';
-import { ImpactBar } from '../../shared/ImpactBar';
-import { TransactionDetailLink } from '../../shared/Links/apm/transaction_detail_link';
+import { EmptyMessage } from '../../shared/empty_message';
+import { ImpactBar } from '../../shared/impact_bar';
+import { TransactionDetailLink } from '../../shared/links/apm/transaction_detail_link';
import { ITableColumn, ManagedTable } from '../../shared/managed_table';
import { ServiceLink } from '../../shared/service_link';
import { TruncateWithTooltip } from '../../shared/truncate_with_tooltip';
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/distribution/index.test.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/distribution/index.test.tsx
index 8430e620f59abe..1e4d1816bf84af 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/distribution/index.test.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/distribution/index.test.tsx
@@ -21,7 +21,7 @@ import {
MockApmPluginContextWrapper,
} from '../../../../context/apm_plugin/mock_apm_plugin_context';
import * as useFetcherModule from '../../../../hooks/use_fetcher';
-import { fromQuery } from '../../../shared/Links/url_helpers';
+import { fromQuery } from '../../../shared/links/url_helpers';
import { getFormattedSelection, TransactionDistribution } from './index';
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/distribution/index.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/distribution/index.tsx
index a2f6fd493313f2..7d387a39f9334a 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/distribution/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/distribution/index.tsx
@@ -33,7 +33,7 @@ import { useWaterfallFetcher } from '../use_waterfall_fetcher';
import { WaterfallWithSummary } from '../waterfall_with_summary';
import { useTransactionDistributionChartData } from './use_transaction_distribution_chart_data';
-import { HeightRetainer } from '../../../shared/HeightRetainer';
+import { HeightRetainer } from '../../../shared/height_retainer';
import { ChartTitleToolTip } from '../../correlations/chart_title_tool_tip';
// Enforce min height so it's consistent across all tabs on the same level
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/index.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/index.tsx
index cf8d69410d26b0..45c9d30419e857 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/index.tsx
@@ -16,7 +16,7 @@ import { useApmRouter } from '../../../hooks/use_apm_router';
import { useTimeRange } from '../../../hooks/use_time_range';
import { AggregatedTransactionsBadge } from '../../shared/aggregated_transactions_badge';
import { TransactionCharts } from '../../shared/charts/transaction_charts';
-import { replace } from '../../shared/Links/url_helpers';
+import { replace } from '../../shared/links/url_helpers';
import { TransactionDetailsTabs } from './transaction_details_tabs';
export function TransactionDetails() {
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/transaction_details_tabs.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/transaction_details_tabs.tsx
index 9f7d2977dfa843..5e9f1f8149d9d7 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/transaction_details_tabs.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/transaction_details_tabs.tsx
@@ -18,7 +18,7 @@ import { useApmParams } from '../../../hooks/use_apm_params';
import { useTransactionTraceSamplesFetcher } from '../../../hooks/use_transaction_trace_samples_fetcher';
import { maybe } from '../../../../common/utils/maybe';
-import { fromQuery, push, toQuery } from '../../shared/Links/url_helpers';
+import { fromQuery, push, toQuery } from '../../shared/links/url_helpers';
import { failedTransactionsCorrelationsTab } from './failed_transactions_correlations_tab';
import { latencyCorrelationsTab } from './latency_correlations_tab';
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/use_waterfall_fetcher.ts b/x-pack/plugins/apm/public/components/app/transaction_details/use_waterfall_fetcher.ts
index 4f26a5875347ca..c35de9d5109513 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/use_waterfall_fetcher.ts
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/use_waterfall_fetcher.ts
@@ -10,7 +10,7 @@ import { useLegacyUrlParams } from '../../../context/url_params_context/use_url_
import { useApmParams } from '../../../hooks/use_apm_params';
import { useFetcher } from '../../../hooks/use_fetcher';
import { useTimeRange } from '../../../hooks/use_time_range';
-import { getWaterfall } from './waterfall_with_summary/waterfall_container/Waterfall/waterfall_helpers/waterfall_helpers';
+import { getWaterfall } from './waterfall_with_summary/waterfall_container/waterfall/waterfall_helpers/waterfall_helpers';
const INITIAL_DATA = {
errorDocs: [],
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/index.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/index.tsx
index 1c421032ac7d3d..f528ce17c02f03 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/index.tsx
@@ -17,14 +17,14 @@ import { i18n } from '@kbn/i18n';
import React, { useEffect, useState } from 'react';
import { useHistory } from 'react-router-dom';
import type { ApmUrlParams } from '../../../../context/url_params_context/types';
-import { fromQuery, toQuery } from '../../../shared/Links/url_helpers';
-import { LoadingStatePrompt } from '../../../shared/LoadingStatePrompt';
-import { TransactionSummary } from '../../../shared/Summary/TransactionSummary';
-import { TransactionActionMenu } from '../../../shared/transaction_action_menu/TransactionActionMenu';
+import { fromQuery, toQuery } from '../../../shared/links/url_helpers';
+import { LoadingStatePrompt } from '../../../shared/loading_state_prompt';
+import { TransactionSummary } from '../../../shared/summary/transaction_summary';
+import { TransactionActionMenu } from '../../../shared/transaction_action_menu/transaction_action_menu';
import type { TraceSample } from '../../../../hooks/use_transaction_trace_samples_fetcher';
-import { MaybeViewTraceLink } from './MaybeViewTraceLink';
-import { TransactionTabs } from './TransactionTabs';
-import { IWaterfall } from './waterfall_container/Waterfall/waterfall_helpers/waterfall_helpers';
+import { MaybeViewTraceLink } from './maybe_view_trace_link';
+import { TransactionTabs } from './transaction_tabs';
+import { IWaterfall } from './waterfall_container/waterfall/waterfall_helpers/waterfall_helpers';
import { useApmParams } from '../../../../hooks/use_apm_params';
interface Props {
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/MaybeViewTraceLink.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/maybe_view_trace_link.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/MaybeViewTraceLink.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/maybe_view_trace_link.tsx
index b146afae539079..dfc89f78e4b3b7 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/MaybeViewTraceLink.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/maybe_view_trace_link.tsx
@@ -11,8 +11,8 @@ import React from 'react';
import { getNextEnvironmentUrlParam } from '../../../../../common/environment_filter_values';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
import { Transaction as ITransaction } from '../../../../../typings/es_schemas/ui/transaction';
-import { TransactionDetailLink } from '../../../shared/Links/apm/transaction_detail_link';
-import { IWaterfall } from './waterfall_container/Waterfall/waterfall_helpers/waterfall_helpers';
+import { TransactionDetailLink } from '../../../shared/links/apm/transaction_detail_link';
+import { IWaterfall } from './waterfall_container/waterfall/waterfall_helpers/waterfall_helpers';
import { Environment } from '../../../../../common/environment_rt';
export function MaybeViewTraceLink({
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/PercentOfParent.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/percent_of_parent.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/PercentOfParent.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/percent_of_parent.tsx
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/TransactionTabs.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/transaction_tabs.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/TransactionTabs.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/transaction_tabs.tsx
index 0e01c44b3fb5a5..c5001e25b0801d 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/TransactionTabs.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/transaction_tabs.tsx
@@ -12,10 +12,10 @@ import { useHistory } from 'react-router-dom';
import { LogStream } from '../../../../../../infra/public';
import { Transaction } from '../../../../../typings/es_schemas/ui/transaction';
import type { ApmUrlParams } from '../../../../context/url_params_context/types';
-import { fromQuery, toQuery } from '../../../shared/Links/url_helpers';
-import { TransactionMetadata } from '../../../shared/MetadataTable/TransactionMetadata';
+import { fromQuery, toQuery } from '../../../shared/links/url_helpers';
+import { TransactionMetadata } from '../../../shared/metadata_table/transaction_metadata';
import { WaterfallContainer } from './waterfall_container';
-import { IWaterfall } from './waterfall_container/Waterfall/waterfall_helpers/waterfall_helpers';
+import { IWaterfall } from './waterfall_container/waterfall/waterfall_helpers/waterfall_helpers';
interface Props {
transaction: Transaction;
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/index.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/index.tsx
index 6ef7651a1e4048..71e4b6a6f1aad2 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/index.tsx
@@ -11,9 +11,9 @@ import type { ApmUrlParams } from '../../../../../context/url_params_context/typ
import {
IWaterfall,
WaterfallLegendType,
-} from './Waterfall/waterfall_helpers/waterfall_helpers';
-import { Waterfall } from './Waterfall';
-import { WaterfallLegends } from './WaterfallLegends';
+} from './waterfall/waterfall_helpers/waterfall_helpers';
+import { Waterfall } from './waterfall';
+import { WaterfallLegends } from './waterfall_legends';
import { useApmServiceContext } from '../../../../../context/apm_service/use_apm_service_context';
interface Props {
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_agent_marks.test.ts b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_agent_marks.test.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_agent_marks.test.ts
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_agent_marks.test.ts
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_agent_marks.ts b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_agent_marks.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_agent_marks.ts
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_agent_marks.ts
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_error_marks.test.ts b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_error_marks.test.ts
similarity index 97%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_error_marks.test.ts
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_error_marks.test.ts
index 62507efc64401f..5331ae1ae3d36a 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_error_marks.test.ts
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_error_marks.test.ts
@@ -5,7 +5,7 @@
* 2.0.
*/
-import { IWaterfallError } from '../Waterfall/waterfall_helpers/waterfall_helpers';
+import { IWaterfallError } from '../waterfall/waterfall_helpers/waterfall_helpers';
import { getErrorMarks } from './get_error_marks';
describe('getErrorMarks', () => {
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_error_marks.ts b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_error_marks.ts
similarity index 93%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_error_marks.ts
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_error_marks.ts
index 1012c3dfa6fd15..25baf42572d063 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_error_marks.ts
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_error_marks.ts
@@ -7,7 +7,7 @@
import { isEmpty } from 'lodash';
import { ErrorRaw } from '../../../../../../../typings/es_schemas/raw/error_raw';
-import { IWaterfallError } from '../Waterfall/waterfall_helpers/waterfall_helpers';
+import { IWaterfallError } from '../waterfall/waterfall_helpers/waterfall_helpers';
import { Mark } from '.';
export interface ErrorMark extends Mark {
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/index.ts b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/index.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Marks/index.ts
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/marks/index.ts
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/accordion_waterfall.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/accordion_waterfall.tsx
similarity index 98%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/accordion_waterfall.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/accordion_waterfall.tsx
index 25b306723b2d20..6ca1a78db28b19 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/accordion_waterfall.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/accordion_waterfall.tsx
@@ -15,7 +15,7 @@ import {
} from '@elastic/eui';
import React, { Dispatch, SetStateAction, useState } from 'react';
import { euiStyled } from '../../../../../../../../../../src/plugins/kibana_react/common';
-import { Margins } from '../../../../../shared/charts/Timeline';
+import { Margins } from '../../../../../shared/charts/timeline';
import {
IWaterfall,
IWaterfallSpanOrTransaction,
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/failure_badge.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/failure_badge.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/failure_badge.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/failure_badge.tsx
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/FlyoutTopLevelProperties.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/flyout_top_level_properties.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/FlyoutTopLevelProperties.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/flyout_top_level_properties.tsx
index c81dfb6283c94d..20e278000266a9 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/FlyoutTopLevelProperties.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/flyout_top_level_properties.tsx
@@ -15,7 +15,7 @@ import { getNextEnvironmentUrlParam } from '../../../../../../../common/environm
import { Transaction } from '../../../../../../../typings/es_schemas/ui/transaction';
import { useLegacyUrlParams } from '../../../../../../context/url_params_context/use_url_params';
import { useApmParams } from '../../../../../../hooks/use_apm_params';
-import { TransactionDetailLink } from '../../../../../shared/Links/apm/transaction_detail_link';
+import { TransactionDetailLink } from '../../../../../shared/links/apm/transaction_detail_link';
import { ServiceLink } from '../../../../../shared/service_link';
import { StickyProperties } from '../../../../../shared/sticky_properties';
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/index.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/index.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/index.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/index.tsx
index 50ec934961e1ae..c64a121c91882a 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/index.tsx
@@ -11,10 +11,10 @@ import { History } from 'history';
import React, { useState } from 'react';
import { useHistory } from 'react-router-dom';
import { euiStyled } from '../../../../../../../../../../src/plugins/kibana_react/common';
-import { Timeline } from '../../../../../shared/charts/Timeline';
-import { fromQuery, toQuery } from '../../../../../shared/Links/url_helpers';
-import { getAgentMarks } from '../Marks/get_agent_marks';
-import { getErrorMarks } from '../Marks/get_error_marks';
+import { Timeline } from '../../../../../shared/charts/timeline';
+import { fromQuery, toQuery } from '../../../../../shared/links/url_helpers';
+import { getAgentMarks } from '../marks/get_agent_marks';
+import { getErrorMarks } from '../marks/get_error_marks';
import { AccordionWaterfall } from './accordion_waterfall';
import { WaterfallFlyout } from './waterfall_flyout';
import {
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/ResponsiveFlyout.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/responsive_flyout.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/ResponsiveFlyout.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/responsive_flyout.tsx
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/index.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/index.tsx
similarity index 92%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/index.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/index.tsx
index 457daef851bcfb..57bfc2b61fc536 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/index.tsx
@@ -22,18 +22,18 @@ import {
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React, { Fragment } from 'react';
-import { CompositeSpanDurationSummaryItem } from '../../../../../../shared/Summary/CompositeSpanDurationSummaryItem';
+import { CompositeSpanDurationSummaryItem } from '../../../../../../shared/summary/composite_span_duration_summary_item';
import { euiStyled } from '../../../../../../../../../../../src/plugins/kibana_react/common';
import { Span } from '../../../../../../../../typings/es_schemas/ui/span';
import { Transaction } from '../../../../../../../../typings/es_schemas/ui/transaction';
-import { DiscoverSpanLink } from '../../../../../../shared/Links/DiscoverLinks/DiscoverSpanLink';
-import { SpanMetadata } from '../../../../../../shared/MetadataTable/SpanMetadata';
-import { Stacktrace } from '../../../../../../shared/Stacktrace';
-import { Summary } from '../../../../../../shared/Summary';
-import { DurationSummaryItem } from '../../../../../../shared/Summary/DurationSummaryItem';
-import { HttpInfoSummaryItem } from '../../../../../../shared/Summary/http_info_summary_item';
-import { TimestampTooltip } from '../../../../../../shared/TimestampTooltip';
-import { ResponsiveFlyout } from '../ResponsiveFlyout';
+import { DiscoverSpanLink } from '../../../../../../shared/links/discover_links/discover_span_link';
+import { SpanMetadata } from '../../../../../../shared/metadata_table/span_metadata';
+import { Stacktrace } from '../../../../../../shared/stacktrace';
+import { Summary } from '../../../../../../shared/summary';
+import { DurationSummaryItem } from '../../../../../../shared/summary/duration_summary_item';
+import { HttpInfoSummaryItem } from '../../../../../../shared/summary/http_info_summary_item';
+import { TimestampTooltip } from '../../../../../../shared/timestamp_tooltip';
+import { ResponsiveFlyout } from '../responsive_flyout';
import { SyncBadge } from '../sync_badge';
import { SpanDatabase } from './span_db';
import { StickySpanProperties } from './sticky_span_properties';
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/span_db.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/span_db.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/span_db.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/span_db.tsx
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/span_flyout.stories.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/span_flyout.stories.tsx
similarity index 99%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/span_flyout.stories.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/span_flyout.stories.tsx
index 33a0069e19ef17..f87967f762f25e 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/span_flyout.stories.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/span_flyout.stories.tsx
@@ -14,7 +14,7 @@ import { SpanFlyout } from './';
type Args = ComponentProps;
export default {
- title: 'app/TransactionDetails/Waterfall/SpanFlyout',
+ title: 'app/TransactionDetails/waterfall/SpanFlyout',
component: SpanFlyout,
decorators: [
(StoryComponent: ComponentType) => {
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/sticky_span_properties.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/sticky_span_properties.tsx
similarity index 99%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/sticky_span_properties.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/sticky_span_properties.tsx
index 9e7a32a6808ec9..3067b335f4861b 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/sticky_span_properties.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/sticky_span_properties.tsx
@@ -23,7 +23,7 @@ import { Span } from '../../../../../../../../typings/es_schemas/ui/span';
import { Transaction } from '../../../../../../../../typings/es_schemas/ui/transaction';
import { useApmParams } from '../../../../../../../hooks/use_apm_params';
import { BackendLink } from '../../../../../../shared/backend_link';
-import { TransactionDetailLink } from '../../../../../../shared/Links/apm/transaction_detail_link';
+import { TransactionDetailLink } from '../../../../../../shared/links/apm/transaction_detail_link';
import { ServiceLink } from '../../../../../../shared/service_link';
import { StickyProperties } from '../../../../../../shared/sticky_properties';
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/truncate_height_section.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/truncate_height_section.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/truncate_height_section.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/span_flyout/truncate_height_section.tsx
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/sync_badge.stories.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/sync_badge.stories.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/sync_badge.stories.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/sync_badge.stories.tsx
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/sync_badge.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/sync_badge.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/sync_badge.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/sync_badge.tsx
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/transaction_flyout/DroppedSpansWarning.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/transaction_flyout/dropped_spans_warning.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/transaction_flyout/DroppedSpansWarning.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/transaction_flyout/dropped_spans_warning.tsx
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/transaction_flyout/index.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/transaction_flyout/index.tsx
similarity index 85%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/transaction_flyout/index.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/transaction_flyout/index.tsx
index 6468e6ed1e2c8c..5f1e0cacd8483c 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/transaction_flyout/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/transaction_flyout/index.tsx
@@ -18,12 +18,12 @@ import {
import { i18n } from '@kbn/i18n';
import React from 'react';
import { Transaction } from '../../../../../../../../typings/es_schemas/ui/transaction';
-import { TransactionActionMenu } from '../../../../../../shared/transaction_action_menu/TransactionActionMenu';
-import { TransactionSummary } from '../../../../../../shared/Summary/TransactionSummary';
-import { FlyoutTopLevelProperties } from '../FlyoutTopLevelProperties';
-import { ResponsiveFlyout } from '../ResponsiveFlyout';
-import { TransactionMetadata } from '../../../../../../shared/MetadataTable/TransactionMetadata';
-import { DroppedSpansWarning } from './DroppedSpansWarning';
+import { TransactionActionMenu } from '../../../../../../shared/transaction_action_menu/transaction_action_menu';
+import { TransactionSummary } from '../../../../../../shared/summary/transaction_summary';
+import { FlyoutTopLevelProperties } from '../flyout_top_level_properties';
+import { ResponsiveFlyout } from '../responsive_flyout';
+import { TransactionMetadata } from '../../../../../../shared/metadata_table/transaction_metadata';
+import { DroppedSpansWarning } from './dropped_spans_warning';
interface Props {
onClose: () => void;
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/transaction_flyout/transaction_flyout.stories.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/transaction_flyout/transaction_flyout.stories.tsx
similarity index 98%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/transaction_flyout/transaction_flyout.stories.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/transaction_flyout/transaction_flyout.stories.tsx
index 33f1de91b61cca..7f8fbf62130b3d 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/transaction_flyout/transaction_flyout.stories.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/transaction_flyout/transaction_flyout.stories.tsx
@@ -14,7 +14,7 @@ import { TransactionFlyout } from './';
type Args = ComponentProps;
export default {
- title: 'app/TransactionDetails/Waterfall/TransactionFlyout',
+ title: 'app/TransactionDetails/waterfall/TransactionFlyout',
component: TransactionFlyout,
decorators: [
(StoryComponent: ComponentType) => {
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_flyout.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_flyout.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_flyout.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_flyout.tsx
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_helpers/__snapshots__/waterfall_helpers.test.ts.snap b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_helpers/__snapshots__/waterfall_helpers.test.ts.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_helpers/__snapshots__/waterfall_helpers.test.ts.snap
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_helpers/__snapshots__/waterfall_helpers.test.ts.snap
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_helpers/mock_responses/spans.json b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_helpers/mock_responses/spans.json
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_helpers/mock_responses/spans.json
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_helpers/mock_responses/spans.json
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_helpers/mock_responses/transaction.json b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_helpers/mock_responses/transaction.json
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_helpers/mock_responses/transaction.json
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_helpers/mock_responses/transaction.json
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_helpers/waterfall_helpers.test.ts b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_helpers/waterfall_helpers.test.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_helpers/waterfall_helpers.test.ts
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_helpers/waterfall_helpers.test.ts
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_helpers/waterfall_helpers.ts b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_helpers/waterfall_helpers.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_helpers/waterfall_helpers.ts
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_helpers/waterfall_helpers.ts
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_item.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_item.tsx
similarity index 99%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_item.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_item.tsx
index c9e6e08ac759fe..056a2847c68bf8 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_item.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_item.tsx
@@ -16,7 +16,7 @@ import {
TRANSACTION_ID,
} from '../../../../../../../common/elasticsearch_fieldnames';
import { asDuration } from '../../../../../../../common/utils/formatters';
-import { Margins } from '../../../../../shared/charts/Timeline';
+import { Margins } from '../../../../../shared/charts/timeline';
import { TruncateWithTooltip } from '../../../../../shared/truncate_with_tooltip';
import { SyncBadge } from './sync_badge';
import { IWaterfallSpanOrTransaction } from './waterfall_helpers/waterfall_helpers';
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall_container.stories.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall_container.stories.tsx
index 895b83136a0978..312412a8cf8273 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall_container.stories.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall_container.stories.tsx
@@ -10,7 +10,7 @@ import React, { ComponentProps } from 'react';
import { MemoryRouter } from 'react-router-dom';
import { MockApmPluginContextWrapper } from '../../../../../context/apm_plugin/mock_apm_plugin_context';
import { WaterfallContainer } from './index';
-import { getWaterfall } from './Waterfall/waterfall_helpers/waterfall_helpers';
+import { getWaterfall } from './waterfall/waterfall_helpers/waterfall_helpers';
import {
inferredSpans,
manyChildrenWithSameLength,
@@ -23,7 +23,7 @@ import {
type Args = ComponentProps;
const stories: Meta = {
- title: 'app/TransactionDetails/Waterfall',
+ title: 'app/TransactionDetails/waterfall',
component: WaterfallContainer,
decorators: [
(StoryComponent) => (
diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/WaterfallLegends.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall_legends.tsx
similarity index 92%
rename from x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/WaterfallLegends.tsx
rename to x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall_legends.tsx
index aaa9b3e45ee22f..30d4b0049d1bd2 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/WaterfallLegends.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall_legends.tsx
@@ -10,11 +10,11 @@ import { EuiFlexItem } from '@elastic/eui';
import { EuiTitle } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
-import { Legend } from '../../../../shared/charts/Timeline/legend';
+import { Legend } from '../../../../shared/charts/timeline/legend';
import {
IWaterfallLegend,
WaterfallLegendType,
-} from './Waterfall/waterfall_helpers/waterfall_helpers';
+} from './waterfall/waterfall_helpers/waterfall_helpers';
interface Props {
legends: IWaterfallLegend[];
diff --git a/x-pack/plugins/apm/public/components/app/transaction_overview/index.tsx b/x-pack/plugins/apm/public/components/app/transaction_overview/index.tsx
index e1d6fb65bbc569..39d522ca088fcf 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_overview/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_overview/index.tsx
@@ -13,7 +13,7 @@ import { useApmParams } from '../../../hooks/use_apm_params';
import { useTimeRange } from '../../../hooks/use_time_range';
import { AggregatedTransactionsBadge } from '../../shared/aggregated_transactions_badge';
import { TransactionCharts } from '../../shared/charts/transaction_charts';
-import { replace } from '../../shared/Links/url_helpers';
+import { replace } from '../../shared/links/url_helpers';
import { TransactionsTable } from '../../shared/transactions_table';
export function TransactionOverview() {
diff --git a/x-pack/plugins/apm/public/components/app/transaction_overview/transaction_overview.test.tsx b/x-pack/plugins/apm/public/components/app/transaction_overview/transaction_overview.test.tsx
index a1b24fc5166642..ede47a65d7ea56 100644
--- a/x-pack/plugins/apm/public/components/app/transaction_overview/transaction_overview.test.tsx
+++ b/x-pack/plugins/apm/public/components/app/transaction_overview/transaction_overview.test.tsx
@@ -21,7 +21,7 @@ import {
disableConsoleWarning,
renderWithTheme,
} from '../../../utils/testHelpers';
-import { fromQuery } from '../../shared/Links/url_helpers';
+import { fromQuery } from '../../shared/links/url_helpers';
import { TransactionOverview } from './';
const KibanaReactContext = createKibanaReactContext({
diff --git a/x-pack/plugins/apm/public/components/routing/app_root.tsx b/x-pack/plugins/apm/public/components/routing/app_root.tsx
index 5750146bef722b..c7b98743c6bea9 100644
--- a/x-pack/plugins/apm/public/components/routing/app_root.tsx
+++ b/x-pack/plugins/apm/public/components/routing/app_root.tsx
@@ -20,7 +20,7 @@ import {
HeaderMenuPortal,
InspectorContextProvider,
} from '../../../../observability/public';
-import { ScrollToTopOnPathChange } from '../../components/app/Main/ScrollToTopOnPathChange';
+import { ScrollToTopOnPathChange } from '../../components/app/main/ScrollToTopOnPathChange';
import { AnomalyDetectionJobsContextProvider } from '../../context/anomaly_detection_jobs/anomaly_detection_jobs_context';
import {
ApmPluginContext,
diff --git a/x-pack/plugins/apm/public/components/routing/service_detail/index.tsx b/x-pack/plugins/apm/public/components/routing/service_detail/index.tsx
index d8a996d2163bca..713292c6338912 100644
--- a/x-pack/plugins/apm/public/components/routing/service_detail/index.tsx
+++ b/x-pack/plugins/apm/public/components/routing/service_detail/index.tsx
@@ -27,6 +27,7 @@ import { TransactionDetails } from '../../app/transaction_details';
import { ServiceProfiling } from '../../app/service_profiling';
import { ServiceDependencies } from '../../app/service_dependencies';
import { ServiceLogs } from '../../app/service_logs';
+import { InfraOverview } from '../../app/infra_overview';
function page({
path,
@@ -265,6 +266,17 @@ export const serviceDetail = {
}),
element: ,
}),
+ page({
+ path: '/services/{serviceName}/infra',
+ tab: 'infra',
+ title: i18n.translate('xpack.apm.views.infra.title', {
+ defaultMessage: 'Infrastructure',
+ }),
+ element: ,
+ searchBarOptions: {
+ hidden: true,
+ },
+ }),
{
path: '/services/{serviceName}/',
element: ,
diff --git a/x-pack/plugins/apm/public/components/routing/templates/apm_main_template.tsx b/x-pack/plugins/apm/public/components/routing/templates/apm_main_template.tsx
index 710b4b6f71a35f..fcc69c5055bad4 100644
--- a/x-pack/plugins/apm/public/components/routing/templates/apm_main_template.tsx
+++ b/x-pack/plugins/apm/public/components/routing/templates/apm_main_template.tsx
@@ -15,7 +15,7 @@ import {
import { EnvironmentsContextProvider } from '../../../context/environments_context/environments_context';
import { useFetcher } from '../../../hooks/use_fetcher';
import { ApmPluginStartDeps } from '../../../plugin';
-import { ApmEnvironmentFilter } from '../../shared/EnvironmentFilter';
+import { ApmEnvironmentFilter } from '../../shared/environment_filter';
import { getNoDataConfig } from './no_data_config';
// Paths that must skip the no data screen
diff --git a/x-pack/plugins/apm/public/components/routing/templates/apm_service_template/index.tsx b/x-pack/plugins/apm/public/components/routing/templates/apm_service_template/index.tsx
index 0b97301b4e7c52..962fbb4eb6be6d 100644
--- a/x-pack/plugins/apm/public/components/routing/templates/apm_service_template/index.tsx
+++ b/x-pack/plugins/apm/public/components/routing/templates/apm_service_template/index.tsx
@@ -42,6 +42,7 @@ type Tab = NonNullable[0] & {
| 'errors'
| 'metrics'
| 'nodes'
+ | 'infra'
| 'service-map'
| 'logs'
| 'profiling';
@@ -240,6 +241,16 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) {
}),
hidden: isJVMsTabHidden({ agentName, runtimeName }),
},
+ {
+ key: 'infra',
+ href: router.link('/services/{serviceName}/infra', {
+ path: { serviceName },
+ query,
+ }),
+ label: i18n.translate('xpack.apm.home.infraTabLabel', {
+ defaultMessage: 'Infrastructure',
+ }),
+ },
{
key: 'service-map',
href: router.link('/services/{serviceName}/service-map', {
diff --git a/x-pack/plugins/apm/public/components/routing/templates/settings_template.tsx b/x-pack/plugins/apm/public/components/routing/templates/settings_template.tsx
index fc87b24579695b..43a865c0584c90 100644
--- a/x-pack/plugins/apm/public/components/routing/templates/settings_template.tsx
+++ b/x-pack/plugins/apm/public/components/routing/templates/settings_template.tsx
@@ -13,7 +13,7 @@ import { useHistory } from 'react-router-dom';
import { CoreStart } from 'kibana/public';
import { ApmMainTemplate } from './apm_main_template';
import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_context';
-import { getLegacyApmHref } from '../../shared/Links/apm/APMLink';
+import { getLegacyApmHref } from '../../shared/links/apm/apm_link';
type Tab = NonNullable[0] & {
key:
diff --git a/x-pack/plugins/apm/public/components/shared/apm_header_action_menu/anomaly_detection_setup_link.tsx b/x-pack/plugins/apm/public/components/shared/apm_header_action_menu/anomaly_detection_setup_link.tsx
index e1bda5475acc49..40335f0cab61d2 100644
--- a/x-pack/plugins/apm/public/components/shared/apm_header_action_menu/anomaly_detection_setup_link.tsx
+++ b/x-pack/plugins/apm/public/components/shared/apm_header_action_menu/anomaly_detection_setup_link.tsx
@@ -19,7 +19,7 @@ import { useAnomalyDetectionJobsContext } from '../../../context/anomaly_detecti
import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_context';
import { useApmParams } from '../../../hooks/use_apm_params';
import { useTheme } from '../../../hooks/use_theme';
-import { getLegacyApmHref } from '../Links/apm/APMLink';
+import { getLegacyApmHref } from '../links/apm/apm_link';
export function AnomalyDetectionSetupLink() {
const { query } = useApmParams('/*');
diff --git a/x-pack/plugins/apm/public/components/shared/apm_header_action_menu/index.tsx b/x-pack/plugins/apm/public/components/shared/apm_header_action_menu/index.tsx
index 655fc2da2b097c..158705970640c1 100644
--- a/x-pack/plugins/apm/public/components/shared/apm_header_action_menu/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/apm_header_action_menu/index.tsx
@@ -9,7 +9,7 @@ import { EuiHeaderLink, EuiHeaderLinks } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
import { getAlertingCapabilities } from '../../alerting/get_alerting_capabilities';
-import { getLegacyApmHref } from '../Links/apm/APMLink';
+import { getLegacyApmHref } from '../links/apm/apm_link';
import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_context';
import { AlertingPopoverAndFlyout } from './alerting_popover_flyout';
import { AnomalyDetectionSetupLink } from './anomaly_detection_setup_link';
diff --git a/x-pack/plugins/apm/public/components/shared/charts/helper/helper.ts b/x-pack/plugins/apm/public/components/shared/charts/helper/helper.ts
index 9dccddd509387b..d203bd8cfe0228 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/helper/helper.ts
+++ b/x-pack/plugins/apm/public/components/shared/charts/helper/helper.ts
@@ -8,7 +8,7 @@
import { XYBrushEvent } from '@elastic/charts';
import { History } from 'history';
import { Coordinate, TimeSeries } from '../../../../../typings/timeseries';
-import { fromQuery, toQuery } from '../../Links/url_helpers';
+import { fromQuery, toQuery } from '../../links/url_helpers';
export const onBrushEnd = ({
x,
diff --git a/x-pack/plugins/apm/public/components/shared/charts/instances_latency_distribution_chart/index.tsx b/x-pack/plugins/apm/public/components/shared/charts/instances_latency_distribution_chart/index.tsx
index 30bf5908ef3767..0e9ad848648630 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/instances_latency_distribution_chart/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/instances_latency_distribution_chart/index.tsx
@@ -31,7 +31,7 @@ import {
import { FETCH_STATUS } from '../../../../hooks/use_fetcher';
import { useTheme } from '../../../../hooks/use_theme';
import { APIReturnType } from '../../../../services/rest/createCallApmApi';
-import * as urlHelpers from '../../Links/url_helpers';
+import * as urlHelpers from '../../links/url_helpers';
import { ChartContainer } from '../chart_container';
import { getResponseTimeTickFormatter } from '../transaction_charts/helper';
import { CustomTooltip } from './custom_tooltip';
diff --git a/x-pack/plugins/apm/public/components/shared/charts/latency_chart/index.tsx b/x-pack/plugins/apm/public/components/shared/charts/latency_chart/index.tsx
index 0b4eca8b9373c7..d654cb9c0f5d36 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/latency_chart/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/latency_chart/index.tsx
@@ -24,7 +24,7 @@ import {
getResponseTimeTickFormatter,
} from '../../../shared/charts/transaction_charts/helper';
import { MLHeader } from '../../../shared/charts/transaction_charts/ml_header';
-import * as urlHelpers from '../../../shared/Links/url_helpers';
+import * as urlHelpers from '../../../shared/links/url_helpers';
import { getComparisonChartTheme } from '../../time_comparison/get_time_range_comparison';
import { useEnvironmentsContext } from '../../../../context/environments_context/use_environments_context';
import { ApmMlDetectorType } from '../../../../../common/anomaly_detection/apm_ml_detectors';
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Timeline.test.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/Timeline.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/Timeline.test.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/Timeline.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/__snapshots__/Timeline.test.tsx.snap b/x-pack/plugins/apm/public/components/shared/charts/timeline/__snapshots__/Timeline.test.tsx.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/__snapshots__/Timeline.test.tsx.snap
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/__snapshots__/Timeline.test.tsx.snap
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/index.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/index.tsx
similarity index 89%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/index.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/index.tsx
index 6c7cb7a067d2e4..4a56f1a28e4bef 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/Timeline/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/timeline/index.tsx
@@ -8,11 +8,11 @@
import PropTypes from 'prop-types';
import React, { PureComponent, ReactNode } from 'react';
import { makeWidthFlexible } from 'react-vis';
-import { AgentMark } from '../../../app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_agent_marks';
-import { ErrorMark } from '../../../app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_error_marks';
-import { getPlotValues } from './plotUtils';
+import { AgentMark } from '../../../app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_agent_marks';
+import { ErrorMark } from '../../../app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_error_marks';
+import { getPlotValues } from './plot_utils';
import { TimelineAxis } from './timeline_axis';
-import { VerticalLines } from './VerticalLines';
+import { VerticalLines } from './vertical_lines';
export type Mark = AgentMark | ErrorMark;
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/LastTickValue.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/last_tick_value.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/LastTickValue.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/last_tick_value.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/legend.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/legend.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/legend.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/legend.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/__snapshots__/agent_marker.test.tsx.snap b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/__snapshots__/agent_marker.test.tsx.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/__snapshots__/agent_marker.test.tsx.snap
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/marker/__snapshots__/agent_marker.test.tsx.snap
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/__snapshots__/index.test.tsx.snap b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/__snapshots__/index.test.tsx.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/__snapshots__/index.test.tsx.snap
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/marker/__snapshots__/index.test.tsx.snap
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/agent_marker.test.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/agent_marker.test.tsx
similarity index 93%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/agent_marker.test.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/marker/agent_marker.test.tsx
index 0b7e405ae5d953..e421190d6793cc 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/agent_marker.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/agent_marker.test.tsx
@@ -8,7 +8,7 @@
import { shallow } from 'enzyme';
import React from 'react';
import { EuiThemeProvider } from '../../../../../../../../../src/plugins/kibana_react/common';
-import { AgentMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_agent_marks';
+import { AgentMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_agent_marks';
import { AgentMarker } from './agent_marker';
describe('AgentMarker', () => {
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/agent_marker.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/agent_marker.tsx
similarity index 95%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/agent_marker.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/marker/agent_marker.tsx
index 947c7a93f38b14..9e97129b199dbc 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/agent_marker.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/agent_marker.tsx
@@ -10,7 +10,7 @@ import React from 'react';
import { euiStyled } from '../../../../../../../../../src/plugins/kibana_react/common';
import { asDuration } from '../../../../../../common/utils/formatters';
import { useTheme } from '../../../../../hooks/use_theme';
-import { AgentMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_agent_marks';
+import { AgentMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_agent_marks';
import { Legend } from '../legend';
const NameContainer = euiStyled.div`
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/error_marker.test.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/error_marker.test.tsx
similarity index 98%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/error_marker.test.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/marker/error_marker.test.tsx
index cef97c46fd2e23..d3b378ab5cb0bb 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/error_marker.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/error_marker.test.tsx
@@ -14,7 +14,7 @@ import {
expectTextsInDocument,
renderWithTheme,
} from '../../../../../utils/testHelpers';
-import { ErrorMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_error_marks';
+import { ErrorMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_error_marks';
import { ErrorMarker } from './error_marker';
function Wrapper({ children }: { children?: ReactNode }) {
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/error_marker.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/error_marker.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/error_marker.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/marker/error_marker.tsx
index a1e3f42cb56842..3f27ddbf78af47 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/error_marker.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/error_marker.tsx
@@ -15,8 +15,8 @@ import {
import { asDuration } from '../../../../../../common/utils/formatters';
import { useLegacyUrlParams } from '../../../../../context/url_params_context/use_url_params';
import { useTheme } from '../../../../../hooks/use_theme';
-import { ErrorMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_error_marks';
-import { ErrorDetailLink } from '../../../Links/apm/ErrorDetailLink';
+import { ErrorMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_error_marks';
+import { ErrorDetailLink } from '../../../links/apm/error_detail_link';
import { Legend, Shape } from '../legend';
interface Props {
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/index.test.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/index.test.tsx
similarity index 90%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/index.test.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/marker/index.test.tsx
index f2c8f9e3b318de..698801b5a8d37c 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/index.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/index.test.tsx
@@ -8,8 +8,8 @@
import { shallow } from 'enzyme';
import React from 'react';
import { Marker } from './';
-import { AgentMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_agent_marks';
-import { ErrorMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_error_marks';
+import { AgentMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_agent_marks';
+import { ErrorMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_error_marks';
describe('Marker', () => {
it('renders agent marker', () => {
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/index.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/index.tsx
similarity index 89%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/index.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/marker/index.tsx
index 88318eb0e0c2d5..e4e26ce637bfe7 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/Timeline/Marker/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/timeline/marker/index.tsx
@@ -7,8 +7,8 @@
import React from 'react';
import { euiStyled } from '../../../../../../../../../src/plugins/kibana_react/common';
-import { AgentMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_agent_marks';
-import { ErrorMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/Marks/get_error_marks';
+import { AgentMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_agent_marks';
+import { ErrorMark } from '../../../../app/transaction_details/waterfall_with_summary/waterfall_container/marks/get_error_marks';
import { AgentMarker } from './agent_marker';
import { ErrorMarker } from './error_marker';
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/plotUtils.ts b/x-pack/plugins/apm/public/components/shared/charts/timeline/plot_utils.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/plotUtils.ts
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/plot_utils.ts
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/timeline_axis.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/timeline_axis.tsx
similarity index 95%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/timeline_axis.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/timeline_axis.tsx
index cf942ebb757763..4dddb4bee226df 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/Timeline/timeline_axis.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/timeline/timeline_axis.tsx
@@ -11,9 +11,9 @@ import { XAxis, XYPlot } from 'react-vis';
import { getDurationFormatter } from '../../../../../common/utils/formatters';
import { useTheme } from '../../../../hooks/use_theme';
import { Mark } from './';
-import { LastTickValue } from './LastTickValue';
-import { Marker } from './Marker';
-import { PlotValues } from './plotUtils';
+import { LastTickValue } from './last_tick_value';
+import { Marker } from './marker';
+import { PlotValues } from './plot_utils';
// Remove any tick that is too close to topTraceDuration
const getXAxisTickValues = (
diff --git a/x-pack/plugins/apm/public/components/shared/charts/Timeline/VerticalLines.tsx b/x-pack/plugins/apm/public/components/shared/charts/timeline/vertical_lines.tsx
similarity index 95%
rename from x-pack/plugins/apm/public/components/shared/charts/Timeline/VerticalLines.tsx
rename to x-pack/plugins/apm/public/components/shared/charts/timeline/vertical_lines.tsx
index 2dcc969f661b87..6f07efeed7c46b 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/Timeline/VerticalLines.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/timeline/vertical_lines.tsx
@@ -8,8 +8,8 @@
import React from 'react';
import { VerticalGridLines, XYPlot } from 'react-vis';
import { useTheme } from '../../../../hooks/use_theme';
-import { Mark } from '../../../app/transaction_details/waterfall_with_summary/waterfall_container/Marks';
-import { PlotValues } from './plotUtils';
+import { Mark } from '../../../app/transaction_details/waterfall_with_summary/waterfall_container/marks';
+import { PlotValues } from './plot_utils';
interface VerticalLinesProps {
marks?: Mark[];
diff --git a/x-pack/plugins/apm/public/components/shared/charts/transaction_charts/ml_header.tsx b/x-pack/plugins/apm/public/components/shared/charts/transaction_charts/ml_header.tsx
index 76e85b1d9998d7..0ae6fc00b28044 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/transaction_charts/ml_header.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/transaction_charts/ml_header.tsx
@@ -12,7 +12,7 @@ import React from 'react';
import { euiStyled } from '../../../../../../../../src/plugins/kibana_react/common';
import { useApmServiceContext } from '../../../../context/apm_service/use_apm_service_context';
import { useApmParams } from '../../../../hooks/use_apm_params';
-import { MLSingleMetricLink } from '../../Links/MachineLearningLinks/MLSingleMetricLink';
+import { MLSingleMetricLink } from '../../links/machine_learning_links/mlsingle_metric_link';
interface Props {
hasValidMlLicense?: boolean;
diff --git a/x-pack/plugins/apm/public/components/shared/DatePicker/date_picker.test.tsx b/x-pack/plugins/apm/public/components/shared/date_picker/date_picker.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/DatePicker/date_picker.test.tsx
rename to x-pack/plugins/apm/public/components/shared/date_picker/date_picker.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/DatePicker/index.tsx b/x-pack/plugins/apm/public/components/shared/date_picker/index.tsx
similarity index 98%
rename from x-pack/plugins/apm/public/components/shared/DatePicker/index.tsx
rename to x-pack/plugins/apm/public/components/shared/date_picker/index.tsx
index 12cc137d621423..c792c4ae9b426d 100644
--- a/x-pack/plugins/apm/public/components/shared/DatePicker/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/date_picker/index.tsx
@@ -11,7 +11,7 @@ import { useHistory, useLocation } from 'react-router-dom';
import { UI_SETTINGS } from '../../../../../../../src/plugins/data/common';
import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_context';
import { clearCache } from '../../../services/rest/callApi';
-import { fromQuery, toQuery } from '../Links/url_helpers';
+import { fromQuery, toQuery } from '../links/url_helpers';
import { TimePickerQuickRange } from './typings';
export function DatePicker({
diff --git a/x-pack/plugins/apm/public/components/shared/DatePicker/typings.ts b/x-pack/plugins/apm/public/components/shared/date_picker/typings.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/DatePicker/typings.ts
rename to x-pack/plugins/apm/public/components/shared/date_picker/typings.ts
diff --git a/x-pack/plugins/apm/public/components/shared/dependencies_table/index.tsx b/x-pack/plugins/apm/public/components/shared/dependencies_table/index.tsx
index 8791075158c95d..7c2bc722ac1e6b 100644
--- a/x-pack/plugins/apm/public/components/shared/dependencies_table/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/dependencies_table/index.tsx
@@ -21,8 +21,8 @@ import {
} from '../../../../common/utils/formatters';
import { useBreakpoints } from '../../../hooks/use_breakpoints';
import { FETCH_STATUS } from '../../../hooks/use_fetcher';
-import { EmptyMessage } from '../EmptyMessage';
-import { ImpactBar } from '../ImpactBar';
+import { EmptyMessage } from '../empty_message';
+import { ImpactBar } from '../impact_bar';
import { ListMetric } from '../list_metric';
import { ITableColumn, ManagedTable } from '../managed_table';
import { OverviewTableContainer } from '../overview_table_container';
diff --git a/x-pack/plugins/apm/public/components/shared/EmptyMessage.tsx b/x-pack/plugins/apm/public/components/shared/empty_message.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/EmptyMessage.tsx
rename to x-pack/plugins/apm/public/components/shared/empty_message.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/EnvironmentBadge/index.tsx b/x-pack/plugins/apm/public/components/shared/environment_badge/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/EnvironmentBadge/index.tsx
rename to x-pack/plugins/apm/public/components/shared/environment_badge/index.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/EnvironmentFilter/index.tsx b/x-pack/plugins/apm/public/components/shared/environment_filter/index.tsx
similarity index 98%
rename from x-pack/plugins/apm/public/components/shared/EnvironmentFilter/index.tsx
rename to x-pack/plugins/apm/public/components/shared/environment_filter/index.tsx
index 4344ed3a80f649..a7a8c90c31c165 100644
--- a/x-pack/plugins/apm/public/components/shared/EnvironmentFilter/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/environment_filter/index.tsx
@@ -15,7 +15,7 @@ import {
ENVIRONMENT_NOT_DEFINED,
} from '../../../../common/environment_filter_values';
import { useEnvironmentsFetcher } from '../../../hooks/use_environments_fetcher';
-import { fromQuery, toQuery } from '../Links/url_helpers';
+import { fromQuery, toQuery } from '../links/url_helpers';
import { useUxUrlParams } from '../../../context/url_params_context/use_ux_url_params';
import { FETCH_STATUS } from '../../../hooks/use_fetcher';
import { Environment } from '../../../../common/environment_rt';
diff --git a/x-pack/plugins/apm/public/components/shared/ErrorStatePrompt.tsx b/x-pack/plugins/apm/public/components/shared/error_state_prompt.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/ErrorStatePrompt.tsx
rename to x-pack/plugins/apm/public/components/shared/error_state_prompt.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/HeightRetainer/index.tsx b/x-pack/plugins/apm/public/components/shared/height_retainer/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/HeightRetainer/index.tsx
rename to x-pack/plugins/apm/public/components/shared/height_retainer/index.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/ImpactBar/__snapshots__/ImpactBar.test.js.snap b/x-pack/plugins/apm/public/components/shared/impact_bar/__snapshots__/impact_bar.test.js.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/ImpactBar/__snapshots__/ImpactBar.test.js.snap
rename to x-pack/plugins/apm/public/components/shared/impact_bar/__snapshots__/impact_bar.test.js.snap
diff --git a/x-pack/plugins/apm/public/components/shared/ImpactBar/ImpactBar.test.js b/x-pack/plugins/apm/public/components/shared/impact_bar/impact_bar.test.js
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/ImpactBar/ImpactBar.test.js
rename to x-pack/plugins/apm/public/components/shared/impact_bar/impact_bar.test.js
diff --git a/x-pack/plugins/apm/public/components/shared/ImpactBar/index.tsx b/x-pack/plugins/apm/public/components/shared/impact_bar/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/ImpactBar/index.tsx
rename to x-pack/plugins/apm/public/components/shared/impact_bar/index.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/KeyValueTable/FormattedValue.tsx b/x-pack/plugins/apm/public/components/shared/key_value_table/formatted_value.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/KeyValueTable/FormattedValue.tsx
rename to x-pack/plugins/apm/public/components/shared/key_value_table/formatted_value.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/KeyValueTable/index.tsx b/x-pack/plugins/apm/public/components/shared/key_value_table/index.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/KeyValueTable/index.tsx
rename to x-pack/plugins/apm/public/components/shared/key_value_table/index.tsx
index e9525728bc3c57..8b5595a67fa78b 100644
--- a/x-pack/plugins/apm/public/components/shared/KeyValueTable/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/key_value_table/index.tsx
@@ -13,7 +13,7 @@ import {
EuiTableRow,
EuiTableRowCell,
} from '@elastic/eui';
-import { FormattedValue } from './FormattedValue';
+import { FormattedValue } from './formatted_value';
import { KeyValuePair } from '../../../utils/flattenObject';
export function KeyValueTable({
diff --git a/x-pack/plugins/apm/public/components/shared/KeyValueTable/KeyValueTable.test.tsx b/x-pack/plugins/apm/public/components/shared/key_value_table/key_value_table.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/KeyValueTable/KeyValueTable.test.tsx
rename to x-pack/plugins/apm/public/components/shared/key_value_table/key_value_table.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/kuery_bar/index.tsx b/x-pack/plugins/apm/public/components/shared/kuery_bar/index.tsx
index 20484e691d50b8..a04d3218f9fffd 100644
--- a/x-pack/plugins/apm/public/components/shared/kuery_bar/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/kuery_bar/index.tsx
@@ -19,10 +19,10 @@ import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_
import { useLegacyUrlParams } from '../../../context/url_params_context/use_url_params';
import { useApmParams } from '../../../hooks/use_apm_params';
import { useDynamicDataViewFetcher } from '../../../hooks/use_dynamic_data_view';
-import { fromQuery, toQuery } from '../Links/url_helpers';
+import { fromQuery, toQuery } from '../links/url_helpers';
import { getBoolFilter } from './get_bool_filter';
// @ts-expect-error
-import { Typeahead } from './Typeahead';
+import { Typeahead } from './typeahead';
import { useProcessorEvent } from './use_processor_event';
interface State {
diff --git a/x-pack/plugins/apm/public/components/shared/kuery_bar/Typeahead/ClickOutside.js b/x-pack/plugins/apm/public/components/shared/kuery_bar/typeahead/click_outside.js
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/kuery_bar/Typeahead/ClickOutside.js
rename to x-pack/plugins/apm/public/components/shared/kuery_bar/typeahead/click_outside.js
diff --git a/x-pack/plugins/apm/public/components/shared/kuery_bar/Typeahead/index.js b/x-pack/plugins/apm/public/components/shared/kuery_bar/typeahead/index.js
similarity index 98%
rename from x-pack/plugins/apm/public/components/shared/kuery_bar/Typeahead/index.js
rename to x-pack/plugins/apm/public/components/shared/kuery_bar/typeahead/index.js
index f8f51679a5192a..d06bfcceab9840 100644
--- a/x-pack/plugins/apm/public/components/shared/kuery_bar/Typeahead/index.js
+++ b/x-pack/plugins/apm/public/components/shared/kuery_bar/typeahead/index.js
@@ -7,8 +7,8 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-import Suggestions from './Suggestions';
-import ClickOutside from './ClickOutside';
+import Suggestions from './suggestions';
+import ClickOutside from './click_outside';
import { EuiFieldSearch, EuiProgress } from '@elastic/eui';
const KEY_CODES = {
diff --git a/x-pack/plugins/apm/public/components/shared/kuery_bar/Typeahead/Suggestion.js b/x-pack/plugins/apm/public/components/shared/kuery_bar/typeahead/suggestion.js
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/kuery_bar/Typeahead/Suggestion.js
rename to x-pack/plugins/apm/public/components/shared/kuery_bar/typeahead/suggestion.js
diff --git a/x-pack/plugins/apm/public/components/shared/kuery_bar/Typeahead/Suggestions.js b/x-pack/plugins/apm/public/components/shared/kuery_bar/typeahead/suggestions.js
similarity index 98%
rename from x-pack/plugins/apm/public/components/shared/kuery_bar/Typeahead/Suggestions.js
rename to x-pack/plugins/apm/public/components/shared/kuery_bar/typeahead/suggestions.js
index 386eb7e1e0d7d9..e6f482e88afc0f 100644
--- a/x-pack/plugins/apm/public/components/shared/kuery_bar/Typeahead/Suggestions.js
+++ b/x-pack/plugins/apm/public/components/shared/kuery_bar/typeahead/suggestions.js
@@ -11,7 +11,7 @@ import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { euiStyled } from '../../../../../../../../src/plugins/kibana_react/common';
import { unit } from '../../../../utils/style';
-import Suggestion from './Suggestion';
+import Suggestion from './suggestion';
const List = euiStyled.ul`
width: 100%;
diff --git a/x-pack/plugins/apm/public/components/shared/kuery_bar/utils.ts b/x-pack/plugins/apm/public/components/shared/kuery_bar/utils.ts
index 1d4dd04ce9df43..805e162c67fe6b 100644
--- a/x-pack/plugins/apm/public/components/shared/kuery_bar/utils.ts
+++ b/x-pack/plugins/apm/public/components/shared/kuery_bar/utils.ts
@@ -7,7 +7,7 @@
import { History } from 'history';
import { isEmpty } from 'lodash';
-import { push } from '../Links/url_helpers';
+import { push } from '../links/url_helpers';
export function pushNewItemToKueryBar({
kuery,
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/APMLink.test.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/APMLink.test.tsx
similarity index 98%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/APMLink.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/APMLink.test.tsx
index c422b78d661e40..ea10852c7d6683 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/APMLink.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/APMLink.test.tsx
@@ -8,7 +8,7 @@
import { Location } from 'history';
import React from 'react';
import { getRenderedHref } from '../../../../utils/testHelpers';
-import { APMLink } from './APMLink';
+import { APMLink } from './apm_link';
describe('APMLink', () => {
test('APMLink should produce the correct URL', async () => {
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/agentConfigurationLinks.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/agent_configuration_links.tsx
similarity index 95%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/agentConfigurationLinks.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/agent_configuration_links.tsx
index c45ab22682ef46..366003c101789d 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/agentConfigurationLinks.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/agent_configuration_links.tsx
@@ -7,7 +7,7 @@
import { IBasePath } from 'kibana/public';
import { AgentConfigurationIntake } from '../../../../../common/agent_configuration/configuration_types';
-import { getLegacyApmHref } from './APMLink';
+import { getLegacyApmHref } from './apm_link';
export function editAgentConfigurationHref(
configService: AgentConfigurationIntake['service'],
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/APMLink.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/apm_link.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/APMLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/apm_link.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/ErrorDetailLink.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/error_detail_link.tsx
similarity index 91%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/ErrorDetailLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/error_detail_link.tsx
index 75fd8ba1a5f11b..4bf744e29c1ee2 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/ErrorDetailLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/error_detail_link.tsx
@@ -6,7 +6,7 @@
*/
import React from 'react';
-import { APMLink, APMLinkExtendProps } from './APMLink';
+import { APMLink, APMLinkExtendProps } from './apm_link';
interface Props extends APMLinkExtendProps {
serviceName: string;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/ErrorOverviewLink.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/error_overview_link.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/ErrorOverviewLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/error_overview_link.tsx
index ccd9bdff960b60..b517a39c1004df 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/ErrorOverviewLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/error_overview_link.tsx
@@ -9,7 +9,7 @@ import React from 'react';
import { pickKeys } from '../../../../../common/utils/pick_keys';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
import { APMQueryParams } from '../url_helpers';
-import { APMLink, APMLinkExtendProps } from './APMLink';
+import { APMLink, APMLinkExtendProps } from './apm_link';
const persistedFilters: Array = [
'host',
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/HomeLink.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/home_link.tsx
similarity index 87%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/HomeLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/home_link.tsx
index 66fdb7913b5d53..5337f1a2f16b9b 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/HomeLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/home_link.tsx
@@ -6,7 +6,7 @@
*/
import React from 'react';
-import { APMLink, APMLinkExtendProps } from './APMLink';
+import { APMLink, APMLinkExtendProps } from './apm_link';
function HomeLink(props: APMLinkExtendProps) {
return ;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/MetricOverviewLink.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/metric_overview_link.tsx
similarity index 92%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/MetricOverviewLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/metric_overview_link.tsx
index c3d418b63426b5..9d9a013d1c4390 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/MetricOverviewLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/metric_overview_link.tsx
@@ -7,7 +7,7 @@
import React from 'react';
import { APMQueryParams } from '../url_helpers';
-import { APMLink, APMLinkExtendProps, useAPMHref } from './APMLink';
+import { APMLink, APMLinkExtendProps, useAPMHref } from './apm_link';
const persistedFilters: Array = [
'host',
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/service_inventory_link.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/service_inventory_link.tsx
similarity index 92%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/service_inventory_link.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/service_inventory_link.tsx
index 0a51cb4cacd0b5..c4a589dca3ad83 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/service_inventory_link.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/service_inventory_link.tsx
@@ -6,7 +6,7 @@
*/
import { APMQueryParams } from '../url_helpers';
-import { useAPMHref } from './APMLink';
+import { useAPMHref } from './apm_link';
const persistedFilters: Array = ['host', 'agentName'];
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/ServiceMapLink.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/service_map_link.tsx
similarity index 92%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/ServiceMapLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/service_map_link.tsx
index 2c4dec9f4bcbac..84eff7eb444bde 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/ServiceMapLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/service_map_link.tsx
@@ -7,7 +7,7 @@
import { EuiLink } from '@elastic/eui';
import React from 'react';
-import { APMLinkExtendProps, useAPMHref } from './APMLink';
+import { APMLinkExtendProps, useAPMHref } from './apm_link';
export function useServiceMapHref(serviceName?: string) {
const path = serviceName
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/ServiceNodeMetricOverviewLink.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/service_node_metric_overview_link.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/ServiceNodeMetricOverviewLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/service_node_metric_overview_link.tsx
index aad5756b70e7e1..b8f0a0c53cb7dd 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/ServiceNodeMetricOverviewLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/service_node_metric_overview_link.tsx
@@ -8,7 +8,7 @@
import { EuiLink } from '@elastic/eui';
import React from 'react';
import { APMQueryParams } from '../url_helpers';
-import { APMLinkExtendProps, useAPMHref } from './APMLink';
+import { APMLinkExtendProps, useAPMHref } from './apm_link';
interface Props extends APMLinkExtendProps {
serviceName: string;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/ServiceNodeOverviewLink.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/service_node_overview_link.tsx
similarity index 93%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/ServiceNodeOverviewLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/service_node_overview_link.tsx
index b76c468ae21538..e13a38143ef259 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/ServiceNodeOverviewLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/service_node_overview_link.tsx
@@ -6,7 +6,7 @@
*/
import { APMQueryParams } from '../url_helpers';
-import { useAPMHref } from './APMLink';
+import { useAPMHref } from './apm_link';
const persistedFilters: Array = [
'host',
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/service_profiling_link.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/service_profiling_link.tsx
similarity index 93%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/service_profiling_link.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/service_profiling_link.tsx
index ab3b085e4e2559..01e23cba48e04d 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/service_profiling_link.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/service_profiling_link.tsx
@@ -7,7 +7,7 @@
import { EuiLink } from '@elastic/eui';
import React from 'react';
-import { APMLinkExtendProps, useAPMHref } from './APMLink';
+import { APMLinkExtendProps, useAPMHref } from './apm_link';
interface ServiceProfilingLinkProps extends APMLinkExtendProps {
serviceName: string;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/service_transactions_overview_link.test.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/service_transactions_overview_link.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/service_transactions_overview_link.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/service_transactions_overview_link.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/service_transactions_overview_link.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/service_transactions_overview_link.tsx
similarity index 95%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/service_transactions_overview_link.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/service_transactions_overview_link.tsx
index 982d25802e2021..b33f22cd9faf94 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/service_transactions_overview_link.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/service_transactions_overview_link.tsx
@@ -8,7 +8,7 @@
import { EuiLink } from '@elastic/eui';
import React from 'react';
import { APMQueryParams } from '../url_helpers';
-import { APMLinkExtendProps, useAPMHref } from './APMLink';
+import { APMLinkExtendProps, useAPMHref } from './apm_link';
import { removeUndefinedProps } from '../../../../context/url_params_context/helpers';
const persistedFilters: Array = [
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/TraceOverviewLink.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/trace_overview_link.tsx
similarity index 92%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/TraceOverviewLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/trace_overview_link.tsx
index 92682a88efb170..9353de8162b08a 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/TraceOverviewLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/trace_overview_link.tsx
@@ -6,7 +6,7 @@
*/
import { APMQueryParams } from '../url_helpers';
-import { useAPMHref } from './APMLink';
+import { useAPMHref } from './apm_link';
const persistedFilters: Array = [
'transactionResult',
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/transaction_detail_link.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/transaction_detail_link.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/transaction_detail_link.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/transaction_detail_link.tsx
index 9df035515b0402..af299c6095e59e 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/transaction_detail_link.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/transaction_detail_link.tsx
@@ -9,7 +9,7 @@ import React from 'react';
import { useLocation } from 'react-router-dom';
import { EuiLink } from '@elastic/eui';
import { pickBy, identity } from 'lodash';
-import { getLegacyApmHref, APMLinkExtendProps } from './APMLink';
+import { getLegacyApmHref, APMLinkExtendProps } from './apm_link';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
import { pickKeys } from '../../../../../common/utils/pick_keys';
import { APMQueryParams } from '../url_helpers';
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/transaction_overview_link.test.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/transaction_overview_link.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/transaction_overview_link.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/transaction_overview_link.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Links/apm/transaction_overview_link.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/transaction_overview_link.tsx
similarity index 95%
rename from x-pack/plugins/apm/public/components/shared/Links/apm/transaction_overview_link.tsx
rename to x-pack/plugins/apm/public/components/shared/links/apm/transaction_overview_link.tsx
index d3e40aebc1dafb..bd0ac78b855f0c 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/apm/transaction_overview_link.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/apm/transaction_overview_link.tsx
@@ -10,7 +10,7 @@ import React from 'react';
import { useLocation } from 'react-router-dom';
import { removeUndefinedProps } from '../../../../context/url_params_context/helpers';
import { useApmPluginContext } from '../../../../context/apm_plugin/use_apm_plugin_context';
-import { APMLinkExtendProps, getLegacyApmHref } from './APMLink';
+import { APMLinkExtendProps, getLegacyApmHref } from './apm_link';
interface Props extends APMLinkExtendProps {
serviceName: string;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/__fixtures__/mock_transaction.json b/x-pack/plugins/apm/public/components/shared/links/discover_links/__fixtures__/mock_transaction.json
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/__fixtures__/mock_transaction.json
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/__fixtures__/mock_transaction.json
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/__snapshots__/DiscoverErrorButton.test.tsx.snap b/x-pack/plugins/apm/public/components/shared/links/discover_links/__snapshots__/discover_error_button.test.tsx.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/__snapshots__/DiscoverErrorButton.test.tsx.snap
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/__snapshots__/discover_error_button.test.tsx.snap
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/__snapshots__/DiscoverErrorLink.test.tsx.snap b/x-pack/plugins/apm/public/components/shared/links/discover_links/__snapshots__/discover_error_link.test.tsx.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/__snapshots__/DiscoverErrorLink.test.tsx.snap
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/__snapshots__/discover_error_link.test.tsx.snap
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/__snapshots__/discover_transaction_button.test.tsx.snap b/x-pack/plugins/apm/public/components/shared/links/discover_links/__snapshots__/discover_transaction_button.test.tsx.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/__snapshots__/discover_transaction_button.test.tsx.snap
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/__snapshots__/discover_transaction_button.test.tsx.snap
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/__snapshots__/DiscoverTransactionLink.test.tsx.snap b/x-pack/plugins/apm/public/components/shared/links/discover_links/__snapshots__/discover_transaction_link.test.tsx.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/__snapshots__/DiscoverTransactionLink.test.tsx.snap
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/__snapshots__/discover_transaction_link.test.tsx.snap
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverErrorLink.test.tsx b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_error_button.test.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverErrorLink.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/discover_error_button.test.tsx
index 3d70653d58d198..3cbe8d7e316322 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverErrorLink.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_error_button.test.tsx
@@ -8,7 +8,7 @@
import { shallow, ShallowWrapper } from 'enzyme';
import React from 'react';
import { APMError } from '../../../../../typings/es_schemas/ui/apm_error';
-import { DiscoverErrorLink } from './DiscoverErrorLink';
+import { DiscoverErrorLink } from './discover_error_link';
describe('DiscoverErrorLink without kuery', () => {
let wrapper: ShallowWrapper;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverErrorButton.test.tsx b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_error_link.test.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverErrorButton.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/discover_error_link.test.tsx
index 3d70653d58d198..3cbe8d7e316322 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverErrorButton.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_error_link.test.tsx
@@ -8,7 +8,7 @@
import { shallow, ShallowWrapper } from 'enzyme';
import React from 'react';
import { APMError } from '../../../../../typings/es_schemas/ui/apm_error';
-import { DiscoverErrorLink } from './DiscoverErrorLink';
+import { DiscoverErrorLink } from './discover_error_link';
describe('DiscoverErrorLink without kuery', () => {
let wrapper: ShallowWrapper;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverErrorLink.tsx b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_error_link.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverErrorLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/discover_error_link.tsx
index 467a6d604ee60b..c7d35e7c983e83 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverErrorLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_error_link.tsx
@@ -11,7 +11,7 @@ import {
SERVICE_NAME,
} from '../../../../../common/elasticsearch_fieldnames';
import { APMError } from '../../../../../typings/es_schemas/ui/apm_error';
-import { DiscoverLink } from './DiscoverLink';
+import { DiscoverLink } from './discover_link';
function getDiscoverQuery(error: APMError, kuery?: string) {
const serviceName = error.service.name;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverLink.tsx b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_link.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/discover_link.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverLinks.integration.test.tsx b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_links.integration.test.tsx
similarity index 95%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverLinks.integration.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/discover_links.integration.test.tsx
index 53ea5735c8b22f..4e47a1d4217de8 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverLinks.integration.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_links.integration.test.tsx
@@ -11,9 +11,9 @@ import { APMError } from '../../../../../typings/es_schemas/ui/apm_error';
import { Span } from '../../../../../typings/es_schemas/ui/span';
import { Transaction } from '../../../../../typings/es_schemas/ui/transaction';
import { getRenderedHref } from '../../../../utils/testHelpers';
-import { DiscoverErrorLink } from './DiscoverErrorLink';
-import { DiscoverSpanLink } from './DiscoverSpanLink';
-import { DiscoverTransactionLink } from './DiscoverTransactionLink';
+import { DiscoverErrorLink } from './discover_error_link';
+import { DiscoverSpanLink } from './discover_span_link';
+import { DiscoverTransactionLink } from './discover_transaction_link';
describe('DiscoverLinks', () => {
it('produces the correct URL for a transaction', async () => {
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverSpanLink.tsx b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_span_link.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverSpanLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/discover_span_link.tsx
index 631ac6e2129f02..f943e6fb49985b 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverSpanLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_span_link.tsx
@@ -8,7 +8,7 @@
import React, { ReactNode } from 'react';
import { SPAN_ID } from '../../../../../common/elasticsearch_fieldnames';
import { Span } from '../../../../../typings/es_schemas/ui/span';
-import { DiscoverLink } from './DiscoverLink';
+import { DiscoverLink } from './discover_link';
function getDiscoverQuery(span: Span) {
const query = `${SPAN_ID}:"${span.span.id}"`;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/discover_transaction_button.test.tsx b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_transaction_button.test.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/discover_transaction_button.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/discover_transaction_button.test.tsx
index b8278f3d285f4f..5505036087dbfc 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/discover_transaction_button.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_transaction_button.test.tsx
@@ -11,7 +11,7 @@ import { Transaction } from '../../../../../typings/es_schemas/ui/transaction';
import {
DiscoverTransactionLink,
getDiscoverQuery,
-} from './DiscoverTransactionLink';
+} from './discover_transaction_link';
import mockTransaction from './__fixtures__/mock_transaction.json';
describe('DiscoverTransactionLink component', () => {
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverTransactionLink.test.tsx b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_transaction_link.test.tsx
similarity index 93%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverTransactionLink.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/discover_transaction_link.test.tsx
index a73f569827aa53..498a7fd26c138e 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverTransactionLink.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_transaction_link.test.tsx
@@ -8,7 +8,7 @@
import { Transaction } from '../../../../../typings/es_schemas/ui/transaction';
// @ts-expect-error
import configureStore from '../../../../../store/config/configureStore';
-import { getDiscoverQuery } from './DiscoverTransactionLink';
+import { getDiscoverQuery } from './discover_transaction_link';
function getMockTransaction() {
return {
diff --git a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverTransactionLink.tsx b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_transaction_link.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverTransactionLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/discover_links/discover_transaction_link.tsx
index 21e7a1e45263ff..d776572cc9e32f 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/DiscoverLinks/DiscoverTransactionLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/discover_links/discover_transaction_link.tsx
@@ -12,7 +12,7 @@ import {
TRANSACTION_ID,
} from '../../../../../common/elasticsearch_fieldnames';
import { Transaction } from '../../../../../typings/es_schemas/ui/transaction';
-import { DiscoverLink } from './DiscoverLink';
+import { DiscoverLink } from './discover_link';
export function getDiscoverQuery(transaction: Transaction) {
const transactionId = transaction.transaction.id;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/ElasticDocsLink.tsx b/x-pack/plugins/apm/public/components/shared/links/elastic_docs_link.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/ElasticDocsLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/elastic_docs_link.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Links/InfraLink.test.tsx b/x-pack/plugins/apm/public/components/shared/links/infra_link.test.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/shared/Links/InfraLink.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/infra_link.test.tsx
index c5a8c3299daa51..8301bd844b5cb3 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/InfraLink.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/infra_link.test.tsx
@@ -8,7 +8,7 @@
import { Location } from 'history';
import React from 'react';
import { getRenderedHref } from '../../../utils/testHelpers';
-import { InfraLink } from './InfraLink';
+import { InfraLink } from './infra_link';
test('InfraLink produces the correct URL', async () => {
const href = await getRenderedHref(
diff --git a/x-pack/plugins/apm/public/components/shared/Links/InfraLink.tsx b/x-pack/plugins/apm/public/components/shared/links/infra_link.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/InfraLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/infra_link.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Links/kibana.ts b/x-pack/plugins/apm/public/components/shared/links/kibana.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/kibana.ts
rename to x-pack/plugins/apm/public/components/shared/links/kibana.ts
diff --git a/x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLExplorerLink.test.tsx b/x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlexplorer_link.test.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLExplorerLink.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlexplorer_link.test.tsx
index 44e33e6bf419d7..9a8f2bd98106bd 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLExplorerLink.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlexplorer_link.test.tsx
@@ -8,7 +8,7 @@
import { Location } from 'history';
import React from 'react';
import { getRenderedHref } from '../../../../utils/testHelpers';
-import { MLExplorerLink } from './MLExplorerLink';
+import { MLExplorerLink } from './mlexplorer_link';
describe('MLExplorerLink', () => {
it('should produce the correct URL with jobId', async () => {
diff --git a/x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLExplorerLink.tsx b/x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlexplorer_link.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLExplorerLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlexplorer_link.tsx
index 72a29a079bc679..541b00f8291b04 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLExplorerLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlexplorer_link.tsx
@@ -11,7 +11,7 @@ import { UI_SETTINGS } from '../../../../../../../../src/plugins/data/common';
import { useApmPluginContext } from '../../../../context/apm_plugin/use_apm_plugin_context';
import { useMlHref, ML_PAGES } from '../../../../../../ml/public';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
-import { TimePickerRefreshInterval } from '../../DatePicker/typings';
+import { TimePickerRefreshInterval } from '../../date_picker/typings';
interface Props {
children?: ReactNode;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLManageJobsLink.test.tsx b/x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlmanage_jobs_link.test.tsx
similarity index 93%
rename from x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLManageJobsLink.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlmanage_jobs_link.test.tsx
index edea1f916eb184..8f7ff4f11ab22f 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLManageJobsLink.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlmanage_jobs_link.test.tsx
@@ -8,7 +8,7 @@
import { Location } from 'history';
import React from 'react';
import { getRenderedHref } from '../../../../utils/testHelpers';
-import { MLManageJobsLink } from './MLManageJobsLink';
+import { MLManageJobsLink } from './mlmanage_jobs_link';
test('MLManageJobsLink', async () => {
const href = await getRenderedHref(() => , {
diff --git a/x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLManageJobsLink.tsx b/x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlmanage_jobs_link.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLManageJobsLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlmanage_jobs_link.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLSingleMetricLink.test.tsx b/x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlsingle_metric_link.test.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLSingleMetricLink.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlsingle_metric_link.test.tsx
index cbafbd3fde2fac..ddcd5503853fea 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLSingleMetricLink.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlsingle_metric_link.test.tsx
@@ -8,7 +8,7 @@
import { Location } from 'history';
import React from 'react';
import { getRenderedHref } from '../../../../utils/testHelpers';
-import { MLSingleMetricLink } from './MLSingleMetricLink';
+import { MLSingleMetricLink } from './mlsingle_metric_link';
describe('MLSingleMetricLink', () => {
it('should produce the correct URL with jobId', async () => {
diff --git a/x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLSingleMetricLink.tsx b/x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlsingle_metric_link.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLSingleMetricLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlsingle_metric_link.tsx
index 2964a8e2578c70..ef92691336c34b 100644
--- a/x-pack/plugins/apm/public/components/shared/Links/MachineLearningLinks/MLSingleMetricLink.tsx
+++ b/x-pack/plugins/apm/public/components/shared/links/machine_learning_links/mlsingle_metric_link.tsx
@@ -11,7 +11,7 @@ import { UI_SETTINGS } from '../../../../../../../../src/plugins/data/common';
import { useApmPluginContext } from '../../../../context/apm_plugin/use_apm_plugin_context';
import { useMlHref, ML_PAGES } from '../../../../../../ml/public';
import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
-import { TimePickerRefreshInterval } from '../../DatePicker/typings';
+import { TimePickerRefreshInterval } from '../../date_picker/typings';
interface Props {
children?: ReactNode;
diff --git a/x-pack/plugins/apm/public/components/shared/Links/rison_helpers.test.ts b/x-pack/plugins/apm/public/components/shared/links/rison_helpers.test.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/rison_helpers.test.ts
rename to x-pack/plugins/apm/public/components/shared/links/rison_helpers.test.ts
diff --git a/x-pack/plugins/apm/public/components/shared/Links/rison_helpers.ts b/x-pack/plugins/apm/public/components/shared/links/rison_helpers.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/rison_helpers.ts
rename to x-pack/plugins/apm/public/components/shared/links/rison_helpers.ts
diff --git a/x-pack/plugins/apm/public/components/shared/Links/SetupInstructionsLink.tsx b/x-pack/plugins/apm/public/components/shared/links/setup_instructions_link.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/SetupInstructionsLink.tsx
rename to x-pack/plugins/apm/public/components/shared/links/setup_instructions_link.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Links/url_helpers.test.tsx b/x-pack/plugins/apm/public/components/shared/links/url_helpers.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/url_helpers.test.tsx
rename to x-pack/plugins/apm/public/components/shared/links/url_helpers.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Links/url_helpers.ts b/x-pack/plugins/apm/public/components/shared/links/url_helpers.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Links/url_helpers.ts
rename to x-pack/plugins/apm/public/components/shared/links/url_helpers.ts
diff --git a/x-pack/plugins/apm/public/components/shared/LoadingStatePrompt.tsx b/x-pack/plugins/apm/public/components/shared/loading_state_prompt.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/LoadingStatePrompt.tsx
rename to x-pack/plugins/apm/public/components/shared/loading_state_prompt.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/managed_table/index.tsx b/x-pack/plugins/apm/public/components/shared/managed_table/index.tsx
index 03ae13c06c6132..16ab8cb1d92021 100644
--- a/x-pack/plugins/apm/public/components/shared/managed_table/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/managed_table/index.tsx
@@ -11,7 +11,7 @@ import { orderBy } from 'lodash';
import React, { ReactNode, useCallback, useMemo } from 'react';
import { useHistory } from 'react-router-dom';
import { useLegacyUrlParams } from '../../../context/url_params_context/use_url_params';
-import { fromQuery, toQuery } from '../Links/url_helpers';
+import { fromQuery, toQuery } from '../links/url_helpers';
// TODO: this should really be imported from EUI
export interface ITableColumn {
diff --git a/x-pack/plugins/apm/public/components/shared/MetadataTable/ErrorMetadata/index.tsx b/x-pack/plugins/apm/public/components/shared/metadata_table/error_metadata/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/MetadataTable/ErrorMetadata/index.tsx
rename to x-pack/plugins/apm/public/components/shared/metadata_table/error_metadata/index.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/MetadataTable/helper.test.ts b/x-pack/plugins/apm/public/components/shared/metadata_table/helper.test.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/MetadataTable/helper.test.ts
rename to x-pack/plugins/apm/public/components/shared/metadata_table/helper.test.ts
diff --git a/x-pack/plugins/apm/public/components/shared/MetadataTable/helper.ts b/x-pack/plugins/apm/public/components/shared/metadata_table/helper.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/MetadataTable/helper.ts
rename to x-pack/plugins/apm/public/components/shared/metadata_table/helper.ts
diff --git a/x-pack/plugins/apm/public/components/shared/MetadataTable/index.tsx b/x-pack/plugins/apm/public/components/shared/metadata_table/index.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/MetadataTable/index.tsx
rename to x-pack/plugins/apm/public/components/shared/metadata_table/index.tsx
index 5e2c180bcfd552..ab6c132c61e13f 100644
--- a/x-pack/plugins/apm/public/components/shared/MetadataTable/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/metadata_table/index.tsx
@@ -21,10 +21,10 @@ import React, { useCallback } from 'react';
import { useHistory, useLocation } from 'react-router-dom';
import { EuiLoadingSpinner } from '@elastic/eui';
import { useLegacyUrlParams } from '../../../context/url_params_context/use_url_params';
-import { HeightRetainer } from '../HeightRetainer';
-import { fromQuery, toQuery } from '../Links/url_helpers';
+import { HeightRetainer } from '../height_retainer';
+import { fromQuery, toQuery } from '../links/url_helpers';
import { filterSectionsByTerm } from './helper';
-import { Section } from './Section';
+import { Section } from './section';
import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_context';
import { SectionDescriptor } from './types';
diff --git a/x-pack/plugins/apm/public/components/shared/MetadataTable/MetadataTable.test.tsx b/x-pack/plugins/apm/public/components/shared/metadata_table/metadata_table.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/MetadataTable/MetadataTable.test.tsx
rename to x-pack/plugins/apm/public/components/shared/metadata_table/metadata_table.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/MetadataTable/Section.test.tsx b/x-pack/plugins/apm/public/components/shared/metadata_table/section.test.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/shared/MetadataTable/Section.test.tsx
rename to x-pack/plugins/apm/public/components/shared/metadata_table/section.test.tsx
index ed816b1c7a3372..1d14d04a2be652 100644
--- a/x-pack/plugins/apm/public/components/shared/MetadataTable/Section.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/metadata_table/section.test.tsx
@@ -7,7 +7,7 @@
import React from 'react';
import { render } from '@testing-library/react';
-import { Section } from './Section';
+import { Section } from './section';
import { expectTextsInDocument } from '../../../utils/testHelpers';
describe('Section', () => {
diff --git a/x-pack/plugins/apm/public/components/shared/MetadataTable/Section.tsx b/x-pack/plugins/apm/public/components/shared/metadata_table/section.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/shared/MetadataTable/Section.tsx
rename to x-pack/plugins/apm/public/components/shared/metadata_table/section.tsx
index 03ae237f470c3b..4093d8128c7ca2 100644
--- a/x-pack/plugins/apm/public/components/shared/MetadataTable/Section.tsx
+++ b/x-pack/plugins/apm/public/components/shared/metadata_table/section.tsx
@@ -9,7 +9,7 @@ import React from 'react';
import { isEmpty } from 'lodash';
import { i18n } from '@kbn/i18n';
import { EuiText } from '@elastic/eui';
-import { KeyValueTable } from '../KeyValueTable';
+import { KeyValueTable } from '../key_value_table';
interface Props {
properties: Array<{ field: string; value: string[] | number[] }>;
diff --git a/x-pack/plugins/apm/public/components/shared/MetadataTable/SpanMetadata/index.tsx b/x-pack/plugins/apm/public/components/shared/metadata_table/span_metadata/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/MetadataTable/SpanMetadata/index.tsx
rename to x-pack/plugins/apm/public/components/shared/metadata_table/span_metadata/index.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/MetadataTable/TransactionMetadata/index.tsx b/x-pack/plugins/apm/public/components/shared/metadata_table/transaction_metadata/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/MetadataTable/TransactionMetadata/index.tsx
rename to x-pack/plugins/apm/public/components/shared/metadata_table/transaction_metadata/index.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/MetadataTable/types.ts b/x-pack/plugins/apm/public/components/shared/metadata_table/types.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/MetadataTable/types.ts
rename to x-pack/plugins/apm/public/components/shared/metadata_table/types.ts
diff --git a/x-pack/plugins/apm/public/components/shared/ml_callout/index.tsx b/x-pack/plugins/apm/public/components/shared/ml_callout/index.tsx
index 926be5ef93cf7f..9fa8bb5f04960e 100644
--- a/x-pack/plugins/apm/public/components/shared/ml_callout/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/ml_callout/index.tsx
@@ -16,7 +16,7 @@ import { i18n } from '@kbn/i18n';
import React, { useState } from 'react';
import { AnomalyDetectionSetupState } from '../../../../common/anomaly_detection/get_anomaly_detection_setup_state';
import { useMlManageJobsHref } from '../../../hooks/use_ml_manage_jobs_href';
-import { APMLink } from '../Links/apm/APMLink';
+import { APMLink } from '../links/apm/apm_link';
export function shouldDisplayMlCallout(
anomalyDetectionSetupState: AnomalyDetectionSetupState
diff --git a/x-pack/plugins/apm/public/components/shared/search_bar.test.tsx b/x-pack/plugins/apm/public/components/shared/search_bar.test.tsx
index db30e73c86dc77..d91af5b11c49bc 100644
--- a/x-pack/plugins/apm/public/components/shared/search_bar.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/search_bar.test.tsx
@@ -17,7 +17,7 @@ import type { ApmUrlParams } from '../../context/url_params_context/types';
import * as useFetcherHook from '../../hooks/use_fetcher';
import * as useServiceTransactionTypesHook from '../../context/apm_service/use_service_transaction_types_fetcher';
import { renderWithTheme } from '../../utils/testHelpers';
-import { fromQuery } from './Links/url_helpers';
+import { fromQuery } from './links/url_helpers';
import { CoreStart } from 'kibana/public';
import { SearchBar } from './search_bar';
diff --git a/x-pack/plugins/apm/public/components/shared/search_bar.tsx b/x-pack/plugins/apm/public/components/shared/search_bar.tsx
index 1a6e9a803d7358..f1d82e2e307e1c 100644
--- a/x-pack/plugins/apm/public/components/shared/search_bar.tsx
+++ b/x-pack/plugins/apm/public/components/shared/search_bar.tsx
@@ -17,7 +17,7 @@ import { useTimeRangeId } from '../../context/time_range_id/use_time_range_id';
import { toBoolean, toNumber } from '../../context/url_params_context/helpers';
import { useApmParams } from '../../hooks/use_apm_params';
import { useBreakpoints } from '../../hooks/use_breakpoints';
-import { DatePicker } from './DatePicker';
+import { DatePicker } from './date_picker';
import { KueryBar } from './kuery_bar';
import { TimeComparison } from './time_comparison';
import { TransactionTypeSelect } from './transaction_type_select';
diff --git a/x-pack/plugins/apm/public/components/shared/SelectWithPlaceholder/index.tsx b/x-pack/plugins/apm/public/components/shared/select_with_placeholder/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/SelectWithPlaceholder/index.tsx
rename to x-pack/plugins/apm/public/components/shared/select_with_placeholder/index.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/Context.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/Context.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/Context.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/Context.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/Stackframe.test.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/Stackframe.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/Stackframe.test.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/Stackframe.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/Stackframe.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/Stackframe.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/Stackframe.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/Stackframe.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/Variables.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/Variables.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/Variables.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/Variables.tsx
index a43cd26e7f94a5..3d92f3c584f450 100644
--- a/x-pack/plugins/apm/public/components/shared/Stacktrace/Variables.tsx
+++ b/x-pack/plugins/apm/public/components/shared/stacktrace/Variables.tsx
@@ -10,7 +10,7 @@ import { i18n } from '@kbn/i18n';
import React from 'react';
import { euiStyled } from '../../../../../../../src/plugins/kibana_react/common';
import { Stackframe } from '../../../../typings/es_schemas/raw/fields/stackframe';
-import { KeyValueTable } from '../KeyValueTable';
+import { KeyValueTable } from '../key_value_table';
import { flattenObject } from '../../../utils/flattenObject';
const VariablesContainer = euiStyled.div`
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/__fixtures__/stacktraces.json b/x-pack/plugins/apm/public/components/shared/stacktrace/__fixtures__/stacktraces.json
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/__fixtures__/stacktraces.json
rename to x-pack/plugins/apm/public/components/shared/stacktrace/__fixtures__/stacktraces.json
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/cause_stacktrace.test.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/cause_stacktrace.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/cause_stacktrace.test.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/cause_stacktrace.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/cause_stacktrace.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/cause_stacktrace.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/cause_stacktrace.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/cause_stacktrace.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading.test.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading.test.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/c_sharp_frame_heading_renderer.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/c_sharp_frame_heading_renderer.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/c_sharp_frame_heading_renderer.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/c_sharp_frame_heading_renderer.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/default_frame_heading_renderer.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/default_frame_heading_renderer.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/default_frame_heading_renderer.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/default_frame_heading_renderer.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/index.ts b/x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/index.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/index.ts
rename to x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/index.ts
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/java_frame_heading_renderer.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/java_frame_heading_renderer.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/java_frame_heading_renderer.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/java_frame_heading_renderer.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/java_script_frame_heading_renderer.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/java_script_frame_heading_renderer.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/java_script_frame_heading_renderer.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/java_script_frame_heading_renderer.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/ruby_frame_heading_renderer.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/ruby_frame_heading_renderer.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/frame_heading_renderers/ruby_frame_heading_renderer.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/frame_heading_renderers/ruby_frame_heading_renderer.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/index.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/index.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/index.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/index.tsx
index 3395b22988e8cd..de24482c06d502 100644
--- a/x-pack/plugins/apm/public/components/shared/Stacktrace/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/stacktrace/index.tsx
@@ -9,7 +9,7 @@ import { i18n } from '@kbn/i18n';
import { isEmpty, last } from 'lodash';
import React, { Fragment } from 'react';
import { Stackframe } from '../../../../typings/es_schemas/raw/fields/stackframe';
-import { EmptyMessage } from '../../shared/EmptyMessage';
+import { EmptyMessage } from '../../shared/empty_message';
import { LibraryStacktrace } from './library_stacktrace';
import { Stackframe as StackframeComponent } from './Stackframe';
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/library_stacktrace.test.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/library_stacktrace.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/library_stacktrace.test.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/library_stacktrace.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/library_stacktrace.tsx b/x-pack/plugins/apm/public/components/shared/stacktrace/library_stacktrace.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/library_stacktrace.tsx
rename to x-pack/plugins/apm/public/components/shared/stacktrace/library_stacktrace.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Stacktrace/stacktrace.test.ts b/x-pack/plugins/apm/public/components/shared/stacktrace/stacktrace.test.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Stacktrace/stacktrace.test.ts
rename to x-pack/plugins/apm/public/components/shared/stacktrace/stacktrace.test.ts
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/__fixtures__/transactions.ts b/x-pack/plugins/apm/public/components/shared/summary/__fixtures__/transactions.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Summary/__fixtures__/transactions.ts
rename to x-pack/plugins/apm/public/components/shared/summary/__fixtures__/transactions.ts
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/CompositeSpanDurationSummaryItem.tsx b/x-pack/plugins/apm/public/components/shared/summary/composite_span_duration_summary_item.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Summary/CompositeSpanDurationSummaryItem.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/composite_span_duration_summary_item.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/DurationSummaryItem.tsx b/x-pack/plugins/apm/public/components/shared/summary/duration_summary_item.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/Summary/DurationSummaryItem.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/duration_summary_item.tsx
index e0710556096c90..9993fd27b61720 100644
--- a/x-pack/plugins/apm/public/components/shared/Summary/DurationSummaryItem.tsx
+++ b/x-pack/plugins/apm/public/components/shared/summary/duration_summary_item.tsx
@@ -9,7 +9,7 @@ import React from 'react';
import { i18n } from '@kbn/i18n';
import { EuiToolTip, EuiText } from '@elastic/eui';
import { asDuration } from '../../../../common/utils/formatters';
-import { PercentOfParent } from '../../app/transaction_details/waterfall_with_summary/PercentOfParent';
+import { PercentOfParent } from '../../app/transaction_details/waterfall_with_summary/percent_of_parent';
interface Props {
duration: number;
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/error_count_summary_item_badge.test.tsx b/x-pack/plugins/apm/public/components/shared/summary/error_count_summary_item_badge.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Summary/error_count_summary_item_badge.test.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/error_count_summary_item_badge.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/error_count_summary_item_badge.tsx b/x-pack/plugins/apm/public/components/shared/summary/error_count_summary_item_badge.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Summary/error_count_summary_item_badge.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/error_count_summary_item_badge.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/http_info_summary_item/http_info_summary_item.test.tsx b/x-pack/plugins/apm/public/components/shared/summary/http_info_summary_item/http_info_summary_item.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Summary/http_info_summary_item/http_info_summary_item.test.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/http_info_summary_item/http_info_summary_item.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/http_info_summary_item/index.tsx b/x-pack/plugins/apm/public/components/shared/summary/http_info_summary_item/index.tsx
similarity index 96%
rename from x-pack/plugins/apm/public/components/shared/Summary/http_info_summary_item/index.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/http_info_summary_item/index.tsx
index d10d15f8240a1c..51e574324dfa64 100644
--- a/x-pack/plugins/apm/public/components/shared/Summary/http_info_summary_item/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/summary/http_info_summary_item/index.tsx
@@ -10,7 +10,7 @@ import { i18n } from '@kbn/i18n';
import React from 'react';
import { euiStyled } from '../../../../../../../../src/plugins/kibana_react/common';
import { truncate, unit } from '../../../../utils/style';
-import { HttpStatusBadge } from '../HttpStatusBadge';
+import { HttpStatusBadge } from '../http_status_badge';
const HttpInfoBadge = euiStyled(EuiBadge)`
margin-right: ${({ theme }) => theme.eui.euiSizeXS};
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/HttpStatusBadge/HttpStatusBadge.test.tsx b/x-pack/plugins/apm/public/components/shared/summary/http_status_badge/http_status_badge.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Summary/HttpStatusBadge/HttpStatusBadge.test.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/http_status_badge/http_status_badge.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/HttpStatusBadge/index.tsx b/x-pack/plugins/apm/public/components/shared/summary/http_status_badge/index.tsx
similarity index 95%
rename from x-pack/plugins/apm/public/components/shared/Summary/HttpStatusBadge/index.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/http_status_badge/index.tsx
index 41983a9185b8f9..4ef9634fe0279a 100644
--- a/x-pack/plugins/apm/public/components/shared/Summary/HttpStatusBadge/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/summary/http_status_badge/index.tsx
@@ -8,7 +8,7 @@
import React from 'react';
import { i18n } from '@kbn/i18n';
import { EuiToolTip, EuiBadge } from '@elastic/eui';
-import { statusCodes } from './statusCodes';
+import { statusCodes } from './status_codes';
import { httpStatusCodeToColor } from '../../../../utils/httpStatusCodeToColor';
interface HttpStatusBadgeProps {
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/HttpStatusBadge/statusCodes.ts b/x-pack/plugins/apm/public/components/shared/summary/http_status_badge/status_codes.ts
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Summary/HttpStatusBadge/statusCodes.ts
rename to x-pack/plugins/apm/public/components/shared/summary/http_status_badge/status_codes.ts
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/index.tsx b/x-pack/plugins/apm/public/components/shared/summary/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Summary/index.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/index.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/TransactionResultSummaryItem.tsx b/x-pack/plugins/apm/public/components/shared/summary/transaction_result_summary_item.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Summary/TransactionResultSummaryItem.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/transaction_result_summary_item.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/TransactionSummary.test.tsx b/x-pack/plugins/apm/public/components/shared/summary/transaction_summary.test.tsx
similarity index 94%
rename from x-pack/plugins/apm/public/components/shared/Summary/TransactionSummary.test.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/transaction_summary.test.tsx
index 5c2b8383ee3b65..a1ce5e99333d29 100644
--- a/x-pack/plugins/apm/public/components/shared/Summary/TransactionSummary.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/summary/transaction_summary.test.tsx
@@ -7,7 +7,7 @@
import { shallow } from 'enzyme';
import React from 'react';
-import { TransactionSummary } from './TransactionSummary';
+import { TransactionSummary } from './transaction_summary';
import * as exampleTransactions from './__fixtures__/transactions';
describe('TransactionSummary', () => {
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/TransactionSummary.tsx b/x-pack/plugins/apm/public/components/shared/summary/transaction_summary.tsx
similarity index 86%
rename from x-pack/plugins/apm/public/components/shared/Summary/TransactionSummary.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/transaction_summary.tsx
index dc1a62e591b172..399121b710ce91 100644
--- a/x-pack/plugins/apm/public/components/shared/Summary/TransactionSummary.tsx
+++ b/x-pack/plugins/apm/public/components/shared/summary/transaction_summary.tsx
@@ -8,12 +8,12 @@
import React from 'react';
import { Transaction } from '../../../../typings/es_schemas/ui/transaction';
import { Summary } from './';
-import { TimestampTooltip } from '../TimestampTooltip';
-import { DurationSummaryItem } from './DurationSummaryItem';
+import { TimestampTooltip } from '../timestamp_tooltip';
+import { DurationSummaryItem } from './duration_summary_item';
import { ErrorCountSummaryItemBadge } from './error_count_summary_item_badge';
import { HttpInfoSummaryItem } from './http_info_summary_item';
-import { TransactionResultSummaryItem } from './TransactionResultSummaryItem';
-import { UserAgentSummaryItem } from './UserAgentSummaryItem';
+import { TransactionResultSummaryItem } from './transaction_result_summary_item';
+import { UserAgentSummaryItem } from './user_agent_summary_item';
interface Props {
transaction: Transaction;
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/UserAgentSummaryItem.test.tsx b/x-pack/plugins/apm/public/components/shared/summary/user_agent_summary_item.test.tsx
similarity index 92%
rename from x-pack/plugins/apm/public/components/shared/Summary/UserAgentSummaryItem.test.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/user_agent_summary_item.test.tsx
index 8884020f0364d0..9d68c5912f513e 100644
--- a/x-pack/plugins/apm/public/components/shared/Summary/UserAgentSummaryItem.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/summary/user_agent_summary_item.test.tsx
@@ -6,7 +6,7 @@
*/
import React from 'react';
-import { UserAgentSummaryItem } from './UserAgentSummaryItem';
+import { UserAgentSummaryItem } from './user_agent_summary_item';
import { mountWithTheme } from '../../../utils/testHelpers';
describe('UserAgentSummaryItem', () => {
diff --git a/x-pack/plugins/apm/public/components/shared/Summary/UserAgentSummaryItem.tsx b/x-pack/plugins/apm/public/components/shared/summary/user_agent_summary_item.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/Summary/UserAgentSummaryItem.tsx
rename to x-pack/plugins/apm/public/components/shared/summary/user_agent_summary_item.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/time_comparison/index.test.tsx b/x-pack/plugins/apm/public/components/shared/time_comparison/index.test.tsx
index e20a6df12ad464..d3c3369f6a72a9 100644
--- a/x-pack/plugins/apm/public/components/shared/time_comparison/index.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/time_comparison/index.test.tsx
@@ -14,7 +14,7 @@ import {
expectTextsNotInDocument,
} from '../../../utils/testHelpers';
import { getSelectOptions, TimeComparison } from './';
-import * as urlHelpers from '../../shared/Links/url_helpers';
+import * as urlHelpers from '../../shared/links/url_helpers';
import moment from 'moment';
import { getComparisonTypes } from './get_comparison_types';
import { MockApmPluginContextWrapper } from '../../../context/apm_plugin/mock_apm_plugin_context';
diff --git a/x-pack/plugins/apm/public/components/shared/time_comparison/index.tsx b/x-pack/plugins/apm/public/components/shared/time_comparison/index.tsx
index 2cb4e0964686f1..e61ffbbbc5bab1 100644
--- a/x-pack/plugins/apm/public/components/shared/time_comparison/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/time_comparison/index.tsx
@@ -18,7 +18,7 @@ import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_
import { useAnyOfApmParams } from '../../../hooks/use_apm_params';
import { useBreakpoints } from '../../../hooks/use_breakpoints';
import { useTimeRange } from '../../../hooks/use_time_range';
-import * as urlHelpers from '../../shared/Links/url_helpers';
+import * as urlHelpers from '../../shared/links/url_helpers';
import { getComparisonEnabled } from './get_comparison_enabled';
import { getComparisonTypes } from './get_comparison_types';
import { getTimeRangeComparison } from './get_time_range_comparison';
diff --git a/x-pack/plugins/apm/public/components/shared/TimestampTooltip/index.test.tsx b/x-pack/plugins/apm/public/components/shared/timestamp_tooltip/index.test.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/TimestampTooltip/index.test.tsx
rename to x-pack/plugins/apm/public/components/shared/timestamp_tooltip/index.test.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/TimestampTooltip/index.tsx b/x-pack/plugins/apm/public/components/shared/timestamp_tooltip/index.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/TimestampTooltip/index.tsx
rename to x-pack/plugins/apm/public/components/shared/timestamp_tooltip/index.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/__snapshots__/TransactionActionMenu.test.tsx.snap b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/__snapshots__/transaction_action_menu.test.tsx.snap
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/transaction_action_menu/__snapshots__/TransactionActionMenu.test.tsx.snap
rename to x-pack/plugins/apm/public/components/shared/transaction_action_menu/__snapshots__/transaction_action_menu.test.tsx.snap
diff --git a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/CustomLinkToolbar.test.tsx b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/custom_link_toolbar.test.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/CustomLinkToolbar.test.tsx
rename to x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/custom_link_toolbar.test.tsx
index ecef563e729483..300b0ec345f42d 100644
--- a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/CustomLinkToolbar.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/custom_link_toolbar.test.tsx
@@ -17,7 +17,7 @@ import {
expectTextsInDocument,
expectTextsNotInDocument,
} from '../../../../utils/testHelpers';
-import { CustomLinkToolbar } from './CustomLinkToolbar';
+import { CustomLinkToolbar } from './custom_link_toolbar';
function getMockAPMContext({ canSave }: { canSave: boolean }) {
return {
diff --git a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/CustomLinkToolbar.tsx b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/custom_link_toolbar.tsx
similarity index 97%
rename from x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/CustomLinkToolbar.tsx
rename to x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/custom_link_toolbar.tsx
index 0818c8915d6220..935939761a496c 100644
--- a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/CustomLinkToolbar.tsx
+++ b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/custom_link_toolbar.tsx
@@ -16,7 +16,7 @@ import {
import { i18n } from '@kbn/i18n';
import { NO_PERMISSION_LABEL } from '../../../../../common/custom_link';
import { useApmPluginContext } from '../../../../context/apm_plugin/use_apm_plugin_context';
-import { APMLink } from '../../Links/apm/APMLink';
+import { APMLink } from '../../links/apm/apm_link';
export function CustomLinkToolbar({
onClickCreate,
diff --git a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/index.tsx b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/index.tsx
index 187f82963ad602..7e377f2a756eea 100644
--- a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/custom_link_menu_section/index.tsx
@@ -32,8 +32,8 @@ import { useApmPluginContext } from '../../../../context/apm_plugin/use_apm_plug
import { FETCH_STATUS, useFetcher } from '../../../../hooks/use_fetcher';
import { CreateEditCustomLinkFlyout } from '../../../app/Settings/custom_link/create_edit_custom_link_flyout';
import { convertFiltersToQuery } from '../../../app/Settings/custom_link/create_edit_custom_link_flyout/helper';
-import { LoadingStatePrompt } from '../../LoadingStatePrompt';
-import { CustomLinkToolbar } from './CustomLinkToolbar';
+import { LoadingStatePrompt } from '../../loading_state_prompt';
+import { CustomLinkToolbar } from './custom_link_toolbar';
import { CustomLinkList } from './custom_link_list';
const DEFAULT_LINKS_TO_SHOW = 3;
diff --git a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/sections.ts b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/sections.ts
index 3095c44d54e786..daf5cb0833b61c 100644
--- a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/sections.ts
+++ b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/sections.ts
@@ -13,10 +13,10 @@ import moment from 'moment';
import url from 'url';
import type { Transaction } from '../../../../typings/es_schemas/ui/transaction';
import type { ApmUrlParams } from '../../../context/url_params_context/types';
-import { getDiscoverHref } from '../Links/DiscoverLinks/DiscoverLink';
-import { getDiscoverQuery } from '../Links/DiscoverLinks/DiscoverTransactionLink';
-import { getInfraHref } from '../Links/InfraLink';
-import { fromQuery } from '../Links/url_helpers';
+import { getDiscoverHref } from '../links/discover_links/discover_link';
+import { getDiscoverQuery } from '../links/discover_links/discover_transaction_link';
+import { getInfraHref } from '../links/infra_link';
+import { fromQuery } from '../links/url_helpers';
import { SectionRecord, getNonEmptySections, Action } from './sections_helper';
function getInfraMetricsQuery(transaction: Transaction) {
diff --git a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/TransactionActionMenu.test.tsx b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/transaction_action_menu.test.tsx
similarity index 99%
rename from x-pack/plugins/apm/public/components/shared/transaction_action_menu/TransactionActionMenu.test.tsx
rename to x-pack/plugins/apm/public/components/shared/transaction_action_menu/transaction_action_menu.test.tsx
index fa2d3700eaf8c8..be91fb8adfe6c0 100644
--- a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/TransactionActionMenu.test.tsx
+++ b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/transaction_action_menu.test.tsx
@@ -22,7 +22,7 @@ import {
expectTextsInDocument,
expectTextsNotInDocument,
} from '../../../utils/testHelpers';
-import { TransactionActionMenu } from './TransactionActionMenu';
+import { TransactionActionMenu } from './transaction_action_menu';
import * as Transactions from './__fixtures__/mockData';
function getMockAPMContext({ canSave }: { canSave: boolean }) {
diff --git a/x-pack/plugins/apm/public/components/shared/transaction_action_menu/TransactionActionMenu.tsx b/x-pack/plugins/apm/public/components/shared/transaction_action_menu/transaction_action_menu.tsx
similarity index 100%
rename from x-pack/plugins/apm/public/components/shared/transaction_action_menu/TransactionActionMenu.tsx
rename to x-pack/plugins/apm/public/components/shared/transaction_action_menu/transaction_action_menu.tsx
diff --git a/x-pack/plugins/apm/public/components/shared/transaction_type_select.tsx b/x-pack/plugins/apm/public/components/shared/transaction_type_select.tsx
index 84f3b1e45d4a14..292aaaed816af6 100644
--- a/x-pack/plugins/apm/public/components/shared/transaction_type_select.tsx
+++ b/x-pack/plugins/apm/public/components/shared/transaction_type_select.tsx
@@ -11,7 +11,7 @@ import { useHistory } from 'react-router-dom';
import styled from 'styled-components';
import { useApmServiceContext } from '../../context/apm_service/use_apm_service_context';
import { useBreakpoints } from '../../hooks/use_breakpoints';
-import * as urlHelpers from './Links/url_helpers';
+import * as urlHelpers from './links/url_helpers';
// The default transaction type (for non-RUM services) is "request". Set the
// min-width on here to the width when "request" is loaded so it doesn't start
diff --git a/x-pack/plugins/apm/public/components/shared/transactions_table/get_columns.tsx b/x-pack/plugins/apm/public/components/shared/transactions_table/get_columns.tsx
index c44fbb8b7f87aa..b6e02b1b08c3cb 100644
--- a/x-pack/plugins/apm/public/components/shared/transactions_table/get_columns.tsx
+++ b/x-pack/plugins/apm/public/components/shared/transactions_table/get_columns.tsx
@@ -22,8 +22,8 @@ import {
asTransactionRate,
} from '../../../../common/utils/formatters';
import { APIReturnType } from '../../../services/rest/createCallApmApi';
-import { ImpactBar } from '../ImpactBar';
-import { TransactionDetailLink } from '../Links/apm/transaction_detail_link';
+import { ImpactBar } from '../impact_bar';
+import { TransactionDetailLink } from '../links/apm/transaction_detail_link';
import { ListMetric } from '../list_metric';
import { TruncateWithTooltip } from '../truncate_with_tooltip';
import { getLatencyColumnLabel } from './get_latency_column_label';
diff --git a/x-pack/plugins/apm/public/components/shared/transactions_table/index.tsx b/x-pack/plugins/apm/public/components/shared/transactions_table/index.tsx
index d2abd9dc4c15ae..f943cf4da4b059 100644
--- a/x-pack/plugins/apm/public/components/shared/transactions_table/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/transactions_table/index.tsx
@@ -22,11 +22,11 @@ import { APIReturnType } from '../../../services/rest/createCallApmApi';
import { useApmServiceContext } from '../../../context/apm_service/use_apm_service_context';
import { useLegacyUrlParams } from '../../../context/url_params_context/use_url_params';
import { FETCH_STATUS, useFetcher } from '../../../hooks/use_fetcher';
-import { TransactionOverviewLink } from '../Links/apm/transaction_overview_link';
+import { TransactionOverviewLink } from '../links/apm/transaction_overview_link';
import { getTimeRangeComparison } from '../time_comparison/get_time_range_comparison';
import { OverviewTableContainer } from '../overview_table_container';
import { getColumns } from './get_columns';
-import { ElasticDocsLink } from '../Links/ElasticDocsLink';
+import { ElasticDocsLink } from '../links/elastic_docs_link';
import { useBreakpoints } from '../../../hooks/use_breakpoints';
type ApiResponse =
diff --git a/x-pack/plugins/apm/public/context/url_params_context/resolve_url_params.ts b/x-pack/plugins/apm/public/context/url_params_context/resolve_url_params.ts
index c37d83983a00be..4311a9c75de85b 100644
--- a/x-pack/plugins/apm/public/context/url_params_context/resolve_url_params.ts
+++ b/x-pack/plugins/apm/public/context/url_params_context/resolve_url_params.ts
@@ -11,7 +11,7 @@ import { uxLocalUIFilterNames } from '../../../common/ux_ui_filter';
import { ENVIRONMENT_ALL } from '../../../common/environment_filter_values';
import { LatencyAggregationType } from '../../../common/latency_aggregation_types';
import { pickKeys } from '../../../common/utils/pick_keys';
-import { toQuery } from '../../components/shared/Links/url_helpers';
+import { toQuery } from '../../components/shared/links/url_helpers';
import {
getDateRange,
removeUndefinedProps,
diff --git a/x-pack/plugins/apm/public/hooks/use_date_range_redirect.ts b/x-pack/plugins/apm/public/hooks/use_date_range_redirect.ts
index 0446b358720455..a0b06c241a28c8 100644
--- a/x-pack/plugins/apm/public/hooks/use_date_range_redirect.ts
+++ b/x-pack/plugins/apm/public/hooks/use_date_range_redirect.ts
@@ -7,7 +7,7 @@
import qs from 'query-string';
import { useHistory, useLocation } from 'react-router-dom';
import { UI_SETTINGS } from '../../../../../src/plugins/data/public';
-import { TimePickerTimeDefaults } from '../components/shared/DatePicker/typings';
+import { TimePickerTimeDefaults } from '../components/shared/date_picker/typings';
import { useApmPluginContext } from '../context/apm_plugin/use_apm_plugin_context';
export function useDateRangeRedirect() {
diff --git a/x-pack/plugins/apm/public/hooks/use_ml_manage_jobs_href.ts b/x-pack/plugins/apm/public/hooks/use_ml_manage_jobs_href.ts
index cc187c6cf619ac..d289c29b60b372 100644
--- a/x-pack/plugins/apm/public/hooks/use_ml_manage_jobs_href.ts
+++ b/x-pack/plugins/apm/public/hooks/use_ml_manage_jobs_href.ts
@@ -7,7 +7,7 @@
import { UI_SETTINGS } from '../../../../../src/plugins/data/public';
import { ML_PAGES, useMlHref } from '../../../ml/public';
-import { TimePickerRefreshInterval } from '../components/shared/DatePicker/typings';
+import { TimePickerRefreshInterval } from '../components/shared/date_picker/typings';
import { useApmPluginContext } from '../context/apm_plugin/use_apm_plugin_context';
import { useLegacyUrlParams } from '../context/url_params_context/use_url_params';
diff --git a/x-pack/plugins/apm/public/plugin.ts b/x-pack/plugins/apm/public/plugin.ts
index 77c52e1afeec35..2d000802017097 100644
--- a/x-pack/plugins/apm/public/plugin.ts
+++ b/x-pack/plugins/apm/public/plugin.ts
@@ -238,7 +238,7 @@ export class ApmPlugin implements Plugin {
const getUxDataHelper = async () => {
const { fetchUxOverviewDate, hasRumData } = await import(
- './components/app/RumDashboard/ux_overview_fetchers'
+ './components/app/rum_dashboard/ux_overview_fetchers'
);
const { createCallApmApi } = await import(
'./services/rest/createCallApmApi'
diff --git a/x-pack/plugins/apm/public/setHelpExtension.ts b/x-pack/plugins/apm/public/setHelpExtension.ts
index e70d9aecf9a9ce..9015a28822a75e 100644
--- a/x-pack/plugins/apm/public/setHelpExtension.ts
+++ b/x-pack/plugins/apm/public/setHelpExtension.ts
@@ -7,7 +7,7 @@
import { i18n } from '@kbn/i18n';
import { CoreStart } from 'kibana/public';
-import { getUpgradeAssistantHref } from './components/shared/Links/kibana';
+import { getUpgradeAssistantHref } from './components/shared/links/kibana';
export function setHelpExtension({ chrome, http }: CoreStart) {
chrome.setHelpExtension({
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/area_chart/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/area_chart/index.ts
index 38dfd2261da004..3a91039d81c7a9 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/area_chart/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/area_chart/index.ts
@@ -13,9 +13,10 @@ export const areaChart: ElementFactory = () => ({
help: 'A line chart with a filled body',
type: 'chart',
icon: 'visArea',
- expression: `filters
- | demodata
- | pointseries x="time" y="mean(price)"
- | plot defaultStyle={seriesStyle lines=1 fill=1}
- | render`,
+ expression: `kibana
+| selectFilter
+| demodata
+| pointseries x="time" y="mean(price)"
+| plot defaultStyle={seriesStyle lines=1 fill=1}
+| render`,
});
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/bubble_chart/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/bubble_chart/index.ts
index c3f07ae601db92..b1b657bb37ff5f 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/bubble_chart/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/bubble_chart/index.ts
@@ -15,7 +15,8 @@ export const bubbleChart: ElementFactory = () => ({
width: 700,
height: 300,
icon: 'heatmap',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| pointseries x="project" y="sum(price)" color="state" size="size(username)"
| plot defaultStyle={seriesStyle points=5 fill=1}
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/filter_debug/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/filter_debug/index.ts
index d4bf6ef6f569b5..c6db5ff4e3309e 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/filter_debug/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/filter_debug/index.ts
@@ -12,6 +12,7 @@ export const filterDebug: ElementFactory = () => ({
displayName: 'Debug filter',
help: 'Shows the underlying global filters in a workpad',
icon: 'bug',
- expression: `filters
+ expression: `kibana
+| selectFilter
| render as=debug`,
});
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_bar_chart/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_bar_chart/index.ts
index c15ca14572606f..9c01259c6d9e88 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_bar_chart/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_bar_chart/index.ts
@@ -13,7 +13,8 @@ export const horizontalBarChart: ElementFactory = () => ({
type: 'chart',
help: 'A customizable horizontal bar chart',
icon: 'visBarHorizontal',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| pointseries x="size(cost)" y="project" color="project"
| plot defaultStyle={seriesStyle bars=0.75 horizontalBars=true} legend=false
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_bar/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_bar/index.ts
index f4aabba4ca2161..ef278fbea3411e 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_bar/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_bar/index.ts
@@ -15,7 +15,8 @@ export const horizontalProgressBar: ElementFactory = () => ({
help: 'Displays progress as a portion of a horizontal bar',
width: 400,
height: 30,
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| math "mean(percent_uptime)"
| progress shape="horizontalBar" label={formatnumber 0%} font={font size=24 family="${openSans.value}" color="#000000" align=center}
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_pill/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_pill/index.ts
index d1d723a176b458..1675c2c78cdcbc 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_pill/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/horizontal_progress_pill/index.ts
@@ -15,7 +15,8 @@ export const horizontalProgressPill: ElementFactory = () => ({
help: 'Displays progress as a portion of a horizontal pill',
width: 400,
height: 30,
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| math "mean(percent_uptime)"
| progress shape="horizontalPill" label={formatnumber 0%} font={font size=24 family="${openSans.value}" color="#000000" align=center}
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/line_chart/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/line_chart/index.ts
index 84a3aee434141b..cdcb9bb584b5dd 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/line_chart/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/line_chart/index.ts
@@ -13,7 +13,8 @@ export const lineChart: ElementFactory = () => ({
type: 'chart',
help: 'A customizable line chart',
icon: 'visLine',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| pointseries x="time" y="mean(price)"
| plot defaultStyle={seriesStyle lines=3}
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/markdown/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/markdown/index.ts
index 6d8edd21c7e732..7bffff4fe95cd8 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/markdown/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/markdown/index.ts
@@ -12,7 +12,8 @@ export const markdown: ElementFactory = () => ({
type: 'text',
help: 'Add text using Markdown',
icon: 'visText',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| markdown "### Welcome to the Markdown element
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/metric/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/metric/index.ts
index 76176f6ba21330..aa18e235f5fd93 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/metric/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/metric/index.ts
@@ -19,13 +19,14 @@ export const metricElementInitializer: SetupInitializer = (core,
width: 200,
height: 100,
icon: 'visMetric',
- expression: `filters
- | demodata
- | math "unique(country)"
- | metric "Countries"
- metricFont={font size=48 family="${openSans.value}" color="#000000" align="center" lHeight=48}
- labelFont={font size=14 family="${openSans.value}" color="#000000" align="center"}
- metricFormat="${core.uiSettings.get(FORMATS_UI_SETTINGS.FORMAT_NUMBER_DEFAULT_PATTERN)}"
- | render`,
+ expression: `kibana
+| selectFilter
+| demodata
+| math "unique(country)"
+| metric "Countries"
+ metricFont={font size=48 family="${openSans.value}" color="#000000" align="center" lHeight=48}
+ labelFont={font size=14 family="${openSans.value}" color="#000000" align="center"}
+ metricFormat="${core.uiSettings.get(FORMATS_UI_SETTINGS.FORMAT_NUMBER_DEFAULT_PATTERN)}"
+| render`,
});
};
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/metric_vis/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/metric_vis/index.ts
index 3f01a8ccb3e731..3c5a4c16565c67 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/metric_vis/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/metric_vis/index.ts
@@ -12,9 +12,10 @@ export const metricVis: ElementFactory = () => ({
type: 'chart',
help: 'Metric visualization',
icon: 'visMetric',
- expression: `filters
- | demodata
- | head 1
- | metricVis metric={visdimension "percent_uptime"} colorMode="Labels"
- | render`,
+ expression: `kibana
+| selectFilter
+| demodata
+| head 1
+| metricVis metric={visdimension "percent_uptime"} colorMode="Labels"
+| render`,
});
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/pie/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/pie/index.ts
index 2094af748ab165..4739e6ca164749 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/pie/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/pie/index.ts
@@ -14,7 +14,8 @@ export const pie: ElementFactory = () => ({
height: 300,
help: 'A simple pie chart',
icon: 'visPie',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| pointseries color="state" size="max(price)"
| pie
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/plot/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/plot/index.ts
index 3e879b7fb58dba..c0ebfa60708d4a 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/plot/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/plot/index.ts
@@ -12,7 +12,8 @@ export const plot: ElementFactory = () => ({
displayName: 'Coordinate plot',
type: 'chart',
help: 'Mixed line, bar or dot charts',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| pointseries x="time" y="sum(price)" color="state"
| plot defaultStyle={seriesStyle points=5}
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_gauge/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_gauge/index.ts
index e07a848263f50a..85f853cea759b0 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_gauge/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_gauge/index.ts
@@ -16,7 +16,8 @@ export const progressGauge: ElementFactory = () => ({
width: 200,
height: 200,
icon: 'visGoal',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| math "mean(percent_uptime)"
| progress shape="gauge" label={formatnumber 0%} font={font size=24 family="${openSans.value}" color="#000000" align=center}
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_semicircle/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_semicircle/index.ts
index 6c61ab24d13b20..100f5c65eb94ac 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_semicircle/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_semicircle/index.ts
@@ -15,7 +15,8 @@ export const progressSemicircle: ElementFactory = () => ({
help: 'Displays progress as a portion of a semicircle',
width: 200,
height: 100,
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| math "mean(percent_uptime)"
| progress shape="semicircle" label={formatnumber 0%} font={font size=24 family="${openSans.value}" color="#000000" align=center}
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_wheel/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_wheel/index.ts
index 15fec0d3b63906..1d9ffde49ff8be 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_wheel/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/progress_wheel/index.ts
@@ -15,7 +15,8 @@ export const progressWheel: ElementFactory = () => ({
help: 'Displays progress as a portion of a wheel',
width: 200,
height: 200,
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| math "mean(percent_uptime)"
| progress shape="wheel" label={formatnumber 0%} font={font size=24 family="${openSans.value}" color="#000000" align=center}
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/repeat_image/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/repeat_image/index.ts
index 783b17e7d93621..6a064ffd297ecc 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/repeat_image/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/repeat_image/index.ts
@@ -12,7 +12,8 @@ export const repeatImage: ElementFactory = () => ({
displayName: 'Image repeat',
type: 'image',
help: 'Repeats an image N times',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| math "mean(cost)"
| repeatImage image=null
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/reveal_image/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/reveal_image/index.ts
index b2b4ea4a942a31..b78e0d1d5cf241 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/reveal_image/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/reveal_image/index.ts
@@ -12,7 +12,8 @@ export const revealImage: ElementFactory = () => ({
displayName: 'Image reveal',
type: 'image',
help: 'Reveals a percentage of an image',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| math "mean(percent_uptime)"
| revealImage origin=bottom image=null
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/table/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/table/index.ts
index 710f595ba71792..417fe09fbc5863 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/table/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/table/index.ts
@@ -13,7 +13,8 @@ export const table: ElementFactory = () => ({
type: 'chart',
help: 'A scrollable grid for displaying data in a tabular format',
icon: 'visTable',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| table
| render`,
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/tag_cloud/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/tag_cloud/index.ts
index b3543d532b9bea..698468ab2e1503 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/tag_cloud/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/tag_cloud/index.ts
@@ -12,10 +12,11 @@ export const tagCloud: ElementFactory = () => ({
type: 'chart',
help: 'Tagcloud visualization',
icon: 'visTagCloud',
- expression: `filters
- | demodata
- | ply by="country" fn={math "count(country)" | as "Count"}
- | filterrows fn={getCell "Count" | gte 10}
- | tagcloud metric={visdimension "Count"} bucket={visdimension "country"}
- | render`,
+ expression: `kibana
+| selectFilter
+| demodata
+| ply by="country" fn={math "count(country)" | as "Count"}
+| filterrows fn={getCell "Count" | gte 10}
+| tagcloud metric={visdimension "Count"} bucket={visdimension "country"}
+| render`,
});
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/vert_bar_chart/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/vert_bar_chart/index.ts
index de573166c8e9a7..a90f79aa995c59 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/vert_bar_chart/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/vert_bar_chart/index.ts
@@ -13,7 +13,8 @@ export const verticalBarChart: ElementFactory = () => ({
type: 'chart',
help: 'A customizable vertical bar chart',
icon: 'visBarVertical',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| pointseries x="project" y="size(cost)" color="project"
| plot defaultStyle={seriesStyle bars=0.75} legend=false
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/vertical_progress_bar/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/vertical_progress_bar/index.ts
index 04ee9c8cb7db2a..89ffc18766bcd1 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/vertical_progress_bar/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/vertical_progress_bar/index.ts
@@ -15,7 +15,8 @@ export const verticalProgressBar: ElementFactory = () => ({
help: 'Displays progress as a portion of a vertical bar',
width: 80,
height: 400,
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| math "mean(percent_uptime)"
| progress shape="verticalBar" label={formatnumber 0%} font={font size=24 family="${openSans.value}" color="#000000" align=center}
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/elements/vertical_progress_pill/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/elements/vertical_progress_pill/index.ts
index 7bbf3874f175f3..b3a977c1d795a7 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/elements/vertical_progress_pill/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/elements/vertical_progress_pill/index.ts
@@ -15,7 +15,8 @@ export const verticalProgressPill: ElementFactory = () => ({
help: 'Displays progress as a portion of a vertical pill',
width: 80,
height: 400,
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| math "mean(percent_uptime)"
| progress shape="verticalPill" label={formatnumber 0%} font={font size=24 family="${openSans.value}" color="#000000" align=center}
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/functions/common/exactly.ts b/x-pack/plugins/canvas/canvas_plugin_src/functions/common/exactly.ts
index c0ed25849ac97b..66553b6fda6c08 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/functions/common/exactly.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/functions/common/exactly.ts
@@ -47,13 +47,14 @@ export function exactly(): ExpressionFunctionDefinition<
},
},
fn: (input, args) => {
- const { value, column } = args;
+ const { value, column, filterGroup } = args;
const filter: ExpressionValueFilter = {
type: 'filter',
filterType: 'exactly',
value,
column,
+ filterGroup,
and: [],
};
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/functions/common/timefilter.ts b/x-pack/plugins/canvas/canvas_plugin_src/functions/common/timefilter.ts
index e4a6a102844a99..b61e03319b916f 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/functions/common/timefilter.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/functions/common/timefilter.ts
@@ -58,11 +58,12 @@ export function timefilter(): ExpressionFunctionDefinition<
return input;
}
- const { from, to, column } = args;
+ const { from, to, column, filterGroup } = args;
const filter: ExpressionValueFilter = {
type: 'filter',
filterType: 'time',
column,
+ filterGroup,
and: [],
};
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/functions/server/filters.test.ts b/x-pack/plugins/canvas/canvas_plugin_src/functions/server/filters.test.ts
new file mode 100644
index 00000000000000..75bd97421e58e3
--- /dev/null
+++ b/x-pack/plugins/canvas/canvas_plugin_src/functions/server/filters.test.ts
@@ -0,0 +1,26 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { fromExpression } from '@kbn/interpreter';
+import { filters } from './filters';
+
+const { migrations } = filters();
+
+describe('filters migrations', () => {
+ const expression = 'filters group="1" group="3" ungrouped=true';
+ const ast = fromExpression(expression);
+ it('8.1.0. Should migrate `filters` expression to `kibana | selectFilter`', () => {
+ const migratedAst = migrations?.['8.1.0'](ast.chain[0]);
+ expect(migratedAst !== null && typeof migratedAst === 'object').toBeTruthy();
+ expect(migratedAst.type).toBe('expression');
+ expect(Array.isArray(migratedAst.chain)).toBeTruthy();
+ expect(migratedAst.chain[0].function === 'kibana').toBeTruthy();
+ expect(migratedAst.chain[0].arguments).toEqual({});
+ expect(migratedAst.chain[1].function === 'selectFilter').toBeTruthy();
+ expect(migratedAst.chain[1].arguments).toEqual(ast.chain[0].arguments);
+ });
+});
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/functions/server/filters.ts b/x-pack/plugins/canvas/canvas_plugin_src/functions/server/filters.ts
new file mode 100644
index 00000000000000..8b46e818209f3e
--- /dev/null
+++ b/x-pack/plugins/canvas/canvas_plugin_src/functions/server/filters.ts
@@ -0,0 +1,43 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import {
+ ExpressionValueFilter,
+ ExpressionAstExpression,
+ ExpressionAstFunction,
+} from 'src/plugins/expressions';
+import { fromExpression } from '@kbn/interpreter';
+import { buildFiltersFunction } from '../../../common/functions';
+import type { FiltersFunction } from '../../../common/functions';
+
+/*
+ Expression function `filters` can't be used on the server, because it is tightly coupled with the redux store.
+ It is replaced with `kibana | selectFilter`.
+
+ Current filters function definition is used only for the purpose of enabling migrations.
+ The function has to be registered on the server while the plugin's setup, to be able to run its migration.
+*/
+const filtersFn = (): ExpressionValueFilter => ({
+ type: 'filter',
+ and: [],
+});
+
+const migrations: FiltersFunction['migrations'] = {
+ '8.1.0': (ast: ExpressionAstFunction): ExpressionAstFunction | ExpressionAstExpression => {
+ const SELECT_FILTERS = 'selectFilter';
+ const newExpression = `kibana | ${SELECT_FILTERS}`;
+ const newAst: ExpressionAstExpression = fromExpression(newExpression);
+ const selectFiltersAstIndex = newAst.chain.findIndex(
+ ({ function: fnName }) => fnName === SELECT_FILTERS
+ );
+ const selectFilterAst = newAst.chain[selectFiltersAstIndex];
+ newAst.chain.splice(selectFiltersAstIndex, 1, { ...selectFilterAst, arguments: ast.arguments });
+ return newAst;
+ },
+};
+
+export const filters = buildFiltersFunction(filtersFn, migrations);
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/functions/server/index.ts b/x-pack/plugins/canvas/canvas_plugin_src/functions/server/index.ts
index ae3778366651cf..388db9e6e59604 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/functions/server/index.ts
+++ b/x-pack/plugins/canvas/canvas_plugin_src/functions/server/index.ts
@@ -7,5 +7,6 @@
import { demodata } from './demodata';
import { pointseries } from './pointseries';
+import { filters } from './filters';
-export const functions = [demodata, pointseries];
+export const functions = [filters, demodata, pointseries];
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/renderers/__stories__/render.tsx b/x-pack/plugins/canvas/canvas_plugin_src/renderers/__stories__/render.tsx
index 643d7cdedc50d2..38d1d502704e2a 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/renderers/__stories__/render.tsx
+++ b/x-pack/plugins/canvas/canvas_plugin_src/renderers/__stories__/render.tsx
@@ -21,7 +21,6 @@ export const defaultHandlers: RendererHandlers = {
onEmbeddableInputChange: action('onEmbeddableInputChange'),
onResize: action('onResize'),
resize: action('resize'),
- setFilter: action('setFilter'),
done: action('done'),
onDestroy: action('onDestroy'),
reload: action('reload'),
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/advanced_filter/index.tsx b/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/advanced_filter/index.tsx
index b831c9aa70e49d..a31021cba4c108 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/advanced_filter/index.tsx
+++ b/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/advanced_filter/index.tsx
@@ -25,7 +25,10 @@ export const advancedFilterFactory: StartInitializer> =
render(domNode, _, handlers) {
ReactDOM.render(
-
+ handlers.event({ name: 'applyFilterAction', data: filter })}
+ value={handlers.getFilter()}
+ />
,
domNode,
() => handlers.done()
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/dropdown_filter/index.tsx b/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/dropdown_filter/index.tsx
index 372bcbb5642cbb..5e4ea42990e47c 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/dropdown_filter/index.tsx
+++ b/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/dropdown_filter/index.tsx
@@ -55,20 +55,19 @@ export const dropdownFilterFactory: StartInitializer> =
(filterExpression === undefined || !filterExpression.includes('exactly'))
) {
filterExpression = '';
- handlers.setFilter(filterExpression);
+ handlers.event({ name: 'applyFilterAction', data: filterExpression });
} else if (filterExpression !== '') {
// NOTE: setFilter() will cause a data refresh, avoid calling unless required
// compare expression and filter, update filter if needed
const { changed, newAst } = syncFilterExpression(config, filterExpression, ['filterGroup']);
if (changed) {
- handlers.setFilter(toExpression(newAst));
+ handlers.event({ name: 'applyFilterAction', data: toExpression(newAst) });
}
}
-
const commit = (commitValue: string) => {
if (commitValue === '%%CANVAS_MATCH_ALL%%') {
- handlers.setFilter('');
+ handlers.event({ name: 'applyFilterAction', data: '' });
} else {
const newFilterAST: Ast = {
type: 'expression',
@@ -86,18 +85,19 @@ export const dropdownFilterFactory: StartInitializer> =
};
const newFilter = toExpression(newFilterAST);
- handlers.setFilter(newFilter);
+ handlers.event({ name: 'applyFilterAction', data: newFilter });
}
};
+ const filter = (
+
+ );
ReactDOM.render(
-
-
- ,
+ {filter},
domNode,
() => handlers.done()
);
diff --git a/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/time_filter/index.tsx b/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/time_filter/index.tsx
index e81ca2cc1f0571..f7e9d333f86835 100644
--- a/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/time_filter/index.tsx
+++ b/x-pack/plugins/canvas/canvas_plugin_src/renderers/filters/time_filter/index.tsx
@@ -45,7 +45,7 @@ export const timeFilterFactory: StartInitializer> = (
if (filterExpression === undefined || filterExpression.indexOf('timefilter') !== 0) {
filterExpression = defaultTimeFilterExpression;
- handlers.setFilter(filterExpression);
+ handlers.event({ name: 'applyFilterAction', data: filterExpression });
} else if (filterExpression !== '') {
// NOTE: setFilter() will cause a data refresh, avoid calling unless required
// compare expression and filter, update filter if needed
@@ -55,14 +55,14 @@ export const timeFilterFactory: StartInitializer> = (
]);
if (changed) {
- handlers.setFilter(toExpression(newAst));
+ handlers.event({ name: 'applyFilterAction', data: toExpression(newAst) });
}
}
ReactDOM.render(
handlers.event({ name: 'applyFilterAction', data: filter })}
filter={filterExpression}
commonlyUsedRanges={customQuickRanges}
dateFormat={customDateFormat}
diff --git a/x-pack/plugins/canvas/common/functions/filters.ts b/x-pack/plugins/canvas/common/functions/filters.ts
new file mode 100644
index 00000000000000..5c48fbd10862af
--- /dev/null
+++ b/x-pack/plugins/canvas/common/functions/filters.ts
@@ -0,0 +1,56 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { ExpressionFunctionDefinition } from 'src/plugins/expressions/public';
+import { ExpressionValueFilter } from '../../types';
+import { getFunctionHelp } from '../../i18n';
+
+export interface Arguments {
+ group: string[];
+ ungrouped: boolean;
+}
+
+export type FiltersFunction = ExpressionFunctionDefinition<
+ 'filters',
+ null,
+ Arguments,
+ ExpressionValueFilter
+>;
+
+export function buildFiltersFunction(
+ fn: FiltersFunction['fn'],
+ migrations?: FiltersFunction['migrations']
+) {
+ return function filters(): FiltersFunction {
+ const { help, args: argHelp } = getFunctionHelp().filters;
+
+ return {
+ name: 'filters',
+ type: 'filter',
+ help,
+ context: {
+ types: ['null'],
+ },
+ args: {
+ group: {
+ aliases: ['_'],
+ types: ['string'],
+ help: argHelp.group,
+ multi: true,
+ },
+ ungrouped: {
+ aliases: ['nogroup', 'nogroups'],
+ types: ['boolean'],
+ help: argHelp.ungrouped,
+ default: false,
+ },
+ },
+ fn,
+ migrations,
+ };
+ };
+}
diff --git a/x-pack/plugins/canvas/common/functions/index.ts b/x-pack/plugins/canvas/common/functions/index.ts
new file mode 100644
index 00000000000000..08d9391f81c134
--- /dev/null
+++ b/x-pack/plugins/canvas/common/functions/index.ts
@@ -0,0 +1,9 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+export type { FiltersFunction } from './filters';
+export { buildFiltersFunction } from './filters';
diff --git a/x-pack/plugins/canvas/common/lib/build_embeddable_filters.ts b/x-pack/plugins/canvas/common/lib/build_embeddable_filters.ts
index 57fdc7d7309ce6..c98d2f080452ab 100644
--- a/x-pack/plugins/canvas/common/lib/build_embeddable_filters.ts
+++ b/x-pack/plugins/canvas/common/lib/build_embeddable_filters.ts
@@ -6,6 +6,8 @@
*/
import { buildQueryFilter, Filter } from '@kbn/es-query';
+import dateMath from '@elastic/datemath';
+import { maxBy, minBy } from 'lodash';
import { ExpressionValueFilter } from '../../types';
// @ts-expect-error untyped local
import { buildBoolArray } from './build_bool_array';
@@ -16,24 +18,45 @@ export interface EmbeddableFilterInput {
timeRange?: TimeRange;
}
+type ESFilter = Record;
+
const TimeFilterType = 'time';
+const formatTime = (str: string | undefined, roundUp: boolean = false) => {
+ if (!str) {
+ return null;
+ }
+ const moment = dateMath.parse(str, { roundUp });
+ return !moment || !moment.isValid() ? null : moment.valueOf();
+};
+
function getTimeRangeFromFilters(filters: ExpressionValueFilter[]): TimeRange | undefined {
- const timeFilter = filters.find(
- (filter) => filter.filterType !== undefined && filter.filterType === TimeFilterType
+ const timeFilters = filters.filter(
+ (filter) =>
+ filter.filterType !== undefined &&
+ filter.filterType === TimeFilterType &&
+ filter.from !== undefined &&
+ filter.to !== undefined
);
- return timeFilter !== undefined && timeFilter.from !== undefined && timeFilter.to !== undefined
- ? {
- from: timeFilter.from,
- to: timeFilter.to,
- }
+ const validatedTimeFilters = timeFilters.filter(
+ (filter) => formatTime(filter.from) !== null && formatTime(filter.to, true) !== null
+ );
+
+ const minFromFilter = minBy(validatedTimeFilters, (filter) => formatTime(filter.from));
+ const maxToFilter = maxBy(validatedTimeFilters, (filter) => formatTime(filter.to, true));
+
+ return minFromFilter?.from && maxToFilter?.to
+ ? { from: minFromFilter.from, to: maxToFilter.to }
: undefined;
}
export function getQueryFilters(filters: ExpressionValueFilter[]): Filter[] {
const dataFilters = filters.map((filter) => ({ ...filter, type: filter.filterType }));
- return buildBoolArray(dataFilters).map(buildQueryFilter);
+ return buildBoolArray(dataFilters).map((filter: ESFilter, index: number) => {
+ const { group, ...restFilter } = filter;
+ return buildQueryFilter(restFilter, index.toString(), '', { group });
+ });
}
export function buildEmbeddableFilters(filters: ExpressionValueFilter[]): EmbeddableFilterInput {
diff --git a/x-pack/plugins/canvas/common/lib/constants.ts b/x-pack/plugins/canvas/common/lib/constants.ts
index 6a61ec595acb7c..fa938f2c07c748 100644
--- a/x-pack/plugins/canvas/common/lib/constants.ts
+++ b/x-pack/plugins/canvas/common/lib/constants.ts
@@ -16,6 +16,8 @@ export const APP_ROUTE = '/app/canvas';
export const APP_ROUTE_WORKPAD = `${APP_ROUTE}#/workpad`;
export const API_ROUTE = '/api/canvas';
export const API_ROUTE_WORKPAD = `${API_ROUTE}/workpad`;
+export const API_ROUTE_WORKPAD_EXPORT = `${API_ROUTE_WORKPAD}/export`;
+export const API_ROUTE_WORKPAD_IMPORT = `${API_ROUTE_WORKPAD}/import`;
export const API_ROUTE_WORKPAD_ASSETS = `${API_ROUTE}/workpad-assets`;
export const API_ROUTE_WORKPAD_STRUCTURES = `${API_ROUTE}/workpad-structures`;
export const API_ROUTE_CUSTOM_ELEMENT = `${API_ROUTE}/custom-element`;
diff --git a/x-pack/plugins/canvas/common/lib/filters.js b/x-pack/plugins/canvas/common/lib/filters.js
index 08caded52aa26b..f43e2dd3b46065 100644
--- a/x-pack/plugins/canvas/common/lib/filters.js
+++ b/x-pack/plugins/canvas/common/lib/filters.js
@@ -13,15 +13,16 @@ export function time(filter) {
if (!filter.column) {
throw new Error('column is required for Elasticsearch range filters');
}
+ const { from, to, column, filterGroup: group } = filter;
return {
- range: {
- [filter.column]: { gte: filter.from, lte: filter.to },
- },
+ group,
+ range: { [column]: { gte: from, lte: to } },
};
}
export function luceneQueryString(filter) {
return {
+ group: filter.filterGroup,
query_string: {
query: filter.query || '*',
},
@@ -30,6 +31,7 @@ export function luceneQueryString(filter) {
export function exactly(filter) {
return {
+ group: filter.filterGroup,
term: {
[filter.column]: {
value: filter.value,
diff --git a/x-pack/plugins/canvas/public/components/datasource/datasource_preview/index.js b/x-pack/plugins/canvas/public/components/datasource/datasource_preview/index.js
index 89faef29a3b02c..1ca674bfb6f9d3 100644
--- a/x-pack/plugins/canvas/public/components/datasource/datasource_preview/index.js
+++ b/x-pack/plugins/canvas/public/components/datasource/datasource_preview/index.js
@@ -7,16 +7,19 @@
import React, { useState, useEffect } from 'react';
import { PropTypes } from 'prop-types';
-import { interpretAst } from '../../../lib/run_interpreter';
import { Loading } from '../../loading';
+import { useExpressionsService } from '../../../services';
import { DatasourcePreview as Component } from './datasource_preview';
export const DatasourcePreview = (props) => {
const [datatable, setDatatable] = useState();
+ const expressionsService = useExpressionsService();
useEffect(() => {
- interpretAst({ type: 'expression', chain: [props.function] }, {}).then(setDatatable);
- }, [props.function, setDatatable]);
+ expressionsService
+ .interpretAst({ type: 'expression', chain: [props.function] }, {})
+ .then(setDatatable);
+ }, [expressionsService, props.function, setDatatable]);
if (!datatable) {
return ;
diff --git a/x-pack/plugins/canvas/public/components/function_form_list/index.js b/x-pack/plugins/canvas/public/components/function_form_list/index.js
index 6048ac360386c9..31db3366ce3b5c 100644
--- a/x-pack/plugins/canvas/public/components/function_form_list/index.js
+++ b/x-pack/plugins/canvas/public/components/function_form_list/index.js
@@ -8,7 +8,7 @@
import { compose, withProps } from 'recompose';
import { get } from 'lodash';
import { toExpression } from '@kbn/interpreter';
-import { interpretAst } from '../../lib/run_interpreter';
+import { pluginServices } from '../../services';
import { getArgTypeDef } from '../../lib/args';
import { FunctionFormList as Component } from './function_form_list';
@@ -77,24 +77,27 @@ const componentFactory = ({
path,
parentPath,
removable,
-}) => ({
- args,
- nestedFunctionsArgs: argsWithExprFunctions,
- argType: argType.function,
- argTypeDef: Object.assign(argTypeDef, {
- args: argumentsView,
- name: argUiConfig?.name ?? argTypeDef.name,
- displayName: argUiConfig?.displayName ?? argTypeDef.displayName,
- help: argUiConfig?.help ?? argTypeDef.name,
- }),
- argResolver: (argAst) => interpretAst(argAst, prevContext),
- contextExpression: getExpression(prevContext),
- expressionIndex, // preserve the index in the AST
- nextArgType: nextArg && nextArg.function,
- path,
- parentPath,
- removable,
-});
+}) => {
+ const { expressions } = pluginServices.getServices();
+ return {
+ args,
+ nestedFunctionsArgs: argsWithExprFunctions,
+ argType: argType.function,
+ argTypeDef: Object.assign(argTypeDef, {
+ args: argumentsView,
+ name: argUiConfig?.name ?? argTypeDef.name,
+ displayName: argUiConfig?.displayName ?? argTypeDef.displayName,
+ help: argUiConfig?.help ?? argTypeDef.name,
+ }),
+ argResolver: (argAst) => expressions.interpretAst(argAst, prevContext),
+ contextExpression: getExpression(prevContext),
+ expressionIndex, // preserve the index in the AST
+ nextArgType: nextArg && nextArg.function,
+ path,
+ parentPath,
+ removable,
+ };
+};
/**
* Converts expression functions at the arguments for the expression, to the array of UI component configurations.
diff --git a/x-pack/plugins/canvas/public/components/function_reference_generator/function_examples.ts b/x-pack/plugins/canvas/public/components/function_reference_generator/function_examples.ts
index a8409270752ad8..785f183b193f13 100644
--- a/x-pack/plugins/canvas/public/components/function_reference_generator/function_examples.ts
+++ b/x-pack/plugins/canvas/public/components/function_reference_generator/function_examples.ts
@@ -22,7 +22,8 @@ export const getFunctionExamples = (): FunctionExampleDict => ({
syntax: `all {neq "foo"} {neq "bar"} {neq "fizz"}
all condition={gt 10} condition={lt 20}`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| math "mean(percent_uptime)"
| formatnumber "0.0%"
@@ -42,7 +43,8 @@ all condition={gt 10} condition={lt 20}`,
syntax: `alterColumn "cost" type="string"
alterColumn column="@timestamp" name="foo"`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| alterColumn "time" name="time_in_ms" type="number"
| table
@@ -54,7 +56,8 @@ alterColumn column="@timestamp" name="foo"`,
syntax: `any {eq "foo"} {eq "bar"} {eq "fizz"}
any condition={lte 10} condition={gt 30}`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| filterrows {
getCell "project" | any {eq "elasticsearch"} {eq "kibana"} {eq "x-pack"}
@@ -70,7 +73,8 @@ any condition={lte 10} condition={gt 30}`,
as "foo"
as name="bar"`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| ply by="project" fn={math "count(username)" | as "num_users"} fn={math "mean(price)" | as "price"}
| pointseries x="project" y="num_users" size="price" color="project"
@@ -94,7 +98,8 @@ asset id="asset-498f7429-4d56-42a2-a7e4-8bf08d98d114"`,
syntax: `axisConfig show=false
axisConfig position="right" min=0 max=10 tickSize=1`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| pointseries x="size(cost)" y="project" color="project"
| plot defaultStyle={seriesStyle bars=0.75 horizontalBars=true}
@@ -133,7 +138,8 @@ case if={lte 50} then="green"`,
syntax: `columns include="@timestamp, projects, cost"
columns exclude="username, country, age"`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| columns include="price, cost, state, project"
| table
@@ -145,7 +151,8 @@ columns exclude="username, country, age"`,
syntax: `compare "neq" to="elasticsearch"
compare op="lte" to=100`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| mapColumn project
fn={getCell project |
@@ -229,7 +236,8 @@ date "01/31/2019" format="MM/DD/YYYY"`,
demodata "ci"
demodata type="shirts"`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| table
| render`,
@@ -252,7 +260,8 @@ eq null
eq 10
eq "foo"`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| mapColumn project
fn={getCell project |
@@ -272,7 +281,8 @@ eq "foo"`,
escount "currency:\"EUR\"" index="kibana_sample_data_ecommerce"
escount query="response:404" index="kibana_sample_data_logs"`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| escount "Cancelled:true" index="kibana_sample_data_flights"
| math "value"
| progress shape="semicircle"
@@ -290,7 +300,8 @@ esdocs query="response:404" index="kibana_sample_data_logs"
esdocs index="kibana_sample_data_flights" count=100
esdocs index="kibana_sample_data_flights" sort="AvgTicketPrice, asc"`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| esdocs index="kibana_sample_data_ecommerce"
fields="customer_gender, taxful_total_price, order_date"
sort="order_date, asc"
@@ -309,7 +320,8 @@ esdocs index="kibana_sample_data_flights" sort="AvgTicketPrice, asc"`,
syntax: `essql query="SELECT * FROM \"logstash*\""
essql "SELECT * FROM \"apm*\"" count=10000`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| essql query="SELECT Carrier, FlightDelayMin, AvgTicketPrice FROM \"kibana_sample_data_flights\""
| table
| render`,
@@ -321,7 +333,8 @@ essql "SELECT * FROM \"apm*\"" count=10000`,
exactly "age" value=50 filterGroup="group2"
exactly column="project" value="beats"`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| exactly column=project value=elasticsearch
| demodata
| pointseries x=project y="mean(age)"
@@ -334,7 +347,8 @@ exactly column="project" value="beats"`,
syntax: `filterrows {getCell "project" | eq "kibana"}
filterrows fn={getCell "age" | gt 50}`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| filterrows {getCell "country" | any {eq "IN"} {eq "US"} {eq "CN"}}
| mapColumn "@timestamp"
@@ -379,7 +393,8 @@ font underline=true
font italic=false
font lHeight=32`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| pointseries x="project" y="size(cost)" color="project"
| plot defaultStyle={seriesStyle bars=0.75} legend=false
@@ -399,7 +414,8 @@ font lHeight=32`,
syntax: `formatdate format="YYYY-MM-DD"
formatdate "MM/DD/YYYY"`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| mapColumn "time" fn={getCell time | formatdate "MMM 'YY"}
| pointseries x="time" y="sum(price)" color="state"
@@ -412,7 +428,8 @@ formatdate "MM/DD/YYYY"`,
syntax: `formatnumber format="$0,0.00"
formatnumber "0.0a"`,
usage: {
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| math "mean(percent_uptime)"
| progress shape="gauge"
diff --git a/x-pack/plugins/canvas/public/components/home/hooks/use_create_workpad.ts b/x-pack/plugins/canvas/public/components/home/hooks/use_create_workpad.ts
index eb87f4720deec9..3290bc8227a292 100644
--- a/x-pack/plugins/canvas/public/components/home/hooks/use_create_workpad.ts
+++ b/x-pack/plugins/canvas/public/components/home/hooks/use_create_workpad.ts
@@ -29,7 +29,7 @@ export const useCreateWorkpad = () => {
history.push(`/workpad/${workpad.id}/page/1`);
} catch (err) {
notifyService.error(err, {
- title: errors.getUploadFailureErrorMessage(),
+ title: errors.getCreateFailureErrorMessage(),
});
}
return;
@@ -39,8 +39,8 @@ export const useCreateWorkpad = () => {
};
const errors = {
- getUploadFailureErrorMessage: () =>
- i18n.translate('xpack.canvas.error.useCreateWorkpad.uploadFailureErrorMessage', {
- defaultMessage: `Couldn't upload workpad`,
+ getCreateFailureErrorMessage: () =>
+ i18n.translate('xpack.canvas.error.useCreateWorkpad.createFailureErrorMessage', {
+ defaultMessage: `Couldn't create workpad`,
}),
};
diff --git a/x-pack/plugins/canvas/public/components/home/hooks/use_import_workpad.ts b/x-pack/plugins/canvas/public/components/home/hooks/use_import_workpad.ts
new file mode 100644
index 00000000000000..8c8d2e26d8a224
--- /dev/null
+++ b/x-pack/plugins/canvas/public/components/home/hooks/use_import_workpad.ts
@@ -0,0 +1,44 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { useCallback } from 'react';
+import { useHistory } from 'react-router-dom';
+import { i18n } from '@kbn/i18n';
+
+// @ts-expect-error
+import { getDefaultWorkpad } from '../../../state/defaults';
+import { useNotifyService, useWorkpadService } from '../../../services';
+
+import type { CanvasWorkpad } from '../../../../types';
+
+export const useImportWorkpad = () => {
+ const workpadService = useWorkpadService();
+ const notifyService = useNotifyService();
+ const history = useHistory();
+
+ return useCallback(
+ async (workpad: CanvasWorkpad) => {
+ try {
+ const importedWorkpad = await workpadService.import(workpad);
+ history.push(`/workpad/${importedWorkpad.id}/page/1`);
+ } catch (err) {
+ notifyService.error(err, {
+ title: errors.getUploadFailureErrorMessage(),
+ });
+ }
+ return;
+ },
+ [notifyService, history, workpadService]
+ );
+};
+
+const errors = {
+ getUploadFailureErrorMessage: () =>
+ i18n.translate('xpack.canvas.error.useUploadWorkpad.uploadFailureErrorMessage', {
+ defaultMessage: `Couldn't upload workpad`,
+ }),
+};
diff --git a/x-pack/plugins/canvas/public/components/home/hooks/use_upload_workpad.ts b/x-pack/plugins/canvas/public/components/home/hooks/use_upload_workpad.ts
index caec30e083d405..045ff8b52e2590 100644
--- a/x-pack/plugins/canvas/public/components/home/hooks/use_upload_workpad.ts
+++ b/x-pack/plugins/canvas/public/components/home/hooks/use_upload_workpad.ts
@@ -9,19 +9,25 @@ import { useCallback } from 'react';
import { get } from 'lodash';
import { i18n } from '@kbn/i18n';
+import { SavedObject } from 'kibana/public';
import { CANVAS, JSON as JSONString } from '../../../../i18n/constants';
import { useNotifyService } from '../../../services';
import { getId } from '../../../lib/get_id';
-
-import { useCreateWorkpad } from './use_create_workpad';
+import { useImportWorkpad as useImportWorkpadHook } from './use_import_workpad';
import type { CanvasWorkpad } from '../../../../types';
+const isInvalidWorkpad = (workpad: CanvasWorkpad) =>
+ !Array.isArray(workpad.pages) || workpad.pages.length === 0 || !workpad.assets;
+
export const useImportWorkpad = () => {
const notifyService = useNotifyService();
- const createWorkpad = useCreateWorkpad();
+ const importWorkpad = useImportWorkpadHook();
return useCallback(
- (file?: File, onComplete: (workpad?: CanvasWorkpad) => void = () => {}) => {
+ (
+ file?: File,
+ onComplete: (workpad?: CanvasWorkpad | SavedObject) => void = () => {}
+ ) => {
if (!file) {
onComplete();
return;
@@ -42,16 +48,17 @@ export const useImportWorkpad = () => {
// handle reading the uploaded file
reader.onload = async () => {
try {
- const workpad = JSON.parse(reader.result as string); // Type-casting because we catch below.
+ const workpad: CanvasWorkpad = JSON.parse(reader.result as string); // Type-casting because we catch below.
+
workpad.id = getId('workpad');
// sanity check for workpad object
- if (!Array.isArray(workpad.pages) || workpad.pages.length === 0 || !workpad.assets) {
+ if (isInvalidWorkpad(workpad)) {
onComplete();
throw new Error(errors.getMissingPropertiesErrorMessage());
}
- await createWorkpad(workpad);
+ await importWorkpad(workpad);
onComplete(workpad);
} catch (e) {
notifyService.error(e, {
@@ -66,7 +73,7 @@ export const useImportWorkpad = () => {
// read the uploaded file
reader.readAsText(file);
},
- [notifyService, createWorkpad]
+ [notifyService, importWorkpad]
);
};
diff --git a/x-pack/plugins/canvas/public/components/workpad_filters/hooks/use_canvas_filters.ts b/x-pack/plugins/canvas/public/components/workpad_filters/hooks/use_canvas_filters.ts
index 85b195214d44bf..21bcc89304b3c8 100644
--- a/x-pack/plugins/canvas/public/components/workpad_filters/hooks/use_canvas_filters.ts
+++ b/x-pack/plugins/canvas/public/components/workpad_filters/hooks/use_canvas_filters.ts
@@ -5,19 +5,22 @@
* 2.0.
*/
-import { fromExpression } from '@kbn/interpreter';
+import { ExpressionFunctionAST, fromExpression } from '@kbn/interpreter';
import { shallowEqual, useSelector } from 'react-redux';
import { State } from '../../../../types';
-import { getFiltersByGroups } from '../../../lib/filter';
+import { getFiltersByFilterExpressions } from '../../../lib/filter';
import { adaptCanvasFilter } from '../../../lib/filter_adapters';
-import { getGlobalFilters } from '../../../state/selectors/workpad';
+import { useFiltersService } from '../../../services';
-const extractExpressionAST = (filtersExpressions: string[]) =>
- fromExpression(filtersExpressions.join(' | '));
+const extractExpressionAST = (filters: string[]) => fromExpression(filters.join(' | '));
-export function useCanvasFilters(groups: string[] = [], ungrouped: boolean = false) {
- const filterExpressions = useSelector((state: State) => getGlobalFilters(state), shallowEqual);
- const filtersByGroups = getFiltersByGroups(filterExpressions, groups, ungrouped);
+export function useCanvasFilters(filterExprsToGroupBy: ExpressionFunctionAST[] = []) {
+ const filtersService = useFiltersService();
+ const filterExpressions = useSelector(
+ (state: State) => filtersService.getFilters(state),
+ shallowEqual
+ );
+ const filtersByGroups = getFiltersByFilterExpressions(filterExpressions, filterExprsToGroupBy);
const expression = extractExpressionAST(filtersByGroups);
const filters = expression.chain.map(adaptCanvasFilter);
diff --git a/x-pack/plugins/canvas/public/components/workpad_filters/workpad_filters.tsx b/x-pack/plugins/canvas/public/components/workpad_filters/workpad_filters.tsx
index 610e6e56af3502..20ec56706480d3 100644
--- a/x-pack/plugins/canvas/public/components/workpad_filters/workpad_filters.tsx
+++ b/x-pack/plugins/canvas/public/components/workpad_filters/workpad_filters.tsx
@@ -8,11 +8,7 @@
import React, { FC, useCallback } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { State, FilterField, PositionedElement } from '../../../types';
-import {
- extractGroupsFromElementsFilters,
- groupFiltersBy,
- extractUngroupedFromElementsFilters,
-} from '../../lib/filter';
+import { groupFiltersBy, getFiltersExprsFromExpression } from '../../lib/filter';
import { setGroupFiltersByOption } from '../../state/actions/sidebar';
import { getGroupFiltersByOption } from '../../state/selectors/sidebar';
import { useCanvasFilters } from './hooks';
@@ -35,11 +31,8 @@ export const WorkpadFilters: FC = ({ element }) => {
},
[dispatch]
);
-
- const groups = element ? extractGroupsFromElementsFilters(element.expression) : undefined;
- const ungrouped = element ? extractUngroupedFromElementsFilters(element.expression) : false;
-
- const canvasFilters = useCanvasFilters(groups, ungrouped);
+ const filterExprs = element ? getFiltersExprsFromExpression(element.expression) : [];
+ const canvasFilters = useCanvasFilters(filterExprs);
const filtersGroups = groupFiltersByField
? groupFiltersBy(canvasFilters, groupFiltersByField)
diff --git a/x-pack/plugins/canvas/public/components/workpad_header/element_menu/__stories__/element_menu.stories.tsx b/x-pack/plugins/canvas/public/components/workpad_header/element_menu/__stories__/element_menu.stories.tsx
index 9d37873bcae0a4..62d070dbf00f54 100644
--- a/x-pack/plugins/canvas/public/components/workpad_header/element_menu/__stories__/element_menu.stories.tsx
+++ b/x-pack/plugins/canvas/public/components/workpad_header/element_menu/__stories__/element_menu.stories.tsx
@@ -17,7 +17,8 @@ const testElements: { [key: string]: ElementSpec } = {
displayName: 'Area chart',
help: 'A line chart with a filled body',
type: 'chart',
- expression: `filters
+ expression: `kibana
+ | selectFilter
| demodata
| pointseries x="time" y="mean(price)"
| plot defaultStyle={seriesStyle lines=1 fill=1}
@@ -47,7 +48,8 @@ const testElements: { [key: string]: ElementSpec } = {
displayName: 'Debug filter',
help: 'Shows the underlying global filters in a workpad',
icon: 'bug',
- expression: `filters
+ expression: `kibana
+ | selectFilter
| render as=debug`,
},
image: {
@@ -64,7 +66,8 @@ const testElements: { [key: string]: ElementSpec } = {
type: 'text',
help: 'Add text using Markdown',
icon: 'visText',
- expression: `filters
+ expression: `kibana
+| selectFilter
| demodata
| markdown "### Welcome to the Markdown element
@@ -89,7 +92,8 @@ You can use standard Markdown in here, but you can also access your piped-in dat
width: 200,
height: 200,
icon: 'visGoal',
- expression: `filters
+ expression: `kibana
+ | selectFilter
| demodata
| math "mean(percent_uptime)"
| progress shape="gauge" label={formatnumber 0%} font={font size=24 family="Helvetica" color="#000000" align=center}
@@ -111,7 +115,8 @@ You can use standard Markdown in here, but you can also access your piped-in dat
displayName: 'Data table',
type: 'chart',
help: 'A scrollable grid for displaying data in a tabular format',
- expression: `filters
+ expression: `kibana
+ | selectFilter
| demodata
| table
| render`,
diff --git a/x-pack/plugins/canvas/public/functions/filters.ts b/x-pack/plugins/canvas/public/functions/filters.ts
index 2634d76297b588..a168020b6eef87 100644
--- a/x-pack/plugins/canvas/public/functions/filters.ts
+++ b/x-pack/plugins/canvas/public/functions/filters.ts
@@ -7,15 +7,10 @@
import { fromExpression } from '@kbn/interpreter';
import { get } from 'lodash';
-import { ExpressionFunctionDefinition } from 'src/plugins/expressions/public';
-import { interpretAst } from '../lib/run_interpreter';
-// @ts-expect-error untyped local
-import { getState } from '../state/store';
-import { getGlobalFilters, getWorkpadVariablesAsObject } from '../state/selectors/workpad';
-import { ExpressionValueFilter } from '../../types';
-import { getFunctionHelp } from '../../i18n';
+import { pluginServices } from '../services';
+import type { FiltersFunction } from '../../common/functions';
+import { buildFiltersFunction } from '../../common/functions';
import { InitializeArguments } from '.';
-import { getFiltersByGroups } from '../lib/filter';
export interface Arguments {
group: string[];
@@ -31,58 +26,34 @@ function getFiltersByGroup(allFilters: string[], groups?: string[], ungrouped =
// remove all allFilters that belong to a group
return allFilters.filter((filter: string) => {
const ast = fromExpression(filter);
- const expGroups = get(ast, 'chain[0].arguments.filterGroup', []);
+ const expGroups: string[] = get(ast, 'chain[0].arguments.filterGroup', []);
return expGroups.length === 0;
});
}
- return getFiltersByGroups(allFilters, groups);
+ return allFilters.filter((filter: string) => {
+ const ast = fromExpression(filter);
+ const expGroups: string[] = get(ast, 'chain[0].arguments.filterGroup', []);
+ return expGroups.length > 0 && expGroups.every((expGroup) => groups.includes(expGroup));
+ });
}
-type FiltersFunction = ExpressionFunctionDefinition<
- 'filters',
- null,
- Arguments,
- ExpressionValueFilter
->;
-
export function filtersFunctionFactory(initialize: InitializeArguments): () => FiltersFunction {
- return function filters(): FiltersFunction {
- const { help, args: argHelp } = getFunctionHelp().filters;
-
- return {
- name: 'filters',
- type: 'filter',
- help,
- context: {
- types: ['null'],
- },
- args: {
- group: {
- aliases: ['_'],
- types: ['string'],
- help: argHelp.group,
- multi: true,
- },
- ungrouped: {
- aliases: ['nogroup', 'nogroups'],
- types: ['boolean'],
- help: argHelp.ungrouped,
- default: false,
- },
- },
- fn: (input, { group, ungrouped }) => {
- const filterList = getFiltersByGroup(getGlobalFilters(getState()), group, ungrouped);
-
- if (filterList && filterList.length) {
- const filterExpression = filterList.join(' | ');
- const filterAST = fromExpression(filterExpression);
- return interpretAst(filterAST, getWorkpadVariablesAsObject(getState()));
- } else {
- const filterType = initialize.types.filter;
- return filterType?.from(null, {});
- }
- },
- };
+ const fn: FiltersFunction['fn'] = (input, { group, ungrouped }) => {
+ const { expressions, filters: filtersService } = pluginServices.getServices();
+
+ const filterList = getFiltersByGroup(filtersService.getFilters(), group, ungrouped);
+
+ if (filterList && filterList.length) {
+ const filterExpression = filterList.join(' | ');
+ const filterAST = fromExpression(filterExpression);
+ const { variables } = filtersService.getFiltersContext();
+ return expressions.interpretAst(filterAST, variables);
+ } else {
+ const filterType = initialize.types.filter;
+ return filterType?.from(null, {});
+ }
};
+
+ return buildFiltersFunction(fn);
}
diff --git a/x-pack/plugins/canvas/public/lib/create_handlers.ts b/x-pack/plugins/canvas/public/lib/create_handlers.ts
index 3734b1bf53051d..3536bed0f92b3c 100644
--- a/x-pack/plugins/canvas/public/lib/create_handlers.ts
+++ b/x-pack/plugins/canvas/public/lib/create_handlers.ts
@@ -10,10 +10,9 @@ import {
ExpressionRendererEvent,
IInterpreterRenderHandlers,
} from 'src/plugins/expressions/public';
-// @ts-expect-error untyped local
-import { setFilter } from '../state/actions/elements';
import { updateEmbeddableExpression, fetchEmbeddableRenderable } from '../state/actions/embeddable';
import { RendererHandlers, CanvasElement } from '../../types';
+import { pluginServices } from '../services';
import { clearValue } from '../state/actions/resolved_args';
// This class creates stub handlers to ensure every element and renderer fulfills the contract.
@@ -58,7 +57,6 @@ export const createHandlers = (baseHandlers = createBaseHandlers()): RendererHan
},
resize(_size: { height: number; width: number }) {},
- setFilter() {},
});
export const assignHandlers = (handlers: Partial = {}): RendererHandlers =>
@@ -79,6 +77,8 @@ export const createDispatchedHandlerFactory = (
oldElement = element;
}
+ const { filters } = pluginServices.getServices();
+
const handlers: RendererHandlers & {
event: IInterpreterRenderHandlers['event'];
done: IInterpreterRenderHandlers['done'];
@@ -89,8 +89,8 @@ export const createDispatchedHandlerFactory = (
case 'embeddableInputChange':
this.onEmbeddableInputChange(event.data);
break;
- case 'setFilter':
- this.setFilter(event.data);
+ case 'applyFilterAction':
+ filters.updateFilter(element.id, event.data);
break;
case 'onComplete':
this.onComplete(event.data);
@@ -106,10 +106,6 @@ export const createDispatchedHandlerFactory = (
break;
}
},
- setFilter(text: string) {
- dispatch(setFilter(text, element.id, true));
- },
-
getFilter() {
return element.filter || '';
},
diff --git a/x-pack/plugins/canvas/public/lib/filter.test.ts b/x-pack/plugins/canvas/public/lib/filter.test.ts
index bf19bd6ecf4b86..9aef71f33f6093 100644
--- a/x-pack/plugins/canvas/public/lib/filter.test.ts
+++ b/x-pack/plugins/canvas/public/lib/filter.test.ts
@@ -5,6 +5,7 @@
* 2.0.
*/
+import { fromExpression } from '@kbn/interpreter';
import { FC } from 'react';
import {
Filter as FilterType,
@@ -18,9 +19,8 @@ import {
flattenFilterView,
createFilledFilterView,
groupFiltersBy,
- getFiltersByGroups,
- extractGroupsFromElementsFilters,
- extractUngroupedFromElementsFilters,
+ getFiltersExprsFromExpression,
+ getFiltersByFilterExpressions,
isExpressionWithFilters,
} from './filter';
@@ -285,7 +285,7 @@ describe('groupFiltersBy', () => {
});
});
-describe('getFiltersByGroups', () => {
+describe('getFiltersByFilterExpressions', () => {
const group1 = 'Group 1';
const group2 = 'Group 2';
@@ -296,66 +296,106 @@ describe('getFiltersByGroups', () => {
`exactly value="kibana" column="project2" filterGroup="${group2}"`,
];
- it('returns all filters related to a specified groups', () => {
- expect(getFiltersByGroups(filters, [group1, group2])).toEqual([
- filters[0],
- filters[1],
- filters[3],
- ]);
+ const filtersExprWithGroup = `filters group="${group2}"`;
+
+ const kibanaExpr = 'kibana';
+ const selectFilterExprEmpty = 'selectFilter';
+ const selectFilterExprWithGroup = `${selectFilterExprEmpty} group="${group2}"`;
+ const selectFilterExprWithGroups = `${selectFilterExprEmpty} group="${group2}" group="${group1}"`;
+ const selectFilterExprWithUngrouped = `${selectFilterExprEmpty} ungrouped=true`;
+ const selectFilterExprWithGroupAndUngrouped = `${selectFilterExprEmpty} group="${group2}" ungrouped=true`;
+
+ const removeFilterExprEmpty = 'removeFilter';
+ const removeFilterExprWithGroup = `${removeFilterExprEmpty} group="${group2}"`;
+ const removeFilterExprWithUngrouped = `${removeFilterExprEmpty} ungrouped=true`;
+ const removeFilterExprWithGroupAndUngrouped = `${removeFilterExprEmpty} group="${group2}" ungrouped=true`;
+
+ const getFiltersAsts = (filtersExprs: string[]) => {
+ const ast = fromExpression(filtersExprs.join(' | '));
+ return ast.chain;
+ };
- expect(getFiltersByGroups(filters, [group2])).toEqual([filters[1], filters[3]]);
+ it('returns all filters if no arguments specified to selectFilter expression', () => {
+ const filtersExprs = getFiltersAsts([kibanaExpr, selectFilterExprEmpty]);
+ const matchedFilters = getFiltersByFilterExpressions(filters, filtersExprs);
+ expect(matchedFilters).toEqual(filters);
});
- it('returns filters without group if ungrouped is true', () => {
- expect(getFiltersByGroups(filters, [], true)).toEqual([filters[2]]);
+ it('returns filters with group, specified to selectFilter expression', () => {
+ const filtersExprs = getFiltersAsts([kibanaExpr, selectFilterExprWithGroups]);
+ const matchedFilters = getFiltersByFilterExpressions(filters, filtersExprs);
+ expect(matchedFilters).toEqual([filters[0], filters[1], filters[3]]);
});
- it('returns filters with group if ungrouped is true and groups are not empty', () => {
- expect(getFiltersByGroups(filters, [group1], true)).toEqual([filters[0]]);
+ it('returns filters without group if ungrouped is true at selectFilter expression', () => {
+ const filtersExprs = getFiltersAsts([kibanaExpr, selectFilterExprWithUngrouped]);
+ const matchedFilters = getFiltersByFilterExpressions(filters, filtersExprs);
+ expect(matchedFilters).toEqual([filters[2]]);
});
- it('returns empty array if not found any filter with a specified group', () => {
- expect(getFiltersByGroups(filters, ['absent group'])).toEqual([]);
+ it('returns filters with group if ungrouped is true and groups are not empty at selectFilter expression', () => {
+ const filtersExprs = getFiltersAsts([kibanaExpr, selectFilterExprWithGroupAndUngrouped]);
+ const matchedFilters = getFiltersByFilterExpressions(filters, filtersExprs);
+ expect(matchedFilters).toEqual([filters[1], filters[2], filters[3]]);
});
- it('returns empty array if not groups specified', () => {
- expect(getFiltersByGroups(filters, [])).toEqual(filters);
+ it('returns no filters if no arguments, specified to removeFilter expression', () => {
+ const filtersExprs = getFiltersAsts([kibanaExpr, removeFilterExprEmpty]);
+ const matchedFilters = getFiltersByFilterExpressions(filters, filtersExprs);
+ expect(matchedFilters).toEqual([]);
+ });
+
+ it('returns filters without group, specified to removeFilter expression', () => {
+ const filtersExprs = getFiltersAsts([kibanaExpr, removeFilterExprWithGroup]);
+ const matchedFilters = getFiltersByFilterExpressions(filters, filtersExprs);
+ expect(matchedFilters).toEqual([filters[0], filters[2]]);
});
-});
-describe('extractGroupsFromElementsFilters', () => {
- const exprFilters = 'filters';
- const exprRest = 'demodata | plot | render';
-
- it('returns groups which are specified at filters expression', () => {
- const groups = ['group 1', 'group 2', 'group 3', 'group 4'];
- const additionalGroups = [...groups, 'group 5'];
- const groupsExpr = groups.map((group) => `group="${group}"`).join(' ');
- const additionalGroupsExpr = additionalGroups.map((group) => `group="${group}"`).join(' ');
-
- expect(
- extractGroupsFromElementsFilters(
- `${exprFilters} ${groupsExpr} | ${exprFilters} ${additionalGroupsExpr} | ${exprRest}`
- )
- ).toEqual(additionalGroups);
+ it('returns filters without group if ungrouped is true at removeFilter expression', () => {
+ const filtersExprs = getFiltersAsts([kibanaExpr, removeFilterExprWithUngrouped]);
+ const matchedFilters = getFiltersByFilterExpressions(filters, filtersExprs);
+ expect(matchedFilters).toEqual([filters[0], filters[1], filters[3]]);
});
- it('returns empty array if no groups were specified at filters expression', () => {
- expect(extractGroupsFromElementsFilters(`${exprFilters} | ${exprRest}`)).toEqual([]);
+ it('remove filters without group and with specified group if ungrouped is true and groups are not empty at removeFilter expression', () => {
+ const filtersExprs = getFiltersAsts([kibanaExpr, removeFilterExprWithGroupAndUngrouped]);
+ const matchedFilters = getFiltersByFilterExpressions(filters, filtersExprs);
+ expect(matchedFilters).toEqual([filters[0]]);
+ });
+
+ it('should include/exclude filters iteratively', () => {
+ const filtersExprs = getFiltersAsts([
+ kibanaExpr,
+ selectFilterExprWithGroup,
+ removeFilterExprWithGroup,
+ selectFilterExprEmpty,
+ ]);
+ const matchedFilters = getFiltersByFilterExpressions(filters, filtersExprs);
+ expect(matchedFilters).toEqual([]);
+ });
+
+ it('should include/exclude filters from global filters if `filters` expression is specified', () => {
+ const filtersExprs = getFiltersAsts([
+ kibanaExpr,
+ selectFilterExprWithGroup,
+ removeFilterExprWithGroup,
+ selectFilterExprEmpty,
+ filtersExprWithGroup,
+ ]);
+ const matchedFilters = getFiltersByFilterExpressions(filters, filtersExprs);
+ expect(matchedFilters).toEqual([filters[1], filters[3]]);
});
});
-describe('extractUngroupedFromElementsFilters', () => {
- it('checks if ungrouped filters expression exist at the element', () => {
- const expression =
- 'filters group="10" group="11" | filters group="15" ungrouped=true | demodata | plot | render';
- const isUngrouped = extractUngroupedFromElementsFilters(expression);
- expect(isUngrouped).toBeTruthy();
+describe('getFiltersExprsFromExpression', () => {
+ it('returns list of filters expressions asts', () => {
+ const filter1 = 'selectFilter';
+ const filter2 = 'filters group="15" ungrouped=true';
+ const filter3 = 'removeFilter';
+ const expression = `kibana | ${filter1} | ${filter2} | ${filter3} | demodata | plot | render`;
+ const filtersAsts = getFiltersExprsFromExpression(expression);
- const nextExpression =
- 'filters group="10" group="11" | filters group="15" | demodata | plot | render';
- const nextIsUngrouped = extractUngroupedFromElementsFilters(nextExpression);
- expect(nextIsUngrouped).toBeFalsy();
+ expect(filtersAsts).toEqual([filter1, filter2, filter3].map((f) => fromExpression(f).chain[0]));
});
});
diff --git a/x-pack/plugins/canvas/public/lib/filter.ts b/x-pack/plugins/canvas/public/lib/filter.ts
index 6e9db1757ccc7e..2554ae11220eb7 100644
--- a/x-pack/plugins/canvas/public/lib/filter.ts
+++ b/x-pack/plugins/canvas/public/lib/filter.ts
@@ -5,7 +5,7 @@
* 2.0.
*/
-import { fromExpression } from '@kbn/interpreter';
+import { Ast, ExpressionFunctionAST, fromExpression, toExpression } from '@kbn/interpreter';
import { flowRight, get, groupBy } from 'lodash';
import {
Filter as FilterType,
@@ -14,6 +14,14 @@ import {
FlattenFilterViewInstance,
} from '../../types/filters';
+const SELECT_FILTER = 'selectFilter';
+const FILTERS = 'filters';
+const REMOVE_FILTER = 'removeFilter';
+
+const includeFiltersExpressions = [FILTERS, SELECT_FILTER];
+const excludeFiltersExpressions = [REMOVE_FILTER];
+const filtersExpressions = [...includeFiltersExpressions, ...excludeFiltersExpressions];
+
export const defaultFormatter = (value: unknown) => (value || null ? `${value}` : '-');
export const formatFilterView =
@@ -55,41 +63,73 @@ export const groupFiltersBy = (filters: FilterType[], groupByField: FilterField)
}));
};
-export const getFiltersByGroups = (
- filters: string[],
- groups: string[],
- ungrouped: boolean = false
-) =>
- filters.filter((filter: string) => {
- const ast = fromExpression(filter);
- const expGroups: string[] = get(ast, 'chain[0].arguments.filterGroup', []);
- if (!groups?.length && ungrouped) {
- return expGroups.length === 0;
- }
+const excludeFiltersByGroups = (filters: Ast[], filterExprAst: ExpressionFunctionAST) => {
+ const groupsToExclude = filterExprAst.arguments.group ?? [];
+ const removeUngrouped = filterExprAst.arguments.ungrouped?.[0] ?? false;
+ return filters.filter((filter) => {
+ const groups: string[] = get(filter, 'chain[0].arguments.filterGroup', []).filter(
+ (group: string) => group !== ''
+ );
+ const noNeedToExcludeByGroup = !(
+ groups.length &&
+ groupsToExclude.length &&
+ groupsToExclude.includes(groups[0])
+ );
+
+ const noNeedToExcludeByUngrouped = (removeUngrouped && groups.length) || !removeUngrouped;
+ const excludeAllFilters = !groupsToExclude.length && !removeUngrouped;
- return (
- !groups.length ||
- (expGroups.length > 0 && expGroups.every((expGroup) => groups.includes(expGroup)))
+ return !excludeAllFilters && noNeedToExcludeByUngrouped && noNeedToExcludeByGroup;
+ });
+};
+
+const includeFiltersByGroups = (
+ filters: Ast[],
+ filterExprAst: ExpressionFunctionAST,
+ ignoreUngroupedIfGroups: boolean = false
+) => {
+ const groupsToInclude = filterExprAst.arguments.group ?? [];
+ const includeOnlyUngrouped = filterExprAst.arguments.ungrouped?.[0] ?? false;
+ return filters.filter((filter) => {
+ const groups: string[] = get(filter, 'chain[0].arguments.filterGroup', []).filter(
+ (group: string) => group !== ''
);
+ const needToIncludeByGroup =
+ groups.length && groupsToInclude.length && groupsToInclude.includes(groups[0]);
+
+ const needToIncludeByUngrouped =
+ includeOnlyUngrouped &&
+ !groups.length &&
+ (ignoreUngroupedIfGroups ? !groupsToInclude.length : true);
+
+ const allowAll = !groupsToInclude.length && !includeOnlyUngrouped;
+ return needToIncludeByUngrouped || needToIncludeByGroup || allowAll;
});
+};
-export const extractGroupsFromElementsFilters = (expr: string) => {
- const ast = fromExpression(expr);
- const filtersFns = ast.chain.filter((expression) => expression.function === 'filters');
- const groups = filtersFns.reduce((foundGroups, filterFn) => {
- const filterGroups = filterFn?.arguments.group?.map((g) => g.toString()) ?? [];
- return [...foundGroups, ...filterGroups];
- }, []);
- return [...new Set(groups)];
+export const getFiltersByFilterExpressions = (
+ filters: string[],
+ filterExprsAsts: ExpressionFunctionAST[]
+) => {
+ const filtersAst = filters.map((filter) => fromExpression(filter));
+ const matchedFiltersAst = filterExprsAsts.reduce((includedFilters, filter) => {
+ if (excludeFiltersExpressions.includes(filter.function)) {
+ return excludeFiltersByGroups(includedFilters, filter);
+ }
+ const isFiltersExpr = filter.function === FILTERS;
+ const filtersToInclude = isFiltersExpr ? filtersAst : includedFilters;
+ return includeFiltersByGroups(filtersToInclude, filter, isFiltersExpr);
+ }, filtersAst);
+
+ return matchedFiltersAst.map((ast) => toExpression(ast));
};
-export const extractUngroupedFromElementsFilters = (expr: string) => {
+export const getFiltersExprsFromExpression = (expr: string) => {
const ast = fromExpression(expr);
- const filtersFns = ast.chain.filter((expression) => expression.function === 'filters');
- return filtersFns.some((filterFn) => filterFn?.arguments.ungrouped?.[0]);
+ return ast.chain.filter((expression) => filtersExpressions.includes(expression.function));
};
export const isExpressionWithFilters = (expr: string) => {
const ast = fromExpression(expr);
- return ast.chain.some((expression) => expression.function === 'filters');
+ return ast.chain.some((expression) => filtersExpressions.includes(expression.function));
};
diff --git a/x-pack/plugins/canvas/public/lib/run_interpreter.ts b/x-pack/plugins/canvas/public/lib/run_interpreter.ts
deleted file mode 100644
index 77c31b11924c04..00000000000000
--- a/x-pack/plugins/canvas/public/lib/run_interpreter.ts
+++ /dev/null
@@ -1,72 +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
- * 2.0; you may not use this file except in compliance with the Elastic License
- * 2.0.
- */
-
-import { fromExpression, getType } from '@kbn/interpreter';
-import { pluck } from 'rxjs/operators';
-import { ExpressionValue, ExpressionAstExpression } from 'src/plugins/expressions/public';
-import { pluginServices } from '../services';
-
-interface Options {
- castToRender?: boolean;
-}
-
-/**
- * Meant to be a replacement for plugins/interpreter/interpretAST
- */
-export async function interpretAst(
- ast: ExpressionAstExpression,
- variables: Record,
- input: ExpressionValue = null
-): Promise {
- const context = { variables };
- const { execute } = pluginServices.getServices().expressions;
-
- return await execute(ast, input, context).getData().pipe(pluck('result')).toPromise();
-}
-
-/**
- * Runs interpreter, usually in the browser
- *
- * @param {object} ast - Executable AST
- * @param {any} input - Initial input for AST execution
- * @param {object} variables - Variables to pass in to the intrepreter context
- * @param {object} options
- * @param {boolean} options.castToRender - try to cast to a type: render object?
- * @returns {promise}
- */
-export async function runInterpreter(
- ast: ExpressionAstExpression,
- input: ExpressionValue,
- variables: Record,
- options: Options = {}
-): Promise {
- const context = { variables };
- try {
- const { execute } = pluginServices.getServices().expressions;
-
- const renderable = await execute(ast, input, context)
- .getData()
- .pipe(pluck('result'))
- .toPromise();
-
- if (getType(renderable) === 'render') {
- return renderable;
- }
-
- if (options.castToRender) {
- return runInterpreter(fromExpression('render'), renderable, variables, {
- castToRender: false,
- });
- }
-
- throw new Error(`Ack! I don't know how to render a '${getType(renderable)}'`);
- } catch (err) {
- const { error: displayError } = pluginServices.getServices().notify;
- displayError(err);
- throw err;
- }
-}
diff --git a/x-pack/plugins/canvas/public/plugin.tsx b/x-pack/plugins/canvas/public/plugin.tsx
index 8cdc695ebaaba7..1c2ce763f42e24 100644
--- a/x-pack/plugins/canvas/public/plugin.tsx
+++ b/x-pack/plugins/canvas/public/plugin.tsx
@@ -36,7 +36,6 @@ import { BfetchPublicSetup } from '../../../../src/plugins/bfetch/public';
import { PresentationUtilPluginStart } from '../../../../src/plugins/presentation_util/public';
import { getPluginApi, CanvasApi } from './plugin_api';
import { setupExpressions } from './setup_expressions';
-import { pluginServiceRegistry } from './services/kibana';
export type { CoreStart, CoreSetup };
@@ -123,6 +122,8 @@ export class CanvasPlugin
srcPlugin.start(coreStart, startPlugins);
const { pluginServices } = await import('./services');
+ const { pluginServiceRegistry } = await import('./services/kibana');
+
pluginServices.setRegistry(
pluginServiceRegistry.start({
coreStart,
diff --git a/x-pack/plugins/canvas/public/services/expressions.ts b/x-pack/plugins/canvas/public/services/expressions.ts
index 01bb0adb177117..456a1314bdfffc 100644
--- a/x-pack/plugins/canvas/public/services/expressions.ts
+++ b/x-pack/plugins/canvas/public/services/expressions.ts
@@ -5,6 +5,4 @@
* 2.0.
*/
-import { ExpressionsServiceStart } from '../../../../../src/plugins/expressions/public';
-
-export type CanvasExpressionsService = ExpressionsServiceStart;
+export type { CanvasExpressionsService } from './kibana/expressions';
diff --git a/x-pack/plugins/cases/public/components/user_action_tree/constants.ts b/x-pack/plugins/canvas/public/services/filters.ts
similarity index 78%
rename from x-pack/plugins/cases/public/components/user_action_tree/constants.ts
rename to x-pack/plugins/canvas/public/services/filters.ts
index 584194be65f505..1ced3d15f6e100 100644
--- a/x-pack/plugins/cases/public/components/user_action_tree/constants.ts
+++ b/x-pack/plugins/canvas/public/services/filters.ts
@@ -5,4 +5,4 @@
* 2.0.
*/
-export const DRAFT_COMMENT_STORAGE_ID = 'xpack.cases.commentDraft';
+export type { CanvasFiltersService } from './kibana/filters';
diff --git a/x-pack/plugins/canvas/public/services/index.ts b/x-pack/plugins/canvas/public/services/index.ts
index ed55f919e4c767..4bf025c2748594 100644
--- a/x-pack/plugins/canvas/public/services/index.ts
+++ b/x-pack/plugins/canvas/public/services/index.ts
@@ -12,6 +12,7 @@ import { PluginServices } from '../../../../../src/plugins/presentation_util/pub
import { CanvasCustomElementService } from './custom_element';
import { CanvasEmbeddablesService } from './embeddables';
import { CanvasExpressionsService } from './expressions';
+import { CanvasFiltersService } from './filters';
import { CanvasLabsService } from './labs';
import { CanvasNavLinkService } from './nav_link';
import { CanvasNotifyService } from './notify';
@@ -24,6 +25,7 @@ export interface CanvasPluginServices {
customElement: CanvasCustomElementService;
embeddables: CanvasEmbeddablesService;
expressions: CanvasExpressionsService;
+ filters: CanvasFiltersService;
labs: CanvasLabsService;
navLink: CanvasNavLinkService;
notify: CanvasNotifyService;
@@ -41,6 +43,7 @@ export const useEmbeddablesService = () =>
(() => pluginServices.getHooks().embeddables.useService())();
export const useExpressionsService = () =>
(() => pluginServices.getHooks().expressions.useService())();
+export const useFiltersService = () => (() => pluginServices.getHooks().filters.useService())();
export const useLabsService = () => (() => pluginServices.getHooks().labs.useService())();
export const useNavLinkService = () => (() => pluginServices.getHooks().navLink.useService())();
export const useNotifyService = () => (() => pluginServices.getHooks().notify.useService())();
diff --git a/x-pack/plugins/canvas/public/services/kibana/expressions.ts b/x-pack/plugins/canvas/public/services/kibana/expressions.ts
index 780de5309d97e1..ea329b63863f8c 100644
--- a/x-pack/plugins/canvas/public/services/kibana/expressions.ts
+++ b/x-pack/plugins/canvas/public/services/kibana/expressions.ts
@@ -4,16 +4,137 @@
* 2.0; you may not use this file except in compliance with the Elastic License
* 2.0.
*/
-
+import { fromExpression, getType } from '@kbn/interpreter';
+import {
+ ExpressionAstExpression,
+ ExpressionExecutionParams,
+ ExpressionValue,
+} from 'src/plugins/expressions';
+import { pluck } from 'rxjs/operators';
+import { buildEmbeddableFilters } from '../../../common/lib/build_embeddable_filters';
+import { ExpressionsServiceStart } from '../../../../../../src/plugins/expressions/public';
import { KibanaPluginServiceFactory } from '../../../../../../src/plugins/presentation_util/public';
-
import { CanvasStartDeps } from '../../plugin';
-import { CanvasExpressionsService } from '../expressions';
+import { CanvasFiltersService } from './filters';
+import { CanvasNotifyService } from '../notify';
+
+interface Options {
+ castToRender?: boolean;
+}
+
+export class ExpressionsService {
+ private filters: CanvasFiltersService;
+ private notify: CanvasNotifyService;
+
+ constructor(
+ private readonly expressions: ExpressionsServiceStart,
+ { filters, notify }: CanvasExpressionsServiceRequiredServices
+ ) {
+ this.filters = filters;
+ this.notify = notify;
+ }
+
+ async interpretAst(
+ ast: ExpressionAstExpression,
+ variables: Record,
+ input: ExpressionValue = null
+ ) {
+ const context = await this.getGlobalContext();
+ return await this.interpretAstWithContext(ast, input, {
+ ...(context ?? {}),
+ variables,
+ });
+ }
+
+ async interpretAstWithContext(
+ ast: ExpressionAstExpression,
+ input: ExpressionValue = null,
+ context?: ExpressionExecutionParams
+ ): Promise {
+ return await this.expressions
+ .execute(ast, input, context)
+ .getData()
+ .pipe(pluck('result'))
+ .toPromise();
+ }
+
+ /**
+ * Runs interpreter, usually in the browser
+ *
+ * @param {object} ast - Executable AST
+ * @param {any} input - Initial input for AST execution
+ * @param {object} variables - Variables to pass in to the intrepreter context
+ * @param {object} options
+ * @param {boolean} options.castToRender - try to cast to a type: render object?
+ * @returns {Promise}
+ */
+ async runInterpreter(
+ ast: ExpressionAstExpression,
+ input: ExpressionValue,
+ variables: Record,
+ options: Options = {}
+ ): Promise {
+ const context = await this.getGlobalContext();
+ const fullContext = { ...(context ?? {}), variables };
+
+ try {
+ const renderable = await this.interpretAstWithContext(ast, input, fullContext);
+
+ if (getType(renderable) === 'render') {
+ return renderable;
+ }
+
+ if (options.castToRender) {
+ return this.runInterpreter(fromExpression('render'), renderable, fullContext, {
+ castToRender: false,
+ });
+ }
+
+ throw new Error(`Ack! I don't know how to render a '${getType(renderable)}'`);
+ } catch (err) {
+ this.notify.error(err);
+ throw err;
+ }
+ }
+
+ getRenderer(name: string) {
+ return this.expressions.getRenderer(name);
+ }
+
+ getFunctions() {
+ return this.expressions.getFunctions();
+ }
+
+ private async getFilters() {
+ const filtersList = this.filters.getFilters();
+ const context = this.filters.getFiltersContext();
+ const filterExpression = filtersList.join(' | ');
+ const filterAST = fromExpression(filterExpression);
+ return await this.interpretAstWithContext(filterAST, null, context);
+ }
+
+ private async getGlobalContext() {
+ const canvasFilters = await this.getFilters();
+ const kibanaFilters = buildEmbeddableFilters(canvasFilters ? canvasFilters.and : []);
+ return {
+ searchContext: { ...kibanaFilters },
+ };
+ }
+}
+
+export type CanvasExpressionsService = ExpressionsService;
+export interface CanvasExpressionsServiceRequiredServices {
+ notify: CanvasNotifyService;
+ filters: CanvasFiltersService;
+}
export type CanvasExpressionsServiceFactory = KibanaPluginServiceFactory<
CanvasExpressionsService,
- CanvasStartDeps
+ CanvasStartDeps,
+ CanvasExpressionsServiceRequiredServices
>;
-export const expressionsServiceFactory: CanvasExpressionsServiceFactory = ({ startPlugins }) =>
- startPlugins.expressions;
+export const expressionsServiceFactory: CanvasExpressionsServiceFactory = (
+ { startPlugins },
+ requiredServices
+) => new ExpressionsService(startPlugins.expressions, requiredServices);
diff --git a/x-pack/plugins/canvas/public/services/kibana/filters.ts b/x-pack/plugins/canvas/public/services/kibana/filters.ts
new file mode 100644
index 00000000000000..872b6759b389b1
--- /dev/null
+++ b/x-pack/plugins/canvas/public/services/kibana/filters.ts
@@ -0,0 +1,42 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { KibanaPluginServiceFactory } from '../../../../../../src/plugins/presentation_util/public';
+// @ts-expect-error untyped local
+import { getState, getStore } from '../../state/store';
+import { State } from '../../../types';
+import { getGlobalFilters, getWorkpadVariablesAsObject } from '../../state/selectors/workpad';
+import { CanvasStartDeps } from '../../plugin';
+// @ts-expect-error untyped local
+import { setFilter } from '../../state/actions/elements';
+
+export class FiltersService {
+ constructor() {}
+
+ getFilters(state: State = getState()) {
+ return getGlobalFilters(state);
+ }
+
+ updateFilter(filterId: string, filterExpression: string) {
+ const { dispatch } = getStore();
+ dispatch(setFilter(filterExpression, filterId, true));
+ }
+
+ getFiltersContext(state: State = getState()) {
+ const variables = getWorkpadVariablesAsObject(state);
+ return { variables };
+ }
+}
+
+export type CanvasFiltersService = FiltersService;
+
+export type CanvasFiltersServiceFactory = KibanaPluginServiceFactory<
+ CanvasFiltersService,
+ CanvasStartDeps
+>;
+
+export const filtersServiceFactory: CanvasFiltersServiceFactory = () => new FiltersService();
diff --git a/x-pack/plugins/canvas/public/services/kibana/index.ts b/x-pack/plugins/canvas/public/services/kibana/index.ts
index 91767947bc0a65..c1ceb531657d00 100644
--- a/x-pack/plugins/canvas/public/services/kibana/index.ts
+++ b/x-pack/plugins/canvas/public/services/kibana/index.ts
@@ -24,10 +24,12 @@ import { platformServiceFactory } from './platform';
import { reportingServiceFactory } from './reporting';
import { visualizationsServiceFactory } from './visualizations';
import { workpadServiceFactory } from './workpad';
+import { filtersServiceFactory } from './filters';
export { customElementServiceFactory } from './custom_element';
export { embeddablesServiceFactory } from './embeddables';
export { expressionsServiceFactory } from './expressions';
+export { filtersServiceFactory } from './filters';
export { labsServiceFactory } from './labs';
export { notifyServiceFactory } from './notify';
export { platformServiceFactory } from './platform';
@@ -41,7 +43,8 @@ export const pluginServiceProviders: PluginServiceProviders<
> = {
customElement: new PluginServiceProvider(customElementServiceFactory),
embeddables: new PluginServiceProvider(embeddablesServiceFactory),
- expressions: new PluginServiceProvider(expressionsServiceFactory),
+ expressions: new PluginServiceProvider(expressionsServiceFactory, ['filters', 'notify']),
+ filters: new PluginServiceProvider(filtersServiceFactory),
labs: new PluginServiceProvider(labsServiceFactory),
navLink: new PluginServiceProvider(navLinkServiceFactory),
notify: new PluginServiceProvider(notifyServiceFactory),
diff --git a/x-pack/plugins/canvas/public/services/kibana/workpad.ts b/x-pack/plugins/canvas/public/services/kibana/workpad.ts
index 9f69d5096237cc..c0ef1097555a63 100644
--- a/x-pack/plugins/canvas/public/services/kibana/workpad.ts
+++ b/x-pack/plugins/canvas/public/services/kibana/workpad.ts
@@ -5,6 +5,7 @@
* 2.0.
*/
+import { SavedObject } from 'kibana/public';
import { KibanaPluginServiceFactory } from '../../../../../../src/plugins/presentation_util/public';
import { CanvasStartDeps } from '../../plugin';
@@ -67,6 +68,21 @@ export const workpadServiceFactory: CanvasWorkpadServiceFactory = ({ coreStart,
return { css: DEFAULT_WORKPAD_CSS, variables: [], ...workpad };
},
+ export: async (id: string) => {
+ const workpad = await coreStart.http.get>(
+ `${getApiPath()}/export/${id}`
+ );
+ const { attributes } = workpad;
+
+ return {
+ ...workpad,
+ attributes: {
+ ...attributes,
+ css: attributes.css ?? DEFAULT_WORKPAD_CSS,
+ variables: attributes.variables ?? [],
+ },
+ };
+ },
resolve: async (id: string) => {
const { workpad, outcome, aliasId } = await coreStart.http.get(
`${getApiPath()}/resolve/${id}`
@@ -93,6 +109,14 @@ export const workpadServiceFactory: CanvasWorkpadServiceFactory = ({ coreStart,
}),
});
},
+ import: (workpad: CanvasWorkpad) =>
+ coreStart.http.post(`${getApiPath()}/import`, {
+ body: JSON.stringify({
+ ...sanitizeWorkpad({ ...workpad }),
+ assets: workpad.assets || {},
+ variables: workpad.variables || [],
+ }),
+ }),
createFromTemplate: (templateId: string) => {
return coreStart.http.post(getApiPath(), {
body: JSON.stringify({ templateId }),
diff --git a/x-pack/plugins/canvas/public/services/storybook/workpad.ts b/x-pack/plugins/canvas/public/services/storybook/workpad.ts
index 6c77bdb1adeac5..5dd40997900c6f 100644
--- a/x-pack/plugins/canvas/public/services/storybook/workpad.ts
+++ b/x-pack/plugins/canvas/public/services/storybook/workpad.ts
@@ -31,7 +31,7 @@ type CanvasWorkpadServiceFactory = PluginServiceFactory () => new Promise((resolve) => setTimeout(resolve, time));
-const { findNoTemplates, findNoWorkpads, findSomeTemplates } = stubs;
+const { findNoTemplates, findNoWorkpads, findSomeTemplates, importWorkpad } = stubs;
const getRandomName = () => {
const lorem =
@@ -85,6 +85,10 @@ export const workpadServiceFactory: CanvasWorkpadServiceFactory = ({
action('workpadService.findTemplates')();
return (hasTemplates ? findSomeTemplates() : findNoTemplates())();
},
+ import: (workpad) => {
+ action('workpadService.import')(workpad);
+ return importWorkpad(workpad);
+ },
create: (workpad) => {
action('workpadService.create')(workpad);
return Promise.resolve(workpad);
diff --git a/x-pack/plugins/canvas/public/services/stubs/expressions.ts b/x-pack/plugins/canvas/public/services/stubs/expressions.ts
index 6660c1c6efb357..405f2ebe0ba918 100644
--- a/x-pack/plugins/canvas/public/services/stubs/expressions.ts
+++ b/x-pack/plugins/canvas/public/services/stubs/expressions.ts
@@ -10,11 +10,22 @@ import { plugin } from '../../../../../../src/plugins/expressions/public';
import { functions as functionDefinitions } from '../../../canvas_plugin_src/functions/common';
import { renderFunctions } from '../../../canvas_plugin_src/renderers/core';
import { PluginServiceFactory } from '../../../../../../src/plugins/presentation_util/public';
-import { CanvasExpressionsService } from '../expressions';
+import {
+ CanvasExpressionsService,
+ CanvasExpressionsServiceRequiredServices,
+ ExpressionsService,
+} from '../kibana/expressions';
-type CanvasExpressionsServiceFactory = PluginServiceFactory;
+type CanvasExpressionsServiceFactory = PluginServiceFactory<
+ CanvasExpressionsService,
+ {},
+ CanvasExpressionsServiceRequiredServices
+>;
-export const expressionsServiceFactory: CanvasExpressionsServiceFactory = () => {
+export const expressionsServiceFactory: CanvasExpressionsServiceFactory = (
+ params,
+ requiredServices
+) => {
const placeholder = {} as any;
const expressionsPlugin = plugin(placeholder);
const setup = expressionsPlugin.setup(placeholder);
@@ -25,5 +36,5 @@ export const expressionsServiceFactory: CanvasExpressionsServiceFactory = () =>
expressionsService.registerRenderer(fn as unknown as AnyExpressionRenderDefinition);
});
- return expressionsService;
+ return new ExpressionsService(expressionsService, requiredServices);
};
diff --git a/x-pack/plugins/canvas/public/services/stubs/filters.ts b/x-pack/plugins/canvas/public/services/stubs/filters.ts
new file mode 100644
index 00000000000000..972dbfd6dc0e4f
--- /dev/null
+++ b/x-pack/plugins/canvas/public/services/stubs/filters.ts
@@ -0,0 +1,23 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { PluginServiceFactory } from '../../../../../../src/plugins/presentation_util/public';
+import { CanvasFiltersService } from '../filters';
+
+export type CanvasFiltersServiceFactory = PluginServiceFactory;
+
+const noop = (..._args: any[]): any => {};
+
+export const filtersServiceFactory: CanvasFiltersServiceFactory = () => ({
+ getFilters: () => [
+ 'exactly value="machine-learning" column="project1" filterGroup="Group 1"',
+ 'exactly value="kibana" column="project2" filterGroup="Group 1"',
+ 'time column="@timestamp1" from="2021-11-02 17:13:18" to="2021-11-09 17:13:18" filterGroup="Some group"',
+ ],
+ updateFilter: noop,
+ getFiltersContext: () => ({ variables: {} }),
+});
diff --git a/x-pack/plugins/canvas/public/services/stubs/index.ts b/x-pack/plugins/canvas/public/services/stubs/index.ts
index 2216013a29c129..d90b1a3c92201a 100644
--- a/x-pack/plugins/canvas/public/services/stubs/index.ts
+++ b/x-pack/plugins/canvas/public/services/stubs/index.ts
@@ -24,9 +24,11 @@ import { platformServiceFactory } from './platform';
import { reportingServiceFactory } from './reporting';
import { visualizationsServiceFactory } from './visualizations';
import { workpadServiceFactory } from './workpad';
+import { filtersServiceFactory } from './filters';
export { customElementServiceFactory } from './custom_element';
export { expressionsServiceFactory } from './expressions';
+export { filtersServiceFactory } from './filters';
export { labsServiceFactory } from './labs';
export { navLinkServiceFactory } from './nav_link';
export { notifyServiceFactory } from './notify';
@@ -38,7 +40,8 @@ export { workpadServiceFactory } from './workpad';
export const pluginServiceProviders: PluginServiceProviders = {
customElement: new PluginServiceProvider(customElementServiceFactory),
embeddables: new PluginServiceProvider(embeddablesServiceFactory),
- expressions: new PluginServiceProvider(expressionsServiceFactory),
+ expressions: new PluginServiceProvider(expressionsServiceFactory, ['filters', 'notify']),
+ filters: new PluginServiceProvider(filtersServiceFactory),
labs: new PluginServiceProvider(labsServiceFactory),
navLink: new PluginServiceProvider(navLinkServiceFactory),
notify: new PluginServiceProvider(notifyServiceFactory),
diff --git a/x-pack/plugins/canvas/public/services/stubs/workpad.ts b/x-pack/plugins/canvas/public/services/stubs/workpad.ts
index c10244038750d6..6268fa128df0fe 100644
--- a/x-pack/plugins/canvas/public/services/stubs/workpad.ts
+++ b/x-pack/plugins/canvas/public/services/stubs/workpad.ts
@@ -6,13 +6,12 @@
*/
import moment from 'moment';
-
import { PluginServiceFactory } from '../../../../../../src/plugins/presentation_util/public';
// @ts-expect-error
-import { getDefaultWorkpad } from '../../state/defaults';
+import { getDefaultWorkpad, getExportedWorkpad } from '../../state/defaults';
import { CanvasWorkpadService } from '../workpad';
-import { CanvasTemplate } from '../../../types';
+import { CanvasTemplate, CanvasWorkpad } from '../../../types';
type CanvasWorkpadServiceFactory = PluginServiceFactory;
@@ -94,6 +93,7 @@ export const findNoTemplates =
.then(() => getNoTemplates());
};
+export const importWorkpad = (workpad: CanvasWorkpad) => Promise.resolve(workpad);
export const getNoTemplates = () => ({ templates: [] });
export const getSomeTemplates = () => ({ templates });
@@ -103,6 +103,7 @@ export const workpadServiceFactory: CanvasWorkpadServiceFactory = () => ({
Promise.resolve({ outcome: 'exactMatch', workpad: { ...getDefaultWorkpad(), id } }),
findTemplates: findNoTemplates(),
create: (workpad) => Promise.resolve(workpad),
+ import: (workpad) => importWorkpad(workpad),
createFromTemplate: (_templateId: string) => Promise.resolve(getDefaultWorkpad()),
find: findNoWorkpads(),
remove: (_id: string) => Promise.resolve(),
diff --git a/x-pack/plugins/canvas/public/services/workpad.ts b/x-pack/plugins/canvas/public/services/workpad.ts
index 8e77ab3f321ef8..233b1a70ff7f66 100644
--- a/x-pack/plugins/canvas/public/services/workpad.ts
+++ b/x-pack/plugins/canvas/public/services/workpad.ts
@@ -25,10 +25,12 @@ export interface ResolveWorkpadResponse {
outcome: SavedObjectsResolveResponse['outcome'];
aliasId?: SavedObjectsResolveResponse['alias_target_id'];
}
+
export interface CanvasWorkpadService {
get: (id: string) => Promise;
resolve: (id: string) => Promise;
create: (workpad: CanvasWorkpad) => Promise;
+ import: (workpad: CanvasWorkpad) => Promise;
createFromTemplate: (templateId: string) => Promise;
find: (term: string) => Promise;
remove: (id: string) => Promise;
diff --git a/x-pack/plugins/canvas/public/state/actions/elements.js b/x-pack/plugins/canvas/public/state/actions/elements.js
index bcc02c3cbc2cd0..72186abd38c948 100644
--- a/x-pack/plugins/canvas/public/state/actions/elements.js
+++ b/x-pack/plugins/canvas/public/state/actions/elements.js
@@ -20,7 +20,6 @@ import {
import { getValue as getResolvedArgsValue } from '../selectors/resolved_args';
import { getDefaultElement } from '../defaults';
import { ErrorStrings } from '../../../i18n';
-import { runInterpreter, interpretAst } from '../../lib/run_interpreter';
import { subMultitree } from '../../lib/aeroelastic/functional';
import { pluginServices } from '../../services';
import { selectToplevelNodes } from './transient';
@@ -101,11 +100,16 @@ export const fetchContext = createThunk(
});
const variables = getWorkpadVariablesAsObject(getState());
+
+ const { expressions } = pluginServices.getServices();
const elementWithNewAst = set(element, pathToTarget, astChain);
+
// get context data from a partial AST
- return interpretAst(elementWithNewAst.ast, variables, prevContextValue).then((value) => {
- dispatch(args.setValue({ path: contextPath, value }));
- });
+ return expressions
+ .interpretAst(elementWithNewAst.ast, variables, prevContextValue)
+ .then((value) => {
+ dispatch(args.setValue({ path: contextPath, value }));
+ });
}
);
@@ -124,14 +128,14 @@ const fetchRenderableWithContextFn = ({ dispatch, getState }, element, ast, cont
});
const variables = getWorkpadVariablesAsObject(getState());
-
- return runInterpreter(ast, context, variables, { castToRender: true })
+ const { expressions, notify } = pluginServices.getServices();
+ return expressions
+ .runInterpreter(ast, context, variables, { castToRender: true })
.then((renderable) => {
dispatch(getAction(renderable));
})
.catch((err) => {
- const notifyService = pluginServices.getServices().notify;
- notifyService.error(err);
+ notify.error(err);
dispatch(getAction(err));
});
};
@@ -171,12 +175,13 @@ export const fetchAllRenderables = createThunk(
const argumentPath = [element.id, 'expressionRenderable'];
const variables = getWorkpadVariablesAsObject(getState());
+ const { expressions, notify } = pluginServices.getServices();
- return runInterpreter(ast, null, variables, { castToRender: true })
+ return expressions
+ .runInterpreter(ast, null, variables, { castToRender: true })
.then((renderable) => ({ path: argumentPath, value: renderable }))
.catch((err) => {
- const notifyService = pluginServices.getServices().notify;
- notifyService.error(err);
+ notify.error(err);
return { path: argumentPath, value: err };
});
});
diff --git a/x-pack/plugins/canvas/public/state/defaults.js b/x-pack/plugins/canvas/public/state/defaults.js
index 40e8425c98ff07..a4a38d50388d56 100644
--- a/x-pack/plugins/canvas/public/state/defaults.js
+++ b/x-pack/plugins/canvas/public/state/defaults.js
@@ -87,6 +87,14 @@ export const getDefaultWorkpad = () => {
};
};
+export const getExportedWorkpad = () => {
+ const workpad = getDefaultWorkpad();
+ return {
+ id: workpad.id,
+ attributes: workpad,
+ };
+};
+
export const getDefaultSidebar = () => ({
groupFiltersByOption: DEFAULT_GROUP_BY_FIELD,
});
diff --git a/x-pack/plugins/canvas/public/state/selectors/workpad.ts b/x-pack/plugins/canvas/public/state/selectors/workpad.ts
index ac94ccc562e889..557a6b8acc4e71 100644
--- a/x-pack/plugins/canvas/public/state/selectors/workpad.ts
+++ b/x-pack/plugins/canvas/public/state/selectors/workpad.ts
@@ -27,6 +27,7 @@ import {
ExpressionAstFunction,
ExpressionAstExpression,
} from '../../../types';
+import { isExpressionWithFilters } from '../../lib/filter';
type Modify = Pick> & R;
type WorkpadInfo = Modify;
@@ -248,7 +249,7 @@ function extractFilterGroups(
// TODO: we always get a function here, right?
const { function: fn, arguments: args } = item;
- if (fn === 'filters') {
+ if (isExpressionWithFilters(fn)) {
// we have a filter function, extract groups from args
return groups.concat(
buildGroupValues(args, (argValue) => {
diff --git a/x-pack/plugins/canvas/server/mocks/workpad_route_context.ts b/x-pack/plugins/canvas/server/mocks/workpad_route_context.ts
index 216cdc0970dc40..13e4e34b20b669 100644
--- a/x-pack/plugins/canvas/server/mocks/workpad_route_context.ts
+++ b/x-pack/plugins/canvas/server/mocks/workpad_route_context.ts
@@ -12,6 +12,7 @@ export interface MockWorkpadRouteContext extends CanvasRouteHandlerContext {
workpad: {
create: jest.Mock;
get: jest.Mock;
+ import: jest.Mock;
update: jest.Mock;
resolve: jest.Mock;
};
@@ -23,6 +24,7 @@ export const workpadRouteContextMock = {
workpad: {
create: jest.fn(),
get: jest.fn(),
+ import: jest.fn(),
update: jest.fn(),
resolve: jest.fn(),
},
diff --git a/x-pack/plugins/canvas/server/plugin.ts b/x-pack/plugins/canvas/server/plugin.ts
index ebe43ba76a46ac..27b6186216b694 100644
--- a/x-pack/plugins/canvas/server/plugin.ts
+++ b/x-pack/plugins/canvas/server/plugin.ts
@@ -23,7 +23,8 @@ import { initRoutes } from './routes';
import { registerCanvasUsageCollector } from './collectors';
import { loadSampleData } from './sample_data';
import { setupInterpreter } from './setup_interpreter';
-import { customElementType, workpadType, workpadTemplateType } from './saved_objects';
+import { customElementType, workpadTypeFactory, workpadTemplateType } from './saved_objects';
+import type { CanvasSavedObjectTypeMigrationsDeps } from './saved_objects/migrations';
import { initializeTemplates } from './templates';
import { essqlSearchStrategyProvider } from './lib/essql_strategy';
import { getUISettings } from './ui_settings';
@@ -53,10 +54,18 @@ export class CanvasPlugin implements Plugin {
public setup(coreSetup: CoreSetup, plugins: PluginsSetup) {
const expressionsFork = plugins.expressions.fork();
+ setupInterpreter(expressionsFork, {
+ embeddablePersistableStateService: {
+ extract: plugins.embeddable.extract,
+ inject: plugins.embeddable.inject,
+ },
+ });
+
+ const deps: CanvasSavedObjectTypeMigrationsDeps = { expressions: expressionsFork };
coreSetup.uiSettings.register(getUISettings());
- coreSetup.savedObjects.registerType(customElementType);
- coreSetup.savedObjects.registerType(workpadType);
- coreSetup.savedObjects.registerType(workpadTemplateType);
+ coreSetup.savedObjects.registerType(customElementType(deps));
+ coreSetup.savedObjects.registerType(workpadTypeFactory(deps));
+ coreSetup.savedObjects.registerType(workpadTemplateType(deps));
plugins.features.registerKibanaFeature(getCanvasFeature(plugins));
@@ -84,13 +93,6 @@ export class CanvasPlugin implements Plugin {
const kibanaIndex = coreSetup.savedObjects.getKibanaIndex();
registerCanvasUsageCollector(plugins.usageCollection, kibanaIndex);
- setupInterpreter(expressionsFork, {
- embeddablePersistableStateService: {
- extract: plugins.embeddable.extract,
- inject: plugins.embeddable.inject,
- },
- });
-
coreSetup.getStartServices().then(([_, depsStart]) => {
const strategy = essqlSearchStrategyProvider();
plugins.data.search.registerSearchStrategy(ESSQL_SEARCH_STRATEGY, strategy);
diff --git a/x-pack/plugins/canvas/server/routes/workpad/import.ts b/x-pack/plugins/canvas/server/routes/workpad/import.ts
new file mode 100644
index 00000000000000..35d362f43beccf
--- /dev/null
+++ b/x-pack/plugins/canvas/server/routes/workpad/import.ts
@@ -0,0 +1,42 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { RouteInitializerDeps } from '../';
+import { API_ROUTE_WORKPAD_IMPORT } from '../../../common/lib/constants';
+import { ImportedCanvasWorkpad } from '../../../types';
+import { ImportedWorkpadSchema } from './workpad_schema';
+import { okResponse } from '../ok_response';
+import { catchErrorHandler } from '../catch_error_handler';
+
+const createRequestBodySchema = ImportedWorkpadSchema;
+
+export function initializeImportWorkpadRoute(deps: RouteInitializerDeps) {
+ const { router } = deps;
+ router.post(
+ {
+ path: `${API_ROUTE_WORKPAD_IMPORT}`,
+ validate: {
+ body: createRequestBodySchema,
+ },
+ options: {
+ body: {
+ maxBytes: 26214400,
+ accepts: ['application/json'],
+ },
+ },
+ },
+ catchErrorHandler(async (context, request, response) => {
+ const workpad = request.body as ImportedCanvasWorkpad;
+
+ const createdObject = await context.canvas.workpad.import(workpad);
+
+ return response.ok({
+ body: { ...okResponse, id: createdObject.id },
+ });
+ })
+ );
+}
diff --git a/x-pack/plugins/canvas/server/routes/workpad/index.ts b/x-pack/plugins/canvas/server/routes/workpad/index.ts
index 8483642e59c5aa..b97d58ee232f13 100644
--- a/x-pack/plugins/canvas/server/routes/workpad/index.ts
+++ b/x-pack/plugins/canvas/server/routes/workpad/index.ts
@@ -9,6 +9,7 @@ import { RouteInitializerDeps } from '../';
import { initializeFindWorkpadsRoute } from './find';
import { initializeGetWorkpadRoute } from './get';
import { initializeCreateWorkpadRoute } from './create';
+import { initializeImportWorkpadRoute } from './import';
import { initializeUpdateWorkpadRoute, initializeUpdateWorkpadAssetsRoute } from './update';
import { initializeDeleteWorkpadRoute } from './delete';
import { initializeResolveWorkpadRoute } from './resolve';
@@ -18,6 +19,7 @@ export function initWorkpadRoutes(deps: RouteInitializerDeps) {
initializeResolveWorkpadRoute(deps);
initializeGetWorkpadRoute(deps);
initializeCreateWorkpadRoute(deps);
+ initializeImportWorkpadRoute(deps);
initializeUpdateWorkpadRoute(deps);
initializeUpdateWorkpadAssetsRoute(deps);
initializeDeleteWorkpadRoute(deps);
diff --git a/x-pack/plugins/canvas/server/routes/workpad/workpad_schema.ts b/x-pack/plugins/canvas/server/routes/workpad/workpad_schema.ts
index 9bde26298185b0..473b46d470265a 100644
--- a/x-pack/plugins/canvas/server/routes/workpad/workpad_schema.ts
+++ b/x-pack/plugins/canvas/server/routes/workpad/workpad_schema.ts
@@ -5,7 +5,7 @@
* 2.0.
*/
-import { schema } from '@kbn/config-schema';
+import { TypeOf, schema } from '@kbn/config-schema';
export const PositionSchema = schema.object({
angle: schema.number(),
@@ -18,30 +18,30 @@ export const PositionSchema = schema.object({
export const WorkpadElementSchema = schema.object({
expression: schema.string(),
- filter: schema.maybe(schema.nullable(schema.string())),
+ filter: schema.nullable(schema.string({ defaultValue: '' })),
id: schema.string(),
position: PositionSchema,
});
export const WorkpadPageSchema = schema.object({
elements: schema.arrayOf(WorkpadElementSchema),
- groups: schema.maybe(
- schema.arrayOf(
- schema.object({
- id: schema.string(),
- position: PositionSchema,
- })
- )
+ groups: schema.arrayOf(
+ schema.object({
+ id: schema.string(),
+ position: PositionSchema,
+ }),
+ { defaultValue: [] }
),
id: schema.string(),
style: schema.recordOf(schema.string(), schema.string()),
- transition: schema.maybe(
- schema.oneOf([
- schema.object({}),
+ transition: schema.oneOf(
+ [
+ schema.object({}, { defaultValue: {} }),
schema.object({
name: schema.string(),
}),
- ])
+ ],
+ { defaultValue: {} }
),
});
@@ -55,44 +55,71 @@ export const WorkpadAssetSchema = schema.object({
export const WorkpadVariable = schema.object({
name: schema.string(),
value: schema.oneOf([schema.string(), schema.number(), schema.boolean()]),
- type: schema.string(),
+ type: schema.string({
+ validate: (type) => {
+ const validTypes = ['string', 'number', 'boolean'];
+ if (type && !validTypes.includes(type)) {
+ return `${type} is invalid type for a variable. Valid types: ${validTypes.join(', ')}.`;
+ }
+ },
+ }),
});
-export const WorkpadSchema = schema.object(
- {
- '@created': schema.maybe(schema.string()),
- '@timestamp': schema.maybe(schema.string()),
- assets: schema.maybe(schema.recordOf(schema.string(), WorkpadAssetSchema)),
- colors: schema.arrayOf(schema.string()),
- css: schema.string(),
- variables: schema.arrayOf(WorkpadVariable),
- height: schema.number(),
- id: schema.string(),
- isWriteable: schema.maybe(schema.boolean()),
- name: schema.string(),
- page: schema.number(),
- pages: schema.arrayOf(WorkpadPageSchema),
- width: schema.number(),
- },
- {
- validate: (workpad) => {
- // Validate unique page ids
- const pageIdsArray = workpad.pages.map((page) => page.id);
- const pageIdsSet = new Set(pageIdsArray);
+const commonWorkpadFields = {
+ '@created': schema.maybe(schema.string()),
+ '@timestamp': schema.maybe(schema.string()),
+ colors: schema.arrayOf(schema.string()),
+ css: schema.string(),
+ variables: schema.arrayOf(WorkpadVariable),
+ height: schema.number(),
+ id: schema.maybe(schema.string()),
+ isWriteable: schema.maybe(schema.boolean()),
+ name: schema.string(),
+ page: schema.number(),
+ pages: schema.arrayOf(WorkpadPageSchema),
+ width: schema.number(),
+};
- if (pageIdsArray.length !== pageIdsSet.size) {
- return 'Page Ids are not unique';
- }
+const WorkpadSchemaWithoutValidation = schema.object({
+ assets: schema.maybe(schema.recordOf(schema.string(), WorkpadAssetSchema)),
+ ...commonWorkpadFields,
+});
- // Validate unique element ids
- const elementIdsArray = workpad.pages
- .map((page) => page.elements.map((element) => element.id))
- .flat();
- const elementIdsSet = new Set(elementIdsArray);
+const ImportedWorkpadSchemaWithoutValidation = schema.object({
+ assets: schema.recordOf(schema.string(), WorkpadAssetSchema),
+ ...commonWorkpadFields,
+});
- if (elementIdsArray.length !== elementIdsSet.size) {
- return 'Element Ids are not unique';
- }
- },
+const validate = (workpad: TypeOf) => {
+ // Validate unique page ids
+ const pageIdsArray = workpad.pages.map((page) => page.id);
+ const pageIdsSet = new Set(pageIdsArray);
+
+ if (pageIdsArray.length !== pageIdsSet.size) {
+ return 'Page Ids are not unique';
+ }
+
+ // Validate unique element ids
+ const elementIdsArray = workpad.pages
+ .map((page) => page.elements.map((element) => element.id))
+ .flat();
+ const elementIdsSet = new Set(elementIdsArray);
+
+ if (elementIdsArray.length !== elementIdsSet.size) {
+ return 'Element Ids are not unique';
+ }
+};
+
+export const WorkpadSchema = WorkpadSchemaWithoutValidation.extends(
+ {},
+ {
+ validate,
+ }
+);
+
+export const ImportedWorkpadSchema = ImportedWorkpadSchemaWithoutValidation.extends(
+ {},
+ {
+ validate,
}
);
diff --git a/x-pack/plugins/canvas/server/saved_objects/custom_element.ts b/x-pack/plugins/canvas/server/saved_objects/custom_element.ts
index d62642f5619ea0..82305b2fdd95f1 100644
--- a/x-pack/plugins/canvas/server/saved_objects/custom_element.ts
+++ b/x-pack/plugins/canvas/server/saved_objects/custom_element.ts
@@ -7,8 +7,9 @@
import { SavedObjectsType } from 'src/core/server';
import { CUSTOM_ELEMENT_TYPE } from '../../common/lib/constants';
+import { customElementMigrationsFactory, CanvasSavedObjectTypeMigrationsDeps } from './migrations';
-export const customElementType: SavedObjectsType = {
+export const customElementType = (deps: CanvasSavedObjectTypeMigrationsDeps): SavedObjectsType => ({
name: CUSTOM_ELEMENT_TYPE,
hidden: false,
namespaceType: 'multiple-isolated',
@@ -31,7 +32,7 @@ export const customElementType: SavedObjectsType = {
'@created': { type: 'date' },
},
},
- migrations: {},
+ migrations: customElementMigrationsFactory(deps),
management: {
icon: 'canvasApp',
defaultSearchField: 'name',
@@ -40,4 +41,4 @@ export const customElementType: SavedObjectsType = {
return obj.attributes.displayName;
},
},
-};
+});
diff --git a/x-pack/plugins/canvas/server/saved_objects/index.ts b/x-pack/plugins/canvas/server/saved_objects/index.ts
index dfc27c4b6fa665..9e7cd8644c7c79 100644
--- a/x-pack/plugins/canvas/server/saved_objects/index.ts
+++ b/x-pack/plugins/canvas/server/saved_objects/index.ts
@@ -5,8 +5,8 @@
* 2.0.
*/
-import { workpadType } from './workpad';
+import { workpadTypeFactory } from './workpad';
import { customElementType } from './custom_element';
import { workpadTemplateType } from './workpad_template';
-export { customElementType, workpadType, workpadTemplateType };
+export { customElementType, workpadTypeFactory, workpadTemplateType };
diff --git a/x-pack/plugins/canvas/server/saved_objects/migrations/expressions.ts b/x-pack/plugins/canvas/server/saved_objects/migrations/expressions.ts
new file mode 100644
index 00000000000000..20eba14c5cff0d
--- /dev/null
+++ b/x-pack/plugins/canvas/server/saved_objects/migrations/expressions.ts
@@ -0,0 +1,145 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+import { Ast, fromExpression, toExpression } from '@kbn/interpreter';
+import { Serializable } from '@kbn/utility-types';
+import { SavedObjectMigrationFn, SavedObjectUnsanitizedDoc } from 'kibana/server';
+import { flowRight, mapValues } from 'lodash';
+import {
+ CanvasElement,
+ CanvasTemplateElement,
+ CanvasTemplate,
+ CustomElement,
+ CustomElementContent,
+ CustomElementNode,
+} from '../../../types';
+import {
+ MigrateFunction,
+ MigrateFunctionsObject,
+} from '../../../../../../src/plugins/kibana_utils/common';
+import { WorkpadAttributes } from '../../routes/workpad/workpad_attributes';
+import { CanvasSavedObjectTypeMigrationsDeps } from './types';
+
+type ToSerializable = {
+ [K in keyof Type]: Type[K] extends unknown[]
+ ? ToSerializable
+ : Type[K] extends {}
+ ? ToSerializable
+ : Serializable;
+};
+
+type ExprAst = ToSerializable;
+
+interface CommonPage {
+ elements?: T[];
+}
+interface CommonWorkpad, U> {
+ pages?: T[];
+}
+
+type MigrationFn = (
+ migrate: MigrateFunction,
+ version: string
+) => SavedObjectMigrationFn;
+
+const toAst = (expression: string): ExprAst => fromExpression(expression);
+const fromAst = (ast: Ast): string => toExpression(ast);
+
+const migrateExpr = (expr: string, migrateFn: MigrateFunction) =>
+ flowRight(fromAst, migrateFn, toAst)(expr);
+
+const migrateWorkpadElement =
+ (migrate: MigrateFunction) =>
+ ({ filter, expression, ...element }: CanvasElement | CustomElementNode) => ({
+ ...element,
+ filter: filter ? migrateExpr(filter, migrate) : filter,
+ expression: expression ? migrateExpr(expression, migrate) : expression,
+ });
+
+const migrateTemplateElement =
+ (migrate: MigrateFunction) =>
+ ({ expression, ...element }: CanvasTemplateElement) => ({
+ ...element,
+ expression: expression ? migrateExpr(expression, migrate) : expression,
+ });
+
+const migrateWorkpadElements = , U>(
+ doc: SavedObjectUnsanitizedDoc | undefined>,
+ migrateElementFn: any
+) => {
+ if (
+ typeof doc.attributes !== 'object' ||
+ doc.attributes === null ||
+ doc.attributes === undefined
+ ) {
+ return doc;
+ }
+
+ const { pages } = doc.attributes;
+
+ const newPages = pages?.map((page) => {
+ const { elements } = page;
+ const newElements = elements?.map(migrateElementFn);
+ return { ...page, elements: newElements };
+ });
+
+ return { ...doc, attributes: { ...doc.attributes, pages: newPages } };
+};
+
+const migrateTemplateWorkpadExpressions: MigrationFn =
+ (migrate) => (doc) =>
+ migrateWorkpadElements(doc, migrateTemplateElement(migrate));
+
+const migrateWorkpadExpressionsAndFilters: MigrationFn = (migrate) => (doc) =>
+ migrateWorkpadElements(doc, migrateWorkpadElement(migrate));
+
+const migrateCustomElementExpressionsAndFilters: MigrationFn =
+ (migrate) => (doc) => {
+ if (
+ typeof doc.attributes !== 'object' ||
+ doc.attributes === null ||
+ doc.attributes === undefined
+ ) {
+ return doc;
+ }
+
+ const { content } = doc.attributes;
+ const { selectedNodes = [] }: CustomElementContent = content
+ ? JSON.parse(content)
+ : { selectedNodes: [] };
+
+ const newSelectedNodes = selectedNodes.map((element) => {
+ const newElement = migrateWorkpadElement(migrate)(element);
+ return { ...element, ...newElement, ast: toAst(newElement.expression) };
+ });
+
+ const newContent = JSON.stringify({ selectedNodes: newSelectedNodes });
+ return { ...doc, attributes: { ...doc.attributes, content: newContent } };
+ };
+
+export const workpadExpressionsMigrationsFactory = ({
+ expressions,
+}: CanvasSavedObjectTypeMigrationsDeps) =>
+ mapValues>(
+ expressions.getAllMigrations(),
+ migrateWorkpadExpressionsAndFilters
+ ) as MigrateFunctionsObject;
+
+export const templateWorkpadExpressionsMigrationsFactory = ({
+ expressions,
+}: CanvasSavedObjectTypeMigrationsDeps) =>
+ mapValues>(
+ expressions.getAllMigrations(),
+ migrateTemplateWorkpadExpressions
+ ) as MigrateFunctionsObject;
+
+export const customElementExpressionsMigrationsFactory = ({
+ expressions,
+}: CanvasSavedObjectTypeMigrationsDeps) =>
+ mapValues>(
+ expressions.getAllMigrations(),
+ migrateCustomElementExpressionsAndFilters
+ ) as MigrateFunctionsObject;
diff --git a/x-pack/plugins/canvas/server/saved_objects/migrations/index.ts b/x-pack/plugins/canvas/server/saved_objects/migrations/index.ts
new file mode 100644
index 00000000000000..88913b50c3c4ca
--- /dev/null
+++ b/x-pack/plugins/canvas/server/saved_objects/migrations/index.ts
@@ -0,0 +1,28 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+import {
+ customElementExpressionsMigrationsFactory,
+ templateWorkpadExpressionsMigrationsFactory,
+ workpadExpressionsMigrationsFactory,
+} from './expressions';
+import { CanvasSavedObjectTypeMigrationsDeps } from './types';
+import { workpadMigrationsFactory as workpadMigrationsFactoryFn } from './workpad';
+import { mergeMigrationFunctionMaps } from '../../../../../../src/plugins/kibana_utils/common';
+
+export const workpadMigrationsFactory = (deps: CanvasSavedObjectTypeMigrationsDeps) =>
+ mergeMigrationFunctionMaps(
+ workpadMigrationsFactoryFn(deps),
+ workpadExpressionsMigrationsFactory(deps)
+ );
+
+export const templateWorkpadMigrationsFactory = (deps: CanvasSavedObjectTypeMigrationsDeps) =>
+ templateWorkpadExpressionsMigrationsFactory(deps);
+
+export const customElementMigrationsFactory = (deps: CanvasSavedObjectTypeMigrationsDeps) =>
+ customElementExpressionsMigrationsFactory(deps);
+
+export type { CanvasSavedObjectTypeMigrationsDeps } from './types';
diff --git a/x-pack/plugins/canvas/server/saved_objects/migrations/remove_attributes_id.ts b/x-pack/plugins/canvas/server/saved_objects/migrations/remove_attributes_id.ts
index c9c36fd7b26a92..f1dcbd5fe9e7c4 100644
--- a/x-pack/plugins/canvas/server/saved_objects/migrations/remove_attributes_id.ts
+++ b/x-pack/plugins/canvas/server/saved_objects/migrations/remove_attributes_id.ts
@@ -7,7 +7,7 @@
import { SavedObjectMigrationFn } from 'src/core/server';
-export const removeAttributesId: SavedObjectMigrationFn = (doc) => {
+export const removeAttributesId: SavedObjectMigrationFn = (doc) => {
if (typeof doc.attributes === 'object' && doc.attributes !== null) {
delete (doc.attributes as any).id;
}
diff --git a/x-pack/plugins/canvas/server/saved_objects/migrations/types.ts b/x-pack/plugins/canvas/server/saved_objects/migrations/types.ts
new file mode 100644
index 00000000000000..18ce0bd88cb696
--- /dev/null
+++ b/x-pack/plugins/canvas/server/saved_objects/migrations/types.ts
@@ -0,0 +1,11 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+import { ExpressionsService } from 'src/plugins/expressions/public';
+
+export interface CanvasSavedObjectTypeMigrationsDeps {
+ expressions: ExpressionsService;
+}
diff --git a/x-pack/plugins/canvas/server/saved_objects/migrations/workpad.ts b/x-pack/plugins/canvas/server/saved_objects/migrations/workpad.ts
new file mode 100644
index 00000000000000..d4d7e2b4297114
--- /dev/null
+++ b/x-pack/plugins/canvas/server/saved_objects/migrations/workpad.ts
@@ -0,0 +1,15 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { MigrateFunctionsObject } from 'src/plugins/kibana_utils/common';
+import { removeAttributesId } from './remove_attributes_id';
+import { CanvasSavedObjectTypeMigrationsDeps } from './types';
+
+export const workpadMigrationsFactory = (deps: CanvasSavedObjectTypeMigrationsDeps) =>
+ ({
+ '7.0.0': removeAttributesId,
+ } as unknown as MigrateFunctionsObject);
diff --git a/x-pack/plugins/canvas/server/saved_objects/workpad.ts b/x-pack/plugins/canvas/server/saved_objects/workpad.ts
index a8f0f3daf21757..db22025e625e8c 100644
--- a/x-pack/plugins/canvas/server/saved_objects/workpad.ts
+++ b/x-pack/plugins/canvas/server/saved_objects/workpad.ts
@@ -7,9 +7,12 @@
import { SavedObjectsType } from 'src/core/server';
import { CANVAS_TYPE } from '../../common/lib/constants';
-import { removeAttributesId } from './migrations/remove_attributes_id';
+import { workpadMigrationsFactory } from './migrations';
+import type { CanvasSavedObjectTypeMigrationsDeps } from './migrations';
-export const workpadType: SavedObjectsType = {
+export const workpadTypeFactory = (
+ deps: CanvasSavedObjectTypeMigrationsDeps
+): SavedObjectsType => ({
name: CANVAS_TYPE,
hidden: false,
namespaceType: 'multiple-isolated',
@@ -29,9 +32,7 @@ export const workpadType: SavedObjectsType = {
'@created': { type: 'date' },
},
},
- migrations: {
- '7.0.0': removeAttributesId,
- },
+ migrations: workpadMigrationsFactory(deps),
management: {
importableAndExportable: true,
icon: 'canvasApp',
@@ -46,4 +47,4 @@ export const workpadType: SavedObjectsType = {
};
},
},
-};
+});
diff --git a/x-pack/plugins/canvas/server/saved_objects/workpad_template.ts b/x-pack/plugins/canvas/server/saved_objects/workpad_template.ts
index eff7f45dcadae5..a55c7348c62bb9 100644
--- a/x-pack/plugins/canvas/server/saved_objects/workpad_template.ts
+++ b/x-pack/plugins/canvas/server/saved_objects/workpad_template.ts
@@ -7,8 +7,14 @@
import { SavedObjectsType } from 'src/core/server';
import { TEMPLATE_TYPE } from '../../common/lib/constants';
+import {
+ CanvasSavedObjectTypeMigrationsDeps,
+ templateWorkpadMigrationsFactory,
+} from './migrations';
-export const workpadTemplateType: SavedObjectsType = {
+export const workpadTemplateType = (
+ deps: CanvasSavedObjectTypeMigrationsDeps
+): SavedObjectsType => ({
name: TEMPLATE_TYPE,
hidden: false,
namespaceType: 'agnostic',
@@ -44,7 +50,7 @@ export const workpadTemplateType: SavedObjectsType = {
},
},
},
- migrations: {},
+ migrations: templateWorkpadMigrationsFactory(deps),
management: {
importableAndExportable: false,
icon: 'canvasApp',
@@ -53,4 +59,4 @@ export const workpadTemplateType: SavedObjectsType = {
return obj.attributes.name;
},
},
-};
+});
diff --git a/x-pack/plugins/canvas/server/templates/pitch_presentation.ts b/x-pack/plugins/canvas/server/templates/pitch_presentation.ts
index a9f09ada989c6e..82ad535852c970 100644
--- a/x-pack/plugins/canvas/server/templates/pitch_presentation.ts
+++ b/x-pack/plugins/canvas/server/templates/pitch_presentation.ts
@@ -63,7 +63,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "# Sample."\n| render css=".canvasRenderEl h1 {\ntext-align: center;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "# Sample."\n| render css=".canvasRenderEl h1 {\ntext-align: center;\n}"',
},
{
id: 'element-33286979-7ea0-41ce-9835-b3bf07f09272',
@@ -76,7 +76,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "### This is a subtitle"\n| render css=".canvasRenderEl h3 {\ntext-align: center;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "### This is a subtitle"\n| render css=".canvasRenderEl h3 {\ntext-align: center;\n}"',
},
{
id: 'element-1e3b3ffe-4ed8-4376-aad3-77e06d29cafe',
@@ -89,7 +89,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "Footnote can go here"\n| render \n css=".canvasRenderEl p {\ntext-align: center;\ncolor: #FFFFFF;\nfont-size: 18px;\nopacity: .7;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "Footnote can go here"\n| render \n css=".canvasRenderEl p {\ntext-align: center;\ncolor: #FFFFFF;\nfont-size: 18px;\nopacity: .7;\n}"',
},
{
id: 'element-5b5035a3-d5b7-4483-a240-2cf80f5e0acf',
@@ -150,7 +150,8 @@ export const pitch: CanvasTemplate = {
angle: 0,
parent: null,
},
- expression: 'filters\n| demodata\n| markdown "##### CATEGORY 01"\n| render',
+ expression:
+ 'kibana\n| selectFilter\n| demodata\n| markdown "##### CATEGORY 01"\n| render',
},
{
id: 'element-96a390b6-3d0a-4372-89cb-3ff38eec9565',
@@ -162,7 +163,8 @@ export const pitch: CanvasTemplate = {
angle: 0,
parent: null,
},
- expression: 'filters\n| demodata\n| markdown "## Half text, half _image._"\n| render',
+ expression:
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## Half text, half _image._"\n| render',
},
{
id: 'element-118b848d-0f89-4d20-868c-21597b7fd5e0',
@@ -188,7 +190,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus urna non feugiat imperdiet. Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus urna non feugiat imperdiet. Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render',
},
],
groups: [],
@@ -223,7 +225,7 @@ export const pitch: CanvasTemplate = {
angle: 0,
parent: null,
},
- expression: 'filters\n| demodata\n| markdown "##### BIOS"\n| render',
+ expression: 'kibana\n| selectFilter\n| demodata\n| markdown "##### BIOS"\n| render',
},
{
id: 'element-e2c658ee-7614-4d92-a46e-2b1a81a24485',
@@ -236,7 +238,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "## Jane Doe" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## Jane Doe" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
},
{
id: 'element-3d16765e-5251-4954-8e2a-6c64ed465b73',
@@ -249,7 +251,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "### Developer" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl h3 {\ncolor: #444444;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "### Developer" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl h3 {\ncolor: #444444;\n}"',
},
{
id: 'element-624675cf-46e9-4545-b86a-5409bbe53ac1',
@@ -262,7 +264,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vel sollicitudin mauris, ut scelerisque urna. " \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vel sollicitudin mauris, ut scelerisque urna. " \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
},
{
id: 'element-dc841809-d2a9-491b-b44f-be92927b8034',
@@ -301,7 +303,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vel sollicitudin mauris, ut scelerisque urna. " \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vel sollicitudin mauris, ut scelerisque urna. " \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
},
{
id: 'element-62f241ec-71ce-4edb-a27b-0de990522d20',
@@ -314,7 +316,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "### Designer" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl h3 {\ncolor: #444444;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "### Designer" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl h3 {\ncolor: #444444;\n}"',
},
{
id: 'element-aa6c07e0-937f-4362-9d52-f70738faa0c5',
@@ -340,7 +342,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "## John Smith" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## John Smith" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
},
],
groups: [],
@@ -388,7 +390,8 @@ export const pitch: CanvasTemplate = {
angle: 0,
parent: null,
},
- expression: 'filters\n| demodata\n| markdown "##### CATEGORY 10"\n| render',
+ expression:
+ 'kibana\n| selectFilter\n| demodata\n| markdown "##### CATEGORY 10"\n| render',
},
{
id: 'element-96be0724-0945-4802-8929-1dc456192fb5',
@@ -401,7 +404,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "## Another page style."\n| render css=".canvasRenderEl h2 {\nfont-size: 64px;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## Another page style."\n| render css=".canvasRenderEl h2 {\nfont-size: 64px;\n}"',
},
{
id: 'element-3b4ba0ff-7f95-460e-9fa6-0cbb0f8f3df8',
@@ -427,7 +430,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus urna non feugiat imperdiet. Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus urna non feugiat imperdiet. Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render',
},
{
id: 'element-0b9aa82b-fb0c-4000-805b-146cc9280bc5',
@@ -440,7 +443,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "### Introduction"\n| render css=".canvasRenderEl h3 {\ncolor: #444444;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "### Introduction"\n| render css=".canvasRenderEl h3 {\ncolor: #444444;\n}"',
},
],
groups: [],
@@ -489,7 +492,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "##### CATEGORY 01"\n| render css=".canvasRenderEl h5 {\ncolor: #45bdb0;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "##### CATEGORY 01"\n| render css=".canvasRenderEl h5 {\ncolor: #45bdb0;\n}"',
},
{
id: 'element-1ba728f0-f645-4910-9d32-fa5b5820a94c',
@@ -502,7 +505,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Cras dapibus urna non feugiat imperdiet. Donec mauris, ut scelerisque urna. Sed vel neque quis metus luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Cras dapibus urna non feugiat imperdiet. Donec mauris, ut scelerisque urna. Sed vel neque quis metus luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
},
{
id: 'element-db9051eb-7699-4883-b67f-945979cf5650',
@@ -528,7 +531,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="wheel" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=30 align="center" color="#45bdb0" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="wheel" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=30 align="center" color="#45bdb0" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render',
},
{
id: 'element-fc11525c-2d9c-4a7b-9d96-d54e7bc6479b',
@@ -554,7 +557,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Cras dapibus urna non feugiat imperdiet. Donec mauris, ut scelerisque urna. Sed vel neque quis metus luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Cras dapibus urna non feugiat imperdiet. Donec mauris, ut scelerisque urna. Sed vel neque quis metus luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
},
{
id: 'element-eb9a8883-de47-4a46-9400-b7569f9e69e6',
@@ -567,7 +570,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="wheel" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=30 align="center" color="#45bdb0" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="wheel" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=30 align="center" color="#45bdb0" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render',
},
{
id: 'element-20c1c86a-658b-4bd2-8326-f987ef84e730',
@@ -580,7 +583,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Cras dapibus urna non feugiat imperdiet. Donec mauris, ut scelerisque urna. Sed vel neque quis metus luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Cras dapibus urna non feugiat imperdiet. Donec mauris, ut scelerisque urna. Sed vel neque quis metus luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render',
},
{
id: 'element-335db0c3-f678-4cb8-8b93-a6494f1787f5',
@@ -593,7 +596,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="wheel" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=30 align="center" color="#45bdb0" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="wheel" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=30 align="center" color="#45bdb0" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render',
},
{
id: 'element-079d3cbf-8b15-4ce2-accb-6ba04481019d',
@@ -667,7 +670,8 @@ export const pitch: CanvasTemplate = {
angle: 0,
parent: null,
},
- expression: 'filters\n| demodata\n| markdown "##### CATEGORY 01"\n| render',
+ expression:
+ 'kibana\n| selectFilter\n| demodata\n| markdown "##### CATEGORY 01"\n| render',
},
{
id: 'element-0f2b9268-f0bd-41b7-abc8-5593276f26fa',
@@ -680,7 +684,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "## Bold title text goes _here_."\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## Bold title text goes _here_."\n| render',
},
{
id: 'element-4f4b503e-f1ef-4ab7-aa1d-5d95b3e2e605',
@@ -706,7 +710,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus urna non feugiat imperdiet. Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus urna non feugiat imperdiet. Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render',
},
{
id: 'element-f3f28541-06fe-47ea-89b7-1c5831e28e71',
@@ -719,7 +723,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "Caption text goes here" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="right" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\nfont-size: 18px;\nopacity: .8;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "Caption text goes here" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="right" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\nfont-size: 18px;\nopacity: .8;\n}"',
},
],
groups: [],
@@ -768,7 +772,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "##### CATEGORY 01"\n| render css=".canvasRenderEl h5 {\ncolor: #45bdb0;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "##### CATEGORY 01"\n| render css=".canvasRenderEl h5 {\ncolor: #45bdb0;\n}"',
},
{
id: 'element-5afa7019-af44-4919-9e11-24e2348cfae9',
@@ -781,7 +785,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "## Title for live charts."\n| render css=".canvasRenderEl h2 {\ncolor: #FFFFFF;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## Title for live charts."\n| render css=".canvasRenderEl h2 {\ncolor: #FFFFFF;\n}"',
},
{
id: 'element-7b856b52-0d8b-492b-a71f-3508a84388a6',
@@ -820,7 +824,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "## _Charts with live data._"\n| render css=".canvasRenderEl h1 {\n\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## _Charts with live data._"\n| render css=".canvasRenderEl h1 {\n\n}"',
},
{
id: 'element-317bed0b-f067-4d2d-8cb4-1145f6e0a11c',
@@ -833,7 +837,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="horizontalBar" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=18 align="center" color="#444444" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render css=".canvasRenderEl {\nwidth: 100%;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="horizontalBar" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=18 align="center" color="#444444" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render css=".canvasRenderEl {\nwidth: 100%;\n}"',
},
{
id: 'element-34385617-6eb7-4918-b4db-1a0e8dd6eabe',
@@ -846,7 +850,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="horizontalBar" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=18 align="center" color="#444444" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render css=".canvasRenderEl {\nwidth: 100%;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="horizontalBar" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=18 align="center" color="#444444" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render css=".canvasRenderEl {\nwidth: 100%;\n}"',
},
{
id: 'element-b22a35eb-b177-4664-800e-57b91436a879',
@@ -859,7 +863,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="horizontalBar" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=18 align="center" color="#444444" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render css=".canvasRenderEl {\nwidth: 100%;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="horizontalBar" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=18 align="center" color="#444444" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render css=".canvasRenderEl {\nwidth: 100%;\n}"',
},
{
id: 'element-651f8a4a-6069-49bf-a7b0-484854628a79',
@@ -872,7 +876,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="horizontalBar" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=18 align="center" color="#444444" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render css=".canvasRenderEl {\nwidth: 100%;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| math "mean(percent_uptime)"\n| progress shape="horizontalBar" label={formatnumber "0%"} \n font={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=18 align="center" color="#444444" weight="bold" underline=false italic=false} valueColor="#45bdb0" valueWeight=15 barColor="#444444" barWeight=15\n| render css=".canvasRenderEl {\nwidth: 100%;\n}"',
},
{
id: 'element-0ee8c529-4155-442f-8c7c-1df86be37051',
@@ -885,7 +889,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus urna non feugiat imperdiet. Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus urna non feugiat imperdiet. Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render',
},
{
id: 'element-3fb61301-3dc2-411f-ac69-ad22bd37c77d',
@@ -898,7 +902,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Cras dapibus urna non feugiat imperdiet. \n\nDonec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Cras dapibus urna non feugiat imperdiet. \n\nDonec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render',
},
],
groups: [],
@@ -960,7 +964,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "##### CATEGORY 01"\n| render css=".canvasRenderEl h5 {\ncolor: #45bdb0;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "##### CATEGORY 01"\n| render css=".canvasRenderEl h5 {\ncolor: #45bdb0;\n}"',
},
{
id: 'element-8b9d3e2b-1d7b-48f4-897c-bf48f0f363d4',
@@ -973,7 +977,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "## Title on a _dark_ background."\n| render css=".canvasRenderEl h2 {\ncolor: #FFFFFF;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## Title on a _dark_ background."\n| render css=".canvasRenderEl h2 {\ncolor: #FFFFFF;\n}"',
},
{
id: 'element-080c3153-45f7-4efc-8b23-ed7735da426f',
@@ -999,7 +1003,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus urna non feugiat imperdiet. Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus urna non feugiat imperdiet. Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus."\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\n}"',
},
],
groups: [],
@@ -1021,7 +1025,8 @@ export const pitch: CanvasTemplate = {
angle: 0,
parent: null,
},
- expression: 'filters\n| demodata\n| markdown "## Bullet point layout style"\n| render',
+ expression:
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## Bullet point layout style"\n| render',
},
{
id: 'element-37dc903a-1c6d-4452-8fc0-38d4afa4631a',
@@ -1034,7 +1039,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "- Dolor sit amet, consectetur adipiscing elit\n- Cras dapibus urna non feugiat imperdiet\n- Donec vel sollicitudin mauris, ut scelerisque urna\n- Sed vel neque quis metus vulputate luctus\n- Dolor sit amet, consectetur adipiscing elit\n- Cras dapibus urna non feugiat imperdiet\n- Donec vel sollicitudin mauris, ut scelerisque urna\n- Sed vel neque quis metus vulputate luctus"\n| render css=".canvasRenderEl li {\nfont-size: 24px;\nline-height: 30px;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "- Dolor sit amet, consectetur adipiscing elit\n- Cras dapibus urna non feugiat imperdiet\n- Donec vel sollicitudin mauris, ut scelerisque urna\n- Sed vel neque quis metus vulputate luctus\n- Dolor sit amet, consectetur adipiscing elit\n- Cras dapibus urna non feugiat imperdiet\n- Donec vel sollicitudin mauris, ut scelerisque urna\n- Sed vel neque quis metus vulputate luctus"\n| render css=".canvasRenderEl li {\nfont-size: 24px;\nline-height: 30px;\n}"',
},
{
id: 'element-e506de9d-bda1-4018-89bf-f8d02ee5738e',
@@ -1047,7 +1052,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Donec vel sollicitudin mauris, ut scelerisque urna. Vel sollicitudin mauris, ut scelerisque urna." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="left" color="#000000" weight="normal" underline=false italic=true}\n| render css=".canvasRenderEl p {\nfont-size: 18px;\nopacity: .8;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Donec vel sollicitudin mauris, ut scelerisque urna. Vel sollicitudin mauris, ut scelerisque urna." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="left" color="#000000" weight="normal" underline=false italic=true}\n| render css=".canvasRenderEl p {\nfont-size: 18px;\nopacity: .8;\n}"',
},
{
id: 'element-ea5319f5-d204-48c5-a9a0-0724676869a6',
@@ -1073,7 +1078,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "### Subtitle goes here"\n| render css=".canvasRenderEl h3 {\ncolor: #45bdb0;\ntext-transform: none;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "### Subtitle goes here"\n| render css=".canvasRenderEl h3 {\ncolor: #45bdb0;\ntext-transform: none;\n}"',
},
],
groups: [],
@@ -1095,7 +1100,8 @@ export const pitch: CanvasTemplate = {
angle: 0,
parent: null,
},
- expression: 'filters\n| demodata\n| markdown "## Paragraph layout style"\n| render',
+ expression:
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## Paragraph layout style"\n| render',
},
{
id: 'element-92b05ab1-c504-4110-a8ad-73d547136024',
@@ -1108,7 +1114,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Proin ipsum orci, consectetur a lacus vel, varius rutrum neque. Mauris quis gravida tellus. Integer quis tellus non lectus vestibulum fermentum. Quisque tortor justo, vulputate quis mollis eu, molestie eu ex. Nam eu arcu ac dui mattis facilisis aliquam venenatis est. Quisque tempor risus quis arcu viverra, quis consequat dolor molestie. Sed sed arcu dictum, sollicitudin dui id, iaculis elit. Nunc odio ex, placerat sed hendrerit vitae, finibus eu felis. Sed vulputate mi diam, at dictum mi tempus eu.\n\nClass aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vivamus malesuada tortor vel eleifend lobortis. Donec vestibulum neque vel neque vehicula auctor. Proin id felis a leo ultrices maximus."\n| render css=".canvasRenderEl p {\nfont-size: 24px;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Proin ipsum orci, consectetur a lacus vel, varius rutrum neque. Mauris quis gravida tellus. Integer quis tellus non lectus vestibulum fermentum. Quisque tortor justo, vulputate quis mollis eu, molestie eu ex. Nam eu arcu ac dui mattis facilisis aliquam venenatis est. Quisque tempor risus quis arcu viverra, quis consequat dolor molestie. Sed sed arcu dictum, sollicitudin dui id, iaculis elit. Nunc odio ex, placerat sed hendrerit vitae, finibus eu felis. Sed vulputate mi diam, at dictum mi tempus eu.\n\nClass aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vivamus malesuada tortor vel eleifend lobortis. Donec vestibulum neque vel neque vehicula auctor. Proin id felis a leo ultrices maximus."\n| render css=".canvasRenderEl p {\nfont-size: 24px;\n}"',
},
{
id: 'element-e49141ec-3034-4bec-88ca-f9606d12a60a',
@@ -1134,7 +1140,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "### Subtitle goes here"\n| render css=".canvasRenderEl h3 {\ncolor: #45bdb0;\ntext-transform: none;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "### Subtitle goes here"\n| render css=".canvasRenderEl h3 {\ncolor: #45bdb0;\ntext-transform: none;\n}"',
},
],
groups: [],
@@ -1170,7 +1176,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "## Title text can also go _here_ on multiple lines." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl h2 {\ncolor: #FFFFFF;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## Title text can also go _here_ on multiple lines." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl h2 {\ncolor: #FFFFFF;\n}"',
},
{
id: 'element-a8e0d4b3-864d-4dae-b0dc-64caad06c106',
@@ -1196,7 +1202,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Vivamus malesuada tortor vel eleifend lobortis. Donec vestibulum neque vel neque vehicula auctor. Proin id felis a leo ultrices maximus. Nam est nulla, venenatis at mi et, sodales convallis eros. Aliquam a convallis justo, eu viverra augue. Donec mollis ipsum sed orci posuere, vel posuere neque tempus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Vivamus malesuada tortor vel eleifend lobortis. Donec vestibulum neque vel neque vehicula auctor. Proin id felis a leo ultrices maximus. Nam est nulla, venenatis at mi et, sodales convallis eros. Aliquam a convallis justo, eu viverra augue. Donec mollis ipsum sed orci posuere, vel posuere neque tempus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\n}"',
},
{
id: 'element-b54e2908-6908-4dd6-90f1-3ca489807016',
@@ -1222,7 +1228,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Vivamus malesuada tortor vel eleifend lobortis. Donec vestibulum neque vel neque vehicula auctor. Proin id felis a leo ultrices maximus. Nam est nulla, venenatis at mi et, sodales convallis eros. Aliquam a convallis justo, eu viverra augue. Donec mollis ipsum sed orci posuere, vel posuere neque tempus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Vivamus malesuada tortor vel eleifend lobortis. Donec vestibulum neque vel neque vehicula auctor. Proin id felis a leo ultrices maximus. Nam est nulla, venenatis at mi et, sodales convallis eros. Aliquam a convallis justo, eu viverra augue. Donec mollis ipsum sed orci posuere, vel posuere neque tempus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\n}"',
},
{
id: 'element-aa54f47c-fecf-4bdb-ac1d-b815d4a8d71d',
@@ -1235,7 +1241,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "## This title is a _centered_ layout." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl h2 {\ncolor: #FFFFFF;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## This title is a _centered_ layout." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl h2 {\ncolor: #FFFFFF;\n}"',
},
{
id: 'element-6ae072e7-213c-4de9-af22-7fb3e254cf52',
@@ -1284,7 +1290,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "## \\"Aliquam mollis auctor nisl vitae varius. Donec nunc turpis, condimentum non sagittis tristique, sollicitudin blandit sem.\\"" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=true}\n| render',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "## \\"Aliquam mollis auctor nisl vitae varius. Donec nunc turpis, condimentum non sagittis tristique, sollicitudin blandit sem.\\"" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=true}\n| render',
},
{
id: 'element-989daff8-3571-4e02-b5fc-26657b2d9aaf',
@@ -1310,7 +1316,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "### Lorem Ipsum" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl h3 {\ncolor: #45bdb0;\ntext-transform: none;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "### Lorem Ipsum" \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl h3 {\ncolor: #45bdb0;\ntext-transform: none;\n}"',
},
{
id: 'element-cf931bd0-e3b6-4ae3-9164-8fe9ba14873d',
@@ -1372,7 +1378,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "##### CATEGORY 01"\n| render css=".canvasRenderEl h5 {\ncolor: #FFFFFF;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "##### CATEGORY 01"\n| render css=".canvasRenderEl h5 {\ncolor: #FFFFFF;\n}"',
},
{
id: 'element-dc4336d5-9752-421f-8196-9f4a6f8150f0',
@@ -1385,7 +1391,7 @@ export const pitch: CanvasTemplate = {
parent: 'group-1303d0b2-057a-40bf-a0ff-4907b00a285c',
},
expression:
- 'filters\n| demodata\n| markdown \n "Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=18 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\nfont-size: 18px;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=18 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\nfont-size: 18px;\n}"',
},
{
id: 'element-b8325cb3-2856-4fd6-8c5a-cba2430dda3e',
@@ -1411,7 +1417,7 @@ export const pitch: CanvasTemplate = {
parent: 'group-1303d0b2-057a-40bf-a0ff-4907b00a285c',
},
expression:
- 'filters\n| demodata\n| math "unique(project)"\n| metric "Projects" \n metricFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=72 align="center" color="#45bdb0" weight="bold" underline=false italic=false} \n labelFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=24 align="center" color="#45bdb0" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl .canvasMetric__metric {\nmargin-bottom: 32px;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| math "unique(project)"\n| metric "Projects" \n metricFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=72 align="center" color="#45bdb0" weight="bold" underline=false italic=false} \n labelFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=24 align="center" color="#45bdb0" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl .canvasMetric__metric {\nmargin-bottom: 32px;\n}"',
},
{
id: 'element-07f73884-13e9-4a75-8a23-4eb137e75817',
@@ -1424,7 +1430,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown \n "Donec vel sollicitudin mauris, ut scelerisque urna. Vel sollicitudin mauris, ut scelerisque urna." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#FFFFFF" weight="normal" underline=false italic=true}\n| render css=".canvasRenderEl p {\nfont-size: 16px;\nopacity: .7;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Donec vel sollicitudin mauris, ut scelerisque urna. Vel sollicitudin mauris, ut scelerisque urna." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=14 align="center" color="#FFFFFF" weight="normal" underline=false italic=true}\n| render css=".canvasRenderEl p {\nfont-size: 16px;\nopacity: .7;\n}"',
},
{
id: 'element-201b8f78-045e-4457-9ada-5166965e64cf',
@@ -1437,7 +1443,7 @@ export const pitch: CanvasTemplate = {
parent: 'group-1303d0b2-057a-40bf-a0ff-4907b00a285c',
},
expression:
- 'filters\n| demodata\n| markdown \n "Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=18 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\nfont-size: 18px;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=18 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\nfont-size: 18px;\n}"',
},
{
id: 'element-9b667060-18ba-4f4d-84a2-48adff57efac',
@@ -1450,7 +1456,7 @@ export const pitch: CanvasTemplate = {
parent: 'group-1303d0b2-057a-40bf-a0ff-4907b00a285c',
},
expression:
- 'filters\n| demodata\n| math "unique(country)"\n| metric "Countries" \n metricFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=72 align="center" color="#45bdb0" weight="bold" underline=false italic=false} \n labelFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=24 align="center" color="#45bdb0" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl .canvasMetric__metric {\nmargin-bottom: 32px;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| math "unique(country)"\n| metric "Countries" \n metricFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=72 align="center" color="#45bdb0" weight="bold" underline=false italic=false} \n labelFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=24 align="center" color="#45bdb0" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl .canvasMetric__metric {\nmargin-bottom: 32px;\n}"',
},
{
id: 'element-23fcecca-1f6a-44f6-b441-0f65e03d8210',
@@ -1463,7 +1469,7 @@ export const pitch: CanvasTemplate = {
parent: 'group-1303d0b2-057a-40bf-a0ff-4907b00a285c',
},
expression:
- 'filters\n| demodata\n| math "unique(username)"\n| metric "Customers" \n metricFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=72 align="center" color="#45bdb0" weight="bold" underline=false italic=false} \n labelFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=24 align="center" color="#45bdb0" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl .canvasMetric__metric {\nmargin-bottom: 32px;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| math "unique(username)"\n| metric "Customers" \n metricFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=72 align="center" color="#45bdb0" weight="bold" underline=false italic=false} \n labelFont={font family="Futura, Impact, Helvetica, Arial, sans-serif" size=24 align="center" color="#45bdb0" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl .canvasMetric__metric {\nmargin-bottom: 32px;\n}"',
},
{
id: 'element-19f1db84-7a46-4ccb-a6b9-afd6ddd68523',
@@ -1476,7 +1482,7 @@ export const pitch: CanvasTemplate = {
parent: 'group-1303d0b2-057a-40bf-a0ff-4907b00a285c',
},
expression:
- 'filters\n| demodata\n| markdown \n "Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=18 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\nfont-size: 18px;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown \n "Donec vel sollicitudin mauris, ut scelerisque urna. Sed vel neque quis metus vulputate luctus." \n font={font family="\'Open Sans\', Helvetica, Arial, sans-serif" size=18 align="center" color="#000000" weight="normal" underline=false italic=false}\n| render css=".canvasRenderEl p {\ncolor: #FFFFFF;\nopacity: .8;\nfont-size: 18px;\n}"',
},
],
groups: [],
@@ -1499,7 +1505,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "## An alternative opening title slide."\n| render css=".canvasRenderEl h2 {\nfont-size: 64px;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "## An alternative opening title slide."\n| render css=".canvasRenderEl h2 {\nfont-size: 64px;\n}"',
},
{
id: 'element-433586c1-4d44-40cf-988e-cf51871248fb',
@@ -1525,7 +1531,7 @@ export const pitch: CanvasTemplate = {
parent: null,
},
expression:
- 'filters\n| demodata\n| markdown "### Subtitle goes here"\n| render css=".canvasRenderEl h3 {\ncolor: #45bdb0;\ntext-transform: none;\n}"',
+ 'kibana\n| selectFilter\n| demodata\n| markdown "### Subtitle goes here"\n| render css=".canvasRenderEl h3 {\ncolor: #45bdb0;\ntext-transform: none;\n}"',
},
],
groups: [],
diff --git a/x-pack/plugins/canvas/server/workpad_route_context.ts b/x-pack/plugins/canvas/server/workpad_route_context.ts
index 9727327fcbd793..d7c818b786e323 100644
--- a/x-pack/plugins/canvas/server/workpad_route_context.ts
+++ b/x-pack/plugins/canvas/server/workpad_route_context.ts
@@ -16,12 +16,13 @@ import { WorkpadAttributes } from './routes/workpad/workpad_attributes';
import { CANVAS_TYPE } from '../common/lib/constants';
import { injectReferences, extractReferences } from './saved_objects/workpad_references';
import { getId } from '../common/lib/get_id';
-import { CanvasWorkpad } from '../types';
+import { CanvasWorkpad, ImportedCanvasWorkpad } from '../types';
export interface CanvasRouteHandlerContext extends RequestHandlerContext {
canvas: {
workpad: {
create: (attributes: CanvasWorkpad) => Promise>;
+ import: (workpad: ImportedCanvasWorkpad) => Promise>;
get: (id: string) => Promise>;
resolve: (id: string) => Promise>;
update: (
@@ -62,6 +63,33 @@ export const createWorkpadRouteContext: (
{ id, references }
);
},
+ import: async (workpad: ImportedCanvasWorkpad) => {
+ const now = new Date().toISOString();
+ const { id: maybeId, ...workpadWithoutId } = workpad;
+
+ // Functionality of running migrations on import of workpads was implemented in v8.1.0.
+ // As only attributes of the saved object workpad are exported, to run migrations it is necessary
+ // to specify the minimal version of possible migrations to execute them. It is v8.0.0 in the current case.
+ const DEFAULT_MIGRATION_VERSION = { [CANVAS_TYPE]: '8.0.0' };
+ const DEFAULT_CORE_MIGRATION_VERSION = '8.0.0';
+
+ const id = maybeId ? maybeId : getId('workpad');
+
+ return await context.core.savedObjects.client.create(
+ CANVAS_TYPE,
+ {
+ isWriteable: true,
+ ...workpadWithoutId,
+ '@timestamp': now,
+ '@created': now,
+ },
+ {
+ migrationVersion: DEFAULT_MIGRATION_VERSION,
+ coreMigrationVersion: DEFAULT_CORE_MIGRATION_VERSION,
+ id,
+ }
+ );
+ },
get: async (id: string) => {
const workpad = await context.core.savedObjects.client.get(
CANVAS_TYPE,
diff --git a/x-pack/plugins/canvas/types/canvas.ts b/x-pack/plugins/canvas/types/canvas.ts
index efb121b2948af2..09add343aeac47 100644
--- a/x-pack/plugins/canvas/types/canvas.ts
+++ b/x-pack/plugins/canvas/types/canvas.ts
@@ -66,15 +66,30 @@ export interface CanvasWorkpad {
width: number;
}
-type CanvasTemplateElement = Omit;
-type CanvasTemplatePage = Omit & { elements: CanvasTemplateElement[] };
+export type ImportedCanvasWorkpad = Omit<
+ CanvasWorkpad,
+ '@created' | '@timestamp' | 'id' | 'isWriteable'
+> & {
+ id?: CanvasWorkpad['id'];
+ isWriteable?: CanvasWorkpad['isWriteable'];
+ '@created'?: CanvasWorkpad['@created'];
+ '@timestamp'?: CanvasWorkpad['@timestamp'];
+};
+
+export type CanvasTemplateElement = Omit;
+export type CanvasTemplatePage = Omit & {
+ elements: CanvasTemplateElement[];
+};
+
export interface CanvasTemplate {
id: string;
name: string;
help: string;
tags: string[];
template_key: string;
- template?: Omit & { pages: CanvasTemplatePage[] };
+ template?: Omit & {
+ pages: CanvasTemplatePage[] | undefined;
+ };
}
export interface CanvasWorkpadBoundingBox {
diff --git a/x-pack/plugins/canvas/types/elements.ts b/x-pack/plugins/canvas/types/elements.ts
index 0baf1e086d1557..0119c0a842f50b 100644
--- a/x-pack/plugins/canvas/types/elements.ts
+++ b/x-pack/plugins/canvas/types/elements.ts
@@ -49,6 +49,12 @@ export interface CustomElement {
content: string;
}
+export type CustomElementNode = Omit;
+
+export interface CustomElementContent {
+ selectedNodes: CustomElementNode[];
+}
+
export interface ElementPosition {
/**
* distance from the left edge of the page
diff --git a/x-pack/plugins/canvas/types/renderers.ts b/x-pack/plugins/canvas/types/renderers.ts
index 2c3931485757de..7c9b785dbb2bbc 100644
--- a/x-pack/plugins/canvas/types/renderers.ts
+++ b/x-pack/plugins/canvas/types/renderers.ts
@@ -26,8 +26,6 @@ export interface CanvasSpecificRendererHandlers {
onResize: GenericRendererCallback;
/** Handler to invoke when an element should be resized. */
resize: (size: { height: number; width: number }) => void;
- /** Sets the value of the filter property on the element object persisted on the workpad */
- setFilter: (filter: string) => void;
}
export type RendererHandlers = IInterpreterRenderHandlers & CanvasSpecificRendererHandlers;
diff --git a/x-pack/plugins/cases/common/api/cases/comment.ts b/x-pack/plugins/cases/common/api/cases/comment.ts
index e4e2a0793f7d43..19ad15286db6ab 100644
--- a/x-pack/plugins/cases/common/api/cases/comment.ts
+++ b/x-pack/plugins/cases/common/api/cases/comment.ts
@@ -110,6 +110,14 @@ export const CommentResponseRt = rt.intersection([
}),
]);
+export const CommentResponseTypeUserRt = rt.intersection([
+ AttributesTypeUserRt,
+ rt.type({
+ id: rt.string,
+ version: rt.string,
+ }),
+]);
+
export const CommentResponseTypeAlertsRt = rt.intersection([
AttributesTypeAlertsRt,
rt.type({
@@ -172,6 +180,7 @@ export type AttributesTypeUser = rt.TypeOf;
export type CommentAttributes = rt.TypeOf;
export type CommentRequest = rt.TypeOf;
export type CommentResponse = rt.TypeOf;
+export type CommentResponseUserType = rt.TypeOf;
export type CommentResponseAlertsType = rt.TypeOf;
export type CommentResponseActionsType = rt.TypeOf;
export type AllCommentsResponse = rt.TypeOf;
diff --git a/x-pack/plugins/cases/common/ui/types.ts b/x-pack/plugins/cases/common/ui/types.ts
index 65981e6aebd0f8..cfa91a9c57cab3 100644
--- a/x-pack/plugins/cases/common/ui/types.ts
+++ b/x-pack/plugins/cases/common/ui/types.ts
@@ -12,12 +12,12 @@ import {
CasePatchRequest,
CaseStatuses,
CaseType,
- CommentRequest,
User,
ActionConnector,
CaseExternalServiceBasic,
CaseUserActionResponse,
CaseMetricsResponse,
+ CommentResponse,
} from '../api';
import { SnakeToCamelCase } from '../types';
@@ -62,18 +62,7 @@ export type CaseViewRefreshPropInterface = null | {
refreshCase: () => Promise;
};
-export type Comment = CommentRequest & {
- associationType: AssociationType;
- id: string;
- createdAt: string;
- createdBy: ElasticUser;
- pushedAt: string | null;
- pushedBy: string | null;
- updatedAt: string | null;
- updatedBy: ElasticUser | null;
- version: string;
-};
-
+export type Comment = SnakeToCamelCase;
export type CaseUserActions = SnakeToCamelCase;
export type CaseExternalService = SnakeToCamelCase;
diff --git a/x-pack/plugins/cases/kibana.json b/x-pack/plugins/cases/kibana.json
index ebac6295166df7..bf3cc0ee320bd6 100644
--- a/x-pack/plugins/cases/kibana.json
+++ b/x-pack/plugins/cases/kibana.json
@@ -14,8 +14,8 @@
"spaces"
],
"owner":{
- "githubTeam":"security-threat-hunting",
- "name":"Security Solution Threat Hunting"
+ "githubTeam":"response-ops",
+ "name":"ResponseOps"
},
"requiredPlugins":[
"actions",
diff --git a/x-pack/plugins/cases/public/common/test_utils.ts b/x-pack/plugins/cases/public/common/test_utils.ts
index 0ebff7693eed88..5965ccbcf504eb 100644
--- a/x-pack/plugins/cases/public/common/test_utils.ts
+++ b/x-pack/plugins/cases/public/common/test_utils.ts
@@ -7,6 +7,7 @@
import { ReactWrapper } from 'enzyme';
import { act } from 'react-dom/test-utils';
+import { MatcherFunction } from '@testing-library/react';
/**
* Convenience utility to remove text appended to links by EUI
@@ -25,3 +26,16 @@ export const waitForComponentToUpdate = async () =>
act(async () => {
return Promise.resolve();
});
+
+type Query = (f: MatcherFunction) => HTMLElement;
+
+export const createQueryWithMarkup =
+ (query: Query) =>
+ (text: string): HTMLElement =>
+ query((content: string, node: Parameters[1]) => {
+ const hasText = (el: Parameters[1]) => el?.textContent === text;
+ const childrenDontHaveText = Array.from(node?.children ?? []).every(
+ (child) => !hasText(child as HTMLElement)
+ );
+ return hasText(node) && childrenDontHaveText;
+ });
diff --git a/x-pack/plugins/cases/public/components/all_cases/all_cases_list.test.tsx b/x-pack/plugins/cases/public/components/all_cases/all_cases_list.test.tsx
index 7950f962a9cc1e..5897a757b5bdf5 100644
--- a/x-pack/plugins/cases/public/components/all_cases/all_cases_list.test.tsx
+++ b/x-pack/plugins/cases/public/components/all_cases/all_cases_list.test.tsx
@@ -792,8 +792,10 @@ describe('AllCasesListGeneric', () => {
);
- const solutionHeader = wrapper.find({ children: 'Solution' });
- expect(solutionHeader.exists()).toBeTruthy();
+ await waitFor(() => {
+ const solutionHeader = wrapper.find({ children: 'Solution' });
+ expect(solutionHeader.exists()).toBeTruthy();
+ });
});
it('hides Solution column if there is a set owner', async () => {
@@ -805,8 +807,10 @@ describe('AllCasesListGeneric', () => {
);
- const solutionHeader = wrapper.find({ children: 'Solution' });
- expect(solutionHeader.exists()).toBeFalsy();
+ await waitFor(() => {
+ const solutionHeader = wrapper.find({ children: 'Solution' });
+ expect(solutionHeader.exists()).toBeFalsy();
+ });
});
it('should deselect cases when refreshing', async () => {
diff --git a/x-pack/plugins/cases/public/components/case_view/case_view_page.test.tsx b/x-pack/plugins/cases/public/components/case_view/case_view_page.test.tsx
index ac10068b88b3ef..9c0b7831893fa0 100644
--- a/x-pack/plugins/cases/public/components/case_view/case_view_page.test.tsx
+++ b/x-pack/plugins/cases/public/components/case_view/case_view_page.test.tsx
@@ -35,7 +35,7 @@ jest.mock('../../containers/use_get_case_user_actions');
jest.mock('../../containers/use_get_case');
jest.mock('../../containers/configure/use_connectors');
jest.mock('../../containers/use_post_push_to_service');
-jest.mock('../user_action_tree/user_action_timestamp');
+jest.mock('../user_actions/timestamp');
jest.mock('../../common/lib/kibana');
jest.mock('../../common/navigation/hooks');
@@ -506,7 +506,7 @@ describe('CaseViewPage', () => {
expect(
wrapper
.find(
- '[data-test-subj="comment-create-action-alert-action-id"] .euiCommentEvent__headerEvent'
+ '[data-test-subj="user-action-alert-comment-create-action-alert-action-id"] .euiCommentEvent__headerEvent'
)
.first()
.text()
diff --git a/x-pack/plugins/cases/public/components/case_view/case_view_page.tsx b/x-pack/plugins/cases/public/components/case_view/case_view_page.tsx
index 3ff8845f1e3a54..f1f4193ad346d6 100644
--- a/x-pack/plugins/cases/public/components/case_view/case_view_page.tsx
+++ b/x-pack/plugins/cases/public/components/case_view/case_view_page.tsx
@@ -18,7 +18,7 @@ import { CaseStatuses, CaseAttributes, CaseType, CaseConnector } from '../../../
import { Case, UpdateKey, UpdateByKey } from '../../../common/ui';
import { EditableTitle } from '../header_page/editable_title';
import { TagList } from '../tag_list';
-import { UserActionTree } from '../user_action_tree';
+import { UserActions } from '../user_actions';
import { UserList } from '../user_list';
import { useUpdateCase } from '../../containers/use_update_case';
import { getTypedPayload } from '../../containers/utils';
@@ -363,12 +363,11 @@ export const CaseViewPage = React.memo(
)}
- {
@@ -31,7 +32,7 @@ describe('Description', () => {
};
beforeEach(() => {
- jest.resetAllMocks();
+ jest.clearAllMocks();
});
it('it renders', async () => {
diff --git a/x-pack/plugins/cases/public/components/create/form.test.tsx b/x-pack/plugins/cases/public/components/create/form.test.tsx
index 65fcc479979f14..dd0759ce723aea 100644
--- a/x-pack/plugins/cases/public/components/create/form.test.tsx
+++ b/x-pack/plugins/cases/public/components/create/form.test.tsx
@@ -68,7 +68,7 @@ describe('CreateCaseForm', () => {
};
beforeEach(() => {
- jest.resetAllMocks();
+ jest.clearAllMocks();
useGetTagsMock.mockReturnValue({ tags: ['test'] });
useConnectorsMock.mockReturnValue({ loading: false, connectors: connectorsMock });
useCaseConfigureMock.mockImplementation(() => useCaseConfigureResponse);
diff --git a/x-pack/plugins/cases/public/components/markdown_editor/plugins/lens/__mocks__/use_lens_draft_comment.ts b/x-pack/plugins/cases/public/components/markdown_editor/plugins/lens/__mocks__/use_lens_draft_comment.ts
index a0f0d49b211fb1..677ef694894ec3 100644
--- a/x-pack/plugins/cases/public/components/markdown_editor/plugins/lens/__mocks__/use_lens_draft_comment.ts
+++ b/x-pack/plugins/cases/public/components/markdown_editor/plugins/lens/__mocks__/use_lens_draft_comment.ts
@@ -5,4 +5,9 @@
* 2.0.
*/
-export const useLensDraftComment = () => ({});
+export const useLensDraftComment = jest.fn().mockReturnValue({
+ draftComment: null,
+ hasIncomingLensState: false,
+ clearDraftComment: jest.fn(),
+ openLensModal: jest.fn(),
+});
diff --git a/x-pack/plugins/cases/public/components/markdown_editor/renderer.tsx b/x-pack/plugins/cases/public/components/markdown_editor/renderer.tsx
index c57283106c6c80..b0f167628496b2 100644
--- a/x-pack/plugins/cases/public/components/markdown_editor/renderer.tsx
+++ b/x-pack/plugins/cases/public/components/markdown_editor/renderer.tsx
@@ -40,6 +40,7 @@ const MarkdownRendererComponent: React.FC = ({ children, disableLinks })
{children}
diff --git a/x-pack/plugins/cases/public/components/user_action_tree/helpers.test.tsx b/x-pack/plugins/cases/public/components/user_action_tree/helpers.test.tsx
deleted file mode 100644
index 7f3ae4a490264d..00000000000000
--- a/x-pack/plugins/cases/public/components/user_action_tree/helpers.test.tsx
+++ /dev/null
@@ -1,211 +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
- * 2.0; you may not use this file except in compliance with the Elastic License
- * 2.0.
- */
-
-import React from 'react';
-import { mount } from 'enzyme';
-
-import {
- Actions,
- CaseStatuses,
- CommentType,
- ConnectorTypes,
- ConnectorUserAction,
- PushedUserAction,
- TagsUserAction,
- TitleUserAction,
-} from '../../../common/api';
-import { basicPush, getUserAction } from '../../containers/mock';
-import { getLabelTitle, getPushedServiceLabelTitle, getConnectorLabelTitle } from './helpers';
-import { connectorsMock } from '../../containers/configure/mock';
-import * as i18n from './translations';
-import { SnakeToCamelCase } from '../../../common/types';
-import { SECURITY_SOLUTION_OWNER } from '../../../common/constants';
-
-describe('User action tree helpers', () => {
- const connectors = connectorsMock;
- it('label title generated for update tags', () => {
- const action = getUserAction('tags', Actions.update, { payload: { tags: ['test'] } });
- const result: string | JSX.Element = getLabelTitle({
- action,
- });
-
- const tags = (action as unknown as TagsUserAction).payload.tags;
-
- const wrapper = mount(<>{result});
- expect(wrapper.find(`[data-test-subj="ua-tags-label"]`).first().text()).toEqual(
- ` ${i18n.TAGS.toLowerCase()}`
- );
-
- expect(wrapper.find(`[data-test-subj="tag-${tags[0]}"]`).first().text()).toEqual(tags[0]);
- });
-
- it('label title generated for update title', () => {
- const action = getUserAction('title', Actions.update, { payload: { title: 'test' } });
- const result: string | JSX.Element = getLabelTitle({
- action,
- });
-
- const title = (action as unknown as TitleUserAction).payload.title;
-
- expect(result).toEqual(
- `${i18n.CHANGED_FIELD.toLowerCase()} ${i18n.CASE_NAME.toLowerCase()} ${i18n.TO} "${title}"`
- );
- });
-
- it('label title generated for update description', () => {
- const action = getUserAction('description', Actions.update, {
- payload: { description: 'test' },
- });
- const result: string | JSX.Element = getLabelTitle({
- action,
- });
-
- expect(result).toEqual(`${i18n.EDITED_FIELD} ${i18n.DESCRIPTION.toLowerCase()}`);
- });
-
- it('label title generated for update status to open', () => {
- const action = {
- ...getUserAction('status', Actions.update, { payload: { status: CaseStatuses.open } }),
- };
- const result: string | JSX.Element = getLabelTitle({
- action,
- });
-
- const wrapper = mount(<>{result});
- expect(wrapper.find(`[data-test-subj="status-badge-open"]`).first().text()).toEqual('Open');
- });
-
- it('label title generated for update status to in-progress', () => {
- const action = {
- ...getUserAction('status', Actions.update, {
- payload: { status: CaseStatuses['in-progress'] },
- }),
- };
- const result: string | JSX.Element = getLabelTitle({
- action,
- });
-
- const wrapper = mount(<>{result});
- expect(wrapper.find(`[data-test-subj="status-badge-in-progress"]`).first().text()).toEqual(
- 'In progress'
- );
- });
-
- it('label title generated for update status to closed', () => {
- const action = {
- ...getUserAction('status', Actions.update, {
- payload: { status: CaseStatuses.closed },
- }),
- };
- const result: string | JSX.Element = getLabelTitle({
- action,
- });
-
- const wrapper = mount(<>{result});
- expect(wrapper.find(`[data-test-subj="status-badge-closed"]`).first().text()).toEqual('Closed');
- });
-
- it('label title is empty when status is not valid', () => {
- const action = {
- ...getUserAction('status', Actions.update, {
- payload: { status: '' },
- }),
- };
-
- const result: string | JSX.Element = getLabelTitle({
- action,
- });
-
- expect(result).toEqual('');
- });
-
- it('label title generated for update comment', () => {
- const action = getUserAction('comment', Actions.update, {
- payload: {
- comment: { comment: 'a comment', type: CommentType.user, owner: SECURITY_SOLUTION_OWNER },
- },
- });
- const result: string | JSX.Element = getLabelTitle({
- action,
- });
-
- expect(result).toEqual(`${i18n.EDITED_FIELD} ${i18n.COMMENT.toLowerCase()}`);
- });
-
- it('label title generated for pushed incident', () => {
- const action = getUserAction('pushed', 'push_to_service', {
- payload: { externalService: basicPush },
- }) as SnakeToCamelCase;
- const result: string | JSX.Element = getPushedServiceLabelTitle(action, true);
- const externalService = (action as SnakeToCamelCase).payload.externalService;
-
- const wrapper = mount(<>{result});
- expect(wrapper.find(`[data-test-subj="pushed-label"]`).first().text()).toEqual(
- `${i18n.PUSHED_NEW_INCIDENT} ${basicPush.connectorName}`
- );
- expect(wrapper.find(`[data-test-subj="pushed-value"]`).first().prop('href')).toEqual(
- externalService.externalUrl
- );
- });
-
- it('label title generated for needs update incident', () => {
- const action = getUserAction('pushed', 'push_to_service') as SnakeToCamelCase;
- const result: string | JSX.Element = getPushedServiceLabelTitle(action, false);
- const externalService = (action as SnakeToCamelCase).payload.externalService;
-
- const wrapper = mount(<>{result});
- expect(wrapper.find(`[data-test-subj="pushed-label"]`).first().text()).toEqual(
- `${i18n.UPDATE_INCIDENT} ${basicPush.connectorName}`
- );
- expect(wrapper.find(`[data-test-subj="pushed-value"]`).first().prop('href')).toEqual(
- externalService.externalUrl
- );
- });
-
- describe('getConnectorLabelTitle', () => {
- it('returns an empty string when the encoded value is null', () => {
- const result = getConnectorLabelTitle({
- // @ts-expect-error
- action: getUserAction(['connector'], Actions.update, { payload: { connector: null } }),
- connectors,
- });
-
- expect(result).toEqual('');
- });
-
- it('returns the change connector label', () => {
- const result: string | JSX.Element = getConnectorLabelTitle({
- action: getUserAction('connector', Actions.update, {
- payload: {
- connector: {
- id: 'resilient-2',
- type: ConnectorTypes.resilient,
- name: 'a',
- fields: null,
- },
- },
- }) as unknown as ConnectorUserAction,
- connectors,
- });
-
- expect(result).toEqual('selected My Connector 2 as incident management system');
- });
-
- it('returns the removed connector label', () => {
- const result: string | JSX.Element = getConnectorLabelTitle({
- action: getUserAction('connector', Actions.update, {
- payload: {
- connector: { id: 'none', type: ConnectorTypes.none, name: 'test', fields: null },
- },
- }) as unknown as ConnectorUserAction,
- connectors,
- });
-
- expect(result).toEqual('removed external incident management system');
- });
- });
-});
diff --git a/x-pack/plugins/cases/public/components/user_action_tree/helpers.tsx b/x-pack/plugins/cases/public/components/user_action_tree/helpers.tsx
deleted file mode 100644
index ccdc0f8ce888ef..00000000000000
--- a/x-pack/plugins/cases/public/components/user_action_tree/helpers.tsx
+++ /dev/null
@@ -1,411 +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
- * 2.0; you may not use this file except in compliance with the Elastic License
- * 2.0.
- */
-
-import {
- EuiFlexGroup,
- EuiFlexItem,
- EuiIcon,
- EuiLink,
- EuiCommentProps,
- EuiToken,
-} from '@elastic/eui';
-import React, { useContext } from 'react';
-import classNames from 'classnames';
-import { ThemeContext } from 'styled-components';
-import { CaseExternalService, Comment } from '../../../common/ui/types';
-import {
- ActionConnector,
- CaseStatuses,
- CommentType,
- CommentRequestActionsType,
- NONE_CONNECTOR_ID,
- Actions,
- ConnectorUserAction,
- PushedUserAction,
- TagsUserAction,
-} from '../../../common/api';
-import { CaseUserActions } from '../../containers/types';
-import { CaseServices } from '../../containers/use_get_case_user_actions';
-import { Tags } from '../tag_list/tags';
-import { UserActionUsernameWithAvatar } from './user_action_username_with_avatar';
-import { UserActionTimestamp } from './user_action_timestamp';
-import { UserActionCopyLink } from './user_action_copy_link';
-import { ContentWrapper } from './user_action_markdown';
-import { UserActionMoveToReference } from './user_action_move_to_reference';
-import { Status, statuses } from '../status';
-import { UserActionShowAlert } from './user_action_show_alert';
-import * as i18n from './translations';
-import { AlertCommentEvent } from './user_action_alert_comment_event';
-import { CasesNavigation } from '../links';
-import { HostIsolationCommentEvent } from './user_action_host_isolation_comment_event';
-import { MarkdownRenderer } from '../markdown_editor';
-import {
- isCommentUserAction,
- isDescriptionUserAction,
- isStatusUserAction,
- isTagsUserAction,
- isTitleUserAction,
-} from '../../../common/utils/user_actions';
-import { SnakeToCamelCase } from '../../../common/types';
-
-interface LabelTitle {
- action: CaseUserActions;
-}
-
-export type RuleDetailsNavigation = CasesNavigation;
-
-export type ActionsNavigation = CasesNavigation;
-
-const getStatusTitle = (id: string, status: CaseStatuses) => (
-
- {i18n.MARKED_CASE_AS}
-
-
-
-
-);
-
-const isStatusValid = (status: string): status is CaseStatuses =>
- Object.prototype.hasOwnProperty.call(statuses, status);
-
-export const getLabelTitle = ({ action }: LabelTitle) => {
- if (isTagsUserAction(action)) {
- return getTagsLabelTitle(action);
- } else if (isTitleUserAction(action)) {
- return `${i18n.CHANGED_FIELD.toLowerCase()} ${i18n.CASE_NAME.toLowerCase()} ${i18n.TO} "${
- action.payload.title
- }"`;
- } else if (isDescriptionUserAction(action) && action.action === Actions.update) {
- return `${i18n.EDITED_FIELD} ${i18n.DESCRIPTION.toLowerCase()}`;
- } else if (isStatusUserAction(action)) {
- const status = action.payload.status ?? '';
- if (isStatusValid(status)) {
- return getStatusTitle(action.actionId, status);
- }
-
- return '';
- } else if (isCommentUserAction(action) && action.action === Actions.update) {
- return `${i18n.EDITED_FIELD} ${i18n.COMMENT.toLowerCase()}`;
- }
-
- return '';
-};
-
-export const getConnectorLabelTitle = ({
- action,
- connectors,
-}: {
- action: ConnectorUserAction;
- connectors: ActionConnector[];
-}) => {
- const connector = action.payload.connector;
-
- if (connector == null) {
- return '';
- }
-
- // ids are not the same so check and see if the id is a valid connector and then return its name
- // if the connector id is the none connector value then it must have been removed
- const newConnectorActionInfo = connectors.find((c) => c.id === connector.id);
- if (connector.id !== NONE_CONNECTOR_ID && newConnectorActionInfo != null) {
- return i18n.SELECTED_THIRD_PARTY(newConnectorActionInfo.name);
- }
-
- // it wasn't a valid connector or it was the none connector, so it must have been removed
- return i18n.REMOVED_THIRD_PARTY;
-};
-
-const getTagsLabelTitle = (action: TagsUserAction) => {
- const tags = action.payload.tags ?? [];
-
- return (
-
-
- {action.action === Actions.add && i18n.ADDED_FIELD}
- {action.action === Actions.delete && i18n.REMOVED_FIELD} {i18n.TAGS.toLowerCase()}
-
-
-
-
-
- );
-};
-
-export const getPushedServiceLabelTitle = (
- action: SnakeToCamelCase,
- firstPush: boolean
-) => {
- const externalService = action.payload.externalService;
-
- return (
-
-
- {`${firstPush ? i18n.PUSHED_NEW_INCIDENT : i18n.UPDATE_INCIDENT} ${
- externalService?.connectorName
- }`}
-
-
-
- {externalService?.externalTitle}
-
-
-
- );
-};
-
-export const getPushInfo = (
- caseServices: CaseServices,
- externalService: CaseExternalService | undefined,
- index: number
-) =>
- externalService != null && externalService.connectorId !== NONE_CONNECTOR_ID
- ? {
- firstPush: caseServices[externalService.connectorId]?.firstPushIndex === index,
- parsedConnectorId: externalService.connectorId,
- parsedConnectorName: externalService.connectorName,
- }
- : {
- firstPush: false,
- parsedConnectorId: NONE_CONNECTOR_ID,
- parsedConnectorName: NONE_CONNECTOR_ID,
- };
-
-const getUpdateActionIcon = (fields: string): string => {
- if (fields === 'tags') {
- return 'tag';
- } else if (fields === 'status') {
- return 'folderClosed';
- }
-
- return 'dot';
-};
-
-export const getUpdateAction = ({
- action,
- label,
- handleOutlineComment,
-}: {
- action: CaseUserActions;
- label: string | JSX.Element;
- handleOutlineComment: (id: string) => void;
-}): EuiCommentProps => ({
- username: (
-
- ),
- type: 'update',
- event: label,
- 'data-test-subj': `${action.type}-${action.action}-action-${action.actionId}`,
- timestamp: ,
- timelineIcon: getUpdateActionIcon(action.type),
- actions: (
-
-
-
-
- {action.action === Actions.update && action.commentId != null && (
-
-
-
- )}
-
- ),
-});
-
-export const getAlertAttachment = ({
- action,
- alertId,
- getRuleDetailsHref,
- index,
- loadingAlertData,
- onRuleDetailsClick,
- onShowAlertDetails,
- ruleId,
- ruleName,
-}: {
- action: CaseUserActions;
- alertId: string;
- getRuleDetailsHref: RuleDetailsNavigation['href'];
- index: string;
- loadingAlertData: boolean;
- onRuleDetailsClick?: RuleDetailsNavigation['onClick'];
- onShowAlertDetails: (alertId: string, index: string) => void;
- ruleId?: string | null;
- ruleName?: string | null;
-}): EuiCommentProps => ({
- username: (
-
- ),
- className: 'comment-alert',
- type: 'update',
- event: (
-
- ),
- 'data-test-subj': `${action.type}-${action.action}-action-${action.actionId}`,
- timestamp: ,
- timelineIcon: 'bell',
- actions: (
-
-
-
-
-
-
-
-
- ),
-});
-
-export const getGeneratedAlertsAttachment = ({
- action,
- alertIds,
- getRuleDetailsHref,
- onRuleDetailsClick,
- renderInvestigateInTimelineActionComponent,
- ruleId,
- ruleName,
-}: {
- action: CaseUserActions;
- alertIds: string[];
- getRuleDetailsHref: RuleDetailsNavigation['href'];
- onRuleDetailsClick?: RuleDetailsNavigation['onClick'];
- renderInvestigateInTimelineActionComponent?: (alertIds: string[]) => JSX.Element;
- ruleId: string;
- ruleName: string;
-}): EuiCommentProps => ({
- username: ,
- className: 'comment-alert',
- type: 'update',
- event: (
-
- ),
- 'data-test-subj': `${action.type}-${action.action}-action-${action.actionId}`,
- timestamp: ,
- timelineIcon: 'bell',
- actions: (
-
-
-
-
- {renderInvestigateInTimelineActionComponent ? (
-
- {renderInvestigateInTimelineActionComponent(alertIds)}
-
- ) : null}
-
- ),
-});
-
-const ActionIcon = React.memo<{
- actionType: string;
-}>(({ actionType }) => {
- const theme = useContext(ThemeContext);
- return (
-
- );
-});
-
-ActionIcon.displayName = 'ActionIcon';
-
-export const getActionAttachment = ({
- comment,
- userCanCrud,
- isLoadingIds,
- actionsNavigation,
- action,
-}: {
- comment: Comment & CommentRequestActionsType;
- userCanCrud: boolean;
- isLoadingIds: string[];
- actionsNavigation?: ActionsNavigation;
- action: CaseUserActions;
-}): EuiCommentProps => ({
- username: (
-
- ),
- className: classNames('comment-action', { 'empty-comment': comment.comment.trim().length === 0 }),
- event: (
-
- ),
- 'data-test-subj': 'endpoint-action',
- timestamp: ,
- timelineIcon: ,
- actions: ,
- children: comment.comment.trim().length > 0 && (
-
- {comment.comment}
-
- ),
-});
-
-interface Signal {
- rule: {
- id: string;
- name: string;
- to: string;
- from: string;
- };
-}
-
-export interface Alert {
- _id: string;
- _index: string;
- '@timestamp': string;
- signal: Signal;
- [key: string]: unknown;
-}
diff --git a/x-pack/plugins/cases/public/components/user_action_tree/index.tsx b/x-pack/plugins/cases/public/components/user_action_tree/index.tsx
deleted file mode 100644
index d4270b464773c0..00000000000000
--- a/x-pack/plugins/cases/public/components/user_action_tree/index.tsx
+++ /dev/null
@@ -1,689 +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
- * 2.0; you may not use this file except in compliance with the Elastic License
- * 2.0.
- */
-
-import {
- EuiFlexGroup,
- EuiFlexItem,
- EuiLoadingSpinner,
- EuiCommentList,
- EuiCommentProps,
-} from '@elastic/eui';
-import { ALERT_RULE_NAME, ALERT_RULE_UUID } from '@kbn/rule-data-utils';
-
-import classNames from 'classnames';
-import { get, isEmpty } from 'lodash';
-import React, { useCallback, useMemo, useRef, useState, useEffect } from 'react';
-import styled from 'styled-components';
-import { isRight } from 'fp-ts/Either';
-
-import * as i18n from './translations';
-
-import { useUpdateComment } from '../../containers/use_update_comment';
-import { useCurrentUser } from '../../common/lib/kibana';
-import { AddComment, AddCommentRefObject } from '../add_comment';
-import { Case, CaseUserActions, Ecs } from '../../../common/ui/types';
-import {
- ActionConnector,
- Actions,
- ActionsCommentRequestRt,
- AlertCommentRequestRt,
- CommentType,
- ContextTypeUserRt,
-} from '../../../common/api';
-import { CaseServices } from '../../containers/use_get_case_user_actions';
-import {
- getConnectorLabelTitle,
- getLabelTitle,
- getPushedServiceLabelTitle,
- getPushInfo,
- getUpdateAction,
- getAlertAttachment,
- getGeneratedAlertsAttachment,
- RuleDetailsNavigation,
- ActionsNavigation,
- getActionAttachment,
-} from './helpers';
-import { UserActionAvatar } from './user_action_avatar';
-import { UserActionMarkdown, UserActionMarkdownRefObject } from './user_action_markdown';
-import { UserActionTimestamp } from './user_action_timestamp';
-import { UserActionUsername } from './user_action_username';
-import { UserActionContentToolbar } from './user_action_content_toolbar';
-import { getManualAlertIdsWithNoRuleId } from '../case_view/helpers';
-import { useLensDraftComment } from '../markdown_editor/plugins/lens/use_lens_draft_comment';
-import { useCaseViewParams } from '../../common/navigation';
-import { isConnectorUserAction, isPushedUserAction } from '../../../common/utils/user_actions';
-import type { OnUpdateFields } from '../case_view/types';
-
-export interface UserActionTreeProps {
- caseServices: CaseServices;
- caseUserActions: CaseUserActions[];
- connectors: ActionConnector[];
- data: Case;
- fetchUserActions: () => void;
- getRuleDetailsHref?: RuleDetailsNavigation['href'];
- actionsNavigation?: ActionsNavigation;
- isLoadingDescription: boolean;
- isLoadingUserActions: boolean;
- onRuleDetailsClick?: RuleDetailsNavigation['onClick'];
- onShowAlertDetails: (alertId: string, index: string) => void;
- onUpdateField: ({ key, value, onSuccess, onError }: OnUpdateFields) => void;
- renderInvestigateInTimelineActionComponent?: (alertIds: string[]) => JSX.Element;
- statusActionButton: JSX.Element | null;
- updateCase: (newCase: Case) => void;
- useFetchAlertData: (alertIds: string[]) => [boolean, Record];
- userCanCrud: boolean;
-}
-
-const MyEuiFlexGroup = styled(EuiFlexGroup)`
- margin-bottom: 8px;
-`;
-
-const MyEuiCommentList = styled(EuiCommentList)`
- ${({ theme }) => `
- & .userAction__comment.outlined .euiCommentEvent {
- outline: solid 5px ${theme.eui.euiColorVis1_behindText};
- margin: 0.5em;
- transition: 0.8s;
- }
-
- & .euiComment.isEdit {
- & .euiCommentEvent {
- border: none;
- box-shadow: none;
- }
-
- & .euiCommentEvent__body {
- padding: 0;
- }
-
- & .euiCommentEvent__header {
- display: none;
- }
- }
-
- & .comment-alert .euiCommentEvent {
- background-color: ${theme.eui.euiColorLightestShade};
- border: ${theme.eui.euiFlyoutBorder};
- padding: ${theme.eui.paddingSizes.s};
- border-radius: ${theme.eui.paddingSizes.xs};
- }
-
- & .comment-alert .euiCommentEvent__headerData {
- flex-grow: 1;
- }
-
- & .comment-action.empty-comment .euiCommentEvent--regular {
- box-shadow: none;
- .euiCommentEvent__header {
- padding: ${theme.eui.euiSizeM} ${theme.eui.paddingSizes.s};
- border-bottom: 0;
- }
- }
- `}
-`;
-
-const DESCRIPTION_ID = 'description';
-const NEW_ID = 'newComment';
-
-const isAddCommentRef = (
- ref: AddCommentRefObject | UserActionMarkdownRefObject | null | undefined
-): ref is AddCommentRefObject => {
- const commentRef = ref as AddCommentRefObject;
- if (commentRef?.addQuote != null) {
- return true;
- }
-
- return false;
-};
-
-export const UserActionTree = React.memo(
- ({
- caseServices,
- caseUserActions,
- connectors,
- data: caseData,
- fetchUserActions,
- getRuleDetailsHref,
- actionsNavigation,
- isLoadingDescription,
- isLoadingUserActions,
- onRuleDetailsClick,
- onShowAlertDetails,
- onUpdateField,
- renderInvestigateInTimelineActionComponent,
- statusActionButton,
- updateCase,
- useFetchAlertData,
- userCanCrud,
- }: UserActionTreeProps) => {
- const { detailName: caseId, subCaseId, commentId } = useCaseViewParams();
- const handlerTimeoutId = useRef(0);
- const [initLoading, setInitLoading] = useState(true);
- const [selectedOutlineCommentId, setSelectedOutlineCommentId] = useState('');
- const { isLoadingIds, patchComment } = useUpdateComment();
- const currentUser = useCurrentUser();
- const [manageMarkdownEditIds, setManageMarkdownEditIds] = useState([]);
- const commentRefs = useRef<
- Record
- >({});
- const { clearDraftComment, draftComment, hasIncomingLensState, openLensModal } =
- useLensDraftComment();
-
- const [loadingAlertData, manualAlertsData] = useFetchAlertData(
- getManualAlertIdsWithNoRuleId(caseData.comments)
- );
-
- const handleManageMarkdownEditId = useCallback(
- (id: string) => {
- clearDraftComment();
- setManageMarkdownEditIds((prevManageMarkdownEditIds) =>
- !prevManageMarkdownEditIds.includes(id)
- ? prevManageMarkdownEditIds.concat(id)
- : prevManageMarkdownEditIds.filter((myId) => id !== myId)
- );
- },
- [clearDraftComment]
- );
-
- const handleSaveComment = useCallback(
- ({ id, version }: { id: string; version: string }, content: string) => {
- patchComment({
- caseId,
- commentId: id,
- commentUpdate: content,
- fetchUserActions,
- version,
- updateCase,
- subCaseId,
- });
- },
- [caseId, fetchUserActions, patchComment, subCaseId, updateCase]
- );
-
- const handleOutlineComment = useCallback(
- (id: string) => {
- const moveToTarget = document.getElementById(`${id}-permLink`);
- if (moveToTarget != null) {
- const yOffset = -60;
- const y = moveToTarget.getBoundingClientRect().top + window.pageYOffset + yOffset;
- window.scrollTo({
- top: y,
- behavior: 'smooth',
- });
- if (id === 'add-comment') {
- moveToTarget.getElementsByTagName('textarea')[0].focus();
- }
- }
- window.clearTimeout(handlerTimeoutId.current);
- setSelectedOutlineCommentId(id);
- handlerTimeoutId.current = window.setTimeout(() => {
- setSelectedOutlineCommentId('');
- window.clearTimeout(handlerTimeoutId.current);
- }, 2400);
- },
- [handlerTimeoutId]
- );
-
- const handleManageQuote = useCallback(
- (quote: string) => {
- const ref = commentRefs?.current[NEW_ID];
- if (isAddCommentRef(ref)) {
- ref.addQuote(quote);
- }
-
- handleOutlineComment('add-comment');
- },
- [handleOutlineComment]
- );
-
- const handleUpdate = useCallback(
- (newCase: Case) => {
- updateCase(newCase);
- fetchUserActions();
- },
- [fetchUserActions, updateCase]
- );
-
- const MarkdownDescription = useMemo(
- () => (
- (commentRefs.current[DESCRIPTION_ID] = element)}
- id={DESCRIPTION_ID}
- content={caseData.description}
- isEditable={manageMarkdownEditIds.includes(DESCRIPTION_ID)}
- onSaveContent={(content: string) => {
- onUpdateField({ key: DESCRIPTION_ID, value: content });
- }}
- onChangeEditable={handleManageMarkdownEditId}
- />
- ),
- [caseData.description, handleManageMarkdownEditId, manageMarkdownEditIds, onUpdateField]
- );
-
- const MarkdownNewComment = useMemo(
- () => (
- (commentRefs.current[NEW_ID] = element)}
- onCommentPosted={handleUpdate}
- onCommentSaving={handleManageMarkdownEditId.bind(null, NEW_ID)}
- showLoading={false}
- statusActionButton={statusActionButton}
- subCaseId={subCaseId}
- />
- ),
- [caseId, userCanCrud, handleUpdate, handleManageMarkdownEditId, statusActionButton, subCaseId]
- );
-
- useEffect(() => {
- if (initLoading && !isLoadingUserActions && isLoadingIds.length === 0) {
- setInitLoading(false);
- if (commentId != null) {
- handleOutlineComment(commentId);
- }
- }
- }, [commentId, initLoading, isLoadingUserActions, isLoadingIds, handleOutlineComment]);
-
- const descriptionCommentListObj: EuiCommentProps = useMemo(
- () => ({
- username: (
-
- ),
- event: i18n.ADDED_DESCRIPTION,
- 'data-test-subj': 'description-action',
- timestamp: ,
- children: MarkdownDescription,
- timelineIcon: (
-
- ),
- className: classNames({
- isEdit: manageMarkdownEditIds.includes(DESCRIPTION_ID),
- }),
- actions: (
-
- ),
- }),
- [
- MarkdownDescription,
- caseData,
- handleManageMarkdownEditId,
- handleManageQuote,
- isLoadingDescription,
- userCanCrud,
- manageMarkdownEditIds,
- ]
- );
-
- const userActions: EuiCommentProps[] = useMemo(
- () =>
- caseUserActions.reduce(
- // TODO: Decrease complexity. https://github.com/elastic/kibana/issues/115730
- // eslint-disable-next-line complexity
- (comments, action, index) => {
- // Comment creation
- if (action.commentId != null && action.action === Actions.create) {
- const comment = caseData.comments.find((c) => c.id === action.commentId);
- if (
- comment != null &&
- isRight(ContextTypeUserRt.decode(comment)) &&
- comment.type === CommentType.user
- ) {
- return [
- ...comments,
- {
- username: (
-
- ),
- 'data-test-subj': `comment-create-action-${comment.id}`,
- timestamp: (
-
- ),
- className: classNames('userAction__comment', {
- outlined: comment.id === selectedOutlineCommentId,
- isEdit: manageMarkdownEditIds.includes(comment.id),
- }),
- children: (
- (commentRefs.current[comment.id] = element)}
- id={comment.id}
- content={comment.comment}
- isEditable={manageMarkdownEditIds.includes(comment.id)}
- onChangeEditable={handleManageMarkdownEditId}
- onSaveContent={handleSaveComment.bind(null, {
- id: comment.id,
- version: comment.version,
- })}
- />
- ),
- timelineIcon: (
-
- ),
- actions: (
-
- ),
- },
- ];
- } else if (
- comment != null &&
- isRight(AlertCommentRequestRt.decode(comment)) &&
- comment.type === CommentType.alert
- ) {
- // TODO: clean this up
- const alertId = Array.isArray(comment.alertId)
- ? comment.alertId.length > 0
- ? comment.alertId[0]
- : ''
- : comment.alertId;
-
- const alertIndex = Array.isArray(comment.index)
- ? comment.index.length > 0
- ? comment.index[0]
- : ''
- : comment.index;
-
- if (isEmpty(alertId)) {
- return comments;
- }
-
- const ruleId =
- comment?.rule?.id ??
- manualAlertsData[alertId]?.signal?.rule?.id?.[0] ??
- get(manualAlertsData[alertId], ALERT_RULE_UUID)[0] ??
- null;
- const ruleName =
- comment?.rule?.name ??
- manualAlertsData[alertId]?.signal?.rule?.name?.[0] ??
- get(manualAlertsData[alertId], ALERT_RULE_NAME)[0] ??
- null;
-
- return [
- ...comments,
- ...(getRuleDetailsHref != null
- ? [
- getAlertAttachment({
- action,
- alertId,
- getRuleDetailsHref,
- index: alertIndex,
- loadingAlertData,
- onRuleDetailsClick,
- ruleId,
- ruleName,
- onShowAlertDetails,
- }),
- ]
- : []),
- ];
- } else if (comment != null && comment.type === CommentType.generatedAlert) {
- // TODO: clean this up
- const alertIds = Array.isArray(comment.alertId)
- ? comment.alertId
- : [comment.alertId];
-
- if (isEmpty(alertIds)) {
- return comments;
- }
-
- return [
- ...comments,
- ...(getRuleDetailsHref != null
- ? [
- getGeneratedAlertsAttachment({
- action,
- alertIds,
- getRuleDetailsHref,
- onRuleDetailsClick,
- renderInvestigateInTimelineActionComponent,
- ruleId: comment.rule?.id ?? '',
- ruleName: comment.rule?.name ?? i18n.UNKNOWN_RULE,
- }),
- ]
- : []),
- ];
- } else if (
- comment != null &&
- isRight(ActionsCommentRequestRt.decode(comment)) &&
- comment.type === CommentType.actions
- ) {
- return [
- ...comments,
- ...(comment.actions !== null
- ? [
- getActionAttachment({
- comment,
- userCanCrud,
- isLoadingIds,
- actionsNavigation,
- action,
- }),
- ]
- : []),
- ];
- }
- }
-
- // Connectors
- if (isConnectorUserAction(action)) {
- const label = getConnectorLabelTitle({ action, connectors });
- return [
- ...comments,
- getUpdateAction({
- action,
- label,
- handleOutlineComment,
- }),
- ];
- }
-
- // Pushed information
- if (isPushedUserAction<'camelCase'>(action)) {
- const parsedExternalService = action.payload.externalService;
-
- const { firstPush, parsedConnectorId, parsedConnectorName } = getPushInfo(
- caseServices,
- parsedExternalService,
- index
- );
-
- const label = getPushedServiceLabelTitle(action, firstPush);
-
- const showTopFooter =
- action.action === Actions.push_to_service &&
- index === caseServices[parsedConnectorId]?.lastPushIndex;
-
- const showBottomFooter =
- action.action === Actions.push_to_service &&
- index === caseServices[parsedConnectorId]?.lastPushIndex &&
- caseServices[parsedConnectorId].hasDataToPush;
-
- let footers: EuiCommentProps[] = [];
-
- if (showTopFooter) {
- footers = [
- ...footers,
- {
- username: '',
- type: 'update',
- event: i18n.ALREADY_PUSHED_TO_SERVICE(`${parsedConnectorName}`),
- timelineIcon: 'sortUp',
- 'data-test-subj': 'top-footer',
- },
- ];
- }
-
- if (showBottomFooter) {
- footers = [
- ...footers,
- {
- username: '',
- type: 'update',
- event: i18n.REQUIRED_UPDATE_TO_SERVICE(`${parsedConnectorName}`),
- timelineIcon: 'sortDown',
- 'data-test-subj': 'bottom-footer',
- },
- ];
- }
-
- return [
- ...comments,
- getUpdateAction({
- action,
- label,
- handleOutlineComment,
- }),
- ...footers,
- ];
- }
-
- // title, description, comment updates, tags
- if (['title', 'description', 'comment', 'tags', 'status'].includes(action.type)) {
- const label: string | JSX.Element = getLabelTitle({
- action,
- });
-
- return [
- ...comments,
- getUpdateAction({
- action,
- label,
- handleOutlineComment,
- }),
- ];
- }
-
- return comments;
- },
- [descriptionCommentListObj]
- ),
- [
- caseUserActions,
- descriptionCommentListObj,
- caseData.comments,
- selectedOutlineCommentId,
- manageMarkdownEditIds,
- handleManageMarkdownEditId,
- handleSaveComment,
- actionsNavigation,
- userCanCrud,
- isLoadingIds,
- handleManageQuote,
- manualAlertsData,
- getRuleDetailsHref,
- loadingAlertData,
- onRuleDetailsClick,
- onShowAlertDetails,
- renderInvestigateInTimelineActionComponent,
- connectors,
- handleOutlineComment,
- caseServices,
- ]
- );
-
- const bottomActions = userCanCrud
- ? [
- {
- username: (
-
- ),
- 'data-test-subj': 'add-comment',
- timelineIcon: (
-
- ),
- className: 'isEdit',
- children: MarkdownNewComment,
- },
- ]
- : [];
-
- const comments = [...userActions, ...bottomActions];
-
- useEffect(() => {
- if (draftComment?.commentId) {
- setManageMarkdownEditIds((prevManageMarkdownEditIds) => {
- if (
- ![NEW_ID].includes(draftComment?.commentId) &&
- !prevManageMarkdownEditIds.includes(draftComment?.commentId)
- ) {
- return [draftComment?.commentId];
- }
- return prevManageMarkdownEditIds;
- });
-
- const ref = commentRefs?.current?.[draftComment.commentId];
-
- if (isAddCommentRef(ref) && ref.editor?.textarea) {
- ref.setComment(draftComment.comment);
- if (hasIncomingLensState) {
- openLensModal({ editorRef: ref.editor });
- } else {
- clearDraftComment();
- }
- }
- }
- }, [
- draftComment,
- openLensModal,
- commentRefs,
- hasIncomingLensState,
- clearDraftComment,
- manageMarkdownEditIds,
- ]);
-
- return (
- <>
-
- {(isLoadingUserActions || isLoadingIds.includes(NEW_ID)) && (
-
-
-
-
-
- )}
-
- );
- }
-);
-
-UserActionTree.displayName = 'UserActionTree';
diff --git a/x-pack/plugins/cases/public/components/user_action_tree/user_action_markdown.tsx b/x-pack/plugins/cases/public/components/user_action_tree/user_action_markdown.tsx
deleted file mode 100644
index 692fbbb318b22b..00000000000000
--- a/x-pack/plugins/cases/public/components/user_action_tree/user_action_markdown.tsx
+++ /dev/null
@@ -1,121 +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
- * 2.0; you may not use this file except in compliance with the Elastic License
- * 2.0.
- */
-
-import { EuiFlexGroup, EuiFlexItem, EuiButtonEmpty, EuiButton } from '@elastic/eui';
-import React, { forwardRef, useCallback, useImperativeHandle, useMemo, useRef } from 'react';
-import styled from 'styled-components';
-
-import * as i18n from '../case_view/translations';
-import { Form, useForm, UseField } from '../../common/shared_imports';
-import { schema, Content } from './schema';
-import { MarkdownRenderer, MarkdownEditorForm } from '../markdown_editor';
-
-export const ContentWrapper = styled.div`
- padding: ${({ theme }) => `${theme.eui.euiSizeM} ${theme.eui.euiSizeL}`};
-`;
-
-interface UserActionMarkdownProps {
- content: string;
- id: string;
- isEditable: boolean;
- onChangeEditable: (id: string) => void;
- onSaveContent: (content: string) => void;
-}
-
-export interface UserActionMarkdownRefObject {
- setComment: (newComment: string) => void;
-}
-
-export const UserActionMarkdown = forwardRef(
- ({ id, content, isEditable, onChangeEditable, onSaveContent }, ref) => {
- const editorRef = useRef();
- const initialState = { content };
- const { form } = useForm({
- defaultValue: initialState,
- options: { stripEmptyFields: false },
- schema,
- });
-
- const fieldName = 'content';
- const { setFieldValue, submit } = form;
-
- const handleCancelAction = useCallback(() => {
- onChangeEditable(id);
- }, [id, onChangeEditable]);
-
- const handleSaveAction = useCallback(async () => {
- const { isValid, data } = await submit();
-
- if (isValid && data.content !== content) {
- onSaveContent(data.content);
- }
- onChangeEditable(id);
- }, [content, id, onChangeEditable, onSaveContent, submit]);
-
- const setComment = useCallback(
- (newComment) => {
- setFieldValue(fieldName, newComment);
- },
- [setFieldValue]
- );
-
- const EditorButtons = useMemo(
- () => (
-
-
-
- {i18n.CANCEL}
-
-
-
-
- {i18n.SAVE}
-
-
-
- ),
- [handleCancelAction, handleSaveAction]
- );
-
- useImperativeHandle(ref, () => ({
- setComment,
- editor: editorRef.current,
- }));
-
- return isEditable ? (
-
- ) : (
-
- {content}
-
- );
- }
-);
diff --git a/x-pack/plugins/cases/public/components/user_action_tree/user_action_avatar.test.tsx b/x-pack/plugins/cases/public/components/user_actions/avatar.test.tsx
similarity index 96%
rename from x-pack/plugins/cases/public/components/user_action_tree/user_action_avatar.test.tsx
rename to x-pack/plugins/cases/public/components/user_actions/avatar.test.tsx
index 1df780db3bdaa1..aeda9196cc58ae 100644
--- a/x-pack/plugins/cases/public/components/user_action_tree/user_action_avatar.test.tsx
+++ b/x-pack/plugins/cases/public/components/user_actions/avatar.test.tsx
@@ -7,7 +7,7 @@
import React from 'react';
import { mount, ReactWrapper } from 'enzyme';
-import { UserActionAvatar } from './user_action_avatar';
+import { UserActionAvatar } from './avatar';
const props = {
username: 'elastic',
diff --git a/x-pack/plugins/cases/public/components/user_action_tree/user_action_avatar.tsx b/x-pack/plugins/cases/public/components/user_actions/avatar.tsx
similarity index 74%
rename from x-pack/plugins/cases/public/components/user_action_tree/user_action_avatar.tsx
rename to x-pack/plugins/cases/public/components/user_actions/avatar.tsx
index 80b048618bfc40..da43a122f38686 100644
--- a/x-pack/plugins/cases/public/components/user_action_tree/user_action_avatar.tsx
+++ b/x-pack/plugins/cases/public/components/user_actions/avatar.tsx
@@ -6,19 +6,19 @@
*/
import React, { memo } from 'react';
-import { EuiAvatar } from '@elastic/eui';
+import { EuiAvatar, EuiAvatarProps } from '@elastic/eui';
import * as i18n from './translations';
interface UserActionAvatarProps {
username?: string | null;
fullName?: string | null;
+ size?: EuiAvatarProps['size'];
}
-const UserActionAvatarComponent = ({ username, fullName }: UserActionAvatarProps) => {
+const UserActionAvatarComponent = ({ username, fullName, size = 'm' }: UserActionAvatarProps) => {
const avatarName = fullName && fullName.length > 0 ? fullName : username ?? i18n.UNKNOWN;
-
- return ;
+ return ;
};
export const UserActionAvatar = memo(UserActionAvatarComponent);
diff --git a/x-pack/plugins/cases/public/components/user_action_tree/user_action_username_with_avatar.test.tsx b/x-pack/plugins/cases/public/components/user_actions/avatar_username.test.tsx
similarity index 69%
rename from x-pack/plugins/cases/public/components/user_action_tree/user_action_username_with_avatar.test.tsx
rename to x-pack/plugins/cases/public/components/user_actions/avatar_username.test.tsx
index 3b6c9560171201..776fa3325478af 100644
--- a/x-pack/plugins/cases/public/components/user_action_tree/user_action_username_with_avatar.test.tsx
+++ b/x-pack/plugins/cases/public/components/user_actions/avatar_username.test.tsx
@@ -7,7 +7,7 @@
import React from 'react';
import { mount, ReactWrapper } from 'enzyme';
-import { UserActionUsernameWithAvatar } from './user_action_username_with_avatar';
+import { UserActionUsernameWithAvatar } from './avatar_username';
const props = {
username: 'elastic',
@@ -25,19 +25,15 @@ describe('UserActionUsernameWithAvatar ', () => {
expect(
wrapper.find('[data-test-subj="user-action-username-with-avatar"]').first().exists()
).toBeTruthy();
- expect(
- wrapper.find('[data-test-subj="user-action-username-avatar"]').first().exists()
- ).toBeTruthy();
+ expect(wrapper.find('[data-test-subj="user-action-avatar"]').first().exists()).toBeTruthy();
});
it('it shows the avatar', async () => {
- expect(wrapper.find('[data-test-subj="user-action-username-avatar"]').first().text()).toBe('E');
+ expect(wrapper.find('[data-test-subj="user-action-avatar"]').first().text()).toBe('E');
});
it('it shows the avatar without fullName', async () => {
const newWrapper = mount();
- expect(newWrapper.find('[data-test-subj="user-action-username-avatar"]').first().text()).toBe(
- 'e'
- );
+ expect(newWrapper.find('[data-test-subj="user-action-avatar"]').first().text()).toBe('e');
});
});
diff --git a/x-pack/plugins/cases/public/components/user_action_tree/user_action_username_with_avatar.tsx b/x-pack/plugins/cases/public/components/user_actions/avatar_username.tsx
similarity index 71%
rename from x-pack/plugins/cases/public/components/user_action_tree/user_action_username_with_avatar.tsx
rename to x-pack/plugins/cases/public/components/user_actions/avatar_username.tsx
index 685adc8724e87a..581ebb7272d347 100644
--- a/x-pack/plugins/cases/public/components/user_action_tree/user_action_username_with_avatar.tsx
+++ b/x-pack/plugins/cases/public/components/user_actions/avatar_username.tsx
@@ -6,11 +6,10 @@
*/
import React, { memo } from 'react';
-import { EuiFlexGroup, EuiFlexItem, EuiAvatar } from '@elastic/eui';
-import { isEmpty } from 'lodash/fp';
+import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
-import { UserActionUsername } from './user_action_username';
-import * as i18n from './translations';
+import { UserActionAvatar } from './avatar';
+import { UserActionUsername } from './username';
interface UserActionUsernameWithAvatarProps {
username?: string | null;
@@ -28,11 +27,7 @@ const UserActionUsernameWithAvatarComponent = ({
data-test-subj="user-action-username-with-avatar"
>
-
+
diff --git a/x-pack/plugins/cases/public/components/user_actions/builder.tsx b/x-pack/plugins/cases/public/components/user_actions/builder.tsx
new file mode 100644
index 00000000000000..92f1dd6c123da6
--- /dev/null
+++ b/x-pack/plugins/cases/public/components/user_actions/builder.tsx
@@ -0,0 +1,25 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { createCommentUserActionBuilder } from './comment/comment';
+import { createConnectorUserActionBuilder } from './connector';
+import { createDescriptionUserActionBuilder } from './description';
+import { createPushedUserActionBuilder } from './pushed';
+import { createStatusUserActionBuilder } from './status';
+import { createTagsUserActionBuilder } from './tags';
+import { createTitleUserActionBuilder } from './title';
+import { UserActionBuilderMap } from './types';
+
+export const builderMap: UserActionBuilderMap = {
+ connector: createConnectorUserActionBuilder,
+ tags: createTagsUserActionBuilder,
+ title: createTitleUserActionBuilder,
+ status: createStatusUserActionBuilder,
+ pushed: createPushedUserActionBuilder,
+ comment: createCommentUserActionBuilder,
+ description: createDescriptionUserActionBuilder,
+};
diff --git a/x-pack/plugins/cases/public/components/user_actions/comment/actions.tsx b/x-pack/plugins/cases/public/components/user_actions/comment/actions.tsx
new file mode 100644
index 00000000000000..4dc189c14c74fa
--- /dev/null
+++ b/x-pack/plugins/cases/public/components/user_actions/comment/actions.tsx
@@ -0,0 +1,82 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React, { useContext } from 'react';
+import classNames from 'classnames';
+import { ThemeContext } from 'styled-components';
+
+import { EuiToken } from '@elastic/eui';
+import { CommentResponseActionsType } from '../../../../common/api';
+import { UserActionBuilder, UserActionBuilderArgs } from '../types';
+import { UserActionTimestamp } from '../timestamp';
+import { SnakeToCamelCase } from '../../../../common/types';
+import { UserActionUsernameWithAvatar } from '../avatar_username';
+import { UserActionCopyLink } from '../copy_link';
+import { MarkdownRenderer } from '../../markdown_editor';
+import { ContentWrapper } from '../markdown_form';
+import { HostIsolationCommentEvent } from './host_isolation_event';
+
+type BuilderArgs = Pick & {
+ comment: SnakeToCamelCase;
+};
+
+export const createActionAttachmentUserActionBuilder = ({
+ userAction,
+ comment,
+ actionsNavigation,
+}: BuilderArgs): ReturnType => ({
+ build: () => {
+ return [
+ {
+ username: (
+
+ ),
+ className: classNames('comment-action', {
+ 'empty-comment': comment.comment.trim().length === 0,
+ }),
+ event: (
+
+ ),
+ 'data-test-subj': 'endpoint-action',
+ timestamp: ,
+ timelineIcon: ,
+ actions: ,
+ children: comment.comment.trim().length > 0 && (
+
+ {comment.comment}
+
+ ),
+ },
+ ];
+ },
+});
+
+const ActionIcon = React.memo<{
+ actionType: string;
+}>(({ actionType }) => {
+ const theme = useContext(ThemeContext);
+ return (
+
+ );
+});
+
+ActionIcon.displayName = 'ActionIcon';
diff --git a/x-pack/plugins/cases/public/components/user_actions/comment/alert.tsx b/x-pack/plugins/cases/public/components/user_actions/comment/alert.tsx
new file mode 100644
index 00000000000000..0341af259e4022
--- /dev/null
+++ b/x-pack/plugins/cases/public/components/user_actions/comment/alert.tsx
@@ -0,0 +1,106 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React from 'react';
+import { get, isEmpty } from 'lodash';
+import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
+import { ALERT_RULE_NAME, ALERT_RULE_UUID } from '@kbn/rule-data-utils';
+
+import { CommentType, CommentResponseAlertsType } from '../../../../common/api';
+import { UserActionBuilder, UserActionBuilderArgs } from '../types';
+import { UserActionTimestamp } from '../timestamp';
+import { SnakeToCamelCase } from '../../../../common/types';
+import { UserActionUsernameWithAvatar } from '../avatar_username';
+import { AlertCommentEvent } from './alert_event';
+import { UserActionCopyLink } from '../copy_link';
+import { UserActionShowAlert } from './show_alert';
+
+type BuilderArgs = Pick<
+ UserActionBuilderArgs,
+ | 'userAction'
+ | 'alertData'
+ | 'getRuleDetailsHref'
+ | 'onRuleDetailsClick'
+ | 'loadingAlertData'
+ | 'onShowAlertDetails'
+> & { comment: SnakeToCamelCase };
+
+const getFirstItem = (items: string | string[]) =>
+ Array.isArray(items) ? (items.length > 0 ? items[0] : '') : items;
+
+export const createAlertAttachmentUserActionBuilder = ({
+ userAction,
+ comment,
+ alertData,
+ getRuleDetailsHref,
+ loadingAlertData,
+ onRuleDetailsClick,
+ onShowAlertDetails,
+}: BuilderArgs): ReturnType => ({
+ build: () => {
+ const alertId = getFirstItem(comment.alertId);
+ const alertIndex = getFirstItem(comment.index);
+
+ if (isEmpty(alertId)) {
+ return [];
+ }
+
+ const ruleId =
+ comment?.rule?.id ??
+ alertData[alertId]?.signal?.rule?.id?.[0] ??
+ get(alertData[alertId], ALERT_RULE_UUID)[0] ??
+ null;
+
+ const ruleName =
+ comment?.rule?.name ??
+ alertData[alertId]?.signal?.rule?.name?.[0] ??
+ get(alertData[alertId], ALERT_RULE_NAME)[0] ??
+ null;
+
+ return [
+ {
+ username: (
+
+ ),
+ className: 'comment-alert',
+ type: 'update',
+ event: (
+
+ ),
+ 'data-test-subj': `user-action-alert-${userAction.type}-${userAction.action}-action-${userAction.actionId}`,
+ timestamp: ,
+ timelineIcon: 'bell',
+ actions: (
+
+
+