From 6e622e9c2b8342f7451b8607065e16da126c5e93 Mon Sep 17 00:00:00 2001
From: Nathan Reese <reese.nathan@elastic.co>
Date: Tue, 30 Jul 2024 12:45:03 -0600
Subject: [PATCH] remove @kbn/presentation-containers from synthetics page load
 bundle (#189533)

https://github.com/elastic/kibana/pull/189128 increases
@kbn/presentation-containers size. This causes synthetics page load
bundle to exceed the bundle size limit. Synthetics page load should not
include @kbn/presentation-containers. This PR resolves the problem by
putting @kbn/presentation-containers load behind an async import

Note for reviewers, put compatibility check into its own file to avoid
importing entire @kbn/presentation-containers
into async bundle. Tree shaking is enable by putting the import in a
seperate file - see
https://github.com/elastic/kibana/pull/189206#discussion_r1695763844 for
more details
---
 .../embeddables/ui_actions/compatibility_check.ts | 15 +++++++++++++++
 .../ui_actions/create_overview_panel_action.tsx   |  7 ++++---
 2 files changed, 19 insertions(+), 3 deletions(-)
 create mode 100644 x-pack/plugins/observability_solution/synthetics/public/apps/embeddables/ui_actions/compatibility_check.ts

diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/embeddables/ui_actions/compatibility_check.ts b/x-pack/plugins/observability_solution/synthetics/public/apps/embeddables/ui_actions/compatibility_check.ts
new file mode 100644
index 0000000000000..ff282745c8fc2
--- /dev/null
+++ b/x-pack/plugins/observability_solution/synthetics/public/apps/embeddables/ui_actions/compatibility_check.ts
@@ -0,0 +1,15 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { apiIsPresentationContainer, PresentationContainer } from '@kbn/presentation-containers';
+import { EmbeddableApiContext } from '@kbn/presentation-publishing';
+
+export const compatibilityCheck = (
+  api: EmbeddableApiContext['embeddable']
+): api is PresentationContainer => {
+  return apiIsPresentationContainer(api);
+};
diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/embeddables/ui_actions/create_overview_panel_action.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/embeddables/ui_actions/create_overview_panel_action.tsx
index 202a09e1f3576..79c6a6c1195a9 100644
--- a/x-pack/plugins/observability_solution/synthetics/public/apps/embeddables/ui_actions/create_overview_panel_action.tsx
+++ b/x-pack/plugins/observability_solution/synthetics/public/apps/embeddables/ui_actions/create_overview_panel_action.tsx
@@ -5,7 +5,6 @@
  * 2.0.
  */
 import { i18n } from '@kbn/i18n';
-import { apiIsPresentationContainer } from '@kbn/presentation-containers';
 import {
   IncompatibleActionError,
   type UiActionsActionDefinition,
@@ -34,10 +33,12 @@ export function createStatusOverviewPanelAction(): UiActionsActionDefinition<Emb
     order: 30,
     getIconType: () => 'online',
     isCompatible: async ({ embeddable }) => {
-      return apiIsPresentationContainer(embeddable);
+      const { compatibilityCheck } = await import('./compatibility_check');
+      return compatibilityCheck(embeddable);
     },
     execute: async ({ embeddable }) => {
-      if (!apiIsPresentationContainer(embeddable)) throw new IncompatibleActionError();
+      const { compatibilityCheck } = await import('./compatibility_check');
+      if (!compatibilityCheck(embeddable)) throw new IncompatibleActionError();
       try {
         embeddable.addNewPanel({
           panelType: SYNTHETICS_OVERVIEW_EMBEDDABLE,