From abd4a831a2ae84dff987fb01418b2e8b35de7f05 Mon Sep 17 00:00:00 2001
From: mgabdev <>
Date: Thu, 18 Jul 2019 00:22:19 -0400
Subject: [PATCH] Added floating action button to ui/index

hide on search, post, getting-started, if no user
---
 app/javascript/gabsocial/features/ui/index.js | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/app/javascript/gabsocial/features/ui/index.js b/app/javascript/gabsocial/features/ui/index.js
index 1b341552..22f2f730 100644
--- a/app/javascript/gabsocial/features/ui/index.js
+++ b/app/javascript/gabsocial/features/ui/index.js
@@ -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 />