diff --git a/app/soapbox/features/ui/index.js b/app/soapbox/features/ui/index.js index 67570cbec..59269d577 100644 --- a/app/soapbox/features/ui/index.js +++ b/app/soapbox/features/ui/index.js @@ -158,8 +158,6 @@ const LAYOUT = { }, }; -const shouldHideFAB = path => path.match(/^\/posts\/|^\/search|^\/getting-started|^\/chats/); - class SwitchingColumnsArea extends React.PureComponent { static propTypes = { @@ -577,6 +575,16 @@ class UI extends React.PureComponent { this.props.dispatch(openModal('COMPOSE')); } + shouldHideFAB = () => { + const path = this.context.router.history.location.pathname; + return path.match(/^\/posts\/|^\/search|^\/getting-started|^\/chats/); + } + + isChatRoomLocation = () => { + const path = this.context.router.history.location.pathname; + return path.match(/^\/chats\/(.*)/); + } + render() { const { streamingUrl } = this.props; const { draggingOver, mobile } = this.state; @@ -602,11 +610,31 @@ class UI extends React.PureComponent { goToRequests: this.handleHotkeyGoToRequests, } : {}; - const floatingActionButton = shouldHideFAB(this.context.router.history.location.pathname) ? null : ; + const fabElem = ( + + ); + + const floatingActionButton = this.shouldHideFAB() ? null : fabElem; + + const classnames = classNames('ui', { + 'is-composing': isComposing, + 'ui--chatroom': this.isChatRoomLocation(), + }); + + const style = { + pointerEvents: dropdownMenuIsOpen ? 'none' : null, + }; return ( -
+
{children} diff --git a/app/soapbox/reducers/accounts.js b/app/soapbox/reducers/accounts.js index 847004da6..b02ef763f 100644 --- a/app/soapbox/reducers/accounts.js +++ b/app/soapbox/reducers/accounts.js @@ -3,7 +3,7 @@ import { ACCOUNTS_IMPORT, ACCOUNT_FETCH_FAIL_FOR_USERNAME_LOOKUP, } from '../actions/importer'; -import { CHATS_FETCH_SUCCESS } from 'soapbox/actions/chats'; +import { CHATS_FETCH_SUCCESS, CHAT_FETCH_SUCCESS } from 'soapbox/actions/chats'; import { STREAMING_CHAT_UPDATE } from 'soapbox/actions/streaming'; import { normalizeAccount as normalizeAccount2 } from 'soapbox/actions/importer/normalizer'; import { Map as ImmutableMap, fromJS } from 'immutable'; @@ -48,6 +48,7 @@ export default function accounts(state = initialState, action) { })); case CHATS_FETCH_SUCCESS: return importAccountsFromChats(state, action.chats); + case CHAT_FETCH_SUCCESS: case STREAMING_CHAT_UPDATE: return importAccountsFromChats(state, [action.chat]); default: diff --git a/app/styles/chats.scss b/app/styles/chats.scss index 44a10e2f3..89268dfbe 100644 --- a/app/styles/chats.scss +++ b/app/styles/chats.scss @@ -176,9 +176,24 @@ } } -.column .chat-box { - max-height: calc(100vh - 125px); - overflow: hidden; - display: flex; - flex-direction: column; +.ui--chatroom { + padding-bottom: 0; + + .columns-area__panels__main .columns-area { + height: calc(100vh - 100px); + box-sizing: border-box; + overflow: hidden; + + @media(max-width: 630px) { + height: calc(100vh - 50px); + } + } + + .page { + .chat-box { + display: flex; + flex-direction: column; + overflow: hidden; + } + } }