diff options
Diffstat (limited to 'app/javascript/flavours/glitch')
12 files changed, 54 insertions, 39 deletions
diff --git a/app/javascript/flavours/glitch/components/column_back_button.js b/app/javascript/flavours/glitch/components/column_back_button.js index 50c3bf11f..a562ef9b9 100644 --- a/app/javascript/flavours/glitch/components/column_back_button.js +++ b/app/javascript/flavours/glitch/components/column_back_button.js @@ -10,10 +10,10 @@ export default class ColumnBackButton extends React.PureComponent { handleClick = () => { // if history is exhausted, or we would leave mastodon, just go to root. - if (window.history && (window.history.length === 1 || window.history.length === window._mastoInitialHistoryLen)) { - this.context.router.history.push('/'); - } else { + if (window.history.state) { this.context.router.history.goBack(); + } else { + this.context.router.history.push('/'); } } diff --git a/app/javascript/flavours/glitch/components/column_back_button_slim.js b/app/javascript/flavours/glitch/components/column_back_button_slim.js index 2cdf1b25b..c99c202af 100644 --- a/app/javascript/flavours/glitch/components/column_back_button_slim.js +++ b/app/javascript/flavours/glitch/components/column_back_button_slim.js @@ -10,10 +10,10 @@ export default class ColumnBackButtonSlim extends React.PureComponent { handleClick = () => { // if history is exhausted, or we would leave mastodon, just go to root. - if (window.history && (window.history.length === 1 || window.history.length === window._mastoInitialHistoryLen)) { - this.context.router.history.push('/'); - } else { + if (window.history.state) { this.context.router.history.goBack(); + } else { + this.context.router.history.push('/'); } } diff --git a/app/javascript/flavours/glitch/components/column_header.js b/app/javascript/flavours/glitch/components/column_header.js index bfad6467d..72207637d 100644 --- a/app/javascript/flavours/glitch/components/column_header.js +++ b/app/javascript/flavours/glitch/components/column_header.js @@ -66,10 +66,10 @@ export default class ColumnHeader extends React.PureComponent { handleBackClick = () => { // if history is exhausted, or we would leave mastodon, just go to root. - if (window.history && (window.history.length === 1 || window.history.length === window._mastoInitialHistoryLen)) { - this.context.router.history.push('/'); - } else { + if (window.history.state) { this.context.router.history.goBack(); + } else { + this.context.router.history.push('/'); } } diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js index c93705266..a90ff491e 100644 --- a/app/javascript/flavours/glitch/components/status.js +++ b/app/javascript/flavours/glitch/components/status.js @@ -153,6 +153,11 @@ export default class Status extends ImmutablePureComponent { muted, prepend, } = this.props; + + // Prevent a crash when node is undefined. Not completely sure why this + // happens, might be because status === null. + if (node === undefined) return; + const autoCollapseSettings = settings.getIn(['collapsed', 'auto']); if (function () { diff --git a/app/javascript/flavours/glitch/components/status_action_bar.js b/app/javascript/flavours/glitch/components/status_action_bar.js index 6ae4bc08d..5bc5d8406 100644 --- a/app/javascript/flavours/glitch/components/status_action_bar.js +++ b/app/javascript/flavours/glitch/components/status_action_bar.js @@ -188,7 +188,7 @@ export default class StatusActionBar extends ImmutablePureComponent { <IconButton className='status__action-bar-button' disabled={reblogDisabled} active={status.get('reblogged')} pressed={status.get('reblogged')} title={reblogDisabled ? intl.formatMessage(messages.cannot_reblog) : intl.formatMessage(reblogMessage)} icon={reblogIcon} onClick={this.handleReblogClick} /> <IconButton className='status__action-bar-button star-icon' disabled={anonymousAccess} animate active={status.get('favourited')} pressed={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} /> {shareButton} - <IconButton className='status__action-bar-button' disabled={anonymousAccess} active={status.get('bookmarked')} pressed={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /> + <IconButton className='status__action-bar-button bookmark-icon' disabled={anonymousAccess} active={status.get('bookmarked')} pressed={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /> <div className='status__action-bar-dropdown'> <DropdownMenuContainer disabled={anonymousAccess} status={status} items={menu} icon='ellipsis-h' size={18} direction='right' ariaLabel={intl.formatMessage(messages.more)} /> diff --git a/app/javascript/flavours/glitch/components/status_icons.js b/app/javascript/flavours/glitch/components/status_icons.js index e354c45e4..c9747650f 100644 --- a/app/javascript/flavours/glitch/components/status_icons.js +++ b/app/javascript/flavours/glitch/components/status_icons.js @@ -47,9 +47,15 @@ export default class StatusIcons extends React.PureComponent { return ( <div className='status__info__icons'> + {status.get('in_reply_to_id', null) !== null ? ( + <i + className={`fa fa-fw fa-comment status__reply-icon`} + aria-hidden='true' + /> + ) : null} {mediaIcon ? ( <i - className={`fa fa-fw fa-${mediaIcon}`} + className={`fa fa-fw fa-${mediaIcon} status__media-icon`} aria-hidden='true' /> ) : null} diff --git a/app/javascript/flavours/glitch/features/status/components/action_bar.js b/app/javascript/flavours/glitch/features/status/components/action_bar.js index ef8805377..976d7ba76 100644 --- a/app/javascript/flavours/glitch/features/status/components/action_bar.js +++ b/app/javascript/flavours/glitch/features/status/components/action_bar.js @@ -159,7 +159,7 @@ export default class ActionBar extends React.PureComponent { <div className='detailed-status__button'><IconButton disabled={reblog_disabled} active={status.get('reblogged')} title={reblog_disabled ? intl.formatMessage(messages.cannot_reblog) : intl.formatMessage(reblog_message)} icon={reblogIcon} onClick={this.handleReblogClick} /></div> <div className='detailed-status__button'><IconButton className='star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} /></div> {shareButton} - <div className='detailed-status__button'><IconButton active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /></div> + <div className='detailed-status__button'><IconButton className='bookmark-icon' active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /></div> <div className='detailed-status__action-bar-dropdown'> <DropdownMenuContainer size={18} icon='ellipsis-h' items={menu} direction='left' ariaLabel='More' /> diff --git a/app/javascript/flavours/glitch/features/ui/index.js b/app/javascript/flavours/glitch/features/ui/index.js index 0e3a83bb6..4a7a7d0f4 100644 --- a/app/javascript/flavours/glitch/features/ui/index.js +++ b/app/javascript/flavours/glitch/features/ui/index.js @@ -99,10 +99,6 @@ const keyMap = { @withRouter export default class UI extends React.Component { - static contextTypes = { - router: PropTypes.object.isRequired, - }; - static propTypes = { dispatch: PropTypes.func.isRequired, children: PropTypes.node, @@ -113,6 +109,7 @@ export default class UI extends React.Component { isComposing: PropTypes.bool, hasComposingText: PropTypes.bool, location: PropTypes.object, + router: PropTypes.object, intl: PropTypes.object.isRequired, dropdownMenuIsOpen: PropTypes.bool, }; @@ -200,7 +197,7 @@ export default class UI extends React.Component { handleServiceWorkerPostMessage = ({ data }) => { if (data.type === 'navigate') { - this.context.router.history.push(data.path); + this.props.router.history.push(data.path); } else { console.warn('Unknown message type:', data.type); } @@ -305,10 +302,11 @@ export default class UI extends React.Component { } handleHotkeyBack = () => { - if (window.history && window.history.length === 1) { - this.context.router.history.push('/'); - } else { + // if history is exhausted, or we would leave mastodon, just go to root. + if (window.history.state) { this.context.router.history.goBack(); + } else { + this.context.router.history.push('/'); } } @@ -318,54 +316,54 @@ export default class UI extends React.Component { handleHotkeyToggleHelp = () => { if (this.props.location.pathname === '/keyboard-shortcuts') { - this.context.router.history.goBack(); + this.props.router.history.goBack(); } else { - this.context.router.history.push('/keyboard-shortcuts'); + this.props.router.history.push('/keyboard-shortcuts'); } } handleHotkeyGoToHome = () => { - this.context.router.history.push('/timelines/home'); + this.props.router.history.push('/timelines/home'); } handleHotkeyGoToNotifications = () => { - this.context.router.history.push('/notifications'); + this.props.router.history.push('/notifications'); } handleHotkeyGoToLocal = () => { - this.context.router.history.push('/timelines/public/local'); + this.props.router.history.push('/timelines/public/local'); } handleHotkeyGoToFederated = () => { - this.context.router.history.push('/timelines/public'); + this.props.router.history.push('/timelines/public'); } handleHotkeyGoToDirect = () => { - this.context.router.history.push('/timelines/direct'); + this.props.router.history.push('/timelines/direct'); } handleHotkeyGoToStart = () => { - this.context.router.history.push('/getting-started'); + this.props.router.history.push('/getting-started'); } handleHotkeyGoToFavourites = () => { - this.context.router.history.push('/favourites'); + this.props.router.history.push('/favourites'); } handleHotkeyGoToPinned = () => { - this.context.router.history.push('/pinned'); + this.props.router.history.push('/pinned'); } handleHotkeyGoToProfile = () => { - this.context.router.history.push(`/accounts/${me}`); + this.props.router.history.push(`/accounts/${me}`); } handleHotkeyGoToBlocked = () => { - this.context.router.history.push('/blocks'); + this.props.router.history.push('/blocks'); } handleHotkeyGoToMuted = () => { - this.context.router.history.push('/mutes'); + this.props.router.history.push('/mutes'); } render () { diff --git a/app/javascript/flavours/glitch/styles/components/index.scss b/app/javascript/flavours/glitch/styles/components/index.scss index 0fa940766..487bb7ffb 100644 --- a/app/javascript/flavours/glitch/styles/components/index.scss +++ b/app/javascript/flavours/glitch/styles/components/index.scss @@ -248,6 +248,10 @@ color: $gold-star; } +.bookmark-icon.active { + color: $red-bookmark; +} + .notification__display-name { color: inherit; font-weight: 500; diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss index 733845c5f..2b31e2dcb 100644 --- a/app/javascript/flavours/glitch/styles/components/status.scss +++ b/app/javascript/flavours/glitch/styles/components/status.scss @@ -331,8 +331,13 @@ height: 1em; color: $action-button-color; - .status__visibility-icon { + .status__media-icon { padding-left: 6px; + padding-right: 1px; + } + + .status__visibility-icon { + padding-left: 4px; } } diff --git a/app/javascript/flavours/glitch/styles/variables.scss b/app/javascript/flavours/glitch/styles/variables.scss index cc08fd06f..bde808fe2 100644 --- a/app/javascript/flavours/glitch/styles/variables.scss +++ b/app/javascript/flavours/glitch/styles/variables.scss @@ -6,6 +6,8 @@ $error-red: #df405a; // Cerise $warning-red: #ff5050; // Sunset Orange $gold-star: #ca8f04; // Dark Goldenrod +$red-bookmark: $warning-red; + // Values from the classic Mastodon UI $classic-base-color: #282c37; // Midnight Express $classic-primary-color: #9baec8; // Echo Blue diff --git a/app/javascript/flavours/glitch/util/main.js b/app/javascript/flavours/glitch/util/main.js index c00210677..b76826481 100644 --- a/app/javascript/flavours/glitch/util/main.js +++ b/app/javascript/flavours/glitch/util/main.js @@ -28,11 +28,6 @@ function main() { store.dispatch(registerPushNotifications.register()); } perf.stop('main()'); - - // remember the initial URL - if (window.history && typeof window._mastoInitialHistoryLen === 'undefined') { - window._mastoInitialHistoryLen = window.history.length; - } }); } |