Organize code

src/MessageQueueContext.tsx

@@ -1,12 +1,17 @@
-import React, { createContext, useContext, useState, useCallback, useRef } from 'react';
-import ShortUniqueId from "short-unique-id";
+import {
+  createContext,
+  useContext,
+  useState,
+  useCallback,
+  useRef,
+} from 'react';
+import ShortUniqueId from 'short-unique-id';
 
 const MessageQueueContext = createContext(null);
+const uid = new ShortUniqueId({ length: 8 });
 
 export const useMessageQueue = () => useContext(MessageQueueContext);
 
-const uid = new ShortUniqueId({ length: 8 });
-
 export const MessageQueueProvider = ({ children }) => {
   const messageQueueRef = useRef([]);
   const [queueChats, setQueueChats] = useState({}); // Stores chats and status for display
@@ -21,7 +26,8 @@ export const MessageQueueProvider = ({ children }) => {
   const processingPromiseRef = useRef(Promise.resolve());
 
   // Function to add a message to the queue
-  const addToQueue = useCallback((sendMessageFunc, messageObj, type, groupDirectId) => {
+  const addToQueue = useCallback(
+    (sendMessageFunc, messageObj, type, groupDirectId) => {
       const tempId = uid.rnd();
       const chatData = {
         ...messageObj,
@@ -30,13 +36,13 @@ export const MessageQueueProvider = ({ children }) => {
         signature: uid.rnd(),
         identifier: tempId,
         retries: 0, // Retry count for display purposes
-      status: 'pending' // Initial status is 'pending'
+        status: 'pending', // Initial status is 'pending'
       };
 
       // Add chat data to queueChats for status tracking
       setQueueChats((prev) => ({
         ...prev,
-      [groupDirectId]: [...(prev[groupDirectId] || []), chatData]
+        [groupDirectId]: [...(prev[groupDirectId] || []), chatData],
       }));
 
       // Add the message to the global messageQueueRef
@@ -44,16 +50,17 @@ export const MessageQueueProvider = ({ children }) => {
         func: sendMessageFunc,
         identifier: tempId,
         groupDirectId,
-      specialId: messageObj?.message?.specialId
+        specialId: messageObj?.message?.specialId,
       });
 
       // Start processing the queue
       processQueue([], groupDirectId);
-  }, []);
+    },
+    []
+  );
 
   // Function to process the message queue
   const processQueue = useCallback((newMessages = [], groupDirectId) => {
-
     processingPromiseRef.current = processingPromiseRef.current
       .then(() => processQueueInternal(newMessages, groupDirectId))
       .catch((err) => console.error('Error in processQueue:', err));
@@ -92,7 +99,6 @@ export const MessageQueueProvider = ({ children }) => {
 
         // Remove the message from the queue after successful sending
         messageQueueRef.current.shift();
-
       } catch (error) {
         console.error('Message sending failed', error);
 
@@ -110,7 +116,8 @@ export const MessageQueueProvider = ({ children }) => {
               updatedChats[groupDirectId][chatIndex].status = 'failed';
             } else {
               // Max retries reached, set status to 'failed-permanent'
-              updatedChats[groupDirectId][chatIndex].status = 'failed-permanent';
+              updatedChats[groupDirectId][chatIndex].status =
+                'failed-permanent';
 
               // Remove the message from the queue after max retries
               messageQueueRef.current.shift();
@@ -127,33 +134,39 @@ export const MessageQueueProvider = ({ children }) => {
 
   // Method to process with new messages and groupDirectId
   const processWithNewMessages = (newMessages, groupDirectId) => {
-    let updatedNewMessages = newMessages
+    let updatedNewMessages = newMessages;
     if (newMessages.length > 0) {
       // Remove corresponding entries in queueChats for the provided groupDirectId
       setQueueChats((prev) => {
         const updatedChats = { ...prev };
         if (updatedChats[groupDirectId]) {
-  
           updatedNewMessages = newMessages?.map((msg) => {
-            const findTempMsg = updatedChats[groupDirectId]?.find((msg2)=> msg2?.message?.specialId === msg?.specialId)
+            const findTempMsg = updatedChats[groupDirectId]?.find(
+              (msg2) => msg2?.message?.specialId === msg?.specialId
+            );
             if (findTempMsg) {
               return {
                 ...msg,
-                tempSignature: findTempMsg?.signature
+                tempSignature: findTempMsg?.signature,
+              };
             }
-            }
-            return msg
-          })
-        
-
-          updatedChats[groupDirectId] = updatedChats[groupDirectId].filter((chat) => {
-            return !newMessages.some(newMsg => newMsg?.specialId === chat?.message?.specialId);
+            return msg;
           });
 
+          updatedChats[groupDirectId] = updatedChats[groupDirectId].filter(
+            (chat) => {
+              return !newMessages.some(
+                (newMsg) => newMsg?.specialId === chat?.message?.specialId
+              );
+            }
+          );
+
           // Remove messages with status 'failed-permanent'
-          updatedChats[groupDirectId] = updatedChats[groupDirectId].filter((chat) => {
+          updatedChats[groupDirectId] = updatedChats[groupDirectId].filter(
+            (chat) => {
               return chat?.status !== 'failed-permanent';
-          });
+            }
+          );
 
           // If no more chats for this group, delete the groupDirectId entry
           if (updatedChats[groupDirectId].length === 0) {
@@ -162,27 +175,36 @@ export const MessageQueueProvider = ({ children }) => {
         }
         return updatedChats;
       });
-      
     }
     setTimeout(() => {
-      if(!messageQueueRef.current.find((msg) => msg?.groupDirectId === groupDirectId)){
+      if (
+        !messageQueueRef.current.find(
+          (msg) => msg?.groupDirectId === groupDirectId
+        )
+      ) {
         setQueueChats((prev) => {
           const updatedChats = { ...prev };
           if (updatedChats[groupDirectId]) {
-            delete  updatedChats[groupDirectId]
+            delete updatedChats[groupDirectId];
           }
 
-          return updatedChats
-        }
-          )
+          return updatedChats;
+        });
       }
     }, 300);
 
-    return updatedNewMessages
+    return updatedNewMessages;
   };
 
   return (
-    <MessageQueueContext.Provider value={{ addToQueue, queueChats, clearStatesMessageQueueProvider, processWithNewMessages }}>
+    <MessageQueueContext.Provider
+      value={{
+        addToQueue,
+        queueChats,
+        clearStatesMessageQueueProvider,
+        processWithNewMessages,
+      }}
+    >
       {children}
     </MessageQueueContext.Provider>
   );

src/hooks/useHandlePaymentNotification.tsx

@@ -7,11 +7,9 @@ import { subscribeToEvent, unsubscribeFromEvent } from '../utils/events';
 import { useAtom } from 'jotai';
 
 export const useHandlePaymentNotification = (address) => {
-  const [latestTx, setLatestTx] = useState(null);
-
   const nameAddressOfSender = useRef({});
   const isFetchingName = useRef({});
-
+  const [latestTx, setLatestTx] = useState(null);
   const [lastEnteredTimestampPayment, setLastEnteredTimestampPayment] = useAtom(
     lastPaymentSeenTimestampAtom
   );
@@ -63,6 +61,7 @@ export const useHandlePaymentNotification = (address) => {
       const key = `last-seen-payment-${address}`;
 
       const res = await getData<any>(key).catch(() => null);
+
       if (res) {
         setLastEnteredTimestampPayment(res);
       }
@@ -76,6 +75,7 @@ export const useHandlePaymentNotification = (address) => {
       const latestTx = responseData.filter(
         (tx) => tx?.creatorAddress !== address && tx?.recipient === address
       )[0];
+
       if (!latestTx) {
         return; // continue to the next group
       }
@@ -128,6 +128,7 @@ export const useHandlePaymentNotification = (address) => {
       );
     };
   }, [setLastEnteredTimestampPaymentEventFunc]);
+
   return {
     latestTx,
     getNameOrAddressOfSenderMiddle,

src/hooks/useNameSearch.tsx

@@ -5,6 +5,7 @@ interface NameListItem {
   name: string;
   address: string;
 }
+
 export const useNameSearch = (value: string, limit = 20) => {
   const [nameList, setNameList] = useState<NameListItem[]>([]);
   const [isLoading, setIsLoading] = useState(false);
@@ -48,6 +49,7 @@ export const useNameSearch = (value: string, limit = 20) => {
       clearTimeout(handler);
     };
   }, [value, limit, checkIfNameExisits]);
+
   return {
     isLoading,
     results: nameList,