Move angular setup to separate module

Moves all angular setup code that is not config-dependent to a function that can later be called by any plugin.
elastic · Apr 1, 2019 · f997e4d · f997e4d
1 parent ad54a16
commit f997e4d
Show file tree

Hide file tree

Showing 8 changed files with 277 additions and 198 deletions.
diff --git a/src/legacy/ui/public/chrome/api/angular.js b/src/legacy/ui/public/chrome/api/angular.js
@@ -17,24 +17,16 @@
  * under the License.
  */
 
-import React, { Fragment } from 'react';
 import _ from 'lodash';
-import { modifyUrl } from 'ui/url';
-import { i18n }  from '@kbn/i18n';
-import { FormattedMessage } from '@kbn/i18n/react';
+
 
 import { uiModules } from '../../modules';
-import { toastNotifications } from '../../notify';
-import { UrlOverflowServiceProvider } from '../../error_url_overflow';
 
 import { directivesProvider } from '../directives';
 import { registerSubUrlHooks } from './sub_url_hooks';
-
-const URL_LIMIT_WARN_WITHIN = 1000;
+import { configureAppAngularModule } from 'ui/legacy_compat';
 
 export function initAngularApi(chrome, internals) {
-  chrome.getFirstPathSegment = _.noop;
-
   chrome.setupAngular = function () {
     const kibana = uiModules.get('kibana');
 
@@ -47,98 +39,18 @@ export function initAngularApi(chrome, internals) {
       .value('buildNum', internals.buildNum)
       .value('buildSha', internals.buildSha)
       .value('serverName', internals.serverName)
-      .value('sessionId', Date.now())
       .value('chrome', chrome)
-      .value('esUrl', (function () {
-        const a = document.createElement('a');
-        a.href = chrome.addBasePath('/elasticsearch');
-        const protocolPort = /https/.test(a.protocol) ? 443 : 80;
-        const port = a.port || protocolPort;
-        return {
-          host: a.hostname,
-          port,
-          protocol: a.protocol,
-          pathname: a.pathname
-        };
-      }()))
-      .config($locationProvider => {
-        $locationProvider.html5Mode({
-          enabled: false,
-          requireBase: false,
-          rewriteLinks: false,
-        });
-      })
       .config(chrome.$setupXsrfRequestInterceptor)
-      .config(function ($compileProvider, $locationProvider) {
+      .config(function ($compileProvider) {
         if (!internals.devMode) {
           $compileProvider.debugInfoEnabled(false);
         }
-
-        $locationProvider.hashPrefix('');
       })
-      .run(internals.capture$httpLoadingCount)
-      .run(internals.$setupBreadcrumbsAutoClear)
-      .run(internals.$setupHelpExtensionAutoClear)
-      .run(internals.$initNavLinksDeepWatch)
-      .run(($location, $rootScope, Private, config) => {
-        chrome.getFirstPathSegment = () => {
-          return $location.path().split('/')[1];
-        };
-
-        const urlOverflow = Private(UrlOverflowServiceProvider);
-        const check = () => {
-          // disable long url checks when storing state in session storage
-          if (config.get('state:storeInSessionStorage')) {
-            return;
-          }
-
-          if ($location.path() === '/error/url-overflow') {
-            return;
-          }
-
-          try {
-            if (urlOverflow.check($location.absUrl()) <= URL_LIMIT_WARN_WITHIN) {
-              toastNotifications.addWarning({
-                title: i18n.translate('common.ui.chrome.bigUrlWarningNotificationTitle', {
-                  defaultMessage: 'The URL is big and Kibana might stop working'
-                }),
-                text: (
-                  <Fragment>
-                    <FormattedMessage
-                      id="common.ui.chrome.bigUrlWarningNotificationMessage"
-                      defaultMessage="Either enable the {storeInSessionStorageParam} option
-                        in {advancedSettingsLink} or simplify the onscreen visuals."
-                      values={{
-                        storeInSessionStorageParam: <code>state:storeInSessionStorage</code>,
-                        advancedSettingsLink: (
-                          <a href="#/management/kibana/settings">
-                            <FormattedMessage
-                              id="common.ui.chrome.bigUrlWarningNotificationMessage.advancedSettingsLinkText"
-                              defaultMessage="advanced settings"
-                            />
-                          </a>
-                        )
-                      }}
-                    />
-                  </Fragment>
-                ),
-              });
-            }
-          } catch (e) {
-            window.location.href = modifyUrl(window.location.href, parts => {
-              parts.hash = '#/error/url-overflow';
-            });
-            // force the browser to reload to that Kibana's potentially unstable state is unloaded
-            window.location.reload();
-          }
-        };
-
-        $rootScope.$on('$routeUpdate', check);
-        $rootScope.$on('$routeChangeStart', check);
-      });
+      .run(internals.$initNavLinksDeepWatch);
 
     directivesProvider(chrome, internals);
     registerSubUrlHooks(kibana, internals);
+    configureAppAngularModule(kibana);
 
     uiModules.link(kibana);
   };

diff --git a/src/legacy/ui/public/chrome/api/breadcrumbs.ts b/src/legacy/ui/public/chrome/api/breadcrumbs.ts
@@ -17,8 +17,6 @@
  * under the License.
  */
 
-import { IRootScopeService } from 'angular';
-import { fatalError } from 'ui/notify/fatal_error';
 import { ChromeBreadcrumb, ChromeSetup } from '../../../../../core/public';
 export type Breadcrumb = ChromeBreadcrumb;
 
@@ -34,16 +32,12 @@ export function __newPlatformInit__(instance: ChromeSetup) {
 }
 
 function createBreadcrumbsApi(chrome: { [key: string]: any }) {
-  // A flag used to determine if we should automatically
-  // clear the breadcrumbs between angular route changes.
-  let breadcrumbSetSinceRouteChange = false;
   let currentBreadcrumbs: Breadcrumb[] = [];
 
   // reset breadcrumbSetSinceRouteChange any time the breadcrumbs change, even
   // if it was done directly through the new platform
   newPlatformChrome.getBreadcrumbs$().subscribe({
     next(nextBreadcrumbs) {
-      breadcrumbSetSinceRouteChange = true;
       currentBreadcrumbs = nextBreadcrumbs;
     },
   });
@@ -79,47 +73,13 @@ function createBreadcrumbsApi(chrome: { [key: string]: any }) {
         newPlatformChrome.setBreadcrumbs(currentBreadcrumbs.filter(fn));
       },
     },
-
-    /**
-     * internal angular run function that will be called when angular bootstraps and
-     * lets us integrate with the angular router so that we can automatically clear
-     * the breadcrumbs if we switch to a Kibana app that does not use breadcrumbs correctly
-     */
-    $setupBreadcrumbsAutoClear: ($rootScope: IRootScopeService, $injector: any) => {
-      const $route = $injector.has('$route') ? $injector.get('$route') : {};
-
-      $rootScope.$on('$routeChangeStart', () => {
-        breadcrumbSetSinceRouteChange = false;
-      });
-
-      $rootScope.$on('$routeChangeSuccess', () => {
-        const current = $route.current || {};
-
-        if (breadcrumbSetSinceRouteChange || (current.$$route && current.$$route.redirectTo)) {
-          return;
-        }
-
-        const k7BreadcrumbsProvider = current.k7Breadcrumbs;
-        if (!k7BreadcrumbsProvider) {
-          newPlatformChrome.setBreadcrumbs([]);
-          return;
-        }
-
-        try {
-          chrome.breadcrumbs.set($injector.invoke(k7BreadcrumbsProvider));
-        } catch (error) {
-          fatalError(error);
-        }
-      });
-    },
   };
 }
 
 export function initBreadcrumbsApi(
   chrome: { [key: string]: any },
   internals: { [key: string]: any }
 ) {
-  const { breadcrumbs, $setupBreadcrumbsAutoClear } = createBreadcrumbsApi(chrome);
+  const { breadcrumbs } = createBreadcrumbsApi(chrome);
   chrome.breadcrumbs = breadcrumbs;
-  internals.$setupBreadcrumbsAutoClear = $setupBreadcrumbsAutoClear;
 }
diff --git a/src/legacy/ui/public/chrome/api/help_extension.ts b/src/legacy/ui/public/chrome/api/help_extension.ts
@@ -17,8 +17,6 @@
  * under the License.
  */
 
-import { IRootScopeService } from 'angular';
-
 import { ChromeHelpExtension, ChromeSetup } from '../../../../../core/public';
 
 let newPlatformChrome: ChromeSetup;
@@ -34,17 +32,6 @@ export type HelpExtensionApi = ReturnType<typeof createHelpExtensionApi>['helpEx
 export type HelpExtension = ChromeHelpExtension;
 
 function createHelpExtensionApi() {
-  /**
-   * reset helpExtensionSetSinceRouteChange any time the helpExtension changes, even
-   * if it was done directly through the new platform
-   */
-  let helpExtensionSetSinceRouteChange = false;
-  newPlatformChrome.getHelpExtension$().subscribe({
-    next() {
-      helpExtensionSetSinceRouteChange = true;
-    },
-  });
-
   return {
     helpExtension: {
       /**
@@ -60,38 +47,13 @@ function createHelpExtensionApi() {
        */
       get$: () => newPlatformChrome.getHelpExtension$(),
     },
-
-    /**
-     * internal angular run function that will be called when angular bootstraps and
-     * lets us integrate with the angular router so that we can automatically clear
-     * the helpExtension if we switch to a Kibana app that does not set its own
-     * helpExtension
-     */
-    $setupHelpExtensionAutoClear: ($rootScope: IRootScopeService, $injector: any) => {
-      const $route = $injector.has('$route') ? $injector.get('$route') : {};
-
-      $rootScope.$on('$routeChangeStart', () => {
-        helpExtensionSetSinceRouteChange = false;
-      });
-
-      $rootScope.$on('$routeChangeSuccess', () => {
-        const current = $route.current || {};
-
-        if (helpExtensionSetSinceRouteChange || (current.$$route && current.$$route.redirectTo)) {
-          return;
-        }
-
-        newPlatformChrome.setHelpExtension(current.helpExtension);
-      });
-    },
   };
 }
 
 export function initHelpExtensionApi(
   chrome: { [key: string]: any },
   internal: { [key: string]: any }
 ) {
-  const { helpExtension, $setupHelpExtensionAutoClear } = createHelpExtensionApi();
+  const { helpExtension } = createHelpExtensionApi();
   chrome.helpExtension = helpExtension;
-  internal.$setupHelpExtensionAutoClear = $setupHelpExtensionAutoClear;
 }
diff --git a/src/legacy/ui/public/chrome/api/loading_count.js b/src/legacy/ui/public/chrome/api/loading_count.js
@@ -19,8 +19,6 @@
 
 import * as Rx from 'rxjs';
 
-import { isSystemApiRequest } from '../../system_api';
-
 let newPlatformHttp;
 
 export function __newPlatformInit__(instance) {
@@ -30,27 +28,7 @@ export function __newPlatformInit__(instance) {
   newPlatformHttp = instance;
 }
 
-export function initLoadingCountApi(chrome, internals) {
-  /**
-   * Injected into angular module by ui/chrome angular integration
-   * and adds a root-level watcher that will capture the count of
-   * active $http requests on each digest loop and expose the count to
-   * the core.loadingCount api
-   * @param  {Angular.Scope} $rootScope
-   * @param  {HttpService} $http
-   * @return {undefined}
-   */
-  internals.capture$httpLoadingCount = function ($rootScope, $http) {
-    newPlatformHttp.addLoadingCount(new Rx.Observable(observer => {
-      const unwatch = $rootScope.$watch(() => {
-        const reqs = $http.pendingRequests || [];
-        observer.next(reqs.filter(req => !isSystemApiRequest(req)).length);
-      });
-
-      return unwatch;
-    }));
-  };
-
+export function initLoadingCountApi(chrome) {
   const manualCount$ = new Rx.BehaviorSubject(0);
   newPlatformHttp.addLoadingCount(manualCount$);
 

diff --git a/src/legacy/ui/public/chrome/directives/kbn_chrome.html b/src/legacy/ui/public/chrome/directives/kbn_chrome.html
@@ -18,7 +18,7 @@
 
       <div
         class="application"
-        ng-class="'tab-' + chrome.getFirstPathSegment() + ' ' + chrome.getApplicationClasses()"
+        ng-class="'tab-' + getFirstPathSegment() + ' ' + chrome.getApplicationClasses()"
         ng-view
       ></div>
     </div>

diff --git a/src/legacy/ui/public/chrome/directives/kbn_chrome.js b/src/legacy/ui/public/chrome/directives/kbn_chrome.js
@@ -54,10 +54,14 @@ export function kbnChromeProvider(chrome, internals) {
         },
 
         controllerAs: 'chrome',
-        controller($scope) {
+        controller($scope, $location) {
           // Notifications
           $scope.notifList = notify._notifs;
 
+          $scope.getFirstPathSegment = () => {
+            return $location.path().split('/')[1];
+          };
+
           // Non-scope based code (e.g., React)
 
           // Banners