05328167c6
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
51 lines
1.2 KiB
TypeScript
51 lines
1.2 KiB
TypeScript
/**
|
|
* 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);
|