From 60e2cdd81a43b3f5d85042df16fc69b110f00705 Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Tue, 4 Oct 2022 20:13:23 +0200 Subject: [PATCH] [Glitch] Fix various issues with logged-out web UI Port part of e2b561e3a521ff893943c0e9e32952e35934ca54 to glitch-soc Signed-off-by: Claire --- .../components/not_signed_in_indicator.js | 12 ++++ .../flavours/glitch/features/explore/index.js | 29 +++++---- .../glitch/features/home_timeline/index.js | 32 +++++++--- .../glitch/features/notifications/index.js | 61 ++++++++++++------- 4 files changed, 89 insertions(+), 45 deletions(-) create mode 100644 app/javascript/flavours/glitch/components/not_signed_in_indicator.js diff --git a/app/javascript/flavours/glitch/components/not_signed_in_indicator.js b/app/javascript/flavours/glitch/components/not_signed_in_indicator.js new file mode 100644 index 0000000000..b440c6be2f --- /dev/null +++ b/app/javascript/flavours/glitch/components/not_signed_in_indicator.js @@ -0,0 +1,12 @@ +import React from 'react'; +import { FormattedMessage } from 'react-intl'; + +const NotSignedInIndicator = () => ( +
+
+ +
+
+); + +export default NotSignedInIndicator; diff --git a/app/javascript/flavours/glitch/features/explore/index.js b/app/javascript/flavours/glitch/features/explore/index.js index 4a774e275a..388123c386 100644 --- a/app/javascript/flavours/glitch/features/explore/index.js +++ b/app/javascript/flavours/glitch/features/explore/index.js @@ -31,13 +31,13 @@ class Explore extends React.PureComponent { static contextTypes = { router: PropTypes.object, + identity: PropTypes.object, }; static propTypes = { intl: PropTypes.object.isRequired, multiColumn: PropTypes.bool, isSearching: PropTypes.bool, - layout: PropTypes.string, }; handleHeaderClick = () => { @@ -49,22 +49,21 @@ class Explore extends React.PureComponent { } render () { - const { intl, multiColumn, isSearching, layout } = this.props; + const { intl, multiColumn, isSearching } = this.props; + const { signedIn } = this.context.identity; return ( - {layout === 'mobile' ? ( -
- -
- ) : ( - - )} + + +
+ +
{isSearching ? ( @@ -75,7 +74,7 @@ class Explore extends React.PureComponent { - + {signedIn && }
diff --git a/app/javascript/flavours/glitch/features/home_timeline/index.js b/app/javascript/flavours/glitch/features/home_timeline/index.js index 51e9323077..7ca28da35a 100644 --- a/app/javascript/flavours/glitch/features/home_timeline/index.js +++ b/app/javascript/flavours/glitch/features/home_timeline/index.js @@ -13,6 +13,9 @@ import { fetchAnnouncements, toggleShowAnnouncements } from 'flavours/glitch/act import AnnouncementsContainer from 'flavours/glitch/features/getting_started/containers/announcements_container'; import classNames from 'classnames'; import IconWithBadge from 'flavours/glitch/components/icon_with_badge'; +import NotSignedInIndicator from 'flavours/glitch/components/not_signed_in_indicator'; +import { Helmet } from 'react-helmet'; +import { title } from 'flavours/glitch/util/initial_state'; const messages = defineMessages({ title: { id: 'column.home', defaultMessage: 'Home' }, @@ -33,6 +36,10 @@ export default @connect(mapStateToProps) @injectIntl class HomeTimeline extends React.PureComponent { + static contextTypes = { + identity: PropTypes.object, + }; + static propTypes = { dispatch: PropTypes.func.isRequired, intl: PropTypes.object.isRequired, @@ -115,6 +122,7 @@ class HomeTimeline extends React.PureComponent { render () { const { intl, hasUnread, columnId, multiColumn, hasAnnouncements, unreadAnnouncements, showAnnouncements } = this.props; const pinned = !!columnId; + const { signedIn } = this.context.identity; let announcementsButton = null; @@ -149,15 +157,21 @@ class HomeTimeline extends React.PureComponent {
- }} />} - bindToDocument={!multiColumn} - regex={this.props.regex} - /> + {signedIn ? ( + }} />} + bindToDocument={!multiColumn} + regex={this.props.regex} + /> + ) : } + + + {intl.formatMessage(messages.title)} - {title} +
); } diff --git a/app/javascript/flavours/glitch/features/notifications/index.js b/app/javascript/flavours/glitch/features/notifications/index.js index 2682dd29b5..6cfafb61e3 100644 --- a/app/javascript/flavours/glitch/features/notifications/index.js +++ b/app/javascript/flavours/glitch/features/notifications/index.js @@ -28,6 +28,9 @@ import LoadGap from 'flavours/glitch/components/load_gap'; import Icon from 'flavours/glitch/components/icon'; import compareId from 'flavours/glitch/util/compare_id'; import NotificationsPermissionBanner from './components/notifications_permission_banner'; +import NotSignedInIndicator from 'flavours/glitch/components/not_signed_in_indicator'; +import { Helmet } from 'react-helmet'; +import { title } from 'flavours/glitch/util/initial_state'; import NotificationPurgeButtonsContainer from 'flavours/glitch/containers/notification_purge_buttons_container'; @@ -94,6 +97,10 @@ export default @connect(mapStateToProps, mapDispatchToProps) @injectIntl class Notifications extends React.PureComponent { + static contextTypes = { + identity: PropTypes.object, + }; + static propTypes = { columnId: PropTypes.string, notifications: ImmutablePropTypes.list.isRequired, @@ -224,10 +231,11 @@ class Notifications extends React.PureComponent { const { animatingNCD } = this.state; const pinned = !!columnId; const emptyMessage = ; + const { signedIn } = this.context.identity; let scrollableContent = null; - const filterBarContainer = showFilterBar + const filterBarContainer = (signedIn && showFilterBar) ? () : null; @@ -257,26 +265,32 @@ class Notifications extends React.PureComponent { this.scrollableContent = scrollableContent; - const scrollContainer = ( - } - alwaysPrepend - emptyMessage={emptyMessage} - onLoadMore={this.handleLoadOlder} - onLoadPending={this.handleLoadPending} - onScrollToTop={this.handleScrollToTop} - onScroll={this.handleScroll} - bindToDocument={!multiColumn} - > - {scrollableContent} - - ); + let scrollContainer; + + if (signedIn) { + scrollContainer = ( + } + alwaysPrepend + emptyMessage={emptyMessage} + onLoadMore={this.handleLoadOlder} + onLoadPending={this.handleLoadPending} + onScrollToTop={this.handleScrollToTop} + onScroll={this.handleScroll} + bindToDocument={!multiColumn} + > + {scrollableContent} + + ); + } else { + scrollContainer = ; + } const extraButtons = []; @@ -354,8 +368,13 @@ class Notifications extends React.PureComponent { > + {filterBarContainer} {scrollContainer} + + + {intl.formatMessage(messages.title)} - {title} + ); }