Fix error messages when PDF is opened in multiple tabs. Fix #554

* Resolves an issue where having the document open and scrolled in
  multiple places would result in a repeated error message about remote
  changes.
* If a remote update is detected (using a websocket), the web library
  will now fetch the latest page index for the currently viewed
  document.
* If sending the page index results in a conflict, local data is updated
  to match the server. The user's view of the document remains
  unaffected.

package.json

@@ -103,7 +103,7 @@
     "redux-async-queue": "^1.0.0",
     "redux-thunk": "^3.1.0",
     "use-debounce": "^10.0.1",
-    "zotero-api-client": "^0.43.1"
+    "zotero-api-client": "^0.44.0"
   },
   "devDependencies": {
     "@babel/core": "^7.24.7",

src/js/actions/library.js

@@ -62,7 +62,7 @@ const fetchLibrarySettings = (libraryKey, settingsKey) => {
 }
 
 
-const updateLibrarySettings = (settingsKey, value, libraryKey = null) => {
+const updateLibrarySettings = (settingsKey, value, libraryKey = null, options) => {
 	return async (dispatch, getState) => {
 		libraryKey = libraryKey ?? getState().current.libraryKey;
 		const id = requestTracker.id++;
@@ -76,24 +76,25 @@ const updateLibrarySettings = (settingsKey, value, libraryKey = null) => {
 			});
 
 			dispatch(
-				queueUpdateLibrarySettings(settingsKey, value, libraryKey, { resolve, reject, id })
+				queueUpdateLibrarySettings(settingsKey, value, libraryKey, options, { resolve, reject, id })
 			);
 		});
 	};
 }
 
-const queueUpdateLibrarySettings = (settingsKey, value, libraryKey, { resolve, reject, id }) => {
+const queueUpdateLibrarySettings = (settingsKey, value, libraryKey, options, { resolve, reject, id }) => {
 	return {
 		queue: `${libraryKey}:${settingsKey}`, // independent queue for each library/settingsKey pair, does not block libraryKey queue
 		callback: async (next, dispatch, getState) => {
 			const state = getState();
 			const config = state.config;
 			const oldValue = state.libraries?.[libraryKey].settings?.entries?.[settingsKey];
-			const version = oldValue?.version ?? 0;
+			const version = options?.version ?? oldValue?.version ?? 0;
 
 			if(oldValue?.value === value) {
 				dispatch({
 					type: CANCEL_UPDATE_LIBRARY_SETTINGS,
+					reason: 'no-change',
 					settingsKey,
 					value,
 					libraryKey,
@@ -130,15 +131,36 @@ const queueUpdateLibrarySettings = (settingsKey, value, libraryKey, { resolve, r
 				});
 				resolve();
 			} catch(error) {
-				dispatch({
-					type: ERROR_UPDATE_LIBRARY_SETTINGS,
-					settingsKey,
-					value,
-					libraryKey,
-					error
-				});
-				reject(error);
-				throw error;
+				if (error?.response?.status === 412 && (options.force || options.ignore)) {
+					// remote version is newer, but we've been asked to force or ignore conflict
+					let serverVersion = error.getVersion();
+					dispatch({
+						type: CANCEL_UPDATE_LIBRARY_SETTINGS,
+						reason: options.force ? 'conflict-force' : 'conflict-ignore',
+						localVersion: version,
+						serverVersion,
+						settingsKey,
+						value,
+						libraryKey,
+						id
+					});
+					if (options.ignore) {
+						dispatch(fetchLibrarySettings(libraryKey, settingsKey));
+					} else if (options.force) {
+						dispatch(updateLibrarySettings(settingsKey, value, libraryKey, { version: serverVersion }));
+					}
+					resolve();
+				} else {
+					dispatch({
+						type: ERROR_UPDATE_LIBRARY_SETTINGS,
+						settingsKey,
+						value,
+						libraryKey,
+						error
+					});
+					reject(error);
+					throw error;
+				}
 			} finally {
 				next();
 			}

src/js/actions/remote.js

@@ -1,5 +1,6 @@
 import { STREAMING_REMOTE_LIBRARY_UPDATE } from '../constants/actions';
 import { get } from '../utils';
+import { getLastPageIndexSettingKey } from '../common/item';
 import { fetchDeletedContentSince, fetchAllCollectionsSince, fetchAllItemsSince, fetchLibrarySettings } from '.';
 
 const remoteLibraryUpdate = (libraryKey, version) => {
@@ -12,6 +13,10 @@ const remoteLibraryUpdate = (libraryKey, version) => {
 			dispatch(fetchAllItemsSince(oldVersion, { includeTrashed: 1 }, { current: { libraryKey } }));
 			dispatch(fetchAllCollectionsSince(oldVersion, libraryKey));
 			dispatch(fetchDeletedContentSince(oldVersion, libraryKey));
+			if (state.current.view === 'reader' && state.current.attachmentKey) {
+				const pageIndexSettingKey = getLastPageIndexSettingKey(state.current.attachmentKey, state.current.libraryKey);
+				dispatch(fetchLibrarySettings(libraryKey, pageIndexSettingKey));
+			}
 		}
 	}
 }

src/js/component/reader.jsx

@@ -107,6 +107,10 @@ const readerReducer = (state, action) => {
 			return { ...state, isRouteConfirmed: true }
 		case 'COMPLETE_FETCH_SETTINGS':
 			return { ...state, isSettingsFetched: true }
+		case 'BEGIN_PUSH_SETTINGS':
+			return { ...state, isSettingPushRequired: true, newSettings: action.value }
+		case 'COMPLETE_PUSH_SETTINGS':
+			return { ...state, isSettingPushRequired: false, newSettings: null }
 		case 'BEGIN_FETCH_DATA':
 			return { ...state, dataState: FETCHING };
 		case 'COMPLETE_FETCH_DATA':
@@ -188,6 +192,8 @@ const Reader = () => {
 		isReady: false,
 		isRouteConfirmed: false,
 		isSettingsFetched: false,
+		isSettingPushRequired: false,
+		newSettings: null,
 		data: null,
 		dataState: UNFETCHED,
 		annotationsState: NOT_IMPORTED,
@@ -265,9 +271,9 @@ const Reader = () => {
 	const handleChangeViewState = useDebouncedCallback(useCallback((newViewState, isPrimary) => {
 		const pageIndexKey = PAGE_INDEX_KEY_LOOKUP[attachmentItem?.contentType];
 		if (isPrimary && userLibraryKey && pageIndexKey) {
-			dispatch(updateLibrarySettings(pageIndexSettingKey, newViewState[pageIndexKey], userLibraryKey));
+			dispatchState({ type: 'BEGIN_PUSH_SETTINGS', value: newViewState[pageIndexKey] });
 		}
-	}, [attachmentItem, dispatch, pageIndexSettingKey, userLibraryKey]), 1000);
+	}, [attachmentItem, userLibraryKey]), 1000);
 
 	// NOTE: handler can't be updated once it has been passed to Reader
 	const handleToggleSidebar = useDebouncedCallback(useCallback((isOpen) => {
@@ -496,6 +502,13 @@ const Reader = () => {
 		}
 	}, [rotatePages, state.action, state.data, state.isReady]);
 
+	useEffect(() => {
+		if (state.isSettingsFetched && state.isSettingPushRequired) {
+			dispatch(updateLibrarySettings(pageIndexSettingKey, state.newSettings, userLibraryKey, { ignore: true }));
+			dispatchState({ type: 'COMPLETE_PUSH_SETTINGS' });
+		}
+	}, [dispatch, pageIndexSettingKey, state.isSettingPushRequired, state.isSettingsFetched, state.newSettings, userLibraryKey]);
+
 	return (
     <section className="reader-wrapper" onKeyDown={handleKeyDown} tabIndex="0">
 		{isReaderCompatibleBrowser() ? (