[APM] Refactoring menu section (elastic#104338) (elastic#104358)

Co-authored-by: Cauê Marcondes <55978943+cauemarcondes@users.noreply.github.com>

x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/instance_actions_menu/menu_sections.ts

@@ -7,30 +7,17 @@
 
 import { i18n } from '@kbn/i18n';
 import { IBasePath } from 'kibana/public';
-import { isEmpty } from 'lodash';
 import moment from 'moment';
 import { APIReturnType } from '../../../../../services/rest/createCallApmApi';
 import { getInfraHref } from '../../../../shared/Links/InfraLink';
+import {
+  Action,
+  getNonEmptySections,
+  SectionRecord,
+} from '../../../../shared/transaction_action_menu/sections_helper';
 
 type InstaceDetails = APIReturnType<'GET /api/apm/services/{serviceName}/service_overview_instances/details/{serviceNodeName}'>;
 
-interface Action {
-  key: string;
-  label: string;
-  href?: string;
-  onClick?: () => void;
-  condition: boolean;
-}
-
-interface Section {
-  key: string;
-  title?: string;
-  subtitle?: string;
-  actions: Action[];
-}
-
-type SectionRecord = Record<string, Section[]>;
-
 function getInfraMetricsQuery(timestamp?: string) {
   if (!timestamp) {
     return { from: 0, to: 0 };
@@ -189,15 +176,5 @@ export function getMenuSections({
     apm: [{ key: 'apm', actions: apmActions }],
   };
 
-  // Filter out actions that shouldnt be shown and sections without any actions.
-  return Object.values(sectionRecord)
-    .map((sections) =>
-      sections
-        .map((section) => ({
-          ...section,
-          actions: section.actions.filter((action) => action.condition),
-        }))
-        .filter((section) => !isEmpty(section.actions))
-    )
-    .filter((sections) => !isEmpty(sections));
+  return getNonEmptySections(sectionRecord);
 }

x-pack/plugins/apm/public/components/shared/transaction_action_menu/sections.ts

@@ -17,6 +17,7 @@ import { getDiscoverHref } from '../Links/DiscoverLinks/DiscoverLink';
 import { getDiscoverQuery } from '../Links/DiscoverLinks/DiscoverTransactionLink';
 import { getInfraHref } from '../Links/InfraLink';
 import { fromQuery } from '../Links/url_helpers';
+import { SectionRecord, getNonEmptySections, Action } from './sections_helper';
 
 function getInfraMetricsQuery(transaction: Transaction) {
   const timestamp = new Date(transaction['@timestamp']).getTime();
@@ -28,22 +29,6 @@ function getInfraMetricsQuery(transaction: Transaction) {
   };
 }
 
-interface Action {
-  key: string;
-  label: string;
-  href: string;
-  condition: boolean;
-}
-
-interface Section {
-  key: string;
-  title?: string;
-  subtitle?: string;
-  actions: Action[];
-}
-
-type SectionRecord = Record<string, Section[]>;
-
 export const getSections = ({
   transaction,
   basePath,
@@ -296,14 +281,5 @@ export const getSections = ({
   };
 
   // Filter out actions that shouldnt be shown and sections without any actions.
-  return Object.values(sectionRecord)
-    .map((sections) =>
-      sections
-        .map((section) => ({
-          ...section,
-          actions: section.actions.filter((action) => action.condition),
-        }))
-        .filter((section) => !isEmpty(section.actions))
-    )
-    .filter((sections) => !isEmpty(sections));
+  return getNonEmptySections(sectionRecord);
 };

x-pack/plugins/apm/public/components/shared/transaction_action_menu/sections_helper.test.ts

@@ -0,0 +1,76 @@
+/*
+ * 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 { getNonEmptySections } from './sections_helper';
+
+describe('getNonEmptySections', () => {
+  it('returns empty when no section is available', () => {
+    expect(getNonEmptySections({})).toEqual([]);
+  });
+  it("returns empty when section doesn't have actions", () => {
+    expect(
+      getNonEmptySections({
+        foo: [
+          {
+            key: 'foo',
+            title: 'Foo',
+            subtitle: 'Foo bar',
+            actions: [],
+          },
+        ],
+      })
+    ).toEqual([]);
+  });
+
+  it('returns only sections with actions with condition true', () => {
+    expect(
+      getNonEmptySections({
+        foo: [
+          {
+            key: 'foo',
+            title: 'Foo',
+            subtitle: 'Foo bar',
+            actions: [],
+          },
+        ],
+        bar: [
+          {
+            key: 'bar',
+            title: 'Bar',
+            subtitle: 'Bar foo',
+            actions: [
+              {
+                key: 'bar_action',
+                label: 'Bar Action',
+                condition: true,
+              },
+              {
+                key: 'bar_action_2',
+                label: 'Bar Action 2',
+                condition: false,
+              },
+            ],
+          },
+        ],
+      })
+    ).toEqual([
+      [
+        {
+          key: 'bar',
+          title: 'Bar',
+          subtitle: 'Bar foo',
+          actions: [
+            {
+              key: 'bar_action',
+              label: 'Bar Action',
+              condition: true,
+            },
+          ],
+        },
+      ],
+    ]);
+  });
+});

x-pack/plugins/apm/public/components/shared/transaction_action_menu/sections_helper.ts

@@ -0,0 +1,39 @@
+/*
+ * 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 { isEmpty } from 'lodash';
+
+export interface Action {
+  key: string;
+  label: string;
+  href?: string;
+  onClick?: () => void;
+  condition: boolean;
+}
+
+interface Section {
+  key: string;
+  title?: string;
+  subtitle?: string;
+  actions: Action[];
+}
+
+export type SectionRecord = Record<string, Section[]>;
+
+/** Filter out actions that shouldnt be shown and sections without any actions. */
+export function getNonEmptySections(sectionRecord: SectionRecord) {
+  return Object.values(sectionRecord)
+    .map((sections) =>
+      sections
+        .map((section) => ({
+          ...section,
+          actions: section.actions.filter((action) => action.condition),
+        }))
+        .filter((section) => !isEmpty(section.actions))
+    )
+    .filter((sections) => !isEmpty(sections));
+}