Convert notify.warning calls to use toastNotifications (#20767)

* Replace notify.warning with toastNotifications in region map, vega, index_pattern, redirect_when_missing, graph, monitoring, and ML * Link to index patterns from Graph toast. * Delete RouteBasedNotifier. * Remove courierNotifier and SearchTimeout and ShardFailure errors. * Remove warning and custom notifier types.
elastic · Jul 20, 2018 · ab0e2ba · ab0e2ba
1 parent 0dbaf65
commit ab0e2ba
Show file tree

Hide file tree

Showing 24 changed files with 129 additions and 564 deletions.
diff --git a/src/core_plugins/region_map/public/region_map_vis_params.js b/src/core_plugins/region_map/public/region_map_vis_params.js
@@ -18,15 +18,13 @@
  */
 
 import { uiModules } from 'ui/modules';
+import { toastNotifications } from 'ui/notify';
 import regionMapVisParamsTemplate from './region_map_vis_params.html';
 import { mapToLayerWithId } from './util';
 import '../../tile_map/public/editors/wms_options';
 
 uiModules.get('kibana/region_map')
-  .directive('regionMapVisParams', function (serviceSettings, regionmapsConfig, Notifier) {
-
-    const notify = new Notifier({ location: 'Region map' });
-
+  .directive('regionMapVisParams', function (serviceSettings, regionmapsConfig) {
     return {
       restrict: 'E',
       template: regionMapVisParamsTemplate,
@@ -84,7 +82,7 @@ uiModules.get('kibana/region_map')
 
             })
             .catch(function (error) {
-              notify.warning(error.message);
+              toastNotifications.addWarning(error.message);
             });
         }
 

diff --git a/src/core_plugins/region_map/public/region_map_visualization.js b/src/core_plugins/region_map/public/region_map_visualization.js
@@ -24,8 +24,9 @@ import ChoroplethLayer from './choropleth_layer';
 import { truncatedColorMaps }  from 'ui/vislib/components/color/truncated_colormaps';
 import AggResponsePointSeriesTooltipFormatterProvider from './tooltip_formatter';
 import 'ui/vis/map/service_settings';
+import { toastNotifications } from 'ui/notify';
 
-export function RegionMapsVisualizationProvider(Private, Notifier, config) {
+export function RegionMapsVisualizationProvider(Private, config) {
 
   const tooltipFormatter = Private(AggResponsePointSeriesTooltipFormatterProvider);
   const BaseMapsVisualization = Private(BaseMapsVisualizationProvider);
@@ -36,18 +37,15 @@ export function RegionMapsVisualizationProvider(Private, Notifier, config) {
       super(container, vis);
       this._vis = this.vis;
       this._choroplethLayer = null;
-      this._notify = new Notifier({ location: 'Region map' });
     }
 
-
     async render(esResponse, status) {
       await super.render(esResponse, status);
       if (this._choroplethLayer) {
         await this._choroplethLayer.whenDataLoaded();
       }
     }
 
-
     async _updateData(tableGroup) {
       this._chartData = tableGroup;
       let results;
@@ -81,7 +79,6 @@ export function RegionMapsVisualizationProvider(Private, Notifier, config) {
       this._kibanaMap.useUiStateFromVisualization(this._vis);
     }
 
-
     async  _updateParams() {
 
       await super._updateParams();
@@ -156,13 +153,14 @@ export function RegionMapsVisualizationProvider(Private, Notifier, config) {
         const rowIndex = this._chartData.tables[0].rows.findIndex(row => row[0] === event);
         this._vis.API.events.addFilter(this._chartData.tables[0], 0, rowIndex, event);
       });
+
       this._choroplethLayer.on('styleChanged', (event) => {
         const shouldShowWarning = this._vis.params.isDisplayWarning && config.get('visualization:regionmap:showWarnings');
         if (event.mismatches.length > 0 && shouldShowWarning) {
-          this._notify.warning(`Could not show ${event.mismatches.length} ${event.mismatches.length > 1 ? 'results' : 'result'} on the map.`
-            + ` To avoid this, ensure that each term can be matched to a corresponding shape on that shape's join field.`
-            + ` Could not match following terms: ${event.mismatches.join(',')}`
-          );
+          toastNotifications.addWarning({
+            title: `Unable to show ${event.mismatches.length} ${event.mismatches.length > 1 ? 'results' : 'result'} on map`,
+            text: `Ensure that each of these term matches a shape on that shape's join field: ${event.mismatches.join(', ')}`,
+          });
         }
       });
 

diff --git a/src/core_plugins/tile_map/public/base_maps_visualization.js b/src/core_plugins/tile_map/public/base_maps_visualization.js
@@ -22,7 +22,7 @@ import { KibanaMap } from 'ui/vis/map/kibana_map';
 import * as Rx from 'rxjs';
 import { filter, first } from 'rxjs/operators';
 import 'ui/vis/map/service_settings';
-
+import { toastNotifications } from 'ui/notify';
 
 const MINZOOM = 0;
 const MAXZOOM = 22;//increase this to 22. Better for WMS
@@ -142,7 +142,7 @@ export function BaseMapsVisualizationProvider(serviceSettings) {
             this._setTmsLayer(firstRoadMapLayer);
           }
         } catch (e) {
-          this._notify.warning(e.message);
+          toastNotifications.addWarning(e.message);
           return;
         }
         return;
@@ -174,7 +174,7 @@ export function BaseMapsVisualizationProvider(serviceSettings) {
 
         }
       } catch (tmsLoadingError) {
-        this._notify.warning(tmsLoadingError.message);
+        toastNotifications.addWarning(tmsLoadingError.message);
       }
 
 

diff --git a/src/core_plugins/vega/public/vega_visualization.js b/src/core_plugins/vega/public/vega_visualization.js
@@ -17,7 +17,7 @@
  * under the License.
  */
 
-import { Notifier } from 'ui/notify';
+import { toastNotifications, Notifier } from 'ui/notify';
 import { VegaView } from './vega_view/vega_view';
 import { VegaMapView } from './vega_view/vega_map_view';
 import { SavedObjectsClientProvider, findObjectByTitle } from 'ui/saved_objects';
@@ -59,7 +59,7 @@ export function VegaVisualizationProvider(Private, vegaConfig, serviceSettings,
      */
     async render(visData, status) {
       if (!visData && !this._vegaView) {
-        notify.warning('Unable to render without data');
+        toastNotifications.addWarning('Unable to render without data');
         return;
       }
 

diff --git a/src/ui/public/__tests__/errors.js b/src/ui/public/__tests__/errors.js
@@ -19,10 +19,8 @@
 
 import expect from 'expect.js';
 import {
-  SearchTimeout,
   RequestFailure,
   FetchFailure,
-  ShardFailure,
   VersionConflict,
   MappingConflict,
   RestrictedMapping,
@@ -46,10 +44,8 @@ import {
 
 describe('ui/errors', () => {
   const errors = [
-    new SearchTimeout(),
     new RequestFailure('an error', { }),
     new FetchFailure({ }),
-    new ShardFailure({ '_shards': 5 }),
     new VersionConflict({ }),
     new MappingConflict({ }),
     new RestrictedMapping('field', 'indexPattern'),

diff --git a/src/ui/public/courier/fetch/call_response_handlers.js b/src/ui/public/courier/fetch/call_response_handlers.js
@@ -17,10 +17,9 @@
  * under the License.
  */
 
-import { RequestFailure, SearchTimeout, ShardFailure } from '../../errors';
-
+import { toastNotifications } from '../../notify';
+import { RequestFailure } from '../../errors';
 import { RequestStatus } from './req_status';
-import { courierNotifier } from './notifier';
 
 export function CallResponseHandlersProvider(Private, Promise) {
   const ABORTED = RequestStatus.ABORTED;
@@ -35,11 +34,15 @@ export function CallResponseHandlersProvider(Private, Promise) {
       const response = responses[index];
 
       if (response.timed_out) {
-        courierNotifier.warning(new SearchTimeout());
+        toastNotifications.addWarning({
+          title: 'Data might be incomplete because your request timed out',
+        });
       }
 
       if (response._shards && response._shards.failed) {
-        courierNotifier.warning(new ShardFailure(response));
+        toastNotifications.addWarning({
+          title: '${response._shards.failed} of ${response._shards.total} shards failed',
+        });
       }
 
       function progress() {

diff --git a/src/ui/public/courier/fetch/fetch_now.js b/src/ui/public/courier/fetch/fetch_now.js
@@ -22,7 +22,6 @@ import { CallClientProvider } from './call_client';
 import { CallResponseHandlersProvider } from './call_response_handlers';
 import { ContinueIncompleteProvider } from './continue_incomplete';
 import { RequestStatus } from './req_status';
-import { location } from './notifier';
 
 /**
  * Fetch now provider should be used if you want the results searched and returned immediately.
@@ -53,7 +52,7 @@ export function FetchNowProvider(Private, Promise) {
 
       return searchRequest.retry();
     }))
-      .catch(error => fatalError(error, location));
+      .catch(error => fatalError(error, 'Courier fetch'));
   }
 
   function fetchSearchResults(searchRequests) {

diff --git a/src/ui/public/courier/fetch/notifier.js b/src/ui/public/courier/fetch/notifier.js
diff --git a/src/ui/public/errors.js b/src/ui/public/errors.js
@@ -51,16 +51,6 @@ export class KbnError {
 // instanceof checks.
 createLegacyClass(KbnError).inherits(Error);
 
-/**
- * SearchTimeout error class
- */
-export class SearchTimeout extends KbnError {
-  constructor() {
-    super('All or part of your request has timed out. The data shown may be incomplete.',
-      SearchTimeout);
-  }
-}
-
 /**
  * Request Failure - When an entire multi request fails
  * @param {Error} err - the Error that came back
@@ -92,20 +82,6 @@ export class FetchFailure extends KbnError {
   }
 }
 
-/**
- * ShardFailure Error - when one or more shards fail
- * @param {Object} resp - The response from es.
- */
-export class ShardFailure extends KbnError {
-  constructor(resp) {
-    super(
-      `${resp._shards.failed} of ${resp._shards.total} shards failed.`,
-      ShardFailure);
-
-    this.resp = resp;
-  }
-}
-
 /**
  * A doc was re-indexed but it was out of date.
  * @param {Object} resp - The response from es (one of the multi-response responses).

diff --git a/src/ui/public/index_patterns/__tests__/_index_pattern.js b/src/ui/public/index_patterns/__tests__/_index_pattern.js
@@ -29,16 +29,14 @@ import { FixturesStubbedSavedObjectIndexPatternProvider } from 'fixtures/stubbed
 import { IndexPatternsIntervalsProvider } from '../_intervals';
 import { IndexPatternProvider } from '../_index_pattern';
 import NoDigestPromises from 'test_utils/no_digest_promises';
-import { Notifier } from '../../notify';
+import { toastNotifications } from '../../notify';
 
 import { FieldsFetcherProvider } from '../fields_fetcher_provider';
 import { StubIndexPatternsApiClientModule } from './stub_index_patterns_api_client';
 import { IndexPatternsApiClientProvider } from '../index_patterns_api_client_provider';
 import { IsUserAwareOfUnsupportedTimePatternProvider } from '../unsupported_time_patterns';
 import { SavedObjectsClientProvider } from '../../saved_objects';
 
-const MARKDOWN_LINK_RE = /\[(.+?)\]\((.+?)\)/;
-
 describe('index pattern', function () {
   NoDigestPromises.activateForSuite();
 
@@ -468,23 +466,22 @@ describe('index pattern', function () {
     }
 
     it('logs a warning when the index pattern source includes `intervalName`', async () => {
-      const indexPattern = await createUnsupportedTimePattern();
-      expect(Notifier.prototype._notifs).to.have.length(1);
-
-      const notif = Notifier.prototype._notifs.shift();
-      expect(notif).to.have.property('type', 'warning');
-      expect(notif.content).to.match(MARKDOWN_LINK_RE);
-
-      const [, text, url] = notif.content.match(MARKDOWN_LINK_RE);
-      expect(text).to.contain(indexPattern.title);
-      expect(url).to.contain(indexPattern.id);
-      expect(url).to.contain('management/kibana/indices');
+      await createUnsupportedTimePattern();
+      expect(toastNotifications.list).to.have.length(1);
     });
 
     it('does not notify if isUserAwareOfUnsupportedTimePattern() returns true', async () => {
+      // Ideally, _index_pattern.js shouldn't be tightly coupled to toastNotifications. Instead, it
+      // should notify its consumer of this state and the consumer should be responsible for
+      // notifying the user. This test verifies the side effect of the state until we can remove
+      // this coupling.
+
+      // Clear existing toasts.
+      toastNotifications.list.splice(0);
+
       isUserAwareOfUnsupportedTimePattern.returns(true);
       await createUnsupportedTimePattern();
-      expect(Notifier.prototype._notifs).to.have.length(0);
+      expect(toastNotifications.list).to.have.length(0);
     });
   });
 });
diff --git a/src/ui/public/index_patterns/_index_pattern.js b/src/ui/public/index_patterns/_index_pattern.js
@@ -17,6 +17,7 @@
  * under the License.
  */
 
+import React, { Fragment } from 'react';
 import _ from 'lodash';
 import { SavedObjectNotFound, DuplicateField, IndexPatternMissingIndices } from '../errors';
 import angular from 'angular';
@@ -119,13 +120,15 @@ export function IndexPatternProvider(Private, config, Promise, confirmModalPromi
 
     if (indexPattern.isUnsupportedTimePattern()) {
       if (!isUserAwareOfUnsupportedTimePattern(indexPattern)) {
-        const warning = (
-          'Support for time-intervals has been removed. ' +
-          `View the ["${indexPattern.title}" index pattern in management](` +
-          kbnUrl.getRouteHref(indexPattern, 'edit') +
-          ') for more information.'
-        );
-        notify.warning(warning, { lifetime: Infinity });
+        toastNotifications.addWarning({
+          title: 'Support for time intervals was removed',
+          text: (
+            <Fragment>
+              For more information, view the {' '}
+              <a href={kbnUrl.getRouteHref(indexPattern, 'edit')}>{indexPattern.title} index pattern</a>
+            </Fragment>
+          ),
+        });
       }
     }