moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Chats: hide for mobile (for now)

This commit is contained in:
Alex Gleason 2020-08-27 16:54:07 -05:00
parent 22063ae3c8
commit abd6c419f1
No known key found for this signature in database
GPG Key ID: 7211D1F99744FBB7
2 changed files with 12 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
app/soapbox/features/ui/index.js
View File

@ -292,6 +292,7 @@ class UI extends React.PureComponent {
state = { state = {
draggingOver: false, draggingOver: false,
mobile: isMobile(window.innerWidth),
}; };
handleBeforeUnload = (e) => { handleBeforeUnload = (e) => {
@ -400,10 +401,17 @@ class UI extends React.PureComponent {
} }
} }
handleResize = debounce(() => {
this.setState({ mobile: isMobile(window.innerWidth) });
}, 500, {
trailing: true,
});
componentDidMount() { componentDidMount() {
const { account } = this.props; const { account } = this.props;
if (!account) return; if (!account) return;
window.addEventListener('beforeunload', this.handleBeforeUnload, false); window.addEventListener('beforeunload', this.handleBeforeUnload, false);
window.addEventListener('resize', this.handleResize, { passive: true });
document.addEventListener('dragenter', this.handleDragEnter, false); document.addEventListener('dragenter', this.handleDragEnter, false);
document.addEventListener('dragover', this.handleDragOver, false); document.addEventListener('dragover', this.handleDragOver, false);
@ -437,6 +445,7 @@ class UI extends React.PureComponent {
componentWillUnmount() { componentWillUnmount() {
window.removeEventListener('beforeunload', this.handleBeforeUnload); window.removeEventListener('beforeunload', this.handleBeforeUnload);
window.removeEventListener('resize', this.handleResize);
document.removeEventListener('dragenter', this.handleDragEnter); document.removeEventListener('dragenter', this.handleDragEnter);
document.removeEventListener('dragover', this.handleDragOver); document.removeEventListener('dragover', this.handleDragOver);
document.removeEventListener('drop', this.handleDrop); document.removeEventListener('drop', this.handleDrop);
@ -565,7 +574,7 @@ class UI extends React.PureComponent {
render() { render() {
const { streamingUrl } = this.props; const { streamingUrl } = this.props;
const { draggingOver } = this.state; const { draggingOver, mobile } = this.state;
const { intl, children, isComposing, location, dropdownMenuIsOpen, me } = this.props; const { intl, children, isComposing, location, dropdownMenuIsOpen, me } = this.props;
if (me === null || !streamingUrl) return null; if (me === null || !streamingUrl) return null;
@ -605,7 +614,7 @@ class UI extends React.PureComponent {
<ModalContainer /> <ModalContainer />
<UploadArea active={draggingOver} onClose={this.closeUploadModal} /> <UploadArea active={draggingOver} onClose={this.closeUploadModal} />
{me && <SidebarMenu />} {me && <SidebarMenu />}
{me && <ChatPanes />} {me && !mobile && <ChatPanes />}
</div> </div>
</HotKeys> </HotKeys>
); );

2
app/styles/ui.scss
View File

@ -369,7 +369,7 @@
justify-content: center; justify-content: center;
transition: 0.2s; transition: 0.2s;
@media screen and (max-width: 895px) { @media screen and (max-width: 630px) {
display: flex; display: flex;
} }