[Maps] show icon when layer is filtered by time and allow layers to i…

…gnore global time range (#83006) (#83067) * [Maps] show icon when layer is filtered by time and allow layers to ignore global time range * show icon if layer is narrowed by time fitler * tslint * apply global time to source check box * apply global time to join check box * tslint and jest expect updates * one more tslint fix * tslint, fix apm jest test, update time filter icon when disabling applyGlobalTime Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
elastic · Nov 10, 2020 · 6282389 · 6282389
1 parent 20860c7
commit 6282389
Show file tree

Hide file tree

Showing 32 changed files with 553 additions and 376 deletions.
diff --git a/...components/app/RumDashboard/VisitorBreakdownMap/__tests__/__mocks__/regions_layer.mock.ts b/...components/app/RumDashboard/VisitorBreakdownMap/__tests__/__mocks__/regions_layer.mock.ts
@@ -21,6 +21,8 @@ export const mockLayerList = [
       {
         leftField: 'iso2',
         right: {
+          applyGlobalQuery: true,
+          applyGlobalTime: true,
           type: 'ES_TERM_SOURCE',
           id: '3657625d-17b0-41ef-99ba-3a2b2938655c',
           indexPatternTitle: 'apm-*',
@@ -38,15 +40,13 @@ export const mockLayerList = [
             },
           ],
           indexPatternId: 'apm_static_index_pattern_id',
-          applyGlobalQuery: true,
         },
       },
     ],
     sourceDescriptor: {
       type: 'EMS_FILE',
       id: 'world_countries',
       tooltipProperties: ['name'],
-      applyGlobalQuery: true,
     },
     style: {
       type: 'VECTOR',
@@ -96,6 +96,8 @@ export const mockLayerList = [
       {
         leftField: 'region_iso_code',
         right: {
+          applyGlobalQuery: true,
+          applyGlobalTime: true,
           type: 'ES_TERM_SOURCE',
           id: 'e62a1b9c-d7ff-4fd4-a0f6-0fdc44bb9e41',
           indexPatternTitle: 'apm-*',

diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/useLayerList.ts b/x-pack/plugins/apm/public/components/app/RumDashboard/VisitorBreakdownMap/useLayerList.ts
@@ -43,6 +43,7 @@ const ES_TERM_SOURCE_COUNTRY: ESTermSourceDescriptor = {
   ],
   indexPatternId: APM_STATIC_INDEX_PATTERN_ID,
   applyGlobalQuery: true,
+  applyGlobalTime: true,
 };
 
 const ES_TERM_SOURCE_REGION: ESTermSourceDescriptor = {
@@ -56,6 +57,8 @@ const ES_TERM_SOURCE_REGION: ESTermSourceDescriptor = {
     language: 'kuery',
   },
   indexPatternId: APM_STATIC_INDEX_PATTERN_ID,
+  applyGlobalQuery: true,
+  applyGlobalTime: true,
 };
 
 const getWhereQuery = (serviceName: string) => {
@@ -158,7 +161,6 @@ export function useLayerList() {
       type: 'EMS_FILE',
       id: 'world_countries',
       tooltipProperties: [COUNTRY_NAME],
-      applyGlobalQuery: true,
     },
     style: getLayerStyle(TRANSACTION_DURATION_COUNTRY),
     id: 'e8d1d974-eed8-462f-be2c-f0004b7619b2',

diff --git a/x-pack/plugins/maps/common/descriptor_types/data_request_descriptor_types.ts b/x-pack/plugins/maps/common/descriptor_types/data_request_descriptor_types.ts
@@ -38,17 +38,17 @@ export type VectorSourceSyncMeta = ESSearchSourceSyncMeta | ESGeoGridSourceSyncM
 
 export type VectorSourceRequestMeta = MapFilters & {
   applyGlobalQuery: boolean;
+  applyGlobalTime: boolean;
   fieldNames: string[];
   geogridPrecision?: number;
   sourceQuery?: MapQuery;
   sourceMeta: VectorSourceSyncMeta;
 };
 
-export type VectorJoinSourceRequestMeta = MapFilters & {
-  applyGlobalQuery: boolean;
-  fieldNames: string[];
-  sourceQuery?: Query;
-};
+export type VectorJoinSourceRequestMeta = Omit<
+  VectorSourceRequestMeta,
+  'geogridPrecision' | 'sourceMeta'
+> & { sourceQuery?: Query };
 
 export type VectorStyleRequestMeta = MapFilters & {
   dynamicStyleFields: string[];

diff --git a/x-pack/plugins/maps/common/descriptor_types/source_descriptor_types.ts b/x-pack/plugins/maps/common/descriptor_types/source_descriptor_types.ts
@@ -18,7 +18,6 @@ export type AttributionDescriptor = {
 export type AbstractSourceDescriptor = {
   id?: string;
   type: string;
-  applyGlobalQuery?: boolean;
 };
 
 export type EMSTMSSourceDescriptor = AbstractSourceDescriptor & {
@@ -37,6 +36,8 @@ export type AbstractESSourceDescriptor = AbstractSourceDescriptor & {
   id: string;
   indexPatternId: string;
   geoField?: string;
+  applyGlobalQuery: boolean;
+  applyGlobalTime: boolean;
 };
 
 export type AggDescriptor = {

diff --git a/.../maps/public/classes/layers/choropleth_layer_wizard/create_choropleth_layer_descriptor.ts b/.../maps/public/classes/layers/choropleth_layer_wizard/create_choropleth_layer_descriptor.ts
@@ -61,6 +61,8 @@ function createChoroplethLayerDescriptor({
           indexPatternTitle: rightIndexPatternTitle,
           term: rightTermField,
           metrics: [metricsDescriptor],
+          applyGlobalQuery: true,
+          applyGlobalTime: true,
         },
       },
     ],

diff --git a/x-pack/plugins/maps/public/classes/layers/create_region_map_layer_descriptor.ts b/x-pack/plugins/maps/public/classes/layers/create_region_map_layer_descriptor.ts
@@ -87,6 +87,8 @@ export function createRegionMapLayerDescriptor({
           indexPatternTitle: indexPatternTitle ? indexPatternTitle : indexPatternId,
           term: termsFieldName,
           metrics: [metricsDescriptor],
+          applyGlobalQuery: true,
+          applyGlobalTime: true,
         },
       },
     ],

diff --git a/x-pack/plugins/maps/public/classes/layers/layer.test.ts b/x-pack/plugins/maps/public/classes/layers/layer.test.ts
@@ -74,6 +74,8 @@ describe('cloneDescriptor', () => {
               metrics: [{ type: AGG_TYPE.COUNT }],
               term: 'myTermField',
               type: 'joinSource',
+              applyGlobalQuery: true,
+              applyGlobalTime: true,
             },
           },
         ],

diff --git a/x-pack/plugins/maps/public/classes/layers/layer.tsx b/x-pack/plugins/maps/public/classes/layers/layer.tsx
@@ -8,9 +8,8 @@
 import { Query } from 'src/plugins/data/public';
 import _ from 'lodash';
 import React, { ReactElement } from 'react';
-import { EuiIcon, EuiLoadingSpinner } from '@elastic/eui';
+import { EuiIcon } from '@elastic/eui';
 import uuid from 'uuid/v4';
-import { i18n } from '@kbn/i18n';
 import { FeatureCollection } from 'geojson';
 import { DataRequest } from '../util/data_request';
 import {
@@ -49,8 +48,6 @@ export interface ILayer {
   supportsFitToBounds(): Promise<boolean>;
   getAttributions(): Promise<Attribution[]>;
   getLabel(): string;
-  getCustomIconAndTooltipContent(): CustomIconAndTooltipContent;
-  getIconAndTooltipContent(zoomLevel: number, isUsingSearch: boolean): IconAndTooltipContent;
   renderLegendDetails(): ReactElement<any> | null;
   showAtZoomLevel(zoom: number): boolean;
   getMinZoom(): number;
@@ -64,6 +61,7 @@ export interface ILayer {
   getImmutableSourceProperties(): Promise<ImmutableSourceProperty[]>;
   renderSourceSettingsEditor({ onChange }: SourceEditorArgs): ReactElement<any> | null;
   isLayerLoading(): boolean;
+  isFilteredByGlobalTime(): Promise<boolean>;
   hasErrors(): boolean;
   getErrors(): string;
   getMbLayerIds(): string[];
@@ -93,16 +91,9 @@ export interface ILayer {
   getJoinsDisabledReason(): string | null;
   isFittable(): Promise<boolean>;
   getLicensedFeatures(): Promise<LICENSED_FEATURES[]>;
+  getCustomIconAndTooltipContent(): CustomIconAndTooltipContent;
 }
-export type Footnote = {
-  icon: ReactElement<any>;
-  message?: string | null;
-};
-export type IconAndTooltipContent = {
-  icon?: ReactElement<any> | null;
-  tooltipContent?: string | null;
-  footnotes: Footnote[];
-};
+
 export type CustomIconAndTooltipContent = {
   icon: ReactElement<any> | null;
   tooltipContent?: string | null;
@@ -237,6 +228,10 @@ export class AbstractLayer implements ILayer {
     return (await this.supportsFitToBounds()) && this.isVisible();
   }
 
+  async isFilteredByGlobalTime(): Promise<boolean> {
+    return false;
+  }
+
   async getDisplayName(source?: ISource): Promise<string> {
     if (this._descriptor.label) {
       return this._descriptor.label;
@@ -277,68 +272,6 @@ export class AbstractLayer implements ILayer {
     };
   }
 
-  getIconAndTooltipContent(zoomLevel: number, isUsingSearch: boolean): IconAndTooltipContent {
-    let icon;
-    let tooltipContent = null;
-    const footnotes = [];
-    if (this.hasErrors()) {
-      icon = (
-        <EuiIcon
-          aria-label={i18n.translate('xpack.maps.layer.loadWarningAriaLabel', {
-            defaultMessage: 'Load warning',
-          })}
-          size="m"
-          type="alert"
-          color="warning"
-        />
-      );
-      tooltipContent = this.getErrors();
-    } else if (this.isLayerLoading()) {
-      icon = <EuiLoadingSpinner size="m" />;
-    } else if (!this.isVisible()) {
-      icon = <EuiIcon size="m" type="eyeClosed" />;
-      tooltipContent = i18n.translate('xpack.maps.layer.layerHiddenTooltip', {
-        defaultMessage: `Layer is hidden.`,
-      });
-    } else if (!this.showAtZoomLevel(zoomLevel)) {
-      const minZoom = this.getMinZoom();
-      const maxZoom = this.getMaxZoom();
-      icon = <EuiIcon size="m" type="expand" />;
-      tooltipContent = i18n.translate('xpack.maps.layer.zoomFeedbackTooltip', {
-        defaultMessage: `Layer is visible between zoom levels {minZoom} and {maxZoom}.`,
-        values: { minZoom, maxZoom },
-      });
-    } else {
-      const customIconAndTooltipContent = this.getCustomIconAndTooltipContent();
-      if (customIconAndTooltipContent) {
-        icon = customIconAndTooltipContent.icon;
-        if (!customIconAndTooltipContent.areResultsTrimmed) {
-          tooltipContent = customIconAndTooltipContent.tooltipContent;
-        } else {
-          footnotes.push({
-            icon: <EuiIcon color="subdued" type="partial" size="s" />,
-            message: customIconAndTooltipContent.tooltipContent,
-          });
-        }
-      }
-
-      if (isUsingSearch && this.getQueryableIndexPatternIds().length) {
-        footnotes.push({
-          icon: <EuiIcon color="subdued" type="filter" size="s" />,
-          message: i18n.translate('xpack.maps.layer.isUsingSearchMsg', {
-            defaultMessage: 'Results narrowed by search bar',
-          }),
-        });
-      }
-    }
-
-    return {
-      icon,
-      tooltipContent,
-      footnotes,
-    };
-  }
-
   async hasLegendDetails(): Promise<boolean> {
     return false;
   }

diff --git a/.../maps/public/classes/layers/solution_layers/observability/create_layer_descriptor.test.ts b/.../maps/public/classes/layers/solution_layers/observability/create_layer_descriptor.test.ts
@@ -39,6 +39,8 @@ describe('createLayerDescriptor', () => {
         {
           leftField: 'iso2',
           right: {
+            applyGlobalQuery: true,
+            applyGlobalTime: true,
             id: '12345',
             indexPatternId: 'apm_static_index_pattern_id',
             indexPatternTitle: 'apm-*',
@@ -176,6 +178,7 @@ describe('createLayerDescriptor', () => {
       },
       sourceDescriptor: {
         applyGlobalQuery: true,
+        applyGlobalTime: true,
         geoField: 'client.geo.location',
         id: '12345',
         indexPatternId: 'apm_static_index_pattern_id',
@@ -218,6 +221,7 @@ describe('createLayerDescriptor', () => {
       },
       sourceDescriptor: {
         applyGlobalQuery: true,
+        applyGlobalTime: true,
         geoField: 'client.geo.location',
         id: '12345',
         indexPatternId: 'apm_static_index_pattern_id',

diff --git a/...ugins/maps/public/classes/layers/solution_layers/observability/create_layer_descriptor.ts b/...ugins/maps/public/classes/layers/solution_layers/observability/create_layer_descriptor.ts
@@ -177,6 +177,8 @@ export function createLayerDescriptor({
             term: 'client.geo.country_iso_code',
             metrics: [metricsDescriptor],
             whereQuery: apmSourceQuery,
+            applyGlobalQuery: true,
+            applyGlobalTime: true,
           },
         },
       ],

diff --git a/...gins/maps/public/classes/layers/solution_layers/security/create_layer_descriptors.test.ts b/...gins/maps/public/classes/layers/solution_layers/security/create_layer_descriptors.test.ts
@@ -33,6 +33,7 @@ describe('createLayerDescriptor', () => {
         minZoom: 0,
         sourceDescriptor: {
           applyGlobalQuery: true,
+          applyGlobalTime: true,
           filterByMapBounds: true,
           geoField: 'client.geo.location',
           id: '12345',
@@ -140,6 +141,7 @@ describe('createLayerDescriptor', () => {
         minZoom: 0,
         sourceDescriptor: {
           applyGlobalQuery: true,
+          applyGlobalTime: true,
           filterByMapBounds: true,
           geoField: 'server.geo.location',
           id: '12345',
@@ -247,6 +249,7 @@ describe('createLayerDescriptor', () => {
         minZoom: 0,
         sourceDescriptor: {
           applyGlobalQuery: true,
+          applyGlobalTime: true,
           destGeoField: 'server.geo.location',
           id: '12345',
           indexPatternId: 'id',
@@ -366,6 +369,7 @@ describe('createLayerDescriptor', () => {
         minZoom: 0,
         sourceDescriptor: {
           applyGlobalQuery: true,
+          applyGlobalTime: true,
           filterByMapBounds: true,
           geoField: 'source.geo.location',
           id: '12345',
@@ -473,6 +477,7 @@ describe('createLayerDescriptor', () => {
         minZoom: 0,
         sourceDescriptor: {
           applyGlobalQuery: true,
+          applyGlobalTime: true,
           filterByMapBounds: true,
           geoField: 'destination.geo.location',
           id: '12345',
@@ -580,6 +585,7 @@ describe('createLayerDescriptor', () => {
         minZoom: 0,
         sourceDescriptor: {
           applyGlobalQuery: true,
+          applyGlobalTime: true,
           destGeoField: 'destination.geo.location',
           id: '12345',
           indexPatternId: 'id',

diff --git a/x-pack/plugins/maps/public/classes/layers/vector_layer/vector_layer.tsx b/x-pack/plugins/maps/public/classes/layers/vector_layer/vector_layer.tsx
@@ -254,6 +254,7 @@ export class VectorLayer extends AbstractLayer {
       timeFilters: searchFilters.timeFilters,
       filters: searchFilters.filters,
       applyGlobalQuery: searchFilters.applyGlobalQuery,
+      applyGlobalTime: searchFilters.applyGlobalTime,
     };
 
     let bounds = null;
@@ -315,6 +316,22 @@ export class VectorLayer extends AbstractLayer {
     return indexPatternIds;
   }
 
+  async isFilteredByGlobalTime(): Promise<boolean> {
+    if (this.getSource().getApplyGlobalTime() && (await this.getSource().isTimeAware())) {
+      return true;
+    }
+
+    const joinPromises = this.getValidJoins().map(async (join) => {
+      return (
+        join.getRightJoinSource().getApplyGlobalTime() &&
+        (await join.getRightJoinSource().isTimeAware())
+      );
+    });
+    return (await Promise.all(joinPromises)).some((isJoinTimeAware: boolean) => {
+      return isJoinTimeAware;
+    });
+  }
+
   async _syncJoin({
     join,
     startLoading,
@@ -331,6 +348,7 @@ export class VectorLayer extends AbstractLayer {
       fieldNames: joinSource.getFieldNames(),
       sourceQuery: joinSource.getWhereQuery(),
       applyGlobalQuery: joinSource.getApplyGlobalQuery(),
+      applyGlobalTime: joinSource.getApplyGlobalTime(),
     };
     const prevDataRequest = this.getDataRequest(sourceDataId);
 
@@ -403,6 +421,7 @@ export class VectorLayer extends AbstractLayer {
       geogridPrecision: source.getGeoGridPrecision(dataFilters.zoom),
       sourceQuery: sourceQuery ? sourceQuery : undefined,
       applyGlobalQuery: source.getApplyGlobalQuery(),
+      applyGlobalTime: source.getApplyGlobalTime(),
       sourceMeta: source.getSyncMeta(),
     };
   }