feat: Add global wm enable/disable

src/background/Background.ts

@@ -12,6 +12,7 @@ import {
   isMonetizationReadyHandler,
   runPaymentHandler,
   setIncomingPointerHandler,
+  setStorageData,
   setStorageKey,
 } from '../messageHandlers'
 import { tabChangeHandler, tabUpdateHandler } from './tabHandlers'
@@ -25,6 +26,7 @@ class Background {
     getStorageData,
     getStorageKey,
     setStorageKey,
+    setStorageData,
   ]
   private subscriptions: any = []
   // TO DO: remove these from background into storage or state & use injection
@@ -39,7 +41,7 @@ class Background {
   // TODO: to be moved to a service
   async setStorageDefaultData() {
     try {
-      await storageApi.set({ ...defaultData })
+      await storageApi.set({ data: { ...defaultData } })
     } catch (error) {
       console.error('Error storing data:', error)
     }

src/messageHandlers/getStorageData.ts

@@ -2,7 +2,7 @@ import { storageApi } from '@/utils/storage'
 
 const getStorageData = async () => {
   try {
-    const data = await storageApi.get('data')
+    const { data } = await storageApi.get('data')
     return {
       type: 'SUCCESS',
       data,

src/messageHandlers/index.ts

@@ -4,6 +4,7 @@ import getStorageKey from './getStorageKey'
 import isMonetizationReadyHandler from './isMonetizationReadyHandler'
 import runPaymentHandler from './runPaymentHandler'
 import setIncomingPointerHandler from './setIncomingPointerHandler'
+import setStorageData from './setStorageData'
 import setStorageKey from './setStorageKey'
 
 export {
@@ -13,5 +14,6 @@ export {
   isMonetizationReadyHandler,
   runPaymentHandler,
   setIncomingPointerHandler,
+  setStorageData,
   setStorageKey,
 }

src/messageHandlers/setStorageData.ts

@@ -0,0 +1,17 @@
+import { storageApi } from '@/utils/storage'
+
+const setStorageData = async (data: any) => {
+  try {
+    await storageApi.set({ data })
+    return {
+      type: 'SUCCESS',
+    }
+  } catch (error) {
+    return {
+      type: 'ERROR',
+      error,
+    }
+  }
+}
+
+export default { callback: setStorageData, type: 'SET_STORAGE_DATA' }

src/providers/__tests__/popup-context.test.tsx

@@ -11,6 +11,7 @@ jest.mock('webextension-polyfill', () => ({
       addListener: jest.fn(),
       removeListener: jest.fn(),
     },
+    sendMessage: jest.fn(),
   },
 }))
 

src/providers/popup.provider.tsx

@@ -1,5 +1,6 @@
 import React, { createContext, useEffect, useState } from 'react'
 
+import { sendMessage } from '@/utils/sendMessages'
 import { defaultData, getStorageData } from '@/utils/storage'
 
 import { PopupContextValue, TPopupContext } from './providers.interface'
@@ -16,6 +17,10 @@ export const PopupContext = createContext<PopupContextValue>({
 export const PopupProvider: React.FC<IProps> = ({ children }) => {
   const [data, setData] = useState<TPopupContext>({ ...defaultData })
 
+  const updateStorageData = async () => {
+    await sendMessage({ type: 'SET_STORAGE_DATA', data })
+  }
+
   useEffect(() => {
     const fetchData = async () => {
       try {
@@ -32,6 +37,13 @@ export const PopupProvider: React.FC<IProps> = ({ children }) => {
     fetchData()
   }, [])
 
+  useEffect(() => {
+    if (JSON.stringify(data) !== JSON.stringify(defaultData)) {
+      updateStorageData()
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [data])
+
   return <PopupContext.Provider value={{ data, setData }}>{children}</PopupContext.Provider>
 }