diff options
author | Eugen Rochko <eugen@zeonfederated.com> | 2019-08-01 19:17:17 +0200 |
---|---|---|
committer | Thibaut Girka <thib@sitedethib.com> | 2019-10-06 00:32:06 +0200 |
commit | 90bdbddbfe44be77de1d2cd88bb7f469f5d6132f (patch) | |
tree | 603ca399f375e0a8f25348510047a46345a0ed1c /app/javascript/flavours/glitch/components/column_back_button.js | |
parent | fdadd520b184fbf8e0b99c25a19ef7f25ca651f6 (diff) |
[Glitch] Fix scroll to top in single column UI
Port 2dee293c4c98486d387105224023fad02b8b0d96 to glitch-soc Signed-off-by: Thibaut Girka <thib@sitedethib.com>
Diffstat (limited to 'app/javascript/flavours/glitch/components/column_back_button.js')
-rw-r--r-- | app/javascript/flavours/glitch/components/column_back_button.js | 15 |
1 files changed, 14 insertions, 1 deletions
diff --git a/app/javascript/flavours/glitch/components/column_back_button.js b/app/javascript/flavours/glitch/components/column_back_button.js index a0260e5af..8326cbb79 100644 --- a/app/javascript/flavours/glitch/components/column_back_button.js +++ b/app/javascript/flavours/glitch/components/column_back_button.js @@ -2,6 +2,7 @@ import React from 'react'; import { FormattedMessage } from 'react-intl'; import PropTypes from 'prop-types'; import Icon from 'flavours/glitch/components/icon'; +import { createPortal } from 'react-dom'; export default class ColumnBackButton extends React.PureComponent { @@ -9,6 +10,10 @@ export default class ColumnBackButton extends React.PureComponent { router: PropTypes.object, }; + static propTypes = { + multiColumn: PropTypes.bool, + }; + handleClick = (event) => { // if history is exhausted, or we would leave mastodon, just go to root. if (window.history.state) { @@ -24,12 +29,20 @@ export default class ColumnBackButton extends React.PureComponent { } render () { - return ( + const { multiColumn } = this.props; + + const component = ( <button onClick={this.handleClick} className='column-back-button'> <Icon id='chevron-left' className='column-back-button__icon' fixedWidth /> <FormattedMessage id='column_back_button.label' defaultMessage='Back' /> </button> ); + + if (multiColumn) { + return component; + } else { + return createPortal(component, document.getElementById('tabs-bar__portal')); + } } } |