Add support for status bar

Summary:
This diff adds a status bar, which can be used to show the status messages, for example for Litho Support Form.
The logic for the status bar is as follows:

It maintains the array of the messages. At any point it shows the last pushed message. It will keep showing that message until it is being removed, once removed it will show second last message. The messages will be removed as and when its corresponding task/Promise is fulfilled.

Reviewed By: danielbuechele

Differential Revision: D17551495

fbshipit-source-id: 96b2f401599b9ee8a472607e6a2f027e63b3b807

src/chrome/StatusBar.tsx

@@ -0,0 +1,50 @@
+/**
+ * Copyright 2018-present Facebook.
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ * @format
+ */
+
+import {colors} from '../ui/components/colors';
+import {styled} from '../ui';
+import {connect} from 'react-redux';
+import {State} from '../reducers';
+import React, {ReactElement} from 'react';
+import Text from '../ui/components/Text';
+
+const StatusBarContainer = styled(Text)({
+  backgroundColor: colors.macOSTitleBarBackgroundBlur,
+  borderTop: '1px solid #b3b3b3',
+  lineHeight: '26px',
+  padding: '0 10px',
+  textOverflow: 'ellipsis',
+  overflow: 'hidden',
+});
+
+type Props = {
+  statusMessage: string | null;
+};
+
+export function statusBarView(props: Props): ReactElement | null {
+  const {statusMessage} = props;
+  if (statusMessage) {
+    return (
+      <StatusBarContainer italic={true} whiteSpace="nowrap">
+        {statusMessage}
+      </StatusBarContainer>
+    );
+  } else {
+    return null;
+  }
+}
+
+export default connect<Props, void, void, State>(
+  ({application: {statusMessages}}) => {
+    if (statusMessages.length > 0) {
+      return {statusMessage: statusMessages[statusMessages.length - 1]};
+    }
+    return {
+      statusMessage: null,
+    };
+  },
+)(statusBarView);

src/chrome/__tests__/StatusBar.node.tsx

@@ -0,0 +1,18 @@
+/**
+ * Copyright 2018-present Facebook.
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ * @format
+ */
+
+import {statusBarView} from '../StatusBar';
+
+test('statusBarView returns null for empty status messages', () => {
+  const view = statusBarView({statusMessage: null});
+  expect(view).toBeNull();
+});
+
+test('statusBarView returns non null view when the list of messages is non empty', () => {
+  const view = statusBarView({statusMessage: 'Last Message'});
+  expect(view).toBeDefined();
+});