[APM] getInjectedVars shim (elastic#51635)

* [APM] getInjectedVars shim

Set up the APM public NP plugin to expose the config variables on its context,
and replace use of getInjectedVars with that.

Since we're not yet running as an NP plugin, we don't get passed a `pluginInitializerContext`,
so we use a shim in the plugin setup that gets the config values from injected vars for the time being.

Also:

* Move toggle app link in nav shim to plugin setup
* Replace the routes exported from Main/route_config with a function that takes a configuration object

x-pack/legacy/plugins/apm/index.ts

@@ -43,7 +43,6 @@ export const apm: LegacyPluginInitializer = kibana => {
  apmServiceMapEnabled: config.get('xpack.apm.serviceMapEnabled')
  };
  },
- hacks: ['plugins/apm/hacks/toggle_app_link_in_nav'],
  savedObjectSchemas: {
  'apm-services-telemetry': {
  isNamespaceAgnostic: true

x-pack/legacy/plugins/apm/public/components/app/Home/Home.test.tsx

@@ -7,8 +7,13 @@
 import { shallow } from 'enzyme';
 import React from 'react';
 import { Home } from '../Home';
+import * as plugin from '../../../new-platform/plugin';
 
-jest.mock('ui/new_platform');
+jest.spyOn(plugin, 'usePlugins').mockReturnValue(({
+ apm: { config: {} as plugin.ConfigSchema }
+} as unknown) as plugin.ApmPluginStartDeps & {
+ apm: { config: plugin.ConfigSchema };
+});
 
 describe('Home component', () => {
  it('should render services', () => {

x-pack/legacy/plugins/apm/public/components/app/Home/index.tsx

@@ -13,7 +13,6 @@ import {
  EuiSpacer
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
-import { npStart } from 'ui/new_platform';
 import React from 'react';
 import { $ElementType } from 'utility-types';
 import { ApmHeader } from '../../shared/ApmHeader';
@@ -26,46 +25,54 @@ import { EuiTabLink } from '../../shared/EuiTabLink';
 import { SettingsLink } from '../../shared/Links/apm/SettingsLink';
 import { ServiceMapLink } from '../../shared/Links/apm/ServiceMapLink';
 import { ServiceMap } from '../ServiceMap';
+import { usePlugins } from '../../../new-platform/plugin';
 
-const homeTabs = [
- {
- link: (
- <ServiceOverviewLink>
- {i18n.translate('xpack.apm.home.servicesTabLabel', {
- defaultMessage: 'Services'
- })}
- </ServiceOverviewLink>
- ),
- render: () => <ServiceOverview />,
- name: 'services'
- },
- {
- link: (
- <TraceOverviewLink>
- {i18n.translate('xpack.apm.home.tracesTabLabel', {
- defaultMessage: 'Traces'
- })}
- </TraceOverviewLink>
- ),
- render: () => <TraceOverview />,
- name: 'traces'
+function getHomeTabs({
+ apmServiceMapEnabled = false
+}: {
+ apmServiceMapEnabled: boolean;
+}) {
+ const homeTabs = [
+ {
+ link: (
+ <ServiceOverviewLink>
+ {i18n.translate('xpack.apm.home.servicesTabLabel', {
+ defaultMessage: 'Services'
+ })}
+ </ServiceOverviewLink>
+ ),
+ render: () => <ServiceOverview />,
+ name: 'services'
+ },
+ {
+ link: (
+ <TraceOverviewLink>
+ {i18n.translate('xpack.apm.home.tracesTabLabel', {
+ defaultMessage: 'Traces'
+ })}
+ </TraceOverviewLink>
+ ),
+ render: () => <TraceOverview />,
+ name: 'traces'
+ }
+ ];
+
+ if (apmServiceMapEnabled) {
+ homeTabs.push({
+ link: (
+ <ServiceMapLink>
+ {i18n.translate('xpack.apm.home.serviceMapTabLabel', {
+ defaultMessage: 'Service Map'
+ })}
+ </ServiceMapLink>
+ ),
+ render: () => <ServiceMap />,
+ name: 'service-map'
+ });
  }
-];
 
-if (npStart.core.injectedMetadata.getInjectedVar('apmServiceMapEnabled')) {
- homeTabs.push({
- link: (
- <ServiceMapLink>
- {i18n.translate('xpack.apm.home.serviceMapTabLabel', {
- defaultMessage: 'Service Map'
- })}
- </ServiceMapLink>
- ),
- render: () => <ServiceMap />,
- name: 'service-map'
- });
+ return homeTabs;
 }
-
 const SETTINGS_LINK_LABEL = i18n.translate('xpack.apm.settingsLinkLabel', {
  defaultMessage: 'Settings'
 });
@@ -75,6 +82,9 @@ interface Props {
 }
 
 export function Home({ tab }: Props) {
+ const { apm } = usePlugins();
+ const { apmServiceMapEnabled } = apm.config;
+ const homeTabs = getHomeTabs({ apmServiceMapEnabled });
  const selectedTab = homeTabs.find(
  homeTab => homeTab.name === tab
  ) as $ElementType<typeof homeTabs, number>;

x-pack/legacy/plugins/apm/public/components/app/Main/UpdateBreadcrumbs.tsx

@@ -9,8 +9,11 @@ import React from 'react';
 import { LegacyCoreStart } from 'src/core/public';
 import { useKibanaCore } from '../../../../../observability/public';
 import { getAPMHref } from '../../shared/Links/apm/APMLink';
-import { Breadcrumb, ProvideBreadcrumbs } from './ProvideBreadcrumbs';
-import { routes } from './route_config';
+import {
+ Breadcrumb,
+ ProvideBreadcrumbs,
+ BreadcrumbRoute
+} from './ProvideBreadcrumbs';
 
 interface Props {
  location: Location;
@@ -49,7 +52,11 @@ class UpdateBreadcrumbsComponent extends React.Component<Props> {
  }
 }
 
-export function UpdateBreadcrumbs() {
+interface UpdateBreadcrumbsProps {
+ routes: BreadcrumbRoute[];
+}
+
+export function UpdateBreadcrumbs({ routes }: UpdateBreadcrumbsProps) {
  const core = useKibanaCore();
  return (
  <ProvideBreadcrumbs

x-pack/legacy/plugins/apm/public/components/app/Main/__test__/UpdateBreadcrumbs.test.js

@@ -9,8 +9,9 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import { UpdateBreadcrumbs } from '../UpdateBreadcrumbs';
 import * as kibanaCore from '../../../../../../observability/public/context/kibana_core';
+import { getRoutes } from '../route_config';
 
-jest.mock('ui/new_platform');
+jest.mock('ui/index_patterns');
 
 const coreMock = {
  chrome: {
@@ -20,10 +21,12 @@ const coreMock = {
 
 jest.spyOn(kibanaCore, 'useKibanaCore').mockReturnValue(coreMock);
 
+const routes = getRoutes({ apmServiceMapEnabled: true });
+
 function expectBreadcrumbToMatchSnapshot(route, params = '') {
  mount(
  <MemoryRouter initialEntries={[`${route}?kuery=myKuery&${params}`]}>
- <UpdateBreadcrumbs />
+ <UpdateBreadcrumbs routes={routes} />
  </MemoryRouter>
  );
  expect(coreMock.chrome.setBreadcrumbs).toHaveBeenCalledTimes(1);