Added floating action button to ui/index

hide on search, post, getting-started, if no user
This commit is contained in:
mgabdev 2019-07-18 00:22:19 -04:00
parent b163726651
commit abd4a831a2
1 changed files with 12 additions and 1 deletions

View File

@ -64,6 +64,7 @@ import '../../components/status';
const messages = defineMessages({
beforeUnload: { id: 'ui.beforeunload', defaultMessage: 'Your draft will be lost if you leave Gab Social.' },
publish: { id: 'compose_form.publish', defaultMessage: 'Gab' },
});
const mapStateToProps = state => ({
@ -126,6 +127,8 @@ const LAYOUT = {
},
};
const shouldHideFAB = path => path.match(/^\/posts\/|^\/search|^\/getting-started/);
class SwitchingColumnsArea extends React.PureComponent {
static propTypes = {
@ -475,9 +478,13 @@ class UI extends React.PureComponent {
this.context.router.history.push('/follow_requests');
}
handleOpenComposeModal = () => {
this.props.dispatch(openModal("COMPOSE"));
}
render () {
const { draggingOver } = this.state;
const { children, isComposing, location, dropdownMenuIsOpen } = this.props;
const { intl, children, isComposing, location, dropdownMenuIsOpen } = this.props;
const handlers = me ? {
help: this.handleHotkeyToggleHelp,
@ -497,6 +504,8 @@ class UI extends React.PureComponent {
goToRequests: this.handleHotkeyGoToRequests,
} : {};
const floatingActionButton = shouldHideFAB(this.context.router.history.location.pathname) ? null : <button key='floating-action-button' onClick={this.handleOpenComposeModal} className='floating-action-button' aria-label={intl.formatMessage(messages.publish)}></button>;
return (
<HotKeys keyMap={keyMap} handlers={handlers} ref={this.setHotkeysRef} attach={window} focused>
<div className={classNames('ui', { 'is-composing': isComposing })} ref={this.setRef} style={{ pointerEvents: dropdownMenuIsOpen ? 'none' : null }}>
@ -505,6 +514,8 @@ class UI extends React.PureComponent {
{children}
</SwitchingColumnsArea>
{me && floatingActionButton}
<NotificationsContainer />
<LoadingBarContainer className='loading-bar' />
<ModalContainer />