From b83b4951ca01196de9bde763edc1c3e5d719c081 Mon Sep 17 00:00:00 2001 From: Marco Antonio Ghiani Date: Mon, 20 Nov 2023 16:39:42 +0100 Subject: [PATCH] [ObsInfra][APM] Extract agent utils and custom icons (#170968) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## ๐Ÿ““ Summary Closes #170728 This work comes from the need to use agent and cloud provider icons in the new Log Detail flyout. Since those icons were already used across the `infra` and `apm` plugins, this was a good opportunity to extract the shared logic into packages. The results of this refactoring are two new packages: - **@kbn/elastic-agent-utils**: exports small utilities and type definition used to parse the icon to render and exploits also across the APM plugin. - **@kbn/custom-icons**: exports custom icons built on top of EuiIcon, encapsulating logic related to mapping from data to the relative icon. Apart from creating the new plugins, this also applies their usage to the `infra` and `apm` plugins, while the Log Explorer flyout will benefit from these working on https://github.com/elastic/kibana/issues/170721. ## ๐Ÿงช How to test ### Infra - Navigate to `Infrastructure -> Hosts` - Verify the hosts table correctly renders the cloud provider icon for each table entry. ### APM - Navigate to `APM -> Services`. - Verify each table entry correctly displays the related agent icon. - Navigate to `APM -> Services`. - Click on a service where t a cloud provider icon is expected to appear next to the service name. - Verify the icon is correctly displayed. - Navigate to `APM -> Services -> Service Map`. - Create a new group. - Verify the agent icon is correctly displayed for each entry in the preview list. - Navigate to `APM -> Traces`. - Verify each table entry correctly displays the related agent icon. - Navigate to `APM -> Settings -> Agent Explorer`. - Verify each table entry correctly displays the related agent icon. --------- Co-authored-by: Marco Antonio Ghiani Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com> --- .github/CODEOWNERS | 2 + package.json | 2 + packages/kbn-custom-icons/.storybook/main.js | 9 + packages/kbn-custom-icons/README.md | 29 +++ .../kbn-custom-icons/assets}/android.svg | 0 .../kbn-custom-icons/assets}/cpp.svg | 0 .../kbn-custom-icons/assets}/cpp_dark.svg | 0 packages/kbn-custom-icons/assets/default.svg | 3 + .../kbn-custom-icons/assets}/dot_net.svg | 0 .../kbn-custom-icons/assets}/erlang.svg | 0 .../kbn-custom-icons/assets}/erlang_dark.svg | 0 .../kbn-custom-icons/assets}/functions.svg | 0 .../kbn-custom-icons/assets}/go.svg | 0 .../kbn-custom-icons/assets}/ios.svg | 0 .../kbn-custom-icons/assets}/ios_dark.svg | 0 .../kbn-custom-icons/assets}/java.svg | 0 .../kbn-custom-icons/assets}/lambda.svg | 0 .../kbn-custom-icons/assets}/nodejs.svg | 0 .../kbn-custom-icons/assets}/ocaml.svg | 0 .../assets}/opentelemetry.svg | 0 .../kbn-custom-icons/assets}/otel_default.svg | 0 .../kbn-custom-icons/assets}/php.svg | 0 .../kbn-custom-icons/assets}/php_dark.svg | 0 .../kbn-custom-icons/assets}/python.svg | 0 .../kbn-custom-icons/assets}/ruby.svg | 0 .../kbn-custom-icons/assets}/rumjs.svg | 0 .../kbn-custom-icons/assets}/rumjs_dark.svg | 0 .../kbn-custom-icons/assets}/rust.svg | 0 .../kbn-custom-icons/assets}/rust_dark.svg | 0 packages/kbn-custom-icons/index.ts | 16 ++ packages/kbn-custom-icons/jest.config.js | 13 ++ packages/kbn-custom-icons/kibana.jsonc | 5 + packages/kbn-custom-icons/package.json | 7 + .../agent_icon/agent_icon.stories.tsx | 53 +++++ .../agent_icon/get_agent_icon.test.ts | 5 +- .../components}/agent_icon/get_agent_icon.ts | 70 +++--- .../agent_icon/get_serverless_icon.ts | 23 ++ .../src/components/agent_icon/index.tsx | 23 ++ .../cloud_provider_icon.stories.tsx | 41 ++++ .../get_cloud_provider_icon.ts | 23 ++ .../components/cloud_provider_icon/index.tsx | 25 ++ packages/kbn-custom-icons/tsconfig.json | 23 ++ packages/kbn-elastic-agent-utils/README.md | 141 ++++++++++++ packages/kbn-elastic-agent-utils/index.ts | 38 ++++ .../kbn-elastic-agent-utils/jest.config.js | 13 ++ packages/kbn-elastic-agent-utils/kibana.jsonc | 5 + packages/kbn-elastic-agent-utils/package.json | 6 + .../src/agent_guards.test.ts | 83 +++++++ .../src/agent_guards.ts | 63 ++++++ .../src/agent_names.ts | 84 +++++++ .../kbn-elastic-agent-utils/tsconfig.json | 17 ++ src/dev/storybook/aliases.ts | 1 + tsconfig.base.json | 4 + .../setting_definitions/index.ts | 4 +- x-pack/plugins/apm/common/agent_name.test.ts | 213 ------------------ x-pack/plugins/apm/common/agent_name.ts | 124 ++-------- .../plugins/apm/common/service_inventory.ts | 2 +- .../public/components/app/metrics/index.tsx | 8 +- .../components/app/metrics_details/index.tsx | 4 +- .../service_list_preview.tsx | 4 +- .../components/app/service_map/icons.ts | 2 +- .../components/app/service_overview/index.tsx | 4 +- .../intance_details.tsx | 10 +- .../agent_explorer/agent_list/index.tsx | 9 +- .../app/transaction_details/index.tsx | 4 +- .../app/transaction_overview/index.tsx | 4 +- .../agent_instructions_accordion.tsx | 2 +- .../templates/apm_service_template/index.tsx | 24 +- .../shared/agent_icon/agent_icon.stories.tsx | 70 ------ .../shared/agent_icon/get_serverless_icon.ts | 25 -- .../components/shared/agent_icon/index.tsx | 25 -- .../critical_path_flamegraph_tooltip.tsx | 4 +- .../shared/links/apm/service_link/index.tsx | 4 +- .../components/shared/service_icons/index.tsx | 25 +- .../shared/span_icon/get_span_icon.ts | 4 +- .../apm/server/lib/apm_telemetry/types.ts | 5 +- x-pack/plugins/apm/tsconfig.json | 2 + .../apm/typings/es_schemas/ui/fields/agent.ts | 38 +--- .../hosts/components/table/entry_title.tsx | 15 +- .../metrics/hosts/hooks/use_hosts_table.tsx | 2 +- x-pack/plugins/infra/tsconfig.json | 3 +- yarn.lock | 8 + 82 files changed, 886 insertions(+), 589 deletions(-) create mode 100644 packages/kbn-custom-icons/.storybook/main.js create mode 100644 packages/kbn-custom-icons/README.md rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/android.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/cpp.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/cpp_dark.svg (100%) create mode 100644 packages/kbn-custom-icons/assets/default.svg rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/dot_net.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/erlang.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/erlang_dark.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/functions.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/go.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/ios.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/ios_dark.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/java.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/lambda.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/nodejs.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/ocaml.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/opentelemetry.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/otel_default.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/php.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/php_dark.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/python.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/ruby.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/rumjs.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/rumjs_dark.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/rust.svg (100%) rename {x-pack/plugins/apm/public/components/shared/agent_icon/icons => packages/kbn-custom-icons/assets}/rust_dark.svg (100%) create mode 100644 packages/kbn-custom-icons/index.ts create mode 100644 packages/kbn-custom-icons/jest.config.js create mode 100644 packages/kbn-custom-icons/kibana.jsonc create mode 100644 packages/kbn-custom-icons/package.json create mode 100644 packages/kbn-custom-icons/src/components/agent_icon/agent_icon.stories.tsx rename {x-pack/plugins/apm/public/components/shared => packages/kbn-custom-icons/src/components}/agent_icon/get_agent_icon.test.ts (86%) rename {x-pack/plugins/apm/public/components/shared => packages/kbn-custom-icons/src/components}/agent_icon/get_agent_icon.ts (53%) create mode 100644 packages/kbn-custom-icons/src/components/agent_icon/get_serverless_icon.ts create mode 100644 packages/kbn-custom-icons/src/components/agent_icon/index.tsx create mode 100644 packages/kbn-custom-icons/src/components/cloud_provider_icon/cloud_provider_icon.stories.tsx create mode 100644 packages/kbn-custom-icons/src/components/cloud_provider_icon/get_cloud_provider_icon.ts create mode 100644 packages/kbn-custom-icons/src/components/cloud_provider_icon/index.tsx create mode 100644 packages/kbn-custom-icons/tsconfig.json create mode 100644 packages/kbn-elastic-agent-utils/README.md create mode 100644 packages/kbn-elastic-agent-utils/index.ts create mode 100644 packages/kbn-elastic-agent-utils/jest.config.js create mode 100644 packages/kbn-elastic-agent-utils/kibana.jsonc create mode 100644 packages/kbn-elastic-agent-utils/package.json create mode 100644 packages/kbn-elastic-agent-utils/src/agent_guards.test.ts create mode 100644 packages/kbn-elastic-agent-utils/src/agent_guards.ts create mode 100644 packages/kbn-elastic-agent-utils/src/agent_names.ts create mode 100644 packages/kbn-elastic-agent-utils/tsconfig.json delete mode 100644 x-pack/plugins/apm/common/agent_name.test.ts delete mode 100644 x-pack/plugins/apm/public/components/shared/agent_icon/agent_icon.stories.tsx delete mode 100644 x-pack/plugins/apm/public/components/shared/agent_icon/get_serverless_icon.ts delete mode 100644 x-pack/plugins/apm/public/components/shared/agent_icon/index.tsx diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS index 7d58837fda1a5..bb0e639ea4a28 100644 --- a/.github/CODEOWNERS +++ b/.github/CODEOWNERS @@ -302,6 +302,7 @@ x-pack/plugins/cross_cluster_replication @elastic/platform-deployment-management packages/kbn-crypto @elastic/kibana-security packages/kbn-crypto-browser @elastic/kibana-core x-pack/plugins/custom_branding @elastic/appex-sharedux +packages/kbn-custom-icons @elastic/obs-ux-logs-team packages/kbn-custom-integrations @elastic/obs-ux-logs-team src/plugins/custom_integrations @elastic/fleet packages/kbn-cypress-config @elastic/kibana-operations @@ -345,6 +346,7 @@ packages/kbn-ebt-tools @elastic/kibana-core packages/kbn-ecs @elastic/kibana-core @elastic/security-threat-hunting-investigations x-pack/packages/security-solution/ecs_data_quality_dashboard @elastic/security-threat-hunting-investigations x-pack/plugins/ecs_data_quality_dashboard @elastic/security-threat-hunting-investigations +packages/kbn-elastic-agent-utils @elastic/obs-ux-logs-team x-pack/packages/kbn-elastic-assistant @elastic/security-solution x-pack/plugins/elastic_assistant @elastic/security-solution test/plugin_functional/plugins/elasticsearch_client_plugin @elastic/kibana-core diff --git a/package.json b/package.json index eb9e440ba1c12..0f8260566b536 100644 --- a/package.json +++ b/package.json @@ -353,6 +353,7 @@ "@kbn/crypto": "link:packages/kbn-crypto", "@kbn/crypto-browser": "link:packages/kbn-crypto-browser", "@kbn/custom-branding-plugin": "link:x-pack/plugins/custom_branding", + "@kbn/custom-icons": "link:packages/kbn-custom-icons", "@kbn/custom-integrations": "link:packages/kbn-custom-integrations", "@kbn/custom-integrations-plugin": "link:src/plugins/custom_integrations", "@kbn/dashboard-enhanced-plugin": "link:x-pack/plugins/dashboard_enhanced", @@ -390,6 +391,7 @@ "@kbn/ecs": "link:packages/kbn-ecs", "@kbn/ecs-data-quality-dashboard": "link:x-pack/packages/security-solution/ecs_data_quality_dashboard", "@kbn/ecs-data-quality-dashboard-plugin": "link:x-pack/plugins/ecs_data_quality_dashboard", + "@kbn/elastic-agent-utils": "link:packages/kbn-elastic-agent-utils", "@kbn/elastic-assistant": "link:x-pack/packages/kbn-elastic-assistant", "@kbn/elastic-assistant-plugin": "link:x-pack/plugins/elastic_assistant", "@kbn/elasticsearch-client-plugin": "link:test/plugin_functional/plugins/elasticsearch_client_plugin", diff --git a/packages/kbn-custom-icons/.storybook/main.js b/packages/kbn-custom-icons/.storybook/main.js new file mode 100644 index 0000000000000..8dc3c5d1518f4 --- /dev/null +++ b/packages/kbn-custom-icons/.storybook/main.js @@ -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 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. + */ + +module.exports = require('@kbn/storybook').defaultConfig; diff --git a/packages/kbn-custom-icons/README.md b/packages/kbn-custom-icons/README.md new file mode 100644 index 0000000000000..ec48e8b8558cb --- /dev/null +++ b/packages/kbn-custom-icons/README.md @@ -0,0 +1,29 @@ +# @kbn/custom-icons + +A utility package, `@kbn/custom-icons`, that provides components for rendering icons related to Elastic Agents, Cloud Providers and more. + +## Components + +### `` + +```jsx + +``` + +This component renders an icon corresponding to the specified Elastic Agent name (`agentName`). + +#### Props + +- **`agentName`**: The name of the Elastic Agent for which the icon should be rendered. + +### `` + +```jsx + +``` + +This component renders an icon associated with the specified Cloud Provider (`cloudProvider`). + +#### Props + +- **`cloudProvider`**: The name of the Cloud Provider for which the icon should be rendered. diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/android.svg b/packages/kbn-custom-icons/assets/android.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/android.svg rename to packages/kbn-custom-icons/assets/android.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/cpp.svg b/packages/kbn-custom-icons/assets/cpp.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/cpp.svg rename to packages/kbn-custom-icons/assets/cpp.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/cpp_dark.svg b/packages/kbn-custom-icons/assets/cpp_dark.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/cpp_dark.svg rename to packages/kbn-custom-icons/assets/cpp_dark.svg diff --git a/packages/kbn-custom-icons/assets/default.svg b/packages/kbn-custom-icons/assets/default.svg new file mode 100644 index 0000000000000..08bc5331e083b --- /dev/null +++ b/packages/kbn-custom-icons/assets/default.svg @@ -0,0 +1,3 @@ + + + diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/dot_net.svg b/packages/kbn-custom-icons/assets/dot_net.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/dot_net.svg rename to packages/kbn-custom-icons/assets/dot_net.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/erlang.svg b/packages/kbn-custom-icons/assets/erlang.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/erlang.svg rename to packages/kbn-custom-icons/assets/erlang.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/erlang_dark.svg b/packages/kbn-custom-icons/assets/erlang_dark.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/erlang_dark.svg rename to packages/kbn-custom-icons/assets/erlang_dark.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/functions.svg b/packages/kbn-custom-icons/assets/functions.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/functions.svg rename to packages/kbn-custom-icons/assets/functions.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/go.svg b/packages/kbn-custom-icons/assets/go.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/go.svg rename to packages/kbn-custom-icons/assets/go.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/ios.svg b/packages/kbn-custom-icons/assets/ios.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/ios.svg rename to packages/kbn-custom-icons/assets/ios.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/ios_dark.svg b/packages/kbn-custom-icons/assets/ios_dark.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/ios_dark.svg rename to packages/kbn-custom-icons/assets/ios_dark.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/java.svg b/packages/kbn-custom-icons/assets/java.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/java.svg rename to packages/kbn-custom-icons/assets/java.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/lambda.svg b/packages/kbn-custom-icons/assets/lambda.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/lambda.svg rename to packages/kbn-custom-icons/assets/lambda.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/nodejs.svg b/packages/kbn-custom-icons/assets/nodejs.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/nodejs.svg rename to packages/kbn-custom-icons/assets/nodejs.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/ocaml.svg b/packages/kbn-custom-icons/assets/ocaml.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/ocaml.svg rename to packages/kbn-custom-icons/assets/ocaml.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/opentelemetry.svg b/packages/kbn-custom-icons/assets/opentelemetry.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/opentelemetry.svg rename to packages/kbn-custom-icons/assets/opentelemetry.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/otel_default.svg b/packages/kbn-custom-icons/assets/otel_default.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/otel_default.svg rename to packages/kbn-custom-icons/assets/otel_default.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/php.svg b/packages/kbn-custom-icons/assets/php.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/php.svg rename to packages/kbn-custom-icons/assets/php.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/php_dark.svg b/packages/kbn-custom-icons/assets/php_dark.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/php_dark.svg rename to packages/kbn-custom-icons/assets/php_dark.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/python.svg b/packages/kbn-custom-icons/assets/python.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/python.svg rename to packages/kbn-custom-icons/assets/python.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/ruby.svg b/packages/kbn-custom-icons/assets/ruby.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/ruby.svg rename to packages/kbn-custom-icons/assets/ruby.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/rumjs.svg b/packages/kbn-custom-icons/assets/rumjs.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/rumjs.svg rename to packages/kbn-custom-icons/assets/rumjs.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/rumjs_dark.svg b/packages/kbn-custom-icons/assets/rumjs_dark.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/rumjs_dark.svg rename to packages/kbn-custom-icons/assets/rumjs_dark.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/rust.svg b/packages/kbn-custom-icons/assets/rust.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/rust.svg rename to packages/kbn-custom-icons/assets/rust.svg diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/icons/rust_dark.svg b/packages/kbn-custom-icons/assets/rust_dark.svg similarity index 100% rename from x-pack/plugins/apm/public/components/shared/agent_icon/icons/rust_dark.svg rename to packages/kbn-custom-icons/assets/rust_dark.svg diff --git a/packages/kbn-custom-icons/index.ts b/packages/kbn-custom-icons/index.ts new file mode 100644 index 0000000000000..d6bc468b66524 --- /dev/null +++ b/packages/kbn-custom-icons/index.ts @@ -0,0 +1,16 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 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. + */ +export { getAgentIcon } from './src/components/agent_icon/get_agent_icon'; +export { getServerlessIcon } from './src/components/agent_icon/get_serverless_icon'; +export { AgentIcon } from './src/components/agent_icon'; +export type { AgentIconProps } from './src/components/agent_icon'; + +export { getCloudProviderIcon } from './src/components/cloud_provider_icon/get_cloud_provider_icon'; +export type { CloudProvider } from './src/components/cloud_provider_icon/get_cloud_provider_icon'; +export { CloudProviderIcon } from './src/components/cloud_provider_icon'; +export type { CloudProviderIconProps } from './src/components/cloud_provider_icon'; diff --git a/packages/kbn-custom-icons/jest.config.js b/packages/kbn-custom-icons/jest.config.js new file mode 100644 index 0000000000000..518564ce1dbbd --- /dev/null +++ b/packages/kbn-custom-icons/jest.config.js @@ -0,0 +1,13 @@ +/* + * 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. + */ + +module.exports = { + preset: '@kbn/test', + rootDir: '../..', + roots: ['/packages/kbn-custom-icons'], +}; diff --git a/packages/kbn-custom-icons/kibana.jsonc b/packages/kbn-custom-icons/kibana.jsonc new file mode 100644 index 0000000000000..7bd9eaa57e871 --- /dev/null +++ b/packages/kbn-custom-icons/kibana.jsonc @@ -0,0 +1,5 @@ +{ + "type": "shared-common", + "id": "@kbn/custom-icons", + "owner": "@elastic/obs-ux-logs-team" +} diff --git a/packages/kbn-custom-icons/package.json b/packages/kbn-custom-icons/package.json new file mode 100644 index 0000000000000..d6952600c0afd --- /dev/null +++ b/packages/kbn-custom-icons/package.json @@ -0,0 +1,7 @@ +{ + "name": "@kbn/custom-icons", + "private": true, + "version": "1.0.0", + "license": "SSPL-1.0 OR Elastic License 2.0", + "sideEffects": false +} \ No newline at end of file diff --git a/packages/kbn-custom-icons/src/components/agent_icon/agent_icon.stories.tsx b/packages/kbn-custom-icons/src/components/agent_icon/agent_icon.stories.tsx new file mode 100644 index 0000000000000..45ba59137a6c2 --- /dev/null +++ b/packages/kbn-custom-icons/src/components/agent_icon/agent_icon.stories.tsx @@ -0,0 +1,53 @@ +/* + * 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 { EuiCard, EuiFlexGroup, EuiFlexItem, EuiImage, EuiToolTip } from '@elastic/eui'; +import type { Story } from '@storybook/react'; +import React from 'react'; +import { AGENT_NAMES } from '@kbn/elastic-agent-utils'; +import { EuiThemeProvider } from '@kbn/kibana-react-plugin/common'; +import { getAgentIcon } from './get_agent_icon'; +import { AgentIcon } from '.'; + +export default { + title: 'Custom Icons/AgentIcon', + component: AgentIcon, +}; + +export const List: Story = () => { + return ( + + + {AGENT_NAMES.map((agentName) => { + return ( + + + + + } + title={agentName} + description={ + + + + } + /> + + ); + })} + + + ); +}; diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/get_agent_icon.test.ts b/packages/kbn-custom-icons/src/components/agent_icon/get_agent_icon.test.ts similarity index 86% rename from x-pack/plugins/apm/public/components/shared/agent_icon/get_agent_icon.test.ts rename to packages/kbn-custom-icons/src/components/agent_icon/get_agent_icon.test.ts index aac5fc19ca37b..58dff1afb1095 100644 --- a/x-pack/plugins/apm/public/components/shared/agent_icon/get_agent_icon.test.ts +++ b/packages/kbn-custom-icons/src/components/agent_icon/get_agent_icon.test.ts @@ -1,8 +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. + * 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 { getAgentIconKey } from './get_agent_icon'; diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/get_agent_icon.ts b/packages/kbn-custom-icons/src/components/agent_icon/get_agent_icon.ts similarity index 53% rename from x-pack/plugins/apm/public/components/shared/agent_icon/get_agent_icon.ts rename to packages/kbn-custom-icons/src/components/agent_icon/get_agent_icon.ts index 04bc276dcfa65..7c37f1a86a056 100644 --- a/x-pack/plugins/apm/public/components/shared/agent_icon/get_agent_icon.ts +++ b/packages/kbn-custom-icons/src/components/agent_icon/get_agent_icon.ts @@ -1,40 +1,40 @@ /* * 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. + * 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 { + isAndroidAgentName, isIosAgentName, - isRumAgentName, isJavaAgentName, - isAndroidAgentName, + isRumAgentName, + OpenTelemetryAgentName, OPEN_TELEMETRY_AGENT_NAMES, -} from '../../../../common/agent_name'; -import { AgentName } from '../../../../typings/es_schemas/ui/fields/agent'; -import defaultIcon from '../span_icon/icons/default.svg'; -import cppIcon from './icons/cpp.svg'; -import darkCppIcon from './icons/cpp_dark.svg'; -import dotNetIcon from './icons/dot_net.svg'; -import erlangIcon from './icons/erlang.svg'; -import darkErlangIcon from './icons/erlang_dark.svg'; -import goIcon from './icons/go.svg'; -import iosIcon from './icons/ios.svg'; -import darkIosIcon from './icons/ios_dark.svg'; -import javaIcon from './icons/java.svg'; -import nodeJsIcon from './icons/nodejs.svg'; -import ocamlIcon from './icons/ocaml.svg'; -import openTelemetryIcon from './icons/otel_default.svg'; -import phpIcon from './icons/php.svg'; -import pythonIcon from './icons/python.svg'; -import rubyIcon from './icons/ruby.svg'; -import rumJsIcon from './icons/rumjs.svg'; -import darkPhpIcon from './icons/php_dark.svg'; -import darkRumJsIcon from './icons/rumjs_dark.svg'; -import rustIcon from './icons/rust.svg'; -import darkRustIcon from './icons/rust_dark.svg'; -import androidIcon from './icons/android.svg'; +} from '@kbn/elastic-agent-utils'; +import defaultIcon from '../../../assets/default.svg'; +import cppIcon from '../../../assets/cpp.svg'; +import darkCppIcon from '../../../assets/cpp_dark.svg'; +import dotNetIcon from '../../../assets/dot_net.svg'; +import erlangIcon from '../../../assets/erlang.svg'; +import darkErlangIcon from '../../../assets/erlang_dark.svg'; +import goIcon from '../../../assets/go.svg'; +import iosIcon from '../../../assets/ios.svg'; +import darkIosIcon from '../../../assets/ios_dark.svg'; +import javaIcon from '../../../assets/java.svg'; +import nodeJsIcon from '../../../assets/nodejs.svg'; +import ocamlIcon from '../../../assets/ocaml.svg'; +import openTelemetryIcon from '../../../assets/otel_default.svg'; +import phpIcon from '../../../assets/php.svg'; +import pythonIcon from '../../../assets/python.svg'; +import rubyIcon from '../../../assets/ruby.svg'; +import rumJsIcon from '../../../assets/rumjs.svg'; +import darkPhpIcon from '../../../assets/php_dark.svg'; +import darkRumJsIcon from '../../../assets/rumjs_dark.svg'; +import rustIcon from '../../../assets/rust.svg'; +import darkRustIcon from '../../../assets/rust_dark.svg'; +import androidIcon from '../../../assets/android.svg'; const agentIcons: { [key: string]: string } = { cpp: cppIcon, @@ -89,25 +89,19 @@ export function getAgentIconKey(agentName: string) { } // Remove "opentelemetry/" prefix - const agentNameWithoutPrefix = lowercasedAgentName.replace( - /^opentelemetry\//, - '' - ); + const agentNameWithoutPrefix = lowercasedAgentName.replace(/^opentelemetry\//, ''); if (Object.keys(agentIcons).includes(agentNameWithoutPrefix)) { return agentNameWithoutPrefix; } // OpenTelemetry-only agents - if (OPEN_TELEMETRY_AGENT_NAMES.includes(lowercasedAgentName as AgentName)) { + if (OPEN_TELEMETRY_AGENT_NAMES.includes(lowercasedAgentName as OpenTelemetryAgentName)) { return 'opentelemetry'; } } -export function getAgentIcon( - agentName: string | undefined, - isDarkMode: boolean -) { +export function getAgentIcon(agentName: string | undefined, isDarkMode: boolean = false) { const key = agentName && getAgentIconKey(agentName); if (!key) { return defaultIcon; diff --git a/packages/kbn-custom-icons/src/components/agent_icon/get_serverless_icon.ts b/packages/kbn-custom-icons/src/components/agent_icon/get_serverless_icon.ts new file mode 100644 index 0000000000000..26268d3c7dce1 --- /dev/null +++ b/packages/kbn-custom-icons/src/components/agent_icon/get_serverless_icon.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 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 { ServerlessType } from '@kbn/elastic-agent-utils'; +import defaultIcon from '../../../assets/default.svg'; +import lambdaIcon from '../../../assets/lambda.svg'; +import azureFunctionsIcon from '../../../assets/functions.svg'; + +const serverlessIcons: Record = { + 'aws.lambda': lambdaIcon, + 'azure.functions': azureFunctionsIcon, +} as const; + +export function getServerlessIcon(serverlessType?: ServerlessType) { + if (!serverlessType) { + return defaultIcon; + } + return serverlessIcons[serverlessType] ?? defaultIcon; +} diff --git a/packages/kbn-custom-icons/src/components/agent_icon/index.tsx b/packages/kbn-custom-icons/src/components/agent_icon/index.tsx new file mode 100644 index 0000000000000..bd34aa7f3a32e --- /dev/null +++ b/packages/kbn-custom-icons/src/components/agent_icon/index.tsx @@ -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 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 React from 'react'; +import { EuiIcon, EuiIconProps, useEuiTheme } from '@elastic/eui'; +import { AgentName } from '@kbn/elastic-agent-utils'; +import { getAgentIcon } from './get_agent_icon'; + +export interface AgentIconProps extends Omit { + agentName?: AgentName; +} + +export function AgentIcon({ agentName, size = 'l', ...props }: AgentIconProps) { + const theme = useEuiTheme(); + const icon = getAgentIcon(agentName, theme.colorMode === 'DARK'); + + return ; +} diff --git a/packages/kbn-custom-icons/src/components/cloud_provider_icon/cloud_provider_icon.stories.tsx b/packages/kbn-custom-icons/src/components/cloud_provider_icon/cloud_provider_icon.stories.tsx new file mode 100644 index 0000000000000..e84e865fb55fd --- /dev/null +++ b/packages/kbn-custom-icons/src/components/cloud_provider_icon/cloud_provider_icon.stories.tsx @@ -0,0 +1,41 @@ +/* + * 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 { EuiCard, EuiFlexGroup, EuiFlexItem, EuiToolTip } from '@elastic/eui'; +import type { Story } from '@storybook/react'; +import React from 'react'; +import { CloudProviderIcon } from '.'; +import { CloudProvider } from './get_cloud_provider_icon'; + +export default { + title: 'Custom Icons/CloudProviderIcon', + component: CloudProviderIcon, +}; + +const providers: CloudProvider[] = ['gcp', 'aws', 'azure', 'unknownProvider']; + +export const List: Story = () => { + return ( + + {providers.map((cloudProvider) => { + return ( + + + + + } + /> + + ); + })} + + ); +}; diff --git a/packages/kbn-custom-icons/src/components/cloud_provider_icon/get_cloud_provider_icon.ts b/packages/kbn-custom-icons/src/components/cloud_provider_icon/get_cloud_provider_icon.ts new file mode 100644 index 0000000000000..7c4bcd2ec3f7c --- /dev/null +++ b/packages/kbn-custom-icons/src/components/cloud_provider_icon/get_cloud_provider_icon.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 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. + */ +const CLOUD_PROVIDER_ICONS = { + gcp: 'logoGCP', + aws: 'logoAWS', + azure: 'logoAzure', + unknownProvider: 'cloudSunny', +} as const; + +export type CloudProvider = keyof typeof CLOUD_PROVIDER_ICONS | null | undefined; + +export function getCloudProviderIcon(cloudProvider?: CloudProvider) { + if (cloudProvider === undefined || cloudProvider === null) { + return CLOUD_PROVIDER_ICONS.unknownProvider; + } + + return CLOUD_PROVIDER_ICONS[cloudProvider]; +} diff --git a/packages/kbn-custom-icons/src/components/cloud_provider_icon/index.tsx b/packages/kbn-custom-icons/src/components/cloud_provider_icon/index.tsx new file mode 100644 index 0000000000000..bf90704e4f644 --- /dev/null +++ b/packages/kbn-custom-icons/src/components/cloud_provider_icon/index.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 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 React from 'react'; +import { EuiIcon, EuiIconProps } from '@elastic/eui'; +import { CloudProvider, getCloudProviderIcon } from './get_cloud_provider_icon'; + +export interface CloudProviderIconProps extends Omit { + cloudProvider?: CloudProvider; +} + +export function CloudProviderIcon({ cloudProvider, ...props }: CloudProviderIconProps) { + const computedProps: Pick = { + type: getCloudProviderIcon(cloudProvider), + }; + + if (cloudProvider) computedProps.title = cloudProvider; + + return ; +} diff --git a/packages/kbn-custom-icons/tsconfig.json b/packages/kbn-custom-icons/tsconfig.json new file mode 100644 index 0000000000000..5cd845d4948c6 --- /dev/null +++ b/packages/kbn-custom-icons/tsconfig.json @@ -0,0 +1,23 @@ +{ + "extends": "../../tsconfig.base.json", + "compilerOptions": { + "outDir": "target/types", + "types": [ + "jest", + "node", + "react", + "@kbn/ambient-ui-types" + ] + }, + "include": [ + "**/*.ts", + "**/*.tsx" + ], + "exclude": [ + "target/**/*" + ], + "kbn_references": [ + "@kbn/elastic-agent-utils", + "@kbn/kibana-react-plugin" + ] +} diff --git a/packages/kbn-elastic-agent-utils/README.md b/packages/kbn-elastic-agent-utils/README.md new file mode 100644 index 0000000000000..f5b99bf1b1594 --- /dev/null +++ b/packages/kbn-elastic-agent-utils/README.md @@ -0,0 +1,141 @@ +# @kbn/elastic-agent-utils + +A utility package providing functions for working with Elastic Agents. This package focuses on agent names used in various contexts, such as OpenTelemetry, Java, Rum (Real User Monitoring), Mobile, JRuby, and Serverless environments. + +## Functions + +- **`isOpenTelemetryAgentName`** + + ```typescript + export function isOpenTelemetryAgentName(agentName: string): agentName is OpenTelemetryAgentName; + ``` + + Check if the provided agent name is part of the OpenTelemetry agents. + +- **`isJavaAgentName`** + + ```typescript + export function isJavaAgentName(agentName?: string): agentName is JavaAgentName; + ``` + + Check if the provided agent name is part of the Java agents. + +- **`isRumAgentName`** + + ```typescript + export function isRumAgentName(agentName?: string): agentName is RumAgentName; + ``` + + Check if the provided agent name is part of the Rum (Real User Monitoring) agents. + +- **`isMobileAgentName`** + + ```typescript + export function isMobileAgentName(agentName?: string): boolean; + ``` + + Check if the provided agent name is either an iOS or Android agent. + +- **`isRumOrMobileAgentName`** + + ```typescript + export function isRumOrMobileAgentName(agentName?: string): boolean; + ``` + + Check if the provided agent name is either a Rum agent or a Mobile agent. + +- **`isIosAgentName`** + + ```typescript + export function isIosAgentName(agentName?: string): boolean; + ``` + + Check if the provided agent name is "ios/swift." + +- **`isAndroidAgentName`** + + ```typescript + export function isAndroidAgentName(agentName?: string): boolean; + ``` + + Check if the provided agent name is "android/java." + +- **`isJRubyAgentName`** + + ```typescript + export function isJRubyAgentName(agentName?: string, runtimeName?: string): boolean; + ``` + + Check if the provided agent name is "ruby" and the runtime name is "jruby." + +- **`isServerlessAgentName`** + + ```typescript + export function isServerlessAgentName(serverlessType?: string): serverlessType is ServerlessType; + ``` + + Check if the provided serverless type is part of the supported Serverless environments. + +- **`isAWSLambdaAgentName`** + + ```typescript + export function isAWSLambdaAgentName(serverlessType?: string): serverlessType is ServerlessType; + ``` + + Check if the provided serverless type is "aws.lambda." + +- **`isAzureFunctionsAgentName`** + + ```typescript + export function isAzureFunctionsAgentName( + serverlessType?: string + ): serverlessType is ServerlessType; + ``` + + Check if the provided serverless type is "azure.functions." + +## Additional Exports + +The `@kbn/elastic-agent-utils` package also exports several constants and types for commonly used agent names. These exports can be utilized for broader categorizations and validations within your Elastic Agent projects. + +### Agent Names Constants + +- **`ELASTIC_AGENT_NAMES`** + + An array of Elastic Agent names, including various programming languages and platforms. + +- **`OPEN_TELEMETRY_AGENT_NAMES`** + + An array of OpenTelemetry agent names, covering different languages and platforms supporting OpenTelemetry. + +- **`JAVA_AGENT_NAMES`** + + An array of Java agent names, including both generic Java and OpenTelemetry Java agents. + +- **`RUM_AGENT_NAMES`** + + An array of Real User Monitoring (RUM) agent names, encompassing both base JavaScript and specific RUM agents. + +- **`SERVERLESS_TYPE`** + + An array of supported Serverless types, including AWS Lambda and Azure Functions. + +### Agent Name Types + +- **`ElasticAgentName`** +- **`OpenTelemetryAgentName`** +- **`JavaAgentName`** +- **`RumAgentName`** +- **`ServerlessType`** + + These types represent the available agent name categories, providing TypeScript type safety for agent name usage. + +### Combined Agent Names + +- **`AgentName`** + + A union type combining all agent name categories. + +- **`AGENT_NAMES`** + + An array containing all available agent names from the combined categories. diff --git a/packages/kbn-elastic-agent-utils/index.ts b/packages/kbn-elastic-agent-utils/index.ts new file mode 100644 index 0000000000000..62e7a6cd59688 --- /dev/null +++ b/packages/kbn-elastic-agent-utils/index.ts @@ -0,0 +1,38 @@ +/* + * 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. + */ +export { + isOpenTelemetryAgentName, + isJavaAgentName, + isRumAgentName, + isMobileAgentName, + isRumOrMobileAgentName, + isIosAgentName, + isAndroidAgentName, + isJRubyAgentName, + isServerlessAgentName, + isAWSLambdaAgentName, + isAzureFunctionsAgentName, +} from './src/agent_guards'; + +export { + ELASTIC_AGENT_NAMES, + OPEN_TELEMETRY_AGENT_NAMES, + JAVA_AGENT_NAMES, + RUM_AGENT_NAMES, + SERVERLESS_TYPE, + AGENT_NAMES, +} from './src/agent_names'; + +export type { + ElasticAgentName, + OpenTelemetryAgentName, + JavaAgentName, + RumAgentName, + ServerlessType, + AgentName, +} from './src/agent_names'; diff --git a/packages/kbn-elastic-agent-utils/jest.config.js b/packages/kbn-elastic-agent-utils/jest.config.js new file mode 100644 index 0000000000000..787036bd78da7 --- /dev/null +++ b/packages/kbn-elastic-agent-utils/jest.config.js @@ -0,0 +1,13 @@ +/* + * 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. + */ + +module.exports = { + preset: '@kbn/test', + rootDir: '../..', + roots: ['/packages/kbn-elastic-agent-utils'], +}; diff --git a/packages/kbn-elastic-agent-utils/kibana.jsonc b/packages/kbn-elastic-agent-utils/kibana.jsonc new file mode 100644 index 0000000000000..cf8dc4c03f59d --- /dev/null +++ b/packages/kbn-elastic-agent-utils/kibana.jsonc @@ -0,0 +1,5 @@ +{ + "type": "shared-common", + "id": "@kbn/elastic-agent-utils", + "owner": "@elastic/obs-ux-logs-team" +} diff --git a/packages/kbn-elastic-agent-utils/package.json b/packages/kbn-elastic-agent-utils/package.json new file mode 100644 index 0000000000000..df029eb7db2dc --- /dev/null +++ b/packages/kbn-elastic-agent-utils/package.json @@ -0,0 +1,6 @@ +{ + "name": "@kbn/elastic-agent-utils", + "private": true, + "version": "1.0.0", + "license": "SSPL-1.0 OR Elastic License 2.0" +} \ No newline at end of file diff --git a/packages/kbn-elastic-agent-utils/src/agent_guards.test.ts b/packages/kbn-elastic-agent-utils/src/agent_guards.test.ts new file mode 100644 index 0000000000000..0de2ea225ce81 --- /dev/null +++ b/packages/kbn-elastic-agent-utils/src/agent_guards.test.ts @@ -0,0 +1,83 @@ +/* + * 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 { + isAndroidAgentName, + isAWSLambdaAgentName, + isAzureFunctionsAgentName, + isIosAgentName, + isJavaAgentName, + isJRubyAgentName, + isMobileAgentName, + isOpenTelemetryAgentName, + isRumAgentName, + isRumOrMobileAgentName, + isServerlessAgentName, +} from './agent_guards'; + +describe('Agents guards', () => { + it('isOpenTelemetryAgentName should guard if the passed agent is an OpenTelemetry one.', () => { + expect(isOpenTelemetryAgentName('otlp')).toBe(true); + expect(isOpenTelemetryAgentName('not-an-agent')).toBe(false); + }); + + it('isJavaAgentName should guard if the passed agent is an Java one.', () => { + expect(isJavaAgentName('java')).toBe(true); + expect(isJavaAgentName('not-an-agent')).toBe(false); + }); + + it('isRumAgentName should guard if the passed agent is an Rum one.', () => { + expect(isRumAgentName('rum-js')).toBe(true); + expect(isRumAgentName('not-an-agent')).toBe(false); + }); + + it('isMobileAgentName should guard if the passed agent is an Mobile one.', () => { + expect(isMobileAgentName('ios/swift')).toBe(true); + expect(isMobileAgentName('android/java')).toBe(true); + expect(isMobileAgentName('not-an-agent')).toBe(false); + }); + + it('isRumOrMobileAgentName should guard if the passed agent is an RumOrMobile one.', () => { + expect(isRumOrMobileAgentName('ios/swift')).toBe(true); + expect(isRumOrMobileAgentName('android/java')).toBe(true); + expect(isRumOrMobileAgentName('rum-js')).toBe(true); + expect(isRumOrMobileAgentName('not-an-agent')).toBe(false); + }); + + it('isIosAgentName should guard if the passed agent is an Ios one.', () => { + expect(isIosAgentName('ios/swift')).toBe(true); + expect(isIosAgentName('not-an-agent')).toBe(false); + }); + + it('isAndroidAgentName should guard if the passed agent is an Android one.', () => { + expect(isAndroidAgentName('android/java')).toBe(true); + expect(isAndroidAgentName('not-an-agent')).toBe(false); + }); + + it('isJRubyAgentName should guard if the passed agent is an JRuby one.', () => { + expect(isJRubyAgentName('ruby', 'jruby')).toBe(true); + expect(isJRubyAgentName('ruby')).toBe(false); + expect(isJRubyAgentName('not-an-agent')).toBe(false); + }); + + it('isServerlessAgentName should guard if the passed agent is an Serverless one.', () => { + expect(isServerlessAgentName('aws.lambda')).toBe(true); + expect(isServerlessAgentName('azure.functions')).toBe(true); + expect(isServerlessAgentName('not-an-agent')).toBe(false); + }); + + it('isAWSLambdaAgentName should guard if the passed agent is an AWSLambda one.', () => { + expect(isAWSLambdaAgentName('aws.lambda')).toBe(true); + expect(isAWSLambdaAgentName('not-an-agent')).toBe(false); + }); + + it('isAzureFunctionsAgentName should guard if the passed agent is an AzureFunctions one.', () => { + expect(isAzureFunctionsAgentName('azure.functions')).toBe(true); + expect(isAzureFunctionsAgentName('not-an-agent')).toBe(false); + }); +}); diff --git a/packages/kbn-elastic-agent-utils/src/agent_guards.ts b/packages/kbn-elastic-agent-utils/src/agent_guards.ts new file mode 100644 index 0000000000000..6997cbd81c42c --- /dev/null +++ b/packages/kbn-elastic-agent-utils/src/agent_guards.ts @@ -0,0 +1,63 @@ +/* + * 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 { JAVA_AGENT_NAMES, OPEN_TELEMETRY_AGENT_NAMES, RUM_AGENT_NAMES } from './agent_names'; + +import type { + JavaAgentName, + OpenTelemetryAgentName, + RumAgentName, + ServerlessType, +} from './agent_names'; + +export function isOpenTelemetryAgentName(agentName: string): agentName is OpenTelemetryAgentName { + return OPEN_TELEMETRY_AGENT_NAMES.includes(agentName as OpenTelemetryAgentName); +} + +export function isJavaAgentName(agentName?: string): agentName is JavaAgentName { + return JAVA_AGENT_NAMES.includes(agentName! as JavaAgentName); +} + +export function isRumAgentName(agentName?: string): agentName is RumAgentName { + return RUM_AGENT_NAMES.includes(agentName! as RumAgentName); +} + +export function isMobileAgentName(agentName?: string) { + return isIosAgentName(agentName) || isAndroidAgentName(agentName); +} + +export function isRumOrMobileAgentName(agentName?: string) { + return isRumAgentName(agentName) || isMobileAgentName(agentName); +} + +export function isIosAgentName(agentName?: string) { + return agentName?.toLowerCase() === 'ios/swift'; +} + +export function isAndroidAgentName(agentName?: string) { + const lowercased = agentName && agentName.toLowerCase(); + return lowercased === 'android/java'; +} + +export function isJRubyAgentName(agentName?: string, runtimeName?: string) { + return agentName === 'ruby' && runtimeName?.toLowerCase() === 'jruby'; +} + +export function isServerlessAgentName(serverlessType?: string): serverlessType is ServerlessType { + return isAWSLambdaAgentName(serverlessType) || isAzureFunctionsAgentName(serverlessType); +} + +export function isAWSLambdaAgentName(serverlessType?: string): serverlessType is ServerlessType { + return serverlessType === 'aws.lambda'; +} + +export function isAzureFunctionsAgentName( + serverlessType?: string +): serverlessType is ServerlessType { + return serverlessType === 'azure.functions'; +} diff --git a/packages/kbn-elastic-agent-utils/src/agent_names.ts b/packages/kbn-elastic-agent-utils/src/agent_names.ts new file mode 100644 index 0000000000000..f29160699a241 --- /dev/null +++ b/packages/kbn-elastic-agent-utils/src/agent_names.ts @@ -0,0 +1,84 @@ +/* + * 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. + */ + +/** + * We cannot mark these arrays as const and derive their type + * because we need to be able to assign them as mutable entities for ES queries. + */ +export type ElasticAgentName = + | 'dotnet' + | 'go' + | 'iOS/swift' + | 'java' + | 'js-base' + | 'nodejs' + | 'php' + | 'python' + | 'ruby' + | 'rum-js' + | 'android/java'; +export const ELASTIC_AGENT_NAMES: ElasticAgentName[] = [ + 'dotnet', + 'go', + 'iOS/swift', + 'java', + 'js-base', + 'nodejs', + 'php', + 'python', + 'ruby', + 'rum-js', + 'android/java', +]; + +export type OpenTelemetryAgentName = + | 'otlp' + | 'opentelemetry/cpp' + | 'opentelemetry/dotnet' + | 'opentelemetry/erlang' + | 'opentelemetry/go' + | 'opentelemetry/java' + | 'opentelemetry/nodejs' + | 'opentelemetry/php' + | 'opentelemetry/python' + | 'opentelemetry/ruby' + | 'opentelemetry/rust' + | 'opentelemetry/swift' + | 'opentelemetry/webjs'; +export const OPEN_TELEMETRY_AGENT_NAMES: OpenTelemetryAgentName[] = [ + 'otlp', + 'opentelemetry/cpp', + 'opentelemetry/dotnet', + 'opentelemetry/erlang', + 'opentelemetry/go', + 'opentelemetry/java', + 'opentelemetry/nodejs', + 'opentelemetry/php', + 'opentelemetry/python', + 'opentelemetry/ruby', + 'opentelemetry/rust', + 'opentelemetry/swift', + 'opentelemetry/webjs', +]; + +export type JavaAgentName = 'java' | 'opentelemetry/java'; +export const JAVA_AGENT_NAMES: JavaAgentName[] = ['java', 'opentelemetry/java']; + +export type RumAgentName = 'js-base' | 'rum-js' | 'opentelemetry/webjs'; +export const RUM_AGENT_NAMES: RumAgentName[] = ['js-base', 'rum-js', 'opentelemetry/webjs']; + +export type ServerlessType = 'aws.lambda' | 'azure.functions'; +export const SERVERLESS_TYPE: ServerlessType[] = ['aws.lambda', 'azure.functions']; + +export type AgentName = ElasticAgentName | OpenTelemetryAgentName | JavaAgentName | RumAgentName; +export const AGENT_NAMES: AgentName[] = [ + ...ELASTIC_AGENT_NAMES, + ...OPEN_TELEMETRY_AGENT_NAMES, + ...JAVA_AGENT_NAMES, + ...RUM_AGENT_NAMES, +]; diff --git a/packages/kbn-elastic-agent-utils/tsconfig.json b/packages/kbn-elastic-agent-utils/tsconfig.json new file mode 100644 index 0000000000000..9754544771806 --- /dev/null +++ b/packages/kbn-elastic-agent-utils/tsconfig.json @@ -0,0 +1,17 @@ +{ + "extends": "../../tsconfig.base.json", + "compilerOptions": { + "outDir": "target/types", + "types": [ + "jest", + "node" + ] + }, + "include": [ + "**/*.ts", + "**/*.tsx" + ], + "exclude": [ + "target/**/*" + ] +} diff --git a/src/dev/storybook/aliases.ts b/src/dev/storybook/aliases.ts index a43fd71d0004e..98470ccf13658 100644 --- a/src/dev/storybook/aliases.ts +++ b/src/dev/storybook/aliases.ts @@ -22,6 +22,7 @@ export const storybookAliases = { chart_icons: 'packages/kbn-chart-icons/.storybook', content_management_examples: 'examples/content_management_examples/.storybook', controls: 'src/plugins/controls/storybook', + custom_icons: 'packages/kbn-custom-icons/.storybook', custom_integrations: 'src/plugins/custom_integrations/storybook', dashboard_enhanced: 'x-pack/plugins/dashboard_enhanced/.storybook', dashboard: 'src/plugins/dashboard/.storybook', diff --git a/tsconfig.base.json b/tsconfig.base.json index 56b25ba43973d..06ade5904efad 100644 --- a/tsconfig.base.json +++ b/tsconfig.base.json @@ -598,6 +598,8 @@ "@kbn/crypto-browser/*": ["packages/kbn-crypto-browser/*"], "@kbn/custom-branding-plugin": ["x-pack/plugins/custom_branding"], "@kbn/custom-branding-plugin/*": ["x-pack/plugins/custom_branding/*"], + "@kbn/custom-icons": ["packages/kbn-custom-icons"], + "@kbn/custom-icons/*": ["packages/kbn-custom-icons/*"], "@kbn/custom-integrations": ["packages/kbn-custom-integrations"], "@kbn/custom-integrations/*": ["packages/kbn-custom-integrations/*"], "@kbn/custom-integrations-plugin": ["src/plugins/custom_integrations"], @@ -684,6 +686,8 @@ "@kbn/ecs-data-quality-dashboard/*": ["x-pack/packages/security-solution/ecs_data_quality_dashboard/*"], "@kbn/ecs-data-quality-dashboard-plugin": ["x-pack/plugins/ecs_data_quality_dashboard"], "@kbn/ecs-data-quality-dashboard-plugin/*": ["x-pack/plugins/ecs_data_quality_dashboard/*"], + "@kbn/elastic-agent-utils": ["packages/kbn-elastic-agent-utils"], + "@kbn/elastic-agent-utils/*": ["packages/kbn-elastic-agent-utils/*"], "@kbn/elastic-assistant": ["x-pack/packages/kbn-elastic-assistant"], "@kbn/elastic-assistant/*": ["x-pack/packages/kbn-elastic-assistant/*"], "@kbn/elastic-assistant-plugin": ["x-pack/plugins/elastic_assistant"], diff --git a/x-pack/plugins/apm/common/agent_configuration/setting_definitions/index.ts b/x-pack/plugins/apm/common/agent_configuration/setting_definitions/index.ts index d0ddc6b2f53cf..dbe1da9988851 100644 --- a/x-pack/plugins/apm/common/agent_configuration/setting_definitions/index.ts +++ b/x-pack/plugins/apm/common/agent_configuration/setting_definitions/index.ts @@ -12,7 +12,7 @@ import { PathReporter } from 'io-ts/lib/PathReporter'; import { AgentName } from '../../../typings/es_schemas/ui/fields/agent'; import { booleanRt } from '../runtime_types/boolean_rt'; import { getIntegerRt } from '../runtime_types/integer_rt'; -import { isRumOrMobileAgent } from '../../agent_name'; +import { isRumOrMobileAgentName } from '../../agent_name'; import { floatRt } from '../runtime_types/float_rt'; import { RawSettingDefinition, SettingDefinition } from './types'; import { generalSettings } from './general_settings'; @@ -106,7 +106,7 @@ export function filterByAgent(agentName?: AgentName) { // only options that apply to every agent (ignoring RUM) should be returned if (setting.excludeAgents) { - return setting.excludeAgents.every(isRumOrMobileAgent); + return setting.excludeAgents.every(isRumOrMobileAgentName); } return true; diff --git a/x-pack/plugins/apm/common/agent_name.test.ts b/x-pack/plugins/apm/common/agent_name.test.ts deleted file mode 100644 index 972ecb39fcecd..0000000000000 --- a/x-pack/plugins/apm/common/agent_name.test.ts +++ /dev/null @@ -1,213 +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 { - isJavaAgentName, - isRumAgentName, - isIosAgentName, - isAndroidAgentName, - isMobileAgentName, - isServerlessAgent, - isAWSLambdaAgent, - isAzureFunctionsAgent, -} from './agent_name'; - -import { ServerlessType } from './serverless'; - -describe('agent name helpers', () => { - describe('isJavaAgentName', () => { - describe('when the agent name is java', () => { - it('returns true', () => { - expect(isJavaAgentName('java')).toEqual(true); - }); - }); - - describe('when the agent name is opentelemetry/java', () => { - it('returns true', () => { - expect(isJavaAgentName('opentelemetry/java')).toEqual(true); - }); - }); - - describe('when the agent name is not java', () => { - it('returns false', () => { - expect(isJavaAgentName('not java')).toEqual(false); - }); - }); - }); - - describe('isRumAgentName', () => { - describe('when the agent name is js-base', () => { - it('returns true', () => { - expect(isRumAgentName('js-base')).toEqual(true); - }); - }); - - describe('when the agent name is rum-js', () => { - it('returns true', () => { - expect(isRumAgentName('rum-js')).toEqual(true); - }); - }); - - describe('when the agent name is opentelemetry/webjs', () => { - it('returns true', () => { - expect(isRumAgentName('opentelemetry/webjs')).toEqual(true); - }); - }); - - describe('when the agent name is something else', () => { - it('returns false', () => { - expect(isRumAgentName('not rum')).toEqual(false); - }); - }); - }); - - describe('isIosAgentName', () => { - describe('when the agent name is iOS/swift', () => { - it('returns true', () => { - expect(isIosAgentName('iOS/swift')).toEqual(true); - }); - }); - - describe('when the agent name is ios/swift', () => { - it('returns true', () => { - expect(isIosAgentName('ios/swift')).toEqual(true); - }); - }); - - describe('when the agent name is opentelemetry/swift', () => { - it('returns true', () => { - expect(isIosAgentName('opentelemetry/swift')).toEqual(false); - }); - }); - - describe('when the agent name is something else', () => { - it('returns false', () => { - expect(isIosAgentName('not ios')).toEqual(false); - }); - }); - }); - - describe('isAndroidAgentName', () => { - describe('when the agent name is android/java', () => { - it('returns true', () => { - expect(isAndroidAgentName('android/java')).toEqual(true); - }); - }); - - describe('when the agent name is opentelemetry/java', () => { - it('returns false', () => { - expect(isAndroidAgentName('opentelemetry/java')).toEqual(false); - }); - }); - - describe('when the agent name is something else', () => { - it('returns false', () => { - expect(isAndroidAgentName('not android')).toEqual(false); - }); - }); - }); - - describe('isMobileAgentName', () => { - describe('when the agent name is android/java', () => { - it('returns true', () => { - expect(isMobileAgentName('android/java')).toEqual(true); - }); - }); - - describe('when the agent name is iOS/swift', () => { - it('returns true', () => { - expect(isMobileAgentName('iOS/swift')).toEqual(true); - }); - }); - - describe('when the agent name is ios/swift', () => { - it('returns true', () => { - expect(isMobileAgentName('ios/swift')).toEqual(true); - }); - }); - - describe('when the agent name is opentelemetry/swift', () => { - it('returns true', () => { - expect(isMobileAgentName('opentelemetry/swift')).toEqual(false); - }); - }); - - describe('when the agent name is opentelemetry/java', () => { - it('returns false', () => { - expect(isMobileAgentName('opentelemetry/java')).toEqual(false); - }); - }); - - describe('when the agent name is something else', () => { - it('returns false', () => { - expect(isMobileAgentName('not mobile')).toEqual(false); - }); - }); - }); - - describe('isServerlessAgent', () => { - describe('when the serverlessType is AWS_LAMBDA', () => { - it('returns true', () => { - expect(isServerlessAgent(ServerlessType.AWS_LAMBDA)).toEqual(true); - }); - }); - - describe('when the serverlessType is AZURE_FUNCTIONS', () => { - it('returns true', () => { - expect(isServerlessAgent(ServerlessType.AZURE_FUNCTIONS)).toEqual(true); - }); - }); - - describe('when the serverlessType is undefined', () => { - it('returns false', () => { - expect(isServerlessAgent(undefined)).toEqual(false); - }); - }); - }); - - describe('isAWSLambdaAgent', () => { - describe('when the serverlessType is AWS_LAMBDA', () => { - it('returns true', () => { - expect(isAWSLambdaAgent(ServerlessType.AWS_LAMBDA)).toEqual(true); - }); - }); - - describe('when the serverlessType is AZURE_FUNCTIONS', () => { - it('returns true', () => { - expect(isAWSLambdaAgent(ServerlessType.AZURE_FUNCTIONS)).toEqual(false); - }); - }); - - describe('when the serverlessType is undefined', () => { - it('returns false', () => { - expect(isAWSLambdaAgent(undefined)).toEqual(false); - }); - }); - }); - - describe('isAzureFunctionsAgent', () => { - describe('when the serverlessType is AZURE_FUNCTIONS', () => { - it('returns true', () => { - expect(isAzureFunctionsAgent(ServerlessType.AZURE_FUNCTIONS)).toEqual( - true - ); - }); - }); - - describe('when the serverlessType is AWS_LAMBDA', () => { - it('returns true', () => { - expect(isAzureFunctionsAgent(ServerlessType.AWS_LAMBDA)).toEqual(false); - }); - }); - - describe('when the serverlessType is undefined', () => { - it('returns false', () => { - expect(isAzureFunctionsAgent(undefined)).toEqual(false); - }); - }); - }); -}); diff --git a/x-pack/plugins/apm/common/agent_name.ts b/x-pack/plugins/apm/common/agent_name.ts index 7782cc044e950..608fdf4975353 100644 --- a/x-pack/plugins/apm/common/agent_name.ts +++ b/x-pack/plugins/apm/common/agent_name.ts @@ -4,110 +4,20 @@ * 2.0; you may not use this file except in compliance with the Elastic License * 2.0. */ - -import { - AgentName, - OpenTelemetryAgentName, -} from '../typings/es_schemas/ui/fields/agent'; -import { ServerlessType } from './serverless'; - -/* - * Agent names can be any string. This list only defines the official agents - * that we might want to target specifically eg. linking to their documentation - * & telemetry reporting. Support additional agent types by appending - * definitions in mappings.json (for telemetry), the AgentName type, and the - * AGENT_NAMES array. - */ - -export const OPEN_TELEMETRY_AGENT_NAMES: AgentName[] = [ - 'otlp', - 'opentelemetry/cpp', - 'opentelemetry/dotnet', - 'opentelemetry/erlang', - 'opentelemetry/go', - 'opentelemetry/java', - 'opentelemetry/nodejs', - 'opentelemetry/php', - 'opentelemetry/python', - 'opentelemetry/ruby', - 'opentelemetry/rust', - 'opentelemetry/swift', - 'opentelemetry/webjs', -]; - -export const AGENT_NAMES: AgentName[] = [ - 'dotnet', - 'go', - 'iOS/swift', - 'java', - 'js-base', - 'nodejs', - 'php', - 'python', - 'ruby', - 'rum-js', - 'android/java', - ...OPEN_TELEMETRY_AGENT_NAMES, -]; - -export function isOpenTelemetryAgentName( - agentName: string -): agentName is OpenTelemetryAgentName { - return OPEN_TELEMETRY_AGENT_NAMES.includes(agentName as AgentName); -} - -export const JAVA_AGENT_NAMES: AgentName[] = ['java', 'opentelemetry/java']; - -export function isJavaAgentName( - agentName?: string -): agentName is 'java' | 'opentelemetry/java' { - return JAVA_AGENT_NAMES.includes(agentName! as AgentName); -} - -export const RUM_AGENT_NAMES: AgentName[] = [ - 'js-base', - 'rum-js', - 'opentelemetry/webjs', -]; - -export function isRumAgentName( - agentName?: string -): agentName is 'js-base' | 'rum-js' | 'opentelemetry/webjs' { - return RUM_AGENT_NAMES.includes(agentName! as AgentName); -} - -export function isMobileAgentName(agentName?: string) { - return isIosAgentName(agentName) || isAndroidAgentName(agentName); -} - -export function isRumOrMobileAgent(agentName?: string) { - return isRumAgentName(agentName) || isMobileAgentName(agentName); -} - -export function isIosAgentName(agentName?: string) { - const lowercased = agentName && agentName.toLowerCase(); - return lowercased === 'ios/swift'; -} - -export function isJRubyAgent(agentName?: string, runtimeName?: string) { - return agentName === 'ruby' && runtimeName?.toLowerCase() === 'jruby'; -} - -export function isServerlessAgent(serverlessType?: ServerlessType) { - return ( - isAWSLambdaAgent(serverlessType) || isAzureFunctionsAgent(serverlessType) - ); -} - -export function isAWSLambdaAgent(serverlessType?: ServerlessType) { - return serverlessType === ServerlessType.AWS_LAMBDA; -} - -export function isAzureFunctionsAgent(serverlessType?: ServerlessType) { - return serverlessType === ServerlessType.AZURE_FUNCTIONS; -} - -export function isAndroidAgentName(agentName?: string) { - const lowercased = agentName && agentName.toLowerCase(); - return lowercased === 'android/java'; -} +export { + OPEN_TELEMETRY_AGENT_NAMES, + AGENT_NAMES, + isOpenTelemetryAgentName, + JAVA_AGENT_NAMES, + isJavaAgentName, + RUM_AGENT_NAMES, + isRumAgentName, + isRumOrMobileAgentName, + isMobileAgentName, + isIosAgentName, + isJRubyAgentName, + isServerlessAgentName, + isAWSLambdaAgentName, + isAzureFunctionsAgentName, + isAndroidAgentName, +} from '@kbn/elastic-agent-utils'; diff --git a/x-pack/plugins/apm/common/service_inventory.ts b/x-pack/plugins/apm/common/service_inventory.ts index b3eeb1cbf8faf..f758bc083cf78 100644 --- a/x-pack/plugins/apm/common/service_inventory.ts +++ b/x-pack/plugins/apm/common/service_inventory.ts @@ -5,7 +5,7 @@ * 2.0. */ -import { AgentName } from '../typings/es_schemas/ui/fields/agent'; +import { AgentName } from '@kbn/elastic-agent-utils'; import { ServiceHealthStatus } from './service_health_status'; export interface ServiceListItem { diff --git a/x-pack/plugins/apm/public/components/app/metrics/index.tsx b/x-pack/plugins/apm/public/components/app/metrics/index.tsx index 5f290b4d4af86..0c70b6fd48d7f 100644 --- a/x-pack/plugins/apm/public/components/app/metrics/index.tsx +++ b/x-pack/plugins/apm/public/components/app/metrics/index.tsx @@ -8,8 +8,8 @@ import React from 'react'; import { isJavaAgentName, - isJRubyAgent, - isAWSLambdaAgent, + isJRubyAgentName, + isAWSLambdaAgentName, } from '../../../../common/agent_name'; import { useApmServiceContext } from '../../../context/apm_service/use_apm_service_context'; import { ServerlessMetrics } from './serverless_metrics'; @@ -20,7 +20,7 @@ import { hasDashboardFile } from './static_dashboard/helper'; export function Metrics() { const { agentName, runtimeName, serverlessType } = useApmServiceContext(); - const isAWSLambda = isAWSLambdaAgent(serverlessType); + const isAWSLambda = isAWSLambdaAgentName(serverlessType); if (isAWSLambda) { return ; @@ -44,7 +44,7 @@ export function Metrics() { if ( !isAWSLambda && - (isJavaAgentName(agentName) || isJRubyAgent(agentName, runtimeName)) + (isJavaAgentName(agentName) || isJRubyAgentName(agentName, runtimeName)) ) { return ; } diff --git a/x-pack/plugins/apm/public/components/app/metrics_details/index.tsx b/x-pack/plugins/apm/public/components/app/metrics_details/index.tsx index ffcba4d838971..99d3d8830ceb9 100644 --- a/x-pack/plugins/apm/public/components/app/metrics_details/index.tsx +++ b/x-pack/plugins/apm/public/components/app/metrics_details/index.tsx @@ -5,7 +5,7 @@ * 2.0. */ import React from 'react'; -import { isAWSLambdaAgent } from '../../../../common/agent_name'; +import { isAWSLambdaAgentName } from '../../../../common/agent_name'; import { useApmServiceContext } from '../../../context/apm_service/use_apm_service_context'; import { useApmParams } from '../../../hooks/use_apm_params'; import { ServerlessMetricsDetails } from './serverless_metrics_details'; @@ -17,7 +17,7 @@ export function MetricsDetails() { } = useApmParams('/services/{serviceName}/metrics/{id}'); const { serverlessType } = useApmServiceContext(); - if (isAWSLambdaAgent(serverlessType)) { + if (isAWSLambdaAgentName(serverlessType)) { return ; } diff --git a/x-pack/plugins/apm/public/components/app/service_groups/service_group_save/service_list_preview.tsx b/x-pack/plugins/apm/public/components/app/service_groups/service_group_save/service_list_preview.tsx index 66105c106805a..39f8ba7068abc 100644 --- a/x-pack/plugins/apm/public/components/app/service_groups/service_group_save/service_list_preview.tsx +++ b/x-pack/plugins/apm/public/components/app/service_groups/service_group_save/service_list_preview.tsx @@ -10,11 +10,11 @@ import { EuiFlexGroup, EuiFlexItem, } from '@elastic/eui'; +import { AgentIcon } from '@kbn/custom-icons'; import { i18n } from '@kbn/i18n'; import { orderBy } from 'lodash'; import React, { useCallback, useMemo, useState } from 'react'; import { ValuesType } from 'utility-types'; -import { AgentIcon } from '../../../shared/agent_icon'; import { APIReturnType } from '../../../../services/rest/create_call_apm_api'; import { unit } from '../../../../utils/style'; import { EnvironmentBadge } from '../../../shared/environment_badge'; @@ -93,7 +93,7 @@ export function ServiceListPreview({ items, isLoading }: Props) { content={ - + {serviceName} diff --git a/x-pack/plugins/apm/public/components/app/service_map/icons.ts b/x-pack/plugins/apm/public/components/app/service_map/icons.ts index 187a84cb6cca6..f784a737f8d67 100644 --- a/x-pack/plugins/apm/public/components/app/service_map/icons.ts +++ b/x-pack/plugins/apm/public/components/app/service_map/icons.ts @@ -5,13 +5,13 @@ * 2.0. */ +import { getAgentIcon } from '@kbn/custom-icons'; import cytoscape from 'cytoscape'; import { AGENT_NAME, SPAN_SUBTYPE, SPAN_TYPE, } from '../../../../common/es_fields/apm'; -import { getAgentIcon } from '../../shared/agent_icon/get_agent_icon'; import { getSpanIcon } from '../../shared/span_icon/get_span_icon'; export function iconForNode(node: cytoscape.NodeSingular) { 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 4a4e79b39c8e9..55972ede6e560 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 @@ -20,7 +20,7 @@ import { AgentName } from '../../../../typings/es_schemas/ui/fields/agent'; import { isOpenTelemetryAgentName, isRumAgentName, - isServerlessAgent, + isServerlessAgentName, } from '../../../../common/agent_name'; import { AnnotationsContextProvider } from '../../../context/annotations/annotations_context'; import { useApmServiceContext } from '../../../context/apm_service/use_apm_service_context'; @@ -60,7 +60,7 @@ export function ServiceOverview() { const { start, end } = useTimeRange({ rangeFrom, rangeTo }); const isRumAgent = isRumAgentName(agentName); const isOpenTelemetryAgent = isOpenTelemetryAgentName(agentName as AgentName); - const isServerless = isServerlessAgent(serverlessType); + const isServerless = isServerlessAgentName(serverlessType); const dependenciesLink = router.link('/services/{serviceName}/dependencies', { path: { diff --git a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/intance_details.tsx b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/intance_details.tsx index fac65a4485766..09b9e461ca1c0 100644 --- a/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/intance_details.tsx +++ b/x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/intance_details.tsx @@ -6,6 +6,11 @@ */ import { EuiFlexGroup, EuiFlexItem, EuiSkeletonText } from '@elastic/eui'; +import { + CloudProvider, + getAgentIcon, + getCloudProviderIcon, +} from '@kbn/custom-icons'; import { i18n } from '@kbn/i18n'; import { get } from 'lodash'; import React from 'react'; @@ -36,10 +41,9 @@ import { import { isPending } from '../../../../hooks/use_fetcher'; import { useTheme } from '../../../../hooks/use_theme'; import { APIReturnType } from '../../../../services/rest/create_call_apm_api'; -import { getAgentIcon } from '../../../shared/agent_icon/get_agent_icon'; import { KeyValueFilterList } from '../../../shared/key_value_filter_list'; import { pushNewItemToKueryBar } from '../../../shared/kuery_bar/utils'; -import { getCloudIcon, getContainerIcon } from '../../../shared/service_icons'; +import { getContainerIcon } from '../../../shared/service_icons'; import { useInstanceDetailsFetcher } from './use_instance_details_fetcher'; type ServiceInstanceDetails = @@ -175,7 +179,7 @@ export function InstanceDetails({ 'xpack.apm.serviceOverview.instanceTable.details.cloudTitle', { defaultMessage: 'Cloud' } )} - icon={getCloudIcon(data.cloud?.provider)} + icon={getCloudProviderIcon(data.cloud?.provider as CloudProvider)} keyValueList={cloudDetailsKeyValuePairs} onClickFilter={addKueryBarFilter} /> diff --git a/x-pack/plugins/apm/public/components/app/settings/agent_explorer/agent_list/index.tsx b/x-pack/plugins/apm/public/components/app/settings/agent_explorer/agent_list/index.tsx index 665d454c440fb..10d2cec27ee16 100644 --- a/x-pack/plugins/apm/public/components/app/settings/agent_explorer/agent_list/index.tsx +++ b/x-pack/plugins/apm/public/components/app/settings/agent_explorer/agent_list/index.tsx @@ -12,6 +12,7 @@ import { EuiIcon, EuiToolTip, } from '@elastic/eui'; +import { AgentIcon } from '@kbn/custom-icons'; import { i18n } from '@kbn/i18n'; import { isEmpty } from 'lodash'; import React, { useMemo, useState } from 'react'; @@ -20,7 +21,6 @@ import { AgentExplorerFieldName } from '../../../../../../common/agent_explorer' import { AgentName } from '../../../../../../typings/es_schemas/ui/fields/agent'; import { useApmPluginContext } from '../../../../../context/apm_plugin/use_apm_plugin_context'; import { APIReturnType } from '../../../../../services/rest/create_call_apm_api'; -import { AgentIcon } from '../../../../shared/agent_icon'; import { EnvironmentBadge } from '../../../../shared/environment_badge'; import { ItemsBadge } from '../../../../shared/item_badge'; import { ITableColumn, ManagedTable } from '../../../../shared/managed_table'; @@ -67,7 +67,10 @@ export function getAgentsColumns({ onAgentSelected(agent)} display={isSelected ? 'base' : 'empty'} @@ -96,7 +99,7 @@ export function getAgentsColumns({ content={ - + {serviceName} 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 1c3ea3bf7e5f0..0b9a1190b1e15 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 @@ -18,7 +18,7 @@ import { AggregatedTransactionsBadge } from '../../shared/aggregated_transaction import { TransactionCharts } from '../../shared/charts/transaction_charts'; import { replace } from '../../shared/links/url_helpers'; import { TransactionDetailsTabs } from './transaction_details_tabs'; -import { isServerlessAgent } from '../../../../common/agent_name'; +import { isServerlessAgentName } from '../../../../common/agent_name'; import { useLocalStorage } from '../../../hooks/use_local_storage'; import { SloCallout } from '../../shared/slo_callout'; @@ -63,7 +63,7 @@ export function TransactionDetails() { [apmRouter, path, query, transactionName] ); - const isServerless = isServerlessAgent(serverlessType); + const isServerless = isServerlessAgentName(serverlessType); const [sloCalloutDismissed, setSloCalloutDismissed] = useLocalStorage( 'apm.sloCalloutDismissed', false 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 9981533eead4f..372138c1273a9 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 @@ -8,7 +8,7 @@ import { EuiFlexGroup, EuiFlexItem, EuiPanel, EuiSpacer } from '@elastic/eui'; import React from 'react'; import { useHistory } from 'react-router-dom'; -import { isServerlessAgent } from '../../../../common/agent_name'; +import { isServerlessAgentName } from '../../../../common/agent_name'; import { useApmServiceContext } from '../../../context/apm_service/use_apm_service_context'; import { useApmParams } from '../../../hooks/use_apm_params'; import { useLocalStorage } from '../../../hooks/use_local_storage'; @@ -48,7 +48,7 @@ export function TransactionOverview() { replace(history, { query: { transactionType } }); } - const isServerless = isServerlessAgent(serverlessType); + const isServerless = isServerlessAgentName(serverlessType); const [sloCalloutDismissed, setSloCalloutDismissed] = useLocalStorage( 'apm.sloCalloutDismissed', diff --git a/x-pack/plugins/apm/public/components/fleet_integration/apm_agents/agent_instructions_accordion.tsx b/x-pack/plugins/apm/public/components/fleet_integration/apm_agents/agent_instructions_accordion.tsx index 3e4ddc36413c2..237b31219c820 100644 --- a/x-pack/plugins/apm/public/components/fleet_integration/apm_agents/agent_instructions_accordion.tsx +++ b/x-pack/plugins/apm/public/components/fleet_integration/apm_agents/agent_instructions_accordion.tsx @@ -18,12 +18,12 @@ import { i18n } from '@kbn/i18n'; import React, { ComponentType } from 'react'; import styled from 'styled-components'; import { Markdown, useKibana } from '@kbn/kibana-react-plugin/public'; +import { AgentIcon } from '@kbn/custom-icons'; import { AgentRuntimeAttachmentProps, CreateAgentInstructions, } from './agent_instructions_mappings'; import { AgentName } from '../../../../typings/es_schemas/ui/fields/agent'; -import { AgentIcon } from '../../shared/agent_icon'; import type { NewPackagePolicy, PackagePolicy, 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 b5261eb55826f..fa5e43980ce14 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 @@ -24,10 +24,10 @@ import { useHistory } from 'react-router-dom'; import { isMobileAgentName, isRumAgentName, - isAWSLambdaAgent, - isAzureFunctionsAgent, - isServerlessAgent, - isRumOrMobileAgent, + isAWSLambdaAgentName, + isAzureFunctionsAgentName, + isServerlessAgentName, + isRumOrMobileAgentName, } from '../../../../../common/agent_name'; import { useApmPluginContext } from '../../../../context/apm_plugin/use_apm_plugin_context'; import { ApmServiceContextProvider } from '../../../../context/apm_service/apm_service_context'; @@ -185,13 +185,13 @@ export function isMetricsTabHidden({ serverlessType?: ServerlessType; isAwsLambdaEnabled?: boolean; }) { - if (isAWSLambdaAgent(serverlessType)) { + if (isAWSLambdaAgentName(serverlessType)) { return !isAwsLambdaEnabled; } return ( !agentName || isRumAgentName(agentName) || - isAzureFunctionsAgent(serverlessType) + isAzureFunctionsAgentName(serverlessType) ); } @@ -207,7 +207,7 @@ export function isInfraTabHidden({ return ( !agentName || isRumAgentName(agentName) || - isServerlessAgent(serverlessType) || + isServerlessAgentName(serverlessType) || !isInfraTabAvailable ); } @@ -320,7 +320,7 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) { label: i18n.translate('xpack.apm.serviceDetails.metricsTabLabel', { defaultMessage: 'Metrics', }), - append: isServerlessAgent(serverlessType) && ( + append: isServerlessAgentName(serverlessType) && ( ), hidden: isMetricsTabHidden({ @@ -364,13 +364,13 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) { label: i18n.translate('xpack.apm.home.serviceLogsTabLabel', { defaultMessage: 'Logs', }), - append: isServerlessAgent(serverlessType) && ( + append: isServerlessAgentName(serverlessType) && ( ), hidden: !agentName || isRumAgentName(agentName) || - isAzureFunctionsAgent(serverlessType), + isAzureFunctionsAgentName(serverlessType), }, { key: 'alerts', @@ -408,8 +408,8 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) { }), hidden: !isProfilingAvailable || - isRumOrMobileAgent(agentName) || - isAWSLambdaAgent(serverlessType), + isRumOrMobileAgentName(agentName) || + isAWSLambdaAgentName(serverlessType), append: ( {i18n.translate('xpack.apm.universalProfiling.newLabel', { diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/agent_icon.stories.tsx b/x-pack/plugins/apm/public/components/shared/agent_icon/agent_icon.stories.tsx deleted file mode 100644 index be4dad7f1642a..0000000000000 --- a/x-pack/plugins/apm/public/components/shared/agent_icon/agent_icon.stories.tsx +++ /dev/null @@ -1,70 +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 { - EuiCard, - EuiFlexGroup, - EuiFlexItem, - EuiImage, - EuiToolTip, -} from '@elastic/eui'; -import type { Story } from '@storybook/react'; -import React from 'react'; -import { AGENT_NAMES } from '../../../../common/agent_name'; -import { getAgentIcon } from './get_agent_icon'; -import { AgentIcon } from '.'; -import { MockApmPluginStorybook } from '../../../context/apm_plugin/mock_apm_plugin_storybook'; - -export default { - title: 'shared/AgentIcon', - component: AgentIcon, -}; - -export const List: Story = () => { - return ( - - - {AGENT_NAMES.map((agentName) => { - return ( - - -

- - - -

- - } - title={agentName} - description={ -
- - - -
- } - /> - - ); - })} - - - ); -}; diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/get_serverless_icon.ts b/x-pack/plugins/apm/public/components/shared/agent_icon/get_serverless_icon.ts deleted file mode 100644 index 70af655b9f34d..0000000000000 --- a/x-pack/plugins/apm/public/components/shared/agent_icon/get_serverless_icon.ts +++ /dev/null @@ -1,25 +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 defaultIcon from '../span_icon/icons/default.svg'; -import lambdaIcon from './icons/lambda.svg'; -import azureFunctionsIcon from './icons/functions.svg'; -import { ServerlessType } from '../../../../common/serverless'; - -type ServerlessIcons = Record; - -const serverlessIcons: ServerlessIcons = { - 'aws.lambda': lambdaIcon, - 'azure.functions': azureFunctionsIcon, -}; - -export function getServerlessIcon(serverlessType?: ServerlessType) { - if (!serverlessType) { - return defaultIcon; - } - return serverlessIcons[serverlessType] ?? defaultIcon; -} diff --git a/x-pack/plugins/apm/public/components/shared/agent_icon/index.tsx b/x-pack/plugins/apm/public/components/shared/agent_icon/index.tsx deleted file mode 100644 index b995e2bbe7cfa..0000000000000 --- a/x-pack/plugins/apm/public/components/shared/agent_icon/index.tsx +++ /dev/null @@ -1,25 +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 { EuiIcon, EuiIconProps } from '@elastic/eui'; -import { AgentName } from '../../../../typings/es_schemas/ui/fields/agent'; -import { getAgentIcon } from './get_agent_icon'; -import { useTheme } from '../../../hooks/use_theme'; - -interface Props { - agentName?: AgentName; - size?: EuiIconProps['size']; -} - -export function AgentIcon(props: Props) { - const { agentName, size = 'l' } = props; - const theme = useTheme(); - const icon = getAgentIcon(agentName, theme.darkMode); - - return ; -} diff --git a/x-pack/plugins/apm/public/components/shared/critical_path_flamegraph/critical_path_flamegraph_tooltip.tsx b/x-pack/plugins/apm/public/components/shared/critical_path_flamegraph/critical_path_flamegraph_tooltip.tsx index e4687719cdfc3..3551bffd07f04 100644 --- a/x-pack/plugins/apm/public/components/shared/critical_path_flamegraph/critical_path_flamegraph_tooltip.tsx +++ b/x-pack/plugins/apm/public/components/shared/critical_path_flamegraph/critical_path_flamegraph_tooltip.tsx @@ -14,6 +14,7 @@ import { import React from 'react'; import { ProcessorEvent } from '@kbn/observability-plugin/common'; import { i18n } from '@kbn/i18n'; +import { AgentIcon } from '@kbn/custom-icons'; import type { CriticalPathResponse } from '../../../../server/routes/traces/get_aggregated_critical_path'; import { AGENT_NAME, @@ -25,7 +26,6 @@ import { TRANSACTION_TYPE, } from '../../../../common/es_fields/apm'; import { SpanIcon } from '../span_icon'; -import { AgentIcon } from '../agent_icon'; import { asPercent } from '../../../../common/utils/formatters'; export function CriticalPathFlamegraphTooltip({ @@ -86,7 +86,7 @@ export function CriticalPathFlamegraphTooltip({ - + {metadata[SERVICE_NAME]} diff --git a/x-pack/plugins/apm/public/components/shared/links/apm/service_link/index.tsx b/x-pack/plugins/apm/public/components/shared/links/apm/service_link/index.tsx index c3474f18d794c..4cf6363811f8f 100644 --- a/x-pack/plugins/apm/public/components/shared/links/apm/service_link/index.tsx +++ b/x-pack/plugins/apm/public/components/shared/links/apm/service_link/index.tsx @@ -6,6 +6,7 @@ */ import { EuiFlexGroup, EuiFlexItem, EuiLink, EuiText } from '@elastic/eui'; +import { AgentIcon } from '@kbn/custom-icons'; import { i18n } from '@kbn/i18n'; import { euiStyled } from '@kbn/kibana-react-plugin/common'; import { TypeOf } from '@kbn/typed-react-router-config'; @@ -16,7 +17,6 @@ import { AgentName } from '../../../../../../typings/es_schemas/ui/fields/agent' import { useApmRouter } from '../../../../../hooks/use_apm_router'; import { truncate, unit } from '../../../../../utils/style'; import { ApmRoutes } from '../../../../routing/apm_route_config'; -import { AgentIcon } from '../../../agent_icon'; import { PopoverTooltip } from '../../../popover_tooltip'; import { TruncateWithTooltip } from '../../../truncate_with_tooltip'; import { OTHER_SERVICE_NAME, MaxGroupsMessage } from '../max_groups_message'; @@ -88,7 +88,7 @@ export function ServiceLink({ > - + {serviceName} diff --git a/x-pack/plugins/apm/public/components/shared/service_icons/index.tsx b/x-pack/plugins/apm/public/components/shared/service_icons/index.tsx index a77c6b9c7c604..3ce8e3032db69 100644 --- a/x-pack/plugins/apm/public/components/shared/service_icons/index.tsx +++ b/x-pack/plugins/apm/public/components/shared/service_icons/index.tsx @@ -7,12 +7,16 @@ import { EuiFlexGroup, EuiFlexItem, EuiLoadingSpinner } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; +import { + CloudProvider, + getAgentIcon, + getCloudProviderIcon, + getServerlessIcon, +} from '@kbn/custom-icons'; import React, { ReactChild, useState } from 'react'; import { useTheme } from '../../../hooks/use_theme'; import { ContainerType } from '../../../../common/service_metadata'; import { FETCH_STATUS, useFetcher } from '../../../hooks/use_fetcher'; -import { getAgentIcon } from '../agent_icon/get_agent_icon'; -import { getServerlessIcon } from '../agent_icon/get_serverless_icon'; import { CloudDetails } from './cloud_details'; import { ServerlessDetails } from './serverless_details'; import { ContainerDetails } from './container_details'; @@ -21,7 +25,6 @@ import { IconPopover } from './icon_popover'; import { ServiceDetails } from './service_details'; import { ServerlessType } from '../../../../common/serverless'; import { isOpenTelemetryAgentName } from '../../../../common/agent_name'; -import openTelemetryIcon from '../agent_icon/icons/opentelemetry.svg'; interface Props { serviceName: string; @@ -30,12 +33,6 @@ interface Props { end: string; } -const cloudIcons: Record = { - gcp: 'logoGCP', - aws: 'logoAWS', - azure: 'logoAzure', -}; - function getServerlessTitle(serverlessType?: ServerlessType): string { switch (serverlessType) { case ServerlessType.AWS_LAMBDA: { @@ -56,12 +53,6 @@ function getServerlessTitle(serverlessType?: ServerlessType): string { } } -export function getCloudIcon(provider?: string) { - if (provider) { - return cloudIcons[provider]; - } -} - export function getContainerIcon(container?: ContainerType) { if (!container) { return; @@ -155,7 +146,7 @@ export function ServiceIcons({ start, end, serviceName, environment }: Props) { { key: 'opentelemetry', icon: { - type: openTelemetryIcon, + type: getAgentIcon('opentelemetry', theme.darkMode), }, isVisible: !!icons?.agentName && isOpenTelemetryAgentName(icons.agentName), @@ -197,7 +188,7 @@ export function ServiceIcons({ start, end, serviceName, environment }: Props) { { key: 'cloud', icon: { - type: getCloudIcon(icons?.cloudProvider), + type: getCloudProviderIcon(icons?.cloudProvider as CloudProvider), }, isVisible: !!icons?.cloudProvider, title: i18n.translate('xpack.apm.serviceIcons.cloud', { diff --git a/x-pack/plugins/apm/public/components/shared/span_icon/get_span_icon.ts b/x-pack/plugins/apm/public/components/shared/span_icon/get_span_icon.ts index 5c719d51d457e..8952c7b789777 100644 --- a/x-pack/plugins/apm/public/components/shared/span_icon/get_span_icon.ts +++ b/x-pack/plugins/apm/public/components/shared/span_icon/get_span_icon.ts @@ -5,6 +5,7 @@ * 2.0. */ +import { getAgentIcon } from '@kbn/custom-icons'; import { maybe } from '../../../../common/utils/maybe'; import awsIcon from './icons/aws.svg'; import cassandraIcon from './icons/cassandra.svg'; @@ -22,7 +23,6 @@ import mysqlIcon from './icons/mysql.svg'; import postgresqlIcon from './icons/postgresql.svg'; import redisIcon from './icons/redis.svg'; import websocketIcon from './icons/websocket.svg'; -import javaIcon from '../agent_icon/icons/java.svg'; import dynamodbIcon from './icons/dynamo_db.svg'; import sThreeIcon from './icons/s3.svg'; import snsIcon from './icons/sns.svg'; @@ -70,7 +70,7 @@ export const spanTypeIcons: { messaging: { azurequeue: storageQueueIcon, azureservicebus: serviceBusIcon, - jms: javaIcon, + jms: getAgentIcon('java'), kafka: kafkaIcon, sns: snsIcon, sqs: sqsIcon, diff --git a/x-pack/plugins/apm/server/lib/apm_telemetry/types.ts b/x-pack/plugins/apm/server/lib/apm_telemetry/types.ts index fc6cfe8d3ee47..e27486c1e6454 100644 --- a/x-pack/plugins/apm/server/lib/apm_telemetry/types.ts +++ b/x-pack/plugins/apm/server/lib/apm_telemetry/types.ts @@ -6,10 +6,7 @@ */ import { DeepPartial } from 'utility-types'; -import { - AgentName, - ElasticAgentName, -} from '../../../typings/es_schemas/ui/fields/agent'; +import { AgentName, ElasticAgentName } from '@kbn/elastic-agent-utils'; import { RollupInterval } from '../../../common/rollup'; export interface TimeframeMap { diff --git a/x-pack/plugins/apm/tsconfig.json b/x-pack/plugins/apm/tsconfig.json index 0c0e2780950ea..0acdd619492ce 100644 --- a/x-pack/plugins/apm/tsconfig.json +++ b/x-pack/plugins/apm/tsconfig.json @@ -103,6 +103,8 @@ "@kbn/monaco", "@kbn/shared-svg", "@kbn/deeplinks-observability", + "@kbn/custom-icons", + "@kbn/elastic-agent-utils", "@kbn/shared-ux-link-redirect-app" ], "exclude": ["target/**/*"] diff --git a/x-pack/plugins/apm/typings/es_schemas/ui/fields/agent.ts b/x-pack/plugins/apm/typings/es_schemas/ui/fields/agent.ts index 4f19793004815..5aaba852055bc 100644 --- a/x-pack/plugins/apm/typings/es_schemas/ui/fields/agent.ts +++ b/x-pack/plugins/apm/typings/es_schemas/ui/fields/agent.ts @@ -5,39 +5,13 @@ * 2.0. */ -export type ElasticAgentName = - | 'go' - | 'java' - | 'js-base' - | 'iOS/swift' - | 'rum-js' - | 'nodejs' - | 'python' - | 'dotnet' - | 'ruby' - | 'php' - | 'android/java'; +import type { AgentName } from '@kbn/elastic-agent-utils'; -export type OpenTelemetryAgentName = - | 'otlp' - | 'opentelemetry/cpp' - | 'opentelemetry/dotnet' - | 'opentelemetry/erlang' - | 'opentelemetry/go' - | 'opentelemetry/java' - | 'opentelemetry/nodejs' - | 'opentelemetry/php' - | 'opentelemetry/python' - | 'opentelemetry/ruby' - | 'opentelemetry/rust' - | 'opentelemetry/swift' - | 'opentelemetry/webjs'; - -/* - * Support additional agent types by appending definitions in mappings.json - * (for telemetry) and the AgentName type. - */ -export type AgentName = ElasticAgentName | OpenTelemetryAgentName; +export type { + ElasticAgentName, + OpenTelemetryAgentName, + AgentName, +} from '@kbn/elastic-agent-utils'; export interface Agent { ephemeral_id?: string; diff --git a/x-pack/plugins/infra/public/pages/metrics/hosts/components/table/entry_title.tsx b/x-pack/plugins/infra/public/pages/metrics/hosts/components/table/entry_title.tsx index b2fdcc1a1a734..0f6e65ef4c1d2 100644 --- a/x-pack/plugins/infra/public/pages/metrics/hosts/components/table/entry_title.tsx +++ b/x-pack/plugins/infra/public/pages/metrics/hosts/components/table/entry_title.tsx @@ -5,19 +5,13 @@ * 2.0. */ import React from 'react'; -import { EuiFlexGroup, EuiFlexItem, EuiIcon, EuiLink, EuiToolTip, IconType } from '@elastic/eui'; +import { EuiFlexGroup, EuiFlexItem, EuiLink, EuiToolTip } from '@elastic/eui'; import { useLinkProps } from '@kbn/observability-shared-plugin/public'; +import { CloudProviderIcon } from '@kbn/custom-icons'; import { useNodeDetailsRedirect } from '../../../../link_to'; -import type { CloudProvider, HostNodeRow } from '../../hooks/use_hosts_table'; +import type { HostNodeRow } from '../../hooks/use_hosts_table'; import { useUnifiedSearchContext } from '../../hooks/use_unified_search'; -const cloudIcons: Record = { - gcp: 'logoGCP', - aws: 'logoAWS', - azure: 'logoAzure', - unknownProvider: 'cloudSunny', -}; - interface EntryTitleProps { onClick: () => void; title: HostNodeRow['title']; @@ -40,7 +34,6 @@ export const EntryTitle = ({ onClick, title }: EntryTitleProps) => { }), }); - const iconType = (cloudProvider && cloudIcons[cloudProvider]) || cloudIcons.unknownProvider; const providerName = cloudProvider ?? 'Unknown'; return ( @@ -52,7 +45,7 @@ export const EntryTitle = ({ onClick, title }: EntryTitleProps) => { > - + diff --git a/x-pack/plugins/infra/public/pages/metrics/hosts/hooks/use_hosts_table.tsx b/x-pack/plugins/infra/public/pages/metrics/hosts/hooks/use_hosts_table.tsx index 290062a2f1d48..c1c4093d96e46 100644 --- a/x-pack/plugins/infra/public/pages/metrics/hosts/hooks/use_hosts_table.tsx +++ b/x-pack/plugins/infra/public/pages/metrics/hosts/hooks/use_hosts_table.tsx @@ -15,6 +15,7 @@ import { import createContainer from 'constate'; import { isEqual } from 'lodash'; import { isNumber } from 'lodash/fp'; +import { CloudProvider } from '@kbn/custom-icons'; import { hostLensFormulas } from '../../../../common/visualizations'; import { useKibanaContextForPlugin } from '../../../../hooks/use_kibana'; import { createInventoryMetricFormatter } from '../../inventory_view/lib/create_inventory_metric_formatter'; @@ -35,7 +36,6 @@ import { buildCombinedHostsFilter } from '../../../../utils/filters/build'; /** * Columns and items types */ -export type CloudProvider = 'gcp' | 'aws' | 'azure' | 'unknownProvider'; type HostMetrics = Record; interface HostMetadata { diff --git a/x-pack/plugins/infra/tsconfig.json b/x-pack/plugins/infra/tsconfig.json index e3b71afa57001..ea4fa7be6565f 100644 --- a/x-pack/plugins/infra/tsconfig.json +++ b/x-pack/plugins/infra/tsconfig.json @@ -74,7 +74,8 @@ "@kbn/expressions-plugin", "@kbn/chart-icons", "@kbn/advanced-settings-plugin", - "@kbn/cloud-plugin" + "@kbn/cloud-plugin", + "@kbn/custom-icons" ], "exclude": ["target/**/*"] } diff --git a/yarn.lock b/yarn.lock index bd88ca2c3e812..8016568cd10f5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4133,6 +4133,10 @@ version "0.0.0" uid "" +"@kbn/custom-icons@link:packages/kbn-custom-icons": + version "0.0.0" + uid "" + "@kbn/custom-integrations-plugin@link:src/plugins/custom_integrations": version "0.0.0" uid "" @@ -4305,6 +4309,10 @@ version "0.0.0" uid "" +"@kbn/elastic-agent-utils@link:packages/kbn-elastic-agent-utils": + version "0.0.0" + uid "" + "@kbn/elastic-assistant-plugin@link:x-pack/plugins/elastic_assistant": version "0.0.0" uid ""