Add global error bubble

Summary: Improved the display of error messages. Where previously only one error message could be displayed (quite obtrusively), with this change multiple errors can now be displayed and stack traces and further info can be hidden.

Reviewed By: passy

Differential Revision: D18036569

fbshipit-source-id: 2bc3dfa7a5196f931370a6e6dbf27c55b6cfb2bf

src/App.tsx

@@ -8,7 +8,7 @@
  */
 
 import React from 'react';
-import {FlexColumn, FlexRow, Client} from 'flipper';
+import {FlexColumn, FlexRow} from 'flipper';
 import {connect} from 'react-redux';
 import TitleBar from './chrome/TitleBar';
 import MainSidebar from './chrome/MainSidebar';
@@ -36,7 +36,7 @@ import {
 import {Logger} from './fb-interfaces/Logger';
 import BugReporter from './fb-stubs/BugReporter';
 import {State as Store} from './reducers/index';
-import {StaticView} from './reducers/connections';
+import {StaticView, FlipperError} from './reducers/connections';
 import PluginManager from './chrome/PluginManager';
 import StatusBar from './chrome/StatusBar';
 import SettingsSheet from './chrome/SettingsSheet';
@@ -49,7 +49,7 @@ type OwnProps = {
 
 type StateFromProps = {
   leftSidebarVisible: boolean;
-  error: string | null;
+  errors: FlipperError[];
   activeSheet: ActiveSheet;
   share: ShareType | null;
   staticView: StaticView;
@@ -126,6 +126,7 @@ export class App extends React.Component<Props> {
     return (
       <FlexColumn grow={true}>
         <TitleBar version={version} />
+        <ErrorBar />
         <Sheet>{this.getSheet}</Sheet>
         <FlexRow grow={true}>
           {this.props.leftSidebarVisible && <MainSidebar />}
@@ -136,7 +137,6 @@ export class App extends React.Component<Props> {
           )}
         </FlexRow>
         <StatusBar />
-        <ErrorBar text={this.props.error} />
       </FlexColumn>
     );
   }
@@ -145,12 +145,12 @@ export class App extends React.Component<Props> {
 export default connect<StateFromProps, {}, OwnProps, Store>(
   ({
     application: {leftSidebarVisible, activeSheet, share},
-    connections: {error, staticView},
+    connections: {errors, staticView},
   }) => ({
     leftSidebarVisible,
     activeSheet,
     share: share,
-    error,
+    errors,
     staticView,
   }),
 )(App);