Refresh options component when they change in another tab

trakt-tools · May 26, 2021 · f65fc8a · f65fc8a
1 parent 95799e0
commit f65fc8a
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 1 deletion.
diff --git a/src/common/BrowserStorage.tsx b/src/common/BrowserStorage.tsx
@@ -5,6 +5,7 @@ import { CorrectionSuggestion, SavedItem } from '../models/Item';
 import { SavedTraktItem, TraktItemBase } from '../models/TraktItem';
 import { HboGoApiParams } from '../streaming-services/hbo-go/HboGoApi';
 import { StreamingServiceId, streamingServices } from '../streaming-services/streaming-services';
+import { EventDispatcher } from './Events';
 import { I18N } from './I18N';
 import { Shared } from './Shared';
 
@@ -283,7 +284,7 @@ class _BrowserStorage {
 		browser.storage.onChanged.removeListener(this.onStorageChanged);
 	};
 
-	onStorageChanged = (
+	onStorageChanged = async (
 		changes: browser.storage.ChangeDict,
 		areaName: browser.storage.StorageName
 	) => {
@@ -298,6 +299,7 @@ class _BrowserStorage {
 			][]) {
 				this.addOption({ id, value });
 			}
+			await EventDispatcher.dispatch('STORAGE_OPTIONS_CHANGE', null, {});
 		}
 		const newSyncOptions = changes.syncOptions?.newValue as StorageValuesSyncOptions | undefined;
 		if (newSyncOptions) {

diff --git a/src/common/Events.ts b/src/common/Events.ts
@@ -43,6 +43,7 @@ export interface EventData {
 	HISTORY_SYNC_SUCCESS: HistorySyncSuccessData;
 	HISTORY_SYNC_ERROR: ErrorData;
 	REQUESTS_CANCEL: RequestsCancelData;
+	STORAGE_OPTIONS_CHANGE: SuccessData;
 }
 
 export type Event = keyof EventData;

diff --git a/src/modules/options/OptionsApp.tsx b/src/modules/options/OptionsApp.tsx
@@ -40,6 +40,7 @@ export const OptionsApp: React.FC = () => {
 				null,
 				onStreamingServiceOptionChange
 			);
+			EventDispatcher.subscribe('STORAGE_OPTIONS_CHANGE', null, onStorageOptionsChange);
 		};
 
 		const stopListeners = () => {
@@ -50,6 +51,7 @@ export const OptionsApp: React.FC = () => {
 				null,
 				onStreamingServiceOptionChange
 			);
+			EventDispatcher.unsubscribe('STORAGE_OPTIONS_CHANGE', null, onStorageOptionsChange);
 		};
 
 		const resetOptions = () => {
@@ -200,6 +202,13 @@ export const OptionsApp: React.FC = () => {
 			}
 		};
 
+		const onStorageOptionsChange = () => {
+			setContent({
+				isLoading: false,
+				optionsChanged: {},
+			});
+		};
+
 		startListeners();
 		return stopListeners;
 	}, []);