[Synthetics] Check if license management plugin is enabled before linking (#178773)

## Summary

Resolves #153030.

Essentially, we add `licenseManagement` as an optional dep, and check if
it's enabled before we link to it.

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>

x-pack/plugins/observability_solution/synthetics/kibana.jsonc

@@ -42,7 +42,8 @@
       "ml",
       "serverless",
       "spaces",
-      "telemetry"
+      "telemetry",
+      "licenseManagement"
     ],
     "requiredBundles": [
       "data",

x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/hooks/use_synthetics_priviliges.test.tsx

@@ -0,0 +1,57 @@
+/*
+ * 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 { renderHook } from '@testing-library/react-hooks';
+import React from 'react';
+import { render, WrappedHelper } from '../utils/testing';
+import { useSyntheticsPrivileges } from './use_synthetics_priviliges';
+
+jest.mock('../../../hooks/use_capabilities', () => ({
+  useCanReadSyntheticsIndex: jest.fn().mockReturnValue({ canRead: true, loading: false }),
+}));
+
+jest.mock('react-redux', () => {
+  const actual = jest.requireActual('react-redux');
+  return {
+    ...actual,
+    useSelector: jest.fn().mockReturnValue({ error: { body: { message: 'License not active' } } }),
+  };
+});
+
+function wrapper({ children }: { children: React.ReactElement }) {
+  return <WrappedHelper>{children}</WrappedHelper>;
+}
+
+describe('useSyntheticsPrivileges', () => {
+  it.each([
+    [true, null],
+    [false, ''],
+  ])(
+    'should correctly set the disabled prop of the license nav button if `licenseManagement` enabled is %s',
+    (enabled, expectedDisabledAttribute) => {
+      const {
+        result: { current },
+      } = renderHook(() => useSyntheticsPrivileges(), { wrapper });
+
+      expect(current).not.toBeUndefined();
+
+      const { getByLabelText } = render(current!, {
+        core: {
+          licenseManagement: { enabled },
+        },
+      });
+
+      const licenseNavButton = getByLabelText('Navigate to license management');
+
+      expect(licenseNavButton);
+
+      // there should only be an href if the license management is enabled, otherwise we render a disabled button with no handler
+      expect(!!licenseNavButton.getAttribute('href')).toEqual(enabled);
+      expect(licenseNavButton.getAttribute('disabled')).toEqual(expectedDisabledAttribute);
+    }
+  );
+});

x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/hooks/use_synthetics_priviliges.tsx

@@ -16,6 +16,7 @@ import {
   EuiMarkdownFormat,
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
+import { useKibana } from '@kbn/kibana-react-plugin/public';
 import { css } from '@emotion/react';
 import { i18n } from '@kbn/i18n';
 import { selectOverviewStatus } from '../state/overview_status';
@@ -27,6 +28,7 @@ import {
   SYNTHETICS_INDEX_PATTERN,
 } from '../../../../common/constants';
 import { useSyntheticsSettingsContext } from '../contexts';
+import { ClientPluginsStart } from '../../../plugin';
 
 export const useSyntheticsPrivileges = () => {
   const { canRead: canReadSyntheticsIndex, loading: isCanReadLoading } =
@@ -107,7 +109,11 @@ const Unprivileged = ({ unprivilegedIndices }: { unprivilegedIndices: string[] }
 );
 
 const LicenseExpired = () => {
+  const licenseManagementEnabled =
+    useKibana<ClientPluginsStart>().services.licenseManagement?.enabled;
+
   const { basePath } = useSyntheticsSettingsContext();
+
   return (
     <EuiEmptyPrompt
       data-test-subj="syntheticsUnprivileged"
@@ -131,7 +137,11 @@ const LicenseExpired = () => {
       }
       actions={[
         <EuiButton
+          aria-label={i18n.translate('xpack.synthetics.invalidLicense.manageYourLicenseButton', {
+            defaultMessage: 'Navigate to license management',
+          })}
           data-test-subj="apmInvalidLicenseNotificationManageYourLicenseButton"
+          isDisabled={!licenseManagementEnabled}
           href={basePath + '/app/management/stack/license_management'}
         >
           {i18n.translate('xpack.synthetics.invalidLicense.licenseManagementLink', {

x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/routes.tsx

@@ -188,7 +188,7 @@ export const PageRouter: FC = () => {
 
   apiService.addInspectorRequest = addInspectorRequest;
 
-  const isUnPrivileged = useSyntheticsPrivileges();
+  const isUnprivileged = useSyntheticsPrivileges();
 
   return (
     <Routes>
@@ -205,12 +205,12 @@ export const PageRouter: FC = () => {
             <div className={APP_WRAPPER_CLASS} data-test-subj={dataTestSubj}>
               <RouteInit title={title} path={path} />
               <SyntheticsPageTemplateComponent
-                pageHeader={isUnPrivileged ? undefined : pageHeader}
+                pageHeader={isUnprivileged ? undefined : pageHeader}
                 data-test-subj={'synthetics-page-template'}
                 isPageDataLoaded={true}
                 {...pageTemplateProps}
               >
-                {isUnPrivileged || <RouteComponent />}
+                {isUnprivileged || <RouteComponent />}
               </SyntheticsPageTemplateComponent>
             </div>
           </Route>

x-pack/plugins/observability_solution/synthetics/public/plugin.ts

@@ -50,6 +50,7 @@ import type {
   ObservabilitySharedPluginSetup,
   ObservabilitySharedPluginStart,
 } from '@kbn/observability-shared-plugin/public';
+import { LicenseManagementUIPluginSetup } from '@kbn/license-management-plugin/public/plugin';
 import {
   ObservabilityAIAssistantPublicSetup,
   ObservabilityAIAssistantPublicStart,
@@ -100,6 +101,7 @@ export interface ClientPluginsStart {
   uiSettings: CoreStart['uiSettings'];
   usageCollection: UsageCollectionStart;
   serverless: ServerlessPluginStart;
+  licenseManagement?: LicenseManagementUIPluginSetup;
 }
 
 export interface UptimePluginServices extends Partial<CoreStart> {

x-pack/plugins/observability_solution/synthetics/tsconfig.json

@@ -84,7 +84,8 @@
     "@kbn/code-editor-mock",
     "@kbn/serverless",
     "@kbn/repo-info",
-    "@kbn/index-management-plugin"
+    "@kbn/index-management-plugin",
+    "@kbn/license-management-plugin"
   ],
   "exclude": ["target/**/*"]
 }