Mutitabs: Auth-reload other tabs when one tab is updated (#2603)

This commit is contained in:
Alexander Zinchuk 2023-02-17 02:31:54 +01:00
parent 7353adb739
commit 99dc944de6
2 changed files with 15 additions and 4 deletions

View File

@ -12,7 +12,7 @@ import { setupBeforeInstallPrompt } from './util/installPrompt';
import { IS_INSTALL_PROMPT_SUPPORTED, IS_MULTITAB_SUPPORTED } from './util/environment';
import './global/init';
import { DEBUG, MULTITAB_LOCALSTORAGE_KEY } from './config';
import { APP_VERSION, DEBUG, MULTITAB_LOCALSTORAGE_KEY } from './config';
import { establishMultitabRole, subscribeToMasterChange } from './util/establishMultitabRole';
import { requestGlobal, subscribeToMultitabBroadcastChannel } from './util/multitab';
import { onBeforeUnload } from './util/schedulers';
@ -31,7 +31,7 @@ async function init() {
if (IS_MULTITAB_SUPPORTED) {
subscribeToMultitabBroadcastChannel();
await requestGlobal();
await requestGlobal(APP_VERSION);
localStorage.setItem(MULTITAB_LOCALSTORAGE_KEY, '1');
onBeforeUnload(() => {
const global = getGlobal();

View File

@ -7,7 +7,7 @@ import type { ApiInitialArgs } from '../api/types';
import type { GlobalState } from '../global/types';
import { IS_MULTITAB_SUPPORTED } from './environment';
import { DATA_BROADCAST_CHANNEL_NAME, MULTITAB_LOCALSTORAGE_KEY } from '../config';
import { APP_VERSION, DATA_BROADCAST_CHANNEL_NAME, MULTITAB_LOCALSTORAGE_KEY } from '../config';
import { deepMerge } from './deepMerge';
import { selectTabState } from '../global/selectors';
import {
@ -27,6 +27,7 @@ import { omit } from './iteratees';
type BroadcastChannelRequestGlobal = {
type: 'requestGlobal';
token?: number;
appVersion: string;
};
type BroadcastChannelGlobalUpdate = {
@ -221,8 +222,17 @@ export function handleMessage({ data }: { data: BroadcastChannelMessage }) {
}
case 'requestGlobal': {
const { appVersion } = data;
if (appVersion !== APP_VERSION) {
// If app version on the other tab was updated, reload the current page immediately and don't respond
// to the other tab's request because our current global might be incompatible with the new version
window.location.reload();
return;
}
if (!isFirstGlobalResolved) return;
const global = getGlobal();
if (!selectTabState(global).isMasterTab) return;
channel.postMessage({
@ -328,10 +338,11 @@ export function handleMessage({ data }: { data: BroadcastChannelMessage }) {
}
}
export function requestGlobal(): Promise<void> {
export function requestGlobal(appVersion: string): Promise<void> {
if (channel) {
channel.postMessage({
type: 'requestGlobal',
appVersion,
});
}