cases

src/background-cases.ts

@@ -1,12 +1,16 @@
 import {
+    cancelInvitationToGroup,
+    createGroup,
   decryptWallet,
   findUsableApi,
   getBalanceInfo,
   getKeyPair,
   getLTCBalance,
   getNameInfo,
+  getTempPublish,
   getUserInfo,
   inviteToGroup,
+  leaveGroup,
   saveTempPublish,
   sendCoin,
   walletVersion,
@@ -287,3 +291,120 @@ export async function balanceCase(request, event) {
       );
     }
   }
+
+  export async function getTempPublishCase(request, event) {
+    try {
+      const response = await getTempPublish();
+  
+      event.source.postMessage(
+        {
+          requestId: request.requestId,
+          action: "getTempPublish",
+          payload: response,
+          type: "backgroundMessageResponse",
+        },
+        event.origin
+      );
+    } catch (error) {
+      event.source.postMessage(
+        {
+          requestId: request.requestId,
+          action: "getTempPublish",
+          error: error?.message,
+          type: "backgroundMessageResponse",
+        },
+        event.origin
+      );
+    }
+  }
+
+  export async function createGroupCase(request, event) {
+    try {
+      const { groupName,
+            groupDescription,
+            groupType,
+            groupApprovalThreshold,
+            minBlock,
+            maxBlock } = request.payload;
+      const response = await createGroup({groupName,
+            groupDescription,
+            groupType,
+            groupApprovalThreshold,
+            minBlock,
+            maxBlock});
+  
+      event.source.postMessage(
+        {
+          requestId: request.requestId,
+          action: "createGroup",
+          payload: response,
+          type: "backgroundMessageResponse",
+        },
+        event.origin
+      );
+    } catch (error) {
+      event.source.postMessage(
+        {
+          requestId: request.requestId,
+          action: "createGroup",
+          error: error?.message,
+          type: "backgroundMessageResponse",
+        },
+        event.origin
+      );
+    }
+  }
+
+  export async function cancelInvitationToGroupCase(request, event) {
+    try {
+      const { groupId, qortalAddress } = request.payload;
+      const response = await cancelInvitationToGroup({groupId, qortalAddress});
+  
+      event.source.postMessage(
+        {
+          requestId: request.requestId,
+          action: "cancelInvitationToGroup",
+          payload: response,
+          type: "backgroundMessageResponse",
+        },
+        event.origin
+      );
+    } catch (error) {
+      event.source.postMessage(
+        {
+          requestId: request.requestId,
+          action: "cancelInvitationToGroup",
+          error: error?.message,
+          type: "backgroundMessageResponse",
+        },
+        event.origin
+      );
+    }
+  }
+
+  export async function leaveGroupCase(request, event) {
+    try {
+      const { groupId, qortalAddress } = request.payload;
+      const response = await leaveGroup({groupId, qortalAddress});
+  
+      event.source.postMessage(
+        {
+          requestId: request.requestId,
+          action: "leaveGroup",
+          payload: response,
+          type: "backgroundMessageResponse",
+        },
+        event.origin
+      );
+    } catch (error) {
+      event.source.postMessage(
+        {
+          requestId: request.requestId,
+          action: "leaveGroup",
+          error: error?.message,
+          type: "backgroundMessageResponse",
+        },
+        event.origin
+      );
+    }
+  }

src/background.ts

@@ -1,6 +1,6 @@
 // @ts-nocheck
 
-import './qortalRequests'
+import "./qortalRequests";
 import { isArray } from "lodash";
 import {
   decryptGroupEncryption,
@@ -28,18 +28,34 @@ import { validateAddress } from "./utils/validateAddress";
 import { Sha256 } from "asmcrypto.js";
 import { TradeBotRespondMultipleRequest } from "./transactions/TradeBotRespondMultipleRequest";
 import { RESOURCE_TYPE_NUMBER_GROUP_CHAT_REACTIONS } from "./constants/resourceTypes";
-import { balanceCase, decryptWalletCase, getWalletInfoCase, inviteToGroupCase, ltcBalanceCase, nameCase, saveTempPublishCase, sendCoinCase, userInfoCase, validApiCase, versionCase } from './background-cases';
+import {
+  balanceCase,
+  cancelInvitationToGroupCase,
+  createGroupCase,
+  decryptWalletCase,
+  getTempPublishCase,
+  getWalletInfoCase,
+  inviteToGroupCase,
+  leaveGroupCase,
+  ltcBalanceCase,
+  nameCase,
+  saveTempPublishCase,
+  sendCoinCase,
+  userInfoCase,
+  validApiCase,
+  versionCase,
+} from "./background-cases";
 
 export function cleanUrl(url) {
-  return url?.replace(/^(https?:\/\/)?(www\.)?/, '');
+  return url?.replace(/^(https?:\/\/)?(www\.)?/, "");
 }
 export function getProtocol(url) {
-  if (url?.startsWith('https://')) {
+  if (url?.startsWith("https://")) {
-    return 'https';
+    return "https";
-  } else if (url?.startsWith('http://')) {
+  } else if (url?.startsWith("http://")) {
-    return 'http';
+    return "http";
   } else {
-    return 'unknown'; // If neither protocol is present
+    return "unknown"; // If neither protocol is present
   }
 }
 
@@ -52,7 +68,6 @@ const timeDifferenceForNotificationChatsBackground = 600000;
 const requestQueueAnnouncements = new RequestQueueWithPromise(1);
 let isMobile = true;
 
-
 const isMobileDevice = () => {
   const userAgent = navigator.userAgent || navigator.vendor || window.opera;
 
@@ -130,7 +145,6 @@ const getCustomNodesFromStorage = async () => {
   });
 };
 
-
 const getArbitraryEndpoint = async () => {
   const apiKey = await getApiKeyFromStorage(); // Retrieve apiKey asynchronously
   if (apiKey) {
@@ -153,17 +167,14 @@ export const getBaseApi = async (customApi?: string) => {
   }
 };
 export const isUsingLocal = async () => {
-
   const apiKey = await getApiKeyFromStorage(); // Retrieve apiKey asynchronously
   if (apiKey) {
-    return true
+    return true;
   } else {
     return false;
   }
 };
 
-
-
 export const createEndpoint = async (endpoint, customApi?: string) => {
   if (customApi) {
     return `${customApi}${endpoint}`;
@@ -257,7 +268,7 @@ export function isUpdateMsg(data) {
     const numberKey = parseInt(keyStr, 10);
     if (isNaN(numberKey)) {
       isUpdateMessage = false;
-    } else if(numberKey !== RESOURCE_TYPE_NUMBER_GROUP_CHAT_REACTIONS){
+    } else if (numberKey !== RESOURCE_TYPE_NUMBER_GROUP_CHAT_REACTIONS) {
       isUpdateMessage = false;
     }
   } catch (error) {
@@ -295,10 +306,11 @@ const handleNotificationDirect = async (directs) => {
   let isFocused;
   const wallet = await getSaveWallet();
   const address = wallet.address0;
-  let isDisableNotifications = await getUserSettings({key: 'disable-push-notifications'}) || false
+  let isDisableNotifications =
+    (await getUserSettings({ key: "disable-push-notifications" })) || false;
   const dataDirects = directs.filter((direct) => direct?.sender !== address);
   try {
-    if(isDisableNotifications) return
+    if (isDisableNotifications) return;
     if (!dataDirects || dataDirects?.length === 0) return;
     isFocused = await checkWebviewFocus();
 
@@ -514,17 +526,25 @@ async function updateThreadActivity({ threadId, qortalName, groupId, thread }) {
 const handleNotification = async (groups) => {
   const wallet = await getSaveWallet();
   const address = wallet.address0;
-  let isDisableNotifications = await getUserSettings({key: 'disable-push-notifications'}) || false
+  let isDisableNotifications =
+    (await getUserSettings({ key: "disable-push-notifications" })) || false;
 
-  let mutedGroups = await getUserSettings({key: 'mutedGroups'}) || []
+  let mutedGroups = (await getUserSettings({ key: "mutedGroups" })) || [];
-  if(!isArray(mutedGroups)) mutedGroups = []
+  if (!isArray(mutedGroups)) mutedGroups = [];
 
   let isFocused;
-  const data = groups.filter((group) => group?.sender !== address && !mutedGroups.includes(group.groupId) && !isUpdateMsg(group?.data));
+  const data = groups.filter(
-  const dataWithUpdates = groups.filter((group) => group?.sender !== address && !mutedGroups.includes(group.groupId));
+    (group) =>
+      group?.sender !== address &&
+      !mutedGroups.includes(group.groupId) &&
+      !isUpdateMsg(group?.data)
+  );
+  const dataWithUpdates = groups.filter(
+    (group) => group?.sender !== address && !mutedGroups.includes(group.groupId)
+  );
 
   try {
-    if(isDisableNotifications) return
+    if (isDisableNotifications) return;
     if (!data || data?.length === 0) return;
     isFocused = await checkWebviewFocus();
 
@@ -765,8 +785,9 @@ const checkThreads = async (bringBack) => {
         Date.now() +
         "_type=thread-post" +
         `_data=${JSON.stringify(newAnnouncements[0])}`;
-        let isDisableNotifications = await getUserSettings({key: 'disable-push-notifications'}) || false
+      let isDisableNotifications =
-      if(!isDisableNotifications){
+        (await getUserSettings({ key: "disable-push-notifications" })) || false;
+      if (!isDisableNotifications) {
         chrome.notifications.create(notificationId, {
           type: "basic",
           iconUrl: "qort.png", // Add an appropriate icon for chat notifications
@@ -784,7 +805,6 @@ const checkThreads = async (bringBack) => {
         }
         playNotificationSound();
       }
-      
     }
     const savedtimestampAfter = await getTimestampGroupAnnouncement();
     chrome.runtime.sendMessage({
@@ -797,8 +817,8 @@ const checkThreads = async (bringBack) => {
 };
 const checkNewMessages = async () => {
   try {
-    let mutedGroups = await getUserSettings({key: 'mutedGroups'}) || []
+    let mutedGroups = (await getUserSettings({ key: "mutedGroups" })) || [];
-    if(!isArray(mutedGroups)) mutedGroups = []
+    if (!isArray(mutedGroups)) mutedGroups = [];
     let myName = "";
     const userData = await getUserInfo();
     if (userData?.name) {
@@ -857,9 +877,14 @@ const checkNewMessages = async () => {
         }
       })
     );
-    let isDisableNotifications = await getUserSettings({key: 'disable-push-notifications'}) || false
+    let isDisableNotifications =
+      (await getUserSettings({ key: "disable-push-notifications" })) || false;
 
-    if (newAnnouncements.length > 0 && !mutedGroups.includes(newAnnouncements[0]?.groupId) && !isDisableNotifications) {
+    if (
+      newAnnouncements.length > 0 &&
+      !mutedGroups.includes(newAnnouncements[0]?.groupId) &&
+      !isDisableNotifications
+    ) {
       const notificationId =
         "chat_notification_" +
         Date.now() +
@@ -1387,7 +1412,7 @@ export async function decryptWallet({ password, wallet, walletVersion }) {
 
       rvnAddress: wallet2._addresses[0].rvnWallet.address,
       rvnPublicKey: wallet2._addresses[0].rvnWallet.derivedMasterPublicKey,
-      rvnPrivateKey: wallet2._addresses[0].rvnWallet.derivedMasterPrivateKey
+      rvnPrivateKey: wallet2._addresses[0].rvnWallet.derivedMasterPrivateKey,
     };
     const dataString = JSON.stringify(toSave);
     await new Promise((resolve, reject) => {
@@ -1420,7 +1445,12 @@ export async function decryptWallet({ password, wallet, walletVersion }) {
   }
 }
 
-export async function signChatFunc(chatBytesArray, chatNonce, customApi, keyPair) {
+export async function signChatFunc(
+  chatBytesArray,
+  chatNonce,
+  customApi,
+  keyPair
+) {
   let response;
   try {
     const signedChatBytes = signChat(chatBytesArray, chatNonce, keyPair);
@@ -1603,7 +1633,6 @@ async function sendChatGroup({
   chatReference,
   messageText,
 }) {
-  
   let _reference = new Uint8Array(64);
   self.crypto.getRandomValues(_reference);
 
@@ -1630,10 +1659,10 @@ async function sendChatGroup({
     proofOfWorkNonce: 0,
     isEncrypted: 0, // Set default to not encrypted for groups
     isText: 1,
-  }
+  };
 
-  if(chatReference){
+  if (chatReference) {
-    txBody['chatReference'] = chatReference
+    txBody["chatReference"] = chatReference;
   }
 
   const tx = await createTransaction(181, keyPair, txBody);
@@ -1662,7 +1691,7 @@ async function sendChatDirect({
   chatReference,
   messageText,
   publicKeyOfRecipient,
-  otherData
+  otherData,
 }) {
   let recipientPublicKey;
   let recipientAddress = address;
@@ -1698,7 +1727,7 @@ async function sendChatDirect({
   const finalJson = {
     message: messageText,
     version: 2,
-    ...(otherData || {})
+    ...(otherData || {}),
   };
   const messageStringified = JSON.stringify(finalJson);
 
@@ -1712,9 +1741,9 @@ async function sendChatDirect({
     proofOfWorkNonce: 0,
     isEncrypted: 1,
     isText: 1,
-  }
+  };
-  if(chatReference){
+  if (chatReference) {
-    txBody['chatReference'] = chatReference
+    txBody["chatReference"] = chatReference;
   }
   const tx = await createTransaction(18, keyPair, txBody);
 
@@ -1810,7 +1839,7 @@ async function decryptDirectFunc({ messages, involvingAddress }) {
 
 async function createBuyOrderTx({ crosschainAtInfo, useLocal }) {
   try {
-    if(useLocal){
+    if (useLocal) {
       const wallet = await getSaveWallet();
 
       const address = wallet.address0;
@@ -1818,47 +1847,53 @@ async function createBuyOrderTx({ crosschainAtInfo, useLocal }) {
       const resKeyPair = await getKeyPair();
       const parsedData = JSON.parse(resKeyPair);
       const message = {
-        addresses: crosschainAtInfo.map((order)=> order.qortalAtAddress),
+        addresses: crosschainAtInfo.map((order) => order.qortalAtAddress),
         foreignKey: parsedData.ltcPrivateKey,
         receivingAddress: address,
       };
-      let responseVar 
+      let responseVar;
-      const txn = new TradeBotRespondMultipleRequest().createTransaction(message)
+      const txn = new TradeBotRespondMultipleRequest().createTransaction(
+        message
+      );
       const apiKey = await getApiKeyFromStorage();
-      const responseFetch = await fetch(`${apiKey?.url}/crosschain/tradebot/respondmultiple?apiKey=${apiKey?.apikey}`, {
+      const responseFetch = await fetch(
+        `${apiKey?.url}/crosschain/tradebot/respondmultiple?apiKey=${apiKey?.apikey}`,
+        {
           method: "POST",
           headers: {
             "Content-Type": "application/json",
           },
           body: JSON.stringify(txn),
-  });
+        }
+      );
 
       const res = await responseFetch.json();
 
-      if(res === false){
+      if (res === false) {
-        responseVar = { response: "Unable to execute buy order", success: false };
+        responseVar = {
+          response: "Unable to execute buy order",
+          success: false,
+        };
       } else {
         responseVar = { response: res, success: true };
       }
-      const { response, success } = responseVar
+      const { response, success } = responseVar;
       let responseMessage;
       if (success) {
         responseMessage = {
           callResponse: response,
           extra: {
-                  message: 'Transaction processed successfully!',
+            message: "Transaction processed successfully!",
-                  atAddresses: crosschainAtInfo.map((order)=> order.qortalAtAddress),
+            atAddresses: crosschainAtInfo.map((order) => order.qortalAtAddress),
-                  
+          },
-              }
         };
       } else {
         responseMessage = {
-              callResponse: 'ERROR',
+          callResponse: "ERROR",
           extra: {
             message: response,
-                  atAddresses: crosschainAtInfo.map((order)=> order.qortalAtAddress),
+            atAddresses: crosschainAtInfo.map((order) => order.qortalAtAddress),
-               
+          },
-              }
         };
       }
 
@@ -1873,7 +1908,7 @@ async function createBuyOrderTx({ crosschainAtInfo, useLocal }) {
         });
       }, 5000);
 
-      return
+      return;
     }
     const wallet = await getSaveWallet();
     const address = wallet.address0;
@@ -1881,7 +1916,7 @@ async function createBuyOrderTx({ crosschainAtInfo, useLocal }) {
     const resKeyPair = await getKeyPair();
     const parsedData = JSON.parse(resKeyPair);
     const message = {
-      addresses: crosschainAtInfo.map((order)=> order.qortalAtAddress),
+      addresses: crosschainAtInfo.map((order) => order.qortalAtAddress),
       foreignKey: parsedData.ltcPrivateKey,
       receivingAddress: address,
     };
@@ -1899,7 +1934,7 @@ async function createBuyOrderTx({ crosschainAtInfo, useLocal }) {
       });
       if (res?.encryptedMessageToBase58) {
         return {
-          atAddresses: crosschainAtInfo.map((order)=> order.qortalAtAddress),
+          atAddresses: crosschainAtInfo.map((order) => order.qortalAtAddress),
           encryptedMessageToBase58: res?.encryptedMessageToBase58,
           node: buyTradeNodeBaseUrl,
           qortAddress: address,
@@ -1910,7 +1945,7 @@ async function createBuyOrderTx({ crosschainAtInfo, useLocal }) {
         };
       }
       return {
-        atAddresses: crosschainAtInfo.map((order)=> order.qortalAtAddress),
+        atAddresses: crosschainAtInfo.map((order) => order.qortalAtAddress),
         chatSignature: res?.signature,
         node: buyTradeNodeBaseUrl,
         qortAddress: address,
@@ -1980,7 +2015,7 @@ export const getFee = async (txType) => {
   };
 };
 
-async function leaveGroup({ groupId }) {
+export async function leaveGroup({ groupId }) {
   const wallet = await getSaveWallet();
   const address = wallet.address0;
   const lastReference = await getLastRef();
@@ -2038,7 +2073,7 @@ export async function joinGroup({ groupId }) {
   return res;
 }
 
-async function cancelInvitationToGroup({ groupId, qortalAddress }) {
+export async function cancelInvitationToGroup({ groupId, qortalAddress }) {
   const lastReference = await getLastRef();
   const resKeyPair = await getKeyPair();
   const parsedData = JSON.parse(resKeyPair);
@@ -2233,7 +2268,7 @@ async function kickFromGroup({ groupId, qortalAddress, rBanReason = "" }) {
   return res;
 }
 
-async function createGroup({
+export async function createGroup({
   groupName,
   groupDescription,
   groupType,
@@ -2304,7 +2339,10 @@ export async function inviteToGroup({ groupId, qortalAddress, inviteTime }) {
   return res;
 }
 
-export async function sendCoin({ password, amount, receiver }, skipConfirmPassword) {
+export async function sendCoin(
+  { password, amount, receiver },
+  skipConfirmPassword
+) {
   try {
     const confirmReceiver = await getNameOrAddress(receiver);
     if (confirmReceiver.error)
@@ -2576,13 +2614,12 @@ async function setChatHeads(data) {
   });
 }
 
-async function checkLocalFunc(){
+async function checkLocalFunc() {
-  const apiKey = await getApiKeyFromStorage()
+  const apiKey = await getApiKeyFromStorage();
-  return !!apiKey
+  return !!apiKey;
-
 }
 
-async function getTempPublish() {
+export async function getTempPublish() {
   const wallet = await getSaveWallet();
   const address = wallet.address0;
   const key = `tempPublish-${address}`;
@@ -2827,7 +2864,6 @@ async function getChatHeadsDirect() {
 }
 // TODO: listener
 
-
 function setupMessageListener() {
   window.addEventListener("message", async (event) => {
     const request = event.data;
@@ -2835,7 +2871,6 @@ function setupMessageListener() {
     // Check if the message is intended for this listener
     if (request?.type !== "backgroundMessage") return; // Only process messages of type 'backgroundMessage'
 
-
     console.log("REQUEST MESSAGE", request);
 
     switch (request.action) {
@@ -2852,32 +2887,44 @@ function setupMessageListener() {
         break;
 
       case "validApi":
-        validApiCase(request, event)
+        validApiCase(request, event);
         break;
 
       case "name":
-        nameCase(request, event)
+        nameCase(request, event);
         break;
       case "userInfo":
-        userInfoCase(request, event)
+        userInfoCase(request, event);
         break;
       case "decryptWallet":
-        decryptWalletCase(request, event)
+        decryptWalletCase(request, event);
         break;
       case "balance":
-        balanceCase(request, event)
+        balanceCase(request, event);
         break;
       case "ltcBalance":
-        ltcBalanceCase(request, event)
+        ltcBalanceCase(request, event);
         break;
       case "sendCoin":
-        sendCoinCase(request, event)
+        sendCoinCase(request, event);
         break;
       case "inviteToGroup":
-        inviteToGroupCase(request, event)
+        inviteToGroupCase(request, event);
         break;
       case "saveTempPublish":
-                saveTempPublishCase(request, event)
+        saveTempPublishCase(request, event);
+        break;
+      case "getTempPublish":
+        getTempPublishCase(request, event);
+        break;
+        case "createGroup":
+          createGroupCase(request, event);
+          break;
+          case "cancelInvitationToGroup":
+            cancelInvitationToGroupCase(request, event);
+            break;
+            case "leaveGroup":
+              leaveGroupCase(request, event);
             break;
       default:
         console.error("Unknown action:", request.action);
@@ -2885,8 +2932,7 @@ function setupMessageListener() {
   });
 }
 
-setupMessageListener()
+setupMessageListener();
-
 
 // Function to save window position and size
 const saveWindowBounds = (windowId) => {
@@ -3208,8 +3254,6 @@ chrome.runtime?.onInstalled.addListener((details) => {
     console.log("Chrome updated");
     // Optional: Handle Chrome-specific updates if necessary
   }
-
-
 });
 
 // Check if the alarm already exists before creating it

src/components/Chat/GroupAnnouncements.tsx

@@ -68,19 +68,18 @@ export const saveTempPublish = async ({ data, key }: any) => {
 
 export const getTempPublish = async () => {
   return new Promise((res, rej) => {
-    chrome?.runtime?.sendMessage(
+    window.sendMessage("getTempPublish", {})
-      {
+  .then((response) => {
-        action: "getTempPublish",
-        payload: {},
-      },
-      (response) => {
     if (!response?.error) {
       res(response);
       return;
     }
     rej(response.error);
-      }
+  })
-    );
+  .catch((error) => {
+    rej(error.message || "An error occurred");
+  });
+
   });
 };
 

src/components/Group/AddGroup.tsx

@@ -103,40 +103,40 @@ export const AddGroup = ({ address, open, setOpen }) => {
       })
 
      await new Promise((res, rej) => {
-        chrome?.runtime?.sendMessage(
+      window.sendMessage("createGroup", {
-          {
-            action: "createGroup",
-            payload: {
         groupName: name,
         groupDescription: description,
         groupType: +groupType,
         groupApprovalThreshold: +approvalThreshold,
         minBlock: +minBlock,
         maxBlock: +maxBlock,
-            },
+      })
-          },
+        .then((response) => {
-          (response) => {
-    
           if (!response?.error) {
             setInfoSnack({
               type: "success",
               message: "Successfully created group. It may take a couple of minutes for the changes to propagate",
             });
             setOpenSnack(true);
-              setTxList((prev)=> [{
+            setTxList((prev) => [
+              {
                 ...response,
                 type: 'created-group',
                 label: `Created group ${name}: awaiting confirmation`,
-                labelDone: `Created group ${name}: success !`,
+                labelDone: `Created group ${name}: success!`,
-                done: false
+                done: false,
-              }, ...prev])
+              },
+              ...prev,
+            ]);
             res(response);
-              return
+            return;
           }
-            rej({message: response.error});
+          rej({ message: response.error });
+        })
+        .catch((error) => {
+          rej({ message: error.message || "An error occurred" });
+        });
       
-          }
-        );
       });
     } catch (error) {
       setInfoSnack({

src/components/Group/ListOfInvites.tsx

@@ -75,11 +75,11 @@ export const ListOfInvites = ({ groupId, setInfoSnack, setOpenSnack, show }) =>
       })
       setIsLoadingCancelInvite(true)
       await new Promise((res, rej)=> {
-          chrome?.runtime?.sendMessage({ action: "cancelInvitationToGroup", payload: {
+        window.sendMessage("cancelInvitationToGroup", {
           groupId,
           qortalAddress: address,
-        }}, (response) => {
+        })
-      
+          .then((response) => {
             if (!response?.error) {
               setInfoSnack({
                 type: "success",
@@ -87,17 +87,26 @@ export const ListOfInvites = ({ groupId, setInfoSnack, setOpenSnack, show }) =>
               });
               setOpenSnack(true);
               handlePopoverClose();
-              setIsLoadingCancelInvite(true)
+              setIsLoadingCancelInvite(true);
-              res(response)
+              res(response);
-              return
+              return;
             }
             setInfoSnack({
               type: "error",
               message: response?.error,
             });
             setOpenSnack(true);
-            rej(response.error)
+            rej(response.error);
+          })
+          .catch((error) => {
+            setInfoSnack({
+              type: "error",
+              message: error.message || "An error occurred",
             });
+            setOpenSnack(true);
+            rej(error);
+          });
+        
         })  
     } catch (error) {
       

src/components/Group/ManageMembers.tsx

@@ -77,36 +77,36 @@ export const ManageMembers = ({
       })
 
       await new Promise((res, rej) => {
-        chrome?.runtime?.sendMessage(
+        window.sendMessage("leaveGroup", {
-          {
-            action: "leaveGroup",
-            payload: {
           groupId: selectedGroup?.groupId,
-            },
+        })
-          },
+          .then((response) => {
-          (response) => {
-          
             if (!response?.error) {
-              setTxList((prev)=> [{
+              setTxList((prev) => [
+                {
                   ...response,
                   type: 'leave-group',
                   label: `Left Group ${selectedGroup?.groupName}: awaiting confirmation`,
-                labelDone: `Left Group ${selectedGroup?.groupName}: success !`,
+                  labelDone: `Left Group ${selectedGroup?.groupName}: success!`,
                   done: false,
                   groupId: selectedGroup?.groupId,
-            
+                },
-              }, ...prev])
+                ...prev,
+              ]);
               res(response);
               setInfoSnack({
                 type: "success",
                 message: "Successfully requested to leave group. It may take a couple of minutes for the changes to propagate",
               });
               setOpenSnack(true);
-              return
+              return;
             }
             rej(response.error);
-          }
+          })
-        );
+          .catch((error) => {
+            rej(error.message || "An error occurred");
+          });
+        
       });
     } catch (error) {} finally {
       setIsLoadingLeave(false)