[errorview] add url overflow display

src/ui/public/chrome/chrome.js

@@ -10,6 +10,7 @@ import 'ui/timefilter';
 import 'ui/private';
 import 'ui/promises';
 import 'ui/directives/kbn_src';
+import '../error_url_overflow';
 
 var chrome = {};
 var internals = _.defaults(

src/ui/public/error_url_overflow/error_url_overflow.html

@@ -0,0 +1,23 @@
+<div class="app-container error-url-overflow-app">
+  <div class="alert alert-danger" role="alert">
+    <strong>Woah there!</strong>
+    Your url {{controller.over ? 'met' : 'exceeded'}} the configured limit of {{controller.limit}} characters.
+  </div>
+
+  <h3>Your URL</h3>
+  <pre>{{controller.url}}</pre>
+
+  <h3>Tips</h3>
+  <ul>
+    <li>
+      Saved objects can sometimes persist some unexpectedly large values that get put into the url when they load. You may be able to edit these saved objects in the <a href="#/settings/objects">"objects" section of the settings app</a>.
+    </li>
+    <li>
+      Sometimes dashboards with too many panels can cause the state
+      to grow in length very quickly.
+    </li>
+    <li>
+      Maybe you could temporarily raise the <code>uri:limit</code> setting in the <a href="#/settings/advanced">advanced settings</a> app.
+    </li>
+  </ul>
+</div>

src/ui/public/error_url_overflow/error_url_overflow.js

@@ -0,0 +1,34 @@
+import uiRoutes from 'ui/routes';
+import uiModules from 'ui/modules';
+
+import './error_url_overflow.less';
+import template from './error_url_overflow.html';
+
+export function OverflowedUrlStoreProvider() {
+  let value;
+  return {
+    set(v) { value = v; },
+    get() { return value; },
+    clear() { value = null; }
+  };
+}
+
+uiRoutes
+.when('/error/url-overflow', {
+  template,
+  controllerAs: 'controller',
+  controller: class OverflowController {
+    constructor(Private, config, $scope) {
+      const overflowedUrlStore = Private(OverflowedUrlStoreProvider);
+      this.url = overflowedUrlStore.get();
+      overflowedUrlStore.clear();
+
+      if (!this.url) {
+        window.location.hash = '#/';
+        return;
+      }
+
+      this.limit = config.get('url:limit');
+    }
+  }
+});

src/ui/public/error_url_overflow/error_url_overflow.less

@@ -0,0 +1,7 @@
+.error-url-overflow-app {
+  padding: 25px;
+
+  pre {
+    white-space: pre-wrap;
+  }
+}

src/ui/public/state_management/state.js

@@ -4,11 +4,13 @@ import applyDiff from 'ui/utils/diff_object';
 import qs from 'ui/utils/query_string';
 import EventsProvider from 'ui/events';
 import Notifier from 'ui/notify/notifier';
-
+import KbnUrlProvider from 'ui/url';
+import { OverflowedUrlStoreProvider } from 'ui/error_url_overflow';
 
 export default function StateProvider(Private, $rootScope, $location, config) {
   var notify = new Notifier();
   var Events = Private(EventsProvider);
+  var overflowedUrlStore = Private(OverflowedUrlStoreProvider);
 
   _.class(State).inherits(Events);
   function State(urlParam, defaults) {
@@ -108,11 +110,16 @@ export default function StateProvider(Private, $rootScope, $location, config) {
       $location.search(search);
     }
 
-    const urlLength = $location.absUrl().length;
+    if (overflowedUrlStore.get()) return;
+
+    const absUrl = $location.absUrl();
+    const urlLength = absUrl.length;
     const warnLength = config.get('url:warnLength');
     const failLength = config.get('url:limit');
 
     if (failLength && urlLength >= failLength) {
+      overflowedUrlStore.set(absUrl);
+      window.location.hash = '#/error/url-overflow';
       throw new TypeError(`
         The URL has gotten too big and kibana can no longer
         continue. Please refresh to return to your previous state.