[APM] Add Kibana setting to disable comparisons by default (#117413)

* fixing comparison

* fixing test name

* addressing pr comments

* addressing pr comments

* addressing pr changes

* fixing inf loop

* fixing ci

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

src/plugins/kibana_usage_collection/server/collectors/management/schema.ts

@@ -420,6 +420,10 @@ export const stackManagementSchema: MakeSchemaFrom<UsageStats> = {
     type: 'integer',
     _meta: { description: 'Non-default value of setting.' },
   },
+  'observability:enableComparisonByDefault': {
+    type: 'boolean',
+    _meta: { description: 'Non-default value of setting.' },
+  },
   'banners:placement': {
     type: 'keyword',
     _meta: { description: 'Non-default value of setting.' },

src/plugins/kibana_usage_collection/server/collectors/management/types.ts

@@ -37,6 +37,7 @@ export interface UsageStats {
   'securitySolution:rulesTableRefresh': string;
   'observability:enableInspectEsQueries': boolean;
   'observability:maxSuggestions': number;
+  'observability:enableComparisonByDefault': boolean;
   'visualize:enableLabs': boolean;
   'visualization:heatmap:maxBuckets': number;
   'visualization:colorMapping': string;

src/plugins/telemetry/schema/oss_plugins.json

@@ -7647,6 +7647,12 @@
             "description": "Non-default value of setting."
           }
         },
+        "observability:enableComparisonByDefault": {
+          "type": "boolean",
+          "_meta": {
+            "description": "Non-default value of setting."
+          }
+        },
         "banners:placement": {
           "type": "keyword",
           "_meta": {
@@ -9158,4 +9164,4 @@
       }
     }
   }
-}
+}

x-pack/plugins/apm/public/components/routing/home/index.tsx

@@ -69,6 +69,8 @@ export const home = {
       t.partial({
         refreshPaused: t.union([t.literal('true'), t.literal('false')]),
         refreshInterval: t.string,
+        comparisonEnabled: toBooleanRt,
+        comparisonType: comparisonTypeRt,
       }),
     ]),
   }),

x-pack/plugins/apm/public/components/routing/service_detail/index.tsx

@@ -135,6 +135,8 @@ export const serviceDetail = {
               t.partial({
                 traceId: t.string,
                 transactionId: t.string,
+                comparisonEnabled: toBooleanRt,
+                comparisonType: comparisonTypeRt,
               }),
             ]),
           }),

x-pack/plugins/apm/public/components/shared/Links/apm/transaction_detail_link.tsx

@@ -14,6 +14,7 @@ import { useLegacyUrlParams } from '../../../../context/url_params_context/use_u
 import { pickKeys } from '../../../../../common/utils/pick_keys';
 import { APMQueryParams } from '../url_helpers';
 import { useApmPluginContext } from '../../../../context/apm_plugin/use_apm_plugin_context';
+import { TimeRangeComparisonType } from '../../../../../common/runtime_types/comparison_type_rt';
 
 interface Props extends APMLinkExtendProps {
   serviceName: string;
@@ -23,6 +24,8 @@ interface Props extends APMLinkExtendProps {
   transactionType: string;
   latencyAggregationType?: string;
   environment?: string;
+  comparisonEnabled?: boolean;
+  comparisonType?: TimeRangeComparisonType;
 }
 
 const persistedFilters: Array<keyof APMQueryParams> = [
@@ -38,6 +41,8 @@ export function TransactionDetailLink({
   transactionType,
   latencyAggregationType,
   environment,
+  comparisonEnabled,
+  comparisonType,
   ...rest
 }: Props) {
   const { urlParams } = useLegacyUrlParams();
@@ -51,6 +56,8 @@ export function TransactionDetailLink({
       transactionId,
       transactionName,
       transactionType,
+      comparisonEnabled,
+      comparisonType,
       ...pickKeys(urlParams as APMQueryParams, ...persistedFilters),
       ...pickBy({ latencyAggregationType, environment }, identity),
     },

x-pack/plugins/apm/public/components/shared/time_comparison/get_comparison_enabled.test.ts

@@ -0,0 +1,59 @@
+/*
+ * 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 { CoreStart } from 'kibana/public';
+import { getComparisonEnabled } from './get_comparison_enabled';
+
+describe('getComparisonEnabled', () => {
+  function mockValues({
+    uiSettings,
+    urlComparisonEnabled,
+  }: {
+    uiSettings: boolean;
+    urlComparisonEnabled?: boolean;
+  }) {
+    return {
+      core: { uiSettings: { get: () => uiSettings } } as unknown as CoreStart,
+      urlComparisonEnabled,
+    };
+  }
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('returns false when kibana config is disabled and url is empty', () => {
+    const { core, urlComparisonEnabled } = mockValues({
+      uiSettings: false,
+      urlComparisonEnabled: undefined,
+    });
+    expect(getComparisonEnabled({ core, urlComparisonEnabled })).toBeFalsy();
+  });
+
+  it('returns true when kibana config is enabled and url is empty', () => {
+    const { core, urlComparisonEnabled } = mockValues({
+      uiSettings: true,
+      urlComparisonEnabled: undefined,
+    });
+    expect(getComparisonEnabled({ core, urlComparisonEnabled })).toBeTruthy();
+  });
+
+  it('returns true when defined as true in the url', () => {
+    const { core, urlComparisonEnabled } = mockValues({
+      uiSettings: false,
+      urlComparisonEnabled: true,
+    });
+    expect(getComparisonEnabled({ core, urlComparisonEnabled })).toBeTruthy();
+  });
+
+  it('returns false when defined as false in the url', () => {
+    const { core, urlComparisonEnabled } = mockValues({
+      uiSettings: true,
+      urlComparisonEnabled: false,
+    });
+    expect(getComparisonEnabled({ core, urlComparisonEnabled })).toBeFalsy();
+  });
+});

x-pack/plugins/apm/public/components/shared/time_comparison/get_comparison_enabled.ts

@@ -0,0 +1,22 @@
+/*
+ * 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 { CoreStart } from 'kibana/public';
+import { enableComparisonByDefault } from '../../../../../observability/public';
+
+export function getComparisonEnabled({
+  core,
+  urlComparisonEnabled,
+}: {
+  core: CoreStart;
+  urlComparisonEnabled?: boolean;
+}) {
+  const isEnabledByDefault = core.uiSettings.get<boolean>(
+    enableComparisonByDefault
+  );
+
+  return urlComparisonEnabled ?? isEnabledByDefault;
+}

x-pack/plugins/apm/public/components/shared/time_comparison/index.tsx

@@ -14,10 +14,12 @@ import { euiStyled } from '../../../../../../../src/plugins/kibana_react/common'
 import { useUiTracker } from '../../../../../observability/public';
 import { TimeRangeComparisonEnum } from '../../../../common/runtime_types/comparison_type_rt';
 import { useLegacyUrlParams } from '../../../context/url_params_context/use_url_params';
+import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_context';
 import { useApmParams } from '../../../hooks/use_apm_params';
 import { useBreakpoints } from '../../../hooks/use_breakpoints';
 import { useTimeRange } from '../../../hooks/use_time_range';
 import * as urlHelpers from '../../shared/Links/url_helpers';
+import { getComparisonEnabled } from './get_comparison_enabled';
 import { getComparisonTypes } from './get_comparison_types';
 import { getTimeRangeComparison } from './get_time_range_comparison';
 
@@ -113,6 +115,7 @@ export function getSelectOptions({
 }
 
 export function TimeComparison() {
+  const { core } = useApmPluginContext();
   const trackApmEvent = useUiTracker({ app: 'apm' });
   const history = useHistory();
   const { isSmall } = useBreakpoints();
@@ -138,7 +141,13 @@ export function TimeComparison() {
   if (comparisonEnabled === undefined || comparisonType === undefined) {
     urlHelpers.replace(history, {
       query: {
-        comparisonEnabled: comparisonEnabled === false ? 'false' : 'true',
+        comparisonEnabled:
+          getComparisonEnabled({
+            core,
+            urlComparisonEnabled: comparisonEnabled,
+          }) === false
+            ? 'false'
+            : 'true',
         comparisonType: comparisonType ? comparisonType : comparisonTypes[0],
       },
     });

x-pack/plugins/apm/public/components/shared/transactions_table/get_columns.tsx

@@ -15,6 +15,7 @@ import { i18n } from '@kbn/i18n';
 import React from 'react';
 import { ValuesType } from 'utility-types';
 import { LatencyAggregationType } from '../../../../common/latency_aggregation_types';
+import { TimeRangeComparisonType } from '../../../../common/runtime_types/comparison_type_rt';
 import {
   asMillisecondDuration,
   asPercent,
@@ -42,12 +43,14 @@ export function getColumns({
   transactionGroupDetailedStatistics,
   comparisonEnabled,
   shouldShowSparkPlots = true,
+  comparisonType,
 }: {
   serviceName: string;
   latencyAggregationType?: LatencyAggregationType;
   transactionGroupDetailedStatistics?: TransactionGroupDetailedStatistics;
   comparisonEnabled?: boolean;
   shouldShowSparkPlots?: boolean;
+  comparisonType?: TimeRangeComparisonType;
 }): Array<EuiBasicTableColumn<ServiceTransactionGroupItem>> {
   return [
     {
@@ -67,6 +70,8 @@ export function getColumns({
                 transactionName={name}
                 transactionType={type}
                 latencyAggregationType={latencyAggregationType}
+                comparisonEnabled={comparisonEnabled}
+                comparisonType={comparisonType}
               >
                 {name}
               </TransactionDetailLink>

x-pack/plugins/apm/public/components/shared/transactions_table/index.tsx

@@ -222,6 +222,7 @@ export function TransactionsTable({
     transactionGroupDetailedStatistics,
     comparisonEnabled,
     shouldShowSparkPlots,
+    comparisonType,
   });
 
   const isLoading = status === FETCH_STATUS.LOADING;

x-pack/plugins/observability/common/index.ts

@@ -6,7 +6,11 @@
  */
 
 export type { AsDuration, AsPercent } from './utils/formatters';
-export { enableInspectEsQueries, maxSuggestions } from './ui_settings_keys';
+export {
+  enableInspectEsQueries,
+  maxSuggestions,
+  enableComparisonByDefault,
+} from './ui_settings_keys';
 
 export const casesFeatureId = 'observabilityCases';
 

x-pack/plugins/observability/common/ui_settings_keys.ts

@@ -7,3 +7,4 @@
 
 export const enableInspectEsQueries = 'observability:enableInspectEsQueries';
 export const maxSuggestions = 'observability:maxSuggestions';
+export const enableComparisonByDefault = 'observability:enableComparisonByDefault';

x-pack/plugins/observability/public/index.ts

@@ -85,3 +85,5 @@ export type { ExploratoryEmbeddableProps } from './components/shared/exploratory
 export type { AddInspectorRequest } from './context/inspector/inspector_context';
 export { InspectorContextProvider } from './context/inspector/inspector_context';
 export { useInspectorContext } from './context/inspector/use_inspector_context';
+
+export { enableComparisonByDefault } from '../common/ui_settings_keys';

x-pack/plugins/observability/server/ui_settings.ts

@@ -9,7 +9,11 @@ import { schema } from '@kbn/config-schema';
 import { i18n } from '@kbn/i18n';
 import { UiSettingsParams } from '../../../../src/core/types';
 import { observabilityFeatureId } from '../common';
-import { enableInspectEsQueries, maxSuggestions } from '../common/ui_settings_keys';
+import {
+  enableComparisonByDefault,
+  enableInspectEsQueries,
+  maxSuggestions,
+} from '../common/ui_settings_keys';
 
 /**
  * uiSettings definitions for Observability.
@@ -37,4 +41,15 @@ export const uiSettings: Record<string, UiSettingsParams<boolean | number>> = {
     }),
     schema: schema.number(),
   },
+  [enableComparisonByDefault]: {
+    category: [observabilityFeatureId],
+    name: i18n.translate('xpack.observability.enableComparisonByDefault', {
+      defaultMessage: 'Comparison feature',
+    }),
+    value: true,
+    description: i18n.translate('xpack.observability.enableComparisonByDefaultDescription', {
+      defaultMessage: 'Enable the comparison feature on APM UI',
+    }),
+    schema: schema.boolean(),
+  },
 };