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

View File

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