From f86d280fd6fb742f836e527efd3f31cf9f9eda0e Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Wed, 23 May 2018 12:55:31 +0200 Subject: Use props.router instead of context.router, as we are using withRouter --- .../flavours/glitch/features/ui/index.js | 37 ++++++++++------------ 1 file changed, 17 insertions(+), 20 deletions(-) (limited to 'app/javascript/flavours/glitch') diff --git a/app/javascript/flavours/glitch/features/ui/index.js b/app/javascript/flavours/glitch/features/ui/index.js index 0e3a83bb6..756a24a76 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); } @@ -306,9 +303,9 @@ export default class UI extends React.Component { handleHotkeyBack = () => { if (window.history && window.history.length === 1) { - this.context.router.history.push('/'); + this.props.router.history.push('/'); } else { - this.context.router.history.goBack(); + this.props.router.history.goBack(); } } @@ -318,54 +315,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 () { -- cgit From cc396f085d5c706d8d2ddc26af5d551a2d5b9526 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Wed, 23 May 2018 14:17:05 +0200 Subject: Use history.state to decide whether we should goBack() or go to / (fixes #247) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit So far, glitch-soc used history.length to decide whether to call `goBack()` or go to / in order to not leave the webUI. This made clicking the “Back” button go to the “Getting started” column instead of going back in the browser's history when such an action would leave the web UI, but also when: - The WebUI is refreshed (F5) - A tab is restored - The history length reaches its maximum (e.g., 50 in Firefox) This commit fixes these shortcomings by checking `window.history.state`. Indeed, we only want to go back in the browser's history when the current location has been reached from within the WebUI, which only happens via `pushState` as far as I know. Since browser store the serialized state in the browser history, this also survives page reload and session restoration. --- app/javascript/flavours/glitch/components/column_back_button.js | 6 +++--- .../flavours/glitch/components/column_back_button_slim.js | 6 +++--- app/javascript/flavours/glitch/components/column_header.js | 6 +++--- app/javascript/flavours/glitch/features/ui/index.js | 7 ++++--- app/javascript/flavours/glitch/util/main.js | 5 ----- 5 files changed, 13 insertions(+), 17 deletions(-) (limited to 'app/javascript/flavours/glitch') 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/features/ui/index.js b/app/javascript/flavours/glitch/features/ui/index.js index 756a24a76..4a7a7d0f4 100644 --- a/app/javascript/flavours/glitch/features/ui/index.js +++ b/app/javascript/flavours/glitch/features/ui/index.js @@ -302,10 +302,11 @@ export default class UI extends React.Component { } handleHotkeyBack = () => { - if (window.history && window.history.length === 1) { - this.props.router.history.push('/'); + // if history is exhausted, or we would leave mastodon, just go to root. + if (window.history.state) { + this.context.router.history.goBack(); } else { - this.props.router.history.goBack(); + this.context.router.history.push('/'); } } 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; - } }); } -- cgit From 7d3c0e4cb4a34a901b90122d1d647dd07bc2d558 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Sat, 9 Jun 2018 18:14:23 +0200 Subject: Delete references to removed constants (fixes #537) --- app/javascript/flavours/glitch/reducers/accounts.js | 4 ---- app/javascript/flavours/glitch/reducers/accounts_counters.js | 4 ---- app/javascript/flavours/glitch/reducers/statuses.js | 4 ---- 3 files changed, 12 deletions(-) (limited to 'app/javascript/flavours/glitch') diff --git a/app/javascript/flavours/glitch/reducers/accounts.js b/app/javascript/flavours/glitch/reducers/accounts.js index 86f4970c9..2156de029 100644 --- a/app/javascript/flavours/glitch/reducers/accounts.js +++ b/app/javascript/flavours/glitch/reducers/accounts.js @@ -27,7 +27,6 @@ import { FAVOURITES_FETCH_SUCCESS, } from 'flavours/glitch/actions/interactions'; import { - TIMELINE_REFRESH_SUCCESS, TIMELINE_UPDATE, TIMELINE_EXPAND_SUCCESS, } from 'flavours/glitch/actions/timelines'; @@ -38,7 +37,6 @@ import { import { SEARCH_FETCH_SUCCESS } from 'flavours/glitch/actions/search'; import { NOTIFICATIONS_UPDATE, - NOTIFICATIONS_REFRESH_SUCCESS, NOTIFICATIONS_EXPAND_SUCCESS, } from 'flavours/glitch/actions/notifications'; import { @@ -144,11 +142,9 @@ export default function accounts(state = initialState, action) { case LIST_ACCOUNTS_FETCH_SUCCESS: case LIST_EDITOR_SUGGESTIONS_READY: return action.accounts ? normalizeAccounts(state, action.accounts) : state; - case NOTIFICATIONS_REFRESH_SUCCESS: case NOTIFICATIONS_EXPAND_SUCCESS: case SEARCH_FETCH_SUCCESS: return normalizeAccountsFromStatuses(normalizeAccounts(state, action.accounts), action.statuses); - case TIMELINE_REFRESH_SUCCESS: case TIMELINE_EXPAND_SUCCESS: case CONTEXT_FETCH_SUCCESS: case FAVOURITED_STATUSES_FETCH_SUCCESS: diff --git a/app/javascript/flavours/glitch/reducers/accounts_counters.js b/app/javascript/flavours/glitch/reducers/accounts_counters.js index 7abcb5dec..64dff9b55 100644 --- a/app/javascript/flavours/glitch/reducers/accounts_counters.js +++ b/app/javascript/flavours/glitch/reducers/accounts_counters.js @@ -29,7 +29,6 @@ import { FAVOURITES_FETCH_SUCCESS, } from 'flavours/glitch/actions/interactions'; import { - TIMELINE_REFRESH_SUCCESS, TIMELINE_UPDATE, TIMELINE_EXPAND_SUCCESS, } from 'flavours/glitch/actions/timelines'; @@ -40,7 +39,6 @@ import { import { SEARCH_FETCH_SUCCESS } from 'flavours/glitch/actions/search'; import { NOTIFICATIONS_UPDATE, - NOTIFICATIONS_REFRESH_SUCCESS, NOTIFICATIONS_EXPAND_SUCCESS, } from 'flavours/glitch/actions/notifications'; import { @@ -119,11 +117,9 @@ export default function accountsCounters(state = initialState, action) { case LIST_ACCOUNTS_FETCH_SUCCESS: case LIST_EDITOR_SUGGESTIONS_READY: return action.accounts ? normalizeAccounts(state, action.accounts) : state; - case NOTIFICATIONS_REFRESH_SUCCESS: case NOTIFICATIONS_EXPAND_SUCCESS: case SEARCH_FETCH_SUCCESS: return normalizeAccountsFromStatuses(normalizeAccounts(state, action.accounts), action.statuses); - case TIMELINE_REFRESH_SUCCESS: case TIMELINE_EXPAND_SUCCESS: case CONTEXT_FETCH_SUCCESS: case FAVOURITED_STATUSES_FETCH_SUCCESS: diff --git a/app/javascript/flavours/glitch/reducers/statuses.js b/app/javascript/flavours/glitch/reducers/statuses.js index bc5bc1804..94f367d72 100644 --- a/app/javascript/flavours/glitch/reducers/statuses.js +++ b/app/javascript/flavours/glitch/reducers/statuses.js @@ -21,14 +21,12 @@ import { STATUS_UNMUTE_SUCCESS, } from 'flavours/glitch/actions/statuses'; import { - TIMELINE_REFRESH_SUCCESS, TIMELINE_UPDATE, TIMELINE_DELETE, TIMELINE_EXPAND_SUCCESS, } from 'flavours/glitch/actions/timelines'; import { NOTIFICATIONS_UPDATE, - NOTIFICATIONS_REFRESH_SUCCESS, NOTIFICATIONS_EXPAND_SUCCESS, } from 'flavours/glitch/actions/notifications'; import { @@ -129,10 +127,8 @@ export default function statuses(state = initialState, action) { return state.setIn([action.id, 'muted'], true); case STATUS_UNMUTE_SUCCESS: return state.setIn([action.id, 'muted'], false); - case TIMELINE_REFRESH_SUCCESS: case TIMELINE_EXPAND_SUCCESS: case CONTEXT_FETCH_SUCCESS: - case NOTIFICATIONS_REFRESH_SUCCESS: case NOTIFICATIONS_EXPAND_SUCCESS: case FAVOURITED_STATUSES_FETCH_SUCCESS: case FAVOURITED_STATUSES_EXPAND_SUCCESS: -- cgit