diff --git a/src/composables/useWebExtensionStorage.ts b/src/composables/useWebExtensionStorage.ts index 67b54c3..bacdc70 100644 --- a/src/composables/useWebExtensionStorage.ts +++ b/src/composables/useWebExtensionStorage.ts @@ -46,6 +46,13 @@ const storageInterface: StorageLikeAsync = { }, }; +/** + * Get page app context + */ +function getContext() { + return document.location.pathname.split('/')[2] as 'sidepanel' | 'options'; +} + /** * https://github.com/vueuse/vueuse/blob/658444bf9f8b96118dbd06eba411bb6639e24e88/packages/core/useStorageAsync/index.ts * @@ -73,8 +80,8 @@ export function useWebExtensionStorage( initialValue: MaybeRef, options: Pick< WebExtensionStorageOptions, - 'shallow' | 'serializer' | 'listenToStorageChanges' | 'flush' | 'deep' | 'eventFilter' - > = {}, + 'shallow' | 'serializer' | 'flush' | 'deep' | 'eventFilter' + > & { listenToStorageChanges?: boolean | 'sidepanel' | 'options' } = {}, ): RemovableRef { const { shallow = false, @@ -119,6 +126,12 @@ export function useWebExtensionStorage( if (!(key in changes)) { return; } + if (typeof listenToStorageChanges === 'string') { + const context = getContext(); + if (listenToStorageChanges !== context) { + return; + } + } try { pauseWatch(); await pullFromStorage(); diff --git a/src/logic/common-setup.ts b/src/logic/common-setup.ts index cbe4b58..3f1a2a3 100644 --- a/src/logic/common-setup.ts +++ b/src/logic/common-setup.ts @@ -5,9 +5,11 @@ import type { App } from 'vue'; * @param app Vue app */ export function setupApp(app: App) { + const context = document.location.pathname.split('/')[2]; + // Inject a globally available `$app` object in template app.config.globalProperties.$app = { - context: '', + context, }; // Provide access to `app` in script setup with `const app = inject('app')` diff --git a/src/logic/storage.ts b/src/logic/storage.ts index a95d3af..2abefc5 100644 --- a/src/logic/storage.ts +++ b/src/logic/storage.ts @@ -18,7 +18,7 @@ export const detailItems = useWebExtensionStorage> 'detailItems', new Map(), { - listenToStorageChanges: false, + listenToStorageChanges: 'options', }, ); @@ -26,7 +26,7 @@ export const reviewItems = useWebExtensionStorage>( 'reviewItems', new Map(), { - listenToStorageChanges: false, + listenToStorageChanges: 'options', }, );