[Dashboard] Fix add panels order of items !! (elastic#192082)

## Summary Fixes part of elastic#190853 !! Combines synthetics and SLO embeddables under common observability group !! ### After <img width="1728" alt="image" src="https://github.com/user-attachments/assets/5cc629c5-de10-4304-ad6e-da114a7927b6"> ### Before <img width="1716" alt="image" src="https://github.com/user-attachments/assets/9ed35068-46fd-4e50-80f7-de67529f8c79">
clintandrewhall · Sep 5, 2024 · fabe07d · fabe07d
1 parent 43a4a8c
commit fabe07d
Show file tree

Hide file tree

Showing 13 changed files with 31 additions and 43 deletions.
diff --git a/...public/embeddable/slo/common/constants.ts → ...lity_shared/common/embeddable_grouping.ts b/...public/embeddable/slo/common/constants.ts → ...lity_shared/common/embeddable_grouping.ts
@@ -4,17 +4,19 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
+
 import { i18n } from '@kbn/i18n';
 
-export const COMMON_SLO_GROUPING = [
+export const COMMON_OBSERVABILITY_GROUPING = [
   {
-    id: 'slos',
+    id: 'observability',
     getDisplayName: () =>
-      i18n.translate('xpack.slo.common.constants.grouping.legacy', {
+      i18n.translate('xpack.observabilityShared.common.constants.grouping', {
         defaultMessage: 'Observability',
       }),
     getIconType: () => {
-      return 'visGauge';
+      return 'online';
     },
+    order: -1,
   },
 ];
diff --git a/x-pack/plugins/observability_solution/observability_shared/common/index.ts b/x-pack/plugins/observability_solution/observability_shared/common/index.ts
@@ -188,3 +188,5 @@ export {
   TopNFunctionsLocatorDefinition,
   HOSTS_LOCATOR_ID,
 } from './locators';
+
+export { COMMON_OBSERVABILITY_GROUPING } from './embeddable_grouping';
diff --git a/x-pack/plugins/observability_solution/slo/public/ui_actions/create_alerts_panel_action.tsx b/x-pack/plugins/observability_solution/slo/public/ui_actions/create_alerts_panel_action.tsx
@@ -12,21 +12,21 @@ import {
   type UiActionsActionDefinition,
 } from '@kbn/ui-actions-plugin/public';
 import { EmbeddableApiContext } from '@kbn/presentation-publishing';
+import { COMMON_OBSERVABILITY_GROUPING } from '@kbn/observability-shared-plugin/common';
 import {
   ADD_SLO_ALERTS_ACTION_ID,
   SLO_ALERTS_EMBEDDABLE_ID,
 } from '../embeddable/slo/alerts/constants';
 import { SloPublicPluginsStart, SloPublicStart } from '..';
-import { COMMON_SLO_GROUPING } from '../embeddable/slo/common/constants';
 
 export function createAddAlertsPanelAction(
   getStartServices: CoreSetup<SloPublicPluginsStart, SloPublicStart>['getStartServices']
 ): UiActionsActionDefinition<EmbeddableApiContext> {
   return {
     id: ADD_SLO_ALERTS_ACTION_ID,
-    grouping: COMMON_SLO_GROUPING,
+    grouping: COMMON_OBSERVABILITY_GROUPING,
     getIconType: () => 'alert',
-    order: 20,
+    order: 10,
     isCompatible: async ({ embeddable }) => {
       return apiIsPresentationContainer(embeddable);
     },

diff --git a/...ck/plugins/observability_solution/slo/public/ui_actions/create_burn_rate_panel_action.tsx b/...ck/plugins/observability_solution/slo/public/ui_actions/create_burn_rate_panel_action.tsx
@@ -12,20 +12,20 @@ import {
   IncompatibleActionError,
   type UiActionsActionDefinition,
 } from '@kbn/ui-actions-plugin/public';
+import { COMMON_OBSERVABILITY_GROUPING } from '@kbn/observability-shared-plugin/common';
 import { SloPublicPluginsStart, SloPublicStart } from '..';
 import {
   ADD_BURN_RATE_ACTION_ID,
   SLO_BURN_RATE_EMBEDDABLE_ID,
 } from '../embeddable/slo/burn_rate/constants';
-import { COMMON_SLO_GROUPING } from '../embeddable/slo/common/constants';
 
 export function createBurnRatePanelAction(
   getStartServices: CoreSetup<SloPublicPluginsStart, SloPublicStart>['getStartServices']
 ): UiActionsActionDefinition<EmbeddableApiContext> {
   return {
     id: ADD_BURN_RATE_ACTION_ID,
-    grouping: COMMON_SLO_GROUPING,
-    order: 30,
+    grouping: COMMON_OBSERVABILITY_GROUPING,
+    order: 20,
     getIconType: () => 'visGauge',
     isCompatible: async ({ embeddable }) => {
       return apiIsPresentationContainer(embeddable);

diff --git a/x-pack/plugins/observability_solution/slo/public/ui_actions/create_error_budget_action.tsx b/x-pack/plugins/observability_solution/slo/public/ui_actions/create_error_budget_action.tsx
@@ -12,19 +12,19 @@ import {
   type UiActionsActionDefinition,
 } from '@kbn/ui-actions-plugin/public';
 import { EmbeddableApiContext } from '@kbn/presentation-publishing';
+import { COMMON_OBSERVABILITY_GROUPING } from '@kbn/observability-shared-plugin/common';
 import {
   ADD_SLO_ERROR_BUDGET_ACTION_ID,
   SLO_ERROR_BUDGET_ID,
 } from '../embeddable/slo/error_budget/constants';
 import { SloPublicPluginsStart, SloPublicStart } from '..';
-import { COMMON_SLO_GROUPING } from '../embeddable/slo/common/constants';
 export function createAddErrorBudgetPanelAction(
   getStartServices: CoreSetup<SloPublicPluginsStart, SloPublicStart>['getStartServices']
 ): UiActionsActionDefinition<EmbeddableApiContext> {
   return {
     id: ADD_SLO_ERROR_BUDGET_ACTION_ID,
-    grouping: COMMON_SLO_GROUPING,
-    order: 10,
+    grouping: COMMON_OBSERVABILITY_GROUPING,
+    order: 6,
     getIconType: () => 'visLine',
     isCompatible: async ({ embeddable }) => {
       return apiIsPresentationContainer(embeddable);

diff --git a/x-pack/plugins/observability_solution/slo/public/ui_actions/create_overview_panel_action.tsx b/x-pack/plugins/observability_solution/slo/public/ui_actions/create_overview_panel_action.tsx
@@ -12,20 +12,20 @@ import {
   type UiActionsActionDefinition,
 } from '@kbn/ui-actions-plugin/public';
 import { EmbeddableApiContext } from '@kbn/presentation-publishing';
+import { COMMON_OBSERVABILITY_GROUPING } from '@kbn/observability-shared-plugin/common';
 import {
   ADD_SLO_OVERVIEW_ACTION_ID,
   SLO_OVERVIEW_EMBEDDABLE_ID,
 } from '../embeddable/slo/overview/constants';
 import { SloPublicPluginsStart, SloPublicStart } from '..';
-import { COMMON_SLO_GROUPING } from '../embeddable/slo/common/constants';
 
 export function createOverviewPanelAction(
   getStartServices: CoreSetup<SloPublicPluginsStart, SloPublicStart>['getStartServices']
 ): UiActionsActionDefinition<EmbeddableApiContext> {
   return {
     id: ADD_SLO_OVERVIEW_ACTION_ID,
-    grouping: COMMON_SLO_GROUPING,
-    order: 30,
+    grouping: COMMON_OBSERVABILITY_GROUPING,
+    order: 20,
     getIconType: () => 'visGauge',
     isCompatible: async ({ embeddable }) => {
       return apiIsPresentationContainer(embeddable);

diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/embeddables/constants.ts b/x-pack/plugins/observability_solution/synthetics/public/apps/embeddables/constants.ts
@@ -5,22 +5,7 @@
  * 2.0.
  */
 
-import { i18n } from '@kbn/i18n';
-
 export const SYNTHETICS_STATS_OVERVIEW_EMBEDDABLE = 'SYNTHETICS_STATS_OVERVIEW_EMBEDDABLE';
 export const SYNTHETICS_MONITORS_EMBEDDABLE = 'SYNTHETICS_MONITORS_EMBEDDABLE';
 
-export const COMMON_SYNTHETICS_GROUPING = [
-  {
-    id: 'synthetics',
-    getDisplayName: () =>
-      i18n.translate('xpack.synthetics.common.constants.grouping.legacy', {
-        defaultMessage: 'Synthetics',
-      }),
-    getIconType: () => {
-      return 'online';
-    },
-  },
-];
-
 export const ALL_VALUE = '*';
diff --git a/...n/synthetics/public/apps/embeddables/ui_actions/create_monitors_overview_panel_action.tsx b/...n/synthetics/public/apps/embeddables/ui_actions/create_monitors_overview_panel_action.tsx
@@ -12,8 +12,9 @@ import {
 } from '@kbn/ui-actions-plugin/public';
 import { EmbeddableApiContext } from '@kbn/presentation-publishing';
 import type { StartServicesAccessor } from '@kbn/core-lifecycle-browser';
+import { COMMON_OBSERVABILITY_GROUPING } from '@kbn/observability-shared-plugin/common';
 import { ClientPluginsStart } from '../../../plugin';
-import { COMMON_SYNTHETICS_GROUPING, SYNTHETICS_MONITORS_EMBEDDABLE } from '../constants';
+import { SYNTHETICS_MONITORS_EMBEDDABLE } from '../constants';
 
 export const ADD_SYNTHETICS_MONITORS_OVERVIEW_ACTION_ID =
   'CREATE_SYNTHETICS_MONITORS_OVERVIEW_EMBEDDABLE';
@@ -23,8 +24,8 @@ export function createMonitorsOverviewPanelAction(
 ): UiActionsActionDefinition<EmbeddableApiContext> {
   return {
     id: ADD_SYNTHETICS_MONITORS_OVERVIEW_ACTION_ID,
-    grouping: COMMON_SYNTHETICS_GROUPING,
-    order: 30,
+    grouping: COMMON_OBSERVABILITY_GROUPING,
+    order: 5,
     getIconType: () => 'play',
     isCompatible: async ({ embeddable }) => {
       return apiIsPresentationContainer(embeddable);

diff --git a/...tion/synthetics/public/apps/embeddables/ui_actions/create_stats_overview_panel_action.tsx b/...tion/synthetics/public/apps/embeddables/ui_actions/create_stats_overview_panel_action.tsx
@@ -11,8 +11,9 @@ import {
 } from '@kbn/ui-actions-plugin/public';
 import { EmbeddableApiContext } from '@kbn/presentation-publishing';
 import type { StartServicesAccessor } from '@kbn/core-lifecycle-browser';
+import { COMMON_OBSERVABILITY_GROUPING } from '@kbn/observability-shared-plugin/common';
 import { ClientPluginsStart } from '../../../plugin';
-import { COMMON_SYNTHETICS_GROUPING, SYNTHETICS_STATS_OVERVIEW_EMBEDDABLE } from '../constants';
+import { SYNTHETICS_STATS_OVERVIEW_EMBEDDABLE } from '../constants';
 
 export const ADD_SYNTHETICS_OVERVIEW_ACTION_ID = 'CREATE_SYNTHETICS_STATS_OVERVIEW_EMBEDDABLE';
 
@@ -21,8 +22,8 @@ export function createStatusOverviewPanelAction(
 ): UiActionsActionDefinition<EmbeddableApiContext> {
   return {
     id: ADD_SYNTHETICS_OVERVIEW_ACTION_ID,
-    grouping: COMMON_SYNTHETICS_GROUPING,
-    order: 30,
+    grouping: COMMON_OBSERVABILITY_GROUPING,
+    order: 5,
     getIconType: () => 'online',
     isCompatible: async ({ embeddable }) => {
       const { compatibilityCheck } = await import('./compatibility_check');

diff --git a/x-pack/plugins/translations/translations/fr-FR.json b/x-pack/plugins/translations/translations/fr-FR.json
@@ -41526,7 +41526,6 @@
     "xpack.slo.burnRateRuleEditor.h5.chooseASLOToMonitorLabel": "Choisir un SLO pour monitorer",
     "xpack.slo.burnRateRuleEditor.h5.defineMultipleBurnRateLabel": "Définir des fenêtres du taux d'avancement multiples",
     "xpack.slo.burnRates.fromRange.label": "{duration}h",
-    "xpack.slo.common.constants.grouping.legacy": "Observabilité",
     "xpack.slo.create.errorNotification": "Un problème est survenu lors de la création de {name}",
     "xpack.slo.deleteConfirmationModal.cancelButtonLabel": "Annuler",
     "xpack.slo.deleteConfirmationModal.deleteAllButtonLabel": "Supprimer le SLO et toutes les instances",

diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json
@@ -41512,7 +41512,6 @@
     "xpack.slo.burnRateRuleEditor.h5.chooseASLOToMonitorLabel": "監視するSLOを選択",
     "xpack.slo.burnRateRuleEditor.h5.defineMultipleBurnRateLabel": "複数のバーンレート時間枠を定義",
     "xpack.slo.burnRates.fromRange.label": "{duration}h",
-    "xpack.slo.common.constants.grouping.legacy": "Observability",
     "xpack.slo.create.errorNotification": "{name}の作成中に問題が発生しました",
     "xpack.slo.deleteConfirmationModal.cancelButtonLabel": "キャンセル",
     "xpack.slo.deleteConfirmationModal.deleteAllButtonLabel": "SLOとすべてのインスタンスを削除",

diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json
@@ -41555,7 +41555,6 @@
     "xpack.slo.burnRateRuleEditor.h5.chooseASLOToMonitorLabel": "选择要监测的 SLO",
     "xpack.slo.burnRateRuleEditor.h5.defineMultipleBurnRateLabel": "定义多个消耗速度窗口",
     "xpack.slo.burnRates.fromRange.label": "{duration}h",
-    "xpack.slo.common.constants.grouping.legacy": "Observability",
     "xpack.slo.create.errorNotification": "创建 {name} 时出现问题",
     "xpack.slo.deleteConfirmationModal.cancelButtonLabel": "取消",
     "xpack.slo.deleteConfirmationModal.deleteAllButtonLabel": "删除 SLO 和所有实例",

diff --git a/x-pack/test/functional/apps/slo/embeddables/overview_embeddable.ts b/x-pack/test/functional/apps/slo/embeddables/overview_embeddable.ts
@@ -20,7 +20,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
   const sloUi = getService('sloUi');
   const dashboardAddPanel = getService('dashboardAddPanel');
 
-  describe('overview embeddable', function () {
+  describe('OverviewEmbeddable', function () {
     before(async () => {
       await loadTestData(getService);
       await slo.createUser();
@@ -40,7 +40,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
     describe('Single SLO', function () {
       it('should open SLO configuration flyout', async () => {
         await dashboardAddPanel.clickEditorMenuButton();
-        await dashboardAddPanel.verifyEmbeddableFactoryGroupExists('slos');
+        await dashboardAddPanel.verifyEmbeddableFactoryGroupExists('observability');
         await dashboardAddPanel.clickAddNewPanelFromUIActionLink('SLO Overview');
         await sloUi.common.assertSloOverviewConfigurationExists();
       });
@@ -68,7 +68,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
     describe('Group of SLOs', function () {
       it('can select Group Overview mode in the Flyout configuration', async () => {
         await dashboardAddPanel.clickEditorMenuButton();
-        await dashboardAddPanel.verifyEmbeddableFactoryGroupExists('slos');
+        await dashboardAddPanel.verifyEmbeddableFactoryGroupExists('observability');
         await dashboardAddPanel.clickAddNewPanelFromUIActionLink('SLO Overview');
         await sloUi.common.clickOverviewMode();
         await sloUi.common.assertSloConfigurationGroupOverviewModeIsSelected();