Yarn workspaces

Summary:
1) moved "sonar/desktop/src" to "sonar/desktop/app/src", so "app" is now a separate package containing the core Flipper app code
2) Configured yarn workspaces with the root in "sonar/desktop": app, static, pkg, doctor, headless-tests. Plugins are not included for now, I plan to do this later.

Reviewed By: jknoxville

Differential Revision: D20535782

fbshipit-source-id: 600b2301960f37c7d72166e0d04eba462bec9fc1

desktop/app/src/ui/components/ErrorBoundary.tsx

@@ -0,0 +1,91 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ */
+
+import ErrorBlock from './ErrorBlock';
+import {Component} from 'react';
+import Heading from './Heading';
+import Button from './Button';
+import View from './View';
+import styled from '@emotion/styled';
+import React from 'react';
+
+const ErrorBoundaryContainer = styled(View)({
+  overflow: 'auto',
+  padding: 10,
+});
+ErrorBoundaryContainer.displayName = 'ErrorBoundary:ErrorBoundaryContainer';
+
+const ErrorBoundaryStack = styled(ErrorBlock)({
+  marginBottom: 10,
+  whiteSpace: 'pre',
+});
+ErrorBoundaryStack.displayName = 'ErrorBoundary:ErrorBoundaryStack';
+
+type ErrorBoundaryProps = {
+  /** Function to dynamically generate the heading of the ErrorBox. */
+  buildHeading?: (err: Error) => string;
+  /** Heading of the ErrorBox. Used as an alternative to `buildHeading`. */
+  heading?: string;
+  /** Whether the stacktrace of the error is shown in the error box */
+  showStack?: boolean;
+  /** Code that might throw errors that will be catched */
+  children?: React.ReactNode;
+};
+
+type ErrorBoundaryState = {
+  error: Error | null | undefined;
+};
+
+/**
+ * Boundary catching errors and displaying an ErrorBlock instead.
+ */
+export default class ErrorBoundary extends Component<
+  ErrorBoundaryProps,
+  ErrorBoundaryState
+> {
+  constructor(props: ErrorBoundaryProps, context: Object) {
+    super(props, context);
+    this.state = {error: null};
+  }
+
+  componentDidCatch(err: Error) {
+    console.error(err.toString(), 'ErrorBoundary');
+    this.setState({error: err});
+  }
+
+  clearError = () => {
+    this.setState({error: null});
+  };
+
+  render() {
+    const {error} = this.state;
+    if (error) {
+      const {buildHeading} = this.props;
+      let {heading} = this.props;
+      if (buildHeading) {
+        heading = buildHeading(error);
+      }
+      if (heading == null) {
+        heading = 'An error has occured';
+      }
+
+      return (
+        <ErrorBoundaryContainer grow={true}>
+          <Heading>{heading}</Heading>
+          {this.props.showStack !== false && (
+            <ErrorBoundaryStack error={error} />
+          )}
+          <Button onClick={this.clearError}>Clear error and try again</Button>
+        </ErrorBoundaryContainer>
+      );
+    } else {
+      return this.props.children || null;
+    }
+  }
+}