From aaca78da78909dd5a23df3e70de07b838eaf4a0e Mon Sep 17 00:00:00 2001 From: nyura123dev <58617294+nyura123dev@users.noreply.github.com> Date: Thu, 17 Nov 2022 01:54:43 -0600 Subject: [PATCH] Fix safari explore disappearing tabs (#20917) * fix disappearing Explore tabs on Safari * fix lint Co-authored-by: nyura --- .../mastodon/features/explore/index.js | 20 ++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) diff --git a/app/javascript/mastodon/features/explore/index.js b/app/javascript/mastodon/features/explore/index.js index 552def142d..286170c9ff 100644 --- a/app/javascript/mastodon/features/explore/index.js +++ b/app/javascript/mastodon/features/explore/index.js @@ -24,6 +24,16 @@ const mapStateToProps = state => ({ isSearching: state.getIn(['search', 'submitted']) || !showTrends, }); +// Fix strange bug on Safari where (rendered by FormattedMessage) disappears +// after clicking around Explore top bar (issue #20885). +// Removing width=100% from also fixes it, as well as replacing with
+// We're choosing to wrap span with div to keep the changes local only to this tool bar. +const WrapFormattedMessage = ({ children, ...props }) =>
{children}
; +WrapFormattedMessage.propTypes = { + children: PropTypes.any, +}; + + export default @connect(mapStateToProps) @injectIntl class Explore extends React.PureComponent { @@ -47,7 +57,7 @@ class Explore extends React.PureComponent { this.column = c; } - render () { + render() { const { intl, multiColumn, isSearching } = this.props; const { signedIn } = this.context.identity; @@ -70,10 +80,10 @@ class Explore extends React.PureComponent { ) : (
- - - - {signedIn && } + + + + {signedIn && }