diff --git a/db/index.js b/db/index.js
index c94bc2d..c613666 100644
--- a/db/index.js
+++ b/db/index.js
@@ -1,11 +1,15 @@
 import {
   addDoc,
+  and,
   collection,
+  deleteDoc,
   doc,
   getDoc,
   getDocs,
   getFirestore,
   limit,
+  or,
+  orderBy,
   query,
   setDoc,
   where,
@@ -16,6 +20,7 @@ import {
   getCachedMessages,
   queueSetCashedMessages,
 } from "../src/functions/messaging/cachedMessages";
+import { encryptMessage } from "../src/functions/encodingAndDecoding";
 
 export async function addDataToCollection(dataObject, collectionName, uuid) {
   try {
@@ -291,16 +296,22 @@ export async function updateMessage({
   fromPubKey,
   toPubKey,
   onlySaveToLocal,
+  retrivedContact,
+  privateKey,
+  currentTime,
 }) {
   try {
     const messagesRef = collection(db, "contactMessages");
     const timestamp = new Date().getTime();
+    const useEncription = retrivedContact.isUsingEncriptedMessaging;
 
-    const message = {
+    let message = {
       fromPubKey,
       toPubKey,
       message: newMessage,
       timestamp,
+      serverTimestamp: currentTime,
+      isGiftCard: !!newMessage?.giftCardInfo,
     };
 
     if (onlySaveToLocal) {
@@ -310,6 +321,14 @@ export async function updateMessage({
       });
       return true;
     }
+    if (useEncription) {
+      let messgae =
+        typeof message.message === "string"
+          ? message.message
+          : JSON.stringify(message.message);
+      const encripted = await encryptMessage(privateKey, toPubKey, messgae);
+      message.message = encripted;
+    }
 
     await addDoc(messagesRef, message);
     console.log("New message was published:", message);
@@ -320,51 +339,224 @@ export async function updateMessage({
   }
 }
 
-export async function syncDatabasePayment(
-  myPubKey,
-  updatedCachedMessagesStateFunction
-) {
+export async function syncDatabasePayment(myPubKey, privateKey) {
   try {
     const cachedConversations = await getCachedMessages();
     const savedMillis = cachedConversations.lastMessageTimestamp;
     console.log("Retrieving docs from timestamp:", savedMillis);
     const messagesRef = collection(db, "contactMessages");
 
-    const receivedMessagesQuery = query(
-      messagesRef,
-      where("toPubKey", "==", myPubKey),
-      where("timestamp", ">", savedMillis)
-    );
-
-    const sentMessagesQuery = query(
+    const combinedQuery = query(
       messagesRef,
-      where("fromPubKey", "==", myPubKey),
-      where("timestamp", ">", savedMillis)
+      and(
+        where("timestamp", ">", savedMillis),
+        or(
+          where("toPubKey", "==", myPubKey),
+          where("fromPubKey", "==", myPubKey)
+        )
+      ),
+      orderBy("timestamp")
     );
 
-    const [receivedSnapshot, sentSnapshot] = await Promise.all([
-      getDocs(receivedMessagesQuery),
-      getDocs(sentMessagesQuery),
-    ]);
-
-    const receivedMessages = receivedSnapshot.docs.map((doc) => doc.data());
-    const sentMessages = sentSnapshot.docs.map((doc) => doc.data());
-    const allMessages = [...receivedMessages, ...sentMessages];
-
-    if (allMessages.length === 0) {
-      updatedCachedMessagesStateFunction();
-      return;
-    }
+    const snapshot = await getDocs(combinedQuery);
+    const allMessages = snapshot.docs.map((doc) => doc.data());
 
+    if (allMessages.length === 0) return [];
+    console.log(allMessages);
     console.log(`${allMessages.length} messages received from history`);
 
-    queueSetCashedMessages({
-      newMessagesList: allMessages,
+    const processedMessages = await processWithRAF(
+      allMessages,
       myPubKey,
-    });
+      privateKey
+    );
+
+    return processedMessages;
   } catch (err) {
     console.error("Error syncing database payments:", err);
     // Consider adding error handling callback if needed
-    updatedCachedMessagesStateFunction();
+    return [];
+  }
+}
+
+function processWithRAF(allMessages, myPubKey, privateKey, onProgress) {
+  return new Promise((resolve, reject) => {
+    // Create worker
+    const worker = new Worker(
+      new URL("../src/workers/messageWorker.js", import.meta.url),
+      { type: "module" }
+    );
+
+    worker.onmessage = function (e) {
+      const { type, data, current, total } = e.data;
+
+      if (type === "PROGRESS") {
+        console.log(`Processing: ${current}/${total}`);
+        if (onProgress) {
+          onProgress(current, total);
+        }
+      } else if (type === "COMPLETE") {
+        worker.terminate();
+        resolve(data);
+      }
+    };
+
+    worker.onerror = function (error) {
+      console.error("Worker error:", error);
+      worker.terminate();
+      reject(error);
+    };
+
+    // Send data to worker
+    worker.postMessage({
+      type: "PROCESS_MESSAGES",
+      data: { allMessages, myPubKey, privateKey },
+    });
+  });
+}
+
+export async function isValidNip5Name(wantedName) {
+  try {
+    const usersRef = collection(db, "nip5Verification");
+    const q = query(
+      usersRef,
+      where("nameLower", "==", wantedName.toLowerCase())
+    );
+    const querySnapshot = await getDocs(q);
+    return querySnapshot.empty;
+  } catch (error) {
+    console.error("Error checking unique name:", error);
+    return false;
+  }
+}
+export async function addNip5toCollection(dataObject, uuid) {
+  try {
+    if (!uuid) throw Error("Not authenticated");
+
+    const db = getFirestore();
+    const docRef = doc(db, "nip5Verification", uuid);
+
+    await setDoc(docRef, dataObject, { merge: true });
+
+    return true;
+  } catch (e) {
+    console.error("Error adding document: ", e);
+    return false;
+  }
+}
+export async function deleteNip5FromCollection(uuid) {
+  try {
+    if (!uuid) throw Error("Not authenticated");
+
+    const db = getFirestore();
+    const docRef = doc(db, "nip5Verification", uuid);
+
+    await deleteDoc(docRef);
+
+    console.log("Document deleted");
+    return true;
+  } catch (e) {
+    console.error("Error deleting document", e);
+    return false;
+  }
+}
+
+export async function addGiftToDatabase(dataObject) {
+  try {
+    const db = getFirestore();
+    const docRef = doc(db, "blitzGifts", dataObject.uuid);
+
+    await setDoc(docRef, dataObject, { merge: false });
+
+    console.log("Gift added to database with ID: ", dataObject.uuid);
+    return true;
+  } catch (e) {
+    console.error("Error adding gift to database: ", e);
+    return false;
+  }
+}
+
+export async function updateGiftInDatabase(dataObject) {
+  try {
+    const db = getFirestore();
+    const docRef = doc(db, "blitzGifts", dataObject.uuid);
+
+    await setDoc(docRef, dataObject, { merge: true });
+
+    console.log("Gift updated with ID: ", dataObject.uuid);
+    return true;
+  } catch (e) {
+    console.error("Error adding gift to database: ", e);
+    return false;
+  }
+}
+
+export async function getGiftCard(cardUUID) {
+  try {
+    const db = getFirestore();
+    const docRef = doc(db, "blitzGifts", cardUUID);
+
+    const docSnap = await getDoc(docRef);
+
+    if (docSnap.exists()) {
+      const userData = docSnap.data();
+      return userData;
+    }
+  } catch (e) {
+    console.error("Error adding gift to database: ", e);
+    return false;
+  }
+}
+
+export async function deleteGift(uuid) {
+  try {
+    const db = getFirestore();
+    const docRef = doc(db, "blitzGifts", uuid);
+
+    await deleteDoc(docRef);
+
+    console.log("Gift deleted:", uuid);
+    return true;
+  } catch (e) {
+    console.error("Error deleting gift:", e);
+    return false;
+  }
+}
+
+export async function handleGiftCheck(cardUUID) {
+  try {
+    const db = getFirestore();
+    const docRef = doc(db, "blitzGifts", cardUUID);
+
+    const docSnap = await getDoc(docRef);
+
+    if (docSnap.exists()) return { didWork: true, wasClaimed: false };
+    else return { didWork: true, wasClaimed: true };
+  } catch (e) {
+    console.error("Error adding gift to database: ", e);
+    return { didWork: false };
+  }
+}
+
+export async function reloadGiftsOnDomesday(uuid) {
+  try {
+    const db = getFirestore();
+
+    const q = query(
+      collection(db, "blitzGifts"),
+      where("createdBy", "==", uuid)
+    );
+
+    const snapshot = await getDocs(q);
+
+    const results = snapshot.docs.map((doc) => ({
+      id: doc.id,
+      ...doc.data(),
+    }));
+
+    return results;
+  } catch (e) {
+    console.error("Error fetching gifts by creator:", e);
+    return [];
   }
 }
diff --git a/db/initializeFirebase.js b/db/initializeFirebase.js
index 352867d..6de0c4a 100644
--- a/db/initializeFirebase.js
+++ b/db/initializeFirebase.js
@@ -24,40 +24,67 @@ export const db = getFirestore(app);
 export const storage = getStorage(app);
 export const functions = getFunctions(app);
 
+let initializationPromise = null;
+let lastInitializedKey = null;
+
 export async function initializeFirebase(publicKey, privateKey) {
+  const cacheKey = publicKey;
   try {
-    // Initialize App Check first
-    // Sign in anonymously;
-    if (import.meta.env.MODE === "development") {
-      connectFunctionsEmulator(functions, "localhost", 5001);
+    if (initializationPromise && lastInitializedKey === cacheKey) {
+      console.log("Reusing existing initialization promise");
+      return initializationPromise;
     }
 
-    const currentUser = auth.currentUser;
-    console.log("current auth", {
-      currentUser,
-      publicKey,
-    });
-
-    if (currentUser && currentUser?.uid === publicKey) {
-      return currentUser;
+    if (lastInitializedKey !== cacheKey) {
+      initializationPromise = null;
     }
 
-    await signInAnonymously(auth);
-    const isSignedIn = auth.currentUser;
-    console.log(isSignedIn.uid, "signed in");
-    const token = await fetchBackend(
-      "customToken",
-      { userAuth: isSignedIn?.uid },
-      privateKey,
-      publicKey
-    );
-    if (!token) throw new Error("Not able to get custom token from backend");
-    console.log("custom sign in token from backend", token);
-    await auth.signOut();
+    lastInitializedKey = cacheKey;
+
+    initializationPromise = (async () => {
+      try {
+        // Initialize App Check first
+        // Sign in anonymously;
+        if (import.meta.env.MODE === "development") {
+          connectFunctionsEmulator(functions, "localhost", 5001);
+        }
+
+        const currentUser = auth.currentUser;
+        console.log("current auth", {
+          currentUser,
+          publicKey,
+        });
+
+        if (currentUser && currentUser?.uid === publicKey) {
+          return currentUser;
+        }
+
+        await signInAnonymously(auth);
+        const isSignedIn = auth.currentUser;
+        console.log(isSignedIn.uid, "signed in");
+        const token = await fetchBackend(
+          "customToken",
+          { userAuth: isSignedIn?.uid },
+          privateKey,
+          publicKey
+        );
+        if (!token)
+          throw new Error("Not able to get custom token from backend");
+        console.log("custom sign in token from backend", token);
+        await auth.signOut();
 
-    const customSignIn = await signInWithCustomToken(auth, token);
-    console.log("custom sign in user id", customSignIn.user);
-    return customSignIn;
+        const customSignIn = await signInWithCustomToken(auth, token);
+        console.log("custom sign in user id", customSignIn.user);
+        return customSignIn;
+      } catch (error) {
+        console.error("Error initializing Firebase:", error);
+        // Clear the cache on error so the next call can retry
+        initializationPromise = null;
+        lastInitializedKey = null;
+        throw new Error(String(error.message));
+      }
+    })();
+    return initializationPromise;
   } catch (error) {
     console.error("Error initializing Firebase:", error);
     throw new Error(String(error.message));
diff --git a/db/interactionManager.js b/db/interactionManager.js
index 74bc727..5b74a1c 100644
--- a/db/interactionManager.js
+++ b/db/interactionManager.js
@@ -30,11 +30,14 @@ const PRESET_LOCAL_DATA = {
     lastUpdated: new Date().getTime(),
     data: null,
   },
-  enabledDeveloperSupport: {
-    isEnabled: true,
-    baseFee: BLITZ_FEE_SATS,
-    baseFeePercent: BLITZ_FEE_PERCET,
-  },
+  didViewNWCMessage: false,
+  userSelectedLanguage: "en",
+  // [NWC_IDENTITY_PUB_KEY]: "",
+  userBalanceDenomination: "sats",
+  didViewSeedPhrase: false,
+  enabledBTKNTokens: null,
+  defaultSpendToken: "bitcoin",
+  thousandsSeperator: "space",
 };
 
 async function sendDataToDB(newObject, uuid) {
diff --git a/db/photoStorage.js b/db/photoStorage.js
index b0760e3..360df67 100644
--- a/db/photoStorage.js
+++ b/db/photoStorage.js
@@ -1,30 +1,44 @@
-import { getStorage } from "firebase/storage";
+import {
+  deleteObject,
+  getDownloadURL,
+  getStorage,
+  ref,
+  uploadBytes,
+} from "firebase/storage";
 import { BLITZ_PROFILE_IMG_STORAGE_REF } from "../src/constants";
+import { storage } from "./initializeFirebase";
 
-export async function setDatabaseIMG(publicKey, imgURL) {
+export async function setDatabaseIMG(publicKey, imgBlob) {
   try {
-    const reference = getStorage().ref(
+    if (!(imgBlob instanceof Blob)) {
+      throw new Error("Expected a Blob object");
+    }
+
+    const reference = ref(
+      storage,
       `${BLITZ_PROFILE_IMG_STORAGE_REF}/${publicKey}.jpg`
     );
 
-    await reference.putFile(imgURL.uri);
+    await uploadBytes(reference, imgBlob);
 
-    const downloadURL = await reference.getDownloadURL();
+    const downloadURL = await getDownloadURL(reference);
     return downloadURL;
   } catch (err) {
     console.log("set database image error", err);
     return false;
   }
 }
+
 export async function deleteDatabaseImage(publicKey) {
   try {
-    const reference = getStorage().ref(
+    const reference = ref(
+      storage,
       `${BLITZ_PROFILE_IMG_STORAGE_REF}/${publicKey}.jpg`
     );
-    await reference.delete();
+    await deleteObject(reference);
     return true;
   } catch (err) {
-    console.log("delete profime imgage error", err);
+    console.log("delete profile image error", err);
     if (err.message.includes("No object exists at the desired reference")) {
       return true;
     }
diff --git a/locales/en/translation.json b/locales/en/translation.json
index 9bc3c5f..5d40733 100644
--- a/locales/en/translation.json
+++ b/locales/en/translation.json
@@ -71,7 +71,6 @@
     "hide": "Hide",
     "show": "Show",
     "understandText": "I understand",
-    "retyr": "Retry",
     "reportError": "Report Error",
     "address": "Address",
     "string": "String",
@@ -103,17 +102,33 @@
     "selectOption": "Select an option",
     "slideToConfirm": "Slide to confirm",
     "token": "Token",
-    "veriable": "Veriable",
+    "veriable": "Variable",
     "instant": "Instant",
     "andLower": "and",
     "onLower": "on",
-    "offLower": "off"
+    "offLower": "off",
+    "recover": "Recover",
+    "search": "Search",
+    "review": "Review",
+    "loadMore": "Load More",
+    "invoice": "Invoice",
+    "annonName": "Anonymous User",
+    "claim": "Claim",
+    "manage": "Manage",
+    "reclaim": "Expired",
+    "optionalFlag": "(Optional)",
+    "gift": "Gift"
   },
 
   "languages": {
     "english": "English",
     "spanish": "Español",
-    "italian": "Italiano"
+    "italian": "Italiano",
+    "portuguese_br": "Português (Brasil)",
+    "german": "Deutsch",
+    "french": "Française",
+    "swedish": "Svenska",
+    "russian": "русский"
   },
 
   "weekdays": {
@@ -178,7 +193,7 @@
     "date": "Date",
     "time": "Time",
     "memo": "Memo",
-    "roostockSwap": "Rootstock to Spark Swap"
+    "roostockSwap": "Rootstock to Spark Transfer"
   },
 
   "createAccount": {
@@ -194,7 +209,7 @@
     },
     "disclaimerPage": {
       "header": "Self-custodial",
-      "subHeader": "Blitz cannot access your funds or help recover them if lost. By continuing, you agree to Blitz Wallet's terms and conditions.",
+      "subHeader": "Blitz cannot access your funds or help recover them if lost. By continuing, you agree to Blitz Wallet's Terms and Conditions.",
       "imgCaption": "'With great power comes great responsibility' - Uncle Ben",
       "acceptPrefix": "I accept the ",
       "terms&Conditions": "Terms and Conditions",
@@ -202,18 +217,18 @@
       "continueBTN": "Next"
     },
     "verifyKeyPage": {
-      "header": "Let's confirm your backup!"
+      "header": "Let's confirm your seed phrase!"
     },
     "keySetup": {
       "generateKey": {
         "header": "This is your password to your money, if you lose it you lose your money!",
-        "subHeader": "Write it down with pen and paper and keep it safe!",
+        "subHeader": "Write it down with a pen and paper and keep it safe!",
         "disclaimer": "WE CAN NOT HELP YOU IF YOU LOSE IT",
-        "errorText": "Error Fetching recovery phrase",
-        "keyGenError": "Not able to generate valid seed",
+        "errorText": "Error fetching seed phrase",
+        "keyGenError": "Unable to generate a valid seed phrase",
         "seedPrivacyMessage": "Make sure no one is around who can see your screen.",
         "showIt": "Show it",
-        "invalidSeedError": "Not able to generate valid seed"
+        "invalidSeedError": "Unable to generate a valid seed phrase"
       },
       "pin": {
         "savePinError": "Unable to save pin",
@@ -226,16 +241,16 @@
     },
     "restoreWallet": {
       "home": {
-        "header": "Enter your recovery phrase",
+        "header": "Enter your seed phrase",
         "continueBTN": "Restore wallet",
-        "error1": "Please enter all of your keys.",
-        "error2": "This is not a valid mnemonic.",
+        "error1": "Please enter all of your seed phrase words.",
+        "error2": "This is not a valid seed phrase.",
         "error3": "Your words are not the same as the generated words",
-        "noSeedInString": "Unable to find seed in string",
-        "invalidWordLen": "Not every word is of valid length",
-        "cannotFind12Words": "Unable to find 12 words from copied recovery phrase.",
-        "noSeedInNumberArray": "Unable to find seed in number array",
-        "noSeedInQr": "Unable to get seed from QR code",
+        "noSeedInString": "Unable to find a seed phrase in the string",
+        "invalidWordLen": "Not all words are of valid length",
+        "cannotFind12Words": "Unable to find 12 words from copied seed phrase.",
+        "noSeedInNumberArray": "Unable to find a seed phrase in number array",
+        "noSeedInQr": "Unable to get a seed phrase from QR code",
         "scanQr": "Scan QR"
       }
     },
@@ -248,17 +263,18 @@
 
   "adminLogin": {
     "pinPage": {
-      "isBiometricEnabledConfirmAction": "Since biometric setting are enabled you cannot use the default pin login method. Would you like to terminate your account?",
+      "isBiometricEnabledConfirmAction": "We couldn’t verify your biometrics.\n\nDo you want to delete all wallet data? Only continue if your seed phrase is securely backed up.",
       "wrongPinError": "Wrong PIN, try again",
       "enterPinMessage": "Enter PIN",
-      "attemptsText": "{{attempts}} attempts left"
+      "attemptsText": "{{attempts}} attempts left",
+      "biometricsHeader": "Open with Biometrics"
     }
   },
 
   "apps": {
     "appList": {
       "AI": "AI",
-      "AIDescription": "Chat with the latest generative Ai models",
+      "AIDescription": "Chat with the latest generative AI models",
       "SMS": "SMS",
       "SMSDescription": "Send and receive SMS messages worldwide using Bitcoin",
       "VPN": "VPN",
@@ -266,11 +282,11 @@
       "onlineListings": "Shops",
       "onlineListingsDescription": "Directory of online businesses accepting Bitcoin payments",
       "Soon": "Soon",
-      "SoonDescription": "More apps coming soon"
+      "SoonDescription": "More integrations coming soon"
     },
     "VPN": {
       "VPNPlanPage": {
-        "backupLoadingMessage": "Retriving invoice",
+        "backupLoadingMessage": "Retrieving invoice",
         "countrySearchPlaceholder": "Search by country",
         "createVPNBTN": "Buy VPN",
         "noLocationError": "Please select a country for the VPN to be located in.",
@@ -278,8 +294,8 @@
         "backupPaymentError": "Error paying invoice.",
         "createInvoiceError": "Error creating invoice.",
         "payingInvoiveError": "Error paying invoice.",
-        "runningTries": "Running {{runCount}} for {{maxTries}} tries",
-        "configError": "Not able to get VPN config, please reach out to LNVPN.",
+        "runningTries": "Attempt {{runCount}} of {{maxTries}} attempts",
+        "configError": "Unable to get VPN config. Please reach out to LNVPN.",
         "paymentMemo": "Store - VPN"
       },
       "confirmationSlideUp": {
@@ -302,17 +318,17 @@
         "30": "year"
       },
       "historicalPurchasesPage": {
-        "deleteVPNConfirmMessage": "Are you sure you want to remove this VPN.",
+        "deleteVPNConfirmMessage": "Are you sure you want to remove this VPN?",
         "country": "Country:",
         "createdAt": "Created at:",
         "duration": "Duration:",
         "paymentHash": "Payment Hash:",
         "title": "Purchases",
-        "retryClaim": "Trying to create file",
-        "noPurchases": "You have no VPN configuations",
+        "retryClaim": "Attempting to create file",
+        "noPurchases": "You have no VPN configurations",
         "assistanceText": "For assistance, reach out to LNVPN",
         "noValidCountryCodeError": "Not able to get valid country code",
-        "claimConfigError": "Not able to get VPN config, please reach out to LNVPN.",
+        "claimConfigError": "Unable to get VPN config. Please reach out to LNVPN.",
         "contact": "Contact"
       },
       "home": {
@@ -324,8 +340,8 @@
       },
       "generatedFile": {
         "title": "Wiregurard Config File",
-        "iosDownloadInstructions": "When dowloading, click save to files.",
-        "androidDownloadInstructions": "When dowloading, you will need to give permission to a location where we can save the config file to."
+        "iosDownloadInstructions": "When downloading, click save to Files.",
+        "androidDownloadInstructions": "When downloading, you will need to give permission for a location to save the config file to."
       }
     },
     "chatGPT": {
@@ -333,15 +349,16 @@
       "loadingMessage": "Loading previous chats",
       "addCreditsPage": {
         "title": "Add Credits",
-        "description": "In order to use the latest generative AI models, you must buy credits. Choose an option below to begin.",
+        "description": "In order to use the latest generative AI models, you must purchase credits. Choose an option below to begin.",
         "supportedModels": "Supported Models",
-        "feeInfo": "Depending on the length of your question and response, the number of searches you get might be different. Blitz adds a 150 sat fee + 0.5% of purchase price onto all purchases.",
+        "feeInfo": "Depending on the length of your question and response, the number of searches you get might differ. Blitz adds a 150 sat fee + 0.5% of purchase price onto all purchases.",
         "price": "Price: ",
         "estSearches": "Est. searches: {{num}}",
         "casualPlanTitle": "Casual Plan",
         "proPlanTitle": "Pro Plan",
         "powerPlanTitle": "Power Plan",
-        "paymentMemo": "Store - chatGPT"
+        "paymentMemo": "Store - chatGPT",
+        "notAvailableMessage": "Unfortunately, due to Apple’s in-app purchase guidelines, this feature is not currently available on iOS. We’re exploring ways to bring it to iOS in the future."
       },
       "countrySearch": {
         "inputPlaceholder": "Search for a country"
@@ -702,7 +719,7 @@
         "termsAndConditions4": "Privacy policy"
       },
       "expandedGiftCardPage": {
-        "purchasingCardMessage": "Purchasing gift card, do not leave the page.",
+        "purchasingCardMessage": "Purchasing gift card. Do not leave the page.",
         "selectamount": "Select an amount",
         "sendingto": "Sending to: ",
         "minMaxPurchaseAmount": "You can buy a {{min}} amount of {{max}} {{currency}}",
@@ -712,7 +729,7 @@
         "terms": "Terms",
         "cardDescription": "Card Description",
         "cardTerms": "Card terms",
-        "dailyPurchaseAmountError": "You have hit your daily purchase limit",
+        "dailyPurchaseAmountError": "You have reached your daily purchase limit",
         "giftMessage": "Add a note to your gift",
         "giftMessagePlaceholder": "Type your message here",
         "selectForContactBTN": "Select Gift Card",
@@ -735,7 +752,7 @@
 
     "sms4sats": {
       "home": {
-        "pageDescription": "Send and Receive sms messages without giving away your personal phone number.",
+        "pageDescription": "Send and receive SMS messages without giving away your personal phone number.",
         "pricingError": "Unable to get SMS pricing"
       },
       "confirmationSlideUp": {
@@ -755,8 +772,8 @@
         "invalidInputError": "Must have a {{errorTyoe}}",
         "invalidCountryError": "Not a valid country",
         "payingMessage": "Paying...",
-        "runningTries": "Running {{runCount}} for {{maxTries}} tries",
-        "notAbleToSettleInvoice": "Not able to settle invoice.",
+        "runningTries": "Attempt {{runCount}} of {{maxTries}} attempts",
+        "notAbleToSettleInvoice": "Unable to settle invoice.",
         "paymentMemo": "Store - SMS Send"
       },
       "sentPayments": {
@@ -772,14 +789,14 @@
         "fetchOrderError": "Failed to fetch order status",
         "failedUpdate": "Failed to update order status",
         "refundedOrder": "Order has been refunded, funds will automatically return to your wallet after 21 minutes",
-        "reclaimComplete": "Rety complete. If no code is generated, you will be auto-refunded after 21 minutes.",
+        "reclaimComplete": "Retry complete. If no code is generated, you will be auto-refunded after 21 minutes.",
         "noCode": "No code",
         "rateLimitError": "Too many requests. You can only make 5 requests every 30 seconds. Please wait before trying again."
       },
       "receivePage": {
         "paymentMemo": "Store - SMS Receive",
         "selectCountry": "Select Country",
-        "autoSelectInfoMessage": "Choose the country of the phone number you want to use. For the best chance of receiving your code, we recommend keeping it on Auto Select so the system picks the most reliable option.",
+        "autoSelectInfoMessage": "Choose the country of the phone number you want to use. For the best chance of receiving your code, we recommend keeping it on 'Auto Select' so the system picks the most reliable option.",
         "autoSelect": "Auto Select",
         "inputPlaceholder": "Search for a service",
         "loacationLoadingMessage": "Getting location-based services",
@@ -840,7 +857,7 @@
       "settingsText": "Go to settings to let Blitz Wallet access your camera",
       "noCameraDevice": "You do not have a camera device.",
       "noFlash": " Device does not have a torch",
-      "sanningResponse": "Only QRcodes are accepted.",
+      "sanningResponse": "Only QR codes are accepted.",
       "qrDecodeError": "Error decoding QR code"
     },
     "confirmClipboard": {
@@ -851,10 +868,10 @@
     "see_all_txs": "See all transactions",
     "no_transaction_history": "Send or receive a transaction for it to show up here",
     "contactsPage": {
-      "header": "Select recipient",
+      "header": "Select contact",
       "inputTextPlaceholder": "Search username...",
       "subHeader": "All Contacts",
-      "giftsText": "My Gifts"
+      "giftsText": "Gifts from Contacts"
     },
     "cameraPage": {
       "noCameraAccess": "No access to camera",
@@ -866,23 +883,28 @@
     "receivePages": {
       "editPaymentInfo": {
         "receive_amount": "receive amount",
-        "descriptionInputPlaceholder": "Description..."
+        "descriptionInputPlaceholder": "Description...",
+        "editAmount": "Edit amount"
       },
       "buttonContainer": {
-        "format": "Choose Network",
+        "format": "Other receiving methods",
         "infoMessage": "Custom amounts aren’t supported on Spark or Rootstock payments."
       },
 
       "switchReceiveOptionPage": {
-        "title": "Choose Network",
+        "title": "Receiving methods",
         "actionBTN": "Show {{action}}",
         "sparkWarningMessage": "Receiving directly via Spark will expose your balance to the person paying and is not considered private.",
-        "swapWarning": "{{swapType}} payments will be swapped into Spark. Payments below {{amount}} won’t be swapped. Funds will only be swapped after the {{swapType}} payment is confirmed.",
-        "unalignedSeeds": "Warning: You’re not using your main wallet account. All Liquid swaps will be sent to your main wallet.",
-        "rootstockWarningText": "Rootstock payments will be swapped into Spark. Payments below {{amount}} won’t be swapped. Funds will only be swapped after the Rootsock payment is confirmed.",
+        "swapWarning": "{{swapType}} payments will be received into Spark. Payments below {{amount}} won’t be transferred. Funds will only be transferred after the {{swapType}} payment is confirmed.",
         "oneMinute": "~ {{numMins}} minute",
         "tenMinutes": "~ {{numMins}} minutes",
-        "notUsingMainAccountWarning": "Warning: You’re not using your main wallet account. All {{swapType}} swaps will be sent to your main wallet."
+        "notUsingMainAccountWarning": "Warning: You’re not using your main wallet account. All {{swapType}} transfers will be sent to your main wallet.",
+        "sparkDesc": "Instant, Supports Tokens",
+        "sparkTitle": "Spark Address",
+        "bitcoinTitle": "Bitcoin Address",
+        "lightningTitle": "Lightning Invoice",
+        "liquidTitle": "Liquid Address",
+        "rootstockTitle": "Rootstock Address"
       },
       "editLNURLContact": {
         "informationMessage": "Changing your username updates how others find you in Blitz Contacts and your Lightning address (username @blitzwalletapp.com).\n\nA Lightning address lets others easily send you Bitcoin. Just share your address (username@blitzwalletapp.com) to get paid.",
@@ -894,26 +916,30 @@
         "initialLoadingMessage": "Preparing invoice details",
         "alreadyPaidInvoiceError": "You have already paid this invoice",
         "descriptionPlaceholder": "Payment description...",
-        "fallbackErrorMessage": "Error decoding invoice"
+        "fallbackErrorMessage": "Error decoding invoice",
+        "connectToSparkMessage": "Connecting to your wallet.",
+        "switchTokenText": "Use Different Token"
       },
       "handlingAddressErrors": {
-        "invlidFormat": "Addresses should be text only. Please check and try again.",
-        "parseError": "We couldn’t recognize the payment type. Please enter a valid Spark, on-chain, LNURL, or BOLT11 invoice.",
+        "invlidFormat": "Invalid format: Addresses should be text only. Please check and try again.",
+        "parseError": "We couldn’t recognize the payment type. Please enter a valid Spark address, Bitcoin address, or a Lightning address/invoice.",
         "paymentProcessingError": "Error processing payment info",
         "tooLowSendingAmount": "The sending amount is too high to cover the payment and fees. Maximum send amount is {{amount}}",
         "processInputError": "Unable to process input",
         "unkonwDecodeError": "Unknown decoding error occurred",
         "invalidInputType": "Not a valid address type",
-        "expiredLightningInvoice": "This lightning invoice has expired",
+        "expiredLightningInvoice": "This Lightning invoice has expired",
         "lnurlAuthStartMeessage": "Starting LNURL auth",
         "lnurlFailedAuthMessage": "Failed to authenticate LNURL",
         "lnurlConfirmMessage": "LNURL successfully authenticated",
-        "lnurlPayInvoiceError": "Unable to retrive invoice from LNURL, please try again.",
-        "lnurlWithdrawlStart": "Generating invoice for withdrawl",
-        "lnurlWithdrawlInvoiceError": "Unable to generate invoice for lnurl withdrawl",
+        "lnurlPayInvoiceError": "Unable to retrieve invoice from LNURL. Please try again.",
+        "lnurlWithdrawlStart": "Generating invoice for withdrawal",
+        "lnurlWithdrawlInvoiceError": "Unable to generate invoice for LNURL withdrawal",
         "waitingForLnurlWithdrawl": "Waiting for payment...",
         "lnurlWithdrawlSuccess": "Withdrawal successful! Your payment is on its way.",
-        "invoiceDetails": "Loading details"
+        "invoiceDetails": "Loading details",
+        "timeoutError": "The process took too long to complete. Please try again.",
+        "payingToSameAddress": "Sending to your own {{addressType}} address is not allowed."
       },
 
       "errorScreen": {
@@ -938,7 +964,7 @@
       "acceptButton": {
         "noSendAmountError": "Please enter a send amount",
         "liquidError": "{{overFlowType}} send amount {{amount}}",
-        "onchainError": "Minimum on-chain send amount is {{amount}}",
+        "onchainError": "Minimum payment to a Bitcoin address is {{amount}}",
         "lnurlPayError": "{{overFlowType}} send amount {{amount}}",
         "lrc20FeeError": "You need {{amount}} to send tokens. Your balance is {{balance}}. Please receive some Bitcoin first.",
         "balanceError": "Not enough funds to cover sending amount and fees"
@@ -962,11 +988,17 @@
       },
       "manualEnterSendAddress": {
         "title": "Enter in destination",
-        "paymentTypesDesc": "Blitz wallet can send to spark, on-chain, LNURL and BOLT 11 addresses"
+        "paymentTypesDesc": "Blitz Wallet can send to Spark addresses, Bitcoin addresses, and Lightning addresses/invoices"
       },
       "sparkErrorScreen": {
         "connectionError": "We’re having trouble connecting to your wallet. Please let us know about this issue.\n\nRemember, your seed phrase keeps your funds safe.",
         "retry": "We couldn’t load your wallet right now. Please try again. \n\nYour funds are safe as long as you have your seed phrase."
+      },
+      "backupSeedWarning": {
+        "header": "Backup Your Seed Phrase",
+        "description": "You have money in your wallet, but you haven’t saved your seed phrase. Your seed phrase is a list of words that unlock your wallet. If you lose this device and don’t have it saved, your money could be gone forever.",
+        "backupBTN": "Backup Now",
+        "laterBTN": "I'll do it later"
       }
     },
     "exportTransactions": {
@@ -976,7 +1008,7 @@
       "txFees": "Transaction Fees (SAT)",
       "amount": "Amount (SAT)",
       "sent/received": "Sent/Received",
-      "title": "Export your payment history in CSV (comma seperated value) format.",
+      "title": "Export your payment history in CSV (comma separated value) format.",
       "paymentsCounter": "{{number}} payments",
       "paymentsCounterTracker": "{{number}} of {{total}}",
       "loadingMessage": "Loading saved transactions"
@@ -985,12 +1017,16 @@
 
   "contacts": {
     "contactsPage": {
+      "contactsHeader": "Contacts",
+      "addContactsText": "Add Contact",
       "searchContactsPlaceholder": "Search added contacts",
       "noContactsMessage": "You have no contacts",
       "editContactProfileMessage": "Edit your profile to begin using contacts.",
       "addContactButton": "Add Contact",
       "editContactButton": "Edit Profile",
-      "unknownSender": "Unknown sender"
+      "unknownSender": "Unknown sender",
+      "noContactSearch": "This contact isn't in your list yet.",
+      "notFound": "not found."
     },
     "addContactsHalfModal": {
       "noContactsMessage": "Not able to find contact.",
@@ -1011,7 +1047,7 @@
       "noDescription": "No description"
     },
     "editMyProfilePage": {
-      "navTitle": "Edit Contact Profile",
+      "navTitle": "Edit Profile",
       "nameInputDesc": "Name",
       "nameInputPlaceholder": "Enter your name",
       "lnurlInputDesc": "LNURL Address",
@@ -1021,17 +1057,18 @@
       "bioInputDesc": "Bio",
       "bioInputPlaceholder": "Enter a short bio",
       "addContactBTN": " Add Contact",
-      "unqiueNameRegexError": "You can only have letters, numbers, or underscores in your username, and must contain at least 1 letter.",
+      "unqiueNameRegexError": "You can only have letters, numbers, or underscores in your username, and it must contain at least 1 letter.",
       "usernameAlreadyExistsError": "This username already exists, please choose another.",
       "unableToSaveError": "Unable to save profile image, please try again.",
-      "deleteProfileImageError": "Unable to delete profile image, please try again."
+      "deleteProfileImageError": "Unable to delete profile image, please try again.",
+      "deleateWarning": "Are you sure you want to delete this contact? Messages older than a week cannot be restored."
     },
 
     "sendAndRequestPage": {
       "descriptionPlaceholder": "Payment description",
       "profileMessage": "Paying {{name}}",
       "contactMessage": "{{name}} paid you",
-      "giftCardappVersionError": "You cannot send a gift card to this contact. They have not updated to the latest verison of Blitz Wallet.",
+      "giftCardappVersionError": "You cannot send a gift card to this contact. They have not updated to the latest version of Blitz Wallet.",
       "giftCardDescription": "You sent {{name}} a {{giftCardName}} Gift Card",
       "cardDetailsError": "We couldn’t load your gift card right now. Please try again.",
       "giftCardRange": "Send {{amount}} - {{amount2}}",
@@ -1072,11 +1109,12 @@
         "pushNotificationUpdateMessage": "{{name}} {{option}} your request",
         "acceptProfileMessage": "Paid {{name}}'s request",
         "acceptPayingContactMessage": "{{name}} paid your request",
-        "requestTitle": "Received request for "
+        "requestTitle": "Received request for {{amount}}",
+        "send": "Send"
       },
       "viewAllGiftCards": {
         "cardNamePlaceH": "Gift Card",
-        "noCardsText": "Your gift cards will appear here once you receive them",
+        "noCardsText": "Your gift cards will appear here when a contact sends you one.",
         "header": "Your Gift Cards",
         "cardsLenghSingular": "{{num}} card",
         "cardsLenghPlurl": "{{num}} cards"
@@ -1084,34 +1122,78 @@
       "editGiftCard": {
         "header": "What would you like to do with your gift?"
       }
+    },
+    "showProfileQr": {
+      "header": "Share Profile",
+      "lnAddress": "Lightning Address",
+      "blitzContact": "Blitz Contact",
+      "copyMessage": "Copied!",
+      "lnurlCopy": "Copy Address",
+      "blitzCopy": "Copy Link",
+      "scanProfile": "Scan Profile"
     }
   },
 
   "settings": {
+    "index": {
+      "editProfile": "Edit Profile",
+      "showQR": "Show QR",
+      "profileHead": "Profile",
+      "settingsHead": "Settings",
+      "seedPopup": "A seed phrase is a list of words that lets you recover your Bitcoin if your device is lost or damaged. Write it down and store it safely. Never give it to anyone—if someone gets it, they can take all your money."
+    },
     "about": {
       "header1": "Software",
       "text2": "Blitz is a free and open source app under the ",
       "text3": "Apache License",
       "text4": " Version 2.0",
-      "text5": "This is a self-custodial Bitcoin Lightning wallet. Blitz does not have access to your funds, if you lose your backup phrase it may result in a loss of funds.",
+      "text5": "This is a self-custodial Bitcoin Spark wallet compatible with the Lightning Network. Blitz does not have access to your funds, if you lose your seed phrase it may result in a loss of funds.",
       "text6": "Blitz uses ",
       "text7": "Breez Liquid SDK, ",
       "text8": "Spark, ",
       "text9": "and ",
       "text10": "Boltz API.",
       "header2": "Good to know",
-      "text12": "Blitz is a powered by the Spark protocol. Spark is an ",
+      "text12": "Blitz is powered by the Spark protocol. Spark is an ",
       "text13": "off-chain protocol ",
       "text14": "where Spark Operators update the state of Bitcoin ownership off-chain ",
       "text15": "allowing for fast, low-fee, and non-custodial transfers without touching the blockchain.",
       "text16": "Creator",
       "text17": "Version:",
-      "learnMore": "Learn More"
+      "learnMore": "Learn More",
+      "webpackVerified": "Webpack Verified",
+      "webpackUnvarified": "Webpack Unverified",
+      "showTechnicals": "Show Technical Details",
+      "hideTechnicals": "Hide Technical Details",
+      "backendHash": "Backend Hash",
+      "expectedHash": "Expected Hash"
     },
     "language": {
       "inputPlaceHolder": ""
     },
     "displayOptions": {
+      "appearance": "Appearance",
+      "theme": "Theme",
+      "light": "Light",
+      "lightsOut": "Lights out",
+      "dim": "Dim",
+      "balDisplay": "Balance Display",
+      "prev": "Preview",
+      "denomination": "Denomination",
+      "displayForm": "Display Format",
+      "homepage": "Homepage",
+      "txToDisplay": "Transactions to Display",
+      "transactionsLabel_15": "15 Transactions",
+      "transactionsLabel_20": "20 Transactions",
+      "transactionsLabel_25": "25 Transactions",
+      "transactionsLabel_30": "30 Transactions",
+      "transactionsLabel_35": "35 Transactions",
+      "transactionsLabel_40": "40 Transactions",
+      "privFeat": "Privacy & Features",
+      "cameraSwipe": "Swipe for camera",
+      "cameraSwipeDesc": "Swipe right on any main screen to open the camera.",
+      "unkownSenders": "Hide Unknown Senders",
+      "unknownSenderDesc": "Hide transactions from unknown contacts",
       "text1": "Dark Mode Style",
       "text2": "Lights out",
       "text3": "Dim",
@@ -1119,17 +1201,25 @@
       "text5": "Current denomination",
       "text6": "Please reconnect to the internet to switch your denomination",
       "text7": "How to display",
-      "text8": "fiat",
+      "fiat": "Fiat",
+      "hidden": "Hidden",
+      "symbol": "Symbol",
+      "word": "Word",
       "text9": "Example",
       "text10": "Home Screen",
       "text11": "Swipe for camera",
       "text12": "Swipe right from the main screen—whether you're on Contacts, Wallet, or the Home page—to quickly open the camera for scanning.",
       "text13": "Displayed Transactions",
       "text14": "Contacts Page",
-      "text15": "Hide Unknown Senders"
+      "text15": "Hide Unknown Senders",
+      "sparkTitle": "BTKN Spark Tokens",
+      "sliderTitle_enabled": "Show BTKN tokens",
+      "thousandsSeperator": "Thousands Separator",
+      "space": "Space",
+      "local": "Local Number Format"
     },
     "fastPay": {
-      "text1": "Error adding inputed value, plase try again.",
+      "text1": "Error adding input value. Please try again.",
       "text2": "Amount cannot be 0",
       "text3": "Enable Fast Pay",
       "text4": "Fast pay threshold (SAT)",
@@ -1140,46 +1230,46 @@
       "text2": "Security Type",
       "text3": "Pin",
       "text4": "Biometric",
-      "text5": "Device does not have a Biometric profile. Create one in settings to continue.",
+      "text5": "Device does not have a Biometric profile. Create one in Settings to continue.",
       "text6": "Error logging in with Biometrics",
       "text7": "Device does not support Biometric login",
       "unsuccesfullLoginSwitch": "Unable to switch login type",
       "toggleSecurityModeError": "Something went wrong while switching your security settings. Please try again.",
       "noBiometricsError": "Device does not support Biometric login",
-      "noBiometricProfileError": "Device does not have a Biometric profile. Create one in settings to continue.",
+      "noBiometricProfileError": "Device does not have a Biometric profile. Create one in Settings to continue.",
       "biometricSignInError": "Error logging in with Biometrics",
       "migratingStorageMessgae": "Migrating storage to new security.",
       "createPinPageHeader": "{{type}} your Blitz PIN",
-      "invalidPinconfirmation": "PIN's do not match. Try again!"
+      "invalidPinconfirmation": "PINs do not match. Try again!",
+      "randomPinKeyboardToggle": "Shuffle Keypad",
+      "randomPinKeyboardInfo": "Enable this feature to shuffle the keypad numbers every time you log in. It adds an extra layer of security by making it harder for anyone nearby to learn your PIN pattern."
     },
     "seedPhrase": {
-      "header": "Keep this phrase in a secure and safe place",
+      "header": "Keep this seed phrase in a secure and safe place",
       "headerDesc": "Do not share it with anyone!",
-      "qrWarning": "Are you sure you want to show this QR Code?\n\nScanning your seed is convenient, but be sure you're using a secure and trusted device. This helps keep your wallet safe.",
+      "qrWarning": "Are you sure you want to show this QR Code?\n\nScanning your seed phrase is convenient but be sure you're using a secure and trusted device. This helps keep your wallet safe.",
       "wordsText": "Words",
       "qrText": "QR Code",
-      "showSeedWarning": "Are you sure you want to show your recovery phrase?"
+      "showSeedWarning": "Are you sure you want to show your seed phrase?"
     },
     "crashReporting": {
-      "enabled": "Enabled",
-      "disabled": "Disabled",
-      "crashreporting": "crash reporting",
+      "crashreporting_enabled": "Enabled crash reporting",
+      "crashreporting_disabled": "Disabled crash reporting",
       "descriptionText": "Crash data helps us improve the stability and performance of our application.\n\nWhen a crash occurs, the device information that is automatically recorded includes:\n\n• Operating System: OS version, device orientation, and jailbreak status\n• Device Details: Model, orientation, and available RAM\n• Crash Information: Date of the crash and the app version"
     },
 
     "accounts": {
-      "inputPlaceholder": "Account name",
-      "buttonCTA": "Swap Funds"
+      "inputPlaceholder": "Search existing account"
     },
     "resetWallet": {
       "header": "Are you sure?",
       "dataDeleteHeader": "Select data to delete from this device.",
-      "dataDeleteDesc": "Any option that is selected will be removed forever. If your seed is forgotten, you WILL lose your funds.",
-      "seedAndPinOpt": "Delete seed phrase and pin from my device",
-      "localData": "Delete locally stored data from my device",
+      "dataDeleteDesc": "This will delete all wallet data from your device. If you don’t have a copy of your seed phrase saved, you WILL lose access to your funds.",
+      "boxNotChecked": "Please check the box to confirm you want to reset your wallet before resetting.",
+      "seedAndPinOpt": "Delete all data from my device",
       "balanceText": "Your balance is",
-      "localStorageError": "Not able to delete local stored information",
-      "secureStorageError": "Not able to delete secure stored information"
+      "localStorageError": "Unable to delete locally stored information",
+      "secureStorageError": "Unable to delete securely stored information"
     },
     "sparkInfo": {
       "title": "Wallet Info",
@@ -1189,48 +1279,52 @@
     "sparkLrc20": {
       "balanceError": "Your current wallet balance is {{balance}}. Blitz adds a {{fee}} fee to all BTKN payments. Make sure you have some Bitcoin in your wallet to send tokens.",
       "title": "Spark Settings",
-      "sliderTitle": "{{switchType}} BTKN",
-      "sliderDesc": "BTKN is Spark’s native token. Enabling BTKN allows you send and receive tokens on the Spark network.\n\nBlitz is a Bitcoin focused wallet. We do not promote or endorse the use of tokens. This feature exists because we believe users should have the freedom to use the technology they want to use.\n\nBlitz also applies a {{fee}} fee to all token transactions, with 20% of that fee donated to support open-source Bitcoin development."
+      "sliderTitle_enabled": "Enabled BTKN",
+      "sliderTitle_disabled": "Disabled BTKN",
+      "sliderDesc": "BTKN is Spark’s native token. Enabling BTKN allows you to send and receive tokens on the Spark network.\n\nBlitz is a Bitcoin-focused wallet. We do not promote or endorse the use of tokens. This feature exists because we believe users should have the freedom to use the technology they want to use.",
+      "selectTokenHeader": "Default Token",
+      "selectTokenInformationPopup": "Choose which token you’d like to use first when sending payments. Don’t worry—you can still change it on the payment page anytime."
     },
     "viewSwapsHome": {
-      "swaps": "Swaps",
+      "swaps": "Network Transfers",
       "selectionTitle": "Choose Network",
       "liquid": "Liquid",
       "rootstock": "Rootstock",
-      "pageTitle": "{{type}} Swaps"
+      "pageTitle": "{{type}} Transfers"
     },
 
     "viewRoostockSwaps": {
-      "loadingMessage": "Loading saved Roostock swaps",
-      "noSwapsMessage": "You have no saved Roostock swaps"
+      "loadingMessage": "Loading saved Roostock transfers",
+      "noSwapsMessage": "You have no saved Roostock transfers"
     },
     "rootstockSwapInfo": {
       "title": "Submarine Swap",
       "id": "ID",
-      "swapDetails": "Swap Details",
+      "swapDetails": "Transfer Details",
       "claimAddress": "Claim Address",
       "timeoutBHeight": "Timeout Block Height",
       "expAmount": "Expected Amount",
       "invoice": "Invoice",
-      "refundSwap": "Refund swap"
+      "refundSwap": "Refund transfer"
     },
 
     "viewAllLiquidSwaps": {
       "rescanComplete": "Rescan complete",
-      "swapStartedMessage": "The swap has started. It may take 10–20 seconds for the payment to show up.",
-      "balanceError": "Current liquid balance is {{balance}} but the minimum swap amount is {{swapAmount}}",
-      "loadingMessage": "Getting liquid info",
+      "swapStartedMessage": "The transfer has started. It may take 10–20 seconds for the payment to show up.",
+      "balanceError": "Current Liquid balance is {{balance}} but the minimum transfer amount is {{swapAmount}}",
+      "loadingMessage": "Getting Liquid info",
       "breakdownHead": "Balance Breakdown",
       "incoming": "{{amount}} pending incoming",
       "outgoing": "{{amount}} pending outgoing",
-      "balance": "{{amount}} liquid balance",
+      "balance": "{{amount}} Liquid balance",
       "rescan": "Rescan",
       "totalBalance": "Total Balance",
-      "swapMessage": "Blitz Wallet will try to swap your Liquid funds into Spark when you first load the app or when you receive Liquid payments.\n\nHowever, in some cases a swap might be missed. To move these funds into Spark manually, just click the Swap button below.",
-      "swap": "Swap"
+      "swapMessage": "Blitz Wallet will try to transfer your Liquid funds into Spark when you first load the app or when you receive Liquid payments.\n\nHowever, in some cases a transfer might be missed. To move these funds into Spark manually, just click the Transfer button below.",
+      "swap": "Transfer"
     },
     "notifications": {
-      "mainToggle": "{{state}} notifications",
+      "mainToggle_enabled": "Enabled notifications",
+      "mainToggle_disabled": "Disabled notifications",
       "mainToggleDesc": "Notifications let you stay informed about important events and updates happening in the app.",
       "optionsTitle": "Notification options",
       "contact": "Contact",
@@ -1246,13 +1340,13 @@
       "nwcDesc": "Connect your Blitz Wallet to apps using Nostr."
     },
     "fiatCurrency": {
-      "title": "Display Currency",
+      "title": "Currency",
       "placeholderText": "Search currency",
       "saveCurrencyError": "We were unable to save the selected currency, please try again."
     },
     "feeInformation": {
       "title": "",
-      "description": "Blitz Wallet offers free and open‑source products for the Bitcoin community. \n\nTo help keep the project sustainable, we’ve added a small transaction fee to each payment.\n\nHere’s how those fees are distributed:",
+      "description": "Blitz Wallet provides free and open-source tools for the Bitcoin community.\n\nTo support the long-term sustainability of the project, a small transaction fee will be applied to each payment.\n\nOnce fees are active, they will be displayed here.",
       "upTo": "Up To",
       "fixedFee": "Fixed Fee",
       "percent": "Percent",
@@ -1266,9 +1360,9 @@
       "regexError": "Name can only include letters or numbers.",
       "takenNameError": "Name already taken",
       "nameConfirmationMessage": "NIP-05 added successfully! Please note that it may take up to 24 hours to appear, as the list is updated once per day.",
-      "title": "Nip5 Verification",
-      "desc": "Nip5 turns your long Npub into a small email-like address, similar to a lightning address.",
-      "dataIsInvalid": "Something went wrong, please try again,",
+      "title": "NIP-05 Verification",
+      "desc": "NIP-05 turns your long Npub into a small, email-like address, similar to a Lightning address.",
+      "dataIsInvalid": "Something went wrong. Please try again.",
       "usernameInputLabel": "Username",
       "usernameInputPlaceholder": "Satoshi...",
       "publicKeyLabel": "Username",
@@ -1277,7 +1371,7 @@
         "invalidPubKey": "Invalid pubkey: must be a non-empty string",
         "invalidNpub": "Invalid npub format",
         "decodeNpubError": "Failed to decode npub",
-        "invlaidFormat": "Invalid pubkey format: must be either 64-character hex string or npub"
+        "invlaidFormat": "Invalid pubkey format: must be either a 64-character hex string or npub"
       }
     },
     "nwc": {
@@ -1309,30 +1403,38 @@
         "wanringMessage": "To send money from your Nostr Connect wallet, you’ll first need to add funds—either by receiving money or transferring from your main wallet.\n\n You can transfer funds from your main wallet to NWC in the account settings page."
       },
       "noNotifications": {
-        "wanringMessage": "In order to use Nostr Wallet Connect you need to have push notification for Nostr Wallet Connect enabled.\n\nPlease enable push notifications in the settings and try again."
+        "wanringMessage": "In order to use Nostr Wallet Connect you need to have push notifications for Nostr Wallet Connect enabled.\n\nPlease enable push notifications in the settings and try again."
       },
       "showSeedPage": {
-        "loadingMessage": "Generating Mnemonic",
-        "wanringMessage": "To keep your wallet safe, Nostr Wallet Connect creates a separate seed phrase from your main wallet's seed.\n\nThis wallet uses the second derivation path and can always be recovered using your main wallet's seed.\n\nIf you're not tech-savvy and unsure about recovering the wallet address, please write down this seed phrase.",
-        "viewSeed": "View seed"
+        "loadingMessage": "Generating seed phrase",
+        "wanringMessage": "To keep your wallet safe, Nostr Wallet Connect creates a separate seed phrase from your main wallet's seed phrase.\n\nThis wallet uses the second derivation path and can always be recovered using your main wallet's seed phrase.\n\nIf you're not tech-savvy and unsure about recovering the wallet address, please write down this seed phrase.",
+        "viewSeed": "View seed phrase"
       }
     },
     "accountComponents": {
+      "homepage": {
+        "addNewAccount": "Add",
+        "swap": "Transfer",
+        "viewSeed": "View seed phrase",
+        "editAccount": "Edit account",
+        "swapAccountError": "You need at least two accounts to make a transfer.",
+        "noAccountsFound": "No accounts match your search."
+      },
       "accountPaymentPage": {
-        "noAmountError": "Please enter an amount to be swapped",
-        "noAccountError": "Please select an account for funds to be swapped from",
-        "noAccountToError": "Please select an account for funds to be swapped to",
-        "loadingFeeError": "Cannot start swap when fee is being calculated",
+        "noAmountError": "Please enter an amount to be transferred",
+        "noAccountError": "Please select an account for funds to be transferred from",
+        "noAccountToError": "Please select an account for funds to be transferred to",
+        "loadingFeeError": "Cannot start transfer when fee is being calculated",
         "alreadyStartedTransferError": "A transfer has already been started",
         "balanceError": "Sending amount is greater than your balance and fees",
-        "noSendAddressError": "Not able to get transfer address",
-        "noAccountInformation": "Not able to get account information",
-        "title": "Swap",
+        "noSendAddressError": "Unable to get transfer address",
+        "noAccountInformation": "Unable to get account information",
+        "title": "Transfer",
         "selectAccount": "Select Account",
-        "inputPlaceHolderText": "Account Swap"
+        "inputPlaceHolderText": "Account Transfer"
       },
       "createAccountPage": {
-        "alreadyUsingSeedError": "This seed already exists for another account",
+        "alreadyUsingSeedError": "This seed phrase already exists for another account",
         "editTitle": "Edit Account",
         "createTitle": "Create Account",
         "updateTitle": "Update Account",
@@ -1341,10 +1443,10 @@
         "inputDesc": "Account Name",
         "nameTakenError": "This name is currently in use. Please use a differnt account name.",
         "nameInputPlaceholder": "Name...",
-        "seedHeader": "Account Seed"
+        "seedHeader": "Account seed phrase"
       },
       "viewAccountPage": {
-        "informationMessage": "Are you sure you want to show this QR Code?\n\nScanning your seed is convenient, but be sure you're using a secure and trusted device. This helps keep your wallet safe."
+        "informationMessage": "Are you sure you want to show this QR Code?\n\nScanning your seed phrase is convenient, but be sure you're using a secure and trusted device. This helps keep your wallet safe."
       }
     },
     "posPath": {
@@ -1375,10 +1477,10 @@
         "updateContactMessage": "The recipient needs to update their Blitz app to get paid.",
         "payingMessage": "Paying...",
         "notifyngMessage": "Notifiying...",
-        "errorPaying": "Unable to pay blitz contact. Try again later.",
+        "errorPaying": "Unable to pay Blitz contact. Try again later.",
         "invalidName": "Name is not an LNURL or a Blitz user.",
         "removeEmployeeWarning": "Are you sure you want to remove this employee?",
-        "startingPaymentProcessMessage": "'Begining payment process, please do not leave this page or the app.",
+        "startingPaymentProcessMessage": "Begining payment process, please do not leave this page or the app.",
         "goBack": "Go back",
         "lastSale": "Last sale:",
         "numTipsPaid": "Tips paid:",
@@ -1390,6 +1492,7 @@
         "unpaidtips": "Tips: {{number}}",
         "title": "Tips to pay",
         "empNamePlaceholder": "Employee name",
+        "noEmployees": "You currently don’t have any employees with saved tips. Once an employee uses the point-of-sale, their tips will appear here so you can pay them.",
         "noTips": "Employee has no tips"
       },
       "items": {
@@ -1438,21 +1541,28 @@
         "shopTitle": "Shop with Bitcoin",
         "shopDescription": "Buy gift cards from thousands of different merchants around the world",
         "callToAction": "Anything you want here?",
-        "featuredApps": "Anything you want here?"
+        "featuredApps": "Anything you want here?",
+        "comingSoon": "This feature is temporarily unavailable. We're working to restore it as soon as possible."
       },
 
       "confirmTxPage": {
         "failedToSend": "Failed to send",
-        "confirmMessage": "{{direction}} succesfully",
+        "confirmMessage": "{{direction}} successfully",
         "paymentErrorMessage": "There was an issue sending this payment, please try again.",
         "sendReport": "Send report to developer",
-        "lnurlAuthSuccess": "Wallet authentication successful! You’re now logged in."
+        "lnurlAuthSuccess": "Wallet authentication successful! You’re now logged in.",
+        "emailReport": "Send via Email",
+        "copyReport": "Copy to Clipboard",
+        "confirmMessage_sent": "Sent successfully",
+        "confirmMessage_received": "Received successfully"
       },
       "expandedTxPage": {
-        "confirmMessage": "{{direction}} amount",
+        "confirmMessage_sent": "Sent amount",
+        "confirmMessage_received": "Received amount",
         "paymentStatus": "Payment status",
         "confReqired": "Confs required",
-        "detailsBTN": "Technical details"
+        "detailsBTN": "Technical details",
+        "contactPaymentType": "Contact"
       },
       "explorePage": {
         "timeLeft": "({{time}} left)",
@@ -1465,24 +1575,38 @@
         "loadingText": "We're setting things up. Hang tight! This could take up to  a minute.",
         "dbInitError": "Unable to open the database. Please try again.",
         "userSettingsError": "Unable to load user settings. Please try again.",
-        "liquidWalletError": "Wallet information was not set properly, please try again.",
-        "liquidWalletError2": "We were unable to set up your wallet. Please try again."
+        "liquidWalletError": "Wallet information was not set properly. Please try again.",
+        "liquidWalletError2": "We were unable to set up your wallet. Please try again.",
+        "dbInitError1": "We’re unable to set up your app.",
+        "dbInitError2": "Please try again. If this issue continues, you can safely recover your funds using your seed phrase."
       },
 
       "receiveBtcPage": {
-        "onchainFeeMessage": "On-chain payments have a network fee and 0.1% Spark fee.\n\nIf you send money to yourself, you’ll pay the network fee twice — once to send it and once to claim it.\n\nIf someone else sends you money, you’ll only pay the network fee once to claim it.",
-        "liquidFeeMessage": "Liquid payments need to be swapped into Spark.\n\nThis process includes a lockup fee of about {{fee}}, a claim fee of around {{claimFee}}, and a 0.1% service fee from Boltz based on the amount you’re sending.",
-        "rootstockFeeMessage": "Rootstock payments need to be swapped into Spark.\n\nThis process includes a lockup fee of about {{fee}}, and a 0.1% service fee from Boltz based on the amount you’re sending.",
-        "generatingInvoice": "Generating Invoice"
+        "onchainFeeMessage": "Payments received to Bitcoin addresses have a network fee and a 0.1% Spark fee.\n\nIf you send money to yourself, you'll pay the network fee twice — once to send it and once to claim it.\n\nIf someone else sends you money, you'll only pay the network fee once to claim it.",
+        "liquidFeeMessage": "Payments received to Liquid addresses need to be transferred into Spark.\n\nThis process includes a lockup fee of about {{fee}}, a claim fee of around {{claimFee}}, and a 0.1% service fee from Boltz based on the amount you're sending.",
+        "rootstockFeeMessage": "Payments received to Rootstock addresses need to be transferred into Spark.\n\nThis process includes a lockup fee of about {{fee}}, and a 0.1% service fee from Boltz based on the amount you're sending.",
+        "generatingInvoice": "Generating Invoice",
+        "amountPlaceholder": "Any amount",
+        "invoiceDescription_lightningInvoice": "Lightning invoice",
+        "invoiceDescription_lightningAddress": "Lightning address",
+        "invoiceDescription_bitcoinAddress": "Bitcoin address",
+        "invoiceDescription_liquidAddress": "Liquid address",
+        "invoiceDescription_sparkAddress": "Spark address",
+        "invoiceDescription_rootstockAddress": "Rootstock address",
+        "header_lightning": "Bitcoin via Lightning",
+        "header_bitcoin": "Bitcoin",
+        "header_spark": "Bitcoin/Tokens via Spark",
+        "header_liquid": "Bitcoin via Liquid",
+        "header_rootstock": "Bitcoin via Rootstock"
       },
 
       "settingsContent": {
         "about": "About",
         "language": "Language",
-        "display currency": "Display Currency",
+        "display currency": "Currency",
         "display options": "Display Options",
         "edit contact profile": "Edit Contact Profile",
-        "view all swaps": "Swaps",
+        "view all swaps": "Network Transfers",
         "fast pay": "Fast Pay",
         "blitz fee details": "Blitz Fee Details",
         "crash reports": "Crash Reports",
@@ -1495,6 +1619,7 @@
         "spark info": "Spark Info",
         "delete wallet": "Delete Wallet",
         "general": "General",
+        "preferences": "Preferences",
         "security": "Security",
         "technical settings": "Technical Settings",
         "experimental features": "Experimental Features",
@@ -1504,7 +1629,7 @@
       },
       "technicalTransactionDetails": {
         "txHash": "Transaction Hash",
-        "paymentId": "Payment Id",
+        "paymentId": "Payment ID",
         "preimage": "Payment Preimage",
         "address": "Payment Address",
         "bitcoinTxId": "Bitcoin Txid",
@@ -1528,6 +1653,120 @@
         "maxSupply": "Max Supply",
         "tokenTicker": "Token Ticker",
         "tokenPubKey": "Token Public Key"
+      },
+      "giftPages": {
+        "expired": "Expired",
+        "lessThanMin": "Less than a minute left",
+        "timeLeft": {
+          "days_one": "{{count}} day left",
+          "days_other": "{{count}} days left",
+          "hours_one": "{{count}} hour left",
+          "hours_other": "{{count}} hours left",
+          "minutes_one": "{{count}} minute left",
+          "minutes_other": "{{count}} minutes left"
+        },
+        "shareMessage": "You've received a {{icon}}{{amount}} gift! Claim it here:\n{{link}}",
+        "fundGiftMessage": "Creating Gift",
+        "reclaimGiftMessage": "Reclaiming Gift",
+
+        "giftsHome": {
+          "title": "Bitcoin Gifts"
+        },
+
+        "giftsOverview": {
+          "noGiftsHead": "No gifts yet",
+          "noGiftsDesc": "Create your first gift to share Bitcoin with friends and family",
+          "createGift": "Create Gift",
+          "claimed": "Claimed",
+          "expired": "Expired",
+          "unclaimed": "Unclaimed",
+          "reclaimed": "Reclaimed"
+        },
+
+        "createGift": {
+          "noAmountError": "Please enter an amount to create your gift.",
+          "connectError": "We couldn’t set up your gift wallet. Please try again.",
+          "addressError": "We couldn’t get the address for your gift wallet.",
+          "saveError": "We couldn’t save your gift. Please try again.",
+          "fundError": "We couldn’t add funds to your gift.",
+          "startProcess1": "Preparing your gift…",
+          "startProcess2": "Setting things up…",
+          "startProcess3": "Adding funds to your gift…",
+          "header": "Create Gift",
+          "inputPlaceholder": "Add a message or note...",
+          "button": "Create Gift",
+          "disclaimer": "When you create a gift, the money stays locked for 7 days. If no one claims it by then, you can go to the reclaim page to get it back."
+        },
+
+        "giftConfirmation": {
+          "header": "Gift Created!",
+          "whatToDo": "Share this gift with anyone using the QR code or link below",
+          "details": "Gift Details",
+          "expire": "Expires",
+          "giftLink": "Gift Link",
+          "shareGift": "Share Gift",
+          "createAnother": "Create Another",
+          "done": "Done"
+        },
+        "claimHome": {
+          "header": "Enter gift link",
+          "desc": "Paste the gift link you received or scan the QR code to claim your gift",
+          "inputPlaceholder": "Enter gift link",
+          "claim": "Claim"
+        },
+        "reclaimPage": {
+          "header": "Reclaim your gift",
+          "desc": "Enter or choose the gift ID to return an unclaimed, expired gift to your wallet.",
+          "inputPlaceholder": "Enter gift ID",
+          "dropdownPlaceHolder": "Select Expired Gift",
+          "button": "Reclaim Gift",
+          "noReclaimsMessage": "You have no expired gifts right now. Come back after a gift has expired to reclaim it.",
+          "advancedModeBTN": "Advanced Mode"
+        },
+        "advancedMode": {
+          "header": "Advanced Mode",
+          "currentIndexHead": "Current Gift Index",
+          "infoHead": "How Bitcoin Gifts Work",
+          "infoDesc1": "Blitz gifts use separate wallets created from your main wallet. This lets you recover unclaimed funds while keeping your main wallet protected.",
+          "infoDesc2": "Most expired gifts can be reclaimed on the regular reclaim page. If a gift wasn’t fully received or the normal reclaim option doesn’t work, you can use this page to select a specific gift and check if any money is still left.",
+          "inputHead": "Enter Gift Number",
+          "invalidGiftNum": "Please enter a valid gift number between 1 and {{currentGiftIndex}}",
+          "restoreGiftBTN": "Restore Gift",
+          "advancedWarning": "This advanced feature should only be used when the standard reclaim process doesn't work. If you're unsure, try the normal reclaim page first."
+        },
+        "claimPage": {
+          "parseError": "We couldn’t read the gift details from this link.",
+          "noGiftForReclaim": "We couldn’t find this gift. It may have already been claimed.",
+          "expiredOrClaimed": "This gift has already been claimed or has expired.",
+          "noGiftSeed": "We couldn’t reach the gift right now. Please try again later.",
+          "giftWalletInitError": "We were unable to reach the gift. Please try again later.",
+          "noBalanceErrorReclaim": "There are no funds left to reclaim from this gift.",
+          "notExpired": "You cannot reclaim this gift yet.",
+          "nobalanceError": "We couldn’t find an amount for this gift. Please try again later, or try restoring the gift.",
+          "nobalanceErrorExpert": "There’s no amount available to restore for this gift.",
+          "balanceMismatchError": "There was an issue getting the gift amount. Please try again.",
+          "paymentError": "We couldn’t claim the gift. Please try again.",
+          "claimHead": "Accept Gift",
+          "reclaimHead": "Refund Gift",
+          "claimLoading": "Claiming your gift… please stay in the app.",
+          "reclaimLoading": "Returning your funds… please stay in the app.",
+          "claimAmountHead": "Receving amount",
+          "reclaimAmountHead": "Amount Restored",
+          "reclaimAmountHeadExpert": "Gift Number Restored",
+          "networkFeeWarningExpert": "Any amount found, minus network fees, will be added to your balance",
+          "networkFeeWarning": "This amount, minus network fees, will be added to your balance",
+          "buttonTextClaiming": "Claiming",
+          "reclaimButton": "Reclaim Gift",
+          "claimButton": "Accept Gift",
+          "confirmMessage": "Your gift has been claimed, and you will receive your funds shortly",
+          "defaultDesc": "Blitz Gift",
+          "claimingGiftMessage1": "Preparing Gift...",
+          "giftBalanceMessage_0": "Just a moment while we get things ready...",
+          "giftBalanceMessage_1": "We’re gathering your gift information...",
+          "giftBalanceMessage_2": "Almost there—please keep the app open...",
+          "giftBalanceMessage_3": "Finishing up the last steps...",
+          "claimingGiftMessage4": "Claiming Gift..."
+        }
       }
     }
   },
@@ -1550,42 +1789,45 @@
     "requestError": "There was an error with the request, please try again.",
     "invoiceRetrivalError": "There was an error retrieving the invoice, please try again.",
     "payingInvoiceError": "There was an error paying the invoice, please try again.",
-    "noMailAppsFoundError": " No mail apps found on your device. Please install a mail app to use this feature.",
-    "retriveingPhotoesError": " There was an error retrieving photos, please try again.",
-    "clipboardContentError": "No data in clipboard",
+    "noMailAppsFoundError": "No mail apps found on your device. Please install a mail app to use this feature.",
+    "retriveingPhotoesError": "There was an error retrieving photos, please try again.",
+    "clipboardContentError": "No data in the clipboard",
     "userDataFetchError": "Unable to get user from database.",
-    "updateContactMessageError": "There was a problem updating this message, please try again.",
-    "declinePaymentError": "There was a problem declining this payment, please try again.",
-    "payingContactError": "We were not able to get the contacts address, please try again.",
-    "noUserFoundDeeplinkError": "Not able to find any user for this username.",
+    "updateContactMessageError": "There was a problem updating this message. Please try again.",
+    "declinePaymentError": "There was a problem declining this payment. Please try again.",
+    "payingContactError": "We were unable to get the contact's address. Please try again.",
+    "noUserFoundDeeplinkError": "Unable to find any user for this username.",
     "cannotAddSelfError": "You cannot add yourself as a contact.",
-    "fullDeeplinkError": "Unable to retrive contact information, please try again.",
+    "fullDeeplinkError": "Unable to retrieve contact information. Please try again.",
     "processingDeepLinkError": "Failed to process link: {{error}}",
-    "legacyContactError": "Contact has not updated thier wallet yet. Please ask them to update their wallet to send this.",
+    "legacyContactError": "Contact has not updated their wallet yet. Please ask them to update their wallet to send this.",
     "contactInvoiceGenerationError": "Error generating invoice. Make sure this is a valid LNURL address.",
-    "explorePagenoDataError": "We were unable to retrive Blitz user count.",
+    "explorePagenoDataError": "We were unable to retrieve Blitz user count.",
     "savingFileError": "Error saving file to document",
     "savingFilePermissionsError": "Error getting permissions",
     "writtingFileError": "Error writing file to filesystem",
     "createTransactionsFileError": "Unable to create transaction file",
-    "noQrInScanError": "Not able to get find QRcode from image.",
-    "noDataInQRError": "Not able to get find data from image.",
-    "noInvoiceInImageError": "Not able to get invoice from image.",
-    "savingImageError": "Unable to save image, pleae try again.",
-    "invalidSeedError": "Did not enter a valid seed",
-    "invalidSeedWordLengthErorr": "Not every word is of valid length",
-    "invalidSeedLengthError": "Unable to find 12 words from copied recovery phrase.",
+    "noQrInScanError": "Unable to find QR code in image.",
+    "noDataInQRError": "Unable to find data in image.",
+    "noInvoiceInImageError": "Unable to get invoice from image.",
+    "savingImageError": "Unable to save image. Please try again.",
+    "invalidSeedError": "Did not enter a valid seed phrase",
+    "invalidSeedWordLengthErorr": "Not all words are of valid length",
+    "invalidSeedLengthError": "Unable to find 12 words from copied seed phrase.",
     "noGooglePlay": "Google Play Services are required to receive notifications.",
-    "noNotificationPermission": "Blitz doesn’t have notification permissions. Enable them in settings to use notifications.",
+    "noNotificationPermission": "Blitz doesn’t have notification permissions. Enable them in Settings to use notifications.",
     "rootstockInvoiceError": "There was a problem generating your Rootstock address. Please try again.",
     "liquidInvoiceError": "There was a problem generating your Liquid address. Please try again.",
-    "bitcoinInvioceError": "There was a problem generating your Bitcoin address. Please try again.",
+    "bitcoinInvoiceError": "There was a problem generating your Bitcoin address. Please try again.",
     "sparkInvioceError": "There was a problem generating your Spark address. Please try again.",
-    "lightningInvioceError": "There was a problem generating your Lightning address. Please try again.",
+    "lightningInvoiceError": "There was a problem generating your Lightning invoice. Please try again.",
     "sparkConnectionError": "Spark connection failed. Please try again.",
-    "giftCardExpiration": "Gift cards can only be recovered for 7 days after they are sent. If this app is deleted or local storage is cleared after that time, your gift cards will be lost. Be sure to save the claim links or gift card codes somewhere safe.",
+    "giftCardExpiration": "Gift cards can only be recovered for 7 days after they are sent. If this app is deleted or local storage is cleared after that time, your gift cards will be lost. Be sure to save the claim links or gift card codes in a safe place.",
     "receivedRootstock": "Rootstock payment received — your swap is starting. It may take up to a minute, so please keep the app open.",
-    "receivedLiquid": "Liquid payment received — your swap is starting. It may take up to a minute, so please keep the app open."
+    "receivedLiquid": "Liquid payment received — your swap is starting. It may take up to a minute, so please keep the app open.",
+    "invalidData": "The data you entered isn’t valid",
+    "paymentError": "Something went wrong while processing your payment. Please try again. If it still doesn’t work, close the app and reopen it before trying again.",
+    "paymentFeeError": "We couldn’t retrieve the payment fee. Please try again. If the issue continues, close the app and reopen it before trying again."
   },
 
   "loadingScreen": {
@@ -1599,9 +1841,12 @@
       "depositLabel": "Deposit address payment"
     }
   },
+  "share": {
+    "contact": "Hi, add me on Blitz!"
+  },
 
   "swapMessages": {
-    "liquid": "Liquid to Spark Swap"
+    "liquid": "Liquid to Spark Transfer"
   },
   "tabs": {
     "home": "Wallet",
@@ -1609,6 +1854,10 @@
     "contacts": "Contacts"
   },
   "pushNotifications": {
+    "paymentReceived": {
+      "title": "Payment received",
+      "body": "You received {{totalAmount}}"
+    },
     "LNURL": {
       "zapped": "You were zapped {{totalAmount}}",
       "regular": "You just received {{totalAmount}}"
diff --git a/package-lock.json b/package-lock.json
index 6ab38d8..273a2ef 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,16 +1,16 @@
 {
   "name": "blitz-web-app",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "blitz-web-app",
-      "version": "0.1.3",
+      "version": "0.1.4",
       "dependencies": {
         "@bitcoinerlab/secp256k1": "^1.2.0",
         "@breeztech/breez-sdk-liquid": "^0.11.2",
-        "@buildonspark/spark-sdk": "^0.4.3",
+        "@buildonspark/spark-sdk": "^0.5.2",
         "@emotion/react": "^11.14.0",
         "@emotion/styled": "^11.14.0",
         "@mui/icons-material": "^7.1.1",
@@ -22,7 +22,7 @@
         "@vulpemventures/secp256k1-zkp": "^3.2.1",
         "bech32": "^2.0.0",
         "bip21": "^3.0.0",
-        "bitcoin-address-parser": "^1.0.1",
+        "bitcoin-address-parser": "^1.0.3",
         "bitcoinjs-lib": "^6.1.7",
         "bolt11": "^1.4.1",
         "boltz-core": "^3.0.0",
@@ -32,6 +32,7 @@
         "events": "^3.3.0",
         "firebase": "^11.9.0",
         "framer-motion": "^12.10.0",
+        "i18next": "^25.7.3",
         "idb": "^8.0.3",
         "intl-pluralrules": "^2.0.1",
         "js-sha256": "^0.11.1",
@@ -1591,9 +1592,9 @@
       }
     },
     "node_modules/@babel/runtime": {
-      "version": "7.27.6",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.27.6.tgz",
-      "integrity": "sha512-vbavdySgbTTrmFE+EsiqUTzlOr5bzlnJtUv9PynGCAKvfQqjIXbvFdumPM/GxMDfyuGMJaJAU6TO4zc1Jf1i8Q==",
+      "version": "7.28.4",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.4.tgz",
+      "integrity": "sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ==",
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
@@ -1666,18 +1667,17 @@
       "license": "MIT"
     },
     "node_modules/@bufbuild/protobuf": {
-      "version": "2.9.0",
-      "resolved": "https://registry.npmjs.org/@bufbuild/protobuf/-/protobuf-2.9.0.tgz",
-      "integrity": "sha512-rnJenoStJ8nvmt9Gzye8nkYd6V22xUAnu4086ER7h1zJ508vStko4pMvDeQ446ilDTFpV5wnoc5YS7XvMwwMqA==",
+      "version": "2.10.2",
+      "resolved": "https://registry.npmjs.org/@bufbuild/protobuf/-/protobuf-2.10.2.tgz",
+      "integrity": "sha512-uFsRXwIGyu+r6AMdz+XijIIZJYpoWeYzILt5yZ2d3mCjQrWUTVpVD9WL/jZAbvp+Ed04rOhrsk7FiTcEDseB5A==",
       "license": "(Apache-2.0 AND BSD-3-Clause)"
     },
     "node_modules/@buildonspark/spark-sdk": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/@buildonspark/spark-sdk/-/spark-sdk-0.4.3.tgz",
-      "integrity": "sha512-CSV3xI5fBKdy4xeGpl2CgYuKX2Qx2+QU0xpjDM+dGGR7OqOffXNboQRW2YL6e7/siGDWx8w+Aboxp+knQokYRA==",
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/@buildonspark/spark-sdk/-/spark-sdk-0.5.2.tgz",
+      "integrity": "sha512-hiXwJRdzOhV4cCJoJTcdMaCPNkJcGp3j7fqpj7O5eAZhJ6i20THGlRZVDeHE/QKPo/gzGkRqC1oD9X6fiTEBdQ==",
       "license": "Apache-2.0",
       "dependencies": {
-        "@bitcoinerlab/secp256k1": "^1.1.1",
         "@bufbuild/protobuf": "^2.2.5",
         "@lightsparkdev/core": "^1.4.4",
         "@noble/curves": "^1.8.0",
@@ -1686,7 +1686,6 @@
         "@opentelemetry/context-async-hooks": "^2.0.0",
         "@opentelemetry/core": "^2.0.0",
         "@opentelemetry/instrumentation": "^0.203.0",
-        "@opentelemetry/instrumentation-fetch": "^0.203.0",
         "@opentelemetry/instrumentation-undici": "^0.14.0",
         "@opentelemetry/sdk-trace-base": "^2.0.0",
         "@opentelemetry/sdk-trace-node": "^2.0.1",
@@ -1701,7 +1700,6 @@
         "bare-crypto": "^1.9.2",
         "bare-fetch": "^2.4.1",
         "buffer": "^6.0.3",
-        "eciesjs": "^0.4.13",
         "eventemitter3": "^5.0.1",
         "js-base64": "^3.7.7",
         "light-bolt11-decoder": "^3.2.0",
@@ -1710,7 +1708,8 @@
         "nice-grpc-common": "^2.0.2",
         "nice-grpc-opentelemetry": "^0.1.18",
         "nice-grpc-web": "^3.3.7",
-        "ts-proto": "^2.6.1",
+        "ts-proto": "2.8.3",
+        "ua-parser-js": "^2.0.6",
         "uuidv7": "^1.0.2"
       },
       "engines": {
@@ -1740,20 +1739,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/@ecies/ciphers": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@ecies/ciphers/-/ciphers-0.2.4.tgz",
-      "integrity": "sha512-t+iX+Wf5nRKyNzk8dviW3Ikb/280+aEJAnw9YXvCp2tYGPSkMki+NRY+8aNLmVFv3eNtMdvViPNOPxS8SZNP+w==",
-      "license": "MIT",
-      "engines": {
-        "bun": ">=1",
-        "deno": ">=2",
-        "node": ">=16"
-      },
-      "peerDependencies": {
-        "@noble/ciphers": "^1.0.0"
-      }
-    },
     "node_modules/@emnapi/runtime": {
       "version": "1.4.3",
       "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.4.3.tgz",
@@ -3663,9 +3648,9 @@
       }
     },
     "node_modules/@lightsparkdev/core": {
-      "version": "1.4.5",
-      "resolved": "https://registry.npmjs.org/@lightsparkdev/core/-/core-1.4.5.tgz",
-      "integrity": "sha512-SQo1wNNMfJNFdZPFsbYOylEa6t5X9S+FnKneju9qbvWZz9vfsb6B+MkvVW7DUGoMhisjtPzmR691qedfvstWIg==",
+      "version": "1.4.7",
+      "resolved": "https://registry.npmjs.org/@lightsparkdev/core/-/core-1.4.7.tgz",
+      "integrity": "sha512-/u97sL1IrTsY4Bsk9MsUbqnV5NWv8R6pH1a86E9oadcJumU5TGbWVS1E0ZGIWnqZf0QktHtu4XiBc9OyzzMFMA==",
       "license": "Apache-2.0",
       "dependencies": {
         "dayjs": "^1.11.7",
@@ -3912,18 +3897,6 @@
         }
       }
     },
-    "node_modules/@noble/ciphers": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/@noble/ciphers/-/ciphers-1.3.0.tgz",
-      "integrity": "sha512-2I0gnIVPtfnMw9ee9h1dJG7tp81+8Ob3OJb3Mv37rx5L40/b0i7djjCVvGOVqc9AEIQyvyu1i6ypKdFw8R8gQw==",
-      "license": "MIT",
-      "engines": {
-        "node": "^14.21.3 || >=16"
-      },
-      "funding": {
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
     "node_modules/@noble/curves": {
       "version": "1.9.7",
       "resolved": "https://registry.npmjs.org/@noble/curves/-/curves-1.9.7.tgz",
@@ -3982,9 +3955,9 @@
       }
     },
     "node_modules/@opentelemetry/context-async-hooks": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/context-async-hooks/-/context-async-hooks-2.1.0.tgz",
-      "integrity": "sha512-zOyetmZppnwTyPrt4S7jMfXiSX9yyfF0hxlA8B5oo2TtKl+/RGCy7fi4DrBfIf3lCPrkKsRBWZZD7RFojK7FDg==",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/context-async-hooks/-/context-async-hooks-2.2.0.tgz",
+      "integrity": "sha512-qRkLWiUEZNAmYapZ7KGS5C4OmBLcP/H2foXeOEaowYCR0wi89fHejrfYfbuLVCMLp/dWZXKvQusdbUEZjERfwQ==",
       "license": "Apache-2.0",
       "engines": {
         "node": "^18.19.0 || >=20.6.0"
@@ -3994,9 +3967,9 @@
       }
     },
     "node_modules/@opentelemetry/core": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/core/-/core-2.1.0.tgz",
-      "integrity": "sha512-RMEtHsxJs/GiHHxYT58IY57UXAQTuUnZVco6ymDEqTNlJKTimM4qPUPVe8InNFyBjhHBEAx4k3Q8LtNayBsbUQ==",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/core/-/core-2.2.0.tgz",
+      "integrity": "sha512-FuabnnUm8LflnieVxs6eP7Z383hgQU4W1e3KJS6aOG3RxWxcHyBxH8fDMHNgu/gFx/M2jvTOW/4/PHhLz6bjWw==",
       "license": "Apache-2.0",
       "dependencies": {
         "@opentelemetry/semantic-conventions": "^1.29.0"
@@ -4025,88 +3998,6 @@
         "@opentelemetry/api": "^1.3.0"
       }
     },
-    "node_modules/@opentelemetry/instrumentation-fetch": {
-      "version": "0.203.0",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/instrumentation-fetch/-/instrumentation-fetch-0.203.0.tgz",
-      "integrity": "sha512-Z+mls3rOP2BaVykDZLLZPvchjj9l2oj3dYG1GTnrc27Y8o3biE+5M1b0izblycbbQHXjMPHQCpmjHbLMQuWtBg==",
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@opentelemetry/core": "2.0.1",
-        "@opentelemetry/instrumentation": "0.203.0",
-        "@opentelemetry/sdk-trace-web": "2.0.1",
-        "@opentelemetry/semantic-conventions": "^1.29.0"
-      },
-      "engines": {
-        "node": "^18.19.0 || >=20.6.0"
-      },
-      "peerDependencies": {
-        "@opentelemetry/api": "^1.3.0"
-      }
-    },
-    "node_modules/@opentelemetry/instrumentation-fetch/node_modules/@opentelemetry/core": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/core/-/core-2.0.1.tgz",
-      "integrity": "sha512-MaZk9SJIDgo1peKevlbhP6+IwIiNPNmswNL4AF0WaQJLbHXjr9SrZMgS12+iqr9ToV4ZVosCcc0f8Rg67LXjxw==",
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@opentelemetry/semantic-conventions": "^1.29.0"
-      },
-      "engines": {
-        "node": "^18.19.0 || >=20.6.0"
-      },
-      "peerDependencies": {
-        "@opentelemetry/api": ">=1.0.0 <1.10.0"
-      }
-    },
-    "node_modules/@opentelemetry/instrumentation-fetch/node_modules/@opentelemetry/resources": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/resources/-/resources-2.0.1.tgz",
-      "integrity": "sha512-dZOB3R6zvBwDKnHDTB4X1xtMArB/d324VsbiPkX/Yu0Q8T2xceRthoIVFhJdvgVM2QhGVUyX9tzwiNxGtoBJUw==",
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@opentelemetry/core": "2.0.1",
-        "@opentelemetry/semantic-conventions": "^1.29.0"
-      },
-      "engines": {
-        "node": "^18.19.0 || >=20.6.0"
-      },
-      "peerDependencies": {
-        "@opentelemetry/api": ">=1.3.0 <1.10.0"
-      }
-    },
-    "node_modules/@opentelemetry/instrumentation-fetch/node_modules/@opentelemetry/sdk-trace-base": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/sdk-trace-base/-/sdk-trace-base-2.0.1.tgz",
-      "integrity": "sha512-xYLlvk/xdScGx1aEqvxLwf6sXQLXCjk3/1SQT9X9AoN5rXRhkdvIFShuNNmtTEPRBqcsMbS4p/gJLNI2wXaDuQ==",
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@opentelemetry/core": "2.0.1",
-        "@opentelemetry/resources": "2.0.1",
-        "@opentelemetry/semantic-conventions": "^1.29.0"
-      },
-      "engines": {
-        "node": "^18.19.0 || >=20.6.0"
-      },
-      "peerDependencies": {
-        "@opentelemetry/api": ">=1.3.0 <1.10.0"
-      }
-    },
-    "node_modules/@opentelemetry/instrumentation-fetch/node_modules/@opentelemetry/sdk-trace-web": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/sdk-trace-web/-/sdk-trace-web-2.0.1.tgz",
-      "integrity": "sha512-R4/i0rISvAujG4Zwk3s6ySyrWG+Db3SerZVM4jZ2lEzjrNylF7nRAy1hVvWe8gTbwIxX+6w6ZvZwdtl2C7UQHQ==",
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@opentelemetry/core": "2.0.1",
-        "@opentelemetry/sdk-trace-base": "2.0.1"
-      },
-      "engines": {
-        "node": "^18.19.0 || >=20.6.0"
-      },
-      "peerDependencies": {
-        "@opentelemetry/api": ">=1.0.0 <1.10.0"
-      }
-    },
     "node_modules/@opentelemetry/instrumentation-undici": {
       "version": "0.14.0",
       "resolved": "https://registry.npmjs.org/@opentelemetry/instrumentation-undici/-/instrumentation-undici-0.14.0.tgz",
@@ -4124,12 +4015,12 @@
       }
     },
     "node_modules/@opentelemetry/resources": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/resources/-/resources-2.1.0.tgz",
-      "integrity": "sha512-1CJjf3LCvoefUOgegxi8h6r4B/wLSzInyhGP2UmIBYNlo4Qk5CZ73e1eEyWmfXvFtm1ybkmfb2DqWvspsYLrWw==",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/resources/-/resources-2.2.0.tgz",
+      "integrity": "sha512-1pNQf/JazQTMA0BiO5NINUzH0cbLbbl7mntLa4aJNmCCXSj0q03T5ZXXL0zw4G55TjdL9Tz32cznGClf+8zr5A==",
       "license": "Apache-2.0",
       "dependencies": {
-        "@opentelemetry/core": "2.1.0",
+        "@opentelemetry/core": "2.2.0",
         "@opentelemetry/semantic-conventions": "^1.29.0"
       },
       "engines": {
@@ -4140,13 +4031,13 @@
       }
     },
     "node_modules/@opentelemetry/sdk-trace-base": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/sdk-trace-base/-/sdk-trace-base-2.1.0.tgz",
-      "integrity": "sha512-uTX9FBlVQm4S2gVQO1sb5qyBLq/FPjbp+tmGoxu4tIgtYGmBYB44+KX/725RFDe30yBSaA9Ml9fqphe1hbUyLQ==",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/sdk-trace-base/-/sdk-trace-base-2.2.0.tgz",
+      "integrity": "sha512-xWQgL0Bmctsalg6PaXExmzdedSp3gyKV8mQBwK/j9VGdCDu2fmXIb2gAehBKbkXCpJ4HPkgv3QfoJWRT4dHWbw==",
       "license": "Apache-2.0",
       "dependencies": {
-        "@opentelemetry/core": "2.1.0",
-        "@opentelemetry/resources": "2.1.0",
+        "@opentelemetry/core": "2.2.0",
+        "@opentelemetry/resources": "2.2.0",
         "@opentelemetry/semantic-conventions": "^1.29.0"
       },
       "engines": {
@@ -4157,14 +4048,14 @@
       }
     },
     "node_modules/@opentelemetry/sdk-trace-node": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/sdk-trace-node/-/sdk-trace-node-2.1.0.tgz",
-      "integrity": "sha512-SvVlBFc/jI96u/mmlKm86n9BbTCbQ35nsPoOohqJX6DXH92K0kTe73zGY5r8xoI1QkjR9PizszVJLzMC966y9Q==",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/sdk-trace-node/-/sdk-trace-node-2.2.0.tgz",
+      "integrity": "sha512-+OaRja3f0IqGG2kptVeYsrZQK9nKRSpfFrKtRBq4uh6nIB8bTBgaGvYQrQoRrQWQMA5dK5yLhDMDc0dvYvCOIQ==",
       "license": "Apache-2.0",
       "dependencies": {
-        "@opentelemetry/context-async-hooks": "2.1.0",
-        "@opentelemetry/core": "2.1.0",
-        "@opentelemetry/sdk-trace-base": "2.1.0"
+        "@opentelemetry/context-async-hooks": "2.2.0",
+        "@opentelemetry/core": "2.2.0",
+        "@opentelemetry/sdk-trace-base": "2.2.0"
       },
       "engines": {
         "node": "^18.19.0 || >=20.6.0"
@@ -4174,13 +4065,13 @@
       }
     },
     "node_modules/@opentelemetry/sdk-trace-web": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/sdk-trace-web/-/sdk-trace-web-2.1.0.tgz",
-      "integrity": "sha512-2F6ZuZFmJg4CdhRPP8+60DkvEwGLCiU3ffAkgnnqe/ALGEBqGa0HrZaNWFGprXWVivrYHpXhr7AEfasgLZD71g==",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/sdk-trace-web/-/sdk-trace-web-2.2.0.tgz",
+      "integrity": "sha512-x/LHsDBO3kfqaFx5qSzBljJ5QHsRXrvS4MybBDy1k7Svidb8ZyIPudWVzj3s5LpPkYZIgi9e+7tdsNCnptoelw==",
       "license": "Apache-2.0",
       "dependencies": {
-        "@opentelemetry/core": "2.1.0",
-        "@opentelemetry/sdk-trace-base": "2.1.0"
+        "@opentelemetry/core": "2.2.0",
+        "@opentelemetry/sdk-trace-base": "2.2.0"
       },
       "engines": {
         "node": "^18.19.0 || >=20.6.0"
@@ -4190,9 +4081,9 @@
       }
     },
     "node_modules/@opentelemetry/semantic-conventions": {
-      "version": "1.37.0",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/semantic-conventions/-/semantic-conventions-1.37.0.tgz",
-      "integrity": "sha512-JD6DerIKdJGmRp4jQyX5FlrQjA4tjOw1cvfsPAZXfOOEErMUHjPcPSICS+6WnM0nB0efSFARh0KAZss+bvExOA==",
+      "version": "1.38.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/semantic-conventions/-/semantic-conventions-1.38.0.tgz",
+      "integrity": "sha512-kocjix+/sSggfJhwXqClZ3i9Y/MI0fp7b+g7kCRm6psy2dsf8uApTRclwG18h8Avm7C9+fnt+O36PspJ/OzoWg==",
       "license": "Apache-2.0",
       "engines": {
         "node": ">=14"
@@ -5591,9 +5482,9 @@
       "license": "MIT"
     },
     "node_modules/bare-crypto": {
-      "version": "1.11.6",
-      "resolved": "https://registry.npmjs.org/bare-crypto/-/bare-crypto-1.11.6.tgz",
-      "integrity": "sha512-CjNxA/7ewj4D1Rhp8RROtQNEjGKhByr8J6PcR8v9W9Hde3e9kT+tbBbBigHgkXGsDniwYIZJ16ccvRAOOgevPw==",
+      "version": "1.12.0",
+      "resolved": "https://registry.npmjs.org/bare-crypto/-/bare-crypto-1.12.0.tgz",
+      "integrity": "sha512-GLeZOS2RQkEawVNPvBKmVZQWwSs4jLhculTvuOfLdP+RTMN1Gv3pz+oI9fcQj7/LE2QJM4cPOHfx4u0izBaTHA==",
       "license": "Apache-2.0",
       "dependencies": {
         "bare-stream": "^2.6.3"
@@ -5617,9 +5508,9 @@
       }
     },
     "node_modules/bare-events": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.8.0.tgz",
-      "integrity": "sha512-AOhh6Bg5QmFIXdViHbMc2tLDsBIRxdkIaIddPslJF9Z5De3APBScuqGP2uThXnIpqFrgoxMNC6km7uXNIMLHXA==",
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.8.2.tgz",
+      "integrity": "sha512-riJjyv1/mHLIPX4RwiK+oW9/4c3TEUeORHKefKAKnZ5kyslbN+HXowtbaVEqt4IMUB7OXlfixcs6gsFeo/jhiQ==",
       "license": "Apache-2.0",
       "peerDependencies": {
         "bare-abort-controller": "*"
@@ -5631,9 +5522,9 @@
       }
     },
     "node_modules/bare-fetch": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/bare-fetch/-/bare-fetch-2.5.0.tgz",
-      "integrity": "sha512-2f/mx0hw4CDH2yX2cT7tVZGPnXcUswZCYu/EY72hHfbAipZJwZtDl8f3DsXJG+yXyPBNw3TNPicMbYPpfuaIfw==",
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/bare-fetch/-/bare-fetch-2.5.1.tgz",
+      "integrity": "sha512-BdJie1S9y3TW0pzF6Q/dP95QDjlUPXexiJWSnKFIM/OHID6ITJk2XEQQ25rsGqwLqxQ4felfGkj13mC/ao27mg==",
       "license": "Apache-2.0",
       "dependencies": {
         "bare-form-data": "^1.1.3",
@@ -5664,15 +5555,22 @@
         "bare-stream": "^2.6.5"
       }
     },
+    "node_modules/bare-http-parser": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/bare-http-parser/-/bare-http-parser-1.0.1.tgz",
+      "integrity": "sha512-A3LTDTcELcmNJ3g5liIaS038v/BQxOhA9cjhBESn7eoV7QCuMoIRBKLDadDe08flxyLbxI2f+1l2MZ/5+HnKPA==",
+      "license": "Apache-2.0"
+    },
     "node_modules/bare-http1": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/bare-http1/-/bare-http1-4.1.1.tgz",
-      "integrity": "sha512-Bcn2YieuzGhlrzWrw9xjlXcI52JvWSkbvWEi+VxezID752OOIoKW1qt5lDR+7K1C12jP4IILnlNCZ8afnxCmxA==",
+      "version": "4.1.6",
+      "resolved": "https://registry.npmjs.org/bare-http1/-/bare-http1-4.1.6.tgz",
+      "integrity": "sha512-IbQZYJZDB+0sriMTH7sW/ygO+mfSm+d5H/qr4IUhKVH4kiGwADw3/rmSIGAnkhppS0kehbypjpmII54nBbkaNg==",
       "license": "Apache-2.0",
       "dependencies": {
         "bare-events": "^2.6.0",
+        "bare-http-parser": "^1.0.0",
         "bare-stream": "^2.3.0",
-        "bare-tcp": "^2.0.3"
+        "bare-tcp": "^2.2.0"
       },
       "peerDependencies": {
         "bare-buffer": "*",
@@ -5688,20 +5586,20 @@
       }
     },
     "node_modules/bare-https": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/bare-https/-/bare-https-2.0.0.tgz",
-      "integrity": "sha512-qmjNZmYQ4nn+k3CLlxVyOqWYamdBPqE7psR5/lFWG39fskAR4C2h29d1Ka5BeWOGDAWhXImFIwZUxwCE/7xeLA==",
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/bare-https/-/bare-https-2.1.1.tgz",
+      "integrity": "sha512-1yamjW5TIPBoiwRDGVrTLhbsT8sWKTpDCGiNrJylVFUJD29rwhwrBud9KU/Xe1fWuVcefeRjKoyd2ztFVDv+Sw==",
       "license": "Apache-2.0",
       "dependencies": {
         "bare-http1": "^4.0.0",
-        "bare-tcp": "^2.0.0",
+        "bare-tcp": "^2.2.0",
         "bare-tls": "^2.0.0"
       }
     },
     "node_modules/bare-net": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/bare-net/-/bare-net-2.1.1.tgz",
-      "integrity": "sha512-r5f8pzsBE7oZ52Z+bRPaIJX9knfSKo2heT77reJk2U1X0Np1rPtlnexsH6z0jqSQZrZhetmm+Tt0iD+LnIv7DQ==",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/bare-net/-/bare-net-2.2.0.tgz",
+      "integrity": "sha512-UF7cAbHsGE+H6uEqWF5IULBow1x58chZz4g3ALgHtv7wZsFcCbRDt0JKWEumf5Oma3QWS1Q6aLi0Rpll8RElMg==",
       "license": "Apache-2.0",
       "dependencies": {
         "bare-events": "^2.2.2",
@@ -5711,9 +5609,9 @@
       }
     },
     "node_modules/bare-pipe": {
-      "version": "4.0.7",
-      "resolved": "https://registry.npmjs.org/bare-pipe/-/bare-pipe-4.0.7.tgz",
-      "integrity": "sha512-y8C6MWpr6EnzUJ1naE04VNTwM1AW3e6abkEDxgQkcTUVPPpHijxld1zpPT1RjWdPuA0TEc8UvEgMtWomnl5X9A==",
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/bare-pipe/-/bare-pipe-4.1.2.tgz",
+      "integrity": "sha512-btXtZLlABEDRp50cfLj9iweISqAJSNMCjeq5v0v9tBY2a7zSSqmfa2ZoE1ki2qxAvubagLUqw6VDifpsuI/qmg==",
       "license": "Apache-2.0",
       "dependencies": {
         "bare-events": "^2.0.0",
@@ -5745,9 +5643,9 @@
       }
     },
     "node_modules/bare-tcp": {
-      "version": "2.0.9",
-      "resolved": "https://registry.npmjs.org/bare-tcp/-/bare-tcp-2.0.9.tgz",
-      "integrity": "sha512-9pxbeUmAgoLitQJNe/gebVM3erWnDq2rvT07CCLUO/bgylbJbCQ8TqyUpnyDhjL2wOtOA5VhcGUkQ0djRGbSjg==",
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/bare-tcp/-/bare-tcp-2.2.2.tgz",
+      "integrity": "sha512-bYnw1AhzGlfLOD4nTceUXkhhgznZKvDuwjX1Au0VWaVitwqG40oaTvvhEQVCcK3FEwjRTiukUzHnAFsYXUI+3Q==",
       "license": "Apache-2.0",
       "dependencies": {
         "bare-dns": "^2.0.4",
@@ -5880,9 +5778,9 @@
       "license": "MIT"
     },
     "node_modules/bitcoin-address-parser": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/bitcoin-address-parser/-/bitcoin-address-parser-1.0.1.tgz",
-      "integrity": "sha512-4GVUL8qT8rZ0wJilBsxKpvhLaa2v3w2DyLIOgfoyQmmPyjWuRNY3JRcyVq4Z3VsNdYzmPOm/dFNPWraBXLyFBw==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/bitcoin-address-parser/-/bitcoin-address-parser-1.0.3.tgz",
+      "integrity": "sha512-zzXg9zj3/LVUCGz5e9oPPklKHsboLJw7/g86TjlHrDGBvWxpNhslxalKnIQX+TjPCBiZIQ2YOVme8srdqZlCCw==",
       "license": "Apache-2.0",
       "dependencies": {
         "base58-js": "^3.0.2",
@@ -6739,9 +6637,9 @@
       }
     },
     "node_modules/dayjs": {
-      "version": "1.11.18",
-      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.18.tgz",
-      "integrity": "sha512-zFBQ7WFRvVRhKcWoUh+ZA1g2HVgUbsZm9sbddh8EC5iv93sui8DVVz1Npvz+r6meo9VKfa8NyLWBsQK1VvIKPA==",
+      "version": "1.11.19",
+      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.19.tgz",
+      "integrity": "sha512-t5EcLVS6QPBNqM2z8fakk/NKel+Xzshgt8FFKAn+qwlD1pzZWxh0nVCrvFK7ZDb6XucZeF9z8C7CBWTRIVApAw==",
       "license": "MIT"
     },
     "node_modules/debug": {
@@ -6869,6 +6767,26 @@
         "minimalistic-assert": "^1.0.0"
       }
     },
+    "node_modules/detect-europe-js": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/detect-europe-js/-/detect-europe-js-0.1.2.tgz",
+      "integrity": "sha512-lgdERlL3u0aUdHocoouzT10d9I89VVhk0qNRmll7mXdGfJT1/wqZ2ZLA4oJAjeACPY5fT1wsbq2AT+GkuInsow==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/faisalman"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/ua-parser-js"
+        },
+        {
+          "type": "paypal",
+          "url": "https://paypal.me/faisalman"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/detect-libc": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz",
@@ -6949,23 +6867,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/eciesjs": {
-      "version": "0.4.16",
-      "resolved": "https://registry.npmjs.org/eciesjs/-/eciesjs-0.4.16.tgz",
-      "integrity": "sha512-dS5cbA9rA2VR4Ybuvhg6jvdmp46ubLn3E+px8cG/35aEDNclrqoCjg6mt0HYZ/M+OoESS3jSkCrqk1kWAEhWAw==",
-      "license": "MIT",
-      "dependencies": {
-        "@ecies/ciphers": "^0.2.4",
-        "@noble/ciphers": "^1.3.0",
-        "@noble/curves": "^1.9.7",
-        "@noble/hashes": "^1.8.0"
-      },
-      "engines": {
-        "bun": ">=1",
-        "deno": ">=2",
-        "node": ">=16"
-      }
-    },
     "node_modules/ecpair": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/ecpair/-/ecpair-3.0.0.tgz",
@@ -7961,9 +7862,9 @@
       "license": "ISC"
     },
     "node_modules/graphql": {
-      "version": "16.11.0",
-      "resolved": "https://registry.npmjs.org/graphql/-/graphql-16.11.0.tgz",
-      "integrity": "sha512-mS1lbMsxgQj6hge1XZ6p7GPhbrtFwUFYi3wRzXAC/FmYnyXMTvvI3td3rjmQ2u8ewXueaSvRPWaEcgVVOT9Jnw==",
+      "version": "16.12.0",
+      "resolved": "https://registry.npmjs.org/graphql/-/graphql-16.12.0.tgz",
+      "integrity": "sha512-DKKrynuQRne0PNpEbzuEdHlYOMksHSUI8Zc9Unei5gTsMNA2/vMpoMz/yKba50pejK56qj98qM0SjYxAKi13gQ==",
       "license": "MIT",
       "engines": {
         "node": "^12.22.0 || ^14.16.0 || ^16.0.0 || >=17.0.0"
@@ -8143,9 +8044,9 @@
       "license": "MIT"
     },
     "node_modules/i18next": {
-      "version": "25.3.0",
-      "resolved": "https://registry.npmjs.org/i18next/-/i18next-25.3.0.tgz",
-      "integrity": "sha512-ZSQIiNGfqSG6yoLHaCvrkPp16UejHI8PCDxFYaNG/1qxtmqNmqEg4JlWKlxkrUmrin2sEjsy+Mjy1TRozBhOgw==",
+      "version": "25.7.3",
+      "resolved": "https://registry.npmjs.org/i18next/-/i18next-25.7.3.tgz",
+      "integrity": "sha512-2XaT+HpYGuc2uTExq9TVRhLsso+Dxym6PWaKpn36wfBmTI779OQ7iP/XaZHzrnGyzU4SHpFrTYLKfVyBfAhVNA==",
       "funding": [
         {
           "type": "individual",
@@ -8161,9 +8062,8 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "dependencies": {
-        "@babel/runtime": "^7.27.6"
+        "@babel/runtime": "^7.28.4"
       },
       "peerDependencies": {
         "typescript": "^5"
@@ -8295,9 +8195,9 @@
       "license": "ISC"
     },
     "node_modules/ipaddr.js": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.2.0.tgz",
-      "integrity": "sha512-Ag3wB2o37wslZS19hZqorUnrnzSkpOVy+IiiDEiTqNubEYpYuHWIf6K4psgN2ZWKExS4xhVCrRVfb/wfW8fWJA==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.3.0.tgz",
+      "integrity": "sha512-Zv/pA+ciVFbCSBBjGfaKUya/CcGmUHzTydLMaTwrUUEM2DIEO3iZvueGxmacvmN50fGpGVKeTXpb2LcYQxeVdg==",
       "license": "MIT",
       "engines": {
         "node": ">= 10"
@@ -8661,6 +8561,26 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/is-standalone-pwa": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/is-standalone-pwa/-/is-standalone-pwa-0.1.1.tgz",
+      "integrity": "sha512-9Cbovsa52vNQCjdXOzeQq5CnCbAcRk05aU62K20WO372NrTv0NxibLFCK6lQ4/iZEFdEA3p3t2VNOn8AJ53F5g==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/faisalman"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/ua-parser-js"
+        },
+        {
+          "type": "paypal",
+          "url": "https://paypal.me/faisalman"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/is-stream": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz",
@@ -9419,9 +9339,9 @@
       "license": "MIT"
     },
     "node_modules/nice-grpc": {
-      "version": "2.1.13",
-      "resolved": "https://registry.npmjs.org/nice-grpc/-/nice-grpc-2.1.13.tgz",
-      "integrity": "sha512-IkXNok2NFyYh0WKp1aJFwFV3Ue2frBkJ16ojrmgX3Tc9n0g7r0VU+ur3H/leDHPPGsEeVozdMynGxYT30k3D/Q==",
+      "version": "2.1.14",
+      "resolved": "https://registry.npmjs.org/nice-grpc/-/nice-grpc-2.1.14.tgz",
+      "integrity": "sha512-GK9pKNxlvnU5FAdaw7i2FFuR9CqBspcE+if2tqnKXBcE0R8525wj4BZvfcwj7FjvqbssqKxRHt2nwedalbJlww==",
       "license": "MIT",
       "dependencies": {
         "@grpc/grpc-js": "^1.14.0",
@@ -9430,9 +9350,9 @@
       }
     },
     "node_modules/nice-grpc-client-middleware-retry": {
-      "version": "3.1.12",
-      "resolved": "https://registry.npmjs.org/nice-grpc-client-middleware-retry/-/nice-grpc-client-middleware-retry-3.1.12.tgz",
-      "integrity": "sha512-CHKIeHznAePOsT2dLeGwoOFaybQz6LvkIsFfN8SLcyGyTR7AB6vZMaECJjx+QPL8O2qVgaVE167PdeOmQrPuag==",
+      "version": "3.1.13",
+      "resolved": "https://registry.npmjs.org/nice-grpc-client-middleware-retry/-/nice-grpc-client-middleware-retry-3.1.13.tgz",
+      "integrity": "sha512-Q9I/wm5lYkDTveKFirrTHBkBY137yavXZ4xQDXTPIycUp7aLXD8xPTHFhqtAFWUw05aS91uffZZRgdv3HS0y/g==",
       "license": "MIT",
       "dependencies": {
         "abort-controller-x": "^0.4.0",
@@ -9449,9 +9369,9 @@
       }
     },
     "node_modules/nice-grpc-opentelemetry": {
-      "version": "0.1.19",
-      "resolved": "https://registry.npmjs.org/nice-grpc-opentelemetry/-/nice-grpc-opentelemetry-0.1.19.tgz",
-      "integrity": "sha512-rjYVFbmSTE/g3XtxIh37PgEtE1ZOcwFoSHeLBCMRz9GAeGwZd23020QObgElF2UgU6kn1wpH8taWdprNr+3wfg==",
+      "version": "0.1.20",
+      "resolved": "https://registry.npmjs.org/nice-grpc-opentelemetry/-/nice-grpc-opentelemetry-0.1.20.tgz",
+      "integrity": "sha512-dRH6lmm8OgqY21WRo9BP6cHHqIhbG5UT/INFne0qIDSlSseYc6s1+qNTE3Up0z/4zY50V8tVTOH30yyhkwNXTw==",
       "license": "MIT",
       "dependencies": {
         "@opentelemetry/api": "^1.8.0",
@@ -9462,9 +9382,9 @@
       }
     },
     "node_modules/nice-grpc-web": {
-      "version": "3.3.8",
-      "resolved": "https://registry.npmjs.org/nice-grpc-web/-/nice-grpc-web-3.3.8.tgz",
-      "integrity": "sha512-VOVzjcgl90lhoZgjXDg9hG8clIxe6NBk84R3p0P21CGitMesHMTV8g5adnDKQ4i60FJT1uk2EwepSyv1cND8JQ==",
+      "version": "3.3.9",
+      "resolved": "https://registry.npmjs.org/nice-grpc-web/-/nice-grpc-web-3.3.9.tgz",
+      "integrity": "sha512-CiCQLdLTux9D4try8XlHW9tHIP/uLB+aciNKErDNLUM6kzhPFaVh8q+oTkoVGOjxOacEzlOwQRRjwQETAx5lVw==",
       "license": "MIT",
       "dependencies": {
         "abort-controller-x": "^0.4.0",
@@ -9474,9 +9394,9 @@
       }
     },
     "node_modules/nice-grpc/node_modules/@grpc/grpc-js": {
-      "version": "1.14.0",
-      "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.14.0.tgz",
-      "integrity": "sha512-N8Jx6PaYzcTRNzirReJCtADVoq4z7+1KQ4E70jTg/koQiMoUSN1kbNjPOqpPbhMFhfU1/l7ixspPl8dNY+FoUg==",
+      "version": "1.14.3",
+      "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.14.3.tgz",
+      "integrity": "sha512-Iq8QQQ/7X3Sac15oB6p0FmUg/klxQvXLeileoqrTRGJYLV+/9tubbr9ipz0GKHjmXVsgFPo/+W+2cA8eNcR+XA==",
       "license": "Apache-2.0",
       "dependencies": {
         "@grpc/proto-loader": "^0.8.0",
@@ -11800,9 +11720,9 @@
       }
     },
     "node_modules/ts-proto": {
-      "version": "2.7.7",
-      "resolved": "https://registry.npmjs.org/ts-proto/-/ts-proto-2.7.7.tgz",
-      "integrity": "sha512-/OfN9/Yriji2bbpOysZ/Jzc96isOKz+eBTJEcKaIZ0PR6x1TNgVm4Lz0zfbo+J0jwFO7fJjJyssefBPQ0o1V9A==",
+      "version": "2.8.3",
+      "resolved": "https://registry.npmjs.org/ts-proto/-/ts-proto-2.8.3.tgz",
+      "integrity": "sha512-TdXInqG+61pj/TvORqITWjvjTTsL1EZxwX49iEj89+xFAcqPT8tjChpAGQXzfcF4MJwvNiuoCEbBOKqVf3ds3g==",
       "license": "ISC",
       "dependencies": {
         "@bufbuild/protobuf": "^2.0.0",
@@ -11932,6 +11852,57 @@
       "integrity": "sha512-7uc1O8h1M1g0rArakJdf0uLRSSgFcYexrVoKo+bzJd32gd4gDy2L/Z+8/FjPnU9ydY3pEnVPtr9FyscYY60K1g==",
       "license": "MIT"
     },
+    "node_modules/ua-is-frozen": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/ua-is-frozen/-/ua-is-frozen-0.1.2.tgz",
+      "integrity": "sha512-RwKDW2p3iyWn4UbaxpP2+VxwqXh0jpvdxsYpZ5j/MLLiQOfbsV5shpgQiw93+KMYQPcteeMQ289MaAFzs3G9pw==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/faisalman"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/ua-parser-js"
+        },
+        {
+          "type": "paypal",
+          "url": "https://paypal.me/faisalman"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/ua-parser-js": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-2.0.7.tgz",
+      "integrity": "sha512-CFdHVHr+6YfbktNZegH3qbYvYgC7nRNEUm2tk7nSFXSODUu4tDBpaFpP1jdXBUOKKwapVlWRfTtS8bCPzsQ47w==",
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/ua-parser-js"
+        },
+        {
+          "type": "paypal",
+          "url": "https://paypal.me/faisalman"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/faisalman"
+        }
+      ],
+      "license": "AGPL-3.0-or-later",
+      "dependencies": {
+        "detect-europe-js": "^0.1.2",
+        "is-standalone-pwa": "^0.1.1",
+        "ua-is-frozen": "^0.1.2"
+      },
+      "bin": {
+        "ua-parser-js": "script/cli.js"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/uint8array-tools": {
       "version": "0.0.8",
       "resolved": "https://registry.npmjs.org/uint8array-tools/-/uint8array-tools-0.0.8.tgz",
@@ -12167,9 +12138,9 @@
       }
     },
     "node_modules/uuidv7": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/uuidv7/-/uuidv7-1.0.2.tgz",
-      "integrity": "sha512-8JQkH4ooXnm1JCIhqTMbtmdnYEn6oKukBxHn1Ic9878jMkL7daTI7anTExfY18VRCX7tcdn5quzvCb6EWrR8PA==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/uuidv7/-/uuidv7-1.1.0.tgz",
+      "integrity": "sha512-2VNnOC0+XQlwogChUDzy6pe8GQEys9QFZBGOh54l6qVfwoCUwwRvk7rDTgaIsRgsF5GFa5oiNg8LqXE3jofBBg==",
       "license": "Apache-2.0",
       "bin": {
         "uuidv7": "cli.js"
diff --git a/package.json b/package.json
index 61da2e2..240534e 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "blitz-web-app",
   "private": true,
-  "version": "0.1.3",
+  "version": "0.1.4",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -15,7 +15,7 @@
   "dependencies": {
     "@bitcoinerlab/secp256k1": "^1.2.0",
     "@breeztech/breez-sdk-liquid": "^0.11.2",
-    "@buildonspark/spark-sdk": "^0.4.3",
+    "@buildonspark/spark-sdk": "^0.5.2",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
     "@mui/icons-material": "^7.1.1",
@@ -27,7 +27,7 @@
     "@vulpemventures/secp256k1-zkp": "^3.2.1",
     "bech32": "^2.0.0",
     "bip21": "^3.0.0",
-    "bitcoin-address-parser": "^1.0.1",
+    "bitcoin-address-parser": "^1.0.3",
     "bitcoinjs-lib": "^6.1.7",
     "bolt11": "^1.4.1",
     "boltz-core": "^3.0.0",
@@ -37,6 +37,7 @@
     "events": "^3.3.0",
     "firebase": "^11.9.0",
     "framer-motion": "^12.10.0",
+    "i18next": "^25.7.3",
     "idb": "^8.0.3",
     "intl-pluralrules": "^2.0.1",
     "js-sha256": "^0.11.1",
diff --git a/src/assets/fonts/Blitzicons1.ttf b/src/assets/fonts/Blitzicons1.ttf
new file mode 100644
index 0000000..848ce09
Binary files /dev/null and b/src/assets/fonts/Blitzicons1.ttf differ
diff --git a/src/assets/icons/BTCMap.png b/src/assets/icons/BTCMap.png
deleted file mode 100644
index 61c7561..0000000
Binary files a/src/assets/icons/BTCMap.png and /dev/null differ
diff --git a/src/assets/icons/SparkAsteriskBlack.png b/src/assets/icons/SparkAsteriskBlack.png
deleted file mode 100644
index 9a58d9f..0000000
Binary files a/src/assets/icons/SparkAsteriskBlack.png and /dev/null differ
diff --git a/src/assets/icons/aboutIcon.png b/src/assets/icons/aboutIcon.png
deleted file mode 100644
index d55705b..0000000
Binary files a/src/assets/icons/aboutIcon.png and /dev/null differ
diff --git a/src/assets/icons/aboutIconWhite.png b/src/assets/icons/aboutIconWhite.png
deleted file mode 100644
index 7d3a3dc..0000000
Binary files a/src/assets/icons/aboutIconWhite.png and /dev/null differ
diff --git a/src/assets/icons/adminHomeWallet.png b/src/assets/icons/adminHomeWallet.png
deleted file mode 100644
index 9059cd3..0000000
Binary files a/src/assets/icons/adminHomeWallet.png and /dev/null differ
diff --git a/src/assets/icons/adminHomeWallet_dark.png b/src/assets/icons/adminHomeWallet_dark.png
deleted file mode 100644
index a9ae67a..0000000
Binary files a/src/assets/icons/adminHomeWallet_dark.png and /dev/null differ
diff --git a/src/assets/icons/adminHomeWallet_white.png b/src/assets/icons/adminHomeWallet_white.png
deleted file mode 100644
index 344a09b..0000000
Binary files a/src/assets/icons/adminHomeWallet_white.png and /dev/null differ
diff --git a/src/assets/icons/appStore.png b/src/assets/icons/appStore.png
deleted file mode 100644
index f1d3a7e..0000000
Binary files a/src/assets/icons/appStore.png and /dev/null differ
diff --git a/src/assets/icons/appStoreFilled.png b/src/assets/icons/appStoreFilled.png
deleted file mode 100644
index e6e076b..0000000
Binary files a/src/assets/icons/appStoreFilled.png and /dev/null differ
diff --git a/src/assets/icons/appStoreFilled_white.png b/src/assets/icons/appStoreFilled_white.png
deleted file mode 100644
index 20ac022..0000000
Binary files a/src/assets/icons/appStoreFilled_white.png and /dev/null differ
diff --git a/src/assets/icons/appStore_white.png b/src/assets/icons/appStore_white.png
deleted file mode 100644
index 6f3f03a..0000000
Binary files a/src/assets/icons/appStore_white.png and /dev/null differ
diff --git a/src/assets/icons/arrow-from-shape-right-white.png b/src/assets/icons/arrow-from-shape-right-white.png
deleted file mode 100644
index d572d11..0000000
Binary files a/src/assets/icons/arrow-from-shape-right-white.png and /dev/null differ
diff --git a/src/assets/icons/arrow-from-shape-right.png b/src/assets/icons/arrow-from-shape-right.png
deleted file mode 100644
index 2de08cd..0000000
Binary files a/src/assets/icons/arrow-from-shape-right.png and /dev/null differ
diff --git a/src/assets/icons/arrow-small-left-white.png b/src/assets/icons/arrow-small-left-white.png
deleted file mode 100644
index 88fad4d..0000000
Binary files a/src/assets/icons/arrow-small-left-white.png and /dev/null differ
diff --git a/src/assets/icons/arrow-small-left.png b/src/assets/icons/arrow-small-left.png
deleted file mode 100644
index f1705ba..0000000
Binary files a/src/assets/icons/arrow-small-left.png and /dev/null differ
diff --git a/src/assets/icons/arrow-to-shape-right-light.png b/src/assets/icons/arrow-to-shape-right-light.png
deleted file mode 100644
index d9cebcd..0000000
Binary files a/src/assets/icons/arrow-to-shape-right-light.png and /dev/null differ
diff --git a/src/assets/icons/arrow-to-shape-right.png b/src/assets/icons/arrow-to-shape-right.png
deleted file mode 100644
index 4b446b5..0000000
Binary files a/src/assets/icons/arrow-to-shape-right.png and /dev/null differ
diff --git a/src/assets/icons/bell.png b/src/assets/icons/bell.png
deleted file mode 100644
index b0803a8..0000000
Binary files a/src/assets/icons/bell.png and /dev/null differ
diff --git a/src/assets/icons/bellWhite.png b/src/assets/icons/bellWhite.png
deleted file mode 100644
index 2025171..0000000
Binary files a/src/assets/icons/bellWhite.png and /dev/null differ
diff --git a/src/assets/icons/blockstreamLiquidBlue.png b/src/assets/icons/blockstreamLiquidBlue.png
deleted file mode 100644
index 81890fb..0000000
Binary files a/src/assets/icons/blockstreamLiquidBlue.png and /dev/null differ
diff --git a/src/assets/icons/cart.png b/src/assets/icons/cart.png
deleted file mode 100644
index 260863a..0000000
Binary files a/src/assets/icons/cart.png and /dev/null differ
diff --git a/src/assets/icons/check.png b/src/assets/icons/check.png
deleted file mode 100644
index 1b763d3..0000000
Binary files a/src/assets/icons/check.png and /dev/null differ
diff --git a/src/assets/icons/check.svg b/src/assets/icons/check.svg
deleted file mode 100644
index 9610907..0000000
--- a/src/assets/icons/check.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
-<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M4 12.6111L8.92308 17.5L20 6.5" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
\ No newline at end of file
diff --git a/src/assets/icons/checkMark.png b/src/assets/icons/checkMark.png
deleted file mode 100644
index 840eabf..0000000
Binary files a/src/assets/icons/checkMark.png and /dev/null differ
diff --git a/src/assets/icons/checkWhite.png b/src/assets/icons/checkWhite.png
deleted file mode 100644
index 4e7b57c..0000000
Binary files a/src/assets/icons/checkWhite.png and /dev/null differ
diff --git a/src/assets/icons/clipboardBlue.png b/src/assets/icons/clipboardBlue.png
deleted file mode 100644
index 280c27c..0000000
Binary files a/src/assets/icons/clipboardBlue.png and /dev/null differ
diff --git a/src/assets/icons/clipboardDark.png b/src/assets/icons/clipboardDark.png
deleted file mode 100644
index 8f3c393..0000000
Binary files a/src/assets/icons/clipboardDark.png and /dev/null differ
diff --git a/src/assets/icons/clipboardLight.png b/src/assets/icons/clipboardLight.png
deleted file mode 100644
index 1526ed0..0000000
Binary files a/src/assets/icons/clipboardLight.png and /dev/null differ
diff --git a/src/assets/icons/colorIcon.png b/src/assets/icons/colorIcon.png
deleted file mode 100644
index 11f7b9a..0000000
Binary files a/src/assets/icons/colorIcon.png and /dev/null differ
diff --git a/src/assets/icons/colorIconWhite.png b/src/assets/icons/colorIconWhite.png
deleted file mode 100644
index 0c3a92c..0000000
Binary files a/src/assets/icons/colorIconWhite.png and /dev/null differ
diff --git a/src/assets/icons/contacts.png b/src/assets/icons/contacts.png
deleted file mode 100644
index 0dad2af..0000000
Binary files a/src/assets/icons/contacts.png and /dev/null differ
diff --git a/src/assets/icons/contactsIcon.png b/src/assets/icons/contactsIcon.png
deleted file mode 100644
index 4054d7a..0000000
Binary files a/src/assets/icons/contactsIcon.png and /dev/null differ
diff --git a/src/assets/icons/contactsIconBlue.png b/src/assets/icons/contactsIconBlue.png
deleted file mode 100644
index d4a730e..0000000
Binary files a/src/assets/icons/contactsIconBlue.png and /dev/null differ
diff --git a/src/assets/icons/contactsIconLight.png b/src/assets/icons/contactsIconLight.png
deleted file mode 100644
index 77f824b..0000000
Binary files a/src/assets/icons/contactsIconLight.png and /dev/null differ
diff --git a/src/assets/icons/contactsIconSelected.png b/src/assets/icons/contactsIconSelected.png
deleted file mode 100644
index e3a210c..0000000
Binary files a/src/assets/icons/contactsIconSelected.png and /dev/null differ
diff --git a/src/assets/icons/contactsIconSelectedWhite.png b/src/assets/icons/contactsIconSelectedWhite.png
deleted file mode 100644
index b6a10a3..0000000
Binary files a/src/assets/icons/contactsIconSelectedWhite.png and /dev/null differ
diff --git a/src/assets/icons/contactsIconWhite.png b/src/assets/icons/contactsIconWhite.png
deleted file mode 100644
index b659c41..0000000
Binary files a/src/assets/icons/contactsIconWhite.png and /dev/null differ
diff --git a/src/assets/icons/contactsSelected.png b/src/assets/icons/contactsSelected.png
deleted file mode 100644
index d52081a..0000000
Binary files a/src/assets/icons/contactsSelected.png and /dev/null differ
diff --git a/src/assets/icons/currencyIcon.png b/src/assets/icons/currencyIcon.png
deleted file mode 100644
index 2e1984e..0000000
Binary files a/src/assets/icons/currencyIcon.png and /dev/null differ
diff --git a/src/assets/icons/currencyIconWhite.png b/src/assets/icons/currencyIconWhite.png
deleted file mode 100644
index 3df1bda..0000000
Binary files a/src/assets/icons/currencyIconWhite.png and /dev/null differ
diff --git a/src/assets/icons/darkMode.png b/src/assets/icons/darkMode.png
deleted file mode 100644
index 28a3f1b..0000000
Binary files a/src/assets/icons/darkMode.png and /dev/null differ
diff --git a/src/assets/icons/dotDark.png b/src/assets/icons/dotDark.png
deleted file mode 100644
index 764ea55..0000000
Binary files a/src/assets/icons/dotDark.png and /dev/null differ
diff --git a/src/assets/icons/dotLight.png b/src/assets/icons/dotLight.png
deleted file mode 100644
index 46bb2e3..0000000
Binary files a/src/assets/icons/dotLight.png and /dev/null differ
diff --git a/src/assets/icons/drawerList.png b/src/assets/icons/drawerList.png
deleted file mode 100644
index 46caa4c..0000000
Binary files a/src/assets/icons/drawerList.png and /dev/null differ
diff --git a/src/assets/icons/drawerListWhite.png b/src/assets/icons/drawerListWhite.png
deleted file mode 100644
index 8608ec9..0000000
Binary files a/src/assets/icons/drawerListWhite.png and /dev/null differ
diff --git a/src/assets/icons/edit.png b/src/assets/icons/edit.png
deleted file mode 100644
index 06c32f6..0000000
Binary files a/src/assets/icons/edit.png and /dev/null differ
diff --git a/src/assets/icons/editLight.png b/src/assets/icons/editLight.png
deleted file mode 100644
index 1baf196..0000000
Binary files a/src/assets/icons/editLight.png and /dev/null differ
diff --git a/src/assets/icons/exchangeIcon.png b/src/assets/icons/exchangeIcon.png
deleted file mode 100644
index aa3ef1d..0000000
Binary files a/src/assets/icons/exchangeIcon.png and /dev/null differ
diff --git a/src/assets/icons/exchangeIconWhite.png b/src/assets/icons/exchangeIconWhite.png
deleted file mode 100644
index e228d60..0000000
Binary files a/src/assets/icons/exchangeIconWhite.png and /dev/null differ
diff --git a/src/assets/icons/faceIDIcon.png b/src/assets/icons/faceIDIcon.png
deleted file mode 100644
index cb88cac..0000000
Binary files a/src/assets/icons/faceIDIcon.png and /dev/null differ
diff --git a/src/assets/icons/faceIDIconWhite.png b/src/assets/icons/faceIDIconWhite.png
deleted file mode 100644
index bb87260..0000000
Binary files a/src/assets/icons/faceIDIconWhite.png and /dev/null differ
diff --git a/src/assets/icons/failedTransaction.png b/src/assets/icons/failedTransaction.png
deleted file mode 100644
index abe0a0d..0000000
Binary files a/src/assets/icons/failedTransaction.png and /dev/null differ
diff --git a/src/assets/icons/failedTransactionWhite.png b/src/assets/icons/failedTransactionWhite.png
deleted file mode 100644
index bd1e393..0000000
Binary files a/src/assets/icons/failedTransactionWhite.png and /dev/null differ
diff --git a/src/assets/icons/flashlight.png b/src/assets/icons/flashlight.png
deleted file mode 100644
index 137172d..0000000
Binary files a/src/assets/icons/flashlight.png and /dev/null differ
diff --git a/src/assets/icons/flashlightBlue.png b/src/assets/icons/flashlightBlue.png
deleted file mode 100644
index 13aa0d2..0000000
Binary files a/src/assets/icons/flashlightBlue.png and /dev/null differ
diff --git a/src/assets/icons/flashlightNoFill.png b/src/assets/icons/flashlightNoFill.png
deleted file mode 100644
index 8d50e2f..0000000
Binary files a/src/assets/icons/flashlightNoFill.png and /dev/null differ
diff --git a/src/assets/icons/flashlightNoFillWhite.png b/src/assets/icons/flashlightNoFillWhite.png
deleted file mode 100644
index fb2255c..0000000
Binary files a/src/assets/icons/flashlightNoFillWhite.png and /dev/null differ
diff --git a/src/assets/icons/github.png b/src/assets/icons/github.png
deleted file mode 100644
index 132c186..0000000
Binary files a/src/assets/icons/github.png and /dev/null differ
diff --git a/src/assets/icons/githubWhite.png b/src/assets/icons/githubWhite.png
deleted file mode 100644
index 0507b83..0000000
Binary files a/src/assets/icons/githubWhite.png and /dev/null differ
diff --git a/src/assets/icons/group.png b/src/assets/icons/group.png
deleted file mode 100644
index 83ead21..0000000
Binary files a/src/assets/icons/group.png and /dev/null differ
diff --git a/src/assets/icons/groupWhite.png b/src/assets/icons/groupWhite.png
deleted file mode 100644
index 070d3c4..0000000
Binary files a/src/assets/icons/groupWhite.png and /dev/null differ
diff --git a/src/assets/icons/home.png b/src/assets/icons/home.png
deleted file mode 100644
index 1b5860a..0000000
Binary files a/src/assets/icons/home.png and /dev/null differ
diff --git a/src/assets/icons/images.png b/src/assets/icons/images.png
deleted file mode 100644
index 1c73bbc..0000000
Binary files a/src/assets/icons/images.png and /dev/null differ
diff --git a/src/assets/icons/imagesBlue.png b/src/assets/icons/imagesBlue.png
deleted file mode 100644
index 1f0a0d6..0000000
Binary files a/src/assets/icons/imagesBlue.png and /dev/null differ
diff --git a/src/assets/icons/imagesDark.png b/src/assets/icons/imagesDark.png
deleted file mode 100644
index d6fbd31..0000000
Binary files a/src/assets/icons/imagesDark.png and /dev/null differ
diff --git a/src/assets/icons/keyIcon.png b/src/assets/icons/keyIcon.png
deleted file mode 100644
index 881d3ce..0000000
Binary files a/src/assets/icons/keyIcon.png and /dev/null differ
diff --git a/src/assets/icons/keyIconWhite.png b/src/assets/icons/keyIconWhite.png
deleted file mode 100644
index ea12ef2..0000000
Binary files a/src/assets/icons/keyIconWhite.png and /dev/null differ
diff --git a/src/assets/icons/left-chevron-white.png b/src/assets/icons/left-chevron-white.png
deleted file mode 100644
index 3e4021d..0000000
Binary files a/src/assets/icons/left-chevron-white.png and /dev/null differ
diff --git a/src/assets/icons/left-chevron.png b/src/assets/icons/left-chevron.png
deleted file mode 100644
index dac4a1b..0000000
Binary files a/src/assets/icons/left-chevron.png and /dev/null differ
diff --git a/src/assets/icons/leftCheveronDark.png b/src/assets/icons/leftCheveronDark.png
deleted file mode 100644
index 3177117..0000000
Binary files a/src/assets/icons/leftCheveronDark.png and /dev/null differ
diff --git a/src/assets/icons/leftCheveronLight.png b/src/assets/icons/leftCheveronLight.png
deleted file mode 100644
index 9eb3f8f..0000000
Binary files a/src/assets/icons/leftCheveronLight.png and /dev/null differ
diff --git a/src/assets/icons/lightMode.png b/src/assets/icons/lightMode.png
deleted file mode 100644
index e8e1227..0000000
Binary files a/src/assets/icons/lightMode.png and /dev/null differ
diff --git a/src/assets/icons/lightModeWhite.png b/src/assets/icons/lightModeWhite.png
deleted file mode 100644
index 2c2aff6..0000000
Binary files a/src/assets/icons/lightModeWhite.png and /dev/null differ
diff --git a/src/assets/icons/liquidIcon.png b/src/assets/icons/liquidIcon.png
deleted file mode 100644
index ea952f4..0000000
Binary files a/src/assets/icons/liquidIcon.png and /dev/null differ
diff --git a/src/assets/icons/liquidIconWhite.png b/src/assets/icons/liquidIconWhite.png
deleted file mode 100644
index 7eb34b9..0000000
Binary files a/src/assets/icons/liquidIconWhite.png and /dev/null differ
diff --git a/src/assets/icons/liquidLight.png b/src/assets/icons/liquidLight.png
deleted file mode 100644
index 7b7d57e..0000000
Binary files a/src/assets/icons/liquidLight.png and /dev/null differ
diff --git a/src/assets/icons/liquidReceiveIcon.png b/src/assets/icons/liquidReceiveIcon.png
deleted file mode 100644
index 75f1e42..0000000
Binary files a/src/assets/icons/liquidReceiveIcon.png and /dev/null differ
diff --git a/src/assets/icons/messages-dark.png b/src/assets/icons/messages-dark.png
deleted file mode 100644
index 45c7e1e..0000000
Binary files a/src/assets/icons/messages-dark.png and /dev/null differ
diff --git a/src/assets/icons/messages-light.png b/src/assets/icons/messages-light.png
deleted file mode 100644
index f4da7ba..0000000
Binary files a/src/assets/icons/messages-light.png and /dev/null differ
diff --git a/src/assets/icons/minus.png b/src/assets/icons/minus.png
deleted file mode 100644
index 11aa102..0000000
Binary files a/src/assets/icons/minus.png and /dev/null differ
diff --git a/src/assets/icons/navigation.png b/src/assets/icons/navigation.png
deleted file mode 100644
index 2963692..0000000
Binary files a/src/assets/icons/navigation.png and /dev/null differ
diff --git a/src/assets/icons/navigation_fill.png b/src/assets/icons/navigation_fill.png
deleted file mode 100644
index 8d8cb0c..0000000
Binary files a/src/assets/icons/navigation_fill.png and /dev/null differ
diff --git a/src/assets/icons/navigation_fill_white.png b/src/assets/icons/navigation_fill_white.png
deleted file mode 100644
index 586eacf..0000000
Binary files a/src/assets/icons/navigation_fill_white.png and /dev/null differ
diff --git a/src/assets/icons/navigation_white.png b/src/assets/icons/navigation_white.png
deleted file mode 100644
index 8395982..0000000
Binary files a/src/assets/icons/navigation_white.png and /dev/null differ
diff --git a/src/assets/icons/nodeIcon.png b/src/assets/icons/nodeIcon.png
deleted file mode 100644
index a403da5..0000000
Binary files a/src/assets/icons/nodeIcon.png and /dev/null differ
diff --git a/src/assets/icons/nodeIconWhite.png b/src/assets/icons/nodeIconWhite.png
deleted file mode 100644
index 2942468..0000000
Binary files a/src/assets/icons/nodeIconWhite.png and /dev/null differ
diff --git a/src/assets/icons/notificationsIcon.png b/src/assets/icons/notificationsIcon.png
deleted file mode 100644
index 4116431..0000000
Binary files a/src/assets/icons/notificationsIcon.png and /dev/null differ
diff --git a/src/assets/icons/pendingTx.png b/src/assets/icons/pendingTx.png
deleted file mode 100644
index 30121d4..0000000
Binary files a/src/assets/icons/pendingTx.png and /dev/null differ
diff --git a/src/assets/icons/plus.png b/src/assets/icons/plus.png
deleted file mode 100644
index 8cfc527..0000000
Binary files a/src/assets/icons/plus.png and /dev/null differ
diff --git a/src/assets/icons/posDark.png b/src/assets/icons/posDark.png
deleted file mode 100644
index bd27549..0000000
Binary files a/src/assets/icons/posDark.png and /dev/null differ
diff --git a/src/assets/icons/posLight.png b/src/assets/icons/posLight.png
deleted file mode 100644
index ea59d78..0000000
Binary files a/src/assets/icons/posLight.png and /dev/null differ
diff --git a/src/assets/icons/qrCodeDark.png b/src/assets/icons/qrCodeDark.png
deleted file mode 100644
index dc9eba9..0000000
Binary files a/src/assets/icons/qrCodeDark.png and /dev/null differ
diff --git a/src/assets/icons/qrCodeLight.png b/src/assets/icons/qrCodeLight.png
deleted file mode 100644
index f60833d..0000000
Binary files a/src/assets/icons/qrCodeLight.png and /dev/null differ
diff --git a/src/assets/icons/receipt.png b/src/assets/icons/receipt.png
deleted file mode 100644
index 5a85cac..0000000
Binary files a/src/assets/icons/receipt.png and /dev/null differ
diff --git a/src/assets/icons/receiptWhite.png b/src/assets/icons/receiptWhite.png
deleted file mode 100644
index e27eb0a..0000000
Binary files a/src/assets/icons/receiptWhite.png and /dev/null differ
diff --git a/src/assets/icons/refresh.png b/src/assets/icons/refresh.png
deleted file mode 100644
index e50a834..0000000
Binary files a/src/assets/icons/refresh.png and /dev/null differ
diff --git a/src/assets/icons/refreshWhite.png b/src/assets/icons/refreshWhite.png
deleted file mode 100644
index d2d89f3..0000000
Binary files a/src/assets/icons/refreshWhite.png and /dev/null differ
diff --git a/src/assets/icons/restaurantDark.png b/src/assets/icons/restaurantDark.png
deleted file mode 100644
index ca8be28..0000000
Binary files a/src/assets/icons/restaurantDark.png and /dev/null differ
diff --git a/src/assets/icons/restaurantLight.png b/src/assets/icons/restaurantLight.png
deleted file mode 100644
index 9500c3c..0000000
Binary files a/src/assets/icons/restaurantLight.png and /dev/null differ
diff --git a/src/assets/icons/rootstockLogoBlue.png b/src/assets/icons/rootstockLogoBlue.png
deleted file mode 100644
index 43967a4..0000000
Binary files a/src/assets/icons/rootstockLogoBlue.png and /dev/null differ
diff --git a/src/assets/icons/scanQRCodeBlue.png b/src/assets/icons/scanQRCodeBlue.png
deleted file mode 100644
index ff1c8a7..0000000
Binary files a/src/assets/icons/scanQRCodeBlue.png and /dev/null differ
diff --git a/src/assets/icons/scanQRCodeDark.png b/src/assets/icons/scanQRCodeDark.png
deleted file mode 100644
index 045e8ef..0000000
Binary files a/src/assets/icons/scanQRCodeDark.png and /dev/null differ
diff --git a/src/assets/icons/scanQRCodeLight.png b/src/assets/icons/scanQRCodeLight.png
deleted file mode 100644
index 3d960ad..0000000
Binary files a/src/assets/icons/scanQRCodeLight.png and /dev/null differ
diff --git a/src/assets/icons/settings.png b/src/assets/icons/settings.png
deleted file mode 100644
index 12c06a1..0000000
Binary files a/src/assets/icons/settings.png and /dev/null differ
diff --git a/src/assets/icons/settingsBitcoinIcon.png b/src/assets/icons/settingsBitcoinIcon.png
deleted file mode 100644
index 7760b9d..0000000
Binary files a/src/assets/icons/settingsBitcoinIcon.png and /dev/null differ
diff --git a/src/assets/icons/settingsBitcoinIconWhite.png b/src/assets/icons/settingsBitcoinIconWhite.png
deleted file mode 100644
index 1472bc1..0000000
Binary files a/src/assets/icons/settingsBitcoinIconWhite.png and /dev/null differ
diff --git a/src/assets/icons/settingsWhite.png b/src/assets/icons/settingsWhite.png
deleted file mode 100644
index ece5055..0000000
Binary files a/src/assets/icons/settingsWhite.png and /dev/null differ
diff --git a/src/assets/icons/share.png b/src/assets/icons/share.png
deleted file mode 100644
index 9b3214d..0000000
Binary files a/src/assets/icons/share.png and /dev/null differ
diff --git a/src/assets/icons/shareBlack.png b/src/assets/icons/shareBlack.png
deleted file mode 100644
index 11e5a06..0000000
Binary files a/src/assets/icons/shareBlack.png and /dev/null differ
diff --git a/src/assets/icons/shareWhite.png b/src/assets/icons/shareWhite.png
deleted file mode 100644
index 4e4bd49..0000000
Binary files a/src/assets/icons/shareWhite.png and /dev/null differ
diff --git a/src/assets/icons/sharedBlue.png b/src/assets/icons/sharedBlue.png
deleted file mode 100644
index 5f2f40d..0000000
Binary files a/src/assets/icons/sharedBlue.png and /dev/null differ
diff --git a/src/assets/icons/sharedWhite.png b/src/assets/icons/sharedWhite.png
deleted file mode 100644
index cfc1c9e..0000000
Binary files a/src/assets/icons/sharedWhite.png and /dev/null differ
diff --git a/src/assets/icons/sparkReceiveIcon.png b/src/assets/icons/sparkReceiveIcon.png
deleted file mode 100644
index 3870cd2..0000000
Binary files a/src/assets/icons/sparkReceiveIcon.png and /dev/null differ
diff --git a/src/assets/icons/starBlack.png b/src/assets/icons/starBlack.png
deleted file mode 100644
index 1fbda78..0000000
Binary files a/src/assets/icons/starBlack.png and /dev/null differ
diff --git a/src/assets/icons/starBlue.png b/src/assets/icons/starBlue.png
deleted file mode 100644
index 9a9983d..0000000
Binary files a/src/assets/icons/starBlue.png and /dev/null differ
diff --git a/src/assets/icons/starWhite.png b/src/assets/icons/starWhite.png
deleted file mode 100644
index 4349339..0000000
Binary files a/src/assets/icons/starWhite.png and /dev/null differ
diff --git a/src/assets/icons/telegram.png b/src/assets/icons/telegram.png
deleted file mode 100644
index b606120..0000000
Binary files a/src/assets/icons/telegram.png and /dev/null differ
diff --git a/src/assets/icons/telegramWhite.png b/src/assets/icons/telegramWhite.png
deleted file mode 100644
index 4994e83..0000000
Binary files a/src/assets/icons/telegramWhite.png and /dev/null differ
diff --git a/src/assets/icons/trashIcon.png b/src/assets/icons/trashIcon.png
deleted file mode 100644
index 0399fec..0000000
Binary files a/src/assets/icons/trashIcon.png and /dev/null differ
diff --git a/src/assets/icons/trashIconWhite.png b/src/assets/icons/trashIconWhite.png
deleted file mode 100644
index a9bac4c..0000000
Binary files a/src/assets/icons/trashIconWhite.png and /dev/null differ
diff --git a/src/assets/icons/twitter.png b/src/assets/icons/twitter.png
deleted file mode 100644
index 8dc3c4e..0000000
Binary files a/src/assets/icons/twitter.png and /dev/null differ
diff --git a/src/assets/icons/twitterWhite.png b/src/assets/icons/twitterWhite.png
deleted file mode 100644
index 6d44301..0000000
Binary files a/src/assets/icons/twitterWhite.png and /dev/null differ
diff --git a/src/assets/icons/user_white.png b/src/assets/icons/user_white.png
deleted file mode 100644
index 36805a1..0000000
Binary files a/src/assets/icons/user_white.png and /dev/null differ
diff --git a/src/assets/icons/wallet.png b/src/assets/icons/wallet.png
deleted file mode 100644
index ca593a7..0000000
Binary files a/src/assets/icons/wallet.png and /dev/null differ
diff --git a/src/assets/icons/wallet_blue.png b/src/assets/icons/wallet_blue.png
deleted file mode 100644
index 371249f..0000000
Binary files a/src/assets/icons/wallet_blue.png and /dev/null differ
diff --git a/src/assets/icons/wallet_white.png b/src/assets/icons/wallet_white.png
deleted file mode 100644
index 197984c..0000000
Binary files a/src/assets/icons/wallet_white.png and /dev/null differ
diff --git a/src/assets/icons/x-small-black.png b/src/assets/icons/x-small-black.png
deleted file mode 100644
index 73d414d..0000000
Binary files a/src/assets/icons/x-small-black.png and /dev/null differ
diff --git a/src/assets/icons/x-small-white.png b/src/assets/icons/x-small-white.png
deleted file mode 100644
index 8b09fe5..0000000
Binary files a/src/assets/icons/x-small-white.png and /dev/null differ
diff --git a/src/assets/icons/x-small.png b/src/assets/icons/x-small.png
deleted file mode 100644
index 1e8175c..0000000
Binary files a/src/assets/icons/x-small.png and /dev/null differ
diff --git a/src/assets/scanQRCodeLight.png b/src/assets/scanQRCodeLight.png
deleted file mode 100644
index 3d960ad..0000000
Binary files a/src/assets/scanQRCodeLight.png and /dev/null differ
diff --git a/src/assets/sendRequestImage.png b/src/assets/sendRequestImage.png
deleted file mode 100644
index acbc078..0000000
Binary files a/src/assets/sendRequestImage.png and /dev/null differ
diff --git a/src/components/ThemeImage/themeImage.jsx b/src/components/ThemeImage/themeImage.jsx
index a333fdd..f5ac313 100644
--- a/src/components/ThemeImage/themeImage.jsx
+++ b/src/components/ThemeImage/themeImage.jsx
@@ -1,6 +1,5 @@
 import { useMemo } from "react";
 import { useThemeContext } from "../../contexts/themeContext";
-import { darkMode } from "../../constants/icons";
 
 export default function ThemeImage({
   styles,
@@ -25,7 +24,7 @@ export default function ThemeImage({
         : "initial",
       ...styles,
     };
-  }, [styles, theme, darkMode, filter]);
+  }, [styles, theme, darkModeType, filter]);
   // const imageSource = useMemo(() => {
   //   return theme
   //     ? darkModeType
@@ -36,6 +35,7 @@ export default function ThemeImage({
 
   return (
     <img
+      loading="eager"
       className={className}
       onClick={() => {
         if (clickFunction) {
diff --git a/src/components/activityIndicator/activityIndicator.jsx b/src/components/activityIndicator/activityIndicator.jsx
index 7d66962..585d0e0 100644
--- a/src/components/activityIndicator/activityIndicator.jsx
+++ b/src/components/activityIndicator/activityIndicator.jsx
@@ -1,7 +1,6 @@
 import { Colors } from "../../constants/theme";
 import "./style.css";
 export default function ActivityIndicator({ color, size = "small" }) {
-  console.log(color);
   return (
     <div
       style={{
diff --git a/src/components/backArrow/backArrow.jsx b/src/components/backArrow/backArrow.jsx
index 32c6b19..7949f61 100644
--- a/src/components/backArrow/backArrow.jsx
+++ b/src/components/backArrow/backArrow.jsx
@@ -1,10 +1,11 @@
 import { useNavigate } from "react-router-dom";
 import "./style.css";
-import ThemeImage from "../ThemeImage/themeImage";
-import { smallArrowLeft } from "../../constants/icons";
-import { WHITE_FILTER } from "../../constants";
+import { ArrowLeft } from "lucide-react";
+import { Colors } from "../../constants/theme";
+import { useThemeContext } from "../../contexts/themeContext";
 
 export default function BackArrow({ backFunction, showWhite = false }) {
+  const { theme, darkModeType } = useThemeContext();
   const navigate = useNavigate();
   return (
     <div
@@ -17,9 +18,15 @@ export default function BackArrow({ backFunction, showWhite = false }) {
       }}
       className="backArrowContainer"
     >
-      <ThemeImage
-        icon={smallArrowLeft}
-        filter={showWhite ? WHITE_FILTER : undefined}
+      <ArrowLeft
+        color={
+          showWhite
+            ? Colors.dark.text
+            : theme && darkModeType
+            ? Colors.dark.text
+            : Colors.constants.blue
+        }
+        size={30}
       />
     </div>
   );
diff --git a/src/components/checkCircle/checkCircle.jsx b/src/components/checkCircle/checkCircle.jsx
index 8a954cf..755277e 100644
--- a/src/components/checkCircle/checkCircle.jsx
+++ b/src/components/checkCircle/checkCircle.jsx
@@ -2,7 +2,7 @@ import "./style.css";
 import { Colors } from "../../constants/theme";
 import useThemeColors from "../../hooks/useThemeColors";
 import { useThemeContext } from "../../contexts/themeContext";
-import { checkMark } from "../../constants/icons";
+import { Check } from "lucide-react";
 
 export default function CheckCircle({ isActive, containerSize = 30 }) {
   const { theme } = useThemeContext();
@@ -28,7 +28,13 @@ export default function CheckCircle({ isActive, containerSize = 30 }) {
       }}
       id="customCheckCircle"
     >
-      {isActive && <img src={checkMark} alt="" className="checkMark" />}
+      {isActive && (
+        <Check
+          className="checkMark"
+          color={Colors.dark.text}
+          style={{ width: containerSize * 0.6, height: containerSize * 0.6 }}
+        />
+      )}
     </div>
   );
 }
diff --git a/src/components/checkCircle/style.css b/src/components/checkCircle/style.css
index e82d3e9..14f06ce 100644
--- a/src/components/checkCircle/style.css
+++ b/src/components/checkCircle/style.css
@@ -5,8 +5,3 @@
   justify-content: center;
   border: 1px solid red;
 }
-#customCheckCircle img {
-  width: 50%;
-  height: 50%;
-  filter: invert(1);
-}
diff --git a/src/components/customInput/customInput.jsx b/src/components/customInput/customInput.jsx
index 66e1c7d..19dc99f 100644
--- a/src/components/customInput/customInput.jsx
+++ b/src/components/customInput/customInput.jsx
@@ -11,6 +11,8 @@ export default function CustomInput({
   onFocus,
   onBlur,
   multiline = false,
+  ref,
+  maxLength,
 }) {
   const commonProps = {
     value,
@@ -23,10 +25,12 @@ export default function CustomInput({
       ...customInputStyles,
       resize: "none",
     },
+    maxLength,
   };
 
   return (
     <div
+      ref={ref}
       style={{ ...containerStyles }}
       className={`custom-description-input-container ${containerClassName}`}
     >
diff --git a/src/components/customInput/style.css b/src/components/customInput/style.css
index c9ca5b9..c41db47 100644
--- a/src/components/customInput/style.css
+++ b/src/components/customInput/style.css
@@ -6,7 +6,7 @@
 }
 .custom-description-input-container .description-input {
   width: 100%;
-  padding: 15px;
+  padding: 10px;
   border: unset;
   border-radius: 8px;
 }
diff --git a/src/components/customNumberKeyboard/customNumberKeyboard.jsx b/src/components/customNumberKeyboard/customNumberKeyboard.jsx
index 5620193..b61d1fc 100644
--- a/src/components/customNumberKeyboard/customNumberKeyboard.jsx
+++ b/src/components/customNumberKeyboard/customNumberKeyboard.jsx
@@ -3,9 +3,8 @@ import { useCallback } from "react";
 import "./style.css";
 import numberConverter from "../../functions/numberConverter";
 import { SATSPERBITCOIN } from "../../constants";
-import { leftCheveronDark } from "../../constants/icons";
-import ThemeImage from "../ThemeImage/themeImage";
 import useThemeColors from "../../hooks/useThemeColors";
+import { ChevronLeft } from "lucide-react";
 
 function getKeyboardKeys(showDot) {
   return KEYBOARD_KEYS.map((key) => {
@@ -89,14 +88,7 @@ export default function CustomNumberKeyboard({
             className={`keyboard-key ${keyClassName}`}
             onClick={() => addPin(num)}
           >
-            {num === "back" ? (
-              <ThemeImage
-                styles={{ width: 20, height: 20 }}
-                icon={leftCheveronDark}
-              />
-            ) : (
-              num
-            )}
+            {num === "back" ? <ChevronLeft size={20} /> : num}
           </button>
         ))}
       </div>
diff --git a/src/components/customNumberKeyboard/style.css b/src/components/customNumberKeyboard/style.css
index feaa0b8..8e5ed3d 100644
--- a/src/components/customNumberKeyboard/style.css
+++ b/src/components/customNumberKeyboard/style.css
@@ -1,4 +1,5 @@
 .keyboard-container {
+  width: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
diff --git a/src/components/customSettingsNavbar/index.jsx b/src/components/customSettingsNavbar/index.jsx
index 6a1f2cf..621b1c0 100644
--- a/src/components/customSettingsNavbar/index.jsx
+++ b/src/components/customSettingsNavbar/index.jsx
@@ -1,29 +1,48 @@
-import { useNavigate } from "react-router-dom";
-import BackArrow from "../backArrow/backArrow";
 import ThemeText from "../themeText/themeText";
+import BackArrow from "../backArrow/backArrow";
+import { useThemeContext } from "../../contexts/themeContext";
+import { Colors } from "../../constants/theme";
+import { useNavigate } from "react-router-dom";
 import "./style.css";
-import ThemeImage from "../ThemeImage/themeImage";
-import { settingsIcon } from "../../constants/icons";
-export default function CustomSettingsNavbar({
+// Custom Settings Top Bar Component
+export default function CustomSettingsNavBar({
+  containerStyles = {},
+  textStyles = {},
   text = "",
+  showLeftImage = false,
+  leftImageFunction = () => {},
+  LeftImageIcon = null,
+  leftImageStyles = {},
   textClassName,
-  showWhite,
-  showSettings,
-  settingLocation,
+  customBackFunction = null,
+  showWhite = false,
 }) {
   const navigate = useNavigate();
+  const handleBackClick = () => {
+    if (customBackFunction) {
+      customBackFunction();
+      return;
+    }
+    navigate(-1);
+  };
+  const { theme, darkModeType } = useThemeContext();
+
   return (
-    <div className="pageNavBar">
-      <BackArrow showWhite={showWhite} />
+    <div className="pageNavBar" style={containerStyles}>
+      <BackArrow backFunction={handleBackClick} showWhite={showWhite} />
+
       <ThemeText
         className={`pageHeaderText ${textClassName}`}
+        textStyles={{ ...textStyles }}
         textContent={text}
       />
-      {showSettings && (
-        <ThemeImage
-          clickFunction={() => navigate(`./${settingLocation}`)}
-          className="settingsIcon"
-          icon={settingsIcon}
+      {showLeftImage && (
+        <LeftImageIcon
+          className="right-action"
+          onClick={leftImageFunction}
+          color={
+            theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+          }
         />
       )}
     </div>
diff --git a/src/components/customSettingsNavbar/style.css b/src/components/customSettingsNavbar/style.css
index c1f5098..1e312d6 100644
--- a/src/components/customSettingsNavbar/style.css
+++ b/src/components/customSettingsNavbar/style.css
@@ -11,7 +11,7 @@
   z-index: 1;
 }
 .pageNavBar .pageHeaderText {
-  font-size: 1.5rem;
+  font-size: 1.25rem;
   text-align: center;
   white-space: nowrap; /* Prevent line break */
   overflow: hidden; /* Hide overflow */
@@ -27,8 +27,6 @@
   right: 0;
   z-index: 1;
 }
-@media screen and (max-width: 400px) {
-  .pageNavBar .pageHeaderText {
-    font-size: 20px;
-  }
+.pageNavBar .right-action {
+  cursor: pointer;
 }
diff --git a/src/components/emojiBar/emojiQuickBar.css b/src/components/emojiBar/emojiQuickBar.css
new file mode 100644
index 0000000..5fb2d39
--- /dev/null
+++ b/src/components/emojiBar/emojiQuickBar.css
@@ -0,0 +1,49 @@
+/* Emoji Quick Bar */
+.emoji-bar {
+  height: 50px;
+  width: 100%;
+  overflow: hidden;
+}
+
+.emoji-scroll-content {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  overflow-x: auto;
+  overflow-y: hidden;
+  height: 100%;
+  padding: 0 8px;
+}
+
+.emoji-scroll-content::-webkit-scrollbar {
+  display: none;
+}
+
+.emoji-scroll-content {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+
+.emoji-button {
+  min-width: 50px;
+  width: 50px;
+  height: 50px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: 0;
+  transition: transform 0.2s ease, opacity 0.2s ease;
+  flex-shrink: 0;
+}
+
+.emoji-button:hover {
+  transform: scale(1.2);
+}
+
+.emoji-button:active {
+  transform: scale(0.95);
+  opacity: 0.7;
+}
diff --git a/src/components/emojiBar/emojiQuickBar.jsx b/src/components/emojiBar/emojiQuickBar.jsx
new file mode 100644
index 0000000..93e8560
--- /dev/null
+++ b/src/components/emojiBar/emojiQuickBar.jsx
@@ -0,0 +1,392 @@
+import { useMemo, useCallback } from "react";
+
+import i18next from "i18next";
+import "./emojiQuickBar.css";
+import useThemeColors from "../../hooks/useThemeColors";
+import ThemeText from "../themeText/themeText";
+
+// Emojis mapped to keywords
+const EMOJI_KEYWORDS = {
+  en: {
+    "🍕": ["pizza", "food", "dinner", "lunch"],
+    "🍔": ["burger", "food", "dinner", "lunch", "mcdonalds", "fast food"],
+    "🌮": ["taco", "food", "dinner", "lunch", "mexican"],
+    "🍜": ["ramen", "noodles", "food", "dinner", "lunch", "soup"],
+    "🍣": ["sushi", "food", "dinner", "lunch", "japanese"],
+    "🍺": ["beer", "drink", "bar", "drinks", "alcohol"],
+    "🍻": ["beers", "drinks", "bar", "cheers", "alcohol"],
+    "☕": ["coffee", "cafe", "starbucks", "drink", "breakfast"],
+    "🍷": ["wine", "drink", "drinks", "alcohol", "dinner"],
+    "🥂": ["champagne", "drinks", "celebrate", "cheers", "alcohol"],
+    "🎉": ["party", "celebrate", "birthday", "celebration"],
+    "🎂": ["cake", "birthday", "dessert", "celebration"],
+    "🎁": ["gift", "present", "birthday", "celebration"],
+    "🎮": ["game", "gaming", "xbox", "playstation", "video game"],
+    "🎬": ["movie", "movies", "film", "cinema", "theater"],
+    "🎵": ["music", "song", "concert", "spotify"],
+    "⚽": ["soccer", "football", "sport", "game"],
+    "🏀": ["basketball", "sport", "game", "nba"],
+    "🎸": ["guitar", "music", "concert", "band"],
+    "🎤": ["karaoke", "singing", "music", "concert"],
+    "✈️": ["flight", "airport", "travel", "trip", "vacation"],
+    "🚗": ["car", "drive", "uber", "lyft", "ride"],
+    "🚕": ["taxi", "cab", "uber", "lyft", "ride"],
+    "🏠": ["home", "house", "rent", "mortgage"],
+    "🏨": ["hotel", "stay", "travel", "vacation"],
+    "⛽": ["gas", "fuel", "gasoline", "petrol"],
+    "🚇": ["subway", "metro", "train", "transit"],
+    "🚲": ["bike", "bicycle", "cycling", "ride"],
+    "💰": ["money", "cash", "payment", "pay"],
+    "💵": ["dollar", "money", "cash", "bill"],
+    "💳": ["card", "credit", "payment", "pay"],
+    "🛒": ["groceries", "shopping", "grocery", "store", "supermarket"],
+    "🎫": ["ticket", "tickets", "concert", "event", "show"],
+    "🏪": ["store", "shop", "shopping", "convenience"],
+    "❤️": ["love", "thanks", "thank you", "heart"],
+    "😂": ["funny", "lol", "haha", "laugh"],
+    "😊": ["happy", "smile", "thanks"],
+    "🙏": ["thanks", "thank you", "please", "grateful"],
+    "👍": ["good", "yes", "ok", "thanks", "great"],
+    "💯": ["perfect", "100", "great", "excellent"],
+    "🔥": ["fire", "hot", "lit", "awesome"],
+    "✨": ["sparkle", "magic", "special", "awesome"],
+  },
+  es: {
+    "🍕": ["pizza", "comida", "cena", "almuerzo"],
+    "🍔": [
+      "hamburguesa",
+      "comida",
+      "cena",
+      "almuerzo",
+      "mcdonalds",
+      "comida rápida",
+    ],
+    "🌮": ["taco", "comida", "cena", "almuerzo", "mexicana"],
+    "🍜": ["ramen", "fideos", "comida", "cena", "almuerzo", "sopa"],
+    "🍣": ["sushi", "comida", "cena", "almuerzo", "japonés"],
+    "🍺": ["cerveza", "bebida", "bar", "alcohol"],
+    "🍻": ["cervezas", "bebidas", "bar", "salud", "alcohol"],
+    "☕": ["café", "cafetería", "starbucks", "bebida", "desayuno"],
+    "🍷": ["vino", "bebida", "alcohol", "cena"],
+    "🥂": ["champán", "brindis", "celebración", "alcohol"],
+    "🎉": ["fiesta", "celebrar", "cumpleaños", "celebración"],
+    "🎂": ["pastel", "cumpleaños", "postre", "celebración"],
+    "🎁": ["regalo", "presente", "cumpleaños", "celebración"],
+    "🎮": ["juego", "gaming", "xbox", "playstation", "videojuego"],
+    "🎬": ["película", "cine", "film", "teatro"],
+    "🎵": ["música", "canción", "concierto", "spotify"],
+    "⚽": ["fútbol", "deporte", "partido"],
+    "🏀": ["baloncesto", "deporte", "nba", "partido"],
+    "🎸": ["guitarra", "música", "concierto", "banda"],
+    "🎤": ["karaoke", "cantar", "música", "concierto"],
+    "✈️": ["vuelo", "aeropuerto", "viaje", "vacaciones"],
+    "🚗": ["auto", "coche", "conducir", "uber", "viaje"],
+    "🚕": ["taxi", "uber", "viaje"],
+    "🏠": ["casa", "hogar", "renta", "alquiler"],
+    "🏨": ["hotel", "estancia", "viaje", "vacaciones"],
+    "⛽": ["gasolina", "combustible"],
+    "🚇": ["metro", "subte", "tren", "transporte"],
+    "🚲": ["bicicleta", "bici", "ciclismo", "viaje"],
+    "💰": ["dinero", "efectivo", "pago", "pagar"],
+    "💵": ["dólar", "dinero", "efectivo", "billete"],
+    "💳": ["tarjeta", "crédito", "pago"],
+    "🛒": ["compras", "supermercado", "tienda"],
+    "🎫": ["ticket", "entrada", "concierto", "evento"],
+    "🏪": ["tienda", "comercio", "supermercado pequeño"],
+    "❤️": ["amor", "gracias", "corazón"],
+    "😂": ["gracioso", "risa", "jajaja"],
+    "😊": ["feliz", "sonrisa", "gracias"],
+    "🙏": ["gracias", "por favor", "agradecido"],
+    "👍": ["bien", "sí", "ok", "gracias", "genial"],
+    "💯": ["perfecto", "excelente", "100"],
+    "🔥": ["fuego", "caliente", "genial"],
+    "✨": ["brillo", "magia", "especial", "genial"],
+  },
+  it: {
+    "🍕": ["pizza", "cibo", "cena", "pranzo"],
+    "🍔": [
+      "burger",
+      "hamburger",
+      "cibo",
+      "cena",
+      "pranzo",
+      "mcdonalds",
+      "fast food",
+    ],
+    "🌮": ["taco", "cibo", "cena", "pranzo", "messicano"],
+    "🍜": ["ramen", "noodles", "cibo", "cena", "pranzo", "zuppa"],
+    "🍣": ["sushi", "cibo", "cena", "pranzo", "giapponese"],
+    "🍺": ["birra", "bevanda", "bar", "alcol"],
+    "🍻": ["birre", "bevande", "brindisi", "alcol"],
+    "☕": ["caffè", "bar", "starbucks", "bevanda", "colazione"],
+    "🍷": ["vino", "bevanda", "alcol", "cena"],
+    "🥂": ["champagne", "brindisi", "celebrare", "alcol"],
+    "🎉": ["festa", "celebrare", "compleanno"],
+    "🎂": ["torta", "compleanno", "dessert"],
+    "🎁": ["regalo", "presente", "compleanno"],
+    "🎮": ["gioco", "gaming", "xbox", "playstation", "videogioco"],
+    "🎬": ["film", "cinema", "teatro"],
+    "🎵": ["musica", "canzone", "concerto", "spotify"],
+    "⚽": ["calcio", "sport", "partita"],
+    "🏀": ["basket", "sport", "nba"],
+    "🎸": ["chitarra", "musica", "concerto", "band"],
+    "🎤": ["karaoke", "cantare", "musica"],
+    "✈️": ["volo", "aeroporto", "viaggio", "vacanza"],
+    "🚗": ["auto", "macchina", "guidare", "uber"],
+    "🚕": ["taxi", "uber", "corsa"],
+    "🏠": ["casa", "abitazione", "affitto", "mutuo"],
+    "🏨": ["hotel", "soggiorno", "viaggio"],
+    "⛽": ["benzina", "carburante"],
+    "🚇": ["metro", "sottopassaggio", "treno", "trasporto"],
+    "🚲": ["bici", "bicicletta", "ciclismo"],
+    "💰": ["soldi", "contanti", "pagamento"],
+    "💵": ["dollaro", "soldi", "contanti"],
+    "💳": ["carta", "credito", "pagamento"],
+    "🛒": ["spesa", "supermercato", "negozio"],
+    "🎫": ["biglietto", "evento", "concerto"],
+    "🏪": ["negozio", "minimarket"],
+    "❤️": ["amore", "grazie", "cuore"],
+    "😂": ["divertente", "risata", "ahah"],
+    "😊": ["felice", "sorriso", "grazie"],
+    "🙏": ["grazie", "per favore", "grato"],
+    "👍": ["bene", "ok", "sì", "grazie"],
+    "💯": ["perfetto", "eccellente"],
+    "🔥": ["fuoco", "caldo", "fantastico"],
+    "✨": ["brillare", "magia", "speciale"],
+  },
+  "pt-BR": {
+    "🍕": ["pizza", "comida", "jantar", "almoço"],
+    "🍔": [
+      "hambúrguer",
+      "comida",
+      "jantar",
+      "almoço",
+      "mcdonalds",
+      "fast food",
+    ],
+    "🌮": ["taco", "comida", "jantar", "almoço", "mexicano"],
+    "🍜": ["lamen", "macarrão", "comida", "jantar", "almoço", "sopa"],
+    "🍣": ["sushi", "comida", "jantar", "almoço", "japonês"],
+    "🍺": ["cerveja", "bebida", "bar", "álcool"],
+    "🍻": ["cervejas", "brinde", "bebidas", "álcool"],
+    "☕": ["café", "cafeteria", "starbucks", "bebida", "café da manhã"],
+    "🍷": ["vinho", "bebida", "álcool", "jantar"],
+    "🥂": ["champanhe", "brinde", "celebrar", "álcool"],
+    "🎉": ["festa", "celebração", "aniversário"],
+    "🎂": ["bolo", "aniversário", "sobremesa"],
+    "🎁": ["presente", "gift", "aniversário"],
+    "🎮": ["jogo", "gaming", "xbox", "playstation", "videogame"],
+    "🎬": ["filme", "cinema", "teatro"],
+    "🎵": ["música", "canção", "show", "spotify"],
+    "⚽": ["futebol", "esporte", "jogo"],
+    "🏀": ["basquete", "esporte", "nba"],
+    "🎸": ["guitarra", "música", "show", "banda"],
+    "🎤": ["karaokê", "cantar", "música"],
+    "✈️": ["voo", "aeroporto", "viagem", "férias"],
+    "🚗": ["carro", "dirigir", "uber"],
+    "🚕": ["táxi", "uber", "corrida"],
+    "🏠": ["casa", "lar", "aluguel"],
+    "🏨": ["hotel", "hospedagem", "viagem"],
+    "⛽": ["gasolina", "combustível"],
+    "🚇": ["metrô", "trem", "transporte"],
+    "🚲": ["bicicleta", "bike", "ciclismo"],
+    "💰": ["dinheiro", "pagamento", "pagar"],
+    "💵": ["dólar", "dinheiro", "nota"],
+    "💳": ["cartão", "crédito", "pagamento"],
+    "🛒": ["mercado", "compras", "supermercado"],
+    "🎫": ["ingresso", "evento", "show"],
+    "🏪": ["loja", "mercadinho", "conveniência"],
+    "❤️": ["amor", "obrigado", "coração"],
+    "😂": ["engraçado", "haha", "risada"],
+    "😊": ["feliz", "sorriso", "obrigado"],
+    "🙏": ["obrigado", "por favor", "gratidão"],
+    "👍": ["bom", "ok", "sim", "obrigado"],
+    "💯": ["perfeito", "excelente"],
+    "🔥": ["fogo", "quente", "incrível"],
+    "✨": ["brilho", "mágico", "especial"],
+  },
+  "de-DE": {
+    "🍕": ["pizza", "essen", "abendessen", "mittagessen"],
+    "🍔": [
+      "burger",
+      "essen",
+      "abendessen",
+      "mittagessen",
+      "mcdonalds",
+      "fast food",
+    ],
+    "🌮": ["taco", "essen", "abendessen", "mittagessen", "mexikanisch"],
+    "🍜": ["ramen", "nudeln", "essen", "suppe"],
+    "🍣": ["sushi", "essen", "japanisch"],
+    "🍺": ["bier", "getränk", "bar", "alkohol"],
+    "🍻": ["biere", "anstoßen", "getränke", "alkohol"],
+    "☕": ["kaffee", "café", "starbucks", "getränk", "frühstück"],
+    "🍷": ["wein", "getränk", "alkohol"],
+    "🥂": ["sekt", "champagner", "anstoßen", " feiern"],
+    "🎉": ["party", "feiern", "geburtstag"],
+    "🎂": ["kuchen", "geburtstag", "dessert"],
+    "🎁": ["geschenk", "präsent", "geburtstag"],
+    "🎮": ["spiel", "gaming", "xbox", "playstation", "videospiel"],
+    "🎬": ["film", "kino", "theater"],
+    "🎵": ["musik", "lied", "konzert", "spotify"],
+    "⚽": ["fußball", "sport", "spiel"],
+    "🏀": ["basketball", "sport", "nba"],
+    "🎸": ["gitarre", "musik", "konzert", "band"],
+    "🎤": ["karaoke", "singen", "musik"],
+    "✈️": ["flug", "reise", "urlaub", "flughafen"],
+    "🚗": ["auto", "fahren", "uber", "fahrt"],
+    "🚕": ["taxi", "fahrt"],
+    "🏠": ["haus", "heim", "miete"],
+    "🏨": ["hotel", "aufenthalt", "reise"],
+    "⛽": ["benzin", "kraftstoff"],
+    "🚇": ["u-bahn", "bahn", "zug", "verkehr"],
+    "🚲": ["fahrrad", "radfahren"],
+    "💰": ["geld", "zahlung"],
+    "💵": ["dollar", "geld", "schein"],
+    "💳": ["karte", "kreditkarte", "zahlung"],
+    "🛒": ["einkauf", "supermarkt", "laden"],
+    "🎫": ["ticket", "eintritt", "event"],
+    "🏪": ["laden", "geschäft", "kiosk"],
+    "❤️": ["liebe", "danke", "herz"],
+    "😂": ["lustig", "lol", "lachen"],
+    "😊": ["glücklich", "lächeln", "danke"],
+    "🙏": ["danke", "bitte", "dankbar"],
+    "👍": ["gut", "ok", "ja", "danke"],
+    "💯": ["perfekt", "super"],
+    "🔥": ["feuer", "heiß", "cool"],
+    "✨": ["glitzer", "magisch", "besonders"],
+  },
+};
+
+const ALL_EMOJIS = [
+  "🍕",
+  "🍔",
+  "☕",
+  "🍺",
+  "🚗",
+  "⛽",
+  "🏠",
+  "💰",
+  "🎉",
+  "❤️",
+  "🌮",
+  "🍜",
+  "🍣",
+  "🍻",
+  "🍷",
+  "🥂",
+  "🎂",
+  "🎁",
+  "🎮",
+  "🎬",
+  "🎵",
+  "⚽",
+  "🏀",
+  "🎸",
+  "🎤",
+  "✈️",
+  "🚕",
+  "🏨",
+  "🚇",
+  "🚲",
+  "💵",
+  "💳",
+  "🛒",
+  "🎫",
+  "🏪",
+  "😂",
+  "😊",
+  "🙏",
+  "👍",
+  "💯",
+  "🔥",
+  "✨",
+];
+
+// Default emoji order (most common first)
+const DEFAULT_EMOJI_ORDER = ["💵", "🏠", "⛽", "🍕", "☕", "🎁", "🎉", "🎫"];
+
+const EmojiQuickBar = ({ description = "", onEmojiSelect }) => {
+  const { backgroundOffset } = useThemeColors();
+
+  const defalutItems = useMemo(() => {
+    return DEFAULT_EMOJI_ORDER.map((item) => ({
+      emoji: item,
+      shouldReplace: false,
+      score: 0,
+    }));
+  }, []);
+
+  const sortedEmojis = useMemo(() => {
+    const splitString = description.split(" ");
+    const currentWord = splitString[splitString.length - 1] || "";
+    if (!currentWord.trim()) {
+      return defalutItems;
+    }
+
+    const lowerDescription = currentWord.toLowerCase();
+    const scored = ALL_EMOJIS.map((emoji) => {
+      const keywords = EMOJI_KEYWORDS[i18next.language][emoji] || [];
+
+      const shouldReplace = keywords[0]
+        ?.toLowerCase()
+        .startsWith(lowerDescription);
+      const score = keywords.reduce((count, keyword) => {
+        return count + (keyword.includes(lowerDescription) ? 1 : 0);
+      }, 0);
+      if (score === 0) return false;
+      return { emoji, score, shouldReplace };
+    }).filter(Boolean);
+
+    if (!scored.length) return defalutItems;
+
+    return scored
+      .sort((a, b) => {
+        if (b.score !== a.score) return b.score - a.score;
+        return ALL_EMOJIS.indexOf(a.emoji) - ALL_EMOJIS.indexOf(b.emoji);
+      })
+      .map((item) => item);
+  }, [description, defalutItems]);
+
+  const createDescription = useCallback(
+    (emoji) => {
+      let newDescription = "";
+      if (emoji.shouldReplace) {
+        let prevDescription = description.split(" ");
+        prevDescription.pop();
+        newDescription = prevDescription.join(" ") + emoji.emoji;
+      } else {
+        newDescription =
+          description.trim() +
+          (description.trim().length ? " " : "") +
+          emoji.emoji;
+      }
+
+      onEmojiSelect(newDescription + " ");
+    },
+    [description, onEmojiSelect]
+  );
+
+  return (
+    <div
+      className="emoji-bar"
+      style={{
+        backgroundColor: backgroundOffset,
+      }}
+    >
+      <div className="emoji-scroll-content">
+        {sortedEmojis.map((emoji, index) => (
+          <button
+            key={index}
+            onClick={() => createDescription(emoji)}
+            className="emoji-button"
+          >
+            <ThemeText content={emoji.emoji} />
+          </button>
+        ))}
+      </div>
+    </div>
+  );
+};
+
+export default EmojiQuickBar;
diff --git a/src/components/formattedBalanceInput/formattedBalanceInput.css b/src/components/formattedBalanceInput/formattedBalanceInput.css
new file mode 100644
index 0000000..62b6d54
--- /dev/null
+++ b/src/components/formattedBalanceInput/formattedBalanceInput.css
@@ -0,0 +1,72 @@
+/* Formatted Balance Input Container */
+.formatted-balance-input-container {
+  width: 90%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  margin: 0 auto;
+  cursor: pointer;
+}
+.formatted-balance-input-container p {
+  margin: 0;
+  text-transform: uppercase;
+}
+
+.input-wrapper {
+  overflow: hidden;
+  display: flex;
+  align-items: center;
+  margin-right: 3px;
+}
+
+.scroll-container {
+  width: 100%;
+  overflow-x: auto;
+  overflow-y: hidden;
+  display: flex;
+}
+
+.scroll-container::-webkit-scrollbar {
+  display: none;
+}
+
+.scroll-container {
+  flex-shrink: 1;
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+  overflow-x: auto;
+  overflow-y: hidden;
+  display: flex;
+  white-space: nowrap;
+}
+
+/* Balance Text Input */
+.balance-text-input {
+  font-size: 40px;
+  background: none;
+  border: none;
+  outline: none;
+  padding: 0;
+  margin: 0;
+  pointer-events: none;
+  user-select: none;
+  min-width: fit-content;
+  text-align: center;
+}
+
+.balance-text-input:focus {
+  outline: none;
+}
+
+/* Hidden Text for Measurement */
+.hidden-text {
+  position: absolute;
+  z-index: -1;
+  font-size: 40px;
+  opacity: 0;
+  pointer-events: none;
+  white-space: nowrap;
+  visibility: hidden;
+}
diff --git a/src/components/formattedBalanceInput/formattedBalanceInput.jsx b/src/components/formattedBalanceInput/formattedBalanceInput.jsx
new file mode 100644
index 0000000..eaf6c09
--- /dev/null
+++ b/src/components/formattedBalanceInput/formattedBalanceInput.jsx
@@ -0,0 +1,184 @@
+import { useMemo, useState, useRef, useEffect } from "react";
+import {
+  BITCOIN_SAT_TEXT,
+  BITCOIN_SATS_ICON,
+  HIDDEN_OPACITY,
+} from "../../constants";
+import "./formattedBalanceInput.css";
+import { useNodeContext } from "../../contexts/nodeContext";
+import { formatCurrency } from "../../functions/formatCurrency";
+import ThemeText from "../themeText/themeText";
+import formatBalanceAmount from "../../functions/formatNumber";
+import { useGlobalContextProvider } from "../../contexts/masterInfoObject";
+import useThemeColors from "../../hooks/useThemeColors";
+
+export default function FormattedBalanceInput({
+  amountValue = 0,
+  containerFunction,
+  inputDenomination,
+  customTextInputContainerStyles,
+  customTextInputStyles,
+  activeOpacity = 0.2,
+  maxWidth = 0.95,
+  customCurrencyCode = "",
+}) {
+  const containerRef = useRef(null);
+  const amountRef = useRef(null);
+  const labelRef = useRef(null);
+
+  const { masterInfoObject } = useGlobalContextProvider();
+  const { textColor } = useThemeColors();
+  const { fiatStats } = useNodeContext();
+
+  const currencyText = fiatStats.coin || "USD";
+  const showSymbol = masterInfoObject.satDisplay !== "word";
+
+  const formattedAmount = formatBalanceAmount(
+    amountValue,
+    false,
+    masterInfoObject
+  );
+
+  const currencyInfo = useMemo(
+    () => formatCurrency({ amount: 0, code: currencyText }),
+    [currencyText]
+  );
+
+  const isSymbolInFront = currencyInfo[3];
+  const currencySymbol = currencyInfo[2];
+
+  const showSats =
+    inputDenomination === "sats" || inputDenomination === "hidden";
+
+  const displayText = useMemo(() => {
+    if (customCurrencyCode) return formattedAmount;
+    return formattedAmount;
+  }, [formattedAmount, customCurrencyCode]);
+
+  const fontSize = useAutoScaleCompositeFont({
+    containerRef,
+    amountRef,
+    labelRef,
+    baseFontSize: 40,
+    minFontSize: 24,
+    padding: 12,
+    displayText,
+  });
+
+  return (
+    <div
+      ref={containerRef}
+      onClick={containerFunction}
+      className="formatted-balance-input-container"
+      style={{
+        opacity: !amountValue ? HIDDEN_OPACITY : 1,
+        maxWidth: `${maxWidth * 100}%`,
+        ...customTextInputContainerStyles,
+      }}
+    >
+      {isSymbolInFront && !showSats && showSymbol && (
+        <ThemeText
+          ref={labelRef}
+          textStyles={{ fontSize, color: textColor }}
+          textContent={currencySymbol}
+        />
+      )}
+
+      {showSats && showSymbol && (
+        <ThemeText
+          ref={labelRef}
+          textStyles={{ fontSize, color: textColor }}
+          textContent={BITCOIN_SATS_ICON}
+        />
+      )}
+
+      <ThemeText
+        ref={amountRef}
+        textStyles={{
+          fontSize,
+          color: textColor,
+          whiteSpace: "nowrap",
+          marginRight: 5,
+          ...customTextInputStyles,
+        }}
+        textContent={formattedAmount}
+      />
+
+      {!isSymbolInFront && !showSats && showSymbol && (
+        <ThemeText
+          ref={labelRef}
+          textStyles={{ fontSize, color: textColor }}
+          textContent={currencySymbol}
+        />
+      )}
+
+      {!showSymbol && !showSats && (
+        <ThemeText
+          ref={labelRef}
+          textStyles={{ fontSize, color: textColor }}
+          textContent={currencyText}
+        />
+      )}
+
+      {!showSymbol && showSats && (
+        <ThemeText
+          ref={labelRef}
+          textStyles={{ fontSize, color: textColor }}
+          textContent={BITCOIN_SAT_TEXT}
+        />
+      )}
+    </div>
+  );
+}
+function useAutoScaleCompositeFont({
+  containerRef,
+  amountRef,
+  labelRef,
+  baseFontSize = 40,
+  minFontSize = 24,
+  padding = 16,
+  displayText,
+}) {
+  const [fontSize, setFontSize] = useState(baseFontSize);
+
+  useEffect(() => {
+    const container = containerRef.current;
+    const amountEl = amountRef.current;
+    const labelEl = labelRef.current;
+
+    if (!container || !amountEl) return;
+
+    const containerWidth = container.offsetWidth;
+    if (!containerWidth) return;
+
+    // Force base size for measurement
+    amountEl.style.fontSize = baseFontSize + "px";
+    if (labelEl) labelEl.style.fontSize = baseFontSize + "px";
+
+    const amountWidth = amountEl.offsetWidth;
+    const labelWidth = labelEl ? labelEl.offsetWidth : 0;
+
+    const totalWidth = amountWidth + labelWidth;
+
+    const available = containerWidth - padding * 2;
+
+    let nextSize = baseFontSize;
+
+    if (totalWidth > available) {
+      const ratio = available / totalWidth;
+      nextSize = Math.max(minFontSize, Math.floor(baseFontSize * ratio));
+    }
+
+    setFontSize(nextSize);
+  }, [
+    containerRef,
+    amountRef,
+    labelRef,
+    baseFontSize,
+    minFontSize,
+    padding,
+    displayText,
+  ]);
+
+  return fontSize;
+}
diff --git a/src/components/formattedSatText/formattedSatText.jsx b/src/components/formattedSatText/formattedSatText.jsx
index 12c666f..886911f 100644
--- a/src/components/formattedSatText/formattedSatText.jsx
+++ b/src/components/formattedSatText/formattedSatText.jsx
@@ -26,6 +26,7 @@ export default function FormattedSatText({
   useCustomLabel = false,
   customLabel = "",
   useMillionDenomination = false,
+  useSizing = false,
 }) {
   const { masterInfoObject } = useGlobalContextProvider();
   const { fiatStats } = useNodeContext();
@@ -80,7 +81,19 @@ export default function FormattedSatText({
     <ThemeText
       key={content}
       reversed={reversed}
-      textStyles={{ includeFontPadding: false, ...styles, ...extra }}
+      textStyles={{ ...styles, ...extra }}
+      textContent={content}
+    />
+  );
+  const hiddenText = (content, key, extra = {}) => (
+    <ThemeText
+      key={key}
+      reversed={reversed}
+      textStyles={{
+        ...styles,
+        ...extra,
+        fontFamily: "Blitzicons1",
+      }}
       textContent={content}
     />
   );
@@ -91,7 +104,36 @@ export default function FormattedSatText({
   if (!shouldShowAmount) {
     children = [
       frontText && renderText(frontText),
-      renderText(HIDDEN_BALANCE_TEXT),
+      hiddenText(HIDDEN_BALANCE_TEXT, 1, {
+        fontSize: styles?.fontSize
+          ? `calc(${styles.fontSize} * ${useSizing ? 0.8 : 1})`
+          : `calc(1em * ${useSizing ? 0.8 : 0.65})`,
+        margin: "0 2px",
+      }),
+      hiddenText(HIDDEN_BALANCE_TEXT, 2, {
+        fontSize: styles?.fontSize
+          ? `calc(${styles.fontSize} * ${useSizing ? 0.9 : 1})`
+          : `calc(1em * ${useSizing ? 0.9 : 0.65})`,
+        margin: "0 2px",
+      }),
+      hiddenText(HIDDEN_BALANCE_TEXT, 3, {
+        fontSize: styles?.fontSize
+          ? `calc(${styles.fontSize} * ${useSizing ? 1 : 1})`
+          : `calc(1em * ${useSizing ? 1 : 0.65})`,
+        margin: "0 2px",
+      }),
+      hiddenText(HIDDEN_BALANCE_TEXT, 4, {
+        fontSize: styles?.fontSize
+          ? `calc(${styles.fontSize} * ${useSizing ? 0.9 : 1})`
+          : `calc(1em * ${useSizing ? 0.9 : 0.65})`,
+        margin: "0 2px",
+      }),
+      hiddenText(HIDDEN_BALANCE_TEXT, 5, {
+        fontSize: styles?.fontSize
+          ? `calc(${styles.fontSize} * ${useSizing ? 0.8 : 1})`
+          : `calc(1em * ${useSizing ? 0.8 : 0.65})`,
+        margin: "0 2px",
+      }),
       backText && renderText(backText, { marginLeft: 5 }),
     ];
   }
diff --git a/src/components/navBar/navbar.css b/src/components/navBar/navbar.css
index 9368313..ee229f5 100644
--- a/src/components/navBar/navbar.css
+++ b/src/components/navBar/navbar.css
@@ -11,7 +11,7 @@
   z-index: 1;
 }
 .pageNavBar .pageHeaderText {
-  font-size: 1.5rem;
+  font-size: 1.25rem;
   text-align: center;
   white-space: nowrap; /* Prevent line break */
   overflow: hidden; /* Hide overflow */
@@ -21,8 +21,3 @@
   padding: 0 35px;
   margin: 0;
 }
-@media screen and (max-width: 400px) {
-  .pageNavBar .pageHeaderText {
-    font-size: 20px;
-  }
-}
diff --git a/src/components/navBar/profileImage.css b/src/components/navBar/profileImage.css
new file mode 100644
index 0000000..374259c
--- /dev/null
+++ b/src/components/navBar/profileImage.css
@@ -0,0 +1,12 @@
+.navbarProfileImageContainer {
+  width: 35px;
+  height: 35px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  position: relative;
+  z-index: 99;
+  overflow: hidden;
+}
diff --git a/src/components/navBar/profileImage.jsx b/src/components/navBar/profileImage.jsx
new file mode 100644
index 0000000..054d82c
--- /dev/null
+++ b/src/components/navBar/profileImage.jsx
@@ -0,0 +1,32 @@
+import { useNavigate } from "react-router-dom";
+import useThemeColors from "../../hooks/useThemeColors";
+
+import { useImageCache } from "../../contexts/imageCacheContext";
+import { useGlobalContextProvider } from "../../contexts/masterInfoObject";
+import { useThemeContext } from "../../contexts/themeContext";
+import ContactProfileImage from "../../pages/contacts/components/profileImage/profileImage";
+import "./profileImage.css";
+
+export default function NavBarProfileImage() {
+  const { backgroundOffset } = useThemeColors();
+  const { cache } = useImageCache();
+  const { masterInfoObject } = useGlobalContextProvider();
+  const { theme, darkModeType } = useThemeContext();
+  const navigate = useNavigate();
+  return (
+    <div
+      style={{ backgroundColor: backgroundOffset }}
+      className="navbarProfileImageContainer"
+      onClick={() => {
+        navigate("/settings");
+      }}
+    >
+      <ContactProfileImage
+        updated={cache[masterInfoObject?.uuid]?.updated}
+        uri={cache[masterInfoObject?.uuid]?.localUri}
+        theme={theme}
+        darkModeType={darkModeType}
+      />
+    </div>
+  );
+}
diff --git a/src/components/navBarWithBalance/navBarWithBalance.css b/src/components/navBarWithBalance/navBarWithBalance.css
new file mode 100644
index 0000000..2d532d9
--- /dev/null
+++ b/src/components/navBarWithBalance/navBarWithBalance.css
@@ -0,0 +1,31 @@
+/* Navigation Bar with Balance */
+.nav-bar-top-bar {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  min-height: 40px;
+  position: relative;
+}
+
+.nav-bar-back-arrow {
+  position: absolute;
+  z-index: 99;
+  left: 0;
+  background: none;
+  border: none;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+}
+
+.nav-bar-container {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  flex-grow: 1;
+  padding: 0 35px;
+  justify-content: center;
+}
diff --git a/src/components/navBarWithBalance/navbarWithBalance.jsx b/src/components/navBarWithBalance/navbarWithBalance.jsx
new file mode 100644
index 0000000..a0e9001
--- /dev/null
+++ b/src/components/navBarWithBalance/navbarWithBalance.jsx
@@ -0,0 +1,75 @@
+import { useNavigate } from "react-router-dom";
+import "./navBarWithBalance.css";
+import { ArrowLeft, Wallet2 } from "lucide-react";
+import { useThemeContext } from "../../contexts/themeContext";
+import { Colors } from "../../constants/theme";
+import FormattedSatText from "../formattedSatText/formattedSatText";
+import { useSpark } from "../../contexts/sparkContext";
+import { formatTokensNumber } from "../../functions/lrc20/formatTokensBalance";
+
+export default function NavBarWithBalance({
+  backFunction,
+  seletctedToken,
+  selectedLRC20Asset = "Bitcoin",
+  showBalance = true,
+}) {
+  const { theme, darkModeType } = useThemeContext();
+  const navigate = useNavigate();
+  const { sparkInformation } = useSpark();
+  const balance = seletctedToken?.balance || sparkInformation.balance;
+
+  const formattedTokensBalance =
+    selectedLRC20Asset !== "Bitcoin"
+      ? formatTokensNumber(balance, seletctedToken?.tokenMetadata?.decimals)
+      : balance;
+
+  const handleBack = () => {
+    if (backFunction) {
+      backFunction();
+    } else {
+      navigate(-1);
+    }
+  };
+
+  return (
+    <div className="nav-bar-top-bar">
+      <button className="nav-bar-back-arrow" onClick={handleBack}>
+        <ArrowLeft
+          size={30}
+          color={
+            theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+          }
+        />
+      </button>
+
+      {showBalance && (
+        <div className="nav-bar-container">
+          <Wallet2
+            size={25}
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+            }
+            style={{ marginRight: 5 }}
+          />
+          <FormattedSatText
+            balance={
+              selectedLRC20Asset !== "Bitcoin"
+                ? Number(formattedTokensBalance).toFixed(
+                    formattedTokensBalance < 1 ? 4 : 2
+                  )
+                : balance
+            }
+            useCustomLabel={
+              seletctedToken?.tokenMetadata?.tokenTicker !== "Bitcoin" &&
+              seletctedToken?.tokenMetadata?.tokenTicker !== undefined
+            }
+            customLabel={seletctedToken?.tokenMetadata?.tokenTicker}
+            useMillionDenomination={true}
+            useSizing={true}
+            styles={{ margin: 0, lineHeight: 1 }}
+          />
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/src/components/overlayHost.jsx b/src/components/overlayHost.jsx
new file mode 100644
index 0000000..5b2e678
--- /dev/null
+++ b/src/components/overlayHost.jsx
@@ -0,0 +1,47 @@
+import { useMemo } from "react";
+import { AnimatePresence } from "framer-motion";
+
+import { useOverlay } from "../contexts/overlayContext.jsx";
+import InformationPopup from "../pages/informationPopup/index.jsx";
+import CustomHalfModal from "../pages/customHalfModal/index.jsx";
+import ErrorScreen from "../pages/error/error.jsx";
+import ConfirmActionPage from "./confirmActionPage/confirmActionPage.jsx";
+
+export default function OverlayHost() {
+  const { overlays, closeOverlay, openOverlay } = useOverlay();
+
+  const overlayElements = useMemo(
+    () =>
+      overlays.map((overlay, index) => (
+        <div key={index}>
+          {overlay.for === "confirm-action" && (
+            <ConfirmActionPage overlay={overlay} onClose={closeOverlay} />
+          )}
+
+          {overlay.for === "error" && (
+            <ErrorScreen overlay={overlay} onClose={closeOverlay} />
+          )}
+
+          {overlay.for === "halfModal" && (
+            <CustomHalfModal
+              contentType={overlay.contentType}
+              params={overlay.params}
+              onClose={closeOverlay}
+              openOverlay={openOverlay}
+            />
+          )}
+
+          {overlay.for === "informationPopup" && (
+            <InformationPopup
+              overlay={overlay}
+              onClose={closeOverlay}
+              openOverlay={openOverlay}
+            />
+          )}
+        </div>
+      )),
+    [overlays, closeOverlay, openOverlay]
+  );
+
+  return <AnimatePresence mode="wait">{overlayElements}</AnimatePresence>;
+}
diff --git a/src/components/sendAndRequsetButton/customSendAndRequestBTN.css b/src/components/sendAndRequsetButton/customSendAndRequestBTN.css
new file mode 100644
index 0000000..fa86b7c
--- /dev/null
+++ b/src/components/sendAndRequsetButton/customSendAndRequestBTN.css
@@ -0,0 +1,17 @@
+/* Send and Request Button */
+.send-request-button {
+  background: none;
+  border: none;
+  padding: 0;
+  cursor: pointer;
+}
+
+/* Scan QR Icon Container */
+.scan-qr-icon {
+  width: 70px;
+  height: 70px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 35px;
+}
diff --git a/src/components/sendAndRequsetButton/customSendAndRequsetButton.jsx b/src/components/sendAndRequsetButton/customSendAndRequsetButton.jsx
new file mode 100644
index 0000000..415bb65
--- /dev/null
+++ b/src/components/sendAndRequsetButton/customSendAndRequsetButton.jsx
@@ -0,0 +1,54 @@
+import { ArrowDown, ArrowUp } from "lucide-react";
+import "./customSendAndRequestBTN.css";
+
+import { useThemeContext } from "../../contexts/themeContext";
+import { Colors } from "../../constants/theme";
+
+export default function CustomSendAndRequsetBTN({
+  btnType,
+  btnFunction,
+  arrowColor,
+  containerBackgroundColor,
+  height = 40,
+  width = 40,
+  containerStyles,
+  activeOpacity = 0.2,
+}) {
+  const { theme, darkModeType } = useThemeContext();
+  return (
+    <button
+      className="send-request-button"
+      style={{
+        opacity: activeOpacity === 1 ? 1 : undefined,
+      }}
+      key={btnType}
+      onClick={() => {
+        btnFunction();
+      }}
+    >
+      <div
+        className="scan-qr-icon"
+        style={{
+          backgroundColor: containerBackgroundColor,
+          ...containerStyles,
+        }}
+      >
+        {btnType === "send" ? (
+          <ArrowUp
+            color={
+              theme && darkModeType ? Colors.light.text : Colors.constants.blue
+            }
+            size={width}
+          />
+        ) : (
+          <ArrowDown
+            color={
+              theme && darkModeType ? Colors.light.text : Colors.constants.blue
+            }
+            size={width}
+          />
+        )}
+      </div>
+    </button>
+  );
+}
diff --git a/src/components/tabsIcon/tabsIcon.jsx b/src/components/tabsIcon/tabsIcon.jsx
deleted file mode 100644
index d94a0d3..0000000
--- a/src/components/tabsIcon/tabsIcon.jsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import {
-  adminHomeWallet,
-  appstore,
-  appstoreFilled,
-  contactsIconBlue,
-  contactsIconBlueSelected,
-  walletBlueIcon,
-} from "../../constants/icons";
-import ThemeImage from "../ThemeImage/themeImage";
-
-export default function TabsIcon({ value, icon }) {
-  let imgSrc =
-    icon === "contacts"
-      ? value === 0
-        ? contactsIconBlueSelected
-        : contactsIconBlue
-      : icon === "wallet"
-      ? value === 1
-        ? walletBlueIcon
-        : adminHomeWallet
-      : value === 2
-      ? appstoreFilled
-      : appstore;
-  return (
-    <ThemeImage styles={{ height: "20px", width: "20px" }} icon={imgSrc} />
-  );
-}
diff --git a/src/components/themeText/themeText.jsx b/src/components/themeText/themeText.jsx
index 2651608..240c7a6 100644
--- a/src/components/themeText/themeText.jsx
+++ b/src/components/themeText/themeText.jsx
@@ -9,6 +9,7 @@ export default function ThemeText({
   className,
   reversed,
   clickFunction,
+  ref,
 }) {
   const { theme } = useThemeContext();
 
@@ -27,6 +28,7 @@ export default function ThemeText({
   );
   return (
     <p
+      ref={ref}
       onClick={() => {
         if (clickFunction) {
           clickFunction();
diff --git a/src/components/transactionContainer/style.css b/src/components/transactionContainer/style.css
index e67717d..85f1134 100644
--- a/src/components/transactionContainer/style.css
+++ b/src/components/transactionContainer/style.css
@@ -36,6 +36,7 @@
   margin: 0;
 }
 .transactionContainer .transaction .textContainer {
+  width: calc(100% - 45px - 72px - 10px - 10px);
   display: flex;
   flex-direction: column;
   margin-right: 10px;
diff --git a/src/components/transactionContainer/transactionContianer.jsx b/src/components/transactionContainer/transactionContianer.jsx
index ac7baeb..724689e 100644
--- a/src/components/transactionContainer/transactionContianer.jsx
+++ b/src/components/transactionContainer/transactionContianer.jsx
@@ -11,14 +11,13 @@ import {
 } from "../../constants";
 import ThemeText from "../themeText/themeText";
 import { useThemeContext } from "../../contexts/themeContext";
-import { pendingTx, smallArrowLeft } from "../../constants/icons";
-import ThemeImage from "../ThemeImage/themeImage";
 import { useTranslation } from "react-i18next";
 import { useMemo } from "react";
 import { formatTokensNumber } from "../../functions/lrc20/formatTokensBalance";
 import { ArrowDown, ArrowUp, Clock } from "lucide-react";
 import { Colors } from "../../constants/theme";
 import useThemeColors from "../../hooks/useThemeColors";
+import { useAppStatus } from "../../contexts/appStatus";
 const TRANSACTION_CONSTANTS = {
   VIEW_ALL_PAGE: "viewAllTx",
   SPARK_WALLET: "sparkWallet",
@@ -33,6 +32,7 @@ const TRANSACTION_CONSTANTS = {
 
 export default function TransactionContanier({ frompage }) {
   const { t } = useTranslation();
+  const { didGetToHomepage } = useAppStatus();
   const { sparkInformation } = useSpark();
   const { masterInfoObject } = useGlobalContextProvider();
   const currentTime = new Date();
@@ -42,7 +42,11 @@ export default function TransactionContanier({ frompage }) {
   const userBalanceDenomination = masterInfoObject?.userBalanceDenomination;
   const homepageTxPreferance = masterInfoObject?.homepageTxPreferance;
 
-  if (frompage === "home" && sparkInformation.didConnect === null) {
+  if (
+    !sparkInformation.didConnect ||
+    !sparkInformation.identityPubKey ||
+    !didGetToHomepage
+  ) {
     return (
       <div className="transactionContainer">
         <SkeletonLoadingTx theme={theme} darkModeType={darkModeType} />
@@ -102,14 +106,7 @@ export default function TransactionContanier({ frompage }) {
       const transactionPaymentType = currentTransaction.paymentType;
       const paymentStatus = currentTransaction.paymentStatus;
 
-      const paymentDetails =
-        frompage === TRANSACTION_CONSTANTS.SPARK_WALLET
-          ? {
-              time: currentTransaction.createdTime,
-              direction: currentTransaction.transferDirection,
-              amount: currentTransaction.totalValue,
-            }
-          : JSON.parse(currentTransaction.details);
+      const paymentDetails = JSON.parse(currentTransaction.details);
 
       const isLRC20Payment = paymentDetails.isLRC20Payment;
 
@@ -162,7 +159,7 @@ export default function TransactionContanier({ frompage }) {
         <TxItem
           details={paymentDetails}
           navigate={navigate}
-          key={transactionIndex}
+          key={currentTransaction.sparkID}
           tx={{ ...currentTransaction, details: paymentDetails }}
           index={transactionIndex}
           currentTime={currentTime}
diff --git a/src/constants/icons.js b/src/constants/icons.js
index fffd902..8c1beae 100644
--- a/src/constants/icons.js
+++ b/src/constants/icons.js
@@ -1,282 +1,21 @@
-import editIcon from "../assets/icons/edit.png";
-import editIconLight from "../assets/icons/editLight.png";
-import xSmallIcon from "../assets/icons/x-small.png";
-import smallArrowLeft from "../assets/icons/arrow-small-left.png";
-// import logoIcon from "../assets/icon.png";
-// import logoIconWhite from "../assets/iconWhite.png";
-import leftCheveronIcon from "../assets/icons/left-chevron.png";
-import walletIcon from "../assets/icons/wallet.png";
-import walletBlueIcon from "../assets/icons/wallet_blue.png";
-import check from "../assets/icons/check.svg";
-import checkMark from "../assets/icons/checkMark.png";
-import settingsIcon from "../assets/icons/settings.png";
-import githubIcon from "../assets/icons/github.png";
-import twitterIcon from "../assets/icons/twitter.png";
-import telegramIcon from "../assets/icons/telegram.png";
-import liquidIcon from "../assets/icons/liquidIcon.png";
-import trashIcon from "../assets/icons/trashIcon.png";
-import faceIDIcon from "../assets/icons/faceIDIcon.png";
-import keyIcon from "../assets/icons/keyIcon.png";
-import notificationsIcon from "../assets/icons/notificationsIcon.png";
-import nodeIcon from "../assets/icons/nodeIcon.png";
-import currencyIcon from "../assets/icons/currencyIcon.png";
-import aboutIcon from "../assets/icons/aboutIcon.png";
-import colorIcon from "../assets/icons/colorIcon.png";
-import refresh from "../assets/icons/refresh.png";
-import refreshWhite from "../assets/icons/refreshWhite.png";
-// import transparentIcon from "../assets/TransparentIcon.png";
-import contactsIconBlue from "../assets/icons/contactsIconBlue.png";
-import pendingTx from "../assets/icons/pendingTx.png";
-import contactsIconBlueSelected from "../assets/icons/contactsIconSelected.png";
-import contactsIcon from "../assets/icons/contactsIcon.png";
-import contactsIconLight from "../assets/icons/contactsIconLight.png";
-import contacts from "../assets/icons/contacts.png";
-import contactsSelected from "../assets/icons/contactsSelected.png";
-import receiptIcon from "../assets/icons/receipt.png";
-import FlashLightIcon from "../assets/icons/flashlight.png";
-import ImagesIcon from "../assets/icons/images.png";
-import ImagesIconDark from "../assets/icons/imagesDark.png";
-import settingsBitcoinIcon from "../assets/icons/settingsBitcoinIcon.png";
-import BTCMap from "../assets/icons/BTCMap.png";
-import lightMode from "../assets/icons/lightMode.png";
-import darkMode from "../assets/icons/darkMode.png";
-import qrCodeLight from "../assets/icons/qrCodeLight.png";
-import qrCodeDark from "../assets/icons/qrCodeDark.png";
-import scanQrCodeLight from "../assets/icons/scanQRCodeLight.png";
-import scanQrCodeDark from "../assets/icons/scanQRCodeDark.png";
-import scanQrCodeBlue from "../assets/icons/scanQRCodeBlue.png";
-import clipboardDark from "../assets/icons/clipboardDark.png";
-import clipboardLight from "../assets/icons/clipboardLight.png";
-import plusIcon from "../assets/icons/plus.png";
-import userIcon from "../assets/icons/user.png";
-import starWhite from "../assets/icons/starWhite.png";
-import starBlack from "../assets/icons/starBlack.png";
-import starBlue from "../assets/icons/starBlue.png";
-import drawerList from "../assets/icons/drawerList.png";
-import home from "../assets/icons/home.png";
-import adminHomeWallet from "../assets/icons/adminHomeWallet.png";
-import adminHomeWalletDark from "../assets/icons/adminHomeWallet_dark.png";
-import appstore from "../assets/icons/appStore.png";
-import appstoreFilled from "../assets/icons/appStoreFilled.png";
-import failedTransaction from "../assets/icons/failedTransaction.png";
-import failedTransactionWhite from "../assets/icons/failedTransactionWhite.png";
-import posDark from "../assets/icons/posDark.png";
-import posLight from "../assets/icons/posLight.png";
-import resturantIconDark from "../assets/icons/restaurantDark.png";
-import resturantIconLight from "../assets/icons/restaurantLight.png";
-import cartIcon from "../assets/icons/cart.png";
-import minusIcon from "../assets/icons/minus.png";
-import messagesDark from "../assets/icons/messages-dark.png";
-import messagesLight from "../assets/icons/messages-light.png";
-import leftCheveronDark from "../assets/icons/leftCheveronDark.png";
-import leftCheveronLight from "../assets/icons/leftCheveronLight.png";
-import dotDark from "../assets/icons/dotDark.png";
-import dotLight from "../assets/icons/dotLight.png";
-import share from "../assets/icons/share.png";
-import aboutIconWhite from "../assets/icons/aboutIconWhite.png";
-import adminHomeWallet_white from "../assets/icons/adminHomeWallet_white.png";
-import appStore_white from "../assets/icons/appStore_white.png";
-import appStoreFilled_white from "../assets/icons/appStoreFilled_white.png";
-import arrow_small_left_white from "../assets/icons/arrow-small-left-white.png";
-import colorIconWhite from "../assets/icons/colorIconWhite.png";
-import contactsIconSelectedWhite from "../assets/icons/contactsIconSelectedWhite.png";
-import contactsIconWhite from "../assets/icons/contactsIconWhite.png";
-import currencyIconWhite from "../assets/icons/currencyIconWhite.png";
-import faceIDIconWhite from "../assets/icons/faceIDIconWhite.png";
-import keyIconWhite from "../assets/icons/keyIconWhite.png";
-import left_cheveron_white from "../assets/icons/left-chevron-white.png";
-import lightModeWhite from "../assets/icons/lightModeWhite.png";
-import liquidIconWhite from "../assets/icons/liquidIconWhite.png";
-import nodeIconWhite from "../assets/icons/nodeIconWhite.png";
-import settingsBitcoinIconWhite from "../assets/icons/settingsBitcoinIconWhite.png";
-import settingsWhite from "../assets/icons/settingsWhite.png";
-import shareWhite from "../assets/icons/shareWhite.png";
-import wallet_white from "../assets/icons/wallet_white.png";
-import receiptWhite from "../assets/icons/receiptWhite.png";
-import drawerListWhite from "../assets/icons/drawerListWhite.png";
-import twitterWhite from "../assets/icons/twitterWhite.png";
-import githubWhite from "../assets/icons/githubWhite.png";
-import telegramWhite from "../assets/icons/telegramWhite.png";
-import userWhite from "../assets/icons/user_white.png";
-import flashlightBlue from "../assets/icons/flashlightBlue.png";
-import disclaimerKeys from "../assets/icons/disclaimerKeys.png";
-import imagesBlue from "../assets/icons/imagesBlue.png";
-import trashIconWhite from "../assets/icons/trashIconWhite.png";
-import flashlightNoFillBlue from "../assets/icons/flashlightNoFill.png";
-import flashlightNoFillWhite from "../assets/icons/flashlightNoFillWhite.png";
-import questionMarkSVG from "../assets/icons/questionMarkSVG.svg";
-// import transparentIconWhite from "../assets/TransparentIconWhite.png";
-// import logoWithPadding from "../assets/B_padding.png";
-import xSmallIconBlack from "../assets/icons/x-small-black.png";
-import xSmallIconWhite from "../assets/icons/x-small-white.png";
-import navigationIcon from "../assets/icons/navigation.png";
-import navigationIconFill from "../assets/icons/navigation_fill.png";
-import navigationIconWhite from "../assets/icons/navigation_white.png";
-import navigationIconFillWhite from "../assets/icons/navigation_fill_white.png";
-import shareBlack from "../assets/icons/shareBlack.png";
-import sparkAsteriskBlack from "../assets/icons/SparkAsteriskBlack.png";
-import sparkAsteriskWhite from "../assets/icons/SparkAsteriskWhite.png";
-import clipboardBlue from "../assets/icons/clipboardBlue.png";
-import notification from "../assets/icons/bell.png";
-import notificationWhite from "../assets/icons/bellWhite.png";
 import bitcoinReceiveIcon from "../assets/icons/bitcoinReceiveIcon.png";
+import blockstreamLiquid from "../assets/icons/blockstreamLiquid.png";
 import botanixReceiveOption from "../assets/icons/botanixReceiveOption.png";
+import disclaimerKeys from "../assets/icons/disclaimerKeys.png";
 import lightningReceiveIcon from "../assets/icons/lightningReceiveIcon.png";
-import sparkReceiveIcon from "../assets/icons/sparkReceiveIcon.png";
-import liquidReceiveIcon from "../assets/icons/liquidReceiveIcon.png";
+import questionMarkSVG from "../assets/icons/questionMarkSVG.svg";
 import rootstockLogo from "../assets/icons/rootstockLogo.png";
-import rootstockLogoBlue from "../assets/icons/rootstockLogoBlue.png";
-import blockstreamLiquid from "../assets/icons/blockstreamLiquid.png";
-import blockstreamLiquidBlue from "../assets/icons/blockstreamLiquidBlue.png";
-import sharedBlue from "../assets/icons/sharedBlue.png";
-import sharedWhite from "../assets/icons/sharedWhite.png";
-import exchangeIcon from "../assets/icons/exchangeIcon.png";
-import exchangeIconWhite from "../assets/icons/exchangeIconWhite.png";
-import arrowFromRightWhite from "../assets/icons/arrow-from-shape-right-white.png";
-import arrowFromRight from "../assets/icons/arrow-from-shape-right.png";
-import arrowToRightLight from "../assets/icons/arrow-to-shape-right-light.png";
-import arrowToRight from "../assets/icons/arrow-to-shape-right.png";
-import group from "../assets/icons/group.png";
-import groupWhite from "../assets/icons/groupWhite.png";
+import sparkAsteriskWhite from "../assets/icons/SparkAsteriskWhite.png";
+import userIcon from "../assets/icons/user.png";
+
 export {
-  editIcon,
-  editIconLight,
-  xSmallIcon,
-  smallArrowLeft,
-  //   logoIcon,
-  //   logoIconWhite,
-  leftCheveronIcon,
-  walletIcon,
-  settingsIcon,
-  githubIcon,
-  twitterIcon,
-  telegramIcon,
-  liquidIcon,
-  trashIcon,
-  faceIDIcon,
-  keyIcon,
-  notificationsIcon,
-  nodeIcon,
-  currencyIcon,
-  aboutIcon,
-  colorIcon,
-  //   transparentIcon,
-  contacts,
-  contactsSelected,
-  receiptIcon,
-  walletBlueIcon,
-  FlashLightIcon,
-  ImagesIcon,
-  settingsBitcoinIcon,
-  BTCMap,
-  lightMode,
-  darkMode,
-  qrCodeLight,
-  qrCodeDark,
-  scanQrCodeLight,
-  scanQrCodeDark,
-  ImagesIconDark,
-  clipboardDark,
-  clipboardLight,
-  plusIcon,
+  questionMarkSVG,
   userIcon,
-  starBlack,
-  starBlue,
-  starWhite,
-  drawerList,
-  home,
-  adminHomeWallet,
-  appstore,
-  appstoreFilled,
-  failedTransaction,
-  posDark,
-  posLight,
-  resturantIconDark,
-  resturantIconLight,
-  cartIcon,
-  minusIcon,
-  messagesDark,
-  messagesLight,
-  leftCheveronDark,
-  leftCheveronLight,
-  dotDark,
-  dotLight,
-  share,
-  scanQrCodeBlue,
-  contactsIcon,
-  contactsIconBlue,
-  contactsIconBlueSelected,
-  contactsIconLight,
-  aboutIconWhite,
-  adminHomeWallet_white,
-  appStore_white,
-  appStoreFilled_white,
-  arrow_small_left_white,
-  colorIconWhite,
-  contactsIconSelectedWhite,
-  contactsIconWhite,
-  currencyIconWhite,
-  faceIDIconWhite,
-  keyIconWhite,
-  left_cheveron_white,
-  lightModeWhite,
-  liquidIconWhite,
-  nodeIconWhite,
-  settingsBitcoinIconWhite,
-  settingsWhite,
-  shareWhite,
-  wallet_white,
-  receiptWhite,
-  drawerListWhite,
-  twitterWhite,
-  telegramWhite,
-  githubWhite,
-  userWhite,
-  flashlightBlue,
-  imagesBlue,
-  trashIconWhite,
-  flashlightNoFillBlue,
-  flashlightNoFillWhite,
-  //   transparentIconWhite,
-  xSmallIconBlack,
-  //   logoWithPadding,
-  adminHomeWalletDark,
-  xSmallIconWhite,
-  failedTransactionWhite,
-  navigationIcon,
-  navigationIconFill,
-  navigationIconWhite,
-  navigationIconFillWhite,
-  sharedBlue,
-  sharedWhite,
-  shareBlack,
-  sparkAsteriskBlack,
-  sparkAsteriskWhite,
-  clipboardBlue,
-  notification,
-  notificationWhite,
+  disclaimerKeys,
   bitcoinReceiveIcon,
-  botanixReceiveOption,
+  blockstreamLiquid,
   lightningReceiveIcon,
-  sparkReceiveIcon,
-  liquidReceiveIcon,
   rootstockLogo,
-  rootstockLogoBlue,
-  blockstreamLiquid,
-  blockstreamLiquidBlue,
-  exchangeIcon,
-  exchangeIconWhite,
-  arrowFromRightWhite,
-  arrowFromRight,
-  arrowToRight,
-  arrowToRightLight,
-  group,
-  groupWhite,
-  checkMark,
-  pendingTx,
-  questionMarkSVG,
-  disclaimerKeys,
-  check,
-  refresh,
-  refreshWhite,
+  botanixReceiveOption,
+  sparkAsteriskWhite,
 };
diff --git a/src/constants/index.js b/src/constants/index.js
index 8409eb7..a795dfb 100644
--- a/src/constants/index.js
+++ b/src/constants/index.js
@@ -1,4 +1,5 @@
 import { SATSPERBITCOIN } from "./math";
+import { HIDDEN_OPACITY, INSET_WINDOW_WIDTH, WINDOWWIDTH } from "./theme";
 
 const WEBSITE_REGEX =
   /^(https?:\/\/|www\.)[a-z\d]([a-z\d-]*[a-z\d])*(\.[a-z]{2,})+/i;
@@ -7,6 +8,9 @@ const hasSpace = /\s/;
 const VALID_URL_REGEX =
   /^(https?:\/\/)?([a-zA-Z0-9-]+\.)+[a-zA-Z]{2,}(\/[^\s]*)?$/;
 
+const IS_BLITZ_URL_REGEX =
+  /^(https?:\/\/)?(www\.)?(blitz-wallet\.com|blitzwalletapp\.com|blitzwallet\.app)(\/[^\s]*)?$/;
+
 const EMAIL_REGEX = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
 
 const VALID_USERNAME_REGEX = /^(?=.*\p{L})[\p{L}\p{N}_]+$/u;
@@ -18,6 +22,12 @@ const IS_SPARK_REQUEST_ID =
   /^SparkLightning(?:Receive|Send)Request:[0-9a-fA-F\-]+$/;
 const IS_BITCOIN_REQUEST_ID = /^SparkCoopExitRequest:[0-9a-fA-F\-]+$/;
 
+const GIFT_DEEPLINK_REGEX =
+  /^(?:blitz-wallet:\/\/gift\/|https:\/\/(?:blitz-wallet\.com|blitzwalletapp\.com|blitzwallet\.app)\/gift\/)[0-9A-Fa-f]{8}-[0-9A-Fa-f]{4}-[0-9A-Fa-f]{4}-[0-9A-Fa-f]{4}-[0-9A-Fa-f]{12}(#[A-Za-z0-9_-]+)?$/;
+
+const CONTACT_UNIVERSAL_LINK_REGEX =
+  /^https?:\/\/(blitzwalletapp\.com|blitzwallet\.app|blitz-wallet\.com)\/u\/[A-Za-z0-9_-]+\/?$/;
+
 const NOSTR_NAME_REGEX = /^[a-zA-Z0-9]+$/;
 const NOSTR_RELAY_URL = "wss://relay.getalbypro.com/blitz";
 
@@ -26,7 +36,7 @@ const WHITE_FILTER =
 
 const IS_LETTER_REGEX = /^[A-Za-z]$/;
 const BITCOIN_SATS_ICON = "\u20BF";
-const HIDDEN_BALANCE_TEXT = `* * * * *`;
+const HIDDEN_BALANCE_TEXT = `E`;
 const BITCOIN_SAT_TEXT = "SAT";
 const INFINITY_SYMBOL = "\u221E";
 
@@ -50,12 +60,31 @@ const BIOMETRIC_KEY = "biometricEncryptionKey";
 const LOGIN_SECURITY_MODE_TYPE_KEY = "LOGIN_SECURITY_MODE_TYPE";
 const SPARK_CACHED_BALANCE_KEY = "CACHED_SPARK_BALANCE";
 const NWC_IDENTITY_PUB_KEY = "NWC_WALLET_PUB_KEY";
+const GENERATED_BITCOIN_ADDRESSES = "GENERATED_BITCOIN_ADDRESSES";
+const SHOPS_DIRECTORY_KEY = "SHOPS_CURRENCY_LOCATION";
+const RANDOM_LOGIN_KEYBOARD_LAYOUT_KEY = "RANDOM_KEYBOARD_LAYOUT_KEY";
+const PERSISTED_LOGIN_COUNT_KEY = "PERSISTED_LOGIN_COUNT_KEY";
+const GIFT_DERIVE_PATH_CUTOFF = 1763650239108;
 
 const BLITZ_SUPPORT_DEFAULT_PAYMENT_DESCRIPTION = "Blitz support";
 const CUSTODY_ACCOUNTS_STORAGE_KEY = "CUSTODY_ACCOUNTS";
+const BLITZ_PAYMENT_DEEP_LINK_SCHEMES = [
+  "bitcoin",
+  "BITCOIN",
+  "lightning",
+  "LIGHTNING",
+  "lnurl",
+  "LNURL",
+  "lnurlp",
+  "LNURLP",
+  "lnurlw",
+  "LNURLW",
+  "keyauth",
+];
 
 const CHATGPT_INPUT_COST = 10 / 1000000;
 const CHATGPT_OUTPUT_COST = 30 / 1000000;
+const STARTING_INDEX_FOR_GIFTS_DERIVE = 1000;
 
 const MIN_CHANNEL_OPEN_FEE = 500_000;
 const MAX_CHANNEL_OPEN_FEE = 1_000_000;
@@ -70,11 +99,15 @@ const LIQUID_NON_BITCOIN_DRAIN_LIMIT = 10;
 const CONTENT_KEYBOARD_OFFSET = 10;
 
 const BLITZ_GOAL_USER_COUNT = 1_000_000;
+
 const IS_DONTATION_PAYMENT_BUFFER = 10_000;
 const SKELETON_ANIMATION_SPEED = 1200;
 const TOKEN_TICKER_MAX_LENGTH = 10;
 
-const INSET_WINDOW_WIDTH = "95%";
+const BACKGROUND_THRESHOLD_MS = 2 * 60 * 1000;
+const FORCE_RESET_SPAARK_STATE_MS = 6 * 60 * 1000;
+
+const DEFAULT_PAYMENT_EXPIRY_SEC = 60 * 60 * 12;
 
 export {
   //   COLORS,
@@ -118,27 +151,43 @@ export {
   CUSTODY_ACCOUNTS_STORAGE_KEY,
   BLITZ_SUPPORT_DEFAULT_PAYMENT_DESCRIPTION,
   IS_DONTATION_PAYMENT_BUFFER,
-  THEME_LOCAL_STORAGE_KEY,
+  LAST_LOADED_BLITZ_LOCAL_STOREAGE_KEY,
   BLITZ_PROFILE_IMG_STORAGE_REF,
+  SKELETON_ANIMATION_SPEED,
   BIOMETRIC_KEY,
-  BITCOIN_SAT_TEXT,
   IS_LETTER_REGEX,
-  INSET_WINDOW_WIDTH,
-  THEME_DARK_MODE_KEY,
-  IS_SPARK_ID,
-  IS_BITCOIN_REQUEST_ID,
+  BITCOIN_SAT_TEXT,
+  LOGIN_SECURITY_MODE_TYPE_KEY,
   IS_SPARK_REQUEST_ID,
   NOSTR_NAME_REGEX,
-  LAST_LOADED_BLITZ_LOCAL_STOREAGE_KEY,
   SPARK_CACHED_BALANCE_KEY,
-  SKELETON_ANIMATION_SPEED,
   TOKEN_TICKER_MAX_LENGTH,
   SMALLEST_ONCHAIN_SPARK_SEND_AMOUNT,
+  IS_BITCOIN_REQUEST_ID,
   NWC_SECURE_STORE_KEY,
   NWC_SECURE_STORE_MNEMOINC,
   NWC_LOACAL_STORE_KEY,
-  LOGIN_SECURITY_MODE_TYPE_KEY,
+  IS_SPARK_ID,
+  NOSTR_RELAY_URL,
   NWC_IDENTITY_PUB_KEY,
-  WHITE_FILTER,
+  SHOPS_DIRECTORY_KEY,
   INFINITY_SYMBOL,
+  GENERATED_BITCOIN_ADDRESSES,
+  RANDOM_LOGIN_KEYBOARD_LAYOUT_KEY,
+  PERSISTED_LOGIN_COUNT_KEY,
+  BLITZ_PAYMENT_DEEP_LINK_SCHEMES,
+  IS_BLITZ_URL_REGEX,
+  STARTING_INDEX_FOR_GIFTS_DERIVE,
+  GIFT_DEEPLINK_REGEX,
+  GIFT_DERIVE_PATH_CUTOFF,
+  CONTACT_UNIVERSAL_LINK_REGEX,
+  BACKGROUND_THRESHOLD_MS,
+  FORCE_RESET_SPAARK_STATE_MS,
+  DEFAULT_PAYMENT_EXPIRY_SEC,
+  WHITE_FILTER,
+  THEME_LOCAL_STORAGE_KEY,
+  THEME_DARK_MODE_KEY,
+  WINDOWWIDTH,
+  HIDDEN_OPACITY,
+  INSET_WINDOW_WIDTH,
 };
diff --git a/src/constants/theme.js b/src/constants/theme.js
index e73d362..3cf8763 100644
--- a/src/constants/theme.js
+++ b/src/constants/theme.js
@@ -57,5 +57,10 @@ export const Colors = {
     giftCardBlue2: "#222222",
     giftCardBlue3: "#676767",
     expandedTxReceitBackground: "#1B1B1B",
+    lightsOutModeOpacityInput: "#3C3C3C",
   },
 };
+export const WINDOWWIDTH = "95%";
+export const INSET_WINDOW_WIDTH = "90%";
+export const MAX_CONTENT_WIDTH = 600;
+export const HIDDEN_OPACITY = 0.5;
diff --git a/src/contexts/SDKNavigation.jsx b/src/contexts/SDKNavigation.jsx
new file mode 100644
index 0000000..3fae2ec
--- /dev/null
+++ b/src/contexts/SDKNavigation.jsx
@@ -0,0 +1,118 @@
+import { useEffect, useRef } from "react";
+
+import i18next from "i18next";
+
+import { useAppStatus } from "./appStatus";
+import { useSpark } from "./sparkContext";
+import { useToast } from "./toastManager";
+import { useNodeContext } from "./nodeContext";
+import { useNavigate } from "react-router-dom";
+
+// export function RootstockNavigationListener() {
+//   const navigation = useNavigate();
+//   const { didGetToHomepage } = useAppStatus();
+//   const { pendingNavigation, setPendingNavigation } = useRootstockProvider();
+//   const isNavigating = useRef(false); // Use a ref for local state
+
+//   useEffect(() => {
+//     if (!pendingNavigation) return;
+//     if (!didGetToHomepage) {
+//       setPendingNavigation(null);
+//       return;
+//     }
+//     if (isNavigating.current) return;
+//     crashlyticsLogReport(`Navigating to confirm tx page in roostock listener`);
+//     isNavigating.current = true;
+
+//     setTimeout(() => {
+//       requestAnimationFrame(() => {
+//         navigation.navigate("ErrorScreen", {
+//           errorMessage: i18next.t("errormessages.receivedRootstock"),
+//         });
+//         isNavigating.current = false;
+//         console.log("cleaning up navigation for rootstock");
+//       });
+//     }, 100);
+
+//     setPendingNavigation(null);
+//   }, [pendingNavigation, didGetToHomepage]);
+
+//   return null;
+// }
+
+// export function LiquidNavigationListener() {
+//   const navigation = useNavigation();
+//   const { didGetToHomepage } = useAppStatus();
+//   const { pendingLiquidPayment, setPendingLiquidPayment } = useNodeContext();
+//   const isNavigating = useRef(false); // Use a ref for local state
+
+//   useEffect(() => {
+//     if (!pendingLiquidPayment) return;
+//     if (!didGetToHomepage) {
+//       setPendingLiquidPayment(null);
+//       return;
+//     }
+//     if (isNavigating.current) return;
+//     crashlyticsLogReport(`Navigating to confirm tx page in liquid listener `);
+//     isNavigating.current = true;
+
+//     setTimeout(() => {
+//       requestAnimationFrame(() => {
+//         navigation.navigate("ErrorScreen", {
+//           errorMessage: i18next.t("errormessages.receivedLiquid"),
+//         });
+//         isNavigating.current = false;
+//         console.log("cleaning up navigation for liquid");
+//       });
+//     }, 100);
+
+//     setPendingLiquidPayment(null);
+//   }, [pendingLiquidPayment, didGetToHomepage]);
+
+//   return null;
+// }
+
+export function SparkNavigationListener() {
+  const navigate = useNavigate();
+  const { didGetToHomepage } = useAppStatus();
+  const { pendingNavigation, setPendingNavigation } = useSpark();
+  const isNavigating = useRef(false); // Use a ref for local state
+  const { showToast } = useToast();
+
+  useEffect(() => {
+    console.log(pendingNavigation, didGetToHomepage, "in navigation");
+    if (!pendingNavigation) return;
+    if (!didGetToHomepage) {
+      setPendingNavigation(null);
+      return;
+    }
+    if (isNavigating.current) return;
+    isNavigating.current = true;
+
+    setTimeout(() => {
+      if (pendingNavigation.showFullAnimation) {
+        navigate("/confirm-page", {
+          state: {
+            for: "paymentsucceed",
+            transaction: pendingNavigation.tx,
+          },
+          replace: true,
+        });
+      } else {
+        showToast({
+          amount: pendingNavigation.amount,
+          LRC20Token: pendingNavigation.LRC20Token,
+          isLRC20Payment: pendingNavigation.isLRC20Payment,
+          duration: 7000,
+          type: "confirmTx",
+        });
+      }
+      console.log("cleaning up navigation for spark");
+      isNavigating.current = false;
+    }, 100);
+
+    setPendingNavigation(null);
+  }, [pendingNavigation, didGetToHomepage]);
+
+  return null;
+}
diff --git a/src/contexts/activeAccount.jsx b/src/contexts/activeAccount.jsx
index 849124d..d115ab0 100644
--- a/src/contexts/activeAccount.jsx
+++ b/src/contexts/activeAccount.jsx
@@ -54,8 +54,8 @@ export const ActiveCustodyAccountProvider = ({ children }) => {
       }
     }
 
-    console.log("Initializing accounts....");
     if (!accountMnemoinc) return;
+    console.log("Initializing accounts....");
     initializeAccouts();
   }, [accountMnemoinc]);
 
diff --git a/src/contexts/globalContacts.jsx b/src/contexts/globalContacts.jsx
index 1123648..3559f0a 100644
--- a/src/contexts/globalContacts.jsx
+++ b/src/contexts/globalContacts.jsx
@@ -19,14 +19,17 @@ import {
 import {
   CONTACTS_TRANSACTION_UPDATE_NAME,
   contactsSQLEventEmitter,
+  deleteCachedMessages,
   getCachedMessages,
   queueSetCashedMessages,
 } from "../functions/messaging/cachedMessages";
 import { db } from "../../db/initializeFirebase";
 import { useKeysContext } from "./keysContext";
 import {
+  and,
   collection,
   onSnapshot,
+  or,
   orderBy,
   query,
   startAfter,
@@ -43,41 +46,55 @@ export const GlobalContactsList = ({ children }) => {
   );
   const [contactsMessags, setContactsMessagses] = useState({});
   const [decodedAddedContacts, setDecodedAddedContacts] = useState([]);
+  const [updateDB, setUpdateDB] = useState(null);
 
   const didTryToUpdate = useRef(false);
-  const lookForNewMessages = useRef(false);
+  const lookForNewMessages = useRef(true);
   const unsubscribeMessagesRef = useRef(null);
   const unsubscribeSentMessagesRef = useRef(null);
   const pendingWrite = useRef(null);
+  const globalContactsInformationRef = useRef(globalContactsInformation);
+  const decodedAddedContactsRef = useRef([]);
 
   const addedContacts = globalContactsInformation.addedContacts;
 
-  const toggleGlobalContactsInformation = useCallback((newData, writeToDB) => {
-    console.log("WRITING TO DATABASE TWICE (should only see once)");
+  useEffect(() => {
+    globalContactsInformationRef.current = globalContactsInformation;
+  }, [globalContactsInformation]);
+
+  const toggleGlobalContactsInformation = useCallback(
+    (newData, writeToDB) => {
+      setUpdateDB({ newData, writeToDB });
+    },
+    [publicKey]
+  );
 
-    setGlobalContactsInformation((prev) => {
-      const newContacts = { ...prev, ...newData };
+  useEffect(() => {
+    if (!updateDB) return;
 
+    async function handleUpdate() {
+      const { newData, writeToDB } = updateDB;
+      const newContacts = {
+        ...globalContactsInformationRef.current,
+        ...newData,
+      };
+      setGlobalContactsInformation(newContacts);
       if (writeToDB) {
-        // Store the data we want to write outside the updater
-        pendingWrite.current = newContacts;
+        addDataToCollection(
+          { contacts: newContacts },
+          "blitzWalletUsers",
+          publicKey
+        );
       }
 
-      return newContacts;
-    });
-  }, []);
+      setUpdateDB(null);
+    }
+    handleUpdate();
+  }, [updateDB]);
 
   useEffect(() => {
-    if (pendingWrite.current) {
-      console.log("RUNNING IN WRITE TO DB (should only see once)");
-      addDataToCollection(
-        { contacts: pendingWrite.current },
-        "blitzWalletUsers",
-        publicKey
-      );
-      pendingWrite.current = null;
-    }
-  }, [globalContactsInformation, publicKey]);
+    decodedAddedContactsRef.current = decodedAddedContacts;
+  }, [decodedAddedContacts]);
 
   useEffect(() => {
     if (!publicKey || !addedContacts) return;
@@ -114,7 +131,7 @@ export const GlobalContactsList = ({ children }) => {
         .filter((key) => key !== "lastMessageTimestamp")
         .filter(
           (contact) =>
-            !decodedAddedContacts.find(
+            !decodedAddedContactsRef.current.find(
               (contactElement) => contactElement.uuid === contact
             ) && contact !== globalContactsInformation.myProfile.uuid
         )
@@ -142,16 +159,16 @@ export const GlobalContactsList = ({ children }) => {
       toggleGlobalContactsInformation(
         {
           myProfile: { ...globalContactsInformation.myProfile },
-          addedContacts: encryptMessage(
+          addedContacts: await encryptMessage(
             contactsPrivateKey,
             globalContactsInformation.myProfile.uuid,
-            JSON.stringify(decodedAddedContacts.concat(newContats))
+            JSON.stringify(decodedAddedContactsRef.current.concat(newContats))
           ),
         },
         true
       );
     }
-  }, [globalContactsInformation, decodedAddedContacts, contactsPrivateKey]);
+  }, [globalContactsInformation, contactsPrivateKey]);
 
   useEffect(() => {
     async function handleUpdate(updateType) {
@@ -174,92 +191,457 @@ export const GlobalContactsList = ({ children }) => {
     };
   }, [updatedCachedMessagesStateFunction]);
 
+  const updateContactUniqueName = useCallback(
+    async (newUniqueNames) => {
+      try {
+        if (newUniqueNames.size === 0) {
+          return;
+        }
+        let newValue = null;
+        try {
+          // Validate prerequisites
+          if (!contactsPrivateKey || !publicKey) {
+            console.warn("Missing required data for contact update");
+            return;
+          }
+
+          let currentContacts;
+          try {
+            const decryptedData = await decryptMessage(
+              contactsPrivateKey,
+              publicKey,
+              globalContactsInformationRef.current.addedContacts
+            );
+
+            if (!decryptedData) {
+              console.warn("Decryption returned empty data");
+              return;
+            }
+
+            currentContacts = JSON.parse(decryptedData);
+
+            // Validate parsed data
+            if (!Array.isArray(currentContacts)) {
+              console.warn("Decrypted contacts is not an array");
+              return;
+            }
+          } catch (decryptError) {
+            console.error(
+              "Failed to decode contacts for update:",
+              decryptError
+            );
+            return;
+          }
+
+          let hasChanges = false;
+          const updatedContacts = currentContacts.map((contact) => {
+            try {
+              const newUniqueName = newUniqueNames.get(contact.uuid);
+
+              if (
+                newUniqueName &&
+                typeof newUniqueName === "string" &&
+                newUniqueName.trim() !== "" &&
+                newUniqueName !== contact.uniqueName
+              ) {
+                hasChanges = true;
+                return {
+                  ...contact,
+                  uniqueName: newUniqueName,
+                };
+              }
+
+              return contact;
+            } catch (mapError) {
+              console.error("Error processing contact:", mapError);
+              return contact;
+            }
+          });
+
+          if (!hasChanges) {
+            return;
+          }
+
+          try {
+            const newEncryptedContacts = await encryptMessage(
+              contactsPrivateKey,
+              publicKey,
+              JSON.stringify(updatedContacts)
+            );
+
+            if (!newEncryptedContacts) {
+              console.error("Encryption failed, aborting update");
+              return;
+            }
+
+            addDataToCollection(
+              {
+                contacts: {
+                  ...globalContactsInformationRef.current,
+                  addedContacts: newEncryptedContacts,
+                },
+              },
+              "blitzWalletUsers",
+              publicKey
+            ).catch((dbError) => {
+              console.error("Failed to save contacts to database:", dbError);
+            });
+
+            newValue = {
+              ...globalContactsInformationRef.current,
+              addedContacts: newEncryptedContacts,
+            };
+          } catch (encryptError) {
+            console.error("Failed to encrypt updated contacts:", encryptError);
+            return;
+          }
+        } catch (stateError) {
+          console.error("Error in state update function:", stateError);
+          return;
+        }
+
+        if (newValue) {
+          setGlobalContactsInformation(newValue);
+        }
+      } catch (outerError) {
+        console.error("Critical error in updateContactUniqueName:", outerError);
+      }
+    },
+    [contactsPrivateKey, publicKey]
+  );
+
   useEffect(() => {
-    return;
     if (!Object.keys(globalContactsInformation).length) return;
     const now = new Date().getTime();
     // Unsubscribe from previous listeners before setting new ones
     if (unsubscribeMessagesRef.current) {
       unsubscribeMessagesRef.current();
     }
-    if (unsubscribeSentMessagesRef.current) {
-      unsubscribeSentMessagesRef.current();
-    }
-    const inboundMessageQuery = query(
-      collection(db, "contactMessages"),
-      where("toPubKey", "==", globalContactsInformation.myProfile.uuid),
-      orderBy("timestamp"),
-      startAfter(now)
-    );
-    const outbounddMessageQuery = query(
+
+    const combinedMessageQuery = query(
       collection(db, "contactMessages"),
-      where("fromPubKey", "==", globalContactsInformation.myProfile.uuid),
-      orderBy("timestamp"),
-      startAfter(now)
+      and(
+        where("timestamp", ">", now),
+        or(
+          where("toPubKey", "==", globalContactsInformation.myProfile.uuid),
+          where("fromPubKey", "==", globalContactsInformation.myProfile.uuid)
+        )
+      ),
+      orderBy("timestamp")
     );
+
     // Set up the realtime listener
     unsubscribeMessagesRef.current = onSnapshot(
-      inboundMessageQuery,
-      (snapshot) => {
-        if (!snapshot?.docChanges()?.length) return;
-        snapshot.docChanges().forEach((change) => {
-          console.log("received a new message", change.type);
-          if (change.type === "added") {
-            const newMessage = change.doc.data();
-            queueSetCashedMessages({
-              newMessagesList: [newMessage],
-              myPubKey: globalContactsInformation.myProfile.uuid,
-            });
-          }
-        });
-      }
-    );
-    unsubscribeSentMessagesRef.current = onSnapshot(
-      outbounddMessageQuery,
-      (snapshot) => {
-        if (!snapshot?.docChanges()?.length) return;
-        snapshot.docChanges().forEach((change) => {
-          console.log("sent a new message", change.type);
-          if (change.type === "added") {
+      combinedMessageQuery,
+      async (snapshot) => {
+        const changes = snapshot?.docChanges();
+        if (!changes?.length) return;
+
+        let newMessages = [];
+        let newUniqueIds = new Map();
+
+        await Promise.all(
+          changes.map(async (change) => {
+            if (change.type !== "added") return;
+
             const newMessage = change.doc.data();
-            queueSetCashedMessages({
-              newMessagesList: [newMessage],
-              myPubKey: globalContactsInformation.myProfile.uuid,
+            const isReceived =
+              newMessage.toPubKey === globalContactsInformation.myProfile.uuid;
+            console.log(
+              `${isReceived ? "received" : "sent"} a new message`,
+              newMessage
+            );
+
+            if (typeof newMessage.message !== "string") {
+              newMessages.push(newMessage);
+              return;
+            }
+
+            const sendersPubkey = isReceived
+              ? newMessage.fromPubKey
+              : newMessage.toPubKey;
+
+            const decoded = await decryptMessage(
+              contactsPrivateKey,
+              sendersPubkey,
+              newMessage.message
+            );
+
+            if (!decoded) return;
+
+            let parsedMessage;
+            try {
+              parsedMessage = JSON.parse(decoded);
+            } catch {
+              return;
+            }
+
+            if (parsedMessage?.senderProfileSnapshot && isReceived) {
+              newUniqueIds.set(
+                sendersPubkey,
+                parsedMessage.senderProfileSnapshot.uniqueName
+              );
+            }
+
+            newMessages.push({
+              ...newMessage,
+              message: parsedMessage,
+              sendersPubkey,
+              isReceived,
             });
-          }
-        });
+          })
+        );
+
+        if (newUniqueIds.size) {
+          updateContactUniqueName(newUniqueIds);
+        }
+
+        if (newMessages.length) {
+          queueSetCashedMessages({
+            newMessagesList: newMessages,
+            myPubKey: globalContactsInformation.myProfile.uuid,
+          });
+        }
       }
     );
+
     return () => {
       if (unsubscribeMessagesRef.current) {
         unsubscribeMessagesRef.current();
       }
-      if (unsubscribeSentMessagesRef.current) {
-        unsubscribeSentMessagesRef.current();
-      }
     };
-  }, [globalContactsInformation?.myProfile?.uuid]);
+  }, [globalContactsInformation?.myProfile?.uuid, contactsPrivateKey]);
+
+  const addContact = useCallback(
+    async (contact) => {
+      try {
+        const newContact = {
+          name: contact.name || "",
+          nameLower: contact.nameLower || "",
+          bio: contact.bio,
+          unlookedTransactions: 0,
+          isLNURL: contact.isLNURL,
+          uniqueName: contact.uniqueName || "",
+          uuid: contact.uuid,
+          isAdded: true,
+          isFavorite: false,
+          profileImage: contact.profileImage,
+          receiveAddress: contact.receiveAddress,
+          transactions: [],
+        };
+
+        let newAddedContacts = JSON.parse(JSON.stringify(decodedAddedContacts));
+
+        const isContactInAddedContacts = newAddedContacts.filter(
+          (addedContact) => addedContact.uuid === newContact.uuid
+        ).length;
+
+        if (isContactInAddedContacts) {
+          newAddedContacts = newAddedContacts.map((addedContact) => {
+            if (addedContact.uuid === newContact.uuid) {
+              return {
+                ...addedContact,
+                name: newContact.name,
+                nameLower: newContact.nameLower,
+                bio: newContact.bio,
+                unlookedTransactions: 0,
+                isAdded: true,
+              };
+            } else return addedContact;
+          });
+        } else newAddedContacts.push(newContact);
+
+        toggleGlobalContactsInformation(
+          {
+            myProfile: {
+              ...globalContactsInformation.myProfile,
+              didEditProfile: true,
+            },
+            addedContacts: await encryptMessage(
+              contactsPrivateKey,
+              publicKey,
+              JSON.stringify(newAddedContacts)
+            ),
+          },
+          true
+        );
+      } catch (err) {
+        console.log("Error adding  contact", err);
+      }
+    },
+    [
+      decodedAddedContacts,
+      contactsPrivateKey,
+      publicKey,
+      globalContactsInformation,
+    ]
+  );
+
+  const deleteContact = useCallback(
+    async (contact) => {
+      try {
+        const newAddedContacts = decodedAddedContacts
+          .map((savedContacts) => {
+            if (savedContacts.uuid === contact.uuid) {
+              return null;
+            } else return savedContacts;
+          })
+          .filter((contact) => contact);
+
+        await deleteCachedMessages(contact.uuid);
+
+        toggleGlobalContactsInformation(
+          {
+            addedContacts: await encryptMessage(
+              contactsPrivateKey,
+              publicKey,
+              JSON.stringify(newAddedContacts)
+            ),
+            myProfile: { ...globalContactsInformation.myProfile },
+          },
+          true
+        );
+      } catch (err) {
+        console.log("Error deleating contact", err);
+      }
+    },
+    [
+      decodedAddedContacts,
+      contactsPrivateKey,
+      publicKey,
+      globalContactsInformation,
+    ]
+  );
 
   useEffect(() => {
     if (!Object.keys(globalContactsInformation).length) return;
-    if (lookForNewMessages.current) return;
-    lookForNewMessages.current = true;
-    // syncDatabasePayment(
-    //   globalContactsInformation.myProfile.uuid,
-    //   updatedCachedMessagesStateFunction
-    // );
-  }, [globalContactsInformation, updatedCachedMessagesStateFunction]);
+    if (!contactsPrivateKey) return;
+    if (!addedContacts) return;
+
+    if (lookForNewMessages.current) {
+      lookForNewMessages.current = false;
+      async function handleOfflineMessageSync() {
+        console.log("RUNNING SYNC DATABAE");
+        const restoredPayments = await syncDatabasePayment(
+          globalContactsInformation.myProfile.uuid,
+          contactsPrivateKey
+        );
+
+        if (restoredPayments.length === 0) {
+          updatedCachedMessagesStateFunction();
+        }
+
+        const contactDataMap = new Map(
+          restoredPayments
+            .filter(
+              (item) =>
+                item.isReceived &&
+                item?.message?.senderProfileSnapshot?.uniqueName
+            )
+            .map((item) => [
+              item.sendersPubkey,
+              item.message.senderProfileSnapshot.uniqueName,
+            ])
+        );
+        updateContactUniqueName(contactDataMap);
+
+        queueSetCashedMessages({
+          newMessagesList: restoredPayments,
+          myPubKey: globalContactsInformation.myProfile.uuid,
+        });
+      }
+      handleOfflineMessageSync();
+    }
+  }, [
+    globalContactsInformation,
+    updatedCachedMessagesStateFunction,
+    contactsPrivateKey,
+    decodedAddedContacts,
+    addedContacts,
+  ]);
+
+  const giftCardsList = useMemo(() => {
+    if (!contactsMessags) return [];
+
+    const actualContacts = Object.keys(contactsMessags);
+    const lastMessageTimestampIndex = actualContacts.indexOf(
+      "lastMessageTimestamp"
+    );
+
+    // Remove lastMessageTimestamp efficiently
+    if (lastMessageTimestampIndex > -1) {
+      actualContacts.splice(lastMessageTimestampIndex, 1);
+    }
+
+    if (actualContacts.length === 0) return [];
+
+    const giftCards = [];
+
+    // Process contacts efficiently
+    for (const contact of actualContacts) {
+      const contactData = contactsMessags[contact];
+      if (!contactData?.messages?.length) continue;
+
+      // Use for loop for better performance than filter + push
+      const messages = contactData.messages;
+      for (let i = 0; i < messages.length; i++) {
+        const message = messages[i];
+        if (message.message?.giftCardInfo && !message.message.didSend) {
+          giftCards.push(message);
+        }
+      }
+    }
+
+    // Sort in-place for memory efficiency
+    giftCards.sort((a, b) => {
+      const timeA = a.serverTimestamp || a.timestamp;
+      const timeB = b.serverTimestamp || b.timestamp;
+      return timeB - timeA;
+    });
+
+    return giftCards;
+  }, [contactsMessags]);
+
+  const hasUnlookedTransactions = useMemo(() => {
+    return Object.keys(contactsMessags).some((contactUUID) => {
+      if (
+        contactUUID === "lastMessageTimestamp" ||
+        contactUUID === globalContactsInformation?.myProfile?.uuid
+      ) {
+        return false;
+      }
+      const messages = contactsMessags[contactUUID]?.messages;
+      return messages?.some((message) => !message.message.wasSeen) || false;
+    });
+  }, [contactsMessags, globalContactsInformation?.myProfile?.uuid]);
+
+  const contextValue = useMemo(
+    () => ({
+      decodedAddedContacts,
+      globalContactsInformation,
+      toggleGlobalContactsInformation,
+      contactsMessags,
+      updatedCachedMessagesStateFunction,
+      giftCardsList,
+      hasUnlookedTransactions,
+      deleteContact,
+      addContact,
+    }),
+    [
+      decodedAddedContacts,
+      globalContactsInformation,
+      toggleGlobalContactsInformation,
+      contactsMessags,
+      updatedCachedMessagesStateFunction,
+      giftCardsList,
+      hasUnlookedTransactions,
+      deleteContact,
+      addContact,
+    ]
+  );
 
   return (
-    <GlobalContacts.Provider
-      value={{
-        decodedAddedContacts,
-        globalContactsInformation,
-        toggleGlobalContactsInformation,
-        contactsMessags,
-        updatedCachedMessagesStateFunction,
-      }}
-    >
+    <GlobalContacts.Provider value={contextValue}>
       {children}
     </GlobalContacts.Provider>
   );
diff --git a/src/contexts/imageCacheContext.jsx b/src/contexts/imageCacheContext.jsx
index 2dceae2..99b1383 100644
--- a/src/contexts/imageCacheContext.jsx
+++ b/src/contexts/imageCacheContext.jsx
@@ -4,129 +4,231 @@ import React, {
   useState,
   useEffect,
   useRef,
+  useCallback,
+  useMemo,
 } from "react";
-import { getStorage } from "firebase/storage";
+import { getDownloadURL, getMetadata, getStorage, ref } from "firebase/storage";
 import { useGlobalContacts } from "./globalContacts";
 import { useAppStatus } from "./appStatus";
 import { BLITZ_PROFILE_IMG_STORAGE_REF } from "../constants";
-import { ImageCacheDB } from "../functions/contacts/imageCacheDb";
+import {
+  clearAllCachedImages,
+  deleteCachedImage,
+  downloadAndCacheImage,
+  getAllImageKeys,
+  getCachedImage,
+} from "../functions/images/storage";
+import { useGlobalContextProvider } from "./masterInfoObject";
 
 const ImageCacheContext = createContext();
 
 export function ImageCacheProvider({ children }) {
   const [cache, setCache] = useState({});
+  const { masterInfoObject } = useGlobalContextProvider();
   const { didGetToHomepage } = useAppStatus();
   const { decodedAddedContacts } = useGlobalContacts();
   const didRunContextCacheCheck = useRef(null);
+  const cachedImagesRef = useRef(cache);
 
-  useEffect(() => {
-    (async () => {
-      try {
-        const keys = await ImageCacheDB.getAllKeys();
-        const initialCache = {};
-
-        for (const key of keys) {
-          const value = await ImageCacheDB.getItem(key);
-          if (value && value.blob) {
-            const uuid = key.replace(BLITZ_PROFILE_IMG_STORAGE_REF + "/", "");
-            const blobUrl = URL.createObjectURL(value.blob);
-            initialCache[uuid] = { ...value, uri: blobUrl };
-          }
-        }
+  const inFlightRequests = useRef(new Map());
 
-        setCache(initialCache);
-      } catch (e) {
-        console.error("Error loading image cache from IndexedDB", e);
+  const refreshCacheObject = useCallback(async () => {
+    try {
+      const keys = await getAllImageKeys();
+
+      const initialCache = {};
+
+      for (const key of keys) {
+        const value = await getCachedImage(key);
+        if (value) {
+          const uuid = key.replace(BLITZ_PROFILE_IMG_STORAGE_REF + "/", "");
+          initialCache[uuid] = { ...value, localUri: value.uri };
+        }
       }
-    })();
+
+      setCache(initialCache);
+    } catch (e) {
+      console.error("Error loading image cache from storage", e);
+    }
   }, []);
 
   useEffect(() => {
-    return;
-    if (!didGetToHomepage) return;
-    if (didRunContextCacheCheck.current) return;
-    didRunContextCacheCheck.current = true;
-    console.log(decodedAddedContacts, "DECIN FUNC");
-    async function refreshContactsImages() {
-      for (let index = 0; index < decodedAddedContacts.length; index++) {
-        const element = decodedAddedContacts[index];
-        await refreshCache(element.uuid);
+    cachedImagesRef.current = cache;
+  }, [cache]);
+
+  useEffect(() => {
+    refreshCacheObject();
+  }, [decodedAddedContacts, refreshCacheObject]); //rerun the cache when adding or removing contacts
+
+  const refreshCache = useCallback(
+    async (uuid, hasdownloadURL, skipCacheUpdate = false) => {
+      if (inFlightRequests.current.has(uuid)) {
+        console.log("Request already in flight for", uuid);
+        return inFlightRequests.current.get(uuid);
       }
-    }
-    refreshContactsImages();
-  }, [decodedAddedContacts, didGetToHomepage]);
+      const requestPromise = (async () => {
+        try {
+          console.log("Refreshing image for", uuid);
+          const key = `${BLITZ_PROFILE_IMG_STORAGE_REF}/${uuid}`;
+          let url;
+          let metadata;
+          let updated;
+
+          if (!hasdownloadURL) {
+            const storageInstance = getStorage();
+
+            const reference = ref(
+              storageInstance,
+              `${BLITZ_PROFILE_IMG_STORAGE_REF}/${uuid}.jpg`
+            );
+
+            metadata = await getMetadata(reference);
+            updated = metadata.updated;
+
+            const cached = cache[uuid];
+            if (cached && cached.updated === updated) {
+              const cachedImage = await getCachedImage(key);
+              if (cachedImage) {
+                return {
+                  uri: cachedImage.uri,
+                  localUri: cachedImage.uri,
+                  updated: cachedImage.metadata,
+                  isObjectURL: cachedImage.isObjectURL,
+                };
+              }
+            }
+
+            url = await getDownloadURL(reference);
+          } else {
+            url = hasdownloadURL;
+            updated = new Date().toISOString();
+          }
 
-  async function refreshCache(uuid, hasDownloadURL) {
-    try {
-      const key = `${BLITZ_PROFILE_IMG_STORAGE_REF}/${uuid}`;
-      let url;
-      let metadata;
-      let updated;
-
-      if (!hasDownloadURL) {
-        const reference = getStorage().ref(
-          `${BLITZ_PROFILE_IMG_STORAGE_REF}/${uuid}.jpg`
-        );
-        metadata = await reference.getMetadata();
-        updated = metadata.updated;
-
-        const cached = await ImageCacheDB.getItem(key);
-        if (cached && cached.updated === updated) {
-          const blobUrl = URL.createObjectURL(cached.blob);
-          const newCache = { ...cached, uri: blobUrl };
-          setCache((prev) => ({ ...prev, [uuid]: newCache }));
-          return newCache;
-        }
+          const blob = await downloadAndCacheImage(key, url, { updated });
 
-        url = await reference.getDownloadURL();
-      } else {
-        url = hasDownloadURL;
-        updated = new Date().toISOString();
-      }
+          if (!blob) {
+            throw new Error("Failed to download image");
+          }
 
-      const response = await fetch(url);
-      const blob = await response.blob();
-      const blobUrl = URL.createObjectURL(blob);
+          // Get the newly cached image
+          const cachedImage = await getCachedImage(key);
 
-      const newCacheEntry = {
-        updated,
-        blob,
-      };
+          if (!cachedImage) {
+            throw new Error("Failed to retrieve cached image");
+          }
 
-      await ImageCacheDB.setItem(key, newCacheEntry);
+          const newCacheEntry = {
+            uri: cachedImage.uri,
+            localUri: cachedImage.uri,
+            updated,
+            isObjectURL: cachedImage.isObjectURL,
+          };
 
-      const newDisplayEntry = {
-        ...newCacheEntry,
-        uri: blobUrl,
-      };
+          if (!skipCacheUpdate) {
+            setCache((prev) => ({ ...prev, [uuid]: newCacheEntry }));
+          }
 
-      setCache((prev) => ({ ...prev, [uuid]: newDisplayEntry }));
+          return newCacheEntry;
+        } catch (err) {
+          console.log("Error refreshing image cache", err);
+          throw err;
+        } finally {
+          inFlightRequests.current.delete(uuid);
+        }
+      })();
 
-      return newDisplayEntry;
-    } catch (err) {
-      console.error("Error refreshing image cache", err);
-    }
-  }
+      inFlightRequests.current.set(uuid, requestPromise);
 
-  async function removeProfileImageFromCache(uuid) {
+      return requestPromise;
+    },
+    [cache]
+  );
+
+  const removeProfileImageFromCache = useCallback(async (uuid) => {
     try {
+      console.log("Deleting profile image", uuid);
       const key = `${BLITZ_PROFILE_IMG_STORAGE_REF}/${uuid}`;
-      await ImageCacheDB.deleteItem(key);
+
       const newCacheEntry = {
         uri: null,
-        updated: new Date().toISOString(),
+        localUri: null,
+        updated: new Date().getTime(),
       };
+
+      await deleteCachedImage(key);
       setCache((prev) => ({ ...prev, [uuid]: newCacheEntry }));
       return newCacheEntry;
     } catch (err) {
-      console.error("Error deleting image from cache", err);
+      console.log("Error refreshing image cache", err);
     }
-  }
+  }, []);
+
+  useEffect(() => {
+    if (!didGetToHomepage) return;
+    if (didRunContextCacheCheck.current) return;
+    if (!masterInfoObject.uuid) return;
+    didRunContextCacheCheck.current = true;
+
+    async function refreshContactsImages() {
+      // allways check all images, will return cahced image if its already cached. But this prevents against stale images
+      let refreshArray = [
+        ...decodedAddedContacts,
+        { uuid: masterInfoObject.uuid },
+      ];
+
+      const validContacts = refreshArray.filter((element) => !element.isLNURL);
+
+      const results = await Promise.allSettled(
+        validContacts.map((element) => refreshCache(element.uuid, null, true))
+      );
+
+      const cacheUpdates = {};
+
+      results.forEach((result, index) => {
+        if (result.status === "fulfilled" && result.value) {
+          try {
+            const uuid = validContacts[index].uuid;
+            const newEntry = result.value;
+            const existingEntry = cachedImagesRef.current[uuid];
+
+            // Only add to updates if the entry is new or has changed
+            if (
+              !existingEntry ||
+              existingEntry.updated !== newEntry.updated ||
+              existingEntry.localUri !== newEntry.localUri
+            ) {
+              cacheUpdates[uuid] = newEntry;
+            }
+          } catch (err) {
+            console.error("Error updating response", err);
+          }
+        }
+      });
+
+      if (Object.keys(cacheUpdates).length > 0) {
+        setCache((prev) => ({ ...prev, ...cacheUpdates }));
+      }
+    }
+    refreshContactsImages();
+  }, [
+    decodedAddedContacts,
+    didGetToHomepage,
+    masterInfoObject?.uuid,
+    refreshCache,
+  ]);
+
+  const contextValue = useMemo(
+    () => ({
+      cache,
+      refreshCache,
+      removeProfileImageFromCache,
+      refreshCacheObject,
+    }),
+    [cache, refreshCache, removeProfileImageFromCache, refreshCacheObject]
+  );
 
   return (
-    <ImageCacheContext.Provider
-      value={{ cache, refreshCache, removeProfileImageFromCache }}
-    >
+    <ImageCacheContext.Provider value={contextValue}>
       {children}
     </ImageCacheContext.Provider>
   );
diff --git a/src/contexts/masterInfoObject.jsx b/src/contexts/masterInfoObject.jsx
index a15a337..8be9124 100644
--- a/src/contexts/masterInfoObject.jsx
+++ b/src/contexts/masterInfoObject.jsx
@@ -9,6 +9,8 @@ import {
 import { useTranslation } from "react-i18next";
 import { sendDataToDB } from "../../db/interactionManager";
 import { useKeysContext } from "./keysContext";
+import { getDataFromCollection } from "../../db";
+import { auth } from "../../db/initializeFirebase";
 
 // Initiate context
 const GlobalContextManger = createContext(null);
@@ -18,6 +20,11 @@ const GlobalContextProvider = ({ children }) => {
 
   const [masterInfoObject, setMasterInfoObject] = useState({});
 
+  const [preloadedUserData, setPreLoadedUserData] = useState({
+    isLoading: true,
+    data: null,
+  });
+
   const { i18n } = useTranslation();
 
   const toggleMasterInfoObject = useCallback(
@@ -33,13 +40,40 @@ const GlobalContextProvider = ({ children }) => {
     [i18n, publicKey]
   );
 
+  useEffect(() => {
+    async function preloadUserData() {
+      try {
+        if (auth.currentUser) {
+          const collectionData = await getDataFromCollection(
+            "blitzWalletUsers",
+            auth.currentUser.uid
+          );
+          if (!collectionData) throw new Error("No data returened");
+          setPreLoadedUserData({ isLoading: true, data: collectionData });
+        } else throw new Error("No user logged in");
+      } catch (err) {
+        console.log("Error preloading user data");
+        setPreLoadedUserData({ isLoading: false, data: null });
+      }
+    }
+    preloadUserData();
+  }, []);
+
   const contextValue = useMemo(
     () => ({
       toggleMasterInfoObject,
       setMasterInfoObject,
       masterInfoObject,
+      preloadedUserData,
+      setPreLoadedUserData,
     }),
-    [toggleMasterInfoObject, masterInfoObject, setMasterInfoObject]
+    [
+      toggleMasterInfoObject,
+      masterInfoObject,
+      setMasterInfoObject,
+      preloadedUserData,
+      setPreLoadedUserData,
+    ]
   );
 
   return (
diff --git a/src/contexts/navigationLogger.jsx b/src/contexts/navigationLogger.jsx
index f58d912..7189135 100644
--- a/src/contexts/navigationLogger.jsx
+++ b/src/contexts/navigationLogger.jsx
@@ -9,8 +9,6 @@ export function NavigationStackProvider({ children }) {
   const [stack, setStack] = useState([]);
   const initialized = useRef(false);
 
-  console.log(stack);
-
   useEffect(() => {
     if (!initialized.current) {
       initialized.current = true;
diff --git a/src/contexts/nodeContext.jsx b/src/contexts/nodeContext.jsx
index 5de1c0e..7732d16 100644
--- a/src/contexts/nodeContext.jsx
+++ b/src/contexts/nodeContext.jsx
@@ -12,13 +12,18 @@ import { useAppStatus } from "./appStatus";
 import loadNewFiatData from "../functions/saveAndUpdateFiatData";
 import { connectToLiquidNode } from "../functions/connectToLiquid";
 import { useGlobalContextProvider } from "./masterInfoObject";
+import { useSpark } from "./sparkContext";
+import { useGlobalContacts } from "./globalContacts";
+import liquidToSparkSwap from "../functions/spark/liquidToSparkSwap";
 
 // Initiate context
 const NodeContextManager = createContext(null);
 
 const GLobalNodeContextProider = ({ children }) => {
+  const { sparkInformation } = useSpark();
   const { contactsPrivateKey, publicKey, accountMnemoinc } = useKeysContext();
-  const { didGetToHomepage } = useAppStatus();
+  const { didGetToHomepage, minMaxLiquidSwapAmounts } = useAppStatus();
+  const { globalContactsInformation } = useGlobalContacts();
   const { masterInfoObject } = useGlobalContextProvider();
   const [nodeInformation, setNodeInformation] = useState({
     didConnectToNode: null,
@@ -35,6 +40,7 @@ const GLobalNodeContextProider = ({ children }) => {
     transactions: [],
     userBalance: 0,
   });
+  const [pendingLiquidPayment, setPendingLiquidPayment] = useState(null);
   const [fiatStats, setFiatStats] = useState({});
   const toggleFiatStats = useCallback((newInfo) => {
     setFiatStats((prev) => ({ ...prev, ...newInfo }));
@@ -97,6 +103,33 @@ const GLobalNodeContextProider = ({ children }) => {
     connectToLiquid();
   }, [contactsPrivateKey, publicKey, didGetToHomepage, accountMnemoinc]);
 
+  // This function checks to see if there are any liquid funds that need to be sent to spark
+  useEffect(() => {
+    async function swapLiquidToSpark() {
+      try {
+        if (liquidNodeInformation.userBalance > minMaxLiquidSwapAmounts.min) {
+          setPendingLiquidPayment(true);
+          await liquidToSparkSwap(
+            globalContactsInformation.myProfile.uniqueName
+          );
+        }
+      } catch (err) {
+        console.log("transfering liquid to spark error", err);
+      }
+    }
+    if (!didGetToHomepage) return;
+    if (!sparkInformation.didConnect) return;
+    if (!sparkInformation.identityPubKey) return;
+    swapLiquidToSpark();
+  }, [
+    didGetToHomepage,
+    liquidNodeInformation.userBalance,
+    minMaxLiquidSwapAmounts,
+    sparkInformation.didConnect,
+    sparkInformation.identityPubKey,
+    globalContactsInformation?.myProfile?.uniqueName,
+  ]);
+
   const contextValue = useMemo(
     () => ({
       nodeInformation,
@@ -104,6 +137,8 @@ const GLobalNodeContextProider = ({ children }) => {
       toggleLiquidNodeInformation,
       toggleFiatStats,
       fiatStats,
+      pendingLiquidPayment,
+      setPendingLiquidPayment,
     }),
     [
       nodeInformation,
@@ -111,6 +146,8 @@ const GLobalNodeContextProider = ({ children }) => {
       fiatStats,
       toggleFiatStats,
       toggleLiquidNodeInformation,
+      pendingLiquidPayment,
+      setPendingLiquidPayment,
     ]
   );
 
diff --git a/src/contexts/overlayContext.jsx b/src/contexts/overlayContext.jsx
new file mode 100644
index 0000000..ffb5e88
--- /dev/null
+++ b/src/contexts/overlayContext.jsx
@@ -0,0 +1,45 @@
+import { createContext, useCallback, useContext, useState } from "react";
+
+const OverlayContext = createContext(null);
+
+export function OverlayProvider({ children }) {
+  const [overlays, setOverlays] = useState([]);
+
+  const openOverlay = useCallback((overlay) => {
+    setOverlays((prev) => {
+      if (overlay.for === "halfModal") {
+        return prev.slice(0, -1).concat(overlay);
+      }
+      return [...prev, overlay];
+    });
+  }, []);
+
+  const closeOverlay = useCallback(() => {
+    setOverlays((prev) => prev.slice(0, -1));
+  }, []);
+
+  const clearOverlays = useCallback(() => {
+    setOverlays([]);
+  }, []);
+
+  return (
+    <OverlayContext.Provider
+      value={{
+        overlays,
+        openOverlay,
+        closeOverlay,
+        clearOverlays,
+      }}
+    >
+      {children}
+    </OverlayContext.Provider>
+  );
+}
+
+export function useOverlay() {
+  const ctx = useContext(OverlayContext);
+  if (!ctx) {
+    throw new Error("useOverlay must be used inside OverlayProvider");
+  }
+  return ctx;
+}
diff --git a/src/contexts/sparkContext.jsx b/src/contexts/sparkContext.jsx
index dce8f24..845a34e 100644
--- a/src/contexts/sparkContext.jsx
+++ b/src/contexts/sparkContext.jsx
@@ -7,11 +7,10 @@ import {
   useRef,
   useCallback,
 } from "react";
-
-import { sparkReceivePaymentWrapper } from "../functions/spark/payments";
-import { breezLiquidPaymentWrapper } from "../functions/breezLiquid";
 import {
   claimnSparkStaticDepositAddress,
+  getCachedSparkTransactions,
+  getSingleTxDetails,
   getSparkBalance,
   getSparkLightningPaymentStatus,
   getSparkStaticBitcoinL1AddressQuote,
@@ -24,13 +23,13 @@ import {
   addSingleSparkTransaction,
   bulkUpdateSparkTransactions,
   deleteUnpaidSparkLightningTransaction,
+  getAllSparkContactInvoices,
   getAllSparkTransactions,
   getAllUnpaidSparkLightningInvoices,
   SPARK_TX_UPDATE_ENVENT_NAME,
   sparkTransactionsEventEmitter,
 } from "../functions/spark/transactions";
 import {
-  findSignleTxFromHistory,
   fullRestoreSparkState,
   restoreSparkTxState,
   updateSparkTxStatus,
@@ -52,21 +51,40 @@ import liquidToSparkSwap from "../functions/spark/liquidToSparkSwap";
 import { useActiveCustodyAccount } from "./activeAccount";
 import sha256Hash from "../functions/hash";
 import { getLRC20Transactions } from "../functions/lrc20";
+import { useGlobalContextProvider } from "./masterInfoObject";
+import handleBalanceCache from "../functions/spark/handleBalanceCache";
+import {
+  createBalancePoller,
+  createRestorePoller,
+} from "../functions/pollingManager";
+import i18next from "i18next";
+import { useLocation } from "react-router-dom";
 
 export const isSendingPayingEventEmiiter = new EventEmitter();
 export const SENDING_PAYMENT_EVENT_NAME = "SENDING_PAYMENT_EVENT";
 
+if (!globalThis.blitzWalletSparkIntervalState) {
+  globalThis.blitzWalletSparkIntervalState = {
+    intervalTracker: new Map(),
+    listenerLock: new Map(),
+    allIntervalIds: new Set(),
+    depositIntervalIds: new Set(),
+  };
+}
+const { intervalTracker, listenerLock, allIntervalIds, depositIntervalIds } =
+  globalThis.blitzWalletSparkIntervalState;
+
 // Initiate context
 const SparkWalletManager = createContext(null);
 const sessionTime = new Date().getTime();
 
 const SparkWalletProvider = ({ children, navigate }) => {
+  const location = useLocation();
+  const { masterInfoObject } = useGlobalContextProvider();
   const { accountMnemoinc, contactsPrivateKey, publicKey } = useKeysContext();
   const { currentWalletMnemoinc } = useActiveCustodyAccount();
   const { didGetToHomepage, minMaxLiquidSwapAmounts, appState } =
     useAppStatus();
-  const { liquidNodeInformation } = useNodeContext();
-  const [isSendingPayment, setIsSendingPayment] = useState(false);
   const { toggleGlobalContactsInformation, globalContactsInformation } =
     useGlobalContacts();
   const prevAccountMnemoincRef = useRef(null);
@@ -78,128 +96,253 @@ const SparkWalletProvider = ({ children, navigate }) => {
     sparkAddress: "",
     didConnect: null,
   });
+  const [tokensImageCache, setTokensImageCache] = useState({});
   const [pendingNavigation, setPendingNavigation] = useState(null);
-  const [pendingLiquidPayment, setPendingLiquidPayment] = useState(null);
+  const hasRestoreCompleted = useRef(false);
+  const [restoreCompleted, setRestoreCompleted] = useState(false);
+  const [reloadNewestPaymentTimestamp, setReloadNewestPaymentTimestamp] =
+    useState(0);
   const depositAddressIntervalRef = useRef(null);
   const sparkDBaddress = useRef(null);
   const updatePendingPaymentsIntervalRef = useRef(null);
   const isInitialRestore = useRef(true);
   const isInitialLRC20Run = useRef(true);
+  const sparkInfoRef = useRef({
+    balance: 0,
+    tokens: {},
+    identityPubKey: "",
+    sparkAddress: "",
+  });
+  const sessionTimeRef = useRef(Date.now());
+  const newestPaymentTimeRef = useRef(Date.now());
+  const handledTransfers = useRef(new Set());
+  const usedSavedTxIds = useRef(new Set());
+  const prevAccountId = useRef(null);
+  const isSendingPaymentRef = useRef(false);
+  const balancePollingTimeoutRef = useRef(null);
+  const balancePollingAbortControllerRef = useRef(null);
+  const txPollingTimeoutRef = useRef(null);
+  const txPollingAbortControllerRef = useRef(null);
+  const currentPollingMnemonicRef = useRef(null);
+  const isInitialRender = useRef(true);
   const didInitializeSendingPaymentEvent = useRef(false);
   const initialBitcoinIntervalRun = useRef(null);
-  const currentWalletMnemoincRef = useRef(currentWalletMnemoinc);
-  const prevAppState = useRef(null);
+  const prevAppState = useRef(appState);
   const prevListenerType = useRef(null);
-  const [numberOfCachedTxs, setNumberOfCachedTxs] = useState(0);
-  // dont need any more velow
+
+  const showTokensInformation =
+    masterInfoObject.enabledBTKNTokens === null
+      ? !!Object.keys(sparkInformation.tokens || {}).length
+      : masterInfoObject.enabledBTKNTokens;
+
+  const didRunInitialRestore = useRef(false);
+
+  const handledNavigatedTxs = useRef(new Set());
+
+  const [didRunNormalConnection, setDidRunNormalConnection] = useState(false);
+  const [normalConnectionTimeout, setNormalConnectionTimeout] = useState(false);
+  const shouldRunNormalConnection =
+    didRunNormalConnection || normalConnectionTimeout;
+  const currentMnemonicRef = useRef(currentWalletMnemoinc);
 
   const [numberOfIncomingLNURLPayments, setNumberOfIncomingLNURLPayments] =
     useState(0);
   const [numberOfConnectionTries, setNumberOfConnectionTries] = useState(0);
-  const [startConnectingToSpark, setStartConnectingToSpark] = useState(false);
+
+  const cleanStatusAndLRC20Intervals = () => {
+    try {
+      for (const intervalId of allIntervalIds) {
+        console.log("Clearing stored interval ID:", intervalId);
+        clearInterval(intervalId);
+      }
+
+      intervalTracker.clear();
+      allIntervalIds.clear();
+    } catch (err) {
+      console.log("Error cleaning lrc20 intervals", err);
+    }
+  };
+
+  const clearAllDepositIntervals = () => {
+    console.log(
+      "Clearing all deposit address intervals. Counts:",
+      depositIntervalIds.size
+    );
+
+    for (const intervalId of depositIntervalIds) {
+      console.log("Clearing deposit interval ID:", intervalId);
+      clearInterval(intervalId);
+    }
+
+    depositIntervalIds.clear();
+    console.log("All deposit intervals cleared");
+  };
+
+  useEffect(() => {
+    sparkInfoRef.current = {
+      balance: sparkInformation.balance,
+      tokens: sparkInformation.tokens,
+      identityPubKey: sparkInformation.identityPubKey,
+      sparkAddress: sparkInformation.sparkAddress,
+    };
+  }, [
+    sparkInformation.balance,
+    sparkInformation.tokens,
+    sparkInformation.identityPubKey,
+    sparkInformation.sparkAddress,
+  ]);
 
   const sessionTime = useMemo(() => {
-    console.log("Updating wallet session time");
+    console.log("Updating wallet session time", currentWalletMnemoinc);
     return Date.now();
   }, [currentWalletMnemoinc]);
 
   useEffect(() => {
-    currentWalletMnemoincRef.current = currentWalletMnemoinc;
+    currentMnemonicRef.current = currentWalletMnemoinc;
+  }, [currentWalletMnemoinc]);
+
+  useEffect(() => {
+    // Fixing race condition with new preloaded txs
+    sessionTimeRef.current = Date.now() + 5 * 1000;
   }, [currentWalletMnemoinc]);
 
+  useEffect(() => {
+    newestPaymentTimeRef.current = Date.now();
+  }, [reloadNewestPaymentTimestamp]);
+
+  useEffect(() => {
+    if (!sparkInfoRef.current?.tokens) return;
+
+    async function updateTokensImageCache() {
+      const availableAssets = Object.entries(sparkInfoRef.current.tokens);
+      const extensions = ["jpg", "png"];
+      const newCache = {};
+
+      for (const [tokenId] of availableAssets) {
+        newCache[tokenId] = null;
+
+        for (const ext of extensions) {
+          const url = `https://tokens.sparkscan.io/${tokenId}.${ext}`;
+          try {
+            const response = await fetch(url, { method: "HEAD" });
+            if (response.ok) {
+              newCache[tokenId] = url;
+              break;
+            }
+          } catch (err) {
+            console.log("Image fetch error:", tokenId, err);
+          }
+        }
+      }
+
+      setTokensImageCache(newCache);
+    }
+
+    updateTokensImageCache();
+  }, [Object.keys(sparkInformation.tokens || {}).length]);
+
   // Debounce refs
   const debounceTimeoutRef = useRef(null);
   const pendingTransferIds = useRef(new Set());
 
-  const toggleIsSendingPayment = (isSending) => {
-    setIsSendingPayment(isSending);
+  const toggleIsSendingPayment = useCallback((isSending) => {
+    console.log("Setting is sending payment", isSending);
+    if (isSending) {
+      if (txPollingAbortControllerRef.current) {
+        txPollingAbortControllerRef.current.abort();
+        txPollingAbortControllerRef.current = null;
+      }
+    }
+    isSendingPaymentRef.current = isSending;
+  }, []);
+
+  const toggleNewestPaymentTimestamp = () => {
+    setReloadNewestPaymentTimestamp((prev) => prev + 1);
   };
-  useEffect(() => {
-    if (didInitializeSendingPaymentEvent.current) return;
-    didInitializeSendingPaymentEvent.current = true;
 
-    isSendingPayingEventEmiiter.addListener(
-      SENDING_PAYMENT_EVENT_NAME,
-      toggleIsSendingPayment
-    );
-  }, []);
+  useEffect(() => {
+    if (
+      !isSendingPayingEventEmiiter.listenerCount(SENDING_PAYMENT_EVENT_NAME)
+    ) {
+      isSendingPayingEventEmiiter.addListener(
+        SENDING_PAYMENT_EVENT_NAME,
+        toggleIsSendingPayment
+      );
+    }
 
-  // This is a function that handles incoming transactions and formmataes it to reqirued formation
-  const handleTransactionUpdate = async (
-    recevedTxId,
-    transactions,
-    balance
-  ) => {
-    try {
-      // First we need to get recent spark transfers
-      if (!transactions)
-        throw new Error("Unable to get transactions from spark");
-      const { transfers } = transactions;
-      let selectedSparkTransaction = transfers.find(
-        (tx) => tx.id === recevedTxId
+    return () => {
+      console.log("clearning up toggle send pament");
+      isSendingPayingEventEmiiter.removeListener(
+        SENDING_PAYMENT_EVENT_NAME,
+        toggleIsSendingPayment
       );
+    };
+  }, [toggleIsSendingPayment]);
+
+  const debouncedHandleIncomingPayment = useCallback(async (balance) => {
+    if (pendingTransferIds.current.size === 0) return;
 
-      if (!selectedSparkTransaction) {
-        console.log("Running full history sweep");
-        const singleTxResponse = await findSignleTxFromHistory(
-          recevedTxId,
-          50,
-          currentWalletMnemoincRef.current
+    const transferIdsToProcess = Array.from(pendingTransferIds.current);
+    pendingTransferIds.current.clear();
+
+    console.log(
+      "Processing debounced incoming payments:",
+      transferIdsToProcess
+    );
+    // let transfersOffset = 0;
+    let cachedTransfers = [];
+
+    for (const transferId of transferIdsToProcess) {
+      try {
+        const transfer = await getSingleTxDetails(
+          currentMnemonicRef.current,
+          transferId
         );
-        if (!singleTxResponse.tx)
-          throw new Error("Unable to find tx in all of history");
-        selectedSparkTransaction = singleTxResponse.tx;
+
+        if (!transfer) continue;
+        cachedTransfers.push(transfer);
+      } catch (error) {
+        console.error("Error processing incoming payment:", transferId, error);
       }
+    }
 
-      console.log(
-        selectedSparkTransaction,
-        "received transaction from spark tx list"
-      );
-      if (!selectedSparkTransaction)
-        throw new Error("Not able to get recent transfer");
+    const paymentObjects = [];
+
+    const [unpaidInvoices, unpaidContactInvoices] = await Promise.all([
+      getAllUnpaidSparkLightningInvoices(),
+      getAllSparkContactInvoices(),
+    ]);
 
-      const unpaidInvoices = await getAllUnpaidSparkLightningInvoices();
-      const paymentObject = await transformTxToPaymentObject(
-        selectedSparkTransaction,
-        sparkInformation.sparkAddress,
+    for (const transferId of transferIdsToProcess) {
+      const tx = cachedTransfers.find((t) => t.id === transferId);
+      if (!tx) continue;
+
+      // Skip UTXO_SWAP handling here — old logic kept
+      if (tx.type === "UTXO_SWAP") continue;
+
+      const paymentObj = await transformTxToPaymentObject(
+        tx,
+        sparkInfoRef.current.sparkAddress,
         undefined,
         false,
         unpaidInvoices,
-        sparkInformation.identityPubKey
+        sparkInfoRef.current.identityPubKey,
+        1,
+        undefined,
+        unpaidContactInvoices
       );
 
-      if (paymentObject) {
-        await bulkUpdateSparkTransactions(
-          [paymentObject],
-          "incomingPayment",
-          0,
-          balance
-        );
+      if (paymentObj) {
+        paymentObjects.push(paymentObj);
       }
-      const savedTxs = await getAllSparkTransactions(
-        5,
-        sparkInformation.identityPubKey
-      );
-      return {
-        txs: savedTxs,
-        paymentObject: paymentObject || {},
-        paymentCreatedTime: new Date(
-          selectedSparkTransaction.createdTime
-        ).getTime(),
-      };
-    } catch (err) {
-      console.log("Handle incoming transaction error", err);
     }
-  };
-  console.log(sparkInformation);
-  const handleIncomingPayment = async (transferId, transactions, balance) => {
-    let storedTransaction = await handleTransactionUpdate(
-      transferId,
-      transactions,
-      balance
-    );
 
-    if (!storedTransaction) {
+    if (!paymentObjects.length) {
+      handleBalanceCache({
+        isCheck: false,
+        passedBalance: balance,
+        mnemonic: currentMnemonicRef.current,
+      });
       setSparkInformation((prev) => ({
         ...prev,
         balance: balance,
@@ -207,135 +350,273 @@ const SparkWalletProvider = ({ children, navigate }) => {
       return;
     }
 
-    const selectedStoredPayment = storedTransaction.txs.find(
-      (tx) => tx.sparkID === transferId
-    );
-    if (!selectedStoredPayment) return;
-    console.log(selectedStoredPayment, "seleceted stored transaction");
-
-    const details = JSON.parse(selectedStoredPayment.details);
-
-    if (details?.shouldNavigate && !details.isLNURL) return;
-    if (details.isLNURL && !details.isBlitzContactPayment) return;
-    if (details.isRestore) return;
-    if (storedTransaction.paymentCreatedTime < sessionTime) return;
-    // Handle confirm animation here
-    navigate("/confirm-page", {
-      state: {
-        for: "invoicePaid",
-        transaction: { ...selectedStoredPayment, details },
-      },
-    });
-  };
+    try {
+      await bulkUpdateSparkTransactions(
+        paymentObjects,
+        "incomingPayment",
+        0,
+        balance
+      );
+    } catch (error) {
+      console.error("bulkUpdateSparkTransactions failed:", error);
+    }
+  }, []);
 
-  const debouncedHandleIncomingPayment = useCallback(
-    async (balance) => {
-      if (pendingTransferIds.current.size === 0) return;
+  const handleUpdate = useCallback(
+    async (...args) => {
+      try {
+        const [updateType = "transactions", fee = 0, passedBalance = 0] = args;
+        const mnemonic = currentMnemonicRef.current;
+        const { identityPubKey, balance: prevBalance } = sparkInfoRef.current;
 
-      const transferIdsToProcess = Array.from(pendingTransferIds.current);
-      pendingTransferIds.current.clear();
+        console.log(
+          "running update in spark context from db changes",
+          updateType
+        );
 
-      console.log(
-        "Processing debounced incoming payments:",
-        transferIdsToProcess
-      );
-      const transactions = await getSparkTransactions(
-        1,
-        undefined,
-        currentWalletMnemoincRef.current
-      );
-      // Process all pending transfer IDs
-      for (const transferId of transferIdsToProcess) {
-        try {
-          await handleIncomingPayment(transferId, transactions, balance);
-        } catch (error) {
-          console.error(
-            "Error processing incoming payment:",
-            transferId,
-            error
+        if (!identityPubKey) {
+          console.warn(
+            "handleUpdate called but identityPubKey is not available yet"
           );
+          return;
         }
-      }
-    },
-    [sparkInformation.identityPubKey]
-  );
 
-  const handleUpdate = async (...args) => {
-    try {
-      const [updateType = "transactions", fee = 0, passedBalance = 0] = args;
-      console.log(
-        "running update in spark context from db changes",
-        updateType
-      );
+        const txs = await getCachedSparkTransactions(null, identityPubKey);
 
-      const txs = await getAllSparkTransactions(
-        null,
-        sparkInformation.identityPubKey
-      );
-      const balance = await getSparkBalance(currentWalletMnemoincRef.current);
-
-      setSparkInformation((prev) => {
-        return {
-          ...prev,
-          transactions: txs || prev.transactions,
-          balance: Math.round(
-            (passedBalance
-              ? passedBalance
-              : balance.didWork
-              ? Number(balance.balance)
-              : prev.balance) - fee
-          ),
-          tokens: balance.tokensObj,
-        };
-      });
-      return;
-      if (
-        updateType === "supportTx" ||
-        updateType === "restoreTxs" ||
-        updateType === "transactions"
-      ) {
-        setSparkInformation((prev) => ({
-          ...prev,
-          transactions: txs || prev.transactions,
-        }));
-        return;
-      }
-      if (updateType === "incomingPayment") {
-        setSparkInformation((prev) => ({
-          ...prev,
-          transactions: txs || prev.transactions,
-          balance: Number(passedBalance),
-        }));
-        return;
-      }
-
-      if (updateType === "paymentWrapperTx") {
-        setSparkInformation((prev) => {
-          return {
+        if (
+          updateType === "lrc20Payments" ||
+          updateType === "txStatusUpdate" ||
+          updateType === "transactions"
+        ) {
+          setSparkInformation((prev) => ({
             ...prev,
             transactions: txs || prev.transactions,
-            balance: Math.round(
-              (balance.didWork ? Number(balance.balance) : prev.balance) - fee
-            ),
-            tokens: balance.tokensObj,
-          };
-        });
-      } else if (updateType === "fullUpdate") {
-        setSparkInformation((prev) => {
-          return {
+          }));
+        } else if (updateType === "incomingPayment") {
+          handleBalanceCache({
+            isCheck: false,
+            passedBalance: Number(passedBalance),
+            mnemonic,
+          });
+          setSparkInformation((prev) => ({
+            ...prev,
+            transactions: txs || prev.transactions,
+            balance: Number(passedBalance),
+          }));
+        } else if (updateType === "fullUpdate-waitBalance") {
+          if (balancePollingAbortControllerRef.current) {
+            balancePollingAbortControllerRef.current.abort();
+          }
+
+          balancePollingAbortControllerRef.current = new AbortController();
+          currentPollingMnemonicRef.current = mnemonic;
+
+          const pollingMnemonic = currentPollingMnemonicRef.current;
+
+          setSparkInformation((prev) => ({
             ...prev,
-            balance: balance.didWork ? Number(balance.balance) : prev.balance,
             transactions: txs || prev.transactions,
-            tokens: balance.tokensObj,
-          };
+          }));
+
+          const poller = createBalancePoller(
+            mnemonic,
+            currentMnemonicRef,
+            balancePollingAbortControllerRef.current,
+            (newBalance) => {
+              setSparkInformation((prev) => {
+                if (pollingMnemonic !== currentMnemonicRef.current) {
+                  return prev;
+                }
+                handleBalanceCache({
+                  isCheck: false,
+                  passedBalance: newBalance,
+                  mnemonic: pollingMnemonic,
+                });
+                return {
+                  ...prev,
+                  balance: newBalance,
+                };
+              });
+            },
+            prevBalance
+          );
+
+          balancePollingTimeoutRef.current = poller;
+          poller.start();
+        } else {
+          const balanceResponse = await getSparkBalance(mnemonic);
+
+          const newBalance = balanceResponse.didWork
+            ? Number(balanceResponse.balance)
+            : prevBalance;
+
+          if (updateType === "paymentWrapperTx") {
+            const updatedBalance = Math.round(newBalance - fee);
+
+            handleBalanceCache({
+              isCheck: false,
+              passedBalance: updatedBalance,
+              mnemonic,
+            });
+
+            setSparkInformation((prev) => ({
+              ...prev,
+              transactions: txs || prev.transactions,
+              balance: updatedBalance,
+              tokens: balanceResponse.didWork
+                ? balanceResponse.tokensObj
+                : prev.tokens,
+            }));
+          } else if (updateType === "fullUpdate-tokens") {
+            setSparkInformation((prev) => ({
+              ...prev,
+              transactions: txs || prev.transactions,
+              tokens: balanceResponse.didWork
+                ? balanceResponse.tokensObj
+                : prev.tokens,
+            }));
+          } else if (updateType === "fullUpdate") {
+            handleBalanceCache({
+              isCheck: false,
+              passedBalance: newBalance,
+              mnemonic,
+            });
+
+            setSparkInformation((prev) => ({
+              ...prev,
+              balance: newBalance,
+              transactions: txs || prev.transactions,
+              tokens: balanceResponse.didWork
+                ? balanceResponse.tokensObj
+                : prev.tokens,
+            }));
+          }
+        }
+
+        if (
+          updateType === "paymentWrapperTx" ||
+          updateType === "transactions" ||
+          updateType === "txStatusUpdate" ||
+          updateType === "lrc20Payments"
+        ) {
+          console.log(
+            "Payment type is send payment, transaction, lrc20 first render, or txstatus update, skipping confirm tx page navigation"
+          );
+          return;
+        }
+        const [lastAddedTx] = await getCachedSparkTransactions(
+          1,
+          identityPubKey
+        );
+
+        console.log(lastAddedTx, "testing");
+
+        if (!lastAddedTx) {
+          console.log(
+            "No transaction found, skipping confirm tx page navigation"
+          );
+
+          return;
+        }
+
+        const parsedTx = {
+          ...lastAddedTx,
+          details: JSON.parse(lastAddedTx.details),
+        };
+
+        if (handledNavigatedTxs.current.has(parsedTx.sparkID)) {
+          console.log(
+            "Already handled transaction, skipping confirm tx page navigation"
+          );
+          return;
+        }
+        handledNavigatedTxs.current.add(parsedTx.sparkID);
+
+        const details = parsedTx?.details;
+
+        if (new Date(details.time).getTime() < sessionTimeRef.current) {
+          console.log(
+            "created before session time was set, skipping confirm tx page navigation"
+          );
+          return;
+        }
+
+        if (isSendingPaymentRef.current) {
+          console.log(
+            "Is sending payment, skipping confirm tx page navigation"
+          );
+          return;
+        }
+
+        if (details.direction === "OUTGOING") {
+          console.log(
+            "Only incoming payments navigate here, skipping confirm tx page navigation"
+          );
+          return;
+        }
+
+        const isOnReceivePage = location.pathname === "/receive";
+
+        const isNewestPayment =
+          !!details?.createdTime || !!details?.time
+            ? new Date(details.createdTime || details?.time).getTime() >
+              newestPaymentTimeRef.current
+            : false;
+
+        let shouldShowConfirm = false;
+
+        if (
+          (lastAddedTx.paymentType?.toLowerCase() === "lightning" &&
+            !details.isLNURL &&
+            !details?.shouldNavigate &&
+            isOnReceivePage &&
+            isNewestPayment) ||
+          (lastAddedTx.paymentType?.toLowerCase() === "spark" &&
+            !details.isLRC20Payment &&
+            isOnReceivePage &&
+            isNewestPayment)
+        ) {
+          if (lastAddedTx.paymentType?.toLowerCase() === "spark") {
+            const upaidLNInvoices = await getAllUnpaidSparkLightningInvoices();
+            const lastMatch = upaidLNInvoices.findLast((invoice) => {
+              const savedInvoiceDetails = JSON.parse(invoice.details);
+              return (
+                !savedInvoiceDetails.sendingUUID &&
+                !savedInvoiceDetails.isLNURL &&
+                invoice.amount === details.amount
+              );
+            });
+
+            if (lastMatch && !usedSavedTxIds.current.has(lastMatch.id)) {
+              usedSavedTxIds.current.add(lastMatch.id);
+              const lastInvoiceDetails = JSON.parse(lastMatch.details);
+              if (details.time - lastInvoiceDetails.createdTime < 60 * 1000) {
+                shouldShowConfirm = true;
+              }
+            }
+          } else {
+            shouldShowConfirm = true;
+          }
+        }
+
+        // Handle confirm animation here
+        setPendingNavigation({
+          tx: parsedTx,
+          amount: details.amount,
+          LRC20Token: details.LRC20Token,
+          isLRC20Payment: !!details.LRC20Token,
+          showFullAnimation: shouldShowConfirm,
         });
+      } catch (err) {
+        console.log("error in spark handle db update function", err);
       }
-    } catch (err) {
-      console.error("Error in handleUpdate:", err);
-    }
-  };
+    },
+    [location]
+  );
 
-  const transferHandler = (transferId, balance) => {
+  const transferHandler = useCallback((transferId, balance) => {
+    if (handledTransfers.current.has(transferId)) return;
+    handledTransfers.current.add(transferId);
     console.log(`Transfer ${transferId} claimed. New balance: ${balance}`);
 
     // Add transferId to pending set
@@ -350,93 +631,150 @@ const SparkWalletProvider = ({ children, navigate }) => {
     debounceTimeoutRef.current = setTimeout(() => {
       debouncedHandleIncomingPayment(balance);
     }, 500);
-  };
+  }, []);
+
+  useEffect(() => {
+    if (!sparkInformation.identityPubKey) {
+      console.log("Skipping listener setup - no identity pub key yet");
+      return;
+    }
+
+    console.log("adding web view listeners");
+
+    sparkTransactionsEventEmitter.removeAllListeners(
+      SPARK_TX_UPDATE_ENVENT_NAME
+    );
+
+    sparkTransactionsEventEmitter.on(SPARK_TX_UPDATE_ENVENT_NAME, handleUpdate);
+
+    return () => {
+      console.log("Cleaning up spark event listeners");
+      sparkTransactionsEventEmitter.removeListener(
+        SPARK_TX_UPDATE_ENVENT_NAME,
+        handleUpdate
+      );
+    };
+  }, [sparkInformation.identityPubKey, handleUpdate, transferHandler]);
 
   const addListeners = async (mode) => {
     console.log("Adding Spark listeners...");
 
-    const walletHash = sha256Hash(currentWalletMnemoincRef.current);
-    if (mode === "full") {
-      if (!sparkTransactionsEventEmitter.listenerCount()) {
-        sparkTransactionsEventEmitter.on(
-          SPARK_TX_UPDATE_ENVENT_NAME,
-          handleUpdate
-        );
-      }
-      if (!sparkWallet[walletHash].listenerCount()) {
-        sparkWallet[walletHash].on("transfer:claimed", transferHandler);
-      }
+    const walletHash = sha256Hash(currentMnemonicRef.current);
 
-      if (isInitialRestore.current) {
-        isInitialRestore.current = false;
-      }
+    try {
+      if (mode === "full") {
+        if (!sparkWallet[walletHash]?.listenerCount()) {
+          sparkWallet[walletHash].on("transfer:claimed", transferHandler);
+        }
 
-      await fullRestoreSparkState({
-        sparkAddress: sparkInformation.sparkAddress,
-        batchSize: isInitialRestore.current ? 15 : 5,
-        isSendingPayment: isSendingPayment,
-        mnemonic: currentWalletMnemoincRef.current,
-        identityPubKey: sparkInformation.identityPubKey,
-      });
-      await updateSparkTxStatus(
-        currentWalletMnemoincRef.current,
-        sparkInformation.identityPubKey
-      );
+        if (!isInitialRestore.current) {
+          if (txPollingAbortControllerRef.current) {
+            txPollingAbortControllerRef.current.abort();
+          }
 
-      if (updatePendingPaymentsIntervalRef.current) {
-        console.log("BLOCKING TRYING TO SET INTERVAL AGAIN");
-        clearInterval(updatePendingPaymentsIntervalRef.current);
-      }
-      updatePendingPaymentsIntervalRef.current = setInterval(async () => {
-        try {
-          await updateSparkTxStatus(
-            currentWalletMnemoincRef.current,
-            sparkInformation.identityPubKey
+          txPollingAbortControllerRef.current = new AbortController();
+          const restorePoller = createRestorePoller(
+            currentMnemonicRef.current,
+            isSendingPaymentRef.current,
+            currentMnemonicRef,
+            txPollingAbortControllerRef.current,
+            (result) => {
+              console.log("RESTORE COMPLETE");
+            },
+            sparkInfoRef.current
           );
-          await getLRC20Transactions({
-            ownerPublicKeys: [sparkInformation.identityPubKey],
-            sparkAddress: sparkInformation.sparkAddress,
-            isInitialRun: isInitialLRC20Run.current,
-            mnemonic: currentWalletMnemoincRef.current,
-          });
-        } catch (err) {
-          console.error("Error during periodic restore:", err);
+
+          restorePoller.start();
         }
-      }, 10 * 1000);
+
+        updateSparkTxStatus(
+          currentMnemonicRef.current,
+          sparkInfoRef.current.identityPubKey
+        );
+
+        if (updatePendingPaymentsIntervalRef.current) {
+          console.log("BLOCKING TRYING TO SET INTERVAL AGAIN");
+          clearInterval(updatePendingPaymentsIntervalRef.current);
+          updatePendingPaymentsIntervalRef.current = null;
+        }
+
+        const capturedMnemonic = currentMnemonicRef.current;
+        const capturedWalletHash = walletHash;
+
+        const intervalId = setInterval(async () => {
+          try {
+            if (capturedMnemonic !== currentMnemonicRef.current) {
+              console.log("Mnemonic changed. Aborting interval.");
+              clearInterval(intervalId);
+              intervalTracker.delete(capturedWalletHash);
+              allIntervalIds.delete(intervalId);
+              return;
+            }
+
+            await updateSparkTxStatus(
+              currentMnemonicRef.current,
+              sparkInfoRef.current.identityPubKey
+            );
+
+            if (capturedMnemonic !== currentMnemonicRef.current) {
+              console.log(
+                "Context changed during updateSparkTxStatus. Aborting getLRC20Transactions."
+              );
+              clearInterval(intervalId);
+              intervalTracker.delete(capturedWalletHash);
+              allIntervalIds.delete(intervalId);
+              return;
+            }
+
+            await getLRC20Transactions({
+              ownerPublicKeys: [sparkInfoRef.current.identityPubKey],
+              sparkAddress: sparkInfoRef.current.sparkAddress,
+              isInitialRun: isInitialLRC20Run.current,
+              mnemonic: currentMnemonicRef.current,
+            });
+            if (isInitialLRC20Run.current) {
+              isInitialLRC20Run.current = false;
+            }
+          } catch (err) {
+            console.error("Error during periodic restore:", err);
+          }
+        }, 10 * 1000);
+
+        if (isInitialRestore.current) {
+          isInitialRestore.current = false;
+        }
+
+        updatePendingPaymentsIntervalRef.current = intervalId;
+        intervalTracker.set(walletHash, intervalId);
+        allIntervalIds.add(intervalId);
+      }
+    } catch (error) {
+      console.error("Error in addListeners:", error);
+    } finally {
+      listenerLock.set(walletHash, false);
+      console.log("Lock released for wallet:", walletHash);
     }
   };
 
-  const removeListeners = () => {
+  const removeListeners = (onlyClearIntervals = false) => {
     console.log("Removing spark listeners");
-    console.log(
-      sparkTransactionsEventEmitter.listenerCount(SPARK_TX_UPDATE_ENVENT_NAME),
-      "Nymber of event emiitter litsenrs"
-    );
-    console.log(
-      sparkWallet[sha256Hash(prevAccountMnemoincRef.current)]?.listenerCount(
-        "transfer:claimed"
-      ),
-      "number of spark wallet listenre"
-    );
-    if (
-      sparkTransactionsEventEmitter.listenerCount(SPARK_TX_UPDATE_ENVENT_NAME)
-    ) {
-      sparkTransactionsEventEmitter.removeAllListeners(
-        SPARK_TX_UPDATE_ENVENT_NAME
-      );
-    }
-    if (
-      sparkWallet[sha256Hash(prevAccountMnemoincRef.current)]?.listenerCount(
-        "transfer:claimed"
-      )
-    ) {
-      sparkWallet[
-        sha256Hash(prevAccountMnemoincRef.current)
-      ]?.removeAllListeners("transfer:claimed");
-    }
+    cleanStatusAndLRC20Intervals();
+    if (!onlyClearIntervals) {
+      if (!prevAccountMnemoincRef.current) {
+        prevAccountMnemoincRef.current = currentMnemonicRef.current;
+        return;
+      }
+      const hashedMnemonic = sha256Hash(prevAccountMnemoincRef.current);
+
+      if (
+        prevAccountMnemoincRef.current &&
+        sparkWallet[hashedMnemonic]?.listenerCount("transfer:claimed")
+      ) {
+        sparkWallet[hashedMnemonic]?.removeAllListeners("transfer:claimed");
+      }
 
-    prevAccountMnemoincRef.current = currentWalletMnemoincRef.current;
-    // sparkWallet?.removeAllListeners('deposit:confirmed');
+      prevAccountMnemoincRef.current = currentMnemonicRef.current;
+    }
 
     // Clear debounce timeout when removing listeners
     if (debounceTimeoutRef.current) {
@@ -451,34 +789,56 @@ const SparkWalletProvider = ({ children, navigate }) => {
       clearInterval(updatePendingPaymentsIntervalRef.current);
       updatePendingPaymentsIntervalRef.current = null;
     }
+    //Clear balance polling
+    if (balancePollingTimeoutRef.current) {
+      clearTimeout(balancePollingTimeoutRef.current);
+      balancePollingTimeoutRef.current = null;
+    }
+    if (balancePollingAbortControllerRef.current) {
+      balancePollingAbortControllerRef.current.abort();
+      balancePollingAbortControllerRef.current = null;
+    }
+    if (txPollingTimeoutRef.current) {
+      clearTimeout(txPollingTimeoutRef.current);
+      txPollingTimeoutRef.current = null;
+    }
+    if (txPollingAbortControllerRef.current) {
+      txPollingAbortControllerRef.current.abort();
+      txPollingAbortControllerRef.current = null;
+    }
+    currentPollingMnemonicRef.current = null;
   };
 
   // Add event listeners to listen for bitcoin and lightning or spark transfers when receiving does not handle sending
   useEffect(() => {
+    if (prevAppState.current !== appState && appState === "background") {
+      console.log("App moved to background — clearing listener type");
+      prevListenerType.current = null;
+    }
+
     const timeoutId = setTimeout(async () => {
       if (!didGetToHomepage) return;
-      if (!sparkInformation.didConnect) return;
+      if (!sparkInfoRef.current.identityPubKey) return;
 
       const getListenerType = () => {
-        if (appState === "active" && !isSendingPayment) return "full";
-        if (appState === "active" && isSendingPayment) return "sparkOnly";
-        return null; // No listeners in background
+        if (appState === "active") return "full";
+        return null;
       };
 
       const newType = getListenerType();
       const prevType = prevListenerType.current;
+      const prevId = prevAccountId.current;
 
-      console.log(prevAppState.current, appState, "APP STATE CHANGE");
-
-      if (prevAppState.current !== appState && appState === "background") {
-        removeListeners();
-        prevListenerType.current = null;
-      }
-
-      if (newType !== prevType && appState === "active") {
+      // Only reconfigure listeners when becoming active
+      if (
+        (newType !== prevType ||
+          prevId !== sparkInfoRef.current.identityPubKey) &&
+        appState === "active"
+      ) {
         removeListeners();
-        if (newType) addListeners(newType);
+        if (newType) await addListeners(newType);
         prevListenerType.current = newType;
+        prevAccountId.current = sparkInfoRef.current.identityPubKey;
       }
 
       prevAppState.current = appState;
@@ -488,24 +848,28 @@ const SparkWalletProvider = ({ children, navigate }) => {
   }, [
     appState,
     sparkInformation.didConnect,
+    sparkInformation.identityPubKey,
     didGetToHomepage,
-    isSendingPayment,
   ]);
 
   useEffect(() => {
     if (!didGetToHomepage) return;
     if (!sparkInformation.didConnect) return;
+    if (!sparkInformation.identityPubKey) return;
+
     // Interval to check deposit addresses to see if they were paid
     const handleDepositAddressCheck = async () => {
       try {
         console.log("l1Deposit check running....");
+        if (isSendingPaymentRef.current) return;
+        if (!currentMnemonicRef.current) return;
         const allTxs = await getAllSparkTransactions(
           null,
           sparkInformation.identityPubKey
         );
         const savedTxMap = new Map(allTxs.map((tx) => [tx.sparkID, tx]));
         const depoistAddress = await queryAllStaticDepositAddresses(
-          currentWalletMnemoincRef.current
+          currentMnemonicRef.current
         );
 
         // Loop through deposit addresses and check if they have been paid
@@ -521,16 +885,11 @@ const SparkWalletProvider = ({ children, navigate }) => {
           );
           console.log("Deposit address txids:", txids);
           if (!txids || !txids.length) continue;
+
           const unpaidTxids = txids.filter((txid) => !txid.didClaim);
           let claimedTxs = Storage.getItem("claimedBitcoinTxs") || [];
 
           for (const txid of unpaidTxids) {
-            // get quote for the txid
-            const { didwork, quote, error } =
-              await getSparkStaticBitcoinL1AddressQuote(
-                txid.txid,
-                currentWalletMnemoincRef.current
-              );
             const hasAlreadySaved = savedTxMap.has(txid.txid);
 
             if (!txid.isConfirmed) {
@@ -541,19 +900,36 @@ const SparkWalletProvider = ({ children, navigate }) => {
                     creditAmountSats: txid.amount - txid.fee,
                   },
                   address,
-                  sparkInformation
+                  sparkInfoRef.current
                 );
               }
+              continue;
             }
+            // get quote for the txid
+            const {
+              didwork: quoteDidWorkResponse,
+              quote,
+              error,
+            } = await getSparkStaticBitcoinL1AddressQuote(
+              txid.txid,
+              currentMnemonicRef.current
+            );
 
-            console.log("Deposit address quote:", quote);
-
-            if (!didwork || !quote) {
+            if (!quoteDidWorkResponse || !quote) {
               console.log(error, "Error getting deposit address quote");
               if (
                 error.includes("UTXO is already claimed by the current user.")
               ) {
                 handleTxIdState(txid, true, address);
+              } else if (!hasAlreadySaved) {
+                await addPendingTransaction(
+                  {
+                    transactionId: txid.txid,
+                    creditAmountSats: txid.amount - txid.fee,
+                  },
+                  address,
+                  sparkInfoRef.current
+                );
               }
               continue;
             }
@@ -569,9 +945,14 @@ const SparkWalletProvider = ({ children, navigate }) => {
             } = await claimnSparkStaticDepositAddress({
               ...quote,
               sspSignature: quote.signature,
-              mnemonic: currentWalletMnemoincRef.current,
+              mnemonic: currentMnemonicRef.current,
             });
 
+            // Add pending transaction if not already saved (after successful claim)
+            if (!hasAlreadySaved) {
+              await addPendingTransaction(quote, address, sparkInfoRef.current);
+            }
+
             if (!claimTx || !didWork) {
               console.log("Claim static deposit address error", claimError);
               if (
@@ -583,10 +964,6 @@ const SparkWalletProvider = ({ children, navigate }) => {
               continue;
             }
 
-            if (!hasAlreadySaved) {
-              await addPendingTransaction(quote, address, sparkInformation);
-            }
-
             console.log("Claimed deposit address transaction:", claimTx);
 
             if (!claimedTxs?.includes(quote.signature)) {
@@ -597,53 +974,56 @@ const SparkWalletProvider = ({ children, navigate }) => {
 
             await new Promise((res) => setTimeout(res, 2000));
 
-            const findBitcoinTxResponse = await findSignleTxFromHistory(
-              claimTx.transferId,
-              5,
-              currentWalletMnemoincRef.current
+            const bitcoinTransfer = await getSingleTxDetails(
+              currentMnemonicRef.current,
+              claimTx.transferId
             );
 
             let updatedTx = {};
-            if (!findBitcoinTxResponse.tx) {
+            if (!bitcoinTransfer) {
               updatedTx = {
                 useTempId: true,
                 id: claimTx.transferId,
                 tempId: quote.transactionId,
                 paymentStatus: "pending",
                 paymentType: "bitcoin",
-                accountId: sparkInformation.identityPubKey,
+                accountId: sparkInfoRef.current.identityPubKey,
               };
             } else {
-              const { tx: bitcoinTransfer } = findBitcoinTxResponse;
-              if (!bitcoinTransfer) {
-                updatedTx = {
-                  useTempId: true,
-                  id: claimTx.transferId,
-                  tempId: quote.transactionId,
-                  paymentStatus: "pending",
-                  paymentType: "bitcoin",
-                  accountId: sparkInformation.identityPubKey,
-                };
-              } else {
-                updatedTx = {
-                  useTempId: true,
-                  tempId: quote.transactionId,
-                  id: bitcoinTransfer.id,
-                  paymentStatus: "completed",
-                  paymentType: "bitcoin",
-                  accountId: sparkInformation.identityPubKey,
-                  details: {
-                    amount: bitcoinTransfer.totalValue,
-                    fee: Math.abs(
-                      quote.creditAmountSats - bitcoinTransfer.totalValue
-                    ),
-                  },
-                };
-              }
+              updatedTx = {
+                useTempId: true,
+                tempId: quote.transactionId,
+                id: bitcoinTransfer.id,
+                paymentStatus: "completed",
+                paymentType: "bitcoin",
+                accountId: sparkInfoRef.current.identityPubKey,
+                details: {
+                  amount: bitcoinTransfer.totalValue,
+                  fee: Math.abs(
+                    (txid.amount || quote.creditAmountSats) -
+                      bitcoinTransfer.totalValue
+                  ),
+                  totalFee: Math.abs(
+                    (txid.amount || quote.creditAmountSats) -
+                      bitcoinTransfer.totalValue
+                  ),
+                  supportFee: 0,
+                },
+              };
             }
-
-            await bulkUpdateSparkTransactions([updatedTx], "fullUpdate");
             console.log("Updated bitcoin transaction:", updatedTx);
+            await bulkUpdateSparkTransactions([updatedTx], "fullUpdate");
+            // If no details are provided do not show confirm screen
+            // Navigate here, since bulkUpdateSparkTransactions will default to transactions and get blocked in other path
+            if (updatedTx.details) {
+              if (handledNavigatedTxs.current.has(updatedTx.id)) return;
+              handledNavigatedTxs.current.add(updatedTx.id);
+              setPendingNavigation({
+                tx: updatedTx,
+                amount: updatedTx.details.amount,
+                showFullAnimation: false,
+              });
+            }
           }
         }
       } catch (err) {
@@ -663,7 +1043,7 @@ const SparkWalletProvider = ({ children, navigate }) => {
           address: address,
           time: new Date().getTime(),
           direction: "INCOMING",
-          description: "Deposit address payment",
+          description: i18next.t("contexts.spark.depositLabel"),
           onChainTxid: quote.transactionId,
           isRestore: true, // This is a restore payment
         },
@@ -671,19 +1051,78 @@ const SparkWalletProvider = ({ children, navigate }) => {
       await addSingleSparkTransaction(pendingTx);
     };
 
+    clearAllDepositIntervals();
     if (depositAddressIntervalRef.current) {
       clearInterval(depositAddressIntervalRef.current);
+      depositAddressIntervalRef.current = null;
     }
-    if (isSendingPayment) return;
+
     if (!initialBitcoinIntervalRun.current) {
       setTimeout(handleDepositAddressCheck, 1_000 * 5);
       initialBitcoinIntervalRun.current = true;
     }
-    depositAddressIntervalRef.current = setInterval(
+
+    const depositIntervalId = setInterval(
       handleDepositAddressCheck,
       1_000 * 60
     );
-  }, [didGetToHomepage, sparkInformation.didConnect, isSendingPayment]);
+
+    depositAddressIntervalRef.current = depositIntervalId;
+    depositIntervalIds.add(depositIntervalId);
+
+    return () => {
+      console.log("Cleaning up deposit interval on unmount/dependency change");
+      if (depositIntervalId) {
+        clearInterval(depositIntervalId);
+        depositIntervalIds.delete(depositIntervalId);
+      }
+      if (depositAddressIntervalRef.current) {
+        clearInterval(depositAddressIntervalRef.current);
+        depositAddressIntervalRef.current = null;
+      }
+    };
+  }, [didGetToHomepage, sparkInformation.didConnect]);
+
+  // Run fullRestore when didConnect becomes true
+  useEffect(() => {
+    if (!sparkInformation.didConnect) return;
+    if (!sparkInformation.identityPubKey) return;
+    if (didRunInitialRestore.current) return;
+    didRunInitialRestore.current = true;
+
+    async function runRestore() {
+      const restoreResponse = await fullRestoreSparkState({
+        sparkAddress: sparkInfoRef.current.sparkAddress,
+        batchSize: isInitialRestore.current ? 5 : 2,
+        isSendingPayment: isSendingPaymentRef.current,
+        mnemonic: currentMnemonicRef.current,
+        identityPubKey: sparkInfoRef.current.identityPubKey,
+        isInitialRestore: isInitialRestore.current,
+      });
+
+      if (!restoreResponse) {
+        setRestoreCompleted(true); // This will get the transactions for the session
+      }
+    }
+
+    runRestore();
+  }, [sparkInformation.didConnect, sparkInformation.identityPubKey]);
+
+  // Run transactions after BOTH restore completes
+  useEffect(() => {
+    if (!restoreCompleted) return;
+
+    async function fetchTransactions() {
+      const transactions = await getCachedSparkTransactions(
+        null,
+        sparkInfoRef.current.identityPubKey
+      );
+      setSparkInformation((prev) => ({ ...prev, transactions }));
+      hasRestoreCompleted.current = true;
+    }
+
+    fetchTransactions();
+  }, [restoreCompleted]);
 
   // This function connects to the spark node and sets the session up
 
@@ -694,6 +1133,7 @@ const SparkWalletProvider = ({ children, navigate }) => {
       // toggleGlobalContactsInformation,
       // globalContactsInformation,
       mnemonic: accountMnemoinc,
+      hasRestoreCompleted: hasRestoreCompleted.current,
     });
 
     console.log(didWork, "did Connect to spark");
@@ -709,6 +1149,8 @@ const SparkWalletProvider = ({ children, navigate }) => {
   useEffect(() => {
     if (!sparkInformation.didConnect) return;
     if (!globalContactsInformation?.myProfile) return;
+    if (!sparkInformation.identityPubKey) return;
+    if (!sparkInformation.sparkAddress) return;
 
     if (sparkDBaddress.current) return;
     sparkDBaddress.current = true;
@@ -728,34 +1170,23 @@ const SparkWalletProvider = ({ children, navigate }) => {
         true
       );
     }
-  }, [globalContactsInformation.myProfile, sparkInformation]);
-
-  // This function checks to see if there are any liquid funds that need to be sent to spark
-  useEffect(() => {
-    async function swapLiquidToSpark() {
-      try {
-        if (liquidNodeInformation.userBalance > minMaxLiquidSwapAmounts.min) {
-          setPendingLiquidPayment(true);
-          await liquidToSparkSwap(
-            globalContactsInformation.myProfile.uniqueName
-          );
-        }
-      } catch (err) {
-        console.log("transfering liquid to spark error", err);
-      }
-    }
-
-    if (!didGetToHomepage) return;
-    if (!sparkInformation.didConnect) return;
-    swapLiquidToSpark();
   }, [
-    didGetToHomepage,
-    liquidNodeInformation,
-    minMaxLiquidSwapAmounts,
+    globalContactsInformation.myProfile,
     sparkInformation.didConnect,
-    globalContactsInformation?.myProfile?.uniqueName,
+    sparkInformation.identityPubKey,
+    sparkInformation.sparkAddress,
   ]);
 
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      if (debounceTimeoutRef.current) {
+        clearTimeout(debounceTimeoutRef.current);
+      }
+      pendingTransferIds.current.clear();
+    };
+  }, []);
+
   const contextValue = useMemo(
     () => ({
       sparkInformation,
@@ -765,10 +1196,9 @@ const SparkWalletProvider = ({ children, navigate }) => {
       numberOfIncomingLNURLPayments,
       setNumberOfIncomingLNURLPayments,
       numberOfConnectionTries,
-      numberOfCachedTxs,
-      setNumberOfCachedTxs,
-      setStartConnectingToSpark,
+
       connectToSparkWallet,
+      isSendingPaymentRef,
     }),
     [
       sparkInformation,
@@ -778,10 +1208,9 @@ const SparkWalletProvider = ({ children, navigate }) => {
       numberOfIncomingLNURLPayments,
       setNumberOfIncomingLNURLPayments,
       numberOfConnectionTries,
-      numberOfCachedTxs,
-      setNumberOfCachedTxs,
-      setStartConnectingToSpark,
+
       connectToSparkWallet,
+      isSendingPaymentRef,
     ]
   );
 
diff --git a/src/contexts/toastManager.css b/src/contexts/toastManager.css
new file mode 100644
index 0000000..baf6f74
--- /dev/null
+++ b/src/contexts/toastManager.css
@@ -0,0 +1,105 @@
+.toast-container {
+  position: fixed;
+  top: 20px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 95%;
+  max-width: 500px;
+  z-index: 1000;
+  pointer-events: none;
+}
+
+.toast {
+  border-radius: 12px;
+  padding: 16px 20px;
+  margin-bottom: 12px;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  opacity: 0;
+  transform: translateY(-20px);
+  transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
+  pointer-events: all;
+  cursor: grab;
+  user-select: none;
+}
+
+.toast:active {
+  cursor: grabbing;
+}
+
+.toast-visible {
+  opacity: 1;
+  transform: translateY(0);
+}
+
+.toast-clipboard {
+  background: var(--dmt);
+}
+.toast-confirmTx {
+  background: var(--dmt);
+}
+
+.toast-error {
+  background: linear-gradient(135deg, #f44336 0%, #d32f2f 100%);
+  border-color: #ef5350;
+}
+
+.toast-warning {
+  background: linear-gradient(135deg, #ff9800 0%, #f57c00 100%);
+  border-color: #ffa726;
+}
+
+.toast-info {
+  background: linear-gradient(135deg, #2196f3 0%, #1976d2 100%);
+  border-color: #42a5f5;
+}
+
+.toast-success {
+  background: linear-gradient(135deg, #4caf50 0%, #388e3c 100%);
+  border-color: #66bb6a;
+}
+
+.toast-content {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.toast-icon {
+  font-size: 24px;
+  flex-shrink: 0;
+}
+
+.toast-text {
+  flex: 1;
+  min-width: 0;
+}
+
+.toast-title {
+  color: white;
+  font-size: 15px;
+  font-weight: 500;
+  display: block;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.toast-message {
+  margin: 0;
+  font-size: 0.8em;
+}
+
+@media (max-width: 640px) {
+  .demo-title {
+    font-size: 2rem;
+  }
+
+  .button-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .toast-container {
+    width: 90%;
+  }
+}
diff --git a/src/contexts/toastManager.jsx b/src/contexts/toastManager.jsx
new file mode 100644
index 0000000..79895d6
--- /dev/null
+++ b/src/contexts/toastManager.jsx
@@ -0,0 +1,316 @@
+import { Clipboard, HelpCircle } from "lucide-react";
+import React, {
+  createContext,
+  useContext,
+  useReducer,
+  useCallback,
+  useEffect,
+  useRef,
+  useState,
+} from "react";
+import { Colors } from "../constants/theme";
+import "./toastManager.css";
+import ThemeText from "../components/themeText/themeText";
+import { useTranslation } from "react-i18next";
+import displayCorrectDenomination from "../functions/displayCorrectDenomination";
+import { useSpark } from "./sparkContext";
+import { useNodeContext } from "./nodeContext";
+import { useGlobalContextProvider } from "./masterInfoObject";
+import { formatTokensNumber } from "../functions/lrc20/formatTokensBalance";
+
+// Toast Context
+const ToastContext = createContext();
+
+const initialState = {
+  toasts: [],
+};
+
+const toastReducer = (state, action) => {
+  switch (action.type) {
+    case "ADD_TOAST":
+      return {
+        ...state,
+        toasts: [...state.toasts, action.payload],
+      };
+    case "REMOVE_TOAST":
+      return {
+        ...state,
+        toasts: state.toasts.filter((toast) => toast.id !== action.payload),
+      };
+    case "CLEAR_TOASTS":
+      return {
+        ...state,
+        toasts: [],
+      };
+    default:
+      return state;
+  }
+};
+
+// Toast Provider Component
+export const ToastProvider = ({ children }) => {
+  const [state, dispatch] = useReducer(toastReducer, initialState);
+
+  const showToast = useCallback((toast) => {
+    const id = Date.now() + Math.random();
+    const toastWithId = {
+      id,
+      type: "success",
+      duration: 3000,
+      position: "top",
+      ...toast,
+    };
+
+    dispatch({ type: "ADD_TOAST", payload: toastWithId });
+
+    if (toastWithId.duration > 0) {
+      setTimeout(() => {
+        dispatch({ type: "REMOVE_TOAST", payload: id });
+      }, toastWithId.duration);
+    }
+
+    return id;
+  }, []);
+
+  const hideToast = useCallback((id) => {
+    dispatch({ type: "REMOVE_TOAST", payload: id });
+  }, []);
+
+  const clearToasts = useCallback(() => {
+    dispatch({ type: "CLEAR_TOASTS" });
+  }, []);
+
+  return (
+    <ToastContext.Provider
+      value={{
+        toasts: state.toasts,
+        showToast,
+        hideToast,
+        clearToasts,
+      }}
+    >
+      {children}
+    </ToastContext.Provider>
+  );
+};
+
+// Custom hook to use toast
+export const useToast = () => {
+  const context = useContext(ToastContext);
+  if (!context) {
+    throw new Error("useToast must be used within a ToastProvider");
+  }
+  return context;
+};
+
+// Individual Toast Component
+const Toast = ({
+  toast,
+  onHide,
+  fiatStats,
+  sparkInformation,
+  masterInfoObject,
+}) => {
+  const [isVisible, setIsVisible] = useState(false);
+  const [isDragging, setIsDragging] = useState(false);
+  const [dragY, setDragY] = useState(0);
+  const toastRef = useRef(null);
+  const startY = useRef(0);
+  const { t } = useTranslation();
+
+  useEffect(() => {
+    // Animate in
+    setTimeout(() => setIsVisible(true), 10);
+  }, []);
+
+  const handleAnimateOut = useCallback(() => {
+    setIsVisible(false);
+    setTimeout(() => {
+      onHide();
+    }, 300);
+  }, [onHide]);
+
+  const handleMouseDown = (e) => {
+    setIsDragging(true);
+    startY.current = e.clientY;
+  };
+
+  const handleTouchStart = (e) => {
+    setIsDragging(true);
+    startY.current = e.touches[0].clientY;
+  };
+
+  const handleMouseMove = (e) => {
+    if (!isDragging) return;
+    const currentY = e.clientY;
+    const diff = currentY - startY.current;
+    if (diff < 0) {
+      setDragY(diff);
+    }
+  };
+
+  const handleTouchMove = (e) => {
+    if (!isDragging) return;
+    const currentY = e.touches[0].clientY;
+    const diff = currentY - startY.current;
+    if (diff < 0) {
+      setDragY(diff);
+    }
+  };
+
+  const handleDragEnd = () => {
+    setIsDragging(false);
+    if (dragY < -20) {
+      handleAnimateOut();
+    } else {
+      setDragY(0);
+    }
+  };
+
+  useEffect(() => {
+    if (isDragging) {
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleDragEnd);
+      document.addEventListener("touchmove", handleTouchMove);
+      document.addEventListener("touchend", handleDragEnd);
+    }
+    return () => {
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleDragEnd);
+      document.removeEventListener("touchmove", handleTouchMove);
+      document.removeEventListener("touchend", handleDragEnd);
+    };
+  }, [isDragging, dragY]);
+
+  const getToastClass = () => {
+    const classes = ["toast"];
+    switch (toast.type) {
+      case "clipboard":
+        classes.push("toast-clipboard");
+        break;
+      case "confirmTx":
+        classes.push("toast-clipboard");
+        break;
+      case "error":
+        classes.push("toast-error");
+        break;
+      case "warning":
+        classes.push("toast-warning");
+        break;
+      case "info":
+        classes.push("toast-info");
+        break;
+      default:
+        classes.push("toast-default");
+    }
+    if (isVisible) classes.push("toast-visible");
+    return classes.join(" ");
+  };
+
+  const getIconForType = () => {
+    switch (toast.type) {
+      case "clipboard":
+        return "📋";
+      case "confirmTx":
+        return "ℹ️";
+      case "error":
+        return "✕";
+      case "warning":
+        return "⚠️";
+      case "info":
+        return "ℹ️";
+      case "success":
+        return "✓";
+      default:
+        return "•";
+    }
+  };
+  const token = toast.isLRC20Payment
+    ? sparkInformation.tokens?.[toast?.LRC20Token]
+    : "";
+
+  const formattedTokensBalance =
+    toast.type === "confirmTx" && !!token
+      ? formatTokensNumber(toast.amount, token?.tokenMetadata?.decimals)
+      : 0;
+
+  const toastStyle = {
+    transform: `translateY(${dragY}px)`,
+    transition: isDragging ? "none" : "transform 0.3s ease",
+  };
+
+  return (
+    <div
+      ref={toastRef}
+      className={getToastClass()}
+      style={toastStyle}
+      onMouseDown={handleMouseDown}
+      onTouchStart={handleTouchStart}
+    >
+      <div className="toast-content">
+        {toast.type === "clipboard" ? (
+          <Clipboard color={Colors.light.text} />
+        ) : toast.type === "confirmTx" ? (
+          <HelpCircle color={Colors.light.text} />
+        ) : (
+          <ThemeText content={getIconForType()} />
+        )}
+        <div className="toast-text">
+          {toast.type === "confirmTx" ? (
+            <>
+              <ThemeText
+                CustomNumberOfLines={1}
+                textStyles={{ fontWeight: 500 }}
+                className={"toast-message"}
+                textContent={t("pushNotifications.paymentReceived.title")}
+              />
+              <ThemeText
+                CustomNumberOfLines={1}
+                className={"toast-message"}
+                textContent={t("pushNotifications.paymentReceived.body", {
+                  totalAmount: displayCorrectDenomination({
+                    amount: token ? formattedTokensBalance : toast.amount,
+                    masterInfoObject,
+                    fiatStats,
+                    useCustomLabel: !!token,
+                    customLabel: token?.tokenMetadata?.tokenTicker,
+                    useMillionDenomination: true,
+                  }),
+                })}
+              />
+            </>
+          ) : (
+            <ThemeText
+              className={"toast-message"}
+              CustomNumberOfLines={1}
+              textContent={t(toast.title)}
+            />
+          )}
+        </div>
+      </div>
+    </div>
+  );
+};
+
+// Toast Container Component
+export const ToastContainer = () => {
+  const { toasts, hideToast } = useToast();
+  const { sparkInformation } = useSpark();
+  const { fiatStats } = useNodeContext();
+  const { masterInfoObject } = useGlobalContextProvider();
+
+  return (
+    <div className="toast-container">
+      {toasts.map((toast) => (
+        <Toast
+          key={toast.id}
+          toast={toast}
+          onHide={() => hideToast(toast.id)}
+          sparkInformation={sparkInformation}
+          fiatStats={fiatStats}
+          masterInfoObject={masterInfoObject}
+        />
+      ))}
+    </div>
+  );
+};
diff --git a/src/fonts.css b/src/fonts.css
index fe9b6d3..d9c7e5f 100644
--- a/src/fonts.css
+++ b/src/fonts.css
@@ -1,3 +1,10 @@
+@font-face {
+  font-family: "Blitzicons1";
+  src: url("./assets/fonts/Blitzicons1.ttf") format("truetype");
+  font-weight: normal;
+  font-style: normal;
+}
+
 /* 100 Thin */
 @font-face {
   font-family: "Poppins";
diff --git a/src/functions/apps/giftCardPurchaseTracker.js b/src/functions/apps/giftCardPurchaseTracker.js
new file mode 100644
index 0000000..c3dbd11
--- /dev/null
+++ b/src/functions/apps/giftCardPurchaseTracker.js
@@ -0,0 +1,57 @@
+import i18next from "i18next";
+import { SATSPERBITCOIN } from "../../constants";
+import { isMoreThanADayOld } from "../rotateAddressDateChecker";
+import Storage from "../localStorage";
+
+export default async function giftCardPurchaseAmountTracker({
+  sendingAmountSat,
+  USDBTCValue,
+  testOnly = false,
+}) {
+  const currentTime = new Date();
+  try {
+    Storage.getItem;
+    const dailyPurchaseAmount = Storage.getItem("dailyPurchaeAmount");
+
+    if (dailyPurchaseAmount) {
+      if (isMoreThanADayOld(dailyPurchaseAmount.date)) {
+        if (!testOnly) {
+          Storage.setItem("dailyPurchaeAmount", {
+            date: currentTime,
+            amount: sendingAmountSat,
+          });
+        }
+      } else {
+        const totalPurchaseAmount = Math.round(
+          ((dailyPurchaseAmount.amount + sendingAmountSat) / SATSPERBITCOIN) *
+            USDBTCValue.value
+        );
+
+        if (totalPurchaseAmount > 9000)
+          throw new Error(
+            i18next.t(
+              "apps.giftCards.expandedGiftCardPage.dailyPurchaseAmountError"
+            )
+          );
+
+        if (!testOnly) {
+          Storage.setItem("dailyPurchaeAmount", {
+            date: dailyPurchaseAmount.date,
+            amount: dailyPurchaseAmount.amount + sendingAmountSat,
+          });
+        }
+      }
+    } else {
+      if (!testOnly) {
+        Storage.setItem("dailyPurchaeAmount", {
+          date: currentTime,
+          amount: sendingAmountSat,
+        });
+      }
+    }
+    return { shouldBlock: false };
+  } catch (err) {
+    console.log(err);
+    return { shouldBlock: true, reason: err.message };
+  }
+}
diff --git a/src/functions/cachedImage.js b/src/functions/cachedImage.js
new file mode 100644
index 0000000..1e8e8cb
--- /dev/null
+++ b/src/functions/cachedImage.js
@@ -0,0 +1,126 @@
+/**
+ * getCachedProfileImage.js
+ * Browser-compatible profile image caching using storage.js
+ */
+
+import { getStorage, ref, getDownloadURL, getMetadata } from "firebase/storage";
+import {
+  deleteCachedImage,
+  downloadAndCacheImage,
+  getCachedImage,
+  getCachedImageMetadata,
+} from "./images/storage";
+import { BLITZ_PROFILE_IMG_STORAGE_REF } from "../constants";
+
+// Helper to generate cache key
+const CACHE_KEY = (uuid) => `${BLITZ_PROFILE_IMG_STORAGE_REF}/${uuid}`;
+
+/**
+ * Get cached profile image from Firebase Storage
+ * Checks cache first, validates against Firebase metadata, downloads if needed
+ *
+ * @param {string} uuid - User unique identifier
+ * @param {Object} storage - Firebase storage instance (optional, will use default if not provided)
+ * @param {boolean} asDataURL - If true, returns data URL; if false, returns object URL
+ * @returns {Promise<{localUri: string, updated: string, isObjectURL?: boolean}|null>}
+ */
+export async function getCachedProfileImage(
+  uuid,
+  storage = null,
+  asDataURL = true
+) {
+  try {
+    // Use provided storage or get default
+    const storageInstance = storage || getStorage();
+
+    const key = CACHE_KEY(uuid);
+
+    // Get Firebase Storage reference
+    const reference = ref(
+      storageInstance,
+      `${BLITZ_PROFILE_IMG_STORAGE_REF}/${uuid}.jpg`
+    );
+
+    // Get metadata from Firebase to check if image has been updated
+    const metadata = await getMetadata(reference);
+    const updated = metadata.updated;
+
+    // Check for cached image and its metadata
+    const cachedMetadata = await getCachedImageMetadata(key);
+
+    // If cached version matches current version, return cached image
+    if (cachedMetadata?.updated === updated) {
+      const cachedImage = await getCachedImage(key, asDataURL);
+
+      if (cachedImage) {
+        return {
+          localUri: cachedImage.uri,
+          updated: cachedMetadata.updated,
+          isObjectURL: cachedImage.isObjectURL,
+        };
+      }
+    }
+
+    // Download new image if cache is stale or doesn't exist
+    const url = await getDownloadURL(reference);
+
+    // Download and cache the image with metadata
+    const blob = await downloadAndCacheImage(key, url, { updated });
+
+    if (!blob) {
+      throw new Error("Failed to download image");
+    }
+
+    // Get the newly cached image
+    const cachedImage = await getCachedImage(key, asDataURL);
+
+    if (!cachedImage) {
+      throw new Error("Failed to retrieve cached image");
+    }
+
+    return {
+      localUri: cachedImage.uri,
+      updated,
+      isObjectURL: cachedImage.isObjectURL,
+    };
+  } catch (e) {
+    console.log("Error caching profile image:", e);
+    return null;
+  }
+}
+
+/**
+ * Preload multiple profile images into cache
+ * Useful for loading images in bulk (e.g., contact list)
+ *
+ * @param {string[]} uuids - Array of user UUIDs
+ * @param {Object} storage - Firebase storage instance
+ * @returns {Promise<Object>} Object with success/failure counts
+ */
+export async function preloadProfileImages(uuids, storage = null) {
+  const storageInstance = storage || getStorage();
+  const results = {
+    success: 0,
+    failed: 0,
+    errors: [],
+  };
+
+  await Promise.all(
+    uuids.map(async (uuid) => {
+      try {
+        const result = await getCachedProfileImage(uuid, storageInstance);
+        if (result) {
+          results.success++;
+        } else {
+          results.failed++;
+          results.errors.push({ uuid, error: "Failed to cache" });
+        }
+      } catch (e) {
+        results.failed++;
+        results.errors.push({ uuid, error: e.message });
+      }
+    })
+  );
+
+  return results;
+}
diff --git a/src/functions/contacts/index.js b/src/functions/contacts/index.js
index 1eb76d7..0f0e6e7 100644
--- a/src/functions/contacts/index.js
+++ b/src/functions/contacts/index.js
@@ -1,10 +1,98 @@
-import {uniqueNamesGenerator, animals, names} from 'unique-names-generator';
+import { uniqueNamesGenerator, animals, names } from "unique-names-generator";
+import i18next from "i18next";
 
 export function generateRandomContact() {
   const randomName = uniqueNamesGenerator({
     dictionaries: [names, animals],
-    separator: '',
+    separator: "",
   }); // big_red_donkey
 
-  return {uniqueName: randomName + Math.ceil(Math.random() * 99)};
+  return { uniqueName: randomName + Math.ceil(Math.random() * 99) };
+}
+
+export async function getBolt11InvoiceForContact(
+  contactUniqueName,
+  sendingValue,
+  description,
+  useBlitzContact = true,
+  domain = "blitzwalletapp.com",
+  sendingUUID
+) {
+  try {
+    let runCount = 0;
+    let maxRunCount = 2;
+    let invoice = null;
+
+    while (runCount < maxRunCount) {
+      try {
+        const url = `https://${domain}/.well-known/lnurlp/${contactUniqueName}?amount=${
+          sendingValue * 1000
+        }&isBlitzContact=${useBlitzContact ? true : false}${
+          description ? `&comment=${encodeURIComponent(description || "")}` : ""
+        }&sendingUUID=${sendingUUID}`;
+        console.log(url);
+        const response = await fetch(url);
+        const data = await response.json();
+        if (data.status !== "OK" && !data?.pr)
+          throw new Error("Not able to get invoice");
+        invoice = data.pr;
+        break;
+      } catch (err) {
+        console.log("Error getting invoice trying again", err);
+        await new Promise((res) => setTimeout(res, 1000));
+      }
+      runCount += 1;
+    }
+
+    return invoice;
+  } catch (err) {
+    console.log("get ln address for liquid payment error", err);
+    return false;
+  }
+}
+
+export function getTimeDisplay(
+  timeDifferenceMinutes,
+  timeDifferenceHours,
+  timeDifferenceDays,
+  timeDifferenceYears
+) {
+  const timeValue =
+    timeDifferenceMinutes <= 60
+      ? timeDifferenceMinutes < 1
+        ? ""
+        : Math.round(timeDifferenceMinutes)
+      : timeDifferenceHours <= 24
+      ? Math.round(timeDifferenceHours)
+      : timeDifferenceDays <= 365
+      ? Math.round(timeDifferenceDays)
+      : Math.round(timeDifferenceYears);
+
+  const timeUnit =
+    timeDifferenceMinutes <= 60
+      ? timeDifferenceMinutes < 1
+        ? i18next.t("transactionLabelText.txTime_just_now")
+        : Math.round(timeDifferenceMinutes) === 1
+        ? i18next.t("timeLabels.minute")
+        : i18next.t("timeLabels.minutes")
+      : timeDifferenceHours <= 24
+      ? Math.round(timeDifferenceHours) === 1
+        ? i18next.t("timeLabels.hour")
+        : i18next.t("timeLabels.hours")
+      : timeDifferenceDays <= 365
+      ? Math.round(timeDifferenceDays) === 1
+        ? i18next.t("timeLabels.day")
+        : i18next.t("timeLabels.days")
+      : Math.round(timeDifferenceYears) === 1
+      ? i18next.t("timeLabels.year")
+      : i18next.t("timeLabels.years");
+
+  const suffix =
+    timeDifferenceMinutes > 1
+      ? ` ${i18next.t("transactionLabelText.ago")}`
+      : "";
+
+  return `${timeValue}${
+    timeUnit === i18next.t("transactionLabelText.txTime_just_now") ? "" : " "
+  }${timeUnit}${suffix}`;
 }
diff --git a/src/functions/contacts/navigateToExpandedContact.js b/src/functions/contacts/navigateToExpandedContact.js
index 7093107..50e6d2b 100644
--- a/src/functions/contacts/navigateToExpandedContact.js
+++ b/src/functions/contacts/navigateToExpandedContact.js
@@ -22,7 +22,7 @@ export default async function navigateToExpandedContact(
     toggleGlobalContactsInformation(
       {
         myProfile: { ...globalContactsInformation.myProfile },
-        addedContacts: encryptMessage(
+        addedContacts: await encryptMessage(
           contactsPrivateKey,
           publicKey,
           JSON.stringify(newAddedContacts)
diff --git a/src/functions/displayCorrectDenomination.js b/src/functions/displayCorrectDenomination.js
index e6418eb..bee04c2 100644
--- a/src/functions/displayCorrectDenomination.js
+++ b/src/functions/displayCorrectDenomination.js
@@ -7,40 +7,63 @@ export default function displayCorrectDenomination({
   amount,
   masterInfoObject,
   fiatStats,
+  useCustomLabel = false,
+  customLabel = "",
+  useMillionDenomination = false,
 }) {
   try {
-    const convertedAmount = numberConverter(
-      amount,
-      masterInfoObject.userBalanceDenomination,
-      masterInfoObject.userBalanceDenomination === "fiat" ? 2 : 0,
-      fiatStats
-    );
+    const localBalanceDenomination = masterInfoObject.userBalanceDenomination;
     const currencyText = fiatStats?.coin || "USD";
+
+    if (useCustomLabel) {
+      const formattedBalance = formatBalanceAmount(
+        amount,
+        useMillionDenomination,
+        masterInfoObject
+      );
+      const labelText = customLabel?.toUpperCase()?.slice(0, 10) || "";
+      return `${formattedBalance} ${labelText}`;
+    }
+
+    const formattedBalance = formatBalanceAmount(
+      numberConverter(
+        amount,
+        localBalanceDenomination,
+        localBalanceDenomination === "fiat" ? 2 : 0,
+        fiatStats
+      ),
+      useMillionDenomination,
+      masterInfoObject
+    );
+
     const showSymbol = masterInfoObject.satDisplay === "symbol";
     const showSats =
-      masterInfoObject.userBalanceDenomination === "sats" ||
-      masterInfoObject.userBalanceDenomination === "hidden";
+      localBalanceDenomination === "sats" ||
+      localBalanceDenomination === "hidden";
 
-    const formattedCurrency = formatCurrency({
-      amount: convertedAmount,
+    if (showSats) {
+      return showSymbol
+        ? `${BITCOIN_SATS_ICON}${formattedBalance}`
+        : `${formattedBalance} ${BITCOIN_SAT_TEXT}`;
+    }
+
+    // Fiat display
+    const currencyOptions = formatCurrency({
+      amount: formattedBalance,
       code: currencyText,
     });
-    const isSymbolInFront = formattedCurrency[3];
-    const currencySymbol = formattedCurrency[2];
-    const formatedSat = `${formatBalanceAmount(convertedAmount)}`;
+    const isSymbolInFront = currencyOptions[3];
+    const currencySymbol = currencyOptions[2];
 
-    if (showSats) {
-      if (showSymbol) return BITCOIN_SATS_ICON + formatedSat;
-      else return formatedSat + ` ${BITCOIN_SAT_TEXT}`;
-    } else {
-      if (showSymbol && isSymbolInFront)
-        return currencySymbol + formattedCurrency[1];
-      else if (showSymbol && !isSymbolInFront)
-        return formattedCurrency[1] + currencySymbol;
-      else return formattedCurrency[1] + ` ${currencyText}`;
+    if (showSymbol && isSymbolInFront) {
+      return `${currencySymbol}${currencyOptions[1]}`;
+    }
+    if (showSymbol && !isSymbolInFront) {
+      return `${currencyOptions[1]}${currencySymbol}`;
     }
+    return `${currencyOptions[1]} ${currencyText}`;
   } catch (err) {
-    console.log("display correct denomincation error", err);
+    console.log("display correct denomination error", err);
     return "";
   }
 }
diff --git a/src/functions/images/storage.js b/src/functions/images/storage.js
new file mode 100644
index 0000000..9ad18f8
--- /dev/null
+++ b/src/functions/images/storage.js
@@ -0,0 +1,313 @@
+/**
+ * storage.js - Local Image Cache Manager
+ * Handles caching of images using IndexedDB and localStorage
+ */
+
+const DB_NAME = "ImageCacheDB";
+const STORE_NAME = "images";
+const METADATA_STORE_NAME = "metadata";
+const DB_VERSION = 2;
+
+/**
+ * Open or create IndexedDB database
+ */
+function openDatabase() {
+  return new Promise((resolve, reject) => {
+    const request = indexedDB.open(DB_NAME, DB_VERSION);
+
+    request.onerror = () => reject(request.error);
+    request.onsuccess = () => resolve(request.result);
+
+    request.onupgradeneeded = (event) => {
+      const db = event.target.result;
+
+      // Create images store if it doesn't exist
+      if (!db.objectStoreNames.contains(STORE_NAME)) {
+        db.createObjectStore(STORE_NAME);
+      }
+
+      // Create metadata store if it doesn't exist
+      if (!db.objectStoreNames.contains(METADATA_STORE_NAME)) {
+        db.createObjectStore(METADATA_STORE_NAME);
+      }
+    };
+  });
+}
+
+/**
+ * Get item from IndexedDB
+ */
+async function getIndexedDBItem(key, storeName = STORE_NAME) {
+  const db = await openDatabase();
+  return new Promise((resolve, reject) => {
+    const transaction = db.transaction([storeName], "readonly");
+    const store = transaction.objectStore(storeName);
+    const request = store.get(key);
+
+    request.onerror = () => reject(request.error);
+    request.onsuccess = () => resolve(request.result);
+  });
+}
+
+/**
+ * Set item in IndexedDB
+ */
+async function setIndexedDBItem(key, value, storeName = STORE_NAME) {
+  const db = await openDatabase();
+  return new Promise((resolve, reject) => {
+    const transaction = db.transaction([storeName], "readwrite");
+    const store = transaction.objectStore(storeName);
+    const request = store.put(value, key);
+
+    request.onerror = () => reject(request.error);
+    request.onsuccess = () => resolve(request.result);
+  });
+}
+
+/**
+ * Delete item from IndexedDB
+ */
+async function deleteIndexedDBItem(key, storeName = STORE_NAME) {
+  const db = await openDatabase();
+  return new Promise((resolve, reject) => {
+    const transaction = db.transaction([storeName], "readwrite");
+    const store = transaction.objectStore(storeName);
+    const request = store.delete(key);
+
+    request.onerror = () => reject(request.error);
+    request.onsuccess = () => resolve(true);
+  });
+}
+
+/**
+ * Get all keys from IndexedDB store
+ */
+async function getAllImageKeys(storeName = STORE_NAME) {
+  const db = await openDatabase();
+  return new Promise((resolve, reject) => {
+    const transaction = db.transaction([storeName], "readonly");
+    const store = transaction.objectStore(storeName);
+    const request = store.getAllKeys();
+
+    request.onerror = () => reject(request.error);
+    request.onsuccess = () => resolve(request.result);
+  });
+}
+
+/**
+ * Clear all items from a store
+ */
+async function clearStore(storeName = STORE_NAME) {
+  const db = await openDatabase();
+  return new Promise((resolve, reject) => {
+    const transaction = db.transaction([storeName], "readwrite");
+    const store = transaction.objectStore(storeName);
+    const request = store.clear();
+
+    request.onerror = () => reject(request.error);
+    request.onsuccess = () => resolve(true);
+  });
+}
+
+// ============================================================================
+// Image Utility Functions
+// ============================================================================
+
+/**
+ * Convert blob to data URL
+ */
+function blobToDataURL(blob) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onloadend = () => resolve(reader.result);
+    reader.onerror = reject;
+    reader.readAsDataURL(blob);
+  });
+}
+
+/**
+ * Download image from URL and return as blob
+ */
+async function downloadImageBlob(url) {
+  const response = await fetch(url);
+  if (!response.ok) {
+    throw new Error(`Failed to download image: ${response.statusText}`);
+  }
+  return await response.blob();
+}
+
+/**
+ * Create object URL from blob (remember to revoke when done)
+ */
+function createObjectURL(blob) {
+  return URL.createObjectURL(blob);
+}
+
+/**
+ * Revoke object URL to free memory
+ */
+function revokeObjectURL(url) {
+  try {
+    URL.revokeObjectURL(url);
+  } catch (e) {
+    console.error("Error revoking object URL:", e);
+  }
+}
+
+// ============================================================================
+// High-Level Image Cache Functions
+// ============================================================================
+
+/**
+ * Store image in cache with metadata
+ * @param {string} key - Unique identifier for the image
+ * @param {Blob} blob - Image blob data
+ * @param {Object} metadata - Additional metadata (e.g., { updated: timestamp })
+ */
+export async function cacheImage(key, blob, metadata = {}) {
+  try {
+    // Store the blob in IndexedDB
+    await setIndexedDBItem(key, blob, STORE_NAME);
+
+    // Store metadata in IndexedDB metadata store
+    const metadataWithTimestamp = {
+      ...metadata,
+      cachedAt: new Date().toISOString(),
+    };
+    await setIndexedDBItem(key, metadataWithTimestamp, METADATA_STORE_NAME);
+
+    return true;
+  } catch (e) {
+    console.error("Error caching image:", e);
+    return false;
+  }
+}
+
+/**
+ * Get cached image and its metadata
+ * @param {string} key - Unique identifier for the image
+ * @param {boolean} asDataURL - If true, returns data URL; if false, returns blob
+ */
+export async function getCachedImage(key, asDataURL = true) {
+  try {
+    const blob = await getIndexedDBItem(key, STORE_NAME);
+    const metadata = await getIndexedDBItem(key, METADATA_STORE_NAME);
+
+    if (!blob) {
+      return null;
+    }
+
+    const uri = asDataURL ? await blobToDataURL(blob) : createObjectURL(blob);
+
+    return {
+      uri,
+      blob,
+      metadata,
+      isObjectURL: !asDataURL,
+    };
+  } catch (e) {
+    console.error("Error getting cached image:", e);
+    return null;
+  }
+}
+
+/**
+ * Download and cache image from URL
+ * @param {string} key - Unique identifier for the image
+ * @param {string} url - URL to download from
+ * @param {Object} metadata - Additional metadata
+ */
+export async function downloadAndCacheImage(key, url, metadata = {}) {
+  try {
+    const blob = await downloadImageBlob(url);
+    await cacheImage(key, blob, metadata);
+    return blob;
+  } catch (e) {
+    console.error("Error downloading and caching image:", e);
+    return null;
+  }
+}
+
+/**
+ * Check if image exists in cache
+ * @param {string} key - Unique identifier for the image
+ */
+export async function isCached(key) {
+  try {
+    const blob = await getIndexedDBItem(key, STORE_NAME);
+    return blob !== undefined && blob !== null;
+  } catch (e) {
+    console.error("Error checking cache:", e);
+    return false;
+  }
+}
+
+/**
+ * Delete cached image and its metadata
+ * @param {string} key - Unique identifier for the image
+ */
+export async function deleteCachedImage(key) {
+  try {
+    await deleteIndexedDBItem(key, STORE_NAME);
+    await deleteIndexedDBItem(key, METADATA_STORE_NAME);
+    return true;
+  } catch (e) {
+    console.error("Error deleting cached image:", e);
+    return false;
+  }
+}
+
+/**
+ * Get metadata for a cached image
+ * @param {string} key - Unique identifier for the image
+ */
+export async function getCachedImageMetadata(key) {
+  try {
+    return await getIndexedDBItem(key, METADATA_STORE_NAME);
+  } catch (e) {
+    console.error("Error getting cached image metadata:", e);
+    return null;
+  }
+}
+
+/**
+ * Update metadata for a cached image
+ * @param {string} key - Unique identifier for the image
+ * @param {Object} metadata - Metadata to update
+ */
+export async function updateCachedImageMetadata(key, metadata) {
+  try {
+    const existing = await getIndexedDBItem(key, METADATA_STORE_NAME);
+    const updated = { ...existing, ...metadata };
+    await setIndexedDBItem(key, updated, METADATA_STORE_NAME);
+    return true;
+  } catch (e) {
+    console.error("Error updating cached image metadata:", e);
+    return false;
+  }
+}
+
+/**
+ * Clear all cached images
+ */
+export async function clearAllCachedImages() {
+  try {
+    await clearStore(STORE_NAME);
+    await clearStore(METADATA_STORE_NAME);
+    return true;
+  } catch (e) {
+    console.error("Error clearing all cached images:", e);
+    return false;
+  }
+}
+
+export {
+  blobToDataURL,
+  createObjectURL,
+  revokeObjectURL,
+  downloadImageBlob,
+  getIndexedDBItem,
+  getAllImageKeys,
+  setIndexedDBItem,
+  deleteIndexedDBItem,
+};
diff --git a/src/functions/initializeUserSettings.js b/src/functions/initializeUserSettings.js
index bc3ec09..bb6a280 100644
--- a/src/functions/initializeUserSettings.js
+++ b/src/functions/initializeUserSettings.js
@@ -1,6 +1,6 @@
 import { getDataFromCollection } from "../../db";
 import fetchBackend from "../../db/handleBackend";
-import { initializeFirebase } from "../../db/initializeFirebase";
+import { auth, initializeFirebase } from "../../db/initializeFirebase";
 import { sendDataToDB } from "../../db/interactionManager";
 import { MIN_CHANNEL_OPEN_FEE, QUICK_PAY_STORAGE_KEY } from "../constants";
 import { generateRandomContact } from "./contacts";
@@ -13,13 +13,15 @@ import {
   isNewDaySince,
 } from "./rotateAddressDateChecker";
 import { getPublicKey, privateKeyFromSeedWords } from "./seed";
-export default async function initializeUserSettings(
+export default async function initializeUserSettings({
   mnemoinc,
   toggleContactsPrivateKey,
   setMasterInfoObject,
   toggleGlobalContactsInformation,
-  toggleGlobalAppDataInformation
-) {
+  toggleGlobalAppDataInformation,
+  preloadedData,
+  setPreLoadedUserData,
+}) {
   try {
     let needsToUpdate = false;
     let tempObject = {};
@@ -30,7 +32,7 @@ export default async function initializeUserSettings(
     if (!privateKey || !publicKey) throw Error("Failed to retrieve keys");
 
     const [
-      _,
+      initResponse,
       // pastExploreData,
       // savedNWCData,
     ] = await Promise.all([
@@ -47,7 +49,9 @@ export default async function initializeUserSettings(
       localStoredData,
       //  freshExploreData
     ] = await Promise.all([
-      getDataFromCollection("blitzWalletUsers", publicKey),
+      preloadedData && auth.currentUser.uid === publicKey
+        ? Promise.resolve(preloadedData)
+        : getDataFromCollection("blitzWalletUsers", publicKey),
       fetchLocalStorageItems(),
       // shouldLoadExporeDataResp
       //   ? fetchBackend(
@@ -59,6 +63,11 @@ export default async function initializeUserSettings(
       //   : Promise.resolve(null),
     ]);
 
+    if (preloadedData) {
+      // clear refrenace to remove uneeded object
+      setPreLoadedUserData({});
+    }
+
     let {
       storedUserTxPereferance,
       enabledSlidingCamera,
@@ -74,17 +83,23 @@ export default async function initializeUserSettings(
       enabledDeveloperSupport,
       didViewNWCMessage,
       userSelectedLanguage,
-      // nwc_identity_pub_key,
+      nwc_identity_pub_key,
       userBalanceDenomination,
+      didViewSeedPhrase,
+      enabledBTKNTokens,
+      defaultSpendToken,
+      thousandsSeperator,
     } = localStoredData;
 
     if (blitzStoredData === null) throw Error("Failed to retrive");
     blitzStoredData = blitzStoredData || {};
+
     toggleContactsPrivateKey(privateKey);
 
     const generatedUniqueName = blitzStoredData?.contacts?.uniqueName
       ? ""
       : generateRandomContact();
+
     let contacts = blitzStoredData.contacts || {
       myProfile: {
         uniqueName: generatedUniqueName.uniqueName,
@@ -112,6 +127,8 @@ export default async function initializeUserSettings(
       blitzStoredData.userBalanceDenomination || "sats";
 
     const selectedLanguage = userSelectedLanguage;
+    const currentDerivedGiftIndex =
+      blitzStoredData.currentDerivedGiftIndex || 1;
 
     let pushNotifications = blitzStoredData.pushNotifications || {
       isEnabled: false,
@@ -143,7 +160,7 @@ export default async function initializeUserSettings(
       minAutoSwapAmount: 10000, //sats
     };
     let ecashWalletSettings = blitzStoredData.ecashWalletSettings;
-    let lrc20Settings = blitzStoredData.lrc20Settings;
+    // let lrc20Settings = blitzStoredData.lrc20Settings;
 
     // const eCashInformation =
     //   blitzStoredData.eCashInformation ||
@@ -291,11 +308,11 @@ export default async function initializeUserSettings(
       needsToUpdate = true;
     }
 
-    if (!lrc20Settings) {
-      lrc20Settings = {
-        isEnabled: false,
-      };
-    }
+    // if (!lrc20Settings) {
+    //   lrc20Settings = {
+    //     isEnabled: false,
+    //   };
+    // }
 
     // if (!nwc_identity_pub_key) {
     //   const didInit = await initializeNWCWallet();
@@ -312,6 +329,11 @@ export default async function initializeUserSettings(
       Storage.setItem("userBalanceDenomination", dbUserBalanceDenomination);
     }
 
+    if (didViewSeedPhrase === null) {
+      didViewSeedPhrase = true;
+      Storage.setItem("didViewSeedPhrase", true);
+    }
+
     // if (!lnurlPubKey) {
     //   lnurlPubKey = getBitcoinKeyPair(mnemonic).publicKey;
     //   needsToUpdate = true;
@@ -356,7 +378,12 @@ export default async function initializeUserSettings(
     // tempObject['lnurlPubKey'] = lnurlPubKey;
     tempObject["isUsingEncriptedMessaging"] = isUsingEncriptedMessaging;
     tempObject["isUsingNewNotifications"] = isUsingNewNotifications;
-    tempObject["lrc20Settings"] = lrc20Settings;
+    // tempObject['lrc20Settings'] = lrc20Settings;
+    tempObject["didViewSeedPhrase"] = didViewSeedPhrase;
+    tempObject["enabledBTKNTokens"] = enabledBTKNTokens;
+    tempObject["defaultSpendToken"] = defaultSpendToken;
+    tempObject["currentDerivedGiftIndex"] = currentDerivedGiftIndex;
+    tempObject["thousandsSeperator"] = thousandsSeperator;
 
     // store in contacts context
     tempObject["contacts"] = contacts;
diff --git a/src/functions/initializeUserSettingsHelpers/index.js b/src/functions/initializeUserSettingsHelpers/index.js
index 2a9e1a8..4d469d4 100644
--- a/src/functions/initializeUserSettingsHelpers/index.js
+++ b/src/functions/initializeUserSettingsHelpers/index.js
@@ -20,6 +20,10 @@ const keys = [
   "userSelectedLanguage",
   NWC_IDENTITY_PUB_KEY,
   "userBalanceDenomination",
+  "didViewSeedPhrase",
+  "enabledBTKNTokens",
+  "defaultSpendToken",
+  "thousandsSeperator",
 ];
 
 const defaultValues = {
@@ -50,6 +54,10 @@ const defaultValues = {
   userSelectedLanguage: "en",
   [NWC_IDENTITY_PUB_KEY]: "",
   userBalanceDenomination: "",
+  didViewSeedPhrase: null,
+  enabledBTKNTokens: null,
+  defaultSpendToken: "Bitcoin",
+  thousandsSeperator: "space",
 };
 
 export const fetchLocalStorageItems = async () => {
@@ -89,20 +97,41 @@ export const fetchLocalStorageItems = async () => {
       parsedResults[14] ?? defaultValues[NWC_IDENTITY_PUB_KEY],
     userBalanceDenomination:
       parsedResults[15] ?? defaultValues.userBalanceDenomination,
+    didViewSeedPhrase: parsedResults[16] ?? defaultValues.didViewSeedPhrase,
+    enabledBTKNTokens: parsedResults[17] ?? defaultValues.enabledBTKNTokens,
+    defaultSpendToken: parsedResults[18] ?? defaultValues.defaultSpendToken,
+    thousandsSeperator: parsedResults[19] ?? defaultValues.thousandsSeperator,
   };
 };
 
-export function shouldLoadExploreData(savedExploreRawData) {
+export function shouldLoadExploreData(savedExploreRawData, currentServerTime) {
   let shouldFetchUserCount = false;
+
   try {
+    if (!savedExploreRawData?.lastUpdated) {
+      return true;
+    }
+
+    const UTC_MINUS_6_OFFSET = -6;
+
+    const targetTimezoneMs =
+      currentServerTime + UTC_MINUS_6_OFFSET * 60 * 60 * 1000;
+    const targetDate = new Date(targetTimezoneMs);
+    targetDate.setUTCHours(12, 0, 0, 0);
+
+    const current12PMUtcMinus6 = targetDate.getTime();
+
+    // Check if we've passed 12 PM UTC-6 since last update
     if (
-      !savedExploreRawData?.lastUpdated ||
-      isNewDaySince(savedExploreRawData?.lastUpdated)
+      currentServerTime >= current12PMUtcMinus6 &&
+      savedExploreRawData.lastUpdated < current12PMUtcMinus6
     ) {
       shouldFetchUserCount = true;
     }
   } catch (err) {
     console.log("error in should load explore data", err);
+    // Default to fetching on error to be safe
+    shouldFetchUserCount = true;
   }
 
   return shouldFetchUserCount;
diff --git a/src/functions/initiateWalletConnection.js b/src/functions/initiateWalletConnection.js
index cc65144..8326d91 100644
--- a/src/functions/initiateWalletConnection.js
+++ b/src/functions/initiateWalletConnection.js
@@ -5,7 +5,9 @@ import {
   getSparkIdentityPubKey,
   getSparkTransactions,
   initializeSparkWallet,
+  setPrivacyEnabled,
 } from "./spark";
+import handleBalanceCache from "./spark/handleBalanceCache";
 import { cleanStalePendingSparkLightningTransactions } from "./spark/transactions";
 
 export async function initWallet({
@@ -13,11 +15,29 @@ export async function initWallet({
   // toggleGlobalContactsInformation,
   // globalContactsInformation,
   mnemonic,
+  hasRestoreCompleted,
 }) {
   console.log("HOME RENDER BREEZ EVENT FIRST LOAD");
 
   try {
-    const didConnectToSpark = await initializeSparkWallet(mnemonic);
+    const [didConnectToSpark, balance] = await Promise.all([
+      initializeSparkWallet(mnemonic),
+      handleBalanceCache({
+        isCheck: false,
+        mnemonic: mnemonic,
+        returnBalanceOnly: true,
+      }),
+    ]);
+
+    console.log(didConnectToSpark, balance);
+
+    if (balance) {
+      setSparkInformation((prev) => ({
+        ...prev,
+        didConnect: true,
+        balance: balance,
+      }));
+    }
 
     if (didConnectToSpark.isConnected) {
       const didSetSpark = await initializeSparkSession({
@@ -25,6 +45,7 @@ export async function initWallet({
         // globalContactsInformation,
         // toggleGlobalContactsInformation,
         mnemonic,
+        hasRestoreCompleted,
       });
 
       if (!didSetSpark)
@@ -48,6 +69,7 @@ async function initializeSparkSession({
   // globalContactsInformation,
   // toggleGlobalContactsInformation,
   mnemonic,
+  hasRestoreCompleted,
 }) {
   try {
     // Clean DB state but do not hold up process
@@ -58,40 +80,111 @@ async function initializeSparkSession({
       getSparkIdentityPubKey(mnemonic),
     ]);
 
-    if (!balance.didWork)
-      throw new Error("Unable to initialize spark from history");
+    setPrivacyEnabled(mnemonic);
 
     const transactions = await getCachedSparkTransactions(null, identityPubKey);
 
     if (transactions === undefined)
       throw new Error("Unable to initialize spark from history");
 
-    // if (
-    //   !globalContactsInformation.myProfile.sparkAddress ||
-    //   !globalContactsInformation.myProfile.sparkIdentityPubKey
-    // ) {
-    //   toggleGlobalContactsInformation(
-    //     {
-    //       myProfile: {
-    //         ...globalContactsInformation.myProfile,
-    //         sparkAddress: sparkAddress.response,
-    //         sparkIdentityPubKey: identityPubKey,
-    //       },
-    //     },
-    //     true
-    //   );
-    // }
+    if (!balance.didWork) {
+      const storageObject = {
+        transactions: transactions,
+        identityPubKey,
+        sparkAddress: sparkAddress.response,
+        didConnect: true,
+      };
+      await new Promise((res) => setTimeout(res, 500));
+      setSparkInformation((prev) => ({ ...prev, ...storageObject }));
+      return storageObject;
+    }
+
+    let didLoadCorrectBalance = false;
+    let runCount = 0;
+    let maxRunCount = 2;
+    let initialBalanceResponse = balance;
+    let correctBalance = 0;
+
+    while (runCount < maxRunCount && !didLoadCorrectBalance) {
+      runCount += 1;
+      let currentBalance = 0;
+
+      if (runCount === 1) {
+        currentBalance = Number(initialBalanceResponse.balance);
+      } else {
+        const retryResponse = await getSparkBalance(mnemonic);
+        currentBalance = Number(retryResponse.balance);
+      }
+
+      const response = await handleBalanceCache({
+        isCheck: true,
+        passedBalance: currentBalance,
+        mnemonic,
+      });
+
+      if (response.didWork) {
+        correctBalance = response.balance;
+        didLoadCorrectBalance = true;
+      } else {
+        console.log("Waiting for correct balance resposne");
+        await new Promise((res) => setTimeout(res, 2000));
+      }
+    }
+
+    const finalBalanceToUse = didLoadCorrectBalance
+      ? correctBalance
+      : Number(initialBalanceResponse.balance);
+    console.log(
+      didLoadCorrectBalance,
+      runCount,
+      initialBalanceResponse,
+      correctBalance,
+      finalBalanceToUse,
+      "balancasldfkjasdlfkjasdf"
+    );
+    if (!didLoadCorrectBalance) {
+      await handleBalanceCache({
+        isCheck: false,
+        passedBalance: finalBalanceToUse,
+        mnemonic,
+      });
+    }
 
     const storageObject = {
-      balance: Number(balance.balance),
+      balance: finalBalanceToUse,
       tokens: balance.tokensObj,
-      transactions: transactions,
       identityPubKey,
       sparkAddress: sparkAddress.response,
       didConnect: true,
     };
     console.log("Spark storage object", storageObject);
-    setSparkInformation(storageObject);
+    await new Promise((res) => setTimeout(res, 500));
+
+    setSparkInformation((prev) => {
+      let txToUse;
+
+      // Restore has not run yet:
+      if (
+        !hasRestoreCompleted ||
+        (prev.identityPubKey && prev.identityPubKey !== identityPubKey)
+      ) {
+        // We show cached transactions immediately to avoid blanks.
+        // But DO NOT overwrite later once restore writes.
+        // Fully overwrite if identityPubKey changed (new wallet).
+        txToUse = transactions;
+      } else {
+        // Restore has finished:
+        // Never insert fetchedTransactions (they may be stale)
+        // Use whatever DB restore already put in state.
+        txToUse = prev.transactions;
+      }
+
+      return {
+        ...prev,
+        ...storageObject,
+        transactions: txToUse,
+      };
+    });
     return storageObject;
   } catch (err) {
     console.log("Set spark error", err);
diff --git a/src/functions/lrc20/index.js b/src/functions/lrc20/index.js
index 188dfd7..299a06d 100644
--- a/src/functions/lrc20/index.js
+++ b/src/functions/lrc20/index.js
@@ -24,7 +24,6 @@ export async function getLRC20Transactions({
     getCachedTokens(),
     getSparkTokenTransactions({ ownerPublicKeys, mnemonic }),
   ]);
-  console.log(savedTxs, cachedTokens, tokenTxs);
 
   if (!tokenTxs?.tokenTransactionsWithStatus) return;
   const tokenTransactions = tokenTxs.tokenTransactionsWithStatus;
diff --git a/src/functions/lrc20/lrc20TokenDataHalfModal.jsx b/src/functions/lrc20/lrc20TokenDataHalfModal.jsx
index 6504a8a..b376742 100644
--- a/src/functions/lrc20/lrc20TokenDataHalfModal.jsx
+++ b/src/functions/lrc20/lrc20TokenDataHalfModal.jsx
@@ -8,13 +8,10 @@ import useThemeColors from "../../hooks/useThemeColors";
 import copyToClipboard from "../copyToClipboard";
 import { formatTokensNumber } from "./formatTokensBalance";
 import "./tokenHalfModalStyle.css";
+import { useOverlay } from "../../contexts/overlayContext";
 
-export default function LRC20TokenInformation({
-  theme,
-  darkModeType,
-  openOverlay,
-  params,
-}) {
+export default function LRC20TokenInformation({ theme, darkModeType, params }) {
+  const { openOverlay } = useOverlay();
   const { sparkInformation } = useSpark();
   const selectedToken = sparkInformation.tokens?.[params?.tokenIdentifier];
   const { balance, tokenMetadata } = selectedToken;
diff --git a/src/functions/messaging/cachedMessages.js b/src/functions/messaging/cachedMessages.js
index 444f02c..16d8f03 100644
--- a/src/functions/messaging/cachedMessages.js
+++ b/src/functions/messaging/cachedMessages.js
@@ -2,6 +2,8 @@ import { deleteDB, openDB } from "idb";
 import Storage from "../localStorage";
 import { getTwoWeeksAgoDate } from "../rotateAddressDateChecker";
 import EventEmitter from "events";
+import { addBulkUnpaidSparkContactTransactions } from "../spark/transactions";
+import i18next from "i18next";
 
 export const CACHED_MESSAGES_KEY = "CASHED_CONTACTS_MESSAGES";
 export const DB_NAME = `${CACHED_MESSAGES_KEY}`;
@@ -102,7 +104,13 @@ const processQueue = async () => {
   while (messageQueue.length > 0) {
     const { newMessagesList, myPubKey } = messageQueue.shift();
     try {
-      await setCashedMessages({ newMessagesList, myPubKey });
+      await Promise.all([
+        addUnpaidContactTransactions({ newMessagesList, myPubKey }),
+        setCashedMessages({
+          newMessagesList,
+          myPubKey,
+        }),
+      ]);
     } catch (err) {
       console.error("Error processing batch in queue:", err);
     }
@@ -111,12 +119,35 @@ const processQueue = async () => {
   isProcessing = false;
 };
 
+const addUnpaidContactTransactions = async ({ newMessagesList, myPubKey }) => {
+  let formatted = [];
+  for (const message of newMessagesList) {
+    const parsedMessage = message.message;
+    if (message.isReceived && parsedMessage?.txid) {
+      formatted.push({
+        id: parsedMessage.txid,
+        description:
+          parsedMessage.description ||
+          i18next.t("contacts.sendAndRequestPage.contactMessage", {
+            name: parsedMessage?.name || "",
+          }),
+        sendersPubkey: message.sendersPubkey,
+        details: "",
+      });
+    }
+  }
+  if (formatted.length > 0) {
+    await addBulkUnpaidSparkContactTransactions(formatted);
+  }
+};
+
 const setCashedMessages = async ({ newMessagesList, myPubKey }) => {
   const db = await getDB();
   const tx = db.transaction(STORE_NAME_CONTACT_MESSAGES, "readwrite");
   const store = tx.objectStore(STORE_NAME_CONTACT_MESSAGES);
 
   try {
+    if (!newMessagesList.length) return;
     for (const newMessage of newMessagesList) {
       const existing = await store.get(newMessage.message.uuid);
       const parsedMessage = existing ? JSON.parse(existing.message) : null;
@@ -166,7 +197,11 @@ const setCashedMessages = async ({ newMessagesList, myPubKey }) => {
     }
 
     await tx.done;
-
+    console.log(newMessagesList, "sourted timestamps");
+    const sortedTimestamps = newMessagesList.sort(
+      (a, b) => b.timestamp - a.timestamp
+    );
+    console.log(sortedTimestamps, "sourted timestamps");
     const newTimestamp = newMessagesList.sort(
       (a, b) => b.timestamp - a.timestamp
     )[0].timestamp;
diff --git a/src/functions/messaging/publishMessage.js b/src/functions/messaging/publishMessage.js
index 82f26cd..5c1f3e1 100644
--- a/src/functions/messaging/publishMessage.js
+++ b/src/functions/messaging/publishMessage.js
@@ -1,7 +1,9 @@
 import formatBalanceAmount from "../formatNumber";
-import { getSingleContact, updateMessage } from "../../../db";
+import { getDataFromCollection, updateMessage } from "../../../db";
 import { BITCOIN_SAT_TEXT, SATSPERBITCOIN } from "../../constants";
 import fetchBackend from "../../../db/handleBackend";
+import loadNewFiatData from "../saveAndUpdateFiatData";
+import i18next from "i18next";
 
 export async function publishMessage({
   toPubKey,
@@ -9,9 +11,11 @@ export async function publishMessage({
   data,
   globalContactsInformation,
   selectedContact,
-  fiatCurrencies,
   isLNURLPayment,
   privateKey,
+  retrivedContact,
+  currentTime,
+  masterInfoObject,
 }) {
   try {
     const sendingObj = data;
@@ -20,15 +24,19 @@ export async function publishMessage({
       fromPubKey,
       toPubKey,
       onlySaveToLocal: isLNURLPayment,
+      retrivedContact,
+      privateKey,
+      currentTime,
     });
 
     if (isLNURLPayment) return;
-    await sendPushNotification({
+    sendPushNotification({
       selectedContactUsername: selectedContact.uniqueName,
       myProfile: globalContactsInformation.myProfile,
       data: data,
-      fiatCurrencies: fiatCurrencies,
       privateKey,
+      retrivedContact,
+      masterInfoObject,
     });
   } catch (err) {
     console.log(err), "pubishing message to server error";
@@ -39,77 +47,132 @@ export async function sendPushNotification({
   selectedContactUsername,
   myProfile,
   data,
-  fiatCurrencies,
   privateKey,
+  retrivedContact,
+  masterInfoObject,
 }) {
   try {
     console.log(selectedContactUsername);
-    const retrivedContact = await getSingleContact(
-      selectedContactUsername.toLowerCase()
-    );
 
-    if (retrivedContact.length === 0) return;
-    const [selectedContact] = retrivedContact;
+    // Check if there is a selected contact
+    if (!retrivedContact) return;
+    const pushNotificationData = retrivedContact.pushNotifications;
+
+    // check if the person has a push token saved
+    if (!pushNotificationData?.key?.encriptedText) return;
+
+    // If a user has updated thier settings and they have chosen to not receive notification for contact payments
+    if (
+      pushNotificationData?.enabledServices?.contactPayments !== undefined &&
+      !pushNotificationData?.enabledServices?.contactPayments
+    )
+      return;
 
+    const useNewNotifications = !!retrivedContact.isUsingNewNotifications;
     const devicePushKey =
-      selectedContact?.pushNotifications?.key?.encriptedText;
-    const deviceType = selectedContact?.pushNotifications?.platform;
-    const sendingContactFiatCurrency = selectedContact?.fiatCurrency || "USD";
+      retrivedContact?.pushNotifications?.key?.encriptedText;
+    const deviceType = retrivedContact?.pushNotifications?.platform;
+    const sendingContactFiatCurrency = retrivedContact?.fiatCurrency || "USD";
     const sendingContactDenominationType =
-      selectedContact?.userBalanceDenomination || "sats";
+      retrivedContact?.userBalanceDenomination || "sats";
 
-    const fiatValue = fiatCurrencies.filter(
-      (currency) =>
-        currency.coin.toLowerCase() === sendingContactFiatCurrency.toLowerCase()
-    );
-    const didFindCurrency = fiatValue.length >= 1;
-    const fiatAmount =
-      didFindCurrency &&
-      (
-        (fiatValue[0]?.value / SATSPERBITCOIN) *
-        (data.amountMsat / 1000)
-      ).toFixed(2);
+    if (!devicePushKey || !deviceType) return;
 
-    console.log(devicePushKey, deviceType);
+    let requestData = {};
 
-    if (!devicePushKey || !deviceType) return;
-    let message;
-    if (data.isUpdate) {
-      message = data.message;
-    } else if (data.isRequest) {
-      message = `${
-        myProfile.name || myProfile.uniqueName
-      } requested you ${formatBalanceAmount(
-        sendingContactDenominationType != "fiat" || !fiatAmount
-          ? data.amountMsat / 1000
-          : fiatAmount
-      )} ${
-        sendingContactDenominationType != "fiat" || !fiatAmount
-          ? BITCOIN_SAT_TEXT
-          : sendingContactFiatCurrency
-      }`;
+    if (useNewNotifications) {
+      let notificationData = {
+        name: myProfile.name || myProfile.uniqueName,
+      };
+
+      if (data.isUpdate) {
+        notificationData["option"] =
+          data.option === "paid" ? "paidLower" : "declinedLower";
+        notificationData["type"] = "updateMessage";
+      } else if (data.isRequest) {
+        notificationData["amountSat"] = data.amountMsat / 1000;
+        notificationData["type"] = "request";
+      } else if (data.giftCardInfo) {
+        notificationData["giftCardName"] = data.giftCardInfo.name;
+        notificationData["type"] = "giftCard";
+      } else {
+        notificationData["amountSat"] = data.amountMsat / 1000;
+        notificationData["type"] = "payment";
+      }
+
+      requestData = {
+        devicePushKey: devicePushKey,
+        deviceType: deviceType,
+        notificationData,
+        decryptPubKey: retrivedContact.uuid,
+      };
+    } else if (data.giftCardInfo) {
+      const message = `${myProfile.name || myProfile.uniqueName} sent you a ${
+        data.giftCardInfo.name
+      } Gift Card.`;
+      requestData = {
+        devicePushKey: devicePushKey,
+        deviceType: deviceType,
+        message,
+        decryptPubKey: retrivedContact.uuid,
+      };
     } else {
-      message = `${
-        myProfile.name || myProfile.uniqueName
-      } paid you ${formatBalanceAmount(
-        sendingContactDenominationType != "fiat" || !fiatAmount
-          ? data.amountMsat / 1000
-          : fiatAmount
-      )} ${
-        sendingContactDenominationType != "fiat" || !fiatAmount
-          ? BITCOIN_SAT_TEXT
-          : sendingContactFiatCurrency
-      }`;
+      const fiatValue = await loadNewFiatData(
+        sendingContactFiatCurrency,
+        privateKey,
+        myProfile.uuid,
+        masterInfoObject
+      );
+      const didFindCurrency = fiatValue?.didWork;
+      const fiatAmount =
+        didFindCurrency &&
+        (
+          (fiatValue?.value / SATSPERBITCOIN) *
+          (data.amountMsat / 1000)
+        ).toFixed(2);
+
+      let message = "";
+      if (data.isUpdate) {
+        message = data.message;
+      } else if (data.isRequest) {
+        message = `${
+          myProfile.name || myProfile.uniqueName
+        } requested you ${formatBalanceAmount(
+          sendingContactDenominationType != "fiat" || !fiatAmount
+            ? data.amountMsat / 1000
+            : fiatAmount,
+          undefined,
+          { thousandsSeperator: "space" }
+        )} ${
+          sendingContactDenominationType != "fiat" || !fiatAmount
+            ? BITCOIN_SAT_TEXT
+            : sendingContactFiatCurrency
+        }`;
+      } else {
+        message = `${
+          myProfile.name || myProfile.uniqueName
+        } paid you ${formatBalanceAmount(
+          sendingContactDenominationType != "fiat" || !fiatAmount
+            ? data.amountMsat / 1000
+            : fiatAmount,
+          undefined,
+          { thousandsSeperator: "space" }
+        )} ${
+          sendingContactDenominationType != "fiat" || !fiatAmount
+            ? BITCOIN_SAT_TEXT
+            : sendingContactFiatCurrency
+        }`;
+      }
+      requestData = {
+        devicePushKey: devicePushKey,
+        deviceType: deviceType,
+        message,
+        decryptPubKey: retrivedContact.uuid,
+      };
     }
-    const requestData = {
-      devicePushKey: devicePushKey,
-      deviceType: deviceType,
-      message: message,
-      decryptPubKey: selectedContact.uuid,
-    };
 
     const response = await fetchBackend(
-      "contactsPushNotificationV3",
+      `contactsPushNotificationV${useNewNotifications ? "4" : "3"}`,
       requestData,
       privateKey,
       myProfile.uuid
@@ -121,3 +184,92 @@ export async function sendPushNotification({
     return false;
   }
 }
+
+export async function handlePaymentUpdate({
+  transaction,
+  didPay,
+  txid,
+  globalContactsInformation,
+  selectedContact,
+  currentTime,
+  contactsPrivateKey,
+  publicKey,
+  masterInfoObject,
+}) {
+  try {
+    let newMessage = {
+      ...transaction.message,
+      isRedeemed: didPay,
+      txid,
+      name:
+        globalContactsInformation.myProfile.name ||
+        globalContactsInformation.myProfile.uniqueName,
+    };
+
+    // Need to switch unique name since the original receiver is now the sender
+    if (newMessage.senderProfileSnapshot) {
+      newMessage.senderProfileSnapshot.uniqueName =
+        globalContactsInformation.myProfile.uniqueName;
+    }
+
+    delete newMessage.didSend;
+    delete newMessage.wasSeen;
+
+    const [retrivedContact] = await Promise.all([
+      getDataFromCollection("blitzWalletUsers", selectedContact.uuid),
+    ]);
+    if (!retrivedContact)
+      throw new Error(i18next.t("errormessages.userDataFetchError"));
+
+    const useNewNotifications = !!retrivedContact.isUsingNewNotifications;
+
+    const [didPublishNotification, didUpdateMessage] = await Promise.all([
+      sendPushNotification({
+        selectedContactUsername: selectedContact.uniqueName,
+        myProfile: globalContactsInformation.myProfile,
+        data: {
+          isUpdate: true,
+          [useNewNotifications ? "option" : "message"]: useNewNotifications
+            ? didPay
+              ? "paid"
+              : "declined"
+            : i18next.t(
+                "contacts.internalComponents.contactsTransactions.pushNotificationUpdateMessage",
+                {
+                  name:
+                    globalContactsInformation.myProfile.name ||
+                    globalContactsInformation.myProfile.uniqueName,
+                  option: didPay
+                    ? i18next.t("transactionLabelText.paidLower")
+                    : i18next.t("transactionLabelText.declinedLower"),
+                }
+              ),
+        },
+        privateKey: contactsPrivateKey,
+        retrivedContact,
+        masterInfoObject,
+      }),
+
+      retrivedContact.isUsingEncriptedMessaging
+        ? updateMessage({
+            newMessage,
+            fromPubKey: publicKey,
+            toPubKey: selectedContact.uuid,
+            retrivedContact,
+            privateKey: contactsPrivateKey,
+            currentTime,
+          })
+        : updateMessage({
+            newMessage,
+            fromPubKey: transaction.fromPubKey,
+            toPubKey: transaction.toPubKey,
+            retrivedContact,
+            privateKey: contactsPrivateKey,
+            currentTime,
+          }),
+    ]);
+  } catch (err) {
+    console.log("erro hanldling payment update", err.message);
+    return false;
+  }
+}
diff --git a/src/functions/pollingManager.js b/src/functions/pollingManager.js
new file mode 100644
index 0000000..0c9c9db
--- /dev/null
+++ b/src/functions/pollingManager.js
@@ -0,0 +1,206 @@
+import { getSparkBalance } from "./spark";
+import { fullRestoreSparkState } from "./spark/restore";
+
+/**
+ * Generic polling utility with exponential backoff
+ * @param {Object} config - Configuration object
+ * @param {Function} config.pollFn - Async function to poll (receives delayIndex)
+ * @param {Function} config.shouldContinue - Function that returns boolean to continue polling
+ * @param {Function} config.onUpdate - Callback when poll succeeds with new data
+ * @param {Array<number>} config.delays - Array of delay intervals in ms
+ * @param {AbortController} config.abortController - Optional abort controller
+ * @param {Function} config.validateResult - Function to validate if result should stop polling
+ * @returns {Object} - Returns cleanup function and current state
+ */
+export const createPollingManager = ({
+  pollFn,
+  shouldContinue,
+  onUpdate,
+  delays = [1000, 2000, 5000, 15000],
+  abortController,
+  validateResult = () => true,
+  initialBalance,
+}) => {
+  let timeoutRef = null;
+  let previousResult = initialBalance || null;
+
+  const cleanup = () => {
+    if (timeoutRef) {
+      clearTimeout(timeoutRef);
+      timeoutRef = null;
+    }
+  };
+
+  const poll = async (delayIndex = 0, resolve, reject) => {
+    try {
+      // Check abort conditions
+      if (abortController?.signal?.aborted || !shouldContinue()) {
+        console.log("Polling stopped:", {
+          aborted: abortController?.signal?.aborted,
+          shouldContinue: shouldContinue(),
+        });
+        cleanup();
+        resolve({ success: false, reason: "aborted" });
+        return;
+      }
+
+      // Check if we've exhausted all delays
+      if (delayIndex >= delays.length) {
+        console.log("Polling completed after all retries");
+        cleanup();
+        resolve({
+          success: false,
+          reason: "max_retries",
+          result: previousResult,
+        });
+        return;
+      }
+
+      timeoutRef = setTimeout(async () => {
+        let globalResult;
+        try {
+          // Re-check abort conditions before executing
+          if (abortController?.signal?.aborted || !shouldContinue()) {
+            cleanup();
+            resolve({ success: false, reason: "aborted" });
+            return;
+          }
+
+          // Execute the poll function
+          globalResult = await pollFn(delayIndex);
+
+          // Validate if we should continue
+          if (validateResult(globalResult, previousResult)) {
+            // Call update callback
+            if (onUpdate) {
+              onUpdate(globalResult, delayIndex);
+            }
+
+            // Success - stop polling
+            cleanup();
+            resolve({ success: true, globalResult });
+            return;
+          }
+
+          // Continue to next delay
+          poll(delayIndex + 1, resolve, reject);
+        } catch (err) {
+          console.log("Error in polling iteration, continuing:", err);
+          poll(delayIndex + 1, resolve, reject);
+        } finally {
+          if (
+            globalResult != null &&
+            (previousResult == null || globalResult >= previousResult)
+          ) {
+            // Only update if same or higher
+            previousResult = globalResult;
+          }
+        }
+      }, delays[delayIndex]);
+    } catch (err) {
+      console.log("Error in poll setup:", err);
+      cleanup();
+      reject(err);
+    }
+  };
+
+  return {
+    start: () => new Promise((resolve, reject) => poll(0, resolve, reject)),
+    cleanup,
+  };
+};
+
+export const createBalancePoller = (
+  mnemonic,
+  currentMnemonicRef,
+  abortController,
+  onBalanceUpdate,
+  initialBalance
+) => {
+  let hasIncreasedAtLeastOnce = false;
+  let sameValueIndex = 0;
+  return createPollingManager({
+    pollFn: async () => {
+      const balance = await getSparkBalance(mnemonic);
+      return balance.didWork ? Number(balance.balance) : null;
+    },
+    shouldContinue: () => mnemonic === currentMnemonicRef.current,
+    validateResult: (newBalance, previousBalance) => {
+      console.log(
+        newBalance,
+        previousBalance,
+        hasIncreasedAtLeastOnce,
+        sameValueIndex
+      );
+
+      if (newBalance == null || previousBalance == null) return false;
+
+      if (newBalance < previousBalance) {
+        console.log("Balance dropped — ignoring");
+        sameValueIndex = 0;
+        return false;
+      }
+
+      if (newBalance > previousBalance) {
+        hasIncreasedAtLeastOnce = true;
+        sameValueIndex = 0;
+        return false;
+      }
+
+      sameValueIndex++;
+
+      if (
+        (hasIncreasedAtLeastOnce && sameValueIndex >= 2) ||
+        sameValueIndex >= 3
+      ) {
+        return true;
+      }
+
+      return false;
+    },
+    onUpdate: (newBalance, delayIndex) => {
+      console.log(
+        `Balance updated to ${newBalance} after ${delayIndex} attempts`
+      );
+      onBalanceUpdate(newBalance);
+    },
+    abortController,
+    delays: [1000, 2000, 2000, 2000, 2000, 2000, 2000, 2000, 2000],
+    initialBalance,
+  });
+};
+
+export const createRestorePoller = (
+  mnemonic,
+  isSendingPayment,
+  currentMnemonicRef,
+  abortController,
+  onRestoreComplete,
+  sparkInfo
+) => {
+  return createPollingManager({
+    pollFn: async (delayIndex) => {
+      const result = await fullRestoreSparkState({
+        sparkAddress: sparkInfo.sparkAddress,
+        batchSize: 2,
+        isSendingPayment: isSendingPayment,
+        mnemonic,
+        identityPubKey: sparkInfo.identityPubKey,
+        isInitialRestore: false,
+      });
+      return result;
+    },
+    shouldContinue: () => mnemonic === currentMnemonicRef.current,
+    validateResult: (result) => {
+      return typeof result === "number" && result > 0;
+    },
+    onUpdate: (result, delayIndex) => {
+      console.log(
+        `Restore completed after ${delayIndex + 1} attempts with ${result} txs`
+      );
+      onRestoreComplete(result);
+    },
+    abortController,
+    delays: [0, 2000, 5000],
+  });
+};
diff --git a/src/functions/spark/handleBalanceCache.js b/src/functions/spark/handleBalanceCache.js
new file mode 100644
index 0000000..091af94
--- /dev/null
+++ b/src/functions/spark/handleBalanceCache.js
@@ -0,0 +1,62 @@
+import { SPARK_CACHED_BALANCE_KEY } from "../../constants";
+import sha256Hash from "../hash";
+import Storage from "../localStorage";
+
+export default async function handleBalanceCache({
+  isCheck,
+  passedBalance,
+  mnemonic,
+  returnBalanceOnly = false,
+}) {
+  const mnemonicHash = sha256Hash(mnemonic);
+  console.log(mnemonicHash);
+
+  const cachedBalances = await migrateCachedData(mnemonicHash);
+  console.log(cachedBalances);
+
+  if (returnBalanceOnly) {
+    return cachedBalances[mnemonicHash] || 0;
+  }
+
+  if (isCheck) {
+    const cachedBalance = cachedBalances[mnemonicHash] || null;
+
+    if (!cachedBalance) {
+      cachedBalances[mnemonicHash] = passedBalance;
+      Storage.setItem(SPARK_CACHED_BALANCE_KEY, cachedBalances);
+      return { didWork: true, balance: passedBalance };
+    }
+    if (passedBalance * 1.1 >= cachedBalance) {
+      cachedBalances[mnemonicHash] = passedBalance;
+      Storage.setItem(SPARK_CACHED_BALANCE_KEY, cachedBalances);
+      return { didWork: true, balance: passedBalance };
+    } else {
+      return { didWork: false, balance: cachedBalance };
+    }
+  } else {
+    // Set the balance for this mnemonic hash
+    cachedBalances[mnemonicHash] = passedBalance;
+    Storage.setItem(SPARK_CACHED_BALANCE_KEY, cachedBalances);
+  }
+}
+
+async function migrateCachedData(mnemonicHash) {
+  const rawCachedData = Storage.getItem(SPARK_CACHED_BALANCE_KEY);
+  if (!rawCachedData) {
+    return {};
+  }
+
+  const parsedData = rawCachedData;
+
+  if (typeof parsedData === "number") {
+    console.log("Migrating old balance cache format to new hash-based format");
+
+    const newFormat = {
+      [mnemonicHash]: parsedData,
+    };
+    Storage.setItem(SPARK_CACHED_BALANCE_KEY, newFormat);
+    return newFormat;
+  }
+
+  return parsedData;
+}
diff --git a/src/functions/spark/index.js b/src/functions/spark/index.js
index 9a52488..1b35c65 100644
--- a/src/functions/spark/index.js
+++ b/src/functions/spark/index.js
@@ -15,6 +15,7 @@ import {
   migrateCachedTokens,
   saveCachedTokens,
 } from "../lrc20/cachedTokens";
+import Storage from "../localStorage";
 
 export let sparkWallet = {};
 
@@ -411,9 +412,38 @@ export const getSparkTokenTransactions = async ({
   }
 };
 
+export const getSingleTxDetails = async (mnemonic, id) => {
+  try {
+    const wallet = await getWallet(mnemonic);
+    return await wallet.getTransfer(id);
+  } catch (err) {
+    console.log("get single spark transaction error", err);
+    return undefined;
+  }
+};
+
+export const setPrivacyEnabled = async (mnemonic) => {
+  try {
+    const didSetPrivacySetting = Storage.getItem("didSetPrivacySetting");
+
+    if (didSetPrivacySetting) return;
+
+    const wallet = await getWallet(mnemonic);
+    const walletSetings = await wallet.getWalletSettings();
+    if (!walletSetings?.privateEnabled) {
+      wallet.setPrivacyEnabled(true);
+    } else {
+      Storage.setItem("didSetPrivacySetting", true);
+    }
+    return true;
+  } catch (err) {
+    console.log("Get spark balance error", err);
+  }
+};
+
 export const getCachedSparkTransactions = async (limit, identifyPubKey) => {
   try {
-    const txResponse = await getAllSparkTransactions(limit, identifyPubKey);
+    const txResponse = await getAllSparkTransactions({ limit, identifyPubKey });
 
     if (!txResponse) throw new Error("Unable to get cached spark transactins");
     return txResponse;
diff --git a/src/functions/spark/payments.js b/src/functions/spark/payments.js
index 571d5bf..c531a38 100644
--- a/src/functions/spark/payments.js
+++ b/src/functions/spark/payments.js
@@ -43,16 +43,13 @@ export const sparkPaymenWrapper = async ({
   usingZeroAmountInvoice = false,
   seletctedToken = "Bitcoin",
   mnemonic,
+  contactInfo,
 }) => {
   try {
     console.log("Begining spark payment");
-    if (!sparkWallet[sha256Hash(mnemonic)])
-      throw new Error("sparkWallet not initialized");
-    const supportFee = await calculateProgressiveBracketFee(
-      amountSats,
-      paymentType,
-      mnemonic
-    );
+    // if (!sparkWallet[sha256Hash(mnemonic)])
+    //   throw new Error("sparkWallet not initialized");
+    const supportFee = 0;
     if (getFee) {
       console.log("Calculating spark payment fee");
       let calculatedFee = 0;
@@ -65,7 +62,7 @@ export const sparkPaymenWrapper = async ({
         );
         if (!routingFee.didWork)
           throw new Error(routingFee.error || "Unable to get routing fee");
-        calculatedFee = Math.ceil(routingFee.response * 1.5);
+        calculatedFee = routingFee.response;
       } else if (paymentType === "bitcoin") {
         const feeResponse = await getSparkBitcoinPaymentFeeEstimate({
           amountSats,
@@ -110,12 +107,12 @@ export const sparkPaymenWrapper = async ({
     if (paymentType === "lightning") {
       const initialFee = Math.round(fee - supportFee);
       const lightningPayResponse = await sendSparkLightningPayment({
-        maxFeeSats: Math.ceil(initialFee * 1.5), //addding 50% buffer so we dont undershoot it
+        maxFeeSats: Math.max(initialFee, 1000),
         invoice: address,
         amountSats: usingZeroAmountInvoice ? amountSats : undefined,
         mnemonic,
       });
-      handleSupportPayment(masterInfoObject, supportFee, mnemonic);
+
       if (!lightningPayResponse.didWork)
         throw new Error(
           lightningPayResponse.error || "Error when sending lightning payment"
@@ -123,32 +120,57 @@ export const sparkPaymenWrapper = async ({
 
       const data = lightningPayResponse.paymentResponse;
 
-      const realPaymentFee = data?.fee?.originalValue
-        ? data?.fee?.originalValue /
-          (data?.fee?.originalUnit === "MILLISATOSHI" ? 1000 : 1)
-        : initialFee;
+      const paymentType = data?.type ? "spark" : "lightning";
 
-      const tx = {
-        id: data.id,
-        paymentStatus: "pending",
-        paymentType: "lightning",
-        accountId: sparkInformation.identityPubKey,
-        details: {
-          fee: realPaymentFee,
-          totalFee: supportFee + realPaymentFee,
-          supportFee: supportFee,
-          amount: amountSats,
-          description: memo || "",
-          address: address,
-          time: new Date(data.updatedAt).getTime(),
-          createdAt: new Date(data.createdAt).getTime(),
-          direction: "OUTGOING",
-          preimage: "",
-        },
-      };
-      response = tx;
+      if (paymentType === "lightning") {
+        const realPaymentFee = data?.fee?.originalValue
+          ? data?.fee?.originalValue /
+            (data?.fee?.originalUnit === "MILLISATOSHI" ? 1000 : 1)
+          : initialFee;
 
-      await bulkUpdateSparkTransactions([tx], "paymentWrapperTx", 0);
+        const tx = {
+          id: data.id,
+          paymentStatus: "pending",
+          paymentType: "lightning",
+          accountId: sparkInformation.identityPubKey,
+          details: {
+            sendingUUID: contactInfo?.uuid,
+            fee: realPaymentFee,
+            totalFee: supportFee + realPaymentFee,
+            supportFee: supportFee,
+            amount: amountSats,
+            description: memo || "",
+            address: address,
+            time: new Date(data.updatedAt).getTime(),
+            createdAt: new Date(data.createdAt).getTime(),
+            direction: "OUTGOING",
+            preimage: "",
+          },
+        };
+        response = tx;
+      } else {
+        const tx = {
+          id: data.id,
+          paymentStatus: "completed",
+          paymentType: "spark",
+          accountId: sparkInformation.identityPubKey,
+          details: {
+            sendingUUID: contactInfo?.uuid,
+            fee: 0,
+            totalFee: 0 + supportFee,
+            supportFee: supportFee,
+            amount: amountSats,
+            address: address,
+            time: new Date(data.updatedTime).getTime(),
+            direction: "OUTGOING",
+            description: memo || "",
+            senderIdentityPublicKey: data.receiverIdentityPublicKey,
+            isLRC20Payment: false,
+            LRC20Token: seletctedToken,
+          },
+        };
+        response = tx;
+      }
     } else if (paymentType === "bitcoin") {
       // make sure to import exist speed
       const onChainPayResponse = await sendSparkBitcoinPayment({
@@ -159,7 +181,7 @@ export const sparkPaymenWrapper = async ({
         deductFeeFromWithdrawalAmount: true,
         mnemonic,
       });
-      handleSupportPayment(masterInfoObject, supportFee, mnemonic);
+
       if (!onChainPayResponse.didWork)
         throw new Error(
           onChainPayResponse.error || "Error when sending bitcoin payment"
@@ -186,7 +208,6 @@ export const sparkPaymenWrapper = async ({
         },
       };
       response = tx;
-      await bulkUpdateSparkTransactions([tx], "paymentWrapperTx", 0);
     } else {
       let sparkPayResponse;
 
@@ -205,8 +226,6 @@ export const sparkPaymenWrapper = async ({
         });
       }
 
-      handleSupportPayment(masterInfoObject, supportFee, mnemonic);
-
       if (!sparkPayResponse.didWork)
         throw new Error(
           sparkPayResponse.error || "Error when sending spark payment"
@@ -219,6 +238,7 @@ export const sparkPaymenWrapper = async ({
         paymentType: "spark",
         accountId: sparkInformation.identityPubKey,
         details: {
+          sendingUUID: contactInfo?.uuid,
           fee: 0,
           totalFee: 0 + supportFee,
           supportFee: supportFee,
@@ -240,7 +260,14 @@ export const sparkPaymenWrapper = async ({
       await bulkUpdateSparkTransactions([tx], "paymentWrapperTx", 0);
     }
     console.log(response, "resonse in send function");
-    return { didWork: true, response };
+    if (sparkInformation.identityPubKey) {
+      await bulkUpdateSparkTransactions([response], "paymentWrapperTx", 0);
+    }
+    return {
+      didWork: true,
+      response,
+      shouldSave: !sparkInformation.identityPubKey,
+    };
   } catch (err) {
     console.log("Send lightning payment error", err);
     return { didWork: false, error: err.message };
diff --git a/src/functions/spark/restore.js b/src/functions/spark/restore.js
index 3ddf1dd..873025a 100644
--- a/src/functions/spark/restore.js
+++ b/src/functions/spark/restore.js
@@ -1,6 +1,7 @@
 import {
   findTransactionTxFromTxHistory,
   getCachedSparkTransactions,
+  getSingleTxDetails,
   getSparkBitcoinPaymentRequest,
   getSparkLightningPaymentStatus,
   getSparkLightningSendRequest,
@@ -15,6 +16,8 @@ import {
   deleteSparkTransaction,
   deleteUnpaidSparkLightningTransaction,
   getAllPendingSparkPayments,
+  getAllSparkContactInvoices,
+  getAllSparkTransactions,
   getAllUnpaidSparkLightningInvoices,
 } from "./transactions";
 import { transformTxToPaymentObject } from "./transformTxToPayment";
@@ -23,40 +26,174 @@ import {
   IS_SPARK_ID,
   IS_SPARK_REQUEST_ID,
 } from "../../constants";
+import sha256Hash from "../hash";
+
+const RESTORE_STATE_KEY = "spark_tx_restore_state";
+const MAX_BATCH_SIZE = 400;
+const DEFAULT_BATCH_SIZE = 5;
+const INCREMENTAL_SAVE_THRESHOLD = 200;
+
+/**
+ * Get the current restore state for an account
+ */
+async function getRestoreState(accountId, numSavedTxs) {
+  try {
+    const stateJson = Storage.getItem(`${RESTORE_STATE_KEY}_${accountId}`);
+
+    if (!stateJson) {
+      // We assume if a user has over 400 saved txs, they are fully restored
+      return {
+        isFullyRestored: numSavedTxs > 400 ? true : false,
+        lastProcessedOffset: 0,
+        lastProcessedTxId: null,
+        restoredTxCount: 0,
+      };
+    }
+    return stateJson;
+  } catch (error) {
+    console.error("Error getting restore state:", error);
+    return {
+      isFullyRestored: false,
+      lastProcessedOffset: 0,
+      lastProcessedTxId: null,
+      restoredTxCount: 0,
+    };
+  }
+}
+
+/**
+ * Update the restore state for an account
+ */
+async function updateRestoreState(accountId, state) {
+  try {
+    Storage.setItem(`${RESTORE_STATE_KEY}_${accountId}`, state);
+  } catch (error) {
+    console.error("Error updating restore state:", error);
+  }
+}
+
+/**
+ * Mark restoration as complete for an account
+ */
+async function markRestoreComplete(accountId) {
+  await updateRestoreState(accountId, {
+    isFullyRestored: true,
+    lastProcessedOffset: 0,
+    lastProcessedTxId: null,
+    restoredTxCount: 0,
+    completedAt: Date.now(),
+  });
+}
 
 export const restoreSparkTxState = async (
   BATCH_SIZE,
-  savedTxs,
+  identityPubKey,
   isSendingPayment,
   mnemonic,
-  accountId
+  accountId,
+  onProgressSave = null
 ) => {
   const restoredTxs = [];
 
   try {
-    const savedIds = new Set(savedTxs?.map((tx) => tx.sparkID) || []);
-    const pendingTxs = await getAllPendingSparkPayments(accountId);
+    const [savedTxs, pendingTxs] = await Promise.all([
+      getAllSparkTransactions({ accountId: identityPubKey, idsOnly: true }),
+      getAllPendingSparkPayments(accountId),
+    ]);
+
+    const savedIds = new Set(savedTxs || []);
 
     const txsByType = {
       lightning: pendingTxs.filter((tx) => tx.paymentType === "lightning"),
       bitcoin: pendingTxs.filter((tx) => tx.paymentType === "bitcoin"),
     };
 
-    let offset = 0;
-    let localBatchSize = !savedIds.size ? 100 : BATCH_SIZE;
+    const restoreState = await getRestoreState(accountId, savedIds.size);
+
+    const isRestoring = !restoreState.isFullyRestored;
+    let offset = isRestoring ? restoreState.lastProcessedOffset : 0;
+    const localBatchSize = isRestoring ? MAX_BATCH_SIZE : BATCH_SIZE;
+    console.log(
+      `Restore mode: ${
+        isRestoring ? "ACTIVE" : "NORMAL"
+      }, batch size: ${localBatchSize}`
+    );
+
     const donationPubKey = import.meta.env.VITE_BLITZ_SPARK_PUBKEY;
 
+    const newTxsAtFront = [];
+
+    if (isRestoring && offset > 0) {
+      console.log("Checking for new transactions at the front...");
+      try {
+        const recentTxs = await getSparkTransactions(BATCH_SIZE, 0, mnemonic);
+        const recentBatch = recentTxs.transfers || [];
+
+        for (const tx of recentBatch) {
+          if (savedIds.has(tx.id)) break;
+          // Filter donations and active sends
+          if (
+            tx.transferDirection === "OUTGOING" &&
+            tx.receiverIdentityPublicKey === donationPubKey
+          ) {
+            continue;
+          }
+          if (tx.transferDirection === "OUTGOING" && isSendingPayment) continue;
+
+          const type = sparkPaymentType(tx);
+
+          // Check against pending transactions
+          if (type === "bitcoin") {
+            const duplicate = txsByType.bitcoin.find((item) => {
+              const details = JSON.parse(item.details);
+              return (
+                tx.transferDirection === details.direction &&
+                tx.totalValue === details.amount &&
+                details.time - new Date(tx.createdTime) < 1000 * 60 * 10
+              );
+            });
+            if (duplicate) continue;
+          } else if (type === "lightning") {
+            const duplicate = txsByType.lightning.find((item) => {
+              const details = JSON.parse(item.details);
+              return (
+                tx.transferDirection === details.direction &&
+                details?.createdAt - new Date(tx.createdTime) < 1000 * 30
+              );
+            });
+            if (duplicate) continue;
+          }
+
+          newTxsAtFront.push(tx);
+        }
+
+        if (newTxsAtFront.length > 0) {
+          console.log(
+            `Found ${newTxsAtFront.length} new transactions at the front`
+          );
+          restoredTxs.push(...newTxsAtFront);
+          // Add these new tx IDs to savedIds to avoid duplicates
+          newTxsAtFront.forEach((tx) => savedIds.add(tx.id));
+        }
+      } catch (error) {
+        console.error("Error checking for new transactions:", error);
+      }
+    }
+
+    let batchCounter = 0;
+    let foundOverlap = false;
+
     while (true) {
       const txs = await getSparkTransactions(localBatchSize, offset, mnemonic);
       const batchTxs = txs.transfers || [];
 
       if (!batchTxs.length) {
         console.log("No more transactions found, ending restore.");
+        await markRestoreComplete(accountId);
         break;
       }
 
       // Process batch and check for overlap simultaneously
-      let foundOverlap = false;
       const newBatchTxs = [];
       for (const tx of batchTxs) {
         // Check for overlap first (most likely to break early)
@@ -109,8 +246,27 @@ export const restoreSparkTxState = async (
 
       // Add filtered transactions to result
       restoredTxs.push(...newBatchTxs);
+      batchCounter++;
+
+      if (isRestoring && restoredTxs.length >= INCREMENTAL_SAVE_THRESHOLD) {
+        console.log(`Incremental save: ${restoredTxs.length} transactions`);
+
+        await updateRestoreState(accountId, {
+          isFullyRestored: false,
+          lastProcessedOffset: offset + localBatchSize,
+          lastProcessedTxId: newBatchTxs[newBatchTxs.length - 1]?.id || null,
+          restoredTxCount: restoreState.restoredTxCount + restoredTxs.length,
+        });
+
+        if (onProgressSave) {
+          await onProgressSave(restoredTxs.slice());
+        }
+
+        restoredTxs.length = 0;
+      }
 
       if (foundOverlap) {
+        await markRestoreComplete(accountId);
         break;
       }
 
@@ -119,7 +275,10 @@ export const restoreSparkTxState = async (
 
     console.log(`Total restored transactions: ${restoredTxs.length}`);
 
-    return { txs: restoredTxs };
+    return {
+      txs: restoredTxs,
+      isRestoreComplete: !isRestoring || foundOverlap,
+    };
   } catch (error) {
     console.error("Error in spark restore history state:", error);
     return { txs: [] };
@@ -141,7 +300,8 @@ async function processTransactionChunk(
   sparkAddress,
   unpaidInvoices,
   identityPubKey,
-  numberOfRestoredTxs
+  numberOfRestoredTxs,
+  unpaidContactInvoices
 ) {
   const chunkPaymentObjects = [];
 
@@ -154,7 +314,9 @@ async function processTransactionChunk(
         true,
         unpaidInvoices,
         identityPubKey,
-        numberOfRestoredTxs
+        numberOfRestoredTxs,
+        undefined,
+        unpaidContactInvoices
       );
       if (paymentObject) {
         chunkPaymentObjects.push(paymentObject);
@@ -167,9 +329,10 @@ async function processTransactionChunk(
   return chunkPaymentObjects;
 }
 
+let isRestoringState = false;
 export async function fullRestoreSparkState({
   sparkAddress,
-  batchSize = 50,
+  batchSize = DEFAULT_BATCH_SIZE,
   chunkSize = 100,
   maxConcurrentChunks = 3, // Reduced for better responsiveness
   yieldInterval = 50, // Yield every N milliseconds
@@ -177,19 +340,71 @@ export async function fullRestoreSparkState({
   isSendingPayment,
   mnemonic,
   identityPubKey,
+  isInitialRestore,
 }) {
   try {
+    if (isRestoringState) {
+      console.log("already restoring state");
+      return;
+    }
     console.log("running");
-    const savedTxs = await getCachedSparkTransactions(null, identityPubKey);
+    isRestoringState = true;
+
+    const handleProgressSave = async (txBatch) => {
+      if (!txBatch.length) return;
+
+      const [unpaidInvoices, unpaidContactInvoices] = await Promise.all([
+        getAllUnpaidSparkLightningInvoices(),
+        getAllSparkContactInvoices(),
+      ]);
+
+      const paymentObjects = [];
+      for (const tx of txBatch) {
+        try {
+          const paymentObject = await transformTxToPaymentObject(
+            tx,
+            sparkAddress,
+            undefined,
+            true,
+            unpaidInvoices,
+            identityPubKey,
+            txBatch.length,
+            undefined,
+            unpaidContactInvoices
+          );
+          if (paymentObject) {
+            paymentObjects.push(paymentObject);
+          }
+        } catch (err) {
+          console.error(
+            "Error transforming tx during incremental save:",
+            tx.id,
+            err
+          );
+        }
+      }
+
+      if (paymentObjects.length) {
+        await bulkUpdateSparkTransactions(paymentObjects, "incrementalRestore");
+        console.log(
+          `Incrementally saved ${paymentObjects.length} transactions`
+        );
+      }
+    };
+
     const restored = await restoreSparkTxState(
       batchSize,
-      savedTxs,
+      identityPubKey,
       isSendingPayment,
       mnemonic,
-      identityPubKey
+      identityPubKey,
+      handleProgressSave
     );
-
-    const unpaidInvoices = await getAllUnpaidSparkLightningInvoices();
+    if (!restored.txs.length) return;
+    const [unpaidInvoices, unpaidContactInvoices] = await Promise.all([
+      getAllUnpaidSparkLightningInvoices(),
+      getAllSparkContactInvoices(),
+    ]);
     const txChunks = chunkArray(restored.txs, chunkSize);
 
     console.log(
@@ -210,7 +425,8 @@ export async function fullRestoreSparkState({
           sparkAddress,
           unpaidInvoices,
           identityPubKey,
-          restored.txs.length
+          restored.txs.length,
+          unpaidContactInvoices
         )
       );
 
@@ -244,60 +460,19 @@ export async function fullRestoreSparkState({
     );
 
     if (allPaymentObjects.length) {
-      bulkUpdateSparkTransactions(allPaymentObjects, "fullUpdate");
+      await bulkUpdateSparkTransactions(allPaymentObjects, "fullUpdate");
     }
 
     return allPaymentObjects.length;
   } catch (err) {
     console.log("full restore spark state error", err);
     return false;
+  } finally {
+    isRestoringState = false;
   }
 }
 
-export const findSignleTxFromHistory = async (txid, BATCH_SIZE, mnemonic) => {
-  let restoredTx;
-  try {
-    // here we do not want to save any tx to be shown, we only want to flag that it came from restore and then when we get the actual notification of it we can block the navigation
-    let start = 0;
-
-    let foundOverlap = false;
-
-    do {
-      const txs = await getSparkTransactions(
-        start + BATCH_SIZE,
-        start,
-        mnemonic
-      );
-      const batchTxs = txs.transfers || [];
-
-      if (!batchTxs.length) {
-        console.log("No more transactions found, ending restore.");
-        break;
-      }
-
-      // Check for overlap with saved transactions
-      const overlap = batchTxs.find((tx) => tx.id === txid);
-
-      if (overlap) {
-        console.log("Found overlap with saved transactions, stopping restore.");
-        foundOverlap = true;
-        restoredTx = overlap;
-      }
-
-      start += BATCH_SIZE;
-    } while (!foundOverlap);
-
-    // Filter out any already-saved txs or dontation payments
-    console.log(`Restored transaction`, restoredTx);
-
-    return { tx: restoredTx };
-  } catch (error) {
-    console.error("Error in spark restore history state:", error);
-    return { tx: null };
-  }
-};
 let isUpdatingSparkTxStatus = false;
-
 export const updateSparkTxStatus = async (mnemoninc, accountId) => {
   try {
     if (isUpdatingSparkTxStatus) {
@@ -341,19 +516,22 @@ export const updateSparkTxStatus = async (mnemoninc, accountId) => {
         mnemoninc,
         accountId
       ),
-      processBitcoinTransactions(txsByType.bitcoin, mnemoninc),
-      processSparkTransactions(txsByType.spark),
+      processBitcoinTransactions(txsByType.bitcoin, mnemoninc, accountId),
+      processSparkTransactions(txsByType.spark, mnemoninc),
     ]);
 
     const updatedTxs = [
       ...lightningUpdates,
       ...bitcoinUpdates,
-      ...sparkUpdates,
+      ...sparkUpdates.updatedTxs,
     ];
 
     if (!updatedTxs.length) return { updated: [] };
 
-    await bulkUpdateSparkTransactions(updatedTxs, "restoreTxs");
+    await bulkUpdateSparkTransactions(
+      updatedTxs,
+      sparkUpdates.includesGift ? "fullUpdate-waitBalance" : "txStatusUpdate"
+    );
     console.log(`Updated transactions:`, updatedTxs);
     return { updated: updatedTxs };
   } catch (error) {
@@ -402,30 +580,31 @@ async function processLightningTransactions(
       continue;
     }
 
-    const findTxResponse = await findTransactionTxFromTxHistory(
-      result.id,
-      transfersOffset,
-      cachedTransfers,
-      mnemonic
-    );
+    const findTxResponse = await getSingleTxDetails(mnemonic, result.id);
 
-    if (findTxResponse.offset && findTxResponse.foundTransfers) {
-      transfersOffset = findTxResponse.offset;
-      cachedTransfers = findTxResponse.foundTransfers;
+    if (!findTxResponse) {
+      // If no transaction is found just call it completed
+      const details = JSON.parse(result.txStateUpdate.details);
+      newTxs.push({
+        tempId: result.txStateUpdate.sparkID,
+        useTempId: true,
+        ...result.txStateUpdate,
+        details,
+        paymentStatus: "completed",
+      });
+      continue;
     }
 
-    if (!findTxResponse.didWork || !findTxResponse.bitcoinTransfer) continue;
-
-    const { offset, foundTransfers, bitcoinTransfer } = findTxResponse;
-    transfersOffset = offset;
-    cachedTransfers = foundTransfers;
-
-    if (!bitcoinTransfer) continue;
+    const bitcoinTransfer = findTxResponse;
 
     const paymentStatus = getSparkPaymentStatus(bitcoinTransfer.status);
     const expiryDate = new Date(bitcoinTransfer.expiryTime);
 
-    if (paymentStatus === "pending" && expiryDate < Date.now()) {
+    if (
+      (paymentStatus === "pending" && expiryDate < Date.now()) ||
+      (bitcoinTransfer.transferDirection === "OUTGOING" &&
+        bitcoinTransfer.status === "TRANSFER_STATUS_SENDER_KEY_TWEAK_PENDING")
+    ) {
       await deleteSparkTransaction(result.id);
       continue;
     }
@@ -452,111 +631,112 @@ async function processLightningTransaction(
   mnemonic
 ) {
   const details = JSON.parse(txStateUpdate.details);
+  const possibleOptions = unpaidInvoicesByAmount.get(details.amount) || [];
 
-  if (txStateUpdate.paymentType === "lightning") {
-    const possibleOptions = unpaidInvoicesByAmount.get(details.amount) || [];
-
-    if (
-      !IS_SPARK_REQUEST_ID.test(txStateUpdate.sparkID) &&
-      !possibleOptions.length
-    ) {
-      // goes to be handled later by transform tx to payment
-      return {
-        id: txStateUpdate.sparkID,
-        paymentStatus: "",
-        paymentType: "lightning",
-        accountId: txStateUpdate.accountId,
-        lookThroughTxHistory: true,
-      };
-    }
-
-    if (!IS_SPARK_REQUEST_ID.test(txStateUpdate.sparkID)) {
-      // Process invoice matching with retry logic
-      const matchResult = await findMatchingInvoice(
-        possibleOptions,
-        txStateUpdate.sparkID,
-        mnemonic
-      );
-
-      if (matchResult.savedInvoice) {
-        await deleteUnpaidSparkLightningTransaction(
-          matchResult.savedInvoice.sparkID
-        );
-      }
-
-      const savedDetails = matchResult.savedInvoice?.details
-        ? JSON.parse(matchResult.savedInvoice.details)
-        : {};
-
-      return {
-        useTempId: true,
-        tempId: txStateUpdate.sparkID,
-        id: matchResult.matchedUnpaidInvoice
-          ? matchResult.matchedUnpaidInvoice.transfer.sparkId
-          : txStateUpdate.sparkID,
-        paymentStatus: "completed",
-        // getSparkPaymentStatus(
-        //   matchResult.matchedUnpaidInvoice.status,
-        // ),
-        paymentType: "lightning",
-        accountId: txStateUpdate.accountId,
-        details: {
-          ...savedDetails,
-          description: matchResult.savedInvoice?.description || "",
-          address:
-            matchResult.matchedUnpaidInvoice?.invoice?.encodedInvoice || "",
-          preimage: matchResult.matchedUnpaidInvoice?.paymentPreimage || "",
-          shouldNavigate: matchResult.savedInvoice?.shouldNavigate ?? 0,
-          isLNURL: savedDetails?.isLNURL || false,
-        },
-      };
-    }
-
-    // Handle spark request IDs
-    const sparkResponse =
-      details.direction === "INCOMING"
-        ? await getSparkLightningPaymentStatus({
-            lightningInvoiceId: txStateUpdate.sparkID,
-            mnemonic,
-          })
-        : await getSparkLightningSendRequest(txStateUpdate.sparkID, mnemonic);
+  if (
+    !IS_SPARK_REQUEST_ID.test(txStateUpdate.sparkID) &&
+    !possibleOptions.length
+  ) {
+    // goes to be handled later by transform tx to payment
+    return {
+      id: txStateUpdate.sparkID,
+      paymentStatus: "",
+      paymentType: "lightning",
+      accountId: txStateUpdate.accountId,
+      lookThroughTxHistory: true,
+      txStateUpdate,
+    };
+  }
 
-    if (
-      details.direction === "OUTGOING" &&
-      getSparkPaymentStatus(sparkResponse.status) === "failed"
-    )
-      return {
-        ...txStateUpdate,
-        id: txStateUpdate.sparkID,
-        details: {
-          ...details,
-        },
-        paymentStatus: "failed",
-      };
+  if (!IS_SPARK_REQUEST_ID.test(txStateUpdate.sparkID)) {
+    // Process invoice matching with retry logic
+    const matchResult = await findMatchingInvoice(
+      possibleOptions,
+      txStateUpdate.sparkID,
+      mnemonic
+    );
 
-    if (!sparkResponse?.transfer) return null;
+    // if (matchResult.savedInvoice) {
+    //   await deleteUnpaidSparkLightningTransaction(
+    //     matchResult.savedInvoice.sparkID
+    //   );
+    // }
 
-    // const fee =
-    //   sparkResponse.fee.originalValue /
-    //   (sparkResponse.fee.originalUnit === 'MILLISATOSHI' ? 1000 : 1);
+    const savedDetails = matchResult.savedInvoice?.details
+      ? JSON.parse(matchResult.savedInvoice.details)
+      : {};
 
     return {
       useTempId: true,
       tempId: txStateUpdate.sparkID,
-      id: sparkResponse.transfer.sparkId,
-      paymentStatus: "completed", // getSparkPaymentStatus(sparkResponse.status)
+      id: matchResult.matchedUnpaidInvoice
+        ? matchResult.matchedUnpaidInvoice.transfer.sparkId
+        : txStateUpdate.sparkID,
+      paymentStatus: "completed",
+      // getSparkPaymentStatus(
+      //   matchResult.matchedUnpaidInvoice.status,
+      // ),
       paymentType: "lightning",
       accountId: txStateUpdate.accountId,
       details: {
-        ...details,
-        // fee: Math.round(fee),
-        // totalFee: Math.round(fee) + (details.supportFee || 0),
-        preimage: sparkResponse.paymentPreimage || "",
+        ...savedDetails,
+        description: matchResult.savedInvoice?.description || "",
+        address:
+          matchResult.matchedUnpaidInvoice?.invoice?.encodedInvoice || "",
+        preimage: matchResult.matchedUnpaidInvoice?.paymentPreimage || "",
+        shouldNavigate: matchResult.savedInvoice?.shouldNavigate ?? 0,
+        isLNURL: savedDetails?.isLNURL || false,
       },
     };
   }
 
-  return null;
+  // Handle spark request IDs
+  const sparkResponse =
+    details.direction === "INCOMING"
+      ? await getSparkLightningPaymentStatus({
+          lightningInvoiceId: txStateUpdate.sparkID,
+          mnemonic,
+        })
+      : await getSparkLightningSendRequest(txStateUpdate.sparkID, mnemonic);
+  const paymentStatus = getSparkPaymentStatus(sparkResponse.status);
+  if (
+    details.direction === "OUTGOING" &&
+    getSparkPaymentStatus(sparkResponse.status) === "failed"
+  )
+    return {
+      ...txStateUpdate,
+      id: txStateUpdate.sparkID,
+      details: {
+        ...details,
+      },
+      paymentStatus: "failed",
+    };
+
+  if (!sparkResponse?.transfer) return null;
+
+  const preimage = sparkResponse.paymentPreimage || "";
+
+  if (!preimage) return null;
+
+  // const fee =
+  //   sparkResponse.fee.originalValue /
+  //   (sparkResponse.fee.originalUnit === 'MILLISATOSHI' ? 1000 : 1);
+
+  return {
+    useTempId: true,
+    tempId: txStateUpdate.sparkID,
+    id: sparkResponse.transfer.sparkId,
+    paymentStatus:
+      paymentStatus === "completed" || preimage ? "completed" : paymentStatus,
+    paymentType: "lightning",
+    accountId: txStateUpdate.accountId,
+    details: {
+      ...details,
+      // fee: Math.round(fee),
+      // totalFee: Math.round(fee) + (details.supportFee || 0),
+      preimage: preimage,
+    },
+  };
 }
 
 async function findMatchingInvoice(possibleOptions, sparkID, mnemonic) {
@@ -616,7 +796,7 @@ async function getPaymentDetailsWithRetry(
   return null;
 }
 
-async function processBitcoinTransactions(bitcoinTxs, mnemonic) {
+async function processBitcoinTransactions(bitcoinTxs, mnemonic, accountId) {
   const lastRun = Storage.getItem("lastRunBitcoinTxUpdate");
 
   const now = Date.now();
@@ -633,9 +813,6 @@ async function processBitcoinTransactions(bitcoinTxs, mnemonic) {
   }
 
   const updatedTxs = [];
-  let transfersOffset = 0;
-  let cachedTransfers = [];
-
   for (const txStateUpdate of bitcoinTxs) {
     const details = JSON.parse(txStateUpdate.details);
 
@@ -643,31 +820,51 @@ async function processBitcoinTransactions(bitcoinTxs, mnemonic) {
       details.direction === "INCOMING" ||
       !IS_BITCOIN_REQUEST_ID.test(txStateUpdate.sparkID)
     ) {
-      if (!IS_SPARK_ID.test(txStateUpdate.sparkID)) continue;
-
-      const findTxResponse = await findTransactionTxFromTxHistory(
-        txStateUpdate.sparkID,
-        transfersOffset,
-        cachedTransfers,
-        mnemonic
-      );
+      if (!IS_SPARK_ID.test(txStateUpdate.sparkID)) {
+        const allPayments = await getAllSparkTransactions({ accountId });
+        const foundPayment = allPayments.find((payment) => {
+          if (payment.paymentType === "bitcoin") {
+            const details = JSON.parse(payment.details);
+            if (details.onChainTxid === txStateUpdate.sparkID) return true;
+          }
+        });
+        if (foundPayment) {
+          const newDetails = JSON.parse(foundPayment.details);
+          const oldDetails = JSON.parse(txStateUpdate.details);
+
+          if (
+            sha256Hash(JSON.stringify(foundPayment)) ===
+            sha256Hash(JSON.stringify(txStateUpdate))
+          )
+            continue;
 
-      if (findTxResponse.offset && findTxResponse.foundTransfers) {
-        transfersOffset = findTxResponse.offset;
-        cachedTransfers = findTxResponse.foundTransfers;
+          updatedTxs.push({
+            useTempId: true,
+            tempId: txStateUpdate.sparkID,
+            id: foundPayment.sparkID,
+            paymentStatus: foundPayment.paymentStatus,
+            paymentType: "bitcoin",
+            accountId: foundPayment.accountId,
+            details: {
+              ...newDetails,
+              address: oldDetails.address || "",
+              description: oldDetails.description || "",
+            },
+          });
+        }
+        continue;
       }
 
-      if (!findTxResponse.didWork || !findTxResponse.bitcoinTransfer) continue;
-
-      const { offset, foundTransfers, bitcoinTransfer } = findTxResponse;
-      transfersOffset = offset;
-      cachedTransfers = foundTransfers;
+      const transfer = await getSingleTxDetails(
+        mnemonic,
+        txStateUpdate.sparkID
+      );
 
-      if (!bitcoinTransfer) continue;
+      if (!transfer) continue;
 
       updatedTxs.push({
         id: txStateUpdate.sparkID,
-        paymentStatus: getSparkPaymentStatus(bitcoinTransfer.status),
+        paymentStatus: getSparkPaymentStatus(transfer.status),
         paymentType: "bitcoin",
         accountId: txStateUpdate.accountId,
       });
@@ -731,11 +928,36 @@ async function processBitcoinTransactions(bitcoinTxs, mnemonic) {
   return updatedTxs;
 }
 
-async function processSparkTransactions(sparkTxs) {
-  return sparkTxs.map((txStateUpdate) => ({
-    id: txStateUpdate.sparkID,
-    paymentStatus: "completed",
-    paymentType: "spark",
-    accountId: txStateUpdate.accountId,
-  }));
+async function processSparkTransactions(sparkTxs, mnemonic) {
+  let includesGift = false;
+  let updatedTxs = [];
+  for (const txStateUpdate of sparkTxs) {
+    const details = JSON.parse(txStateUpdate.details);
+
+    if (details.isGift) {
+      const findTxResponse = await getSingleTxDetails(
+        mnemonic,
+        txStateUpdate.sparkID
+      );
+
+      if (!findTxResponse) continue;
+
+      includesGift = true;
+      updatedTxs.push({
+        id: txStateUpdate.sparkID,
+        paymentStatus: getSparkPaymentStatus(findTxResponse.status),
+        paymentType: "spark",
+        accountId: txStateUpdate.accountId,
+      });
+    } else {
+      updatedTxs.push({
+        id: txStateUpdate.sparkID,
+        paymentStatus: "completed",
+        paymentType: "spark",
+        accountId: txStateUpdate.accountId,
+      });
+    }
+  }
+
+  return { updatedTxs, includesGift };
 }
diff --git a/src/functions/spark/transactions.js b/src/functions/spark/transactions.js
index c69bfbd..a8f9601 100644
--- a/src/functions/spark/transactions.js
+++ b/src/functions/spark/transactions.js
@@ -4,12 +4,13 @@ import EventEmitter from "events";
 export const SPARK_TRANSACTIONS_DATABASE_NAME = "spark-info-db";
 export const SPARK_TRANSACTIONS_TABLE_NAME = "SPARK_TRANSACTIONS";
 export const LIGHTNING_REQUEST_IDS_TABLE_NAME = "LIGHTNING_REQUEST_IDS";
+export const SPARK_REQUEST_IDS_TABLE_NAME = "SPARK_REQUEST_IDS";
 export const sparkTransactionsEventEmitter = new EventEmitter();
 export const SPARK_TX_UPDATE_ENVENT_NAME = "UPDATE_SPARK_STATE";
 let bulkUpdateTransactionQueue = [];
 let isProcessingBulkUpdate = false;
 
-let dbPromise = openDB(SPARK_TRANSACTIONS_DATABASE_NAME, 1, {
+let dbPromise = openDB(SPARK_TRANSACTIONS_DATABASE_NAME, 2, {
   upgrade(db) {
     if (!db.objectStoreNames.contains(SPARK_TRANSACTIONS_TABLE_NAME)) {
       const txStore = db.createObjectStore(SPARK_TRANSACTIONS_TABLE_NAME, {
@@ -22,6 +23,11 @@ let dbPromise = openDB(SPARK_TRANSACTIONS_DATABASE_NAME, 1, {
         keyPath: "sparkID",
       });
     }
+    if (!db.objectStoreNames.contains(SPARK_REQUEST_IDS_TABLE_NAME)) {
+      db.createObjectStore(SPARK_REQUEST_IDS_TABLE_NAME, {
+        keyPath: "sparkID",
+      });
+    }
   },
 });
 
@@ -44,10 +50,18 @@ const parseDetails = (details) => {
   else return details;
 };
 
-export const getAllSparkTransactions = async (limit = null, accountId) => {
+export const getAllSparkTransactions = async (options = {}) => {
   try {
     const db = await dbPromise;
     const all = await db.getAll(SPARK_TRANSACTIONS_TABLE_NAME);
+    const {
+      limit = null,
+      offset = null,
+      accountId = null,
+      startRange = null,
+      endRange = null,
+      idsOnly = false,
+    } = options;
 
     // Filter by accountId if provided
     let filtered = all;
@@ -64,7 +78,7 @@ export const getAllSparkTransactions = async (limit = null, accountId) => {
     }));
 
     // Sort by time (newest first). Use numeric fallback 0 when missing.
-    const sorted = normalized.sort((a, b) => {
+    filtered = normalized.sort((a, b) => {
       const aTime = JSON.parse(a.details).time;
       const bTime = JSON.parse(b.details).time;
 
@@ -73,10 +87,10 @@ export const getAllSparkTransactions = async (limit = null, accountId) => {
 
     // Apply limit if provided
     if (limit) {
-      return sorted.slice(0, limit);
+      filtered = filtered.slice(0, limit);
     }
 
-    return sorted;
+    return idsOnly ? filtered.map((row) => row.sparkID) : filtered;
   } catch (err) {
     console.error("getAllSparkTransactions error:", err);
     return [];
@@ -113,6 +127,94 @@ export const getAllPendingSparkPayments = async (accountId) => {
   }
 };
 
+export const getAllSparkContactInvoices = async () => {
+  try {
+    const db = await dbPromise;
+    return await db.getAll(SPARK_REQUEST_IDS_TABLE_NAME);
+  } catch (error) {
+    console.error("Error fetching contacts saved transactions:", error);
+  }
+};
+
+export const addSingleUnpaidSparkTransaction = async (tx) => {
+  if (!tx || !tx.id) {
+    console.error("Invalid transaction object");
+    return false;
+  }
+
+  try {
+    const db = await dbPromise;
+    await db.put(SPARK_REQUEST_IDS_TABLE_NAME, {
+      sparkID: tx.id,
+      description: tx.description,
+      sendersPubkey: tx.sendersPubkey,
+      details: JSON.stringify(tx.details),
+    });
+    return true;
+  } catch (error) {
+    console.error("Error adding spark transaction:", error);
+    return false;
+  }
+};
+
+export const addBulkUnpaidSparkContactTransactions = async (transactions) => {
+  if (!Array.isArray(transactions) || transactions.length === 0) {
+    console.error("Invalid transactions array");
+    return { success: false, added: 0, failed: 0 };
+  }
+
+  const validTransactions = transactions.filter((tx) => tx && tx.id);
+
+  if (validTransactions.length === 0) {
+    console.error("No valid transactions to add");
+    return { success: false, added: 0, failed: transactions.length };
+  }
+
+  try {
+    const db = await dbPromise;
+    const tx = db.transaction(SPARK_REQUEST_IDS_TABLE_NAME, "readwrite");
+    const store = tx.objectStore(SPARK_REQUEST_IDS_TABLE_NAME);
+
+    // Add all valid transactions
+    for (const transaction of validTransactions) {
+      await store.put({
+        sparkID: transaction.id,
+        description: transaction.description,
+        sendersPubkey: transaction.sendersPubkey,
+        details: JSON.stringify(transaction.details),
+      });
+    }
+
+    // Wait for the transaction to complete
+    await tx.done;
+
+    console.log(
+      `Successfully added ${validTransactions.length} unpaid contact invoices`
+    );
+
+    return {
+      success: true,
+      added: validTransactions.length,
+      failed: transactions.length - validTransactions.length,
+    };
+  } catch (error) {
+    console.error("Error adding bulk spark contact transactions:", error);
+    return { success: false, added: 0, failed: transactions.length };
+  }
+};
+
+export const deleteSparkContactTransaction = async (sparkID) => {
+  try {
+    const db = await dbPromise;
+    await db.delete(SPARK_REQUEST_IDS_TABLE_NAME, sparkID);
+
+    return true;
+  } catch (error) {
+    console.error(`Error deleting transaction ${sparkID}:`, error);
+    return false;
+  }
+};
+
 export const getAllUnpaidSparkLightningInvoices = async () => {
   try {
     const db = await dbPromise;
@@ -463,6 +565,17 @@ export const deleteUnpaidSparkLightningTransactionTable = async () => {
   db.deleteObjectStore(LIGHTNING_REQUEST_IDS_TABLE_NAME);
 };
 
+export const deleteSparkContactsTransactionsTable = async () => {
+  try {
+    const db = await dbPromise;
+    db.deleteObjectStore(SPARK_REQUEST_IDS_TABLE_NAME);
+    return true;
+  } catch (error) {
+    console.error("Error deleting spark_transactions table:", error);
+    return false;
+  }
+};
+
 export const wipeEntireSparkDatabase = async () => {
   try {
     await deleteDB(SPARK_TRANSACTIONS_DATABASE_NAME);
diff --git a/src/functions/spark/transformTxToPayment.js b/src/functions/spark/transformTxToPayment.js
index e711093..5afcfd7 100644
--- a/src/functions/spark/transformTxToPayment.js
+++ b/src/functions/spark/transformTxToPayment.js
@@ -1,5 +1,7 @@
 import { decode } from "bolt11";
 import { getSparkPaymentStatus, sparkPaymentType } from ".";
+import calculateProgressiveBracketFee from "./calculateSupportFee";
+import { deleteSparkContactTransaction } from "./transactions";
 
 export async function transformTxToPaymentObject(
   tx,
@@ -8,25 +10,30 @@ export async function transformTxToPaymentObject(
   isRestore,
   unpaidLNInvoices,
   identityPubKey,
-  numTxsBeingRestored = 1
+  numTxsBeingRestored = 1,
+  forceOutgoing = false,
+  unpaidContactInvoices
 ) {
   // Defer all payments to the 10 second interval to be updated
   const paymentType = forcePaymentType
     ? forcePaymentType
     : sparkPaymentType(tx);
+  const paymentAmount = tx.totalValue;
+
+  const accountId = forceOutgoing
+    ? tx.receiverIdentityPublicKey
+    : tx.transferDirection === "OUTGOING"
+    ? tx.senderIdentityPublicKey
+    : tx.receiverIdentityPublicKey;
 
   if (paymentType === "lightning") {
-    const foundInvoice = unpaidLNInvoices.find((item) => {
-      const details = JSON.parse(item.details);
-      return (
-        item.amount === tx.totalValue &&
-        Math.abs(details?.createdTime - new Date(tx.createdTime).getTime()) <
-          1000 * 30
-      );
-    });
+    const userRequest = tx.userRequest;
+    const userRequestId = userRequest?.id;
+    const foundInvoice = unpaidLNInvoices.find(
+      (item) => item.sparkID === userRequestId
+    );
 
     const status = getSparkPaymentStatus(tx.status);
-    const userRequest = tx.userRequest;
     const isSendRequest = userRequest?.typename === "LightningSendRequest";
     const invoice = userRequest
       ? isSendRequest
@@ -34,6 +41,22 @@ export async function transformTxToPaymentObject(
         : userRequest.invoice?.encodedInvoice
       : "";
 
+    const paymentFee = userRequest
+      ? isSendRequest
+        ? userRequest.fee.originalValue /
+          (userRequest.fee.originalUnit === "MILLISATOSHI" ? 1000 : 1)
+        : 0
+      : 0;
+    const preimage = userRequest ? userRequest?.paymentPreimage || "" : "";
+    const supportFee = await calculateProgressiveBracketFee(
+      paymentAmount,
+      "lightning"
+    );
+
+    const foundInvoiceDetails = foundInvoice
+      ? JSON.parse(foundInvoice.details)
+      : undefined;
+
     const description =
       numTxsBeingRestored < 20
         ? invoice
@@ -46,49 +69,70 @@ export async function transformTxToPaymentObject(
 
     return {
       id: tx.transfer ? tx.transfer.sparkId : tx.id,
-      paymentStatus: status,
+      paymentStatus: status === "completed" || preimage ? "completed" : status,
       paymentType: "lightning",
-      accountId: identityPubKey,
+      accountId: accountId,
       details: {
-        fee: 0,
-        amount: tx.totalValue,
+        fee: paymentFee,
+        totalFee: paymentFee + supportFee,
+        supportFee: supportFee,
+        amount: paymentAmount - paymentFee,
         address: userRequest
           ? isSendRequest
             ? userRequest?.encodedInvoice
             : userRequest.invoice?.encodedInvoice
           : "",
+        createdTime: foundInvoiceDetails
+          ? foundInvoiceDetails.createdTime
+          : new Date(tx.createdTime).getTime(),
         time: tx.updatedTime
           ? new Date(tx.updatedTime).getTime()
           : new Date().getTime(),
         direction: tx.transferDirection,
         description: description,
-        preimage: userRequest ? userRequest?.paymentPreimage || "" : "",
+        preimage: preimage,
         isRestore,
-        isBlitzContactPayment: foundInvoice
-          ? JSON.parse(foundInvoice.details)?.isBlitzContactPayment
+        isBlitzContactPayment: foundInvoiceDetails
+          ? foundInvoiceDetails?.isBlitzContactPayment
           : undefined,
         shouldNavigate: foundInvoice ? foundInvoice?.shouldNavigate : undefined,
-        isLNURL: foundInvoice
-          ? JSON.parse(foundInvoice.details)?.isLNURL
+        isLNURL: foundInvoiceDetails ? foundInvoiceDetails?.isLNURL : undefined,
+        sendingUUID: foundInvoiceDetails
+          ? foundInvoiceDetails?.sendingUUID
           : undefined,
       },
     };
   } else if (paymentType === "spark") {
+    const foundInvoice = unpaidContactInvoices?.find(
+      (savedTx) => savedTx.sparkID === tx.id
+    );
+    const paymentFee = tx.transferDirection === "OUTGOING" ? 0 : 0;
+    const supportFee = await (tx.transferDirection === "OUTGOING"
+      ? calculateProgressiveBracketFee(paymentAmount, "spark")
+      : Promise.resolve(0));
+
+    if (foundInvoice?.sparkID) {
+      deleteSparkContactTransaction(foundInvoice.sparkID);
+    }
     return {
       id: tx.id,
       paymentStatus: "completed",
       paymentType: "spark",
-      accountId: identityPubKey,
+      accountId: accountId,
       details: {
-        fee: 0,
-        amount: tx.totalValue,
+        sendingUUID: foundInvoice?.sendersPubkey,
+        fee: paymentFee,
+        totalFee: paymentFee + supportFee,
+        supportFee: supportFee,
+        amount: paymentAmount - paymentFee,
         address: sparkAddress,
         time: tx.updatedTime
           ? new Date(tx.updatedTime).getTime()
           : new Date().getTime(),
         direction: tx.transferDirection,
         senderIdentityPublicKey: tx.senderIdentityPublicKey,
-        description: "",
+        description: tx.description || foundInvoice?.description || "",
+        isGift: tx.isGift,
         isRestore,
       },
     };
@@ -97,6 +141,7 @@ export async function transformTxToPaymentObject(
     const userRequest = tx.userRequest;
 
     let fee = 0;
+    let blitzFee = 0;
 
     if (
       tx.transferDirection === "OUTGOING" &&
@@ -104,18 +149,24 @@ export async function transformTxToPaymentObject(
       userRequest?.l1BroadcastFee
     ) {
       fee =
-        userRequest.fee.originalValue +
-        userRequest.l1BroadcastFee.originalValue;
+        userRequest.fee.originalValue /
+          (userRequest.fee.originalUnit === "SATOSHI" ? 1 : 1000) +
+        userRequest.l1BroadcastFee.originalValue /
+          (userRequest.l1BroadcastFee.originalUnit === "SATOSHI" ? 1 : 1000);
+
+      blitzFee = await calculateProgressiveBracketFee(paymentAmount, "bitcoin");
     }
 
     return {
       id: tx.id,
       paymentStatus: status,
       paymentType: "bitcoin",
-      accountId: identityPubKey,
+      accountId: accountId,
       details: {
         fee,
-        amount: tx.totalValue,
+        totalFee: blitzFee + fee,
+        supportFee: blitzFee,
+        amount: paymentAmount - fee,
         address: tx.address || "",
         time: tx.updatedTime
           ? new Date(tx.updatedTime).getTime()
diff --git a/src/functions/textInputConvertValue.js b/src/functions/textInputConvertValue.js
new file mode 100644
index 0000000..1283a11
--- /dev/null
+++ b/src/functions/textInputConvertValue.js
@@ -0,0 +1,26 @@
+import { SATSPERBITCOIN } from "../constants";
+
+const convertTextInputValue = (amountValue, fiatStats, inputDenomination) => {
+  try {
+    return !amountValue
+      ? ""
+      : inputDenomination === "fiat"
+      ? String(
+          Math.round(
+            (SATSPERBITCOIN / (fiatStats?.value || 80_000)) *
+              Number(amountValue)
+          )
+        )
+      : String(
+          (
+            ((fiatStats?.value || 80_000) / SATSPERBITCOIN) *
+            Number(amountValue)
+          ).toFixed(2)
+        );
+  } catch (err) {
+    console.log("Converting value erorr", err);
+    return "";
+  }
+};
+
+export default convertTextInputValue;
diff --git a/src/functions/timeFormatter.js b/src/functions/timeFormatter.js
new file mode 100644
index 0000000..a5dc844
--- /dev/null
+++ b/src/functions/timeFormatter.js
@@ -0,0 +1,34 @@
+import i18next from 'i18next';
+
+export function formatLocalTimeShort(date) {
+  try {
+    return date.toLocaleDateString(i18next.language, {
+      year: 'numeric',
+      month: 'short',
+      day: 'numeric',
+    });
+  } catch (err) {
+    console.log('error formatting local time', err.message);
+  }
+}
+export function formatLocalTimeNumeric(date) {
+  try {
+    return date.toLocaleDateString(i18next.language, {
+      year: 'numeric',
+      month: 'numeric',
+      day: 'numeric',
+    });
+  } catch (err) {
+    console.log('error formatting local time', err.message);
+  }
+}
+export function formatLocalTimeNumericMonthDay(date) {
+  try {
+    return date.toLocaleDateString(i18next.language, {
+      month: 'numeric',
+      day: 'numeric',
+    });
+  } catch (err) {
+    console.log('error formatting local time', err.message);
+  }
+}
diff --git a/src/hooks/useDebounce.js b/src/hooks/useDebounce.js
new file mode 100644
index 0000000..be9da59
--- /dev/null
+++ b/src/hooks/useDebounce.js
@@ -0,0 +1,17 @@
+import {useCallback, useRef} from 'react';
+
+function useDebounce(func, wait) {
+  const debounceTimeout = useRef(null);
+
+  const debouncedFunction = useCallback(
+    (...args) => {
+      clearTimeout(debounceTimeout.current);
+      debounceTimeout.current = setTimeout(() => func(...args), wait);
+    },
+    [func, wait],
+  );
+
+  return debouncedFunction;
+}
+
+export default useDebounce;
diff --git a/src/main.jsx b/src/main.jsx
index 77e9748..1b77315 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -1,17 +1,9 @@
+import "../i18n.js";
 import "./fonts.css";
 import "./index.css";
-import "../i18n"; // for translation option
-import App from "./App.jsx";
+import "./App.css";
 import "../pollyfills.js";
-import {
-  StrictMode,
-  Suspense,
-  lazy,
-  useCallback,
-  useContext,
-  useMemo,
-  useState,
-} from "react";
+import { StrictMode, Suspense, lazy, useState } from "react";
 import { createRoot } from "react-dom/client";
 import {
   BrowserRouter,
@@ -21,13 +13,8 @@ import {
   useLocation,
   useNavigate,
 } from "react-router-dom";
-import { BottomNavigation, BottomNavigationAction } from "@mui/material";
 import SafeAreaComponent from "./components/safeAreaContainer.jsx";
-import { AuthProvider } from "./contexts/authContext.jsx";
-import AuthGate from "./components/authGate.jsx";
-import { SparkWalletProvider } from "./contexts/sparkContext.jsx";
 import { AnimatePresence } from "framer-motion";
-import { NavigationStackProvider } from "./contexts/navigationLogger.jsx";
 
 // Lazy-loaded pages
 const CreateSeed = lazy(() => import("./pages/createSeed/createSeed.jsx"));
@@ -37,8 +24,7 @@ const CreatePassword = lazy(() =>
 );
 const Home = lazy(() => import("./pages/home/home.jsx"));
 const Login = lazy(() => import("./pages/login/login.jsx"));
-import WalletHome from "./pages/wallet/wallet.jsx";
-// const WalletHome = lazy(() => import("./pages/wallet/wallet.jsx"));
+const WalletHome = lazy(() => import("./pages/wallet/wallet.jsx"));
 const EditReceivePaymentInformation = lazy(() =>
   import("./pages/receiveAmount/receiveAmount.jsx")
 );
@@ -59,14 +45,57 @@ const SendPage = lazy(() => import("./pages/sendPage/sendPage.jsx"));
 const SparkSettingsPage = lazy(() =>
   import("./pages/settings/pages/sparkSettingsPage/index.jsx")
 );
+const ExpandedAddContactsPage = lazy(() =>
+  import(
+    "./pages/contacts/components/expandedAddContactPage/expandedAddContactPage.jsx"
+  )
+);
+const ExpandedContactsPage = lazy(() =>
+  import(
+    "./pages/contacts/components/ExpandedContactsPage/ExpandedContactsPage.jsx"
+  )
+);
+const SendAndRequestPage = lazy(() =>
+  import(
+    "./pages/contacts/components/sendAndRequestPage/sendAndRequsetPage.jsx"
+  )
+);
+const ChooseContactListPage = lazy(() =>
+  import("./pages/contacts/components/contactsList/contactsList.jsx")
+);
+const EditMyProfilePage = lazy(() =>
+  import("./pages/contacts/screens/editMyProfilePage/editMyProfilePage.jsx")
+);
+const SettingsContentIndex = lazy(() =>
+  import("./pages/settings/settingsItem/settingsItem.jsx")
+);
+const SettingsHome = lazy(() => import("./pages/settings/settings.jsx"));
+const ViewMnemoinc = lazy(() => import("./pages/viewkey/viewKey.jsx"));
+const RestoreWallet = lazy(() =>
+  import("./pages/restoreWallet/restoreWallet.jsx")
+);
+const ViewAllTxsPage = lazy(() =>
+  import("./pages/viewAllTx/viewAllTxPage.jsx")
+);
+const Contacts = lazy(() => import("./pages/contacts/contacts.jsx"));
+const Store = lazy(() => import("./pages/store/store.jsx"));
+const ConfirmPayment = lazy(() =>
+  import("./pages/confirmPayment/confirmPaymentScreen.jsx")
+);
+const LoadingScreen = lazy(() => import("./pages/loadingScreen/index.jsx"));
 
-import ConfirmPayment from "./pages/confirmPayment/confirmPaymentScreen.jsx";
-import {
-  ThemeContext,
-  ThemeContextProvider,
-  useThemeContext,
-} from "./contexts/themeContext.jsx";
-import LoadingScreen from "./pages/loadingScreen/index.jsx";
+// Lazy load bottom tabs
+const BottomTabs = lazy(() => import("./tabs/tabs.jsx"));
+
+// Lazy load components that are used conditionally
+const AnimatedRouteWrapper = lazy(() =>
+  import("./components/animatedRouteWrapper.jsx")
+);
+const OverlayHost = lazy(() => import("./components/overlayHost.jsx"));
+const AuthGate = lazy(() => import("./components/authGate.jsx"));
+
+// Import contexts (these need to be imported normally as they wrap the app)
+import { ThemeContextProvider } from "./contexts/themeContext.jsx";
 import { BitcoinPriceProvider } from "./contexts/bitcoinPriceContext.jsx";
 import { KeysContextProvider } from "./contexts/keysContext.jsx";
 import { GlobalContextProvider } from "./contexts/masterInfoObject.jsx";
@@ -75,113 +104,31 @@ import { GlobalContactsList } from "./contexts/globalContacts.jsx";
 import { AppStatusProvider } from "./contexts/appStatus.jsx";
 import { GLobalNodeContextProider } from "./contexts/nodeContext.jsx";
 import { LiquidEventProvider } from "./contexts/liquidEventContext.jsx";
-import AnimatedRouteWrapper from "./components/animatedRouteWrapper.jsx";
-import ConfirmActionPage from "./components/confirmActionPage/confirmActionPage.jsx";
 import { GlobalRescanLiquidSwaps } from "./contexts/rescanLiquidSwaps.jsx";
-import Contacts from "./pages/contacts/contacts.jsx";
-import Store from "./pages/store/store.jsx";
-import TabsIcon from "./components/tabsIcon/tabsIcon.jsx";
-import SettingsContentIndex from "./pages/settings/settingsItem/settingsItem.jsx";
 import HandleLNURLPayments from "./contexts/lnurlContext.jsx";
 import { ImageCacheProvider } from "./contexts/imageCacheContext.jsx";
-import EditMyProfilePage from "./pages/contacts/screens/editMyProfilePage/editMyProfilePage.jsx";
-import MyProfilePage from "./pages/contacts/screens/myProfilePage/myProfilePage.jsx";
-import useThemeColors from "./hooks/useThemeColors.js";
-import BottomTabs from "./tabs/tabs.jsx";
 import { ActiveCustodyAccountProvider } from "./contexts/activeAccount.jsx";
+import { GlobalServerTimeProvider } from "./contexts/serverTime.jsx";
+import { OverlayProvider } from "./contexts/overlayContext.jsx";
+import { ToastContainer, ToastProvider } from "./contexts/toastManager.jsx";
+import { SparkNavigationListener } from "./contexts/SDKNavigation.jsx";
+import { SparkWalletProvider } from "./contexts/sparkContext.jsx";
+import { AuthProvider } from "./contexts/authContext.jsx";
+import { NavigationStackProvider } from "./contexts/navigationLogger.jsx";
 
-// const ConfirmPayment = lazy(() =>
-//   import("./pages/confirmPayment/confirmPaymentScreen.jsx")
-// );
-const SettingsHome = lazy(() => import("./pages/settings/settings.jsx"));
-const ViewMnemoinc = lazy(() => import("./pages/viewkey/viewKey.jsx"));
-const RestoreWallet = lazy(() =>
-  import("./pages/restoreWallet/restoreWallet.jsx")
-);
-
-import ErrorScreen from "./pages/error/error.jsx";
-import CustomHalfModal from "./pages/customHalfModal/index.jsx";
-import InformationPopup from "./pages/informationPopup/index.jsx";
+// Import loading screen component (not lazy loaded as it's needed immediately)
 import FullLoadingScreen from "./components/fullLoadingScreen/fullLoadingScreen.jsx";
-import { GlobalServerTimeProvider } from "./contexts/serverTime.jsx";
-const ViewAllTxsPage = lazy(() =>
-  import("./pages/viewAllTx/viewAllTxPage.jsx")
-);
 
 function Root() {
   const navigate = useNavigate();
   const location = useLocation();
   const [value, setValue] = useState(1);
-  const [overlays, setOverlays] = useState([]);
-
-  const openOverlay = useCallback(
-    (type) => {
-      if (type.for !== "halfModal") {
-        setOverlays([...overlays, type]);
-      } else {
-        setOverlays(overlays.slice(0, -1).concat([type]));
-      }
-    },
-    [overlays]
-  );
-
-  const closeOverlay = useCallback(() => {
-    setOverlays(overlays.slice(0, -1));
-  }, [overlays]);
 
   // Define paths where the bottom navigation should be visible
   const showBottomTabsRoutes = ["/wallet", "/contacts", "/store"];
-  const shouldShowBottomTabs =
-    showBottomTabsRoutes.includes(location.pathname) && !overlays.length;
+  const shouldShowBottomTabs = showBottomTabsRoutes.includes(location.pathname);
   const background = location.state && location.state.background;
 
-  console.log(
-    showBottomTabsRoutes,
-    shouldShowBottomTabs,
-    location.pathname,
-    overlays
-  );
-
-  const overlayElements = useMemo(() => {
-    return overlays.map((overlay, index) => (
-      <div
-        key={index}
-        initial={{ opacity: 0 }}
-        animate={{ opacity: 1 }}
-        exit={{ opacity: 0 }}
-        transition={{ duration: 0.3 }}
-      >
-        {overlay.for === "confirm-action" && (
-          <ConfirmActionPage onClose={closeOverlay} overlay={overlay} />
-        )}
-        {overlay.for === "error" && (
-          <ErrorScreen onClose={closeOverlay} overlay={overlay} />
-        )}
-        {overlay.for === "halfModal" && (
-          <CustomHalfModal
-            onClose={closeOverlay}
-            openOverlay={openOverlay}
-            contentType={overlay.contentType}
-            params={overlay.params}
-          />
-        )}
-        {overlay.for === "informationPopup" && (
-          <InformationPopup
-            onClose={closeOverlay}
-            openOverlay={openOverlay}
-            overlay={overlay}
-          />
-        )}
-      </div>
-    ));
-  }, [
-    overlays,
-    ConfirmActionPage,
-    ErrorScreen,
-    CustomHalfModal,
-    InformationPopup,
-  ]);
-
   return (
     <NavigationStackProvider>
       <AuthProvider navigate={navigate}>
@@ -192,344 +139,358 @@ function Root() {
                 <ActiveCustodyAccountProvider>
                   <AppStatusProvider>
                     <ThemeContextProvider>
-                      <GLobalNodeContextProider>
-                        <SparkWalletProvider navigate={navigate}>
+                      <SparkWalletProvider navigate={navigate}>
+                        <GLobalNodeContextProider>
                           <BitcoinPriceProvider>
                             <GlobalAppDataProvider>
                               <LiquidEventProvider>
                                 <ImageCacheProvider>
                                   <GlobalServerTimeProvider>
-                                    <HandleLNURLPayments />
-                                    <AuthGate />
-                                    <AnimatePresence mode="wait">
-                                      <Suspense
-                                        fallback={
-                                          <SafeAreaComponent>
-                                            <div
-                                              style={{
-                                                flex: 1,
-                                                display: "flex",
-                                                width: "100%",
-                                                height: "100%",
-                                                alignItems: "center",
-                                                justifyContent: "center",
-                                              }}
-                                            >
-                                              <FullLoadingScreen />
-                                            </div>
-                                          </SafeAreaComponent>
-                                        }
-                                      >
-                                        <Routes
-                                          location={background || location}
+                                    <OverlayProvider>
+                                      <ToastProvider>
+                                        <HandleLNURLPayments />
+                                        <Suspense
+                                          fallback={
+                                            <div style={{ display: "none" }} />
+                                          }
                                         >
-                                          {/* Public Routes */}
-                                          <Route
-                                            path="/"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <Home />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/disclaimer"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <DisclaimerPage
-                                                  openOverlay={openOverlay}
-                                                />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/createAccount"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <CreateSeed
-                                                  openOverlay={openOverlay}
-                                                />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/createPassword"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <CreatePassword />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/login"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <Login
-                                                  openOverlay={openOverlay}
-                                                />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/wallet"
-                                            element={
-                                              <>
-                                                <WalletHome
-                                                  openOverlay={openOverlay}
-                                                />
-                                              </>
-                                            }
-                                          />
-                                          <Route
-                                            path="/contacts"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <Contacts
-                                                  openOverlay={openOverlay}
-                                                />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/edit-profile"
-                                            element={
+                                          <AuthGate />
+                                        </Suspense>
+                                        <ToastContainer />
+                                        <SparkNavigationListener />
+                                        <AnimatePresence mode="wait">
+                                          <Suspense
+                                            fallback={
                                               <SafeAreaComponent>
-                                                <EditMyProfilePage
-                                                  openOverlay={openOverlay}
-                                                />
+                                                <div
+                                                  style={{
+                                                    flex: 1,
+                                                    display: "flex",
+                                                    width: "100%",
+                                                    height: "100%",
+                                                    alignItems: "center",
+                                                    justifyContent: "center",
+                                                  }}
+                                                >
+                                                  <FullLoadingScreen />
+                                                </div>
                                               </SafeAreaComponent>
                                             }
-                                          />
-                                          <Route
-                                            path="/my-profile"
-                                            element={
-                                              <AnimatedRouteWrapper
-                                                initialAnimation={{ x: "100%" }}
-                                                animate={{ x: 0 }}
-                                                exitAnimation={{ x: "100%" }}
-                                              >
-                                                <SafeAreaComponent>
-                                                  <MyProfilePage
-                                                    openOverlay={openOverlay}
-                                                  />
-                                                </SafeAreaComponent>
-                                              </AnimatedRouteWrapper>
-                                            }
-                                          />
-                                          <Route
-                                            path="/store"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <Store />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/receiveAmount"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <EditReceivePaymentInformation />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/receive"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <ReceiveQRPage
-                                                  openOverlay={openOverlay}
-                                                />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/send"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <SendPage
-                                                  openOverlay={openOverlay}
-                                                />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/receive-options"
-                                            element={
-                                              <AnimatedRouteWrapper
-                                                initialAnimation={{ y: "100%" }}
-                                                animate={{ y: 0 }}
-                                                exitAnimation={{ y: "100%" }}
-                                              >
-                                                <SafeAreaComponent>
-                                                  <SwitchReceiveOption />
-                                                </SafeAreaComponent>
-                                              </AnimatedRouteWrapper>
-                                            }
-                                          />
-                                          <Route
-                                            path="/expanded-tx"
-                                            element={
-                                              <AnimatedRouteWrapper
-                                                initialAnimation={{ y: "100%" }}
-                                                animate={{ y: 0 }}
-                                                exitAnimation={{ y: "100%" }}
-                                              >
-                                                <SafeAreaComponent>
-                                                  <ExpandedTxPage />
-                                                </SafeAreaComponent>
-                                              </AnimatedRouteWrapper>
-                                            }
-                                          />
-                                          <Route
-                                            path="/technical-details"
-                                            element={
-                                              <AnimatedRouteWrapper
-                                                initialAnimation={{ y: "100%" }}
-                                                animate={{ y: 0 }}
-                                                exitAnimation={{ y: "100%" }}
-                                              >
-                                                <SafeAreaComponent>
-                                                  <TechnicalDetailsPage
-                                                    openOverlay={openOverlay}
-                                                  />
-                                                </SafeAreaComponent>
-                                              </AnimatedRouteWrapper>
-                                            }
-                                          />
-                                          <Route
-                                            path="/camera"
-                                            element={
-                                              <Camera
-                                                openOverlay={openOverlay}
+                                          >
+                                            <Routes
+                                              location={background || location}
+                                            >
+                                              {/* Public Routes */}
+                                              <Route
+                                                path="/"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <Home />
+                                                  </SafeAreaComponent>
+                                                }
                                               />
-                                            }
-                                          />
-                                          <Route
-                                            path="/confirm-page"
-                                            element={
-                                              <AnimatedRouteWrapper
-                                                initialAnimation={{
-                                                  opacity: 0,
-                                                }}
-                                                animate={{ opacity: 1 }}
-                                                exitAnimation={{ opacity: 0 }}
-                                              >
-                                                <SafeAreaComponent>
-                                                  <ConfirmPayment />
-                                                </SafeAreaComponent>
-                                              </AnimatedRouteWrapper>
-                                            }
-                                          />
-                                          <Route
-                                            path="/settings"
-                                            element={
-                                              <AnimatedRouteWrapper
-                                                initialAnimation={{ x: "100%" }}
-                                                animate={{ x: 0 }}
-                                                exitAnimation={{ x: "100%" }}
-                                              >
-                                                <SafeAreaComponent>
-                                                  <SettingsHome
-                                                    openOverlay={openOverlay}
-                                                  />
-                                                </SafeAreaComponent>
-                                              </AnimatedRouteWrapper>
-                                            }
-                                          />
-                                          <Route
-                                            path="/settings-item"
-                                            element={
-                                              <AnimatedRouteWrapper
-                                                initialAnimation={{ x: "100%" }}
-                                                animate={{ x: 0 }}
-                                                exitAnimation={{ x: "100%" }}
-                                              >
-                                                <SettingsContentIndex
-                                                  openOverlay={openOverlay}
-                                                />
-                                              </AnimatedRouteWrapper>
-                                            }
-                                          />
-                                          <Route
-                                            path="/settings-item/SparkSettingsPage"
-                                            element={
-                                              <AnimatedRouteWrapper
-                                                initialAnimation={{ x: "100%" }}
-                                                animate={{ x: 0 }}
-                                                exitAnimation={{ x: "100%" }}
-                                              >
-                                                <SafeAreaComponent>
-                                                  <SparkSettingsPage
-                                                    openOverlay={openOverlay}
-                                                  />
-                                                </SafeAreaComponent>
-                                              </AnimatedRouteWrapper>
-                                            }
-                                          />
-                                          <Route
-                                            path="/key"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <ViewMnemoinc
-                                                  openOverlay={openOverlay}
-                                                />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/restore"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <RestoreWallet
-                                                  openOverlay={openOverlay}
-                                                />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/viewAllTransactions"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <ViewAllTxsPage />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                          <Route
-                                            path="/connecting"
-                                            element={
-                                              <SafeAreaComponent>
-                                                <LoadingScreen />
-                                              </SafeAreaComponent>
-                                            }
-                                          />
-                                        </Routes>
-
-                                        {/* Render Overlays */}
-                                        {overlayElements}
-
-                                        {/* {location.pathname ===
-                                        "/confirm-action" && (
-                                        <ConfirmActionPage />
-                                      )} */}
-                                        {/* {location.pathname === "/error" && (
-                                        <ErrorScreen />
-                                      )} */}
-                                      </Suspense>
-                                    </AnimatePresence>
-                                    {shouldShowBottomTabs && (
-                                      <BottomTabs
-                                        value={value}
-                                        setValue={setValue}
-                                        Link={Link}
-                                      />
-                                    )}
+                                              <Route
+                                                path="/disclaimer"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <DisclaimerPage />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/createAccount"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <CreateSeed />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/createPassword"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <CreatePassword />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/login"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <Login />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/wallet"
+                                                element={<WalletHome />}
+                                              />
+                                              <Route
+                                                path="/contacts"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <Contacts />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/expandedAddContactsPage"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <ExpandedAddContactsPage />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/expandedContactsPage"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <ExpandedContactsPage />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/chooseContactListPage"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <ChooseContactListPage />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/sendAndRequestPage"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <SendAndRequestPage />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/edit-profile"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <EditMyProfilePage />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/store"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <Store />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/receiveAmount"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <EditReceivePaymentInformation />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/receive"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <ReceiveQRPage />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/send"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <SendPage />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/receive-options"
+                                                element={
+                                                  <AnimatedRouteWrapper
+                                                    initialAnimation={{
+                                                      y: "100%",
+                                                    }}
+                                                    animate={{ y: 0 }}
+                                                    exitAnimation={{
+                                                      y: "100%",
+                                                    }}
+                                                  >
+                                                    <SafeAreaComponent>
+                                                      <SwitchReceiveOption />
+                                                    </SafeAreaComponent>
+                                                  </AnimatedRouteWrapper>
+                                                }
+                                              />
+                                              <Route
+                                                path="/expanded-tx"
+                                                element={
+                                                  <AnimatedRouteWrapper
+                                                    initialAnimation={{
+                                                      y: "100%",
+                                                    }}
+                                                    animate={{ y: 0 }}
+                                                    exitAnimation={{
+                                                      y: "100%",
+                                                    }}
+                                                  >
+                                                    <SafeAreaComponent>
+                                                      <ExpandedTxPage />
+                                                    </SafeAreaComponent>
+                                                  </AnimatedRouteWrapper>
+                                                }
+                                              />
+                                              <Route
+                                                path="/technical-details"
+                                                element={
+                                                  <AnimatedRouteWrapper
+                                                    initialAnimation={{
+                                                      y: "100%",
+                                                    }}
+                                                    animate={{ y: 0 }}
+                                                    exitAnimation={{
+                                                      y: "100%",
+                                                    }}
+                                                  >
+                                                    <SafeAreaComponent>
+                                                      <TechnicalDetailsPage />
+                                                    </SafeAreaComponent>
+                                                  </AnimatedRouteWrapper>
+                                                }
+                                              />
+                                              <Route
+                                                path="/camera"
+                                                element={<Camera />}
+                                              />
+                                              <Route
+                                                path="/confirm-page"
+                                                element={
+                                                  <AnimatedRouteWrapper
+                                                    initialAnimation={{
+                                                      opacity: 0,
+                                                    }}
+                                                    animate={{ opacity: 1 }}
+                                                    exitAnimation={{
+                                                      opacity: 0,
+                                                    }}
+                                                  >
+                                                    <SafeAreaComponent>
+                                                      <ConfirmPayment
+                                                        setValue={setValue}
+                                                      />
+                                                    </SafeAreaComponent>
+                                                  </AnimatedRouteWrapper>
+                                                }
+                                              />
+                                              <Route
+                                                path="/settings"
+                                                element={
+                                                  <AnimatedRouteWrapper
+                                                    initialAnimation={{
+                                                      x: "100%",
+                                                    }}
+                                                    animate={{ x: 0 }}
+                                                    exitAnimation={{
+                                                      x: "100%",
+                                                    }}
+                                                  >
+                                                    <SafeAreaComponent>
+                                                      <SettingsHome />
+                                                    </SafeAreaComponent>
+                                                  </AnimatedRouteWrapper>
+                                                }
+                                              />
+                                              <Route
+                                                path="/settings-item"
+                                                element={
+                                                  <AnimatedRouteWrapper
+                                                    initialAnimation={{
+                                                      x: "100%",
+                                                    }}
+                                                    animate={{ x: 0 }}
+                                                    exitAnimation={{
+                                                      x: "100%",
+                                                    }}
+                                                  >
+                                                    <SettingsContentIndex />
+                                                  </AnimatedRouteWrapper>
+                                                }
+                                              />
+                                              <Route
+                                                path="/settings-item/SparkSettingsPage"
+                                                element={
+                                                  <AnimatedRouteWrapper
+                                                    initialAnimation={{
+                                                      x: "100%",
+                                                    }}
+                                                    animate={{ x: 0 }}
+                                                    exitAnimation={{
+                                                      x: "100%",
+                                                    }}
+                                                  >
+                                                    <SafeAreaComponent>
+                                                      <SparkSettingsPage />
+                                                    </SafeAreaComponent>
+                                                  </AnimatedRouteWrapper>
+                                                }
+                                              />
+                                              <Route
+                                                path="/key"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <ViewMnemoinc />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/restore"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <RestoreWallet />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/viewAllTransactions"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <ViewAllTxsPage />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                              <Route
+                                                path="/connecting"
+                                                element={
+                                                  <SafeAreaComponent>
+                                                    <LoadingScreen />
+                                                  </SafeAreaComponent>
+                                                }
+                                              />
+                                            </Routes>
+                                            <Suspense fallback={null}>
+                                              <OverlayHost />
+                                            </Suspense>
+                                          </Suspense>
+                                        </AnimatePresence>
+                                        {shouldShowBottomTabs && (
+                                          <Suspense fallback={null}>
+                                            <BottomTabs
+                                              value={value}
+                                              setValue={setValue}
+                                              Link={Link}
+                                            />
+                                          </Suspense>
+                                        )}
+                                      </ToastProvider>
+                                    </OverlayProvider>
                                   </GlobalServerTimeProvider>
                                 </ImageCacheProvider>
                               </LiquidEventProvider>
                             </GlobalAppDataProvider>
                           </BitcoinPriceProvider>
-                        </SparkWalletProvider>
-                      </GLobalNodeContextProider>
+                        </GLobalNodeContextProider>
+                      </SparkWalletProvider>
                     </ThemeContextProvider>
                   </AppStatusProvider>
                 </ActiveCustodyAccountProvider>
diff --git a/src/pages/camera/camera.jsx b/src/pages/camera/camera.jsx
index 7155150..2194b78 100644
--- a/src/pages/camera/camera.jsx
+++ b/src/pages/camera/camera.jsx
@@ -10,16 +10,11 @@ import { useCameraPermission } from "../../hooks/useCameraPermission";
 import ThemeText from "../../components/themeText/themeText";
 import { useThemeContext } from "../../contexts/themeContext";
 import PageNavBar from "../../components/navBar/navBar";
-import {
-  FlashLightIcon,
-  flashlightNoFillWhite,
-  ImagesIcon,
-} from "../../constants/icons";
-import ThemeImage from "../../components/ThemeImage/themeImage";
+import { useOverlay } from "../../contexts/overlayContext";
+import { Flashlight, Image } from "lucide-react";
 
-// QrScanner. = "/qr-scanner-worker.min.js"; // Adjust if you move the file
-
-export default function Camera({ openOverlay }) {
+export default function Camera() {
+  const { openOverlay } = useOverlay();
   const { theme, darkModeType } = useThemeContext();
   const navigate = useNavigate();
   const location = useLocation();
@@ -171,17 +166,14 @@ export default function Camera({ openOverlay }) {
       </div>
       <div onClick={getDataFromFile} className="fileContainer">
         <input hidden type="file" id="file-selector" accept="image/*" />
-        <ThemeImage
-          className="optionImage"
-          icon={ImagesIcon}
-          alt="images icon"
-        />
+        <Image color={Colors.dark.text} size={35} />
       </div>
       <div onClick={toggleFlashLight} className="flashLightContainer">
-        <ThemeImage
-          className="optionImage"
-          icon={isFlashlightOn ? FlashLightIcon : flashlightNoFillWhite}
-          alt="flash light icon"
+        <Flashlight
+          fill={isFlashlightOn ? Colors.dark.text : "none"}
+          color={Colors.dark.text}
+          style={{ rotate: "45deg" }}
+          size={35}
         />
       </div>
       <CustomButton
diff --git a/src/pages/confirmPayment/confirmPaymentScreen.jsx b/src/pages/confirmPayment/confirmPaymentScreen.jsx
index ac17758..ecabf16 100644
--- a/src/pages/confirmPayment/confirmPaymentScreen.jsx
+++ b/src/pages/confirmPayment/confirmPaymentScreen.jsx
@@ -18,7 +18,7 @@ import { useTranslation } from "react-i18next";
 import { useSpark } from "../../contexts/sparkContext";
 import { formatTokensNumber } from "../../functions/lrc20/formatTokensBalance";
 
-export default function ConfirmPayment() {
+export default function ConfirmPayment({ setValue }) {
   const navigate = useNavigate();
   const { t } = useTranslation();
   const { sparkInformation } = useSpark();
@@ -34,7 +34,12 @@ export default function ConfirmPayment() {
   const formmatingType = location.state?.formattingType;
   const didSucceed = transaction?.paymentStatus !== "failed" || isLNURLAuth;
   const paymentFee = transaction?.details.fee;
-  const paymentNetwork = transaction?.paymentType;
+  const sendingContactUUID = transaction.details?.sendingUUID;
+  const paymentNetwork = sendingContactUUID
+    ? t("screens.inAccount.expandedTxPage.contactPaymentType")
+    : transaction.details.isGift
+    ? t("constants.gift")
+    : transaction.paymentType;
   const errorMessage = transaction?.details.error || "Unknown Error";
   const amount = transaction?.details.amount;
   const showPendingMessage = transaction?.paymentStatus === "pending";
@@ -70,6 +75,7 @@ export default function ConfirmPayment() {
   }, []);
 
   const handleBack = useCallback(() => {
+    setValue(1);
     navigate("/wallet", { replace: true });
   }, [navigate]);
   return (
diff --git a/src/pages/contacts/components/EditProfileTextInput/EditProfileTextInput.jsx b/src/pages/contacts/components/EditProfileTextInput/EditProfileTextInput.jsx
new file mode 100644
index 0000000..24b40f8
--- /dev/null
+++ b/src/pages/contacts/components/EditProfileTextInput/EditProfileTextInput.jsx
@@ -0,0 +1,115 @@
+import React, { useState, useRef } from "react";
+import { Info } from "lucide-react";
+import "./editProfileTextInput.css";
+import { useThemeContext } from "../../../../contexts/themeContext";
+import { Colors } from "../../../../constants/theme";
+import CustomInput from "../../../../components/customInput/customInput";
+import ThemeText from "../../../../components/themeText/themeText";
+
+/**
+ * Reusable text input component for edit profile forms
+ */
+export function EditProfileTextInput({
+  label,
+  placeholder,
+  value = "",
+  onChangeText,
+  onFocus,
+  onBlur,
+  inputRef,
+  maxLength = 30,
+  multiline = false,
+  minHeight,
+  maxHeight,
+  isDarkMode = false,
+  showInfoIcon = false,
+  onInfoPress,
+  containerStyle = {},
+}) {
+  const { theme, darkModeType } = useThemeContext();
+  const isOverLimit = value.length >= maxLength;
+
+  const handleChange = (e) => {
+    console.log(e);
+    onChangeText?.(e);
+  };
+
+  const handleContainerClick = () => {
+    inputRef?.current?.focus();
+  };
+
+  return (
+    <div
+      className={`text-input-container ${isDarkMode ? "dark" : ""}`}
+      style={containerStyle}
+      onClick={handleContainerClick}
+    >
+      {showInfoIcon ? (
+        <div className="label-row">
+          <ThemeText
+            textStyles={{ margin: 0 }}
+            className="input-label"
+            textContent={label}
+          />
+          <button
+            type="button"
+            className="info-button"
+            onClick={(e) => {
+              e.stopPropagation();
+              onInfoPress?.();
+            }}
+          >
+            <Info
+              color={
+                theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+              }
+              size={18}
+            />
+          </button>
+        </div>
+      ) : (
+        <ThemeText className="input-label" textContent={label} />
+      )}
+      <CustomInput
+        ref={inputRef}
+        containerClassName={`text-input ${isOverLimit ? "over-limit" : ""}`}
+        onchange={handleChange}
+        value={value}
+        placeholder={placeholder}
+        maxLength={maxLength}
+        multiline={multiline}
+      />
+      {/* {multiline ? (
+        <textarea
+          ref={inputRef}
+          className={`text-input ${isOverLimit ? "over-limit" : ""}`}
+          placeholder={placeholder}
+          value={value}
+          onChange={handleChange}
+          onFocus={onFocus}
+          onBlur={onBlur}
+          style={{
+            minHeight: minHeight || 60,
+            maxHeight: maxHeight || 100,
+          }}
+        />
+      ) : (
+        <input
+          ref={inputRef}
+          type="text"
+          className={`text-input ${isOverLimit ? "over-limit" : ""}`}
+          placeholder={placeholder}
+          value={value}
+          onChange={handleChange}
+          onFocus={onFocus}
+          onBlur={onBlur}
+          maxLength={maxLength}
+        />
+      )} */}
+      <ThemeText
+        className={`character-count ${isOverLimit ? "over-limit" : ""}`}
+        textContent={`${value.length} / ${maxLength}`}
+      />
+    </div>
+  );
+}
diff --git a/src/pages/contacts/components/EditProfileTextInput/editProfileTextInput.css b/src/pages/contacts/components/EditProfileTextInput/editProfileTextInput.css
new file mode 100644
index 0000000..c8a5d88
--- /dev/null
+++ b/src/pages/contacts/components/EditProfileTextInput/editProfileTextInput.css
@@ -0,0 +1,188 @@
+.text-input-container {
+  width: 100%;
+  margin-bottom: 20px;
+  cursor: text;
+}
+
+.text-input-container:last-child {
+  margin-bottom: 0;
+}
+
+.label-row {
+  display: flex;
+  align-items: center;
+  margin-bottom: 8px;
+}
+
+.input-label {
+  display: block;
+  cursor: text;
+  margin-bottom: 8px;
+}
+.label-row .input-label {
+  margin-bottom: 0;
+}
+.info-button {
+  background: none;
+  border: none;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+}
+
+.text-input {
+  width: 100%;
+  max-width: unset;
+  border: none;
+  resize: vertical;
+  margin-bottom: 8px;
+}
+
+.text-input.over-limit {
+  border-color: #ef4444;
+  color: #ef4444;
+}
+
+.text-input.over-limit:focus {
+  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
+}
+
+.character-count {
+  text-align: right;
+}
+
+.dark .character-count {
+  color: #a0aec0;
+}
+
+.character-count.over-limit {
+  color: #ef4444;
+  font-weight: 600;
+}
+
+.submit-button {
+  width: 100%;
+  padding: 16px;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  border: none;
+  border-radius: 12px;
+  color: white;
+  font-size: 18px;
+  font-weight: 700;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
+}
+
+.submit-button:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 6px 20px rgba(102, 126, 234, 0.5);
+}
+
+.submit-button:active {
+  transform: translateY(0);
+}
+
+.info-modal {
+  position: fixed;
+  top: 20px;
+  left: 50%;
+  transform: translateX(-50%);
+  background: #667eea;
+  color: white;
+  padding: 16px 24px;
+  border-radius: 12px;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  font-weight: 600;
+  z-index: 1000;
+  animation: slideIn 0.3s ease;
+  max-width: 90%;
+}
+
+@keyframes slideIn {
+  from {
+    transform: translate(-50%, -20px);
+    opacity: 0;
+  }
+  to {
+    transform: translate(-50%, 0);
+    opacity: 1;
+  }
+}
+
+.features-card {
+  background: white;
+  border-radius: 24px;
+  padding: 32px;
+  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+}
+
+.dark-mode .features-card {
+  background: rgba(45, 55, 72, 0.95);
+}
+
+.features-title {
+  font-size: 22px;
+  font-weight: 700;
+  color: #2d3748;
+  margin-bottom: 20px;
+  text-align: center;
+}
+
+.dark-mode .features-title {
+  color: #e2e8f0;
+}
+
+.features-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+  gap: 12px;
+}
+
+.feature {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 12px 16px;
+  background: #f7fafc;
+  border-radius: 10px;
+  color: #4a5568;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.dark-mode .feature {
+  background: #2d3748;
+  color: #cbd5e0;
+}
+
+.feature-icon {
+  color: #48bb78;
+  font-weight: 700;
+  font-size: 16px;
+}
+
+@media (max-width: 640px) {
+  .title {
+    font-size: 2rem;
+  }
+
+  .header {
+    flex-direction: column;
+    gap: 16px;
+    align-items: flex-start;
+  }
+
+  .profile-form,
+  .features-card {
+    padding: 24px;
+    border-radius: 16px;
+  }
+
+  .features-grid {
+    grid-template-columns: 1fr;
+  }
+}
diff --git a/src/pages/contacts/components/ExpandedContactsPage/expandedContactsPage.css b/src/pages/contacts/components/ExpandedContactsPage/expandedContactsPage.css
new file mode 100644
index 0000000..3388319
--- /dev/null
+++ b/src/pages/contacts/components/ExpandedContactsPage/expandedContactsPage.css
@@ -0,0 +1,148 @@
+/* Flex Container */
+.flex-container {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+}
+
+/* Top Bar Navigation */
+.top-bar {
+  width: 100%;
+  min-height: 40px;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-bottom: 15px;
+}
+
+.back-button-container {
+  margin-right: auto;
+  background: none;
+  border: none;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+}
+
+/* Profile Image */
+.profile-image-button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: none;
+  border: none;
+  padding: 0;
+  position: relative;
+
+  margin: 0 auto;
+}
+
+.profile-image-button.active {
+  cursor: pointer;
+}
+
+.profile-image-button.active:hover {
+  opacity: 0.9;
+}
+
+.profile-image-button.inactive {
+  cursor: default;
+}
+
+.profile-image {
+  width: 150px;
+  height: 150px;
+  border-radius: 125px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 10px;
+  overflow: hidden;
+}
+
+.select-from-photos {
+  width: 30px;
+  height: 30px;
+  border-radius: 20px;
+  background-color: var(--dark-mode-text, #ffffff);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: absolute;
+  right: 12.5px;
+  bottom: 12.5px;
+  z-index: 2;
+}
+
+/* Button Container */
+.button-global-container {
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+  justify-content: center;
+  margin-bottom: 10px;
+}
+
+/* Bio Container */
+.bio-container {
+  width: 90%;
+  min-height: 60px;
+  max-height: 80px;
+  border-radius: 8px;
+  padding: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 0 auto;
+}
+
+.bio-scroll {
+  display: flex;
+  align-items: center;
+  flex-grow: 1;
+  overflow-y: auto;
+  max-height: 100%;
+}
+
+.bio-scroll::-webkit-scrollbar {
+  display: none;
+}
+
+.bio-scroll {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+
+/* Contacts List Container */
+.contacts-list-container {
+  flex: 1;
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+}
+
+.contacts-list-container::-webkit-scrollbar {
+  width: 8px;
+}
+
+.contacts-list-container::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.contacts-list-container::-webkit-scrollbar-thumb {
+  background: rgba(136, 136, 136, 0.3);
+  border-radius: 4px;
+}
+
+.contacts-list-container::-webkit-scrollbar-thumb:hover {
+  background: rgba(136, 136, 136, 0.5);
+}
+
+/* Transactions List */
+.transactions-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
diff --git a/src/pages/contacts/components/ExpandedContactsPage/expandedContactsPage.jsx b/src/pages/contacts/components/ExpandedContactsPage/expandedContactsPage.jsx
new file mode 100644
index 0000000..c524a63
--- /dev/null
+++ b/src/pages/contacts/components/ExpandedContactsPage/expandedContactsPage.jsx
@@ -0,0 +1,419 @@
+import { useLocation, useNavigate } from "react-router-dom";
+import { useCallback, useEffect, useMemo } from "react";
+
+import { useTranslation } from "react-i18next";
+
+import ContactsTransactionItem from "../../internalComponents/contactTransactions/contactsTransactions";
+import ThemeText from "../../../../components/themeText/themeText";
+import { useAppStatus } from "../../../../contexts/appStatus";
+import { useThemeContext } from "../../../../contexts/themeContext";
+import useThemeColors from "../../../../hooks/useThemeColors";
+import { queueSetCashedMessages } from "../../../../functions/messaging/cachedMessages";
+import FullLoadingScreen from "../../../../components/fullLoadingScreen/fullLoadingScreen";
+import CustomSendAndRequsetBTN from "../../../../components/sendAndRequsetButton/customSendAndRequsetButton";
+import ContactProfileImage from "../profileImage/profileImage";
+import { useImageCache } from "../../../../contexts/imageCacheContext";
+import { useServerTimeOnly } from "../../../../contexts/serverTime";
+import { useExpandedNavbar } from "../../utils/useExpandedNavbar";
+import "./expandedContactsPage.css";
+import { useGlobalContacts } from "../../../../contexts/globalContacts";
+import { ArrowLeft, Settings, Share, Star } from "lucide-react";
+import {
+  Colors,
+  HIDDEN_OPACITY,
+  INSET_WINDOW_WIDTH,
+} from "../../../../constants/theme";
+import { useOverlay } from "../../../../contexts/overlayContext";
+
+export default function ExpandedContactsPage({
+  uuid,
+  hideProfileImage: globalHide,
+}) {
+  const { openOverlay } = useOverlay();
+  const navigate = useNavigate();
+  const location = useLocation();
+  const props = location.state;
+  const { isConnectedToTheInternet } = useAppStatus();
+  const { theme, darkModeType } = useThemeContext();
+  const {
+    backgroundOffset,
+    backgroundColor,
+    textInputColor,
+    textInputBackground,
+  } = useThemeColors();
+  const { decodedAddedContacts, globalContactsInformation, contactsMessags } =
+    useGlobalContacts();
+  const { cache } = useImageCache();
+  const getServerTime = useServerTimeOnly();
+  const currentTime = getServerTime();
+  const { t } = useTranslation();
+  const { handleFavortie, handleSettings } = useExpandedNavbar();
+  const selectedUUID = uuid || props?.uuid;
+  const myProfile = globalContactsInformation?.myProfile;
+  const hideProfileImage = globalHide || props?.hideProfileImage;
+  console.log(decodedAddedContacts, props, "hide profile image");
+  const [selectedContact] = useMemo(
+    () =>
+      decodedAddedContacts.filter((contact) => contact?.uuid === selectedUUID),
+    [decodedAddedContacts, selectedUUID]
+  );
+  console.log(selectedContact);
+  const imageData = cache[selectedContact.uuid];
+  const contactTransactions = contactsMessags[selectedUUID]?.messages || [];
+
+  useEffect(() => {
+    //listening for messages when you're on the contact
+    async function updateSeenTransactions() {
+      const newMessagesList = [];
+      let consecutiveSeenCount = 0;
+      const REQUIRED_CONSECUTIVE_SEEN = 100;
+
+      for (let i = 0; i < contactTransactions.length; i++) {
+        const msg = contactTransactions[i];
+
+        if (msg.message.wasSeen) {
+          consecutiveSeenCount++;
+          if (consecutiveSeenCount >= REQUIRED_CONSECUTIVE_SEEN) {
+            break;
+          }
+        } else {
+          consecutiveSeenCount = 0;
+          newMessagesList.push({
+            ...msg,
+            message: { ...msg.message, wasSeen: true },
+          });
+        }
+      }
+
+      if (!newMessagesList.length) return;
+
+      queueSetCashedMessages({
+        newMessagesList,
+        myPubKey: globalContactsInformation.myProfile.uuid,
+      });
+    }
+
+    updateSeenTransactions();
+  }, [contactTransactions]);
+
+  console.log(contactTransactions);
+  const handleShare = () => {
+    if (selectedContact?.isLNURL || !selectedContact?.uniqueName) return;
+
+    const shareText = `${t("share.contact")}\nhttps://blitzwalletapp.com/u/${
+      selectedContact?.uniqueName
+    }`;
+
+    if (navigator.share) {
+      navigator
+        .share({
+          text: shareText,
+        })
+        .catch((err) => console.log("Share failed:", err));
+    } else {
+      navigator.clipboard.writeText(shareText);
+      // Optionally show a toast notification
+    }
+  };
+
+  // Header component for the list
+  const ListHeaderComponent = useCallback(
+    () => (
+      <>
+        {!hideProfileImage && (
+          <button
+            className={`profile-image-button ${
+              !selectedContact?.isLNURL && selectedContact?.uniqueName
+                ? "active"
+                : "inactive"
+            }`}
+            onClick={handleShare}
+          >
+            <div
+              className="profile-image"
+              style={{
+                backgroundColor: backgroundOffset,
+              }}
+            >
+              <ContactProfileImage
+                updated={imageData?.updated}
+                uri={imageData?.localUri}
+                darkModeType={darkModeType}
+                theme={theme}
+              />
+            </div>
+            {!selectedContact?.isLNURL && selectedContact?.uniqueName && (
+              <div className="select-from-photos">
+                <Share
+                  size={20}
+                  color={
+                    theme && darkModeType
+                      ? Colors.light.text
+                      : Colors.constants.blue
+                  }
+                />
+              </div>
+            )}
+          </button>
+        )}
+
+        <ThemeText
+          textStyles={{
+            textAlign: "center",
+            opacity: 0.6,
+            marginTop: 10,
+            marginBottom: selectedContact?.uniqueName ? 5 : 25,
+          }}
+          textContent={selectedContact.name || t("constants.annonName")}
+        />
+
+        {selectedContact.uniqueName && (
+          <ThemeText
+            textStyles={{
+              textAlign: "center",
+              margin: 0,
+              marginBottom: 20,
+            }}
+            textContent={`@${selectedContact.uniqueName}`}
+          />
+        )}
+
+        <div
+          className="button-global-container"
+          style={{
+            marginBottom: selectedContact?.bio
+              ? 10
+              : contactTransactions.length
+              ? 30
+              : 0,
+          }}
+        >
+          <CustomSendAndRequsetBTN
+            btnType={"send"}
+            btnFunction={() => {
+              if (!isConnectedToTheInternet) {
+                openOverlay({
+                  for: "error",
+                  errorMessage: t("errormessages.nointernet"),
+                });
+                return;
+              }
+              navigate("/sendAndRequestPage", {
+                state: {
+                  selectedContact: selectedContact,
+                  paymentType: "send",
+                  imageData,
+                },
+              });
+            }}
+            arrowColor={
+              theme
+                ? darkModeType
+                  ? Colors.lightsout.background
+                  : Colors.dark.background
+                : Colors.constants.blue
+            }
+            containerBackgroundColor={Colors.dark.text}
+            containerStyles={{ marginRight: 30 }}
+          />
+
+          <CustomSendAndRequsetBTN
+            btnType={"receive"}
+            activeOpacity={selectedContact.isLNURL ? 1 : undefined}
+            btnFunction={() => {
+              if (selectedContact.isLNURL) {
+                openOverlay({
+                  for: "error",
+                  errorMessage: t(
+                    "contacts.expandedContactPage.requestLNURLError"
+                  ),
+                });
+                return;
+              }
+              if (!isConnectedToTheInternet) {
+                openOverlay({
+                  for: "error",
+                  errorMessage: t("errormessages.nointernet"),
+                });
+                return;
+              }
+              navigate("/sendAndRequestPage", {
+                state: {
+                  selectedContact: selectedContact,
+                  paymentType: "request",
+                  imageData,
+                },
+              });
+            }}
+            arrowColor={
+              theme
+                ? darkModeType
+                  ? Colors.lightsout.background
+                  : Colors.dark.background
+                : Colors.constants.blue
+            }
+            containerBackgroundColor={Colors.dark.text}
+            containerStyles={{
+              opacity: selectedContact.isLNURL ? HIDDEN_OPACITY : 1,
+            }}
+          />
+        </div>
+
+        {!!selectedContact?.bio?.trim() && (
+          <div
+            className="bio-container"
+            style={{
+              marginTop: 10,
+              marginBottom: contactTransactions.length ? 30 : 0,
+              backgroundColor: textInputBackground,
+            }}
+          >
+            <div className="bio-scroll">
+              <ThemeText
+                textStyles={{
+                  textAlign: "center",
+                  margin: "auto",
+                  color: textInputColor,
+                }}
+                textContent={selectedContact?.bio}
+              />
+            </div>
+          </div>
+        )}
+      </>
+    ),
+    [
+      theme,
+      darkModeType,
+      selectedContact?.name,
+      selectedContact?.uniqueName,
+      selectedContact?.bio,
+      selectedContact?.isLNURL,
+      imageData?.updated,
+      imageData?.localUri,
+      isConnectedToTheInternet,
+      hideProfileImage,
+      contactTransactions.length,
+    ]
+  );
+
+  if (hideProfileImage) {
+    return (
+      <div className="flex-container">
+        {!selectedContact ? (
+          <FullLoadingScreen
+            text={t("contacts.expandedContactPage.loadingContactError")}
+            textStyles={{ textAlign: "center" }}
+          />
+        ) : contactTransactions.length !== 0 ? (
+          <>
+            <ListHeaderComponent />
+            <div className="transactions-list">
+              {contactTransactions.slice(0, 50).map((item, index) => (
+                <ContactsTransactionItem
+                  key={index}
+                  transaction={item}
+                  id={index}
+                  selectedContact={selectedContact}
+                  myProfile={myProfile}
+                  currentTime={currentTime}
+                  imageData={imageData}
+                />
+              ))}
+            </div>
+          </>
+        ) : (
+          <div className="flex-container">
+            <ListHeaderComponent />
+            <ThemeText
+              textStyles={{
+                margin: "20px auto 0",
+                textAlign: "center",
+                width: INSET_WINDOW_WIDTH,
+              }}
+              textContent={t("contacts.expandedContactPage.noTransactions")}
+            />
+          </div>
+        )}
+      </div>
+    );
+  }
+
+  return (
+    <div className="expandedContactsPage">
+      <div className="top-bar">
+        <button className="back-button-container" onClick={() => navigate(-1)}>
+          <ArrowLeft
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+            }
+            size={30}
+          />
+        </button>
+        {selectedContact && (
+          <Star
+            onClick={() => handleFavortie({ selectedContact })}
+            style={{ marginRight: "10px", cursor: "pointer" }}
+            fill={
+              selectedContact?.isFavorite
+                ? theme && darkModeType
+                  ? Colors.dark.text
+                  : Colors.constants.blue
+                : "transparent"
+            }
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+            }
+            size={30}
+          />
+        )}
+        {selectedContact && (
+          <Settings
+            style={{ cursor: "pointer" }}
+            onClick={() => handleSettings({ selectedContact })}
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+            }
+            size={30}
+          />
+        )}
+      </div>
+
+      {!selectedContact ? (
+        <FullLoadingScreen
+          text={t("contacts.expandedContactPage.loadingContactError")}
+          textStyles={{ textAlign: "center" }}
+        />
+      ) : contactTransactions.length !== 0 ? (
+        <div className="contacts-list-container">
+          <ListHeaderComponent />
+          <div className="transactions-list">
+            {contactTransactions.slice(0, 50).map((item, index) => (
+              <ContactsTransactionItem
+                key={index}
+                transaction={item}
+                id={index}
+                selectedContact={selectedContact}
+                myProfile={myProfile}
+                currentTime={currentTime}
+                imageData={imageData}
+              />
+            ))}
+          </div>
+        </div>
+      ) : (
+        <div className="flex-container">
+          <ListHeaderComponent />
+          <ThemeText
+            textStyles={{
+              marginTop: 20,
+              textAlign: "center",
+              width: INSET_WINDOW_WIDTH,
+            }}
+            textContent={t("contacts.expandedContactPage.noTransactions")}
+          />
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/src/pages/contacts/components/addContactPage/addContactPage.jsx b/src/pages/contacts/components/addContactPage/addContactPage.jsx
new file mode 100644
index 0000000..c01e3e2
--- /dev/null
+++ b/src/pages/contacts/components/addContactPage/addContactPage.jsx
@@ -0,0 +1,55 @@
+import React from "react";
+import "./style.css";
+import useThemeColors from "../../../../hooks/useThemeColors";
+import { useGlobalContacts } from "../../../../contexts/globalContacts";
+import CustomButton from "../../../../components/customButton/customButton";
+import { useTranslation } from "react-i18next";
+import ThemeText from "../../../../components/themeText/themeText";
+
+export default function AddContactPage({ selectedContact }) {
+  const newContact = selectedContact;
+
+  const { textInputBackground, textInputColor } = useThemeColors();
+  const { addContact } = useGlobalContacts();
+  const { t } = useTranslation();
+
+  const name = newContact?.name?.trim() || t("constants.annonName");
+  const username = newContact?.uniqueName;
+  const lnurl = newContact?.isLNURL ? newContact?.receiveAddress : null;
+  const bio = newContact?.bio?.trim() || t("constants.noBioSet");
+
+  return (
+    <div className="container">
+      <ThemeText className="name-text" textContent={name} />
+
+      {!!username && (
+        <ThemeText className="username-text" textContent={`@${username}`} />
+      )}
+
+      {!!lnurl && (
+        <div className="info-container">
+          <ThemeText className="info-label" textContent={"LNURL Address"} />
+          <ThemeText className="info-value" textContent={lnurl} />
+        </div>
+      )}
+
+      <div
+        className="bio-container"
+        style={{ backgroundColor: textInputBackground }}
+      >
+        <ThemeText
+          textStyles={{ color: textInputColor, margin: 0 }}
+          textContent={bio}
+        />
+      </div>
+
+      <CustomButton
+        actionFunction={() => {
+          addContact(newContact);
+        }}
+        buttonStyles={{ marginTop: "auto" }}
+        textContent={t("contacts.editMyProfilePage.addContactBTN")}
+      />
+    </div>
+  );
+}
diff --git a/src/pages/contacts/components/addContactPage/style.css b/src/pages/contacts/components/addContactPage/style.css
new file mode 100644
index 0000000..2271408
--- /dev/null
+++ b/src/pages/contacts/components/addContactPage/style.css
@@ -0,0 +1,78 @@
+.container {
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.name-text {
+  text-align: center;
+  opacity: 0.6;
+  margin-top: 10px;
+  margin-bottom: 5px;
+}
+
+.username-text {
+  text-align: center;
+  margin-top: 0px;
+  margin-bottom: 20px;
+}
+
+.info-container {
+  width: 90%;
+  max-width: 500px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-bottom: 12px;
+}
+
+.info-label {
+  font-size: 16px;
+  opacity: 0.6;
+  margin-bottom: 4px;
+}
+
+.info-value {
+  margin-bottom: 10px;
+  word-break: break-all;
+  text-align: center;
+}
+
+.bio-container {
+  width: 90%;
+  max-width: 500px;
+  min-height: 60px;
+  max-height: 80px;
+  border-radius: 8px;
+  padding: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: auto;
+  margin-bottom: 20px;
+}
+
+.bio-text {
+  text-align: center;
+}
+
+.custom-button {
+  padding: 12px 24px;
+  background-color: #007aff;
+  color: white;
+  border: none;
+  border-radius: 8px;
+  font-size: 16px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: background-color 0.2s;
+}
+
+.custom-button:hover {
+  background-color: #0056b3;
+}
+
+.custom-button:active {
+  background-color: #004494;
+}
diff --git a/src/pages/contacts/components/addContactsHalfModal/addContactsHalfModal.jsx b/src/pages/contacts/components/addContactsHalfModal/addContactsHalfModal.jsx
new file mode 100644
index 0000000..732ebe0
--- /dev/null
+++ b/src/pages/contacts/components/addContactsHalfModal/addContactsHalfModal.jsx
@@ -0,0 +1,256 @@
+import { useState, useEffect, useRef, useCallback } from "react";
+import "./style.css";
+import customUUID from "../../../../functions/customUUID";
+import useDebounce from "../../../../hooks/useDebounce";
+import { EMAIL_REGEX, VALID_USERNAME_REGEX } from "../../../../constants";
+import { searchUsers } from "../../../../../db";
+import { getCachedProfileImage } from "../../../../functions/cachedImage";
+import ContactProfileImage from "../profileImage/profileImage";
+import { useThemeContext } from "../../../../contexts/themeContext";
+import useThemeColors from "../../../../hooks/useThemeColors";
+import ThemeText from "../../../../components/themeText/themeText";
+import { useNavigate } from "react-router-dom";
+import CustomButton from "../../../../components/customButton/customButton";
+import { useTranslation } from "react-i18next";
+import CustomInput from "../../../../components/customInput/customInput";
+import FullLoadingScreen from "../../../../components/fullLoadingScreen/fullLoadingScreen";
+
+// Main Component
+export default function AddContactsModal({ onClose, params }) {
+  const navigate = useNavigate();
+  const [searchInput, setSearchInput] = useState(
+    params.startingSearchValue || ""
+  );
+  const { t } = useTranslation();
+  const [users, setUsers] = useState([]);
+  const [isSearching, setIsSearching] = useState(false);
+  const [isKeyboardActive, setIsKeyboardActive] = useState(false);
+  const searchInputRef = useRef(null);
+  const searchTrackerRef = useRef(null);
+  const didClickCamera = useRef(null);
+  const { theme, darkModeType } = useThemeContext();
+
+  // Mock context values
+  const globalContactsInformation = {
+    myProfile: { uniqueName: "currentUser" },
+  };
+
+  const isUsingLNURL =
+    searchInput?.includes("@") && searchInput?.indexOf("@") !== 0;
+
+  useEffect(() => {
+    if (params.startingSearchValue) {
+      handleSearch(params.startingSearchValue);
+    }
+  }, []);
+
+  useEffect(() => {
+    searchInputRef.current?.focus();
+  }, []);
+
+  const handleSearchTrackerRef = () => {
+    const requestUUID = customUUID();
+    searchTrackerRef.current = requestUUID;
+    return requestUUID;
+  };
+
+  const debouncedSearch = useDebounce(async (term, requestUUID) => {
+    if (searchTrackerRef.current !== requestUUID) {
+      return;
+    }
+
+    const searchTerm = term.replace(/@/g, "");
+    if (searchTerm && VALID_USERNAME_REGEX.test(searchTerm)) {
+      const results = await searchUsers(searchTerm);
+      const newUsers = (
+        await Promise.all(
+          results.map(async (savedContact) => {
+            if (!savedContact) return false;
+            if (
+              savedContact.uniqueName ===
+              globalContactsInformation.myProfile.uniqueName
+            )
+              return false;
+            if (!savedContact?.uuid) return false;
+
+            let responseData;
+            if (
+              savedContact.hasProfileImage ||
+              typeof savedContact.hasProfileImage === "boolean"
+            ) {
+              responseData = await getCachedProfileImage(savedContact.uuid);
+              console.log(responseData);
+            }
+
+            if (!responseData) return savedContact;
+            else return { ...savedContact, ...responseData };
+          })
+        )
+      ).filter(Boolean);
+
+      setIsSearching(false);
+      setUsers(newUsers);
+    } else {
+      setIsSearching(false);
+    }
+  }, 650);
+
+  const handleSearch = (term) => {
+    setSearchInput(term);
+
+    if (isUsingLNURL) {
+      searchTrackerRef.current = null;
+      setIsSearching(false);
+      return;
+    }
+
+    if (term.length === 0 || term === "@") {
+      searchTrackerRef.current = null;
+      setUsers([]);
+      setIsSearching(false);
+      return;
+    }
+
+    if (term.length > 0) {
+      const requestUUID = handleSearchTrackerRef();
+      setIsSearching(true);
+      debouncedSearch(term, requestUUID);
+    }
+  };
+
+  const clearHalfModalForLNURL = () => {
+    if (!EMAIL_REGEX.test(searchInput)) return;
+
+    const newContact = {
+      name: searchInput.split("@")[0],
+      bio: "",
+      uniqueName: "",
+      isFavorite: false,
+      transactions: [],
+      unlookedTransactions: 0,
+      receiveAddress: searchInput,
+      isAdded: true,
+      isLNURL: true,
+      profileImage: "",
+      uuid: customUUID(),
+    };
+
+    console.log("Navigate to expanded page with LNURL:", newContact);
+
+    if (onClose) {
+      onClose();
+    }
+
+    navigate("/expandedAddContactsPage", {
+      state: newContact,
+    });
+  };
+
+  return (
+    <div className="modal-container">
+      <div className="title-container">
+        <ThemeText className="title-text" textContent={"Add Contact"} />
+        {isSearching && (
+          <FullLoadingScreen
+            containerStyles={{ flex: 0 }}
+            size="small"
+            showText={false}
+          />
+        )}
+      </div>
+
+      <CustomInput
+        ref={searchInputRef}
+        placeholder="Find a contact"
+        containerStyles={{ maxWidth: "unset" }}
+        onchange={handleSearch}
+        value={searchInput}
+      />
+
+      {isUsingLNURL ? (
+        <div className="lnurl-container">
+          <ThemeText
+            className="lnurl-text"
+            textContent={"Add Lightning Address:"}
+          />
+          <ThemeText className="lnurl-address" textContent={searchInput} />
+          <CustomButton
+            actionFunction={clearHalfModalForLNURL}
+            textContent={t("constants.continue")}
+          />
+        </div>
+      ) : (
+        <div className="users-list">
+          {users.length > 0 ? (
+            users.map((item) => (
+              <ContactListItem
+                theme={theme}
+                darkModeType={darkModeType}
+                key={item.uniqueName}
+                savedContact={item}
+                onClose={onClose}
+              />
+            ))
+          ) : (
+            <p className="empty-message">
+              {isSearching && searchInput.length > 0
+                ? ""
+                : searchInput.length > 0 && searchInput !== "@"
+                ? "No profiles found"
+                : "Search by LNURL (e.g. name@service.com) or Blitz username"}
+            </p>
+          )}
+        </div>
+      )}
+    </div>
+  );
+}
+
+function ContactListItem({ savedContact, theme, darkModeType, onClose }) {
+  const { backgroundOffset } = useThemeColors();
+  const navigate = useNavigate();
+  const newContact = {
+    ...savedContact,
+    isFavorite: false,
+    transactions: [],
+    unlookedTransactions: 0,
+    isAdded: true,
+  };
+
+  const handleClick = () => {
+    console.log("Navigate to expanded page with:", newContact);
+    if (onClose) {
+      onClose();
+    }
+
+    navigate("/expandedAddContactsPage", {
+      state: newContact,
+    });
+  };
+
+  return (
+    <button onClick={handleClick} className="contact-item">
+      <div
+        style={{ backgroundColor: backgroundOffset }}
+        className="contact-avatar"
+      >
+        <ContactProfileImage
+          updated={newContact.updated}
+          uri={newContact.localUri}
+          darkModeType={darkModeType}
+          theme={theme}
+        />
+      </div>
+      <div className="contact-info">
+        <ThemeText
+          className="contact-username"
+          textContent={newContact.uniqueName}
+        />
+        <ThemeText
+          className="contact-name"
+          textContent={newContact.name || "No name set"}
+        />
+      </div>
+    </button>
+  );
+}
diff --git a/src/pages/contacts/components/addContactsHalfModal/style.css b/src/pages/contacts/components/addContactsHalfModal/style.css
new file mode 100644
index 0000000..d15f933
--- /dev/null
+++ b/src/pages/contacts/components/addContactsHalfModal/style.css
@@ -0,0 +1,156 @@
+.modal-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 90%;
+  margin: 10px auto 0;
+}
+
+.title-container {
+  display: flex;
+  align-items: center;
+  margin-bottom: 10px;
+  width: 100%;
+  margin-top: 10px;
+}
+
+.title-text {
+  font-size: 20px;
+  font-weight: 400;
+  margin: 0;
+  margin-right: 10px;
+}
+
+.search-container {
+  position: relative;
+  width: 100%;
+}
+
+.search-input {
+  width: 100%;
+  padding: 12px 48px 12px 16px;
+  border: 1px solid #d1d5db;
+  border-radius: 8px;
+  font-size: 16px;
+  outline: none;
+  transition: border-color 0.2s;
+}
+
+.search-input:focus {
+  border-color: #3b82f6;
+  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
+}
+
+.camera-button {
+  position: absolute;
+  right: 12px;
+  top: 50%;
+  transform: translateY(-50%);
+  background: none;
+  border: none;
+  color: #3b82f6;
+  cursor: pointer;
+  padding: 4px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.camera-icon {
+  width: 24px;
+  height: 24px;
+}
+
+.lnurl-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 100%;
+}
+
+.lnurl-text {
+  text-align: center;
+  margin-bottom: 8px;
+  opacity: 0.6;
+}
+
+.lnurl-address {
+  text-align: center;
+  margin: 0;
+  margin-bottom: 24px;
+}
+
+.continue-button {
+  padding: 10px 24px;
+  background-color: #3b82f6;
+  color: white;
+  border: none;
+  border-radius: 8px;
+  font-size: 16px;
+  cursor: pointer;
+  transition: background-color 0.2s;
+}
+
+.users-list {
+  width: 100%;
+  max-height: 384px;
+  overflow-y: auto;
+}
+
+.empty-message {
+  text-align: center;
+  color: #6b7280;
+  margin-top: 16px;
+}
+
+.contact-item {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  padding: 8px 0;
+  background: none;
+  border: none;
+  cursor: pointer;
+  border-radius: 8px;
+  margin-bottom: 8px;
+}
+
+.contact-avatar {
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 12px;
+  flex-shrink: 0;
+  overflow: hidden;
+}
+
+.contact-avatar img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.contact-initial {
+  color: white;
+  font-weight: 600;
+  font-size: 18px;
+}
+
+.contact-info {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+.contact-username {
+  margin: 0;
+}
+
+.contact-name {
+  font-size: 14px;
+  opacity: 0.6;
+  margin: 0;
+}
diff --git a/src/pages/contacts/components/contactElement/contactElement.jsx b/src/pages/contacts/components/contactElement/contactElement.jsx
deleted file mode 100644
index f5a44ea..0000000
--- a/src/pages/contacts/components/contactElement/contactElement.jsx
+++ /dev/null
@@ -1,184 +0,0 @@
-import { useNavigate } from "react-router-dom";
-import { useAppStatus } from "../../../../contexts/appStatus";
-import { useGlobalContacts } from "../../../../contexts/globalContacts";
-import { useKeysContext } from "../../../../contexts/keysContext";
-import ThemeText from "../../../../components/themeText/themeText";
-import navigateToExpandedContact from "../../../../functions/contacts/navigateToExpandedContact";
-import {
-  createFormattedDate,
-  formatMessage,
-} from "../../../../functions/contacts/formats";
-
-export function ContactElement(props) {
-  const { contactsPrivateKey, publicKey } = useKeysContext();
-  const { isConnectedToTheInternet } = useAppStatus();
-  //   const { theme, darkModeType } = useGlobalThemeContext();
-  //   const { backgroundOffset } = GetThemeColors();
-  const {
-    decodedAddedContacts,
-    globalContactsInformation,
-    toggleGlobalContactsInformation,
-    contactsMessags,
-  } = useGlobalContacts();
-
-  const contact = props.contact;
-  const navigate = useNavigate();
-  const hasUnlookedTransaction =
-    contactsMessags[contact.uuid]?.messages.length &&
-    contactsMessags[contact.uuid]?.messages.filter(
-      (savedMessage) => !savedMessage.message.wasSeen
-    ).length > 0;
-
-  return (
-    <div
-      className="contactElementOuterContainer"
-      onLongPress={() => {
-        // if (!contact.isAdded) return;
-        // if (!isConnectedToTheInternet) {
-        //   navigate(".ErrorScreen", {
-        //     errorMessage:
-        //       "Please reconnect to the internet to use this feature",
-        //   });
-        //   return;
-        // }
-        // navigate("ContactsPageLongPressActions", {
-        //   contact: contact,
-        // });
-      }}
-      key={contact.uuid}
-      onPress={() =>
-        navigateToExpandedContact(
-          contact,
-          decodedAddedContacts,
-          globalContactsInformation,
-          toggleGlobalContactsInformation,
-          contactsPrivateKey,
-          publicKey,
-          navigate
-        )
-      }
-    >
-      <div className="contactElementInnerContainer">
-        <div className="contactRowContainer">
-          <div className="contactImageContainer">
-            {/* <ContactProfileImage
-              updated={props.cache[contact.uuid]?.updated}
-              uri={props.cache[contact.uuid]?.localUri}
-              darkModeType={darkModeType}
-              theme={theme}
-            /> */}
-          </div>
-          <div
-            className="contactTextContainer"
-            style={{
-              flex: 1,
-            }}
-          >
-            <div
-              className="topTextContainer"
-              style={{
-                flexDirection: "row",
-                alignItems: "center",
-              }}
-            >
-              <ThemeText
-                // CustomEllipsizeMode={"tail"}
-                // CustomNumberOfLines={1}
-                textStyles={{
-                  flex: 1,
-                  width: "100%",
-                  marginRight: 5,
-                }}
-                textContent={
-                  contact.name.length ? contact.name : contact.uniqueName
-                }
-              />
-              {hasUnlookedTransaction && (
-                <div
-                  className="hasActiveTxDot"
-                  style={[
-                    // styles.hasNotification,
-                    {
-                      marginRight: 5,
-                      //   backgroundColor:
-                      //     darkModeType && theme
-                      //       ? COLORS.darkModeText
-                      //       : COLORS.primary,
-                    },
-                  ]}
-                />
-              )}
-              <div
-                className="bottomTextContainer"
-                style={{
-                  flexDirection: "row",
-                  alignItems: "center",
-                }}
-              >
-                <ThemeText
-                  textStyles={{
-                    // fontSize: SIZES.small,
-                    marginRight: 5,
-                  }}
-                  textContent={
-                    contactsMessags[contact.uuid]?.messages?.length
-                      ? createFormattedDate(
-                          contactsMessags[contact.uuid].lastUpdated
-                        )
-                      : ""
-                  }
-                />
-                {/* <ThemeImage
-                  styles={{
-                    width: 20,
-                    height: 20,
-                    transform: [{ rotate: "180deg" }],
-                  }}
-                  darkModeIcon={ICONS.leftCheveronIcon}
-                  lightModeIcon={ICONS.leftCheveronIcon}
-                  lightsOutIcon={ICONS.left_cheveron_white}
-                /> */}
-              </div>
-            </div>
-            <div
-              className="contactBottomText"
-              style={{
-                flexDirection: "row",
-                alignItems: "center",
-              }}
-            >
-              <ThemeText
-                // CustomNumberOfLines={2}
-                textStyles={
-                  {
-                    //   fontSize: SIZES.small,
-                  }
-                }
-                textContent={
-                  contactsMessags[contact.uuid]?.messages?.length
-                    ? formatMessage(
-                        contactsMessags[contact.uuid]?.messages[0]
-                      ) || " "
-                    : " "
-                }
-              />
-              {!contact.isAdded && (
-                <ThemeText
-                  textStyles={{
-                    // fontSize: SIZES.small,
-                    // color:
-                    //   darkModeType && theme
-                    //     ? COLORS.darkModeText
-                    //     : COLORS.primary,
-                    marginLeft: "auto",
-                  }}
-                  textContent={"Unknown sender"}
-                />
-              )}
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}
diff --git a/src/pages/contacts/components/contactsList/contactsList.css b/src/pages/contacts/components/contactsList/contactsList.css
new file mode 100644
index 0000000..9a10d9b
--- /dev/null
+++ b/src/pages/contacts/components/contactsList/contactsList.css
@@ -0,0 +1,71 @@
+.contact-picker-container {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.scroll-container {
+  flex: 1;
+  overflow-y: auto;
+  padding-top: 10px;
+}
+
+.contacts-list {
+  width: 95%;
+  margin: 20px auto 0;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.contact-row {
+  display: flex;
+  align-items: center;
+  padding: 6px 0;
+  border-radius: 12px;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.contact-image-container {
+  width: 45px;
+  height: 45px;
+  border-radius: 50%;
+  overflow: hidden;
+  margin-right: 12px;
+  background-color: #f3f4f6;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+.profile-image-wrapper {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.profile-image {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.profile-image-placeholder {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #9ca3af;
+}
+
+.name-container {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
diff --git a/src/pages/contacts/components/contactsList/contactsList.jsx b/src/pages/contacts/components/contactsList/contactsList.jsx
new file mode 100644
index 0000000..546be04
--- /dev/null
+++ b/src/pages/contacts/components/contactsList/contactsList.jsx
@@ -0,0 +1,104 @@
+import { useState, useMemo, useCallback } from "react";
+import "./contactsList.css";
+import { useGlobalContacts } from "../../../../contexts/globalContacts";
+import { useImageCache } from "../../../../contexts/imageCacheContext";
+import ContactProfileImage from "../profileImage/profileImage";
+import { ArrowLeft } from "lucide-react";
+import CustomSettingsNavBar from "../../../../components/customSettingsNavbar";
+import { useTranslation } from "react-i18next";
+import { useThemeContext } from "../../../../contexts/themeContext";
+import { useAppStatus } from "../../../../contexts/appStatus";
+import CustomInput from "../../../../components/customInput/customInput";
+import ThemeText from "../../../../components/themeText/themeText";
+import { useNavigate } from "react-router-dom";
+
+const formatDisplayName = (contact) => {
+  return contact.name || contact.uniqueName || "";
+};
+
+export default function ChooseContactListPage() {
+  const navigate = useNavigate();
+  const [inputText, setInputText] = useState("");
+  const { t } = useTranslation();
+  const { theme, darkModeType } = useThemeContext();
+  const { isConnectedToTheInternet } = useAppStatus();
+  const { decodedAddedContacts } = useGlobalContacts();
+  const { cache } = useImageCache();
+
+  const navigateToExpandedContact = useCallback((contact, imageData) => {
+    console.log("Navigate to contact:", contact, imageData);
+    navigate("/sendAndRequestPage", {
+      replace: true,
+      state: {
+        selectedContact: contact,
+        paymentType: "send",
+        imageData,
+      },
+    });
+  }, []);
+
+  const sortedContacts = useMemo(() => {
+    return [...decodedAddedContacts].sort((contactA, contactB) => {
+      const nameA = contactA?.name || contactA?.uniqueName || "";
+      const nameB = contactB?.name || contactB?.uniqueName || "";
+      return nameA.localeCompare(nameB);
+    });
+  }, [decodedAddedContacts]);
+
+  const filteredContacts = useMemo(() => {
+    return sortedContacts.filter((contact) => {
+      return (
+        contact.name.toLowerCase().startsWith(inputText.toLowerCase()) ||
+        (!contact.isLNURL &&
+          contact.uniqueName
+            ?.toLowerCase()
+            ?.startsWith(inputText.toLowerCase()))
+      );
+    });
+  }, [sortedContacts, inputText]);
+
+  return (
+    <div className="contact-picker-container">
+      <CustomSettingsNavBar text={t("wallet.contactsPage.header")} />
+
+      <div className="contacts-list">
+        <CustomInput
+          containerStyles={{ maxWidth: "unset" }}
+          onchange={setInputText}
+          placeholder={t("wallet.contactsPage.inputTextPlaceholder")}
+        />
+        <ThemeText
+          textStyles={{ margin: 0 }}
+          textContent={t("wallet.contactsPage.subHeader")}
+        />
+        {filteredContacts.map((contact) => (
+          <div
+            key={contact.uuid}
+            className="contact-row"
+            onClick={() =>
+              navigateToExpandedContact(contact, cache[contact.uuid])
+            }
+          >
+            <div className="contact-image-container">
+              <ContactProfileImage
+                updated={cache[contact.uuid]?.updated}
+                uri={cache[contact.uuid]?.localUri}
+                darkModeType={darkModeType}
+                theme={theme}
+              />
+            </div>
+
+            <div className="name-container">
+              <ThemeText
+                textStyles={{ margin: 0 }}
+                textContent={
+                  formatDisplayName(contact) || contact.uniqueName || ""
+                }
+              />
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/src/pages/contacts/components/expandedAddContactPage/expandedAddContactPage.jsx b/src/pages/contacts/components/expandedAddContactPage/expandedAddContactPage.jsx
new file mode 100644
index 0000000..6da95dd
--- /dev/null
+++ b/src/pages/contacts/components/expandedAddContactPage/expandedAddContactPage.jsx
@@ -0,0 +1,179 @@
+import React, { memo, useEffect, useMemo, useState } from "react";
+import "./style.css";
+import { ArrowLeft, Settings, Star } from "lucide-react";
+import { Colors } from "../../../../constants/theme";
+import { useThemeContext } from "../../../../contexts/themeContext";
+import useThemeColors from "../../../../hooks/useThemeColors";
+import { useImageCache } from "../../../../contexts/imageCacheContext";
+import { useGlobalContacts } from "../../../../contexts/globalContacts";
+import { useExpandedNavbar } from "../../utils/useExpandedNavbar";
+import ContactProfileImage from "../profileImage/profileImage";
+import { useLocation, useNavigate } from "react-router-dom";
+import AddContactPage from "../addContactPage/addContactPage";
+import ExpandedContactsPage from "../ExpandedContactsPage/ExpandedContactsPage";
+
+// Memoized shared header component
+const SharedHeader = memo(
+  ({
+    selectedContact,
+    imageData,
+    theme,
+    darkModeType,
+    backgroundOffset,
+    isContactAdded,
+    isEditingMyProfile,
+    navigate,
+  }) => {
+    return (
+      <div className="profile-image-container">
+        <div
+          className="profile-image"
+          style={{ backgroundColor: backgroundOffset }}
+        >
+          <ContactProfileImage
+            updated={imageData?.updated}
+            uri={imageData?.localUri}
+            darkModeType={darkModeType}
+            theme={theme}
+          />
+        </div>
+      </div>
+    );
+  }
+);
+
+// Memoized navbar
+const MemoizedNavBar = memo(
+  ({
+    onBack,
+    theme,
+    darkModeType,
+    selectedContact,
+    backgroundColor,
+    isContactAdded,
+    handleFavortie,
+    handleSettings,
+  }) => {
+    return (
+      <div className="top-bar">
+        <button className="back-button-container" onClick={onBack}>
+          <ArrowLeft
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+            }
+            size={30}
+          />
+        </button>
+        {selectedContact && isContactAdded && (
+          <Star
+            onClick={() => handleFavortie({ selectedContact })}
+            style={{ marginRight: "10px" }}
+            fill={
+              selectedContact?.isFavorite
+                ? theme && darkModeType
+                  ? Colors.dark.text
+                  : Colors.constants.blue
+                : "transparent"
+            }
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+            }
+            size={30}
+          />
+        )}
+        {selectedContact && isContactAdded && (
+          <Settings
+            onClick={() => handleSettings({ selectedContact })}
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+            }
+            size={30}
+          />
+        )}
+      </div>
+    );
+  }
+);
+
+export default function ExpandedAddContactsPage({ route }) {
+  const { decodedAddedContacts, globalContactsInformation, contactsMessags } =
+    useGlobalContacts();
+  const { theme, darkModeType } = useThemeContext();
+  const { backgroundOffset, backgroundColor } = useThemeColors();
+  const { cache, refreshCacheObject } = useImageCache();
+  const { handleFavortie, handleSettings } = useExpandedNavbar();
+
+  const navigate = useNavigate();
+  const location = useLocation();
+  const props = location.state;
+  console.log(props, location);
+  const newContact = props;
+
+  useEffect(() => {
+    refreshCacheObject();
+  }, []);
+
+  // Memoize contact lookup
+  const selectedContact = useMemo(() => {
+    return decodedAddedContacts.find(
+      (contact) =>
+        (contact.uuid === newContact?.uuid && contact.isAdded) ||
+        (contact.isLNURL &&
+          contact.receiveAddress.toLowerCase() ===
+            newContact.receiveAddress?.toLowerCase())
+    );
+  }, [decodedAddedContacts, newContact]);
+
+  const isSelf = useMemo(() => {
+    return (
+      newContact.uniqueName?.toLowerCase() ===
+      globalContactsInformation?.myProfile?.uniqueName?.toLowerCase()
+    );
+  }, [newContact.uniqueName, globalContactsInformation?.myProfile?.uniqueName]);
+
+  const isContactAdded = !!selectedContact;
+  const imageData = cache[newContact?.uuid];
+  const contactTransactions = contactsMessags[newContact?.uuid]?.messages || [];
+
+  // Memoize back handler
+  const handleBack = useMemo(() => {
+    return () => navigate(-1);
+  }, [navigate]);
+
+  return (
+    <div className="global-theme-view">
+      <MemoizedNavBar
+        theme={theme}
+        darkModeType={darkModeType}
+        onBack={handleBack}
+        selectedContact={selectedContact}
+        backgroundColor={backgroundColor}
+        isContactAdded={isContactAdded}
+        handleFavortie={handleFavortie}
+        handleSettings={handleSettings}
+      />
+
+      <div className="scroll-view" style={{}}>
+        <SharedHeader
+          selectedContact={newContact}
+          imageData={imageData}
+          theme={theme}
+          darkModeType={darkModeType}
+          backgroundOffset={backgroundOffset}
+          isContactAdded={isContactAdded}
+          isEditingMyProfile={isSelf}
+          navigate={navigate}
+        />
+
+        {isContactAdded ? (
+          <ExpandedContactsPage
+            uuid={selectedContact.uuid}
+            hideProfileImage={true}
+          />
+        ) : (
+          <AddContactPage selectedContact={newContact} />
+        )}
+      </div>
+    </div>
+  );
+}
diff --git a/src/pages/contacts/components/expandedAddContactPage/style.css b/src/pages/contacts/components/expandedAddContactPage/style.css
new file mode 100644
index 0000000..b4638ff
--- /dev/null
+++ b/src/pages/contacts/components/expandedAddContactPage/style.css
@@ -0,0 +1,102 @@
+.global-theme-view {
+  width: 100%;
+  margin: 0 auto;
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+}
+
+.top-bar {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-bottom: 15px;
+}
+
+.back-button-container {
+  margin-right: auto;
+  cursor: pointer;
+  background-color: unset;
+}
+
+.star-container {
+  margin-right: 5px;
+  background: none;
+  border: none;
+  color: #ffd700;
+  font-size: 24px;
+  cursor: pointer;
+  padding: 4px 8px;
+  transition: transform 0.2s;
+}
+
+.star-container:hover {
+  transform: scale(1.2);
+}
+
+.settings-button {
+  background: none;
+  border: none;
+  font-size: 24px;
+  cursor: pointer;
+  padding: 4px 8px;
+  transition: transform 0.2s;
+}
+
+.settings-button:hover {
+  transform: rotate(45deg);
+}
+
+.profile-image-container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+}
+
+.profile-image {
+  width: 150px;
+  height: 150px;
+  border-radius: 75px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  margin-bottom: 10px;
+}
+
+.profile-image-placeholder {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #333;
+}
+
+.scroll-view {
+  flex-grow: 1;
+  overflow-y: auto;
+  max-height: calc(100vh - 100px);
+  display: flex;
+  flex-direction: column;
+}
+
+.scroll-view::-webkit-scrollbar {
+  width: 8px;
+}
+
+.scroll-view::-webkit-scrollbar-track {
+  background: #2a2a2a;
+  border-radius: 4px;
+}
+
+.scroll-view::-webkit-scrollbar-thumb {
+  background: #555;
+  border-radius: 4px;
+}
+
+.scroll-view::-webkit-scrollbar-thumb:hover {
+  background: #777;
+}
diff --git a/src/pages/contacts/components/pinnedContact/pinnedContact.jsx b/src/pages/contacts/components/pinnedContact/pinnedContact.jsx
deleted file mode 100644
index 0cf2770..0000000
--- a/src/pages/contacts/components/pinnedContact/pinnedContact.jsx
+++ /dev/null
@@ -1,75 +0,0 @@
-import { useNavigate } from "react-router-dom";
-import { useGlobalContacts } from "../../../../contexts/globalContacts";
-import { useKeysContext } from "../../../../contexts/keysContext";
-import ThemeText from "../../../../components/themeText/themeText";
-import navigateToExpandedContact from "../../../../functions/contacts/navigateToExpandedContact";
-
-export default function PinnedContactElement(props) {
-  const { contactsPrivateKey, publicKey } = useKeysContext();
-  const {
-    decodedAddedContacts,
-    globalContactsInformation,
-    toggleGlobalContactsInformation,
-    contactsMessags,
-  } = useGlobalContacts();
-  //   const { backgroundOffset } = GetThemeColors();
-  const contact = props.contact;
-  const navigate = useNavigate();
-  const hasUnlookedTransaction =
-    contactsMessags[contact.uuid]?.messages.length &&
-    contactsMessags[contact.uuid]?.messages.filter(
-      (savedMessage) => !savedMessage.message.wasSeen
-    ).length > 0;
-  return (
-    <div
-      className="pinnedContactOuterContainer"
-      //   onLongPress={() => {
-      //     if (!contact.isAdded) return;
-      //     navigate("/ContactsPageLongPressActions", {
-      //       contact: contact,
-      //     });
-      //   }}
-      key={contact.uuid}
-      onPress={() =>
-        navigateToExpandedContact(
-          contact,
-          decodedAddedContacts,
-          globalContactsInformation,
-          toggleGlobalContactsInformation,
-          contactsPrivateKey,
-          publicKey,
-          navigate
-        )
-      }
-    >
-      <div className="pinnedContactInnerContainer">
-        <div className="imageContainer">
-          {/* <ContactProfileImage
-            updated={props.cache[contact.uuid]?.updated}
-            uri={props.cache[contact.uuid]?.localUri}
-            darkModeType={darkModeType}
-            theme={theme}
-          /> */}
-        </div>
-
-        <div
-          className="textContainer"
-          style={{
-            width: "100%",
-            alignItems: "center",
-            flexDirection: "row",
-          }}
-        >
-          {hasUnlookedTransaction && <div className="activeMessageDot" />}
-          <ThemeText
-            textContent={
-              contact.name.length
-                ? contact.name.trim()
-                : contact.uniqueName.trim()
-            }
-          />
-        </div>
-      </div>
-    </div>
-  );
-}
diff --git a/src/pages/contacts/components/profileImage/profileImage.jsx b/src/pages/contacts/components/profileImage/profileImage.jsx
index 34e4fec..18ae156 100644
--- a/src/pages/contacts/components/profileImage/profileImage.jsx
+++ b/src/pages/contacts/components/profileImage/profileImage.jsx
@@ -1,6 +1,5 @@
 import React, { useState } from "react";
-import customUUID from "../../../../functions/customUUID";
-import { userIcon, userWhite } from "../../../../constants/icons";
+import { userIcon } from "../../../../constants/icons";
 
 export default function ContactProfileImage({
   resizeMode = "cover",
@@ -12,10 +11,8 @@ export default function ContactProfileImage({
   const [loadError, setLoadError] = useState(false);
   const [isLoading, setIsLoading] = useState(true);
 
-  const fallbackIcon = darkModeType && theme ? userWhite : userIcon;
-  const customURI = uri
-    ? `${uri}?v=${updated ? new Date(updated).getTime() : customUUID()}`
-    : null;
+  const fallbackIcon = userIcon;
+  const customURI = uri;
 
   const source = !loadError && uri && !isLoading ? customURI : fallbackIcon;
   const isProfile = !loadError && uri && !isLoading;
diff --git a/src/pages/contacts/components/sendAndRequestPage/sendAndRequestPage.css b/src/pages/contacts/components/sendAndRequestPage/sendAndRequestPage.css
new file mode 100644
index 0000000..4b44c7a
--- /dev/null
+++ b/src/pages/contacts/components/sendAndRequestPage/sendAndRequestPage.css
@@ -0,0 +1,147 @@
+/* Send and Request Page */
+.send-request-page {
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+}
+
+.replacement-container {
+  flex-grow: 1;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+
+.scroll-view-container {
+  width: 100%;
+  padding-bottom: 20px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  flex-grow: 1;
+  overflow-y: auto;
+}
+
+.scroll-view-container::-webkit-scrollbar {
+  display: none;
+}
+
+.scroll-view-container {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+
+/* Input and Gift Container */
+.input-and-gift-container {
+  width: 90%;
+  max-width: 350px;
+  align-self: center;
+}
+
+/* Gift Amount Container */
+.gift-amount-container {
+  width: 90%;
+  max-width: 600px;
+  margin-top: 20px;
+}
+
+/* Gift Container Button */
+.gift-container {
+  padding: 10px 16px;
+  border-radius: 20px;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  background: none;
+  border: none;
+  cursor: pointer;
+  margin: 20px 0 0 auto;
+}
+
+/* Pill Button for Gift Card */
+.pill {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  padding: 16px 20px;
+  border-radius: 24px;
+  gap: 16px;
+  border-width: 2px;
+  border-style: solid;
+  align-self: center;
+  position: relative;
+  background: none;
+  cursor: pointer;
+  transition: opacity 0.2s ease;
+}
+
+.pill:hover {
+  opacity: 0.9;
+}
+
+.logo-container {
+  width: 48px;
+  aspect-ratio: 1;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: var(--dark-mode-text, #ffffff);
+  border-radius: 12px;
+  padding: 6px;
+}
+
+.card-logo {
+  width: 100%;
+  height: 100%;
+  max-width: 80px;
+  max-height: 80px;
+  border-radius: 8px;
+  object-fit: contain;
+}
+
+.edit-button {
+  width: 32px;
+  height: 32px;
+  border-radius: 16px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: absolute;
+  right: -8px;
+  top: -8px;
+  border-width: 3px;
+  border-style: solid;
+}
+
+/* Memo Section */
+.memo-section {
+  margin-top: 28px;
+}
+
+.memo-container {
+  padding: 18px;
+  border-radius: 16px;
+  border-width: 1px;
+  border-style: solid;
+  min-height: 60px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+/* Max and Accept Container */
+.max-and-accept-container {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-top: 10px;
+}
+.send-request-page .sendRequetContainer {
+  max-width: 350px;
+}
diff --git a/src/pages/contacts/components/sendAndRequestPage/sendAndRequsetPage.jsx b/src/pages/contacts/components/sendAndRequestPage/sendAndRequsetPage.jsx
new file mode 100644
index 0000000..ec5a113
--- /dev/null
+++ b/src/pages/contacts/components/sendAndRequestPage/sendAndRequsetPage.jsx
@@ -0,0 +1,781 @@
+import { useNavigate, useLocation } from "react-router-dom";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { publishMessage } from "../../../../functions/messaging/publishMessage";
+
+import { useTranslation } from "react-i18next";
+import { Colors, HIDDEN_OPACITY } from "../../../../constants/theme";
+import {
+  CONTENT_KEYBOARD_OFFSET,
+  QUICK_PAY_STORAGE_KEY,
+  SATSPERBITCOIN,
+} from "../../../../constants";
+import { useGlobalContextProvider } from "../../../../contexts/masterInfoObject";
+import CustomNumberKeyboard from "../../../../components/customNumberKeyboard/customNumberKeyboard";
+import CustomButton from "../../../../components/customButton/customButton";
+import FormattedSatText from "../../../../components/formattedSatText/formattedSatText";
+import { useGlobalContacts } from "../../../../contexts/globalContacts";
+import customUUID from "../../../../functions/customUUID";
+import { useNodeContext } from "../../../../contexts/nodeContext";
+import { useAppStatus } from "../../../../contexts/appStatus";
+import { useKeysContext } from "../../../../contexts/keysContext";
+import convertTextInputValue from "../../../../functions/textInputConvertValue";
+import { useServerTimeOnly } from "../../../../contexts/serverTime";
+import useThemeColors from "../../../../hooks/useThemeColors";
+import { useThemeContext } from "../../../../contexts/themeContext";
+import { Edit, Gift } from "lucide-react";
+import fetchBackend from "../../../../../db/handleBackend";
+import { getDataFromCollection } from "../../../../../db";
+import loadNewFiatData from "../../../../functions/saveAndUpdateFiatData";
+import giftCardPurchaseAmountTracker from "../../../../functions/apps/giftCardPurchaseTracker";
+import { useSpark } from "../../../../contexts/sparkContext";
+import getReceiveAddressAndContactForContactsPayment from "../../utils/getReceiveAddressAndKindForPayment";
+import { useActiveCustodyAccount } from "../../../../contexts/activeAccount";
+import NavBarWithBalance from "../../../../components/navBarWithBalance/navbarWithBalance";
+import { sparkPaymenWrapper } from "../../../../functions/spark/payments";
+import { getBolt11InvoiceForContact } from "../../../../functions/contacts";
+import EmojiQuickBar from "../../../../components/emojiBar/emojiQuickBar";
+
+import "./sendAndRequestPage.css";
+import CustomInput from "../../../../components/customInput/customInput";
+import ThemeText from "../../../../components/themeText/themeText";
+import FormattedBalanceInput from "../../../../components/formattedBalanceInput/formattedBalanceInput";
+import { useOverlay } from "../../../../contexts/overlayContext";
+
+const MAX_SEND_OPTIONS = [
+  { label: "25%", value: "25" },
+  { label: "50%", value: "50" },
+  { label: "75%", value: "75" },
+  { label: "100%", value: "100" },
+];
+
+export default function SendAndRequestPage(props) {
+  const { openOverlay } = useOverlay();
+  const navigate = useNavigate();
+  const location = useLocation();
+  const { masterInfoObject } = useGlobalContextProvider();
+  const { sparkInformation } = useSpark();
+  const { contactsPrivateKey, publicKey } = useKeysContext();
+  const { isConnectedToTheInternet } = useAppStatus();
+  const { fiatStats } = useNodeContext();
+  const { globalContactsInformation } = useGlobalContacts();
+  const getServerTime = useServerTimeOnly();
+  const [amountValue, setAmountValue] = useState("");
+  const [isAmountFocused, setIsAmountFocused] = useState(true);
+  const [descriptionValue, setDescriptionValue] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
+  const [inputDenomination, setInputDenomination] = useState(
+    masterInfoObject.userBalanceDenomination
+  );
+  const { currentWalletMnemoinc } = useActiveCustodyAccount();
+  const { theme, darkModeType } = useThemeContext();
+  const { backgroundOffset, textColor, backgroundColor } = useThemeColors();
+  const { t } = useTranslation();
+  const descriptionRef = useRef(null);
+  const [isGettingMax, setIsGettingMax] = useState(false);
+
+  const selectedContact =
+    location.state?.selectedContact || props.route?.params?.selectedContact;
+  const paymentType =
+    location.state?.paymentType || props.route?.params?.paymentType;
+  const fromPage = location.state?.fromPage || props.route?.params?.fromPage;
+  const imageData = location.state?.imageData || props.route?.params?.imageData;
+  const giftOption = location.state?.cardInfo || props.route?.params?.cardInfo;
+  const useAltLayout = false;
+
+  const isBTCdenominated =
+    inputDenomination == "hidden" || inputDenomination == "sats";
+
+  const convertedSendAmount = useMemo(
+    () =>
+      (isBTCdenominated
+        ? Math.round(amountValue)
+        : Math.round(
+            (SATSPERBITCOIN / fiatStats?.value) * (amountValue / 100)
+          )) || 0,
+    [amountValue, fiatStats, isBTCdenominated]
+  );
+
+  console.log(amountValue, convertedSendAmount, "testing");
+
+  const canSendPayment = useMemo(
+    () => convertedSendAmount,
+    [convertedSendAmount, paymentType]
+  );
+
+  const switchTextToConfirm = useMemo(() => {
+    return (
+      masterInfoObject[QUICK_PAY_STORAGE_KEY]?.isFastPayEnabled &&
+      convertedSendAmount <=
+        masterInfoObject[QUICK_PAY_STORAGE_KEY].fastPayThresholdSats
+    );
+  }, [convertedSendAmount]);
+
+  const handleSelctProcesss = useCallback(
+    async (item) => {
+      try {
+        const balance = sparkInformation.balance;
+        const selectedPercent = !item ? 100 : Number(item.value);
+
+        const sendingBalance = Math.floor(balance * (selectedPercent / 100));
+
+        setIsGettingMax(true);
+        await new Promise((res) => setTimeout(res, 250));
+
+        let maxAmountSats = 0;
+
+        if (selectedContact.isLNURL) {
+          const [username, domain] = selectedContact.receiveAddress.split("@");
+          const lnurlResposne = await getBolt11InvoiceForContact(
+            username,
+            sendingBalance,
+            undefined,
+            false,
+            domain
+          );
+          if (!lnurlResposne) throw new Error("Unable to get invoice");
+          const invoice = lnurlResposne;
+          const fee = await sparkPaymenWrapper({
+            getFee: true,
+            address: invoice,
+            masterInfoObject,
+            paymentType: "lightning",
+            mnemonic: currentWalletMnemoinc,
+          });
+
+          if (!fee.didWork) throw new Error(fee.error);
+
+          maxAmountSats = Math.max(
+            Number(sendingBalance) - fee.fee + fee.supportFee,
+            0
+          );
+        } else {
+          const feeResponse = await sparkPaymenWrapper({
+            getFee: true,
+            address: sparkInformation.sparkAddress,
+            masterInfoObject,
+            paymentType: "spark",
+            amountSats: sendingBalance,
+            mnemonic: currentWalletMnemoinc,
+          });
+          if (!feeResponse.didWork) throw new Error("Unable to get invoice");
+          maxAmountSats = Math.max(
+            Number(sendingBalance) - feeResponse.fee + feeResponse.supportFee,
+            0
+          );
+        }
+
+        const convertedMax =
+          inputDenomination != "fiat"
+            ? Math.floor(Number(maxAmountSats))
+            : (
+                Number(maxAmountSats) /
+                Math.floor(SATSPERBITCOIN / fiatStats?.value)
+              ).toFixed(2);
+
+        setAmountValue(convertedMax);
+      } catch (err) {
+        openOverlay({
+          for: "error",
+          errorMessage: t("errormessages.genericError"),
+        });
+      } finally {
+        setIsGettingMax(false);
+      }
+    },
+    [
+      sparkInformation,
+      inputDenomination,
+      currentWalletMnemoinc,
+      selectedContact,
+    ]
+  );
+
+  useEffect(() => {
+    if (!giftOption) {
+      setAmountValue("");
+      return;
+    }
+    const totalSats = Math.round(
+      giftOption.selectedDenomination * giftOption.satsPerDollar
+    );
+    const localfiatSatsPerDollar = fiatStats.value / SATSPERBITCOIN;
+    setAmountValue(
+      String(
+        isBTCdenominated
+          ? totalSats
+          : Math.round(localfiatSatsPerDollar * totalSats)
+      )
+    );
+  }, [giftOption]);
+
+  const handleSearch = useCallback((term) => {
+    setAmountValue(term);
+  }, []);
+
+  const handleSubmit = useCallback(async () => {
+    if (!isConnectedToTheInternet) {
+      openOverlay({
+        for: "error",
+        errorMessage: t("errormessages.nointernet"),
+      });
+
+      return;
+    }
+    try {
+      if (!convertedSendAmount) return;
+      if (!canSendPayment) return;
+
+      setIsLoading(true);
+
+      const sendingAmountMsat = convertedSendAmount * 1000;
+      const contactMessage = descriptionValue;
+      const myProfileMessage = descriptionValue
+        ? descriptionValue
+        : t("contacts.sendAndRequestPage.profileMessage", {
+            name: selectedContact.name || selectedContact.uniqueName,
+          });
+      const payingContactMessage = descriptionValue
+        ? descriptionValue
+        : {
+            usingTranslation: true,
+            type: "paid",
+            name:
+              globalContactsInformation.myProfile.name ||
+              globalContactsInformation.myProfile.uniqueName,
+          };
+
+      const currentTime = getServerTime();
+      const UUID = customUUID();
+      let sendObject = {};
+
+      if (globalContactsInformation.myProfile.uniqueName) {
+        sendObject["senderProfileSnapshot"] = {
+          uniqueName: globalContactsInformation.myProfile.uniqueName,
+        };
+      }
+
+      if (giftOption) {
+        const retrivedContact = await getDataFromCollection(
+          "blitzWalletUsers",
+          selectedContact.uuid
+        );
+        if (!retrivedContact) {
+          openOverlay({
+            for: "error",
+            errorMessage: t("errormessages.fullDeeplinkError"),
+          });
+          return;
+        }
+        if (!retrivedContact.enabledGiftCards) {
+          openOverlay({
+            for: "error",
+            errorMessage: t(
+              "contacts.sendAndRequestPage.giftCardappVersionError"
+            ),
+          });
+          return;
+        }
+
+        const postData = {
+          type: "buyGiftCard",
+          productId: giftOption.id,
+          cardValue: giftOption.selectedDenomination,
+          quantity: Number(1),
+        };
+
+        const response = await fetchBackend(
+          "theBitcoinCompanyV3",
+          postData,
+          contactsPrivateKey,
+          publicKey
+        );
+
+        if (response.result) {
+          const { amount, invoice, orderId, uuid } = response.result;
+          const fiatRates = await (fiatStats.coin?.toLowerCase() === "usd"
+            ? Promise.resolve({ didWork: true, fiatRateResponse: fiatStats })
+            : loadNewFiatData(
+                "usd",
+                contactsPrivateKey,
+                publicKey,
+                masterInfoObject
+              ));
+          const USDBTCValue = fiatRates.didWork
+            ? fiatRates.fiatRateResponse
+            : { coin: "USD", value: 100_000 };
+
+          const sendingAmountSat = amount;
+          const isOverDailyLimit = await giftCardPurchaseAmountTracker({
+            sendingAmountSat: sendingAmountSat,
+            USDBTCValue: USDBTCValue,
+            testOnly: true,
+          });
+
+          if (isOverDailyLimit.shouldBlock) {
+            openOverlay({
+              for: "error",
+              errorMessage: isOverDailyLimit.reason,
+            });
+            return;
+          }
+
+          sendObject["amountMsat"] = amount;
+          sendObject["description"] = giftOption.memo || "";
+          sendObject["uuid"] = UUID;
+          sendObject["isRequest"] = false;
+          sendObject["isRedeemed"] = null;
+          sendObject["wasSeen"] = null;
+          sendObject["didSend"] = null;
+          sendObject["giftCardInfo"] = {
+            amount,
+            invoice,
+            orderId,
+            uuid,
+            logo: giftOption.logo,
+            name: giftOption.name,
+          };
+
+          navigate("/confirm-payment", {
+            state: {
+              btcAddress: invoice,
+              comingFromAccept: true,
+              enteredPaymentInfo: {
+                amount: amount,
+                description:
+                  descriptionValue ||
+                  t("contacts.sendAndRequestPage.giftCardDescription", {
+                    name: selectedContact.name || selectedContact.uniqueName,
+                    giftCardName: giftOption.name,
+                  }),
+              },
+              contactInfo: {
+                imageData,
+                name: selectedContact.name || selectedContact.uniqueName,
+                uniqueName: selectedContact.uniqueName,
+                uuid: selectedContact.uuid,
+              },
+              fromPage: "contacts",
+              publishMessageFunc: () => {
+                giftCardPurchaseAmountTracker({
+                  sendingAmountSat: sendingAmountSat,
+                  USDBTCValue: USDBTCValue,
+                });
+                publishMessage({
+                  toPubKey: selectedContact.uuid,
+                  fromPubKey: globalContactsInformation.myProfile.uuid,
+                  data: sendObject,
+                  globalContactsInformation,
+                  selectedContact,
+                  isLNURLPayment: false,
+                  privateKey: contactsPrivateKey,
+                  retrivedContact,
+                  currentTime,
+                  masterInfoObject,
+                });
+              },
+            },
+          });
+        } else {
+          openOverlay({
+            for: "error",
+            errorMessage: t("contacts.sendAndRequestPage.cardDetailsError"),
+          });
+        }
+        return;
+      }
+
+      const {
+        receiveAddress,
+        retrivedContact,
+        didWork,
+        error,
+        formattedPayingContactMessage,
+      } = await getReceiveAddressAndContactForContactsPayment({
+        sendingAmountSat: convertedSendAmount,
+        selectedContact,
+        myProfileMessage,
+        payingContactMessage,
+        onlyGetContact: paymentType !== "send",
+      });
+
+      if (!didWork) {
+        openOverlay({
+          for: "error",
+          errorMessage: error,
+        });
+        return;
+      }
+
+      if (paymentType === "send") {
+        sendObject["amountMsat"] = sendingAmountMsat;
+        sendObject["description"] = contactMessage;
+        sendObject["uuid"] = UUID;
+        sendObject["isRequest"] = false;
+        sendObject["isRedeemed"] = null;
+        sendObject["wasSeen"] = null;
+        sendObject["didSend"] = null;
+
+        navigate("/send", {
+          state: {
+            btcAddress: receiveAddress,
+            comingFromAccept: true,
+            enteredPaymentInfo: {
+              amount: sendingAmountMsat / 1000,
+              description: myProfileMessage,
+            },
+            contactInfo: {
+              imageData,
+              name: selectedContact.name || selectedContact.uniqueName,
+              isLNURLPayment: selectedContact?.isLNURL,
+              payingContactMessage: formattedPayingContactMessage,
+              uniqueName: retrivedContact?.contacts?.myProfile?.uniqueName,
+              uuid: selectedContact.uuid,
+            },
+            fromPage: "contacts",
+            publishMessageFuncParams: {
+              toPubKey: selectedContact.uuid,
+              fromPubKey: globalContactsInformation.myProfile.uuid,
+              data: {
+                ...sendObject,
+                name:
+                  globalContactsInformation.myProfile.name ||
+                  globalContactsInformation.myProfile.uniqueName,
+              },
+              globalContactsInformation,
+              selectedContact,
+              isLNURLPayment: selectedContact?.isLNURL,
+              privateKey: contactsPrivateKey,
+              retrivedContact,
+              currentTime,
+              masterInfoObject,
+            },
+          },
+        });
+      } else {
+        sendObject["amountMsat"] = sendingAmountMsat;
+        sendObject["description"] = descriptionValue;
+        sendObject["uuid"] = UUID;
+        sendObject["isRequest"] = true;
+        sendObject["isRedeemed"] = null;
+        sendObject["wasSeen"] = null;
+        sendObject["didSend"] = null;
+
+        await publishMessage({
+          toPubKey: selectedContact.uuid,
+          fromPubKey: globalContactsInformation.myProfile.uuid,
+          data: sendObject,
+          globalContactsInformation,
+          selectedContact,
+          isLNURLPayment: selectedContact?.isLNURL,
+          privateKey: contactsPrivateKey,
+          retrivedContact,
+          currentTime,
+          masterInfoObject,
+        });
+
+        navigate(-1);
+      }
+    } catch (err) {
+      console.log(err, "publishing message error");
+      openOverlay({
+        for: "error",
+        errorMessage: selectedContact.isLNURL
+          ? t("errormessages.contactInvoiceGenerationError")
+          : t("errormessages.invoiceRetrivalError"),
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  }, [
+    isConnectedToTheInternet,
+    convertedSendAmount,
+    canSendPayment,
+    selectedContact,
+    navigate,
+    contactsPrivateKey,
+    descriptionValue,
+    paymentType,
+    globalContactsInformation,
+    getServerTime,
+    giftOption,
+    masterInfoObject,
+    fiatStats,
+    imageData,
+  ]);
+
+  const memorizedContainerStyles = useMemo(() => {
+    return {
+      flex: 0,
+      borderRadius: 8,
+      height: "unset",
+      minWidth: "unset",
+      justifyContent: "center",
+    };
+  }, []);
+
+  const handleEmoji = (newDescription) => {
+    setDescriptionValue(newDescription);
+  };
+
+  return (
+    <div className="send-request-page">
+      <div className="replacement-container">
+        <NavBarWithBalance showBalance={paymentType === "send"} />
+        <div
+          className="scroll-view-container"
+          style={{ opacity: isAmountFocused ? 1 : HIDDEN_OPACITY }}
+        >
+          <FormattedBalanceInput
+            maxWidth={0.9}
+            amountValue={amountValue || 0}
+            inputDenomination={inputDenomination}
+            containerFunction={() => {
+              if (!isAmountFocused) return;
+              setInputDenomination((prev) => {
+                const newPrev = prev === "sats" ? "fiat" : "sats";
+                return newPrev;
+              });
+              setAmountValue(
+                convertTextInputValue(amountValue, fiatStats, inputDenomination)
+              );
+            }}
+          />
+
+          <FormattedSatText
+            containerStyles={{
+              marginBottom: 16,
+              opacity: !amountValue ? HIDDEN_OPACITY : 1,
+            }}
+            styles={{ margin: 0 }}
+            neverHideBalance={true}
+            globalBalanceDenomination={isBTCdenominated ? "fiat" : "sats"}
+            balance={convertedSendAmount}
+          />
+
+          {paymentType === "send" && !giftOption && !useAltLayout && (
+            <div>
+              {/* <DropdownMenu
+                selectedValue={t(
+                  `wallet.sendPages.sendMaxComponent.${"sendMax"}`
+                )}
+                onSelect={handleSelctProcesss}
+                options={MAX_SEND_OPTIONS}
+                showClearIcon={false}
+                textStyles={{ textAlign: "center" }}
+                showVerticalArrows={false}
+                customButtonStyles={memorizedContainerStyles}
+                useIsLoading={isGettingMax}
+              /> */}
+            </div>
+          )}
+
+          {giftOption && (
+            <div className="gift-amount-container">
+              <button
+                onClick={() =>
+                  navigate("/modal", {
+                    state: {
+                      wantedContent: "giftCardSendAndReceiveOption",
+                    },
+                  })
+                }
+                className="pill"
+                style={{
+                  borderColor: backgroundOffset,
+                  backgroundColor: theme ? backgroundOffset : backgroundOffset,
+                }}
+              >
+                <div className="logo-container">
+                  <img
+                    className="card-logo"
+                    src={giftOption.logo}
+                    alt={giftOption.name}
+                  />
+                </div>
+                <ThemeText
+                  CustomNumberOfLines={1}
+                  textStyles={{ flexShrink: 1 }}
+                  textContent={t("contacts.sendAndRequestPage.giftCardText", {
+                    giftName: giftOption.name,
+                  })}
+                />
+                <div
+                  className="edit-button"
+                  style={{
+                    backgroundColor: backgroundOffset,
+                    borderColor: backgroundColor,
+                  }}
+                >
+                  <Edit
+                    color={
+                      theme && darkModeType
+                        ? Colors.dark.text
+                        : Colors.constants.blue
+                    }
+                  />
+                </div>
+              </button>
+              {giftOption.memo && (
+                <div className="memo-section">
+                  <ThemeText
+                    textStyles={{ marginBottom: 10, opacity: 0.8 }}
+                    textContent={t("contacts.sendAndRequestPage.giftMessage")}
+                  />
+                  <div
+                    className="memo-container"
+                    style={{
+                      backgroundColor: theme
+                        ? backgroundOffset
+                        : Colors.dark.text,
+                      borderColor: theme
+                        ? backgroundOffset
+                        : "rgba(255,255,255,0.1)",
+                    }}
+                  >
+                    <ThemeText
+                      textStyles={{
+                        lineHeight: 22,
+                        letterSpacing: 0.3,
+                      }}
+                      textContent={giftOption.memo}
+                    />
+                  </div>
+                </div>
+              )}
+            </div>
+          )}
+        </div>
+
+        {!giftOption && (
+          <>
+            <div className="input-and-gift-container">
+              {/* {paymentType === "send" &&
+                !giftOption &&
+                !selectedContact?.isLNURL && (
+                  <button
+                    onClick={() => navigate("/select-gift-card-contacts")}
+                    className="gift-container"
+                    style={{
+                      backgroundColor: backgroundOffset,
+                      marginBottom: useAltLayout ? 0 : CONTENT_KEYBOARD_OFFSET,
+                    }}
+                  >
+                    <ThemeText
+                      textStyles={{ margin: "0 8px 0 0" }}
+                      textContent={t(
+                        "contacts.sendAndRequestPage.sendGiftText"
+                      )}
+                    />
+                    <Gift color={textColor} />
+                  </button>
+                )} */}
+              <CustomInput
+                onFocusFunction={() => {
+                  setIsAmountFocused(false);
+                }}
+                onBlurFunction={() => {
+                  setIsAmountFocused(true);
+                }}
+                textInputRef={descriptionRef}
+                placeholder={t(
+                  "contacts.sendAndRequestPage.descriptionPlaceholder"
+                )}
+                customInputStyles={{
+                  borderRadius: useAltLayout ? 15 : 8,
+                  height: useAltLayout ? 50 : "unset",
+                }}
+                editable={paymentType === "send" ? true : !!convertedSendAmount}
+                containerStyles={{ maxWidth: 350, marginTop: 8 }}
+                onchange={setDescriptionValue}
+                inputText={descriptionValue}
+                textInputMultiline={true}
+                textAlignVertical={"center"}
+                maxLength={149}
+              />
+
+              {useAltLayout && (
+                <div className="max-and-accept-container">
+                  <div
+                    style={{
+                      flexShrink: useAltLayout ? 0 : 1,
+                      marginRight: useAltLayout ? 10 : 0,
+                      marginBottom: useAltLayout ? 0 : 20,
+                      alignSelf: useAltLayout ? "auto" : "center",
+                    }}
+                  >
+                    {/* <DropdownMenu
+                      selectedValue={t(
+                        `wallet.sendPages.sendMaxComponent.${"sendMaxShort"}`
+                      )}
+                      onSelect={handleSelctProcesss}
+                      options={MAX_SEND_OPTIONS}
+                      showClearIcon={false}
+                      textStyles={{ textAlign: "center" }}
+                      showVerticalArrows={false}
+                      customButtonStyles={{
+                        flex: 0,
+                        borderRadius: useAltLayout ? 30 : 8,
+                        height: useAltLayout ? 50 : "unset",
+                        minWidth: useAltLayout ? 70 : "unset",
+                        justifyContent: "center",
+                      }}
+                    /> */}
+                  </div>
+
+                  <CustomButton
+                    buttonStyles={{
+                      borderRadius: useAltLayout ? 30 : 8,
+                      height: useAltLayout ? 50 : "unset",
+                      flexShrink: useAltLayout ? 1 : 0,
+                      width: useAltLayout ? "100%" : "auto",
+                    }}
+                    useLoading={isLoading}
+                    actionFunction={handleSubmit}
+                    textContent={
+                      paymentType === "send"
+                        ? t("constants.confirm")
+                        : t("constants.request")
+                    }
+                  />
+                </div>
+              )}
+            </div>
+            {isAmountFocused && (
+              <CustomNumberKeyboard
+                showDot={masterInfoObject.userBalanceDenomination === "fiat"}
+                frompage="sendContactsPage"
+                setAmountValue={handleSearch}
+                usingForBalance={true}
+                fiatStats={fiatStats}
+                containerClassName="sendRequetContainer"
+              />
+            )}
+          </>
+        )}
+        {((isAmountFocused && !useAltLayout) || giftOption) && (
+          <CustomButton
+            buttonStyles={{
+              width: "auto",
+              opacity: canSendPayment ? 1 : HIDDEN_OPACITY,
+            }}
+            useLoading={isLoading}
+            actionFunction={handleSubmit}
+            textContent={
+              paymentType === "send"
+                ? switchTextToConfirm
+                  ? t("constants.confirm")
+                  : t("constants.review")
+                : t("constants.request")
+            }
+          />
+        )}
+      </div>
+      {!isAmountFocused && (
+        <EmojiQuickBar
+          description={descriptionValue}
+          onEmojiSelect={handleEmoji}
+        />
+      )}
+    </div>
+  );
+}
diff --git a/src/pages/contacts/contacts.css b/src/pages/contacts/contacts.css
index 41f0d50..c9d6968 100644
--- a/src/pages/contacts/contacts.css
+++ b/src/pages/contacts/contacts.css
@@ -6,8 +6,24 @@
 }
 /* navbar */
 #contactsPage .contactsPageTopBar {
+  min-height: 40px;
   display: flex;
   justify-content: end;
+  align-items: center;
+  position: relative;
+}
+#contactsPage .contactsPageTopBar .pageHeaderText {
+  width: 100%;
+  position: absolute;
+  font-size: 1.25rem;
+  text-align: center;
+  white-space: nowrap; /* Prevent line break */
+  overflow: hidden; /* Hide overflow */
+  text-overflow: ellipsis; /* Add "..." at end */
+  max-width: 100%; /* Optional: constrain width */
+  flex: 1; /* Fill available space if needed */
+  padding: 0 35px;
+  margin: 0;
 }
 #contactsPage .contactsPageTopBar .myContactContainer {
   width: 35px;
@@ -28,3 +44,160 @@
   justify-content: center;
   padding: 20px 0;
 }
+
+#contactsPage .not-found-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-top: 25px;
+}
+#contactsPage .not-found-username {
+  font-weight: 500;
+  margin: 0;
+  font-size: 1.25em;
+  line-height: 1;
+  text-align: center;
+}
+#contactsPage .not-found-label {
+  opacity: 0.6;
+  margin: 0;
+  font-size: 0.8em;
+  line-height: 1;
+  margin-top: 10px;
+  margin-bottom: 20px;
+  text-align: center;
+}
+
+/* row items */
+#contactsPage .pinned-contact {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 10px 0;
+  cursor: pointer;
+  max-width: 80px;
+}
+#contactsPage .pinnedContactScrollview {
+  display: flex;
+  flex-direction: row;
+  column-gap: 15px;
+  overflow-x: scroll;
+}
+#contactsPage .pinned-contact-image-wrapper {
+  width: 100%;
+  margin-bottom: 5px;
+}
+
+#contactsPage .pinned-contact-image-container {
+  width: 100%;
+
+  aspect-ratio: 1;
+  border-radius: 9999px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+}
+
+#contactsPage .pinned-contact-footer {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  overflow: hidden;
+}
+
+#contactsPage .pinned-contact-name {
+  width: 100%;
+  font-size: 12px;
+  margin: 5px 0 0;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  text-align: center;
+}
+
+#contactsPage .contact-row {
+  width: 95%;
+  display: flex;
+  align-items: center;
+  padding: 15px 0;
+  cursor: pointer;
+  margin: 0 auto;
+}
+
+#contactsPage .contact-image-container {
+  width: 35px;
+  height: 35px;
+  border-radius: 30px;
+  margin-right: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+}
+
+#contactsPage .contact-content {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+}
+
+#contactsPage .contact-row-inline {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  margin-bottom: 5px;
+}
+
+#contactsPage .contact-name-block {
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
+  margin-right: 5px;
+}
+
+#contactsPage .unknown-sender {
+  font-size: 12px;
+  opacity: 0.8;
+  margin: 0;
+}
+
+#contactsPage .contact-date {
+  font-size: 12px;
+  margin: 0;
+  margin-right: 5px;
+}
+
+#contactsPage .contact-arrow {
+  width: 20px;
+  height: 20px;
+  transform: rotate(180deg);
+}
+
+#contactsPage .contact-preview {
+  font-size: 12px;
+  opacity: 0.85;
+  margin: 0;
+}
+
+#contactsPage .notification-dot {
+  width: 10px;
+  height: 10px;
+  margin: 0;
+  border-radius: 50%;
+  margin-right: 5px;
+  position: relative;
+}
+
+#contactsPage .add-contact-icon {
+  width: 25px;
+  height: 25px;
+  transform: rotate(45deg);
+}
+
+#contactsPage .add-contact-text {
+  font-weight: 500;
+  margin: 0;
+}
diff --git a/src/pages/contacts/contacts.jsx b/src/pages/contacts/contacts.jsx
index 6bb1dcf..30576ab 100644
--- a/src/pages/contacts/contacts.jsx
+++ b/src/pages/contacts/contacts.jsx
@@ -1,11 +1,9 @@
-import { useMemo, useState } from "react";
-import PinnedContactElement from "./components/pinnedContact/pinnedContact";
+import { memo, useCallback, useMemo, useState } from "react";
 import { useGlobalContacts } from "../../contexts/globalContacts";
 import { useImageCache } from "../../contexts/imageCacheContext";
 import { useGlobalContextProvider } from "../../contexts/masterInfoObject";
 import { useAppStatus } from "../../contexts/appStatus";
 import { useLocation, useNavigate } from "react-router-dom";
-import { ContactElement } from "./components/contactElement/contactElement";
 import CustomInput from "../../components/customInput/customInput";
 import ThemeText from "../../components/themeText/themeText";
 import CustomButton from "../../components/customButton/customButton";
@@ -17,195 +15,578 @@ import { useThemeContext } from "../../contexts/themeContext";
 import useThemeColors from "../../hooks/useThemeColors";
 import { questionMarkSVG } from "../../constants/icons";
 import ThemeImage from "../../components/ThemeImage/themeImage";
+import NavBarProfileImage from "../../components/navBar/profileImage";
+import { useKeysContext } from "../../contexts/keysContext";
+import { useServerTime, useServerTimeOnly } from "../../contexts/serverTime";
+import { useTranslation } from "react-i18next";
+import { useFilteredContacts, useProcessedContacts } from "./utils/hooks";
+import { encryptMessage } from "../../functions/encodingAndDecoding";
+import { ChevronRight, PlusIcon } from "lucide-react";
+import { createFormattedDate, formatMessage } from "./utils/utilityFunctions";
+import { formatDisplayName } from "./utils/formatListDisplayName";
+import { useOverlay } from "../../contexts/overlayContext";
 
-export default function Contacts({ openOverlay }) {
+export default function Contacts() {
+  const { openOverlay } = useOverlay();
+  const { contactsPrivateKey, publicKey } = useKeysContext();
   const { masterInfoObject } = useGlobalContextProvider();
-  const { decodedAddedContacts, globalContactsInformation, contactsMessags } =
-    useGlobalContacts();
+  const { cache } = useImageCache();
   const { theme, darkModeType } = useThemeContext();
-  const { backgroundOffset } = useThemeColors();
+  const {
+    decodedAddedContacts,
+    globalContactsInformation,
+    contactsMessags,
+    toggleGlobalContactsInformation,
+    giftCardsList,
+  } = useGlobalContacts();
+  const { serverTimeOffset } = useServerTime();
+  const getServerTime = useServerTimeOnly();
+  const { backgroundOffset, backgroundColor, textColor } = useThemeColors();
   const { isConnectedToTheInternet } = useAppStatus();
-  const { cache } = useImageCache();
+  const { t } = useTranslation();
+  const [inputText, setInputText] = useState("");
   const hideUnknownContacts = masterInfoObject.hideUnknownContacts;
-  const myProfile = globalContactsInformation?.myProfile;
-  const didEditProfile = globalContactsInformation?.myProfile?.didEditProfile;
   const navigate = useNavigate();
-  const location = useLocation();
-  const [inputText, setInputText] = useState("");
+  const myProfile = globalContactsInformation.myProfile;
+  const didEditProfile = myProfile?.didEditProfile;
+
+  const contactInfoList = useProcessedContacts(
+    decodedAddedContacts,
+    contactsMessags
+  );
+
+  const filteredContacts =
+    useFilteredContacts(
+      contactInfoList,
+      inputText.trim(),
+      hideUnknownContacts
+    ) ?? [];
+  const profileContainerStyle = useMemo(
+    () => ({
+      backgroundColor: backgroundOffset,
+    }),
+    [backgroundOffset]
+  );
+
+  const searchInputStyle = useMemo(
+    () => ({
+      width: "100%",
+      paddingBottom: "10px",
+      backgroundColor,
+    }),
+    [backgroundColor]
+  );
+
+  const scrollContentStyle = useMemo(
+    () => ({
+      paddingTop: contactInfoList.some((c) => c.contact.isFavorite) ? 0 : 10,
+    }),
+    [contactInfoList]
+  );
 
-  console.log("test", import.meta.env.MODE);
+  const showAddContactRowItem =
+    !contactInfoList?.length ||
+    filteredContacts?.length ||
+    (contactInfoList?.length &&
+      !filteredContacts?.length &&
+      !inputText?.trim()?.length);
+
+  const showHighlightedGifts = useMemo(() => {
+    return giftCardsList && !!giftCardsList?.length;
+  }, [giftCardsList]);
+
+  const navigateToExpandedContact = useCallback(
+    async (contact) => {
+      try {
+        if (!contact.isAdded) {
+          let newAddedContacts = [...decodedAddedContacts];
+          const indexOfContact = decodedAddedContacts.findIndex(
+            (obj) => obj.uuid === contact.uuid
+          );
+
+          let newContact = newAddedContacts[indexOfContact];
+          newContact["isAdded"] = true;
+
+          toggleGlobalContactsInformation(
+            {
+              myProfile: { ...globalContactsInformation.myProfile },
+              addedContacts: await encryptMessage(
+                contactsPrivateKey,
+                publicKey,
+                JSON.stringify(newAddedContacts)
+              ),
+            },
+            true
+          );
+        }
+        navigate("/expandedContactsPage", {
+          state: { uuid: contact.uuid },
+        });
+      } catch (err) {
+        console.log("error navigating to expanded contact", err);
+        navigate("/expandedContactsPage", {
+          state: { uuid: contact.uuid },
+        });
+      }
+    },
+    [
+      decodedAddedContacts,
+      globalContactsInformation,
+      toggleGlobalContactsInformation,
+      contactsPrivateKey,
+      publicKey,
+      navigate,
+    ]
+  );
 
   const pinnedContacts = useMemo(() => {
-    return decodedAddedContacts
-      .filter((contact) => contact.isFavorite)
-      .map((contact, id) => {
-        return (
-          <PinnedContactElement
-            cache={cache}
-            key={contact.uuid}
-            contact={contact}
-          />
-        );
-      });
-  }, [decodedAddedContacts, contactsMessags, cache]);
+    return contactInfoList
+      .filter((contact) => contact.contact.isFavorite)
+      .map((contact) => (
+        <PinnedContactElement
+          key={contact.contact.uuid}
+          contact={contact.contact}
+          hasUnlookedTransaction={contact.hasUnlookedTransaction}
+          cache={cache}
+          darkModeType={darkModeType}
+          theme={theme}
+          backgroundOffset={backgroundOffset}
+          navigateToExpandedContact={navigateToExpandedContact}
+          // dimensions={dimensions}
+          navigate={navigate}
+          openOverlay={openOverlay}
+        />
+      ));
+  }, [
+    contactInfoList,
+    cache,
+    darkModeType,
+    theme,
+    backgroundOffset,
+    navigateToExpandedContact,
+    // dimensions,
+    navigate,
+    openOverlay,
+  ]);
 
   const contactElements = useMemo(() => {
-    return decodedAddedContacts
-      .filter((contact) => {
-        return (
-          (contact.name?.toLowerCase()?.startsWith(inputText.toLowerCase()) ||
-            contact?.uniqueName
-              ?.toLowerCase()
-              ?.startsWith(inputText.toLowerCase())) &&
-          !contact.isFavorite &&
-          (!hideUnknownContacts || contact.isAdded)
-        );
-      })
-      .sort((a, b) => {
-        const earliset_A = contactsMessags[a.uuid]?.lastUpdated;
-        const earliset_B = contactsMessags[b.uuid]?.lastUpdated;
-        return (earliset_B || 0) - (earliset_A || 0);
-      })
-      .map((contact, id) => {
-        return (
-          <ContactElement cache={cache} key={contact.uuid} contact={contact} />
-        );
-      });
+    const currentTime = getServerTime();
+
+    let contacts = filteredContacts.map((item, index) => (
+      <ContactElement
+        key={item.contact.uuid}
+        contact={item.contact}
+        hasUnlookedTransaction={item.hasUnlookedTransaction}
+        lastUpdated={item.lastUpdated}
+        firstMessage={item.firstMessage}
+        cache={cache}
+        darkModeType={darkModeType}
+        theme={theme}
+        backgroundOffset={backgroundOffset}
+        navigateToExpandedContact={navigateToExpandedContact}
+        isConnectedToTheInternet={isConnectedToTheInternet}
+        navigate={navigate}
+        currentTime={currentTime}
+        serverTimeOffset={serverTimeOffset}
+        t={t}
+        isLastElement={index === filteredContacts.length - 1}
+        openOverlay={openOverlay}
+      />
+    ));
+    if (showAddContactRowItem) {
+      contacts.unshift(
+        <AddContactRowItem
+          key={"add-cotnacts-row-item"}
+          theme={theme}
+          darkModeType={darkModeType}
+          backgroundOffset={backgroundOffset}
+          isConnectedToTheInternet={isConnectedToTheInternet}
+          navigate={navigate}
+          numberOfContacts={filteredContacts?.length}
+          t={t}
+          openOverlay={openOverlay}
+        />
+      );
+    }
+    return contacts;
   }, [
-    decodedAddedContacts,
-    inputText,
-    hideUnknownContacts,
-    contactsMessags,
+    filteredContacts,
     cache,
+    darkModeType,
+    theme,
+    backgroundOffset,
+    navigateToExpandedContact,
+    isConnectedToTheInternet,
+    navigate,
+    getServerTime,
+    serverTimeOffset,
+    showAddContactRowItem,
+    t,
+    openOverlay,
   ]);
 
+  console.log(cache, "test");
+
+  const handleButtonPress = useCallback(() => {
+    if (!isConnectedToTheInternet) {
+      openOverlay({
+        for: "error",
+        errorMessage: "Not connected to the internet",
+      });
+      return;
+    }
+    if (didEditProfile) {
+      openOverlay({
+        for: "halfModal",
+        contentType: "addContactsHalfModal",
+      });
+    } else {
+      navigate("/edit-profile", {
+        state: { pageType: "myProfile", fromSettings: false },
+      });
+    }
+  }, [isConnectedToTheInternet, didEditProfile, navigate]);
+
+  const hasContacts =
+    decodedAddedContacts.filter(
+      (contact) => !hideUnknownContacts || contact.isAdded
+    ).length !== 0;
+
+  const stickyHeaderIndicesValue = useMemo(() => {
+    return [pinnedContacts.length ? 1 : 0];
+  }, [pinnedContacts]);
+
   return (
     <div id="contactsPage">
-      {myProfile?.didEditProfile && (
+      {(didEditProfile || hasContacts) && (
         <div className="contactsPageTopBar">
-          {/* <div
-            className="addContactsContainer"
-            onPress={() => {
-              keyboardNavigate(() => {
-                if (!isConnectedToTheInternet) {
-                  navigate.navigate("ErrorScreen", {
-                    errorMessage:
-                      "Please connect to the internet to use this feature",
-                  });
-                  return;
-                }
-                navigate.navigate("CustomHalfModal", {
-                  wantedContent: "addContacts",
-                  sliderHight: 0.4,
-                });
-              });
-            }}
-          >
-             <Icon
-              name={"addContactsIcon"}
-              width={30}
-              height={30}
-              color={
-                theme && darkModeType ? COLORS.darkModeText : COLORS.primary
-              }
-              offsetColor={
-                theme
-                  ? darkModeType
-                    ? COLORS.lightsOutBackground
-                    : COLORS.darkModeBackground
-                  : COLORS.lightModeBackground
-              }
-            /> 
-          </div> */}
-          <div
-            style={{ backgroundColor: backgroundOffset }}
-            className="myContactContainer"
-            onClick={() => {
-              navigate("/my-profile");
-            }}
-          >
-            <ContactProfileImage
-              updated={cache[masterInfoObject?.uuid]?.updated}
-              uri={cache[masterInfoObject?.uuid]?.localUri}
-              theme={theme}
-              darkModeType={darkModeType}
-            />
+          <ThemeText className="pageHeaderText" textContent={"Contacts"} />
+          <div>
+            <NavBarProfileImage />
           </div>
         </div>
       )}
-      {/* {decodedAddedContacts.filter(
-        (contact) => !hideUnknownContacts || contact.isAdded
-      ).length !== 0 && myProfile.didEditProfile ? (
+      {hasContacts && didEditProfile ? (
         <div
           className="hasContactsContainer"
           style={{ flex: 1, overflow: "hidden" }}
         >
           {pinnedContacts.length != 0 && (
-            <div
-              className="pinnedContactElementContainer"
-              style={{ height: 120 }}
-            >
+            <div className="pinnedContactElementContainer">
               <div className="pinnedContactScrollview">{pinnedContacts}</div>
             </div>
           )}
           <CustomInput
-            placeholderText={"Search added contacts..."}
+            placeholder={"Search added contacts..."}
             inputText={inputText}
-            setInputText={setInputText}
-            containerStyles={{ width: "100%" }}
+            onchange={setInputText}
+            containerStyles={{
+              width: "100%",
+              maxWidth: "unset",
+              marginTop: 10,
+              marginBottom: 15,
+            }}
           />
-          {contactElements}
+          {contactElements.length ? (
+            contactElements
+          ) : (
+            <div className="not-found-container">
+              <ThemeText
+                className="not-found-username"
+                textContent={
+                  `"${inputText}" ` + t("contacts.contactsPage.notFound")
+                }
+              />
+              <ThemeText
+                className="not-found-label"
+                textContent={t("contacts.contactsPage.noContactSearch")}
+              />
+              <CustomButton
+                cl
+                actionFunction={() =>
+                  openOverlay({
+                    for: "halfModal",
+                    contentType: "addContactsHalfModal",
+                    params: {
+                      startingSearchValue: inputText.trim(),
+                    },
+                  })
+                }
+                textContent={t("constants.search")}
+              />
+            </div>
+          )}
         </div>
-      ) : ( */}
-      <div className="noContactsContainer">
-        <ThemeImage
-          icon={questionMarkSVG}
-          styles={{ width: "95%", maxWidth: 300, height: "auto" }}
-          alt="question mark to show no contact has been created"
-        />
-        <ThemeText
-          textStyles={{
-            width: "95%",
-            maxWidth: "300px",
-            textAlign: "center",
-          }}
-          textContent={
-            didEditProfile
-              ? "You have no contacts."
-              : "Edit your profile to begin using contacts."
-          }
-        />
-
-        <CustomButton
-          buttonStyles={{
-            // ...CENTER,
-            width: "auto",
-          }}
-          actionFunction={() => {
-            if (!isConnectedToTheInternet) {
-              openOverlay({
-                for: "error",
-                errorMessage:
-                  "Please connect to the internet to use this feature.",
-              });
-              return;
-            }
-            if (didEditProfile) {
-              //navigate to add contacts popup
-              openOverlay({
-                for: "error",
-                errorMessage: "Feature coming soon...",
-              });
-            } else {
-              navigate("/edit-profile", {
-                state: { pageType: "myProfile", fromSettings: false },
-              });
+      ) : (
+        <div className="noContactsContainer">
+          <ThemeImage
+            icon={questionMarkSVG}
+            styles={{ width: "95%", maxWidth: 200, height: "auto" }}
+            alt="question mark to show no contact has been created"
+          />
+          <ThemeText
+            textStyles={{
+              width: "95%",
+              maxWidth: "300px",
+              textAlign: "center",
+            }}
+            textContent={
+              didEditProfile
+                ? "You have no contacts."
+                : "Edit your profile to begin using contacts."
             }
-          }}
-          textContent={`${didEditProfile ? "Add contact" : "Edit profile"}`}
-        />
-      </div>
-      {/* )} */}
+          />
+
+          <CustomButton
+            buttonStyles={{
+              // ...CENTER,
+              width: "auto",
+            }}
+            actionFunction={handleButtonPress}
+            textContent={`${didEditProfile ? "Add contact" : "Edit profile"}`}
+          />
+        </div>
+      )}
     </div>
   );
 }
+
+export const PinnedContactElement = memo(
+  ({
+    contact,
+    hasUnlookedTransaction,
+    cache,
+    darkModeType,
+    theme,
+    backgroundOffset,
+    navigateToExpandedContact,
+    navigate,
+  }) => {
+    const [textWidth, setTextWidth] = useState(0);
+
+    const containerSize = useMemo(() => "calc(95% / 4 - 15px)", []);
+
+    const handleLongPress = useCallback(
+      (e) => {
+        e.preventDefault();
+        if (!contact.isAdded) return;
+        navigate("ContactsPageLongPressActions", { contact });
+      },
+      [contact, navigate]
+    );
+
+    const handlePress = useCallback(() => {
+      navigateToExpandedContact(contact);
+    }, [contact, navigateToExpandedContact]);
+
+    return (
+      <div
+        className="pinned-contact"
+        style={{ width: containerSize, height: containerSize }}
+        onClick={handlePress}
+        onContextMenu={handleLongPress}
+      >
+        <div
+          className="pinned-contact-image-container"
+          style={{ backgroundColor: backgroundOffset }}
+        >
+          <ContactProfileImage
+            updated={cache[contact.uuid]?.updated}
+            uri={cache[contact.uuid]?.localUri}
+            darkModeType={darkModeType}
+            theme={theme}
+          />
+        </div>
+
+        <div className="pinned-contact-footer">
+          {hasUnlookedTransaction && (
+            <span
+              className="notification-dot"
+              style={{
+                backgroundColor: darkModeType && theme ? "#fff" : "#007bff",
+                transform: `translateX(-${textWidth / 2 + 7}px)`,
+              }}
+            />
+          )}
+
+          <ThemeText
+            ref={(el) => el && setTextWidth(el.offsetWidth)}
+            textStyles={{
+              width: `calc(100% - ${hasUnlookedTransaction ? "25px" : "0px"})`,
+            }}
+            className="pinned-contact-name"
+            textContent={formatDisplayName(contact)}
+          />
+        </div>
+      </div>
+    );
+  }
+);
+
+export const ContactElement = memo(
+  ({
+    contact,
+    hasUnlookedTransaction,
+    lastUpdated,
+    firstMessage,
+    cache,
+    darkModeType,
+    theme,
+    backgroundOffset,
+    navigateToExpandedContact,
+    isConnectedToTheInternet,
+    navigate,
+    currentTime,
+    serverTimeOffset,
+    t,
+    isLastElement,
+    openOverlay,
+  }) => {
+    const handlePress = useCallback(() => {
+      navigateToExpandedContact(contact);
+    }, [contact, navigateToExpandedContact]);
+
+    const formattedDate = lastUpdated
+      ? createFormattedDate(
+          lastUpdated - serverTimeOffset,
+          currentTime - serverTimeOffset,
+          t
+        )
+      : "";
+
+    return (
+      <div
+        className="contact-row"
+        style={
+          !isLastElement
+            ? { borderBottom: `1px solid ${backgroundOffset}` }
+            : {}
+        }
+        onClick={handlePress}
+      >
+        <div
+          className="contact-image-container"
+          style={{ backgroundColor: backgroundOffset }}
+        >
+          <ContactProfileImage
+            updated={cache[contact.uuid]?.updated}
+            uri={cache[contact.uuid]?.localUri}
+            darkModeType={darkModeType}
+            theme={theme}
+          />
+        </div>
+
+        <div className="contact-content">
+          <div className="contact-row-inline">
+            <div className="contact-name-block">
+              <ThemeText
+                textStyles={{ margin: 0 }}
+                textContent={formatDisplayName(contact)}
+              />
+              {!contact.isAdded && (
+                <ThemeText
+                  textContent={t("contacts.contactsPage.unknownSender")}
+                  className="unknown-sender"
+                  textStyles={{
+                    color:
+                      darkModeType && theme
+                        ? Colors.dark.text
+                        : Colors.constants.blue,
+                  }}
+                />
+              )}
+            </div>
+
+            {hasUnlookedTransaction && (
+              <span
+                className="notification-dot"
+                style={{
+                  backgroundColor:
+                    darkModeType && theme
+                      ? Colors.dark.text
+                      : Colors.constants.blue,
+                }}
+              />
+            )}
+
+            <ThemeText className="contact-date" textContent={formattedDate} />
+            <ChevronRight
+              color={
+                darkModeType && theme ? Colors.dark.text : Colors.constants.blue
+              }
+              size={20}
+            />
+          </div>
+
+          {!!formatMessage(firstMessage) && contact.isAdded && (
+            <div className="contact-row-inline">
+              <ThemeText
+                className="contact-preview"
+                textContent={formatMessage(firstMessage)}
+              />
+            </div>
+          )}
+        </div>
+      </div>
+    );
+  }
+);
+export const AddContactRowItem = memo(
+  ({
+    darkModeType,
+    theme,
+    backgroundOffset,
+    t,
+    isConnectedToTheInternet,
+    navigate,
+    numberOfContacts,
+    openOverlay,
+  }) => {
+    const goToAddContact = useCallback(() => {
+      if (!isConnectedToTheInternet) {
+        navigate("ErrorScreen", {
+          errorMessage: t("errormessages.nointernet"),
+        });
+      } else {
+        openOverlay({
+          for: "halfModal",
+          contentType: "addContactsHalfModal",
+        });
+      }
+    }, [isConnectedToTheInternet, navigate, t]);
+
+    return (
+      <div
+        className="contact-row"
+        style={
+          numberOfContacts
+            ? { borderBottom: `1px solid ${backgroundOffset}` }
+            : {}
+        }
+        onClick={goToAddContact}
+      >
+        <div
+          className="contact-image-container"
+          style={{
+            backgroundColor:
+              theme && darkModeType ? backgroundOffset : "#007bff",
+          }}
+        >
+          <PlusIcon size={25} color={Colors.dark.text} />
+        </div>
+        <div className="contact-content">
+          <ThemeText
+            textStyles={{
+              color:
+                theme && darkModeType
+                  ? Colors.dark.text
+                  : Colors.constants.blue,
+            }}
+            textContent={t("contacts.contactsPage.addContactsText")}
+            className="add-contact-text"
+          />
+        </div>
+      </div>
+    );
+  }
+);
diff --git a/src/pages/contacts/internalComponents/contactTransactions/contactsTransactionItem.css b/src/pages/contacts/internalComponents/contactTransactions/contactsTransactionItem.css
new file mode 100644
index 0000000..2ea3905
--- /dev/null
+++ b/src/pages/contacts/internalComponents/contactTransactions/contactsTransactionItem.css
@@ -0,0 +1,89 @@
+/* Transaction Item Button */
+.transaction-item-button {
+  width: 100%;
+  background: none;
+  border: none;
+  padding: 0;
+  cursor: pointer;
+  text-align: left;
+}
+
+.transaction-item-button:active {
+  opacity: 1;
+}
+
+/* Transaction Container */
+.transaction-container {
+  width: 95%;
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  margin: 8px auto;
+}
+
+.transaction-container.centered {
+  align-items: center;
+}
+
+/* Icon Styles */
+.icon {
+  width: 30px;
+  height: 30px;
+  margin-right: 5px;
+}
+
+/* Transaction Content */
+.transaction-content {
+  width: 100%;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  margin-left: 10px;
+}
+.transaction-content > * {
+  margin: 0;
+}
+.transaction-content .time-label {
+  font-size: 0.8em;
+  font-weight: 300;
+  opacity: 0.6;
+}
+
+/* Accept or Pay Button Base Styles */
+.accept-or-pay-btn {
+  width: 100%;
+  overflow: hidden;
+  border-radius: 15px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 10px;
+  font-size: 16px;
+  cursor: pointer;
+  transition: opacity 0.2s ease;
+  border: none;
+}
+
+.accept-or-pay-btn:hover:not(:disabled) {
+  opacity: 0.9;
+}
+
+.accept-or-pay-btn:disabled {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+
+/* Text Ellipsis Support */
+.ellipsis-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ellipsis-text-multiline {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+}
diff --git a/src/pages/contacts/internalComponents/contactTransactions/contactsTransactions.jsx b/src/pages/contacts/internalComponents/contactTransactions/contactsTransactions.jsx
new file mode 100644
index 0000000..402cfb5
--- /dev/null
+++ b/src/pages/contacts/internalComponents/contactTransactions/contactsTransactions.jsx
@@ -0,0 +1,482 @@
+import React, { useCallback, useState, useMemo } from "react";
+
+import { useNavigate } from "react-router-dom";
+
+// import { sendPushNotification } from "../../../../../functions/messaging/publishMessage";
+
+import { useTranslation } from "react-i18next";
+
+import { useGlobalContextProvider } from "../../../../contexts/masterInfoObject";
+import FormattedSatText from "../../../../components/formattedSatText/formattedSatText";
+import useThemeColors from "../../../../hooks/useThemeColors";
+import ThemeText from "../../../../components/themeText/themeText";
+import { getDataFromCollection, updateMessage } from "../../../../../db";
+import { useThemeContext } from "../../../../contexts/themeContext";
+import { useKeysContext } from "../../../../contexts/keysContext";
+import CustomButton from "../../../../components/customButton/customButton";
+import { useServerTimeOnly } from "../../../../contexts/serverTime";
+import GiftCardTxItem from "../giftCardTxItem/giftCardTxItem";
+import { getTimeDisplay } from "../../../../functions/contacts";
+import getReceiveAddressAndContactForContactsPayment from "../../utils/getReceiveAddressAndKindForPayment";
+import { useGlobalContacts } from "../../../../contexts/globalContacts";
+import { getTransactionContent } from "../../utils/transactionText";
+import displayCorrectDenomination from "../../../../functions/displayCorrectDenomination";
+import { useNodeContext } from "../../../../contexts/nodeContext";
+
+import "./contactsTransactionItem.css";
+import { ArrowDown, ArrowUp, CircleX } from "lucide-react";
+import { Colors } from "../../../../constants/theme";
+import {
+  handlePaymentUpdate,
+  sendPushNotification,
+} from "../../../../functions/messaging/publishMessage";
+import { useOverlay } from "../../../../contexts/overlayContext";
+
+function ConfirmedOrSentTransaction({
+  txParsed,
+  paymentDescription,
+  timeDifferenceMinutes,
+  timeDifferenceHours,
+  timeDifferenceDays,
+  timeDifferenceYears,
+  props,
+  navigate,
+}) {
+  const { t } = useTranslation();
+  const { theme, darkModeType } = useThemeContext();
+  const { masterInfoObject } = useGlobalContextProvider();
+  const { textColor, backgroundOffset } = useThemeColors();
+
+  const didDeclinePayment = txParsed.isRedeemed != null && !txParsed.isRedeemed;
+
+  const isOutgoingPayment =
+    (txParsed.didSend && !txParsed.isRequest) ||
+    (txParsed.isRequest && txParsed.isRedeemed && !txParsed.didSend);
+
+  if (txParsed.giftCardInfo) {
+    return (
+      <GiftCardTxItem
+        txParsed={txParsed}
+        isOutgoingPayment={isOutgoingPayment}
+        theme={theme}
+        darkModeType={darkModeType}
+        backgroundOffset={backgroundOffset}
+        timeDifference={getTimeDisplay(
+          timeDifferenceMinutes,
+          timeDifferenceHours,
+          timeDifferenceDays,
+          timeDifferenceYears
+        )}
+        isFromProfile={false}
+        t={t}
+        navigate={navigate}
+        masterInfoObject={masterInfoObject}
+      />
+    );
+  }
+
+  return (
+    <div className="transaction-container centered">
+      {didDeclinePayment ? (
+        <CircleX
+          color={
+            theme && darkModeType
+              ? Colors.dark.text
+              : Colors.constants.cancelRed
+          }
+        />
+      ) : isOutgoingPayment ? (
+        <ArrowUp
+          color={
+            theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+          }
+        />
+      ) : (
+        <ArrowDown
+          color={
+            theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+          }
+        />
+      )}
+
+      <div className="transaction-content">
+        <ThemeText
+          CustomEllipsizeMode={"tail"}
+          CustomNumberOfLines={1}
+          textStyles={{
+            color: didDeclinePayment
+              ? theme && darkModeType
+                ? textColor
+                : Colors.constants.cancelRed
+              : textColor,
+            marginRight: 15,
+          }}
+          textContent={getTransactionContent({
+            paymentDescription,
+            didDeclinePayment,
+            txParsed,
+            t,
+          })}
+        />
+        <ThemeText
+          textStyles={{
+            color: didDeclinePayment
+              ? theme && darkModeType
+                ? textColor
+                : Colors.constants.cancelRed
+              : textColor,
+          }}
+          className={"time-label"}
+          textContent={getTimeDisplay(
+            timeDifferenceMinutes,
+            timeDifferenceHours,
+            timeDifferenceDays,
+            timeDifferenceYears
+          )}
+        />
+      </div>
+
+      <FormattedSatText
+        frontText={
+          didDeclinePayment ||
+          masterInfoObject.userBalanceDenomination === "hidden"
+            ? ""
+            : isOutgoingPayment
+            ? "-"
+            : "+"
+        }
+        containerStyles={{
+          marginBottom: "auto",
+        }}
+        styles={{
+          fontWeight: 400,
+          color: didDeclinePayment
+            ? theme && darkModeType
+              ? textColor
+              : Colors.constants.cancelRed
+            : textColor,
+        }}
+        balance={txParsed.amountMsat / 1000}
+        useMillionDenomination={true}
+      />
+    </div>
+  );
+}
+
+export default function ContactsTransactionItem(props) {
+  const { selectedContact, transaction, myProfile, currentTime, imageData } =
+    props;
+  const { openOverlay } = useOverlay();
+  const { t } = useTranslation();
+  const { fiatStats } = useNodeContext();
+  const { masterInfoObject } = useGlobalContextProvider();
+  const { contactsPrivateKey, publicKey } = useKeysContext();
+  const { theme, darkModeType } = useThemeContext();
+  const { textColor, backgroundColor } = useThemeColors();
+  const navigate = useNavigate();
+  const getServerTime = useServerTimeOnly();
+  const { globalContactsInformation } = useGlobalContacts();
+  const [isLoading, setIsLoading] = useState({
+    sendBTN: false,
+    declineBTN: false,
+  });
+
+  // Memoized calculations
+  const timeCalculations = useMemo(() => {
+    const endDate = currentTime;
+    const startDate = transaction.timestamp;
+
+    const timeDifferenceMs = Math.abs(endDate - startDate);
+
+    return {
+      timeDifferenceMinutes: timeDifferenceMs / (1000 * 60),
+      timeDifferenceHours: timeDifferenceMs / (1000 * 60 * 60),
+      timeDifferenceDays: timeDifferenceMs / (1000 * 60 * 60 * 24),
+      timeDifferenceYears: timeDifferenceMs / (1000 * 60 * 60 * 24 * 365),
+    };
+  }, [currentTime, transaction.serverTimestamp, transaction.timestamp]);
+
+  const {
+    timeDifferenceMinutes,
+    timeDifferenceHours,
+    timeDifferenceDays,
+    timeDifferenceYears,
+  } = timeCalculations;
+
+  const txParsed = transaction.message;
+  const paymentDescription = txParsed?.description || "";
+
+  const updatePaymentStatus = useCallback(
+    async (transaction, usingOnPage, didPay, txid) => {
+      try {
+        usingOnPage &&
+          setIsLoading((prev) => ({
+            ...prev,
+            [didPay ? "sendBTN" : "declineBTN"]: true,
+          }));
+        const currentTime = getServerTime();
+        const response = await handlePaymentUpdate({
+          transaction,
+          didPay,
+          txid,
+          globalContactsInformation,
+          selectedContact,
+          currentTime,
+          contactsPrivateKey,
+          publicKey,
+          masterInfoObject,
+        });
+
+        if (!response && usingOnPage) {
+          openOverlay({
+            for: "error",
+            errorMessage: t("errormessages.updateContactMessageError"),
+          });
+        }
+      } catch (err) {
+        console.log(err);
+        if (usingOnPage) {
+          openOverlay({
+            for: "error",
+            errorMessage: t("errormessages.declinePaymentError"),
+          });
+        }
+      } finally {
+        if (usingOnPage) {
+          setIsLoading((prev) => ({
+            ...prev,
+            [didPay ? "sendBTN" : "declineBTN"]: false,
+          }));
+        }
+      }
+    },
+    [
+      selectedContact,
+      myProfile,
+      contactsPrivateKey,
+      publicKey,
+      getServerTime,
+      navigate,
+      masterInfoObject,
+      globalContactsInformation,
+    ]
+  );
+
+  const acceptPayRequest = useCallback(
+    async (transaction, selectedContact) => {
+      setIsLoading((prev) => ({
+        ...prev,
+        sendBTN: true,
+      }));
+      const sendingAmount = transaction.message.amountMsat / 1000;
+
+      const myProfileMessage = t(
+        "contacts.internalComponents.contactsTransactions.acceptProfileMessage",
+        {
+          name: selectedContact.name || selectedContact.uniqueName,
+        }
+      );
+      const payingContactMessage = t(
+        "contacts.internalComponents.contactsTransactions.acceptPayingContactMessage",
+        {
+          name:
+            globalContactsInformation.myProfile.name ||
+            globalContactsInformation.myProfile.uniqueName,
+        }
+      );
+
+      const {
+        receiveAddress,
+        didWork,
+        error,
+        formattedPayingContactMessage,
+        retrivedContact,
+      } = await getReceiveAddressAndContactForContactsPayment({
+        sendingAmountSat: sendingAmount,
+        selectedContact,
+        myProfileMessage,
+        payingContactMessage,
+      });
+
+      if (!didWork) {
+        openOverlay({
+          for: "error",
+          errorMessage: t(error),
+        });
+        return;
+      }
+
+      setIsLoading((prev) => ({
+        ...prev,
+        sendBTN: false,
+      }));
+
+      const currentTime = getServerTime();
+      navigate("/send", {
+        state: {
+          btcAddress: receiveAddress,
+          comingFromAccept: true,
+          enteredPaymentInfo: {
+            amount: sendingAmount,
+            description: myProfileMessage,
+          },
+          contactInfo: {
+            imageData,
+            name: selectedContact.name || selectedContact.uniqueName,
+            payingContactMessage: formattedPayingContactMessage,
+            uniqueName: retrivedContact?.contacts?.myProfile?.uniqueName,
+            uuid: retrivedContact?.uuid,
+          },
+          fromPage: "contacts-request",
+          publishMessageFuncParams: {
+            transaction,
+            didPay: true,
+            globalContactsInformation,
+            selectedContact,
+            currentTime,
+          },
+        },
+      });
+      return;
+    },
+    [
+      myProfile,
+      navigate,
+      updatePaymentStatus,
+      globalContactsInformation,
+      imageData,
+      selectedContact,
+      getServerTime,
+    ]
+  );
+
+  const handleDescriptionClick = () => {
+    if (!paymentDescription) return;
+    navigate("/modal", {
+      state: {
+        wantedContent: "expandedContactMessage",
+        sliderHeight: 0.3,
+        message: paymentDescription,
+      },
+    });
+  };
+
+  if (txParsed === undefined) return null;
+
+  const isCompletedTransaction =
+    txParsed.didSend ||
+    !txParsed.isRequest ||
+    (txParsed.isRequest && txParsed.isRedeemed != null);
+
+  return (
+    <div className="transaction-item-button" key={props.id}>
+      {isCompletedTransaction ? (
+        <ConfirmedOrSentTransaction
+          txParsed={txParsed}
+          paymentDescription={paymentDescription}
+          timeDifferenceMinutes={timeDifferenceMinutes}
+          timeDifferenceHours={timeDifferenceHours}
+          timeDifferenceDays={timeDifferenceDays}
+          timeDifferenceYears={timeDifferenceYears}
+          navigate={navigate}
+          props={props}
+        />
+      ) : (
+        <div className="transaction-container">
+          <ArrowUp
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+            }
+          />
+
+          <div className="transaction-content">
+            <ThemeText
+              textContent={t(
+                "contacts.internalComponents.contactsTransactions.requestTitle",
+                {
+                  amount: displayCorrectDenomination({
+                    amount: txParsed.amountMsat / 1000,
+                    masterInfoObject,
+                    fiatStats,
+                    useMillionDenomination: true,
+                  }),
+                }
+              )}
+            />
+            <ThemeText
+              textStyles={{
+                fontWeight: 300,
+                marginBottom: paymentDescription ? 0 : 15,
+              }}
+              className={"time-label"}
+              textContent={getTimeDisplay(
+                timeDifferenceMinutes,
+                timeDifferenceHours,
+                timeDifferenceDays,
+                timeDifferenceYears
+              )}
+            />
+
+            {paymentDescription && (
+              <ThemeText
+                CustomEllipsizeMode={"tail"}
+                CustomNumberOfLines={2}
+                textStyles={{
+                  fontWeight: 400,
+                  marginBottom: 10,
+                }}
+                textContent={paymentDescription}
+              />
+            )}
+
+            <CustomButton
+              useLoading={isLoading.sendBTN}
+              loadingColor={backgroundColor}
+              actionFunction={() => {
+                acceptPayRequest(transaction, props.selectedContact);
+              }}
+              buttonStyles={{
+                width: "100%",
+                maxWidth: "unset",
+                overflow: "hidden",
+                borderRadius: 15,
+                alignItems: "center",
+                marginBottom: 10,
+                backgroundColor: theme ? textColor : Colors.constants.blue,
+              }}
+              textStyles={{
+                color: backgroundColor,
+                opacity: 1,
+              }}
+              textContent={t(
+                "contacts.internalComponents.contactsTransactions.send"
+              )}
+            />
+
+            <CustomButton
+              useLoading={isLoading.declineBTN}
+              loadingColor={theme ? textColor : Colors.constants.blue}
+              actionFunction={() => {
+                updatePaymentStatus(transaction, true, false);
+              }}
+              buttonStyles={{
+                width: "100%",
+                maxWidth: "unset",
+                overflow: "hidden",
+                borderRadius: 15,
+                alignItems: "center",
+                borderWidth: 1,
+                borderColor: theme ? textColor : Colors.constants.blue,
+                backgroundColor: "transparent",
+              }}
+              textStyles={{
+                color: theme ? textColor : Colors.constants.blue,
+              }}
+              textContent={t("constants.decline")}
+            />
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/src/pages/contacts/internalComponents/giftCardTxItem/giftCardTxItem.css b/src/pages/contacts/internalComponents/giftCardTxItem/giftCardTxItem.css
new file mode 100644
index 0000000..4e5b25f
--- /dev/null
+++ b/src/pages/contacts/internalComponents/giftCardTxItem/giftCardTxItem.css
@@ -0,0 +1,52 @@
+/* Gift Card Transaction Container */
+.gift-card-transaction-container {
+  width: 95%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding: 12.5px 0;
+  margin: 0 auto;
+  background: none;
+  border: none;
+  cursor: pointer;
+  text-align: left;
+  transition: opacity 0.2s ease;
+}
+
+.gift-card-transaction-container:hover:not(:disabled) {
+  opacity: 0.9;
+}
+
+.gift-card-transaction-container:disabled {
+  cursor: default;
+}
+
+/* Gift Card Logo Container */
+.gift-card-logo-container {
+  width: 50px;
+  height: 50px;
+  aspect-ratio: 1;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 12px;
+  padding: 6px;
+  overflow: visible;
+  margin-right: 15px;
+  position: relative;
+}
+
+.gift-card-logo {
+  width: 100%;
+  height: 100%;
+  border-radius: 8px;
+  object-fit: contain;
+}
+
+/* Gift Card Content */
+.gift-card-content {
+  width: 100%;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+}
diff --git a/src/pages/contacts/internalComponents/giftCardTxItem/giftCardTxItem.jsx b/src/pages/contacts/internalComponents/giftCardTxItem/giftCardTxItem.jsx
new file mode 100644
index 0000000..595000f
--- /dev/null
+++ b/src/pages/contacts/internalComponents/giftCardTxItem/giftCardTxItem.jsx
@@ -0,0 +1,122 @@
+import FormattedSatText from "../../../../components/formattedSatText/formattedSatText";
+import ThemeText from "../../../../components/themeText/themeText";
+import { Colors } from "../../../../constants/theme";
+import "./giftCardTxItem.css";
+
+export default function GiftCardTxItem({
+  txParsed,
+  isOutgoingPayment,
+  theme,
+  darkModeType,
+  backgroundOffset,
+  textColor,
+  t,
+  timeDifference,
+  isFromProfile,
+  navigate,
+  masterInfoObject,
+}) {
+  const giftCardName = txParsed.giftCardInfo?.name;
+
+  const handleClick = () => {
+    if (isFromProfile || !navigate) return;
+
+    navigate("/modal", {
+      state: {
+        wantedContent: "viewContactsGiftInfo",
+        giftCardInfo: txParsed.giftCardInfo,
+        message: txParsed.description,
+        from: "txItem",
+        sliderHeight: 1,
+        isOutgoingPayment,
+      },
+    });
+  };
+
+  return (
+    <button
+      disabled={isFromProfile}
+      onClick={handleClick}
+      className="gift-card-transaction-container"
+    >
+      {/* Gift Card Logo with subtle styling */}
+      <div
+        className="gift-card-logo-container"
+        style={{
+          backgroundColor: theme
+            ? backgroundOffset
+            : Colors.constants.opacityGracy,
+          borderWidth: theme ? 0.5 : 2,
+          borderColor: backgroundOffset,
+          borderStyle: "solid",
+        }}
+      >
+        <img
+          className="gift-card-logo"
+          src={txParsed.giftCardInfo.logo}
+          alt={giftCardName}
+        />
+      </div>
+
+      <div className="gift-card-content">
+        {/* Gift card name with subtle emphasis */}
+        <ThemeText
+          CustomEllipsizeMode={"tail"}
+          CustomNumberOfLines={1}
+          textStyles={{
+            margin: 0,
+            marginRight: 15,
+          }}
+          textContent={giftCardName}
+        />
+
+        {/* Transaction type with gift card context */}
+        <ThemeText
+          CustomEllipsizeMode={"tail"}
+          CustomNumberOfLines={1}
+          textStyles={{
+            fontSize: "0.8em",
+            opacity: 0.8,
+            margin: 0,
+          }}
+          textContent={
+            isOutgoingPayment
+              ? `${t("transactionLabelText.sent")} • ${t(
+                  "contacts.internalComponents.viewAllGiftCards.cardNamePlaceH"
+                )}`
+              : `${t("transactionLabelText.received")} • ${t(
+                  "contacts.internalComponents.viewAllGiftCards.cardNamePlaceH"
+                )}`
+          }
+        />
+        <ThemeText
+          textStyles={{
+            fontSize: "0.8em",
+            fontWeight: 300,
+            opacity: 0.7,
+            margin: 0,
+          }}
+          textContent={timeDifference}
+        />
+      </div>
+
+      <FormattedSatText
+        frontText={
+          masterInfoObject.userBalanceDenomination === "hidden"
+            ? ""
+            : isOutgoingPayment
+            ? "-"
+            : "+"
+        }
+        containerStyles={{
+          marginBottom: "auto",
+        }}
+        styles={{
+          fontWeight: 400,
+        }}
+        balance={txParsed.amountMsat}
+        useMillionDenomination={true}
+      />
+    </button>
+  );
+}
diff --git a/src/pages/contacts/screens/editMyProfilePage/editMyProfilePage.jsx b/src/pages/contacts/screens/editMyProfilePage/editMyProfilePage.jsx
index 4ae4514..9f6bbec 100644
--- a/src/pages/contacts/screens/editMyProfilePage/editMyProfilePage.jsx
+++ b/src/pages/contacts/screens/editMyProfilePage/editMyProfilePage.jsx
@@ -10,33 +10,39 @@ import ThemeText from "../../../../components/themeText/themeText";
 import CustomButton from "../../../../components/customButton/customButton";
 import { isValidUniqueName } from "../../../../../db";
 import { encryptMessage } from "../../../../functions/encodingAndDecoding";
-import {
-  deleteDatabaseImage,
-  setDatabaseIMG,
-} from "../../../../../db/photoStorage";
 import "./style.css";
 import ContactProfileImage from "../../components/profileImage/profileImage";
 import { Colors } from "../../../../constants/theme";
-import CustomInput from "../../../../components/customInput/customInput";
 import { VALID_USERNAME_REGEX } from "../../../../constants";
 import { useThemeContext } from "../../../../contexts/themeContext";
 import useThemeColors from "../../../../hooks/useThemeColors";
-import { ImagesIconDark, xSmallIconBlack } from "../../../../constants/icons";
+import { useOverlay } from "../../../../contexts/overlayContext";
+import CustomSettingsNavbar from "../../../../components/customSettingsNavbar";
+import { Image, Trash, X } from "lucide-react";
+import SafeAreaComponent from "../../../../components/safeAreaContainer";
+import { useProfileImage } from "../../utils/useProfileImage";
+import { EditProfileTextInput } from "../../components/EditProfileTextInput/EditProfileTextInput";
+import { areImagesSame } from "../../utils/imageComparison";
 
-export default function EditMyProfilePage({ navProps, openOverlay }) {
+export default function EditMyProfilePage({ navProps }) {
+  const { openOverlay } = useOverlay();
   const navigate = useNavigate();
   const {
     decodedAddedContacts,
     toggleGlobalContactsInformation,
     globalContactsInformation,
+    deleteContact,
   } = useGlobalContacts();
-
+  const { t } = useTranslation();
   const location = useLocation();
 
+  const queryParams = new URLSearchParams(location.search);
+  const wantsToDeleteAccount = queryParams.get("confirmed");
+
   const props = { ...location.state, ...navProps };
   const pageType = props?.pageType || props.route?.params?.pageType;
   const fromSettings = props.fromSettings || props.route?.params?.fromSettings;
-
+  const hideProfileImage = props?.hideProfileImage;
   const isEditingMyProfile = pageType.toLowerCase() === "myprofile";
   const providedContact =
     !isEditingMyProfile &&
@@ -44,61 +50,211 @@ export default function EditMyProfilePage({ navProps, openOverlay }) {
   const myContact = globalContactsInformation.myProfile;
   const isFirstTimeEditing = myContact?.didEditProfile;
 
+  console.log(
+    fromSettings,
+    "tesing",
+    t("contacts.editMyProfilePage.navTitle"),
+    props
+  );
+
   const selectedAddedContact = props.fromInitialAdd
     ? providedContact
     : decodedAddedContacts.find(
         (contact) => contact.uuid === providedContact?.uuid
       );
+  console.log(props.fromInitialAdd, selectedAddedContact, providedContact);
 
-  return (
-    <div id="editMyProfile">
-      {!fromSettings && (
-        <div className="pageNavBar">
-          <BackArrow
-            backFunction={() => {
-              if (!isFirstTimeEditing) {
-                toggleGlobalContactsInformation(
-                  {
-                    myProfile: {
-                      ...globalContactsInformation.myProfile,
-                      didEditProfile: true,
-                    },
-                    addedContacts: globalContactsInformation.addedContacts,
-                  },
-                  true
-                );
-              }
-              navigate(-1);
-            }}
-          />
-          <p>{fromSettings ? "Edit Profile" : ""}</p>
-        </div>
-      )}
+  useEffect(() => {
+    if (!props.confirmed) return;
+    deleteContact(selectedAddedContact);
+    navigate("/contacts");
+  }, [props]);
+
+  if (hideProfileImage) {
+    return (
       <InnerContent
         isEditingMyProfile={isEditingMyProfile}
         selectedAddedContact={selectedAddedContact}
         fromInitialAdd={props.fromInitialAdd}
         fromSettings={fromSettings}
-        openOverlay={openOverlay}
+        hideProfileImage={true}
       />
-    </div>
+    );
+  }
+
+  return (
+    <SafeAreaComponent
+      customStyles={{
+        padding: fromSettings ? "20px 0" : 0,
+        width: fromSettings ? "95%" : "100%",
+      }}
+    >
+      <div id="editMyProfile">
+        <CustomSettingsNavbar
+          shouldDismissKeyboard={true}
+          text={fromSettings ? t("contacts.editMyProfilePage.navTitle") : ""}
+          customBackFunction={() => {
+            if (!isFirstTimeEditing) {
+              toggleGlobalContactsInformation(
+                {
+                  myProfile: {
+                    ...globalContactsInformation.myProfile,
+                    didEditProfile: true,
+                  },
+                  addedContacts: globalContactsInformation.addedContacts,
+                },
+                true
+              );
+            }
+            navigate(-1);
+          }}
+          LeftImageIcon={Trash}
+          leftImageFunction={() =>
+            openOverlay({
+              for: "confirm-action",
+              confirmHeader: t("contacts.editMyProfilePage.deleateWarning"),
+              fromRoute: "edit-profile",
+              useProps: true,
+              useCustomProps: true,
+              customProps: { ...props, confirmed: true },
+            })
+          }
+          leftImageStyles={{ height: 25, width: "unset", aspectRatio: 1 }}
+          showLeftImage={!isEditingMyProfile}
+        />
+        <InnerContent
+          isEditingMyProfile={isEditingMyProfile}
+          selectedAddedContact={selectedAddedContact}
+          fromInitialAdd={props.fromInitialAdd}
+          fromSettings={fromSettings}
+          openOverlay={openOverlay}
+        />
+      </div>
+    </SafeAreaComponent>
   );
 }
 
-function InnerContent({
+function ProfileInputFields({
+  inputs,
+  changeInputText,
+  setIsKeyboardActive,
+  nameRef,
+  uniquenameRef,
+  bioRef,
+  receiveAddressRef,
   isEditingMyProfile,
   selectedAddedContact,
+  myContact,
+  theme,
+  darkModeType,
+  textInputColor,
+  textInputBackground,
+  textColor,
+  navigate,
+  t,
+}) {
+  const { openOverlay } = useOverlay();
+  return (
+    <>
+      <EditProfileTextInput
+        label={t("contacts.editMyProfilePage.nameInputDesc")}
+        placeholder={t("contacts.editMyProfilePage.nameInputPlaceholder")}
+        value={inputs?.name}
+        onChangeText={(text) => changeInputText(text, "name")}
+        onFocus={() => setIsKeyboardActive(true)}
+        onBlur={() => setIsKeyboardActive(false)}
+        inputRef={nameRef}
+        maxLength={30}
+        theme={theme}
+        darkModeType={darkModeType}
+        textInputColor={textInputColor}
+        textInputBackground={textInputBackground}
+        textColor={textColor}
+      />
+
+      {selectedAddedContact?.isLNURL && (
+        <EditProfileTextInput
+          label={t("contacts.editMyProfilePage.lnurlInputDesc")}
+          placeholder={t("contacts.editMyProfilePage.lnurlInputPlaceholder")}
+          value={inputs?.receiveAddress}
+          onChangeText={(text) => changeInputText(text, "receiveAddress")}
+          onFocus={() => setIsKeyboardActive(true)}
+          onBlur={() => setIsKeyboardActive(false)}
+          inputRef={receiveAddressRef}
+          maxLength={200}
+          multiline={false}
+          minHeight={60}
+          theme={theme}
+          darkModeType={darkModeType}
+          textInputColor={textInputColor}
+          textInputBackground={textInputBackground}
+          textColor={textColor}
+        />
+      )}
+
+      {isEditingMyProfile && (
+        <EditProfileTextInput
+          label={t("contacts.editMyProfilePage.uniqueNameInputDesc")}
+          placeholder={myContact?.uniqueName}
+          value={inputs.uniquename}
+          onChangeText={(text) => changeInputText(text, "uniquename")}
+          onFocus={() => setIsKeyboardActive(true)}
+          onBlur={() => setIsKeyboardActive(false)}
+          inputRef={uniquenameRef}
+          maxLength={30}
+          theme={theme}
+          darkModeType={darkModeType}
+          textInputColor={textInputColor}
+          textInputBackground={textInputBackground}
+          textColor={textColor}
+          showInfoIcon={true}
+          onInfoPress={() =>
+            openOverlay({
+              for: "informationPopup",
+              textContent: t(
+                "wallet.receivePages.editLNURLContact.informationMessage"
+              ),
+              buttonText: t("constants.understandText"),
+            })
+          }
+        />
+      )}
+
+      <EditProfileTextInput
+        label={t("contacts.editMyProfilePage.bioInputDesc")}
+        placeholder={t("contacts.editMyProfilePage.bioInputPlaceholder")}
+        value={inputs?.bio}
+        onChangeText={(text) => changeInputText(text, "bio")}
+        onFocus={() => setIsKeyboardActive(true)}
+        onBlur={() => setIsKeyboardActive(false)}
+        inputRef={bioRef}
+        maxLength={150}
+        multiline={true}
+        minHeight={60}
+        maxHeight={100}
+        theme={theme}
+        darkModeType={darkModeType}
+        textInputColor={textInputColor}
+        textInputBackground={textInputBackground}
+        textColor={textColor}
+        containerStyle={{ marginBottom: 10 }}
+      />
+    </>
+  );
+}
+
+function InnerContent({
+  isEditingMyProfile,
+  selectedAddedContact = {},
   fromInitialAdd,
   fromSettings,
   openOverlay,
+  hideProfileImage,
 }) {
-  const location = useLocation();
+  const navigate = useNavigate();
   const { contactsPrivateKey, publicKey } = useKeysContext();
-  //   const { theme, darkModeType } = useGlobalThemeContext();
-  const { cache, refreshCache, removeProfileImageFromCache } = useImageCache();
-  //   const { backgroundOffset, textInputColor, textInputBackground, textColor } =
-  //     GetThemeColors();
   const { theme, darkModeType } = useThemeContext();
+  const { cache, refreshCacheObject } = useImageCache();
   const { backgroundOffset, textInputColor, textInputBackground, textColor } =
     useThemeColors();
   const {
@@ -107,33 +263,57 @@ function InnerContent({
     toggleGlobalContactsInformation,
   } = useGlobalContacts();
   const { t } = useTranslation();
-  const [isAddingImage, setIsAddingImage] = useState(false);
+  const {
+    isAddingImage,
+    deleteProfilePicture,
+    getProfileImage,
+    saveProfileImage,
+  } = useProfileImage();
 
   const nameRef = useRef(null);
   const uniquenameRef = useRef(null);
   const bioRef = useRef(null);
   const receiveAddressRef = useRef(null);
+  const didCallImagePicker = useRef(null);
   const myContact = globalContactsInformation.myProfile;
 
-  const myContactName = myContact?.name;
-  const myContactBio = myContact?.bio;
-  const myContactUniqueName = myContact?.uniqueName;
+  const myContactName = myContact?.name || "";
+  const myContactBio = myContact?.bio || "";
+  const myContactUniqueName = myContact?.uniqueName || "";
   const isFirstTimeEditing = myContact?.didEditProfile;
 
-  const selectedAddedContactName = selectedAddedContact?.name;
-  const selectedAddedContactBio = selectedAddedContact?.bio;
-  const selectedAddedContactUniqueName = selectedAddedContact?.uniqueName;
+  const selectedAddedContactName = selectedAddedContact?.name || "";
+  const selectedAddedContactBio = selectedAddedContact?.bio || "";
+  const selectedAddedContactUniqueName = selectedAddedContact?.uniqueName || "";
   const selectedAddedContactReceiveAddress =
-    selectedAddedContact?.receiveAddress;
+    selectedAddedContact?.receiveAddress || "";
 
-  const [inputs, setInputs] = useState({
-    name: "",
-    bio: "",
-    uniquename: "",
-    receiveAddress: "",
-  });
+  const [isSaving, setIsSaving] = useState(false);
+  const [inputs, setInputs] = useState(() => ({
+    name: isFirstTimeEditing
+      ? isEditingMyProfile
+        ? myContactName || ""
+        : selectedAddedContactName || ""
+      : "",
+    bio: isFirstTimeEditing
+      ? isEditingMyProfile
+        ? myContactBio || ""
+        : selectedAddedContactBio || ""
+      : "",
+    uniquename: isFirstTimeEditing
+      ? isEditingMyProfile
+        ? myContactUniqueName || ""
+        : selectedAddedContactUniqueName || ""
+      : "",
+    receiveAddress: selectedAddedContactReceiveAddress || "",
+  }));
 
-  const navigate = useNavigate();
+  const [tempImage, setTempImage] = useState({
+    uri: null,
+    comparison: null,
+    updated: 0,
+    shouldDelete: false,
+  });
 
   function changeInputText(text, type) {
     setInputs((prev) => {
@@ -141,73 +321,127 @@ function InnerContent({
     });
   }
 
-  useEffect(() => {
-    changeInputText(
-      isFirstTimeEditing
-        ? isEditingMyProfile
-          ? myContactName || ""
-          : selectedAddedContactName || ""
-        : "",
-      "name"
-    );
-    changeInputText(
-      isFirstTimeEditing
-        ? isEditingMyProfile
-          ? myContactBio || ""
-          : selectedAddedContactBio || ""
-        : "",
-      "bio"
-    );
-    changeInputText(
-      isFirstTimeEditing
-        ? isEditingMyProfile
-          ? myContactUniqueName || ""
-          : selectedAddedContactUniqueName || ""
-        : "",
-      "uniquename"
-    );
-    changeInputText(selectedAddedContactReceiveAddress || "", "receiveAddress");
-  }, [
-    isEditingMyProfile,
-    myContactName,
-    myContactBio,
-    myContactUniqueName,
-    selectedAddedContactName,
-    selectedAddedContactBio,
-    selectedAddedContactUniqueName,
-  ]);
-
   const myProfileImage = cache[myContact?.uuid];
   const selectedAddedContactImage = cache[selectedAddedContact?.uuid];
-  const hasImage = isEditingMyProfile
+  const hasImage = tempImage.shouldDelete
+    ? false
+    : tempImage.uri
+    ? true
+    : isEditingMyProfile
     ? !!myProfileImage?.localUri
     : !!selectedAddedContactImage?.localUri;
 
+  const hasChangedInfo = isEditingMyProfile
+    ? myContactName !== inputs.name ||
+      myContactBio !== inputs.bio ||
+      myContactUniqueName !== inputs.uniquename ||
+      tempImage.uri ||
+      tempImage.shouldDelete
+    : selectedAddedContactName !== inputs.name ||
+      selectedAddedContactBio !== inputs.bio ||
+      selectedAddedContactUniqueName !== inputs.uniquename ||
+      selectedAddedContactReceiveAddress !== inputs.receiveAddress ||
+      fromInitialAdd ||
+      tempImage.uri ||
+      tempImage.shouldDelete;
+
+  const handleDeleteProfilePicture = () => {
+    setTempImage({
+      uri: null,
+      comparison: null,
+      updated: 0,
+      shouldDelete: true,
+    });
+  };
+
+  const addProfilePicture = async () => {
+    if (didCallImagePicker.current) return;
+    didCallImagePicker.current = true;
+    const response = await getProfileImage();
+    if (response?.imgURL && response?.comparison) {
+      setTempImage({
+        comparison: response?.comparison,
+        uri: response?.imgURL,
+        updated: Date.now(),
+      });
+    }
+    didCallImagePicker.current = false;
+  };
+
+  useEffect(() => {
+    if (!fromInitialAdd) return;
+    if (hasImage) return;
+    // Making sure to update UI for new contacts image
+    refreshCacheObject();
+  }, []);
+
+  const inputFieldsProps = {
+    inputs,
+    changeInputText,
+    nameRef,
+    uniquenameRef,
+    bioRef,
+    receiveAddressRef,
+    isEditingMyProfile,
+    selectedAddedContact,
+    myContact,
+    theme,
+    darkModeType,
+    textInputColor,
+    textInputBackground,
+    textColor,
+    navigate,
+    t,
+  };
+
+  if (hideProfileImage) {
+    return (
+      <>
+        <div>
+          <ProfileInputFields {...inputFieldsProps} />
+        </div>
+        <CustomButton
+          buttonStyles={{
+            width: "auto",
+            marginTop: 10,
+          }}
+          useLoading={isSaving}
+          actionFunction={saveChanges}
+          textContent={
+            hasChangedInfo
+              ? fromInitialAdd
+                ? t("contacts.editMyProfilePage.addContactBTN")
+                : t("constants.save")
+              : t("constants.back")
+          }
+        />
+      </>
+    );
+  }
+
   return (
-    <div className="editProfileInnerContainer">
+    <div
+      className="editProfileInnerContainer"
+      style={{
+        width: fromSettings ? "90%" : "100%",
+        marginTop: fromSettings ? "0" : "15px",
+      }}
+    >
       <div
-        style={{ paddingTop: fromSettings ? 40 : 0 }}
+        style={{ paddingTop: fromSettings ? 30 : 0 }}
         className="editProfileScrollContainer"
       >
         <div
           className="profileImageContainer"
           onClick={() => {
-            openOverlay({
-              for: "error",
-              errorMessage: "Feature coming soon...",
-            });
-            return;
             if (!isEditingMyProfile && !selectedAddedContact.isLNURL) return;
             if (isAddingImage) return;
             if (!hasImage) {
-              addProfilePicture();
+              addProfilePicture(isEditingMyProfile, selectedAddedContact);
               return;
+            } else {
+              handleDeleteProfilePicture();
             }
-            navigate("AddOrDeleteContactImage", {
-              addPhoto: addProfilePicture,
-              deletePhoto: deleteProfilePicture,
-              hasImage: hasImage,
-            });
           }}
         >
           <div
@@ -219,12 +453,20 @@ function InnerContent({
             ) : (
               <ContactProfileImage
                 updated={
-                  isEditingMyProfile
+                  tempImage.shouldDelete
+                    ? null
+                    : tempImage.uri
+                    ? tempImage.comparison?.updated
+                    : isEditingMyProfile
                     ? myProfileImage?.updated
                     : selectedAddedContactImage?.updated
                 }
                 uri={
-                  isEditingMyProfile
+                  tempImage.shouldDelete
+                    ? null
+                    : tempImage.uri
+                    ? tempImage.comparison?.uri
+                    : isEditingMyProfile
                     ? myProfileImage?.localUri
                     : selectedAddedContactImage?.localUri
                 }
@@ -238,158 +480,12 @@ function InnerContent({
               className="selectFromPhotoesImage"
               style={{ backgroundColor: Colors.dark.text }}
             >
-              <img
-                src={hasImage ? xSmallIconBlack : ImagesIconDark}
-                alt=""
-                srcset=""
-              />
+              {hasImage ? <X size={17} /> : <Image size={17} />}
             </div>
           )}
         </div>
 
-        <div
-          className="textInputContainer"
-          onPress={() => {
-            nameRef.current.focus();
-          }}
-        >
-          <ThemeText textContent={"Name"} />
-          <CustomInput
-            containerClassName={"editPageContainer"}
-            onchange={(data) => {
-              changeInputText(data, "name");
-            }}
-            value={inputs.name || ""}
-            placeholder={"Name..."}
-            customInputStyles={{
-              color:
-                inputs.name.length < 30
-                  ? Colors.light.text
-                  : Colors.constants.cancelRed,
-            }}
-          />
-          <ThemeText
-            textStyles={{
-              textAlign: "right",
-              color:
-                inputs.name.length < 30
-                  ? textColor
-                  : Colors.constants.cancelRed,
-              marginTop: 20,
-              marginBottom: 0,
-            }}
-            textContent={`${inputs.name.length} / ${30}`}
-          />
-        </div>
-        {selectedAddedContact?.isLNURL && (
-          <div
-            className="textInputContianer"
-            onPress={() => {
-              receiveAddressRef.current.focus();
-            }}
-          >
-            <ThemeText textContent={"Lnurl"} />
-            <CustomInput
-              containerClassName={"editPageContainer"}
-              onchange={(data) => {
-                changeInputText(data, "receiveAddress");
-              }}
-              value={inputs.receiveAddress || ""}
-              placeholder={"LNURL..."}
-              customInputStyles={{
-                color:
-                  inputs.receiveAddress.length < 60
-                    ? Colors.light.text
-                    : Colors.constants.cancelRed,
-              }}
-            />
-            <ThemeText
-              styles={{
-                textAlign: "right",
-                color:
-                  inputs.receiveAddress.length < 60
-                    ? textColor
-                    : Colors.constants.cancelRed,
-                marginTop: 20,
-                marginBottom: 0,
-              }}
-              content={`${inputs.receiveAddress.length} / ${60}`}
-            />
-          </div>
-        )}
-        {isEditingMyProfile && (
-          <div
-            className="textInputContainer"
-            // style={styles.textInputContainer}
-            // activeOpacity={1}
-            onPress={() => {
-              uniquenameRef.current.focus();
-            }}
-          >
-            <ThemeText textContent={"Username"} />
-            <CustomInput
-              containerClassName={"editPageContainer"}
-              onchange={(data) => {
-                changeInputText(data, "uniquename");
-              }}
-              value={inputs.uniquename || ""}
-              placeholder={myContact.uniqueName}
-              customInputStyles={{
-                color:
-                  inputs.uniquename.length < 30
-                    ? Colors.light.text
-                    : Colors.constants.cancelRed,
-              }}
-            />
-            <ThemeText
-              textStyles={{
-                textAlign: "right",
-                color:
-                  inputs.uniquename.length < 30
-                    ? textColor
-                    : Colors.constants.cancelRed,
-                marginTop: 20,
-                marginBottom: 0,
-              }}
-              textContent={`${inputs.uniquename.length} / ${30}`}
-            />
-          </div>
-        )}
-        <div
-          className="textInputContainer"
-          onPress={() => {
-            bioRef.current.focus();
-          }}
-        >
-          <ThemeText textContent={"Bio"} />
-          <CustomInput
-            containerClassName={"editPageContainer"}
-            onchange={(data) => {
-              changeInputText(data, "bio");
-            }}
-            value={inputs.bio || ""}
-            placeholder={"Bio..."}
-            customInputStyles={{
-              color:
-                inputs.bio.length < 150
-                  ? Colors.light.text
-                  : Colors.constants.cancelRed,
-              maxHeight: "100px",
-            }}
-            multiline={true}
-          />
-
-          <ThemeText
-            textStyles={{
-              textAlign: "right",
-              color:
-                inputs.bio.length < 150
-                  ? textColor
-                  : Colors.constants.cancelRed,
-            }}
-            textContent={`${inputs.bio.length} / ${150}`}
-          />
-        </div>
+        <ProfileInputFields {...inputFieldsProps} />
       </div>
 
       <CustomButton
@@ -398,267 +494,210 @@ function InnerContent({
           margin: "10px auto 0",
         }}
         actionFunction={saveChanges}
-        textContent={fromInitialAdd ? "Save" : "Save"}
+        textContent={
+          hasChangedInfo
+            ? fromInitialAdd
+              ? t("contacts.editMyProfilePage.addContactBTN")
+              : t("constants.save")
+            : t("constants.back")
+        }
       />
     </div>
   );
   async function saveChanges() {
-    if (
-      inputs.name.length > 30 ||
-      inputs.bio.length > 150 ||
-      inputs.uniquename.length > 30 ||
-      (selectedAddedContact?.isLNURL && inputs.receiveAddress.length > 100)
-    )
-      return;
-
-    const uniqueName =
-      isEditingMyProfile && !isFirstTimeEditing
-        ? inputs.uniquename || myContact.uniqueName
-        : inputs.uniquename;
-
-    if (isEditingMyProfile) {
+    try {
       if (
-        myContact?.bio === inputs.bio &&
-        myContact?.name === inputs.name &&
-        myContact?.uniqueName === inputs.uniquename &&
-        isFirstTimeEditing
-      ) {
-        navigate(-1);
-      } else {
-        console.log(uniqueName, "testing");
-        if (!VALID_USERNAME_REGEX.test(uniqueName)) {
-          openOverlay({
-            for: "error",
-            errorMessage:
-              "You can only have letters, numbers, or underscores in your username, and must contain at least 1 letter.",
-          });
-          return;
-        }
+        inputs.name.length >= 30 ||
+        inputs.bio.length >= 150 ||
+        inputs.uniquename.length >= 30 ||
+        (selectedAddedContact?.isLNURL &&
+          inputs.receiveAddress.length >= 200) ||
+        isAddingImage
+      )
+        return;
+      setIsSaving(true);
+
+      console.log(tempImage, selectedAddedContact, isEditingMyProfile);
 
-        if (myContact?.uniqueName != uniqueName) {
-          const isFreeUniqueName = await isValidUniqueName(
-            "blitzWalletUsers",
-            inputs.uniquename.trim()
+      if (tempImage.shouldDelete) {
+        await deleteProfilePicture(isEditingMyProfile, selectedAddedContact);
+      } else if (tempImage.uri && tempImage.comparison) {
+        const areImagesTheSame = await areImagesSame(
+          tempImage.imgURL?.uri,
+          isEditingMyProfile
+            ? myProfileImage?.localUri
+            : selectedAddedContactImage?.localUri
+        );
+
+        if (!areImagesTheSame) {
+          await saveProfileImage(
+            tempImage,
+            isEditingMyProfile,
+            selectedAddedContact
           );
-          if (!isFreeUniqueName) {
+        }
+      }
+
+      const uniqueName =
+        isEditingMyProfile && !isFirstTimeEditing
+          ? inputs.uniquename || myContact.uniqueName
+          : inputs.uniquename;
+
+      if (isEditingMyProfile) {
+        if (
+          myContact?.bio === inputs.bio &&
+          myContact?.name === inputs.name &&
+          myContact?.uniqueName === inputs.uniquename &&
+          isFirstTimeEditing
+        ) {
+          navigate(-1);
+        } else {
+          console.log(uniqueName, "testing");
+          if (!VALID_USERNAME_REGEX.test(uniqueName)) {
             openOverlay({
               for: "error",
-              errorMessage: "Username already taken, try again!",
+              errorMessage: t(
+                "contacts.editMyProfilePage.unqiueNameRegexError"
+              ),
             });
             return;
           }
-        }
-        toggleGlobalContactsInformation(
-          {
-            myProfile: {
-              ...globalContactsInformation.myProfile,
-              name: inputs.name.trim(),
-              nameLower: inputs.name.trim().toLowerCase(),
-              bio: inputs.bio,
-              uniqueName: uniqueName.trim(),
-              uniqueNameLower: uniqueName.trim().toLowerCase(),
-              didEditProfile: true,
-            },
-            addedContacts: globalContactsInformation.addedContacts,
-            // unaddedContacts:
-            //   globalContactsInformation.unaddedContacts,
-          },
-          true
-        );
-        navigate(-1);
-      }
-    } else {
-      if (fromInitialAdd) {
-        let tempContact = JSON.parse(JSON.stringify(selectedAddedContact));
-        tempContact.name = inputs.name.trim();
-        tempContact.nameLower = inputs.name.trim().toLowerCase();
-        tempContact.bio = inputs.bio;
-        if (selectedAddedContact.isLNURL) {
-          tempContact.receiveAddress = inputs.receiveAddress;
-        }
 
-        let newAddedContacts = JSON.parse(JSON.stringify(decodedAddedContacts));
-        const isContactInAddedContacts = newAddedContacts.filter(
-          (addedContact) => addedContact.uuid === tempContact.uuid
-        ).length;
-
-        if (isContactInAddedContacts) {
-          newAddedContacts = newAddedContacts.map((addedContact) => {
-            if (addedContact.uuid === tempContact.uuid) {
-              return {
-                ...addedContact,
-                name: inputs.name,
-                nameLower: inputs.name.toLowerCase(),
+          if (myContact?.uniqueName != uniqueName) {
+            const isFreeUniqueName = await isValidUniqueName(
+              "blitzWalletUsers",
+              inputs.uniquename.trim()
+            );
+            if (!isFreeUniqueName) {
+              openOverlay({
+                for: "error",
+                errorMessage: t(
+                  "contacts.editMyProfilePage.usernameAlreadyExistsError"
+                ),
+              });
+              return;
+            }
+          }
+          toggleGlobalContactsInformation(
+            {
+              myProfile: {
+                ...globalContactsInformation.myProfile,
+                name: inputs.name.trim(),
+                nameLower: inputs.name.trim().toLowerCase(),
                 bio: inputs.bio,
-                unlookedTransactions: 0,
-                isAdded: true,
-              };
-            } else return addedContact;
-          });
-        } else newAddedContacts.push(tempContact);
-
-        toggleGlobalContactsInformation(
-          {
-            myProfile: {
-              ...globalContactsInformation.myProfile,
+                uniqueName: uniqueName.trim(),
+                uniqueNameLower: uniqueName.trim().toLowerCase(),
+                didEditProfile: true,
+              },
+              addedContacts: globalContactsInformation.addedContacts,
             },
-            addedContacts: encryptMessage(
-              contactsPrivateKey,
-              publicKey,
-              JSON.stringify(newAddedContacts)
-            ),
-            // unaddedContacts:
-            //   globalContactsInformation.unaddedContacts,
-          },
-          true
-        );
+            true
+          );
+          navigate(-1);
+        }
+      } else {
+        if (fromInitialAdd) {
+          let tempContact = JSON.parse(JSON.stringify(selectedAddedContact));
+          tempContact.name = inputs.name.trim();
+          tempContact.nameLower = inputs.name.trim().toLowerCase();
+          tempContact.bio = inputs.bio;
+          tempContact.isAdded = true;
+          tempContact.unlookedTransactions = 0;
+          if (selectedAddedContact.isLNURL) {
+            tempContact.receiveAddress = inputs.receiveAddress;
+          }
 
-        return;
-      }
-      if (
-        selectedAddedContact?.bio === inputs.bio &&
-        selectedAddedContact?.name === inputs.name &&
-        selectedAddedContact?.receiveAddress === inputs.receiveAddress
-      )
-        navigate(-1);
-      else {
-        let newAddedContacts = [...decodedAddedContacts];
-        const indexOfContact = decodedAddedContacts.findIndex(
-          (obj) => obj.uuid === selectedAddedContact.uuid
-        );
+          let newAddedContacts = JSON.parse(
+            JSON.stringify(decodedAddedContacts)
+          );
+          const isContactInAddedContacts = newAddedContacts.filter(
+            (addedContact) => addedContact.uuid === tempContact.uuid
+          ).length;
 
-        let contact = newAddedContacts[indexOfContact];
+          if (isContactInAddedContacts) {
+            newAddedContacts = newAddedContacts.map((addedContact) => {
+              if (addedContact.uuid === tempContact.uuid) {
+                return {
+                  ...addedContact,
+                  name: tempContact.name,
+                  nameLower: tempContact.nameLower,
+                  bio: tempContact.bio,
+                  unlookedTransactions: 0,
+                  isAdded: true,
+                };
+              } else return addedContact;
+            });
+          } else newAddedContacts.push(tempContact);
 
-        contact["name"] = inputs.name.trim();
-        contact["nameLower"] = inputs.name.trim().toLowerCase();
-        contact["bio"] = inputs.bio.trim();
-        if (
-          selectedAddedContact.isLNURL &&
-          selectedAddedContact?.receiveAddress !== inputs.receiveAddress
-        ) {
-          contact["receiveAddress"] = inputs.receiveAddress.trim();
+          toggleGlobalContactsInformation(
+            {
+              myProfile: {
+                ...globalContactsInformation.myProfile,
+              },
+              addedContacts: await encryptMessage(
+                contactsPrivateKey,
+                publicKey,
+                JSON.stringify(newAddedContacts)
+              ),
+              // unaddedContacts:
+              //   globalContactsInformation.unaddedContacts,
+            },
+            true
+          );
+
+          return;
         }
+        if (
+          selectedAddedContact?.bio === inputs.bio &&
+          selectedAddedContact?.name === inputs.name &&
+          selectedAddedContact?.receiveAddress === inputs.receiveAddress
+        )
+          navigate(-1);
+        else {
+          let newAddedContacts = [...decodedAddedContacts];
+          console.log(selectedAddedContact);
+          const indexOfContact = decodedAddedContacts.findIndex(
+            (obj) => obj.uuid === selectedAddedContact.uuid
+          );
+          console.log(indexOfContact);
+          console.log("testing");
 
-        toggleGlobalContactsInformation(
-          {
-            myProfile: {
-              ...globalContactsInformation.myProfile,
+          let contact = newAddedContacts[indexOfContact];
+          console.log(contact);
+
+          contact["name"] = inputs.name.trim();
+          contact["nameLower"] = inputs.name.trim().toLowerCase();
+          contact["bio"] = inputs.bio.trim();
+
+          console.log(contact);
+
+          if (
+            selectedAddedContact.isLNURL &&
+            selectedAddedContact?.receiveAddress !== inputs.receiveAddress
+          ) {
+            contact["receiveAddress"] = inputs.receiveAddress.trim();
+          }
+
+          toggleGlobalContactsInformation(
+            {
+              myProfile: {
+                ...globalContactsInformation.myProfile,
+              },
+              addedContacts: await encryptMessage(
+                contactsPrivateKey,
+                publicKey,
+                JSON.stringify(newAddedContacts)
+              ),
             },
-            addedContacts: encryptMessage(
-              contactsPrivateKey,
-              publicKey,
-              JSON.stringify(newAddedContacts)
-            ),
-            // unaddedContacts:
-            //   globalContactsInformation.unaddedContacts,
-          },
-          true
-        );
-        navigate(-1);
+            true
+          );
+          navigate(-1);
+        }
       }
+    } catch (err) {
+      console.log("Error saving changes", err);
+    } finally {
+      setIsSaving(false);
     }
   }
-
-  async function addProfilePicture() {
-    // const imagePickerResponse = await getImageFromLibrary({ quality: 1 });
-    // const { didRun, error, imgURL } = imagePickerResponse;
-    // if (!didRun) return;
-    // if (error) {
-    //   navigate("/error", {
-    //     state: {
-    //       errorMessage: error,
-    //       background: location,
-    //     },
-    //   });
-    //   return;
-    // }
-    // if (isEditingMyProfile) {
-    //   const response = await uploadProfileImage({ imgURL: imgURL });
-    //   if (!response) return;
-    //   toggleGlobalContactsInformation(
-    //     {
-    //       myProfile: {
-    //         ...globalContactsInformation.myProfile,
-    //         hasProfileImage: true,
-    //       },
-    //       addedContacts: globalContactsInformation.addedContacts,
-    //     },
-    //     true
-    //   );
-    //   return;
-    // }
-    // await refreshCache(selectedAddedContact.uuid, imgURL.uri);
-  }
-  async function uploadProfileImage({ imgURL, removeImage }) {
-    // try {
-    //   setIsAddingImage(true);
-    //   if (!removeImage) {
-    //     const resized = ImageManipulator.ImageManipulator.manipulate(
-    //       imgURL.uri
-    //     ).resize({ width: 350 });
-    //     const image = await resized.renderAsync();
-    //     const savedImage = await image.saveAsync({
-    //       compress: 0.4,
-    //       format: ImageManipulator.SaveFormat.WEBP,
-    //     });
-    //     const response = await setDatabaseIMG(
-    //       globalContactsInformation.myProfile.uuid,
-    //       { uri: savedImage.uri }
-    //     );
-    //     if (response) {
-    //       await refreshCache(
-    //         globalContactsInformation.myProfile.uuid,
-    //         response
-    //       );
-    //       return true;
-    //     } else throw new Error("Unable to save image");
-    //   } else {
-    //     await deleteDatabaseImage(globalContactsInformation.myProfile.uuid);
-    //     await removeProfileImageFromCache(
-    //       globalContactsInformation.myProfile.uuid
-    //     );
-    //     return true;
-    //   }
-    // } catch (err) {
-    //   console.log(err);
-    //   navigate("/error", {
-    //     state: {
-    //       errorMessage: err.message,
-    //       background: location,
-    //     },
-    //   });
-    //   return false;
-    // } finally {
-    //   setIsAddingImage(false);
-    // }
-  }
-  async function deleteProfilePicture() {
-    //   try {
-    //     if (isEditingMyProfile) {
-    //       const response = await uploadProfileImage({ removeImage: true });
-    //       console.log(response);
-    //       if (!response) return;
-    //       toggleGlobalContactsInformation(
-    //         {
-    //           myProfile: {
-    //             ...globalContactsInformation.myProfile,
-    //             hasProfileImage: false,
-    //           },
-    //           addedContacts: globalContactsInformation.addedContacts,
-    //         },
-    //         true
-    //       );
-    //       return;
-    //     }
-    //     await removeProfileImageFromCache(selectedAddedContact.uuid);
-    //   } catch (err) {
-    //     navigate("/error", {
-    //       state: {
-    //         errorMessage: "Unable to deleate image.",
-    //         background: location,
-    //       },
-    //     });
-    //     console.log(err);
-    //   }
-  }
 }
diff --git a/src/pages/contacts/screens/editMyProfilePage/style.css b/src/pages/contacts/screens/editMyProfilePage/style.css
index 7d3328d..af313f2 100644
--- a/src/pages/contacts/screens/editMyProfilePage/style.css
+++ b/src/pages/contacts/screens/editMyProfilePage/style.css
@@ -9,6 +9,7 @@
   flex: 1;
   display: flex;
   flex-direction: column;
+  margin: 0 auto;
 }
 #editMyProfile .editProfileScrollContainer {
   flex: 1;
@@ -20,6 +21,7 @@
   position: relative;
   width: max-content;
   align-self: center;
+  margin-bottom: 25px;
 }
 #editMyProfile .profileImageBackground {
   width: 150px;
@@ -58,3 +60,11 @@
   margin: 0;
   max-width: unset;
 }
+
+#editMyProfile .input-label {
+  /* margin: 0; */
+}
+#editMyProfile .charCount-label {
+  text-align: right;
+  margin: 10px 0 15px;
+}
diff --git a/src/pages/contacts/screens/myProfilePage/myProfilePage.css b/src/pages/contacts/screens/myProfilePage/myProfilePage.css
deleted file mode 100644
index e2f1935..0000000
--- a/src/pages/contacts/screens/myProfilePage/myProfilePage.css
+++ /dev/null
@@ -1,72 +0,0 @@
-#myProfilePageContainer {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  flex: 1;
-}
-
-#myProfilePageContainer .pageNavbar {
-  width: 100%;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 20px;
-}
-#myProfilePageContainer .pageNavbar .settingsIcon {
-  width: 30px;
-  height: 30px;
-  cursor: pointer;
-}
-#myProfilePageContainer .profileImageBackground {
-  width: 150px;
-  height: 150px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  position: relative;
-  border-radius: 50%;
-  cursor: pointer;
-  margin-top: 20px;
-}
-#myProfilePageContainer .scanProfileImageContianer {
-  position: absolute;
-  height: 30px;
-  width: 30px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 50%;
-  right: 20px;
-  bottom: -5px;
-}
-#myProfilePageContainer .scanProfileImageContianer img {
-  width: 50%;
-  height: 50%;
-}
-#myProfilePageContainer .uniqueNameText {
-  font-size: 2rem;
-  margin-top: 20px;
-  margin-bottom: 0;
-}
-#myProfilePageContainer .nameText {
-  margin: 0;
-}
-#myProfilePageContainer .bioContainer {
-  width: 100%;
-  max-width: 400px;
-  padding: 10px;
-  border-radius: 8px;
-  vertical-align: top;
-  margin: 0;
-  min-height: 60px;
-  max-height: 100px;
-  margin-top: 30px;
-  overflow-y: scroll;
-}
-#myProfilePageContainer .bioContainer p {
-  margin: 0;
-}
-
-#myProfilePageContainer .noTxText {
-  text-align: center;
-}
diff --git a/src/pages/contacts/screens/myProfilePage/myProfilePage.jsx b/src/pages/contacts/screens/myProfilePage/myProfilePage.jsx
deleted file mode 100644
index ce17714..0000000
--- a/src/pages/contacts/screens/myProfilePage/myProfilePage.jsx
+++ /dev/null
@@ -1,133 +0,0 @@
-import BackArrow from "../../../../components/backArrow/backArrow";
-import "./myProfilePage.css";
-import ContactProfileImage from "../../components/profileImage/profileImage";
-import { useGlobalContacts } from "../../../../contexts/globalContacts";
-import { useAppStatus } from "../../../../contexts/appStatus";
-import { useImageCache } from "../../../../contexts/imageCacheContext";
-import { useLocation, useNavigate } from "react-router-dom";
-import { useMemo } from "react";
-import MaxHeap from "../../../../functions/maxHeap";
-import ThemeText from "../../../../components/themeText/themeText";
-import { Colors } from "../../../../constants/theme";
-import { useThemeContext } from "../../../../contexts/themeContext";
-import useThemeColors from "../../../../hooks/useThemeColors";
-import ThemeImage from "../../../../components/ThemeImage/themeImage";
-import { ImagesIconDark, settingsIcon } from "../../../../constants/icons";
-
-export default function MyProfilePage({ openOverlay }) {
-  const { cache } = useImageCache();
-  const { theme, darkModeType } = useThemeContext();
-  const { backgroundOffset } = useThemeColors();
-
-  const { globalContactsInformation, decodedAddedContacts, contactsMessags } =
-    useGlobalContacts();
-  const navigate = useNavigate();
-  const location = useLocation();
-  const currentTime = new Date();
-
-  const myContact = globalContactsInformation.myProfile;
-
-  const createdPayments = useMemo(() => {
-    const messageHeap = new MaxHeap();
-    const MAX_MESSAGES = 50;
-
-    for (let contact of Object.keys(contactsMessags)) {
-      if (contact === "lastMessageTimestamp") continue;
-      const data = contactsMessags[contact];
-      const selectedAddedContact = decodedAddedContacts.find(
-        (contactElement) => contactElement.uuid === contact
-      );
-
-      for (let message of data.messages) {
-        const timestamp = message.timestamp;
-
-        const messageObj = {
-          transaction: message,
-          selectedProfileImage: selectedAddedContact?.profileImage || null,
-          name:
-            selectedAddedContact?.name ||
-            selectedAddedContact?.uniqueName ||
-            "Unknown",
-          contactUUID: selectedAddedContact?.uuid || contact,
-          time: timestamp,
-        };
-
-        messageHeap.add(messageObj);
-      }
-    }
-
-    const result = [];
-    while (!messageHeap.isEmpty() && result.length < MAX_MESSAGES) {
-      result.push(messageHeap.poll());
-    }
-
-    console.log(result.length, "LENGTH OF RESULT ARRAY");
-
-    return result;
-  }, [decodedAddedContacts, contactsMessags]);
-
-  return (
-    <div id="myProfilePageContainer">
-      <div className="pageNavbar">
-        <BackArrow />
-        <ThemeImage
-          className="settingsIcon"
-          clickFunction={() =>
-            navigate("/edit-profile", {
-              state: { pageType: "myProfile", fromSettings: false },
-            })
-          }
-          icon={settingsIcon}
-        />
-      </div>
-      <div
-        onClick={() => {
-          openOverlay({
-            for: "error",
-            errorMessage: "Feature coming soon...",
-          });
-        }}
-        className="profileImageBackground"
-        style={{ backgroundColor: backgroundOffset }}
-      >
-        <ContactProfileImage
-          updated={cache[myContact.uuid]?.updated}
-          uri={cache[myContact.uuid]?.localUri}
-          theme={theme}
-          darkModeType={darkModeType}
-        />
-        <div
-          style={{ backgroundColor: Colors.dark.text }}
-          className="scanProfileImageContianer"
-        >
-          <img src={ImagesIconDark} alt="Open scan profile modal" />
-        </div>
-      </div>
-      <ThemeText
-        className={"uniqueNameText"}
-        textContent={myContact.uniqueName}
-      />
-      {myContact?.name && (
-        <ThemeText className={"nameText"} textContent={myContact?.name} />
-      )}
-      <div
-        style={{ backgroundColor: Colors.dark.text }}
-        className="bioContainer"
-      >
-        <ThemeText
-          textStyles={{ color: Colors.light.text }}
-          textContent={myContact?.bio || "No bio set"}
-        />
-      </div>
-      {createdPayments?.length != 0 ? (
-        <p>Transactions go here</p>
-      ) : (
-        <ThemeText
-          className={"noTxText"}
-          textStyles={{ marginTop: 20 }}
-          textContent={"No transaction history"}
-        />
-      )}
-    </div>
-  );
-}
diff --git a/src/pages/contacts/utils/formatListDisplayName.js b/src/pages/contacts/utils/formatListDisplayName.js
new file mode 100644
index 0000000..9cb52f4
--- /dev/null
+++ b/src/pages/contacts/utils/formatListDisplayName.js
@@ -0,0 +1,17 @@
+export function formatDisplayName(contact) {
+  try {
+    if (contact.name?.length) {
+      return contact.name?.trim();
+    } else if (contact.uniqueName?.length) {
+      return contact.uniqueName?.trim();
+    } else if (contact.isLNURL) {
+      const [prefix, suffix] = contact.receiveAddress.split('@');
+      console.log(prefix, suffix);
+      return prefix;
+    }
+    return '';
+  } catch (err) {
+    console.log('error formatting display name', err);
+    return '';
+  }
+}
diff --git a/src/pages/contacts/utils/getReceiveAddressAndKindForPayment.js b/src/pages/contacts/utils/getReceiveAddressAndKindForPayment.js
new file mode 100644
index 0000000..850172c
--- /dev/null
+++ b/src/pages/contacts/utils/getReceiveAddressAndKindForPayment.js
@@ -0,0 +1,55 @@
+import { getDataFromCollection } from "../../../../db";
+
+export default async function getReceiveAddressAndContactForContactsPayment({
+  sendingAmountSat,
+  selectedContact,
+  myProfileMessage = "",
+  payingContactMessage = "",
+  onlyGetContact = false,
+}) {
+  try {
+    let receiveAddress;
+    let retrivedContact;
+    let message = "";
+
+    if (selectedContact.isLNURL) {
+      receiveAddress = selectedContact.receiveAddress;
+      retrivedContact = selectedContact;
+    } else {
+      retrivedContact = await getDataFromCollection(
+        "blitzWalletUsers",
+        selectedContact.uuid
+      );
+
+      if (!retrivedContact) throw new Error("errormessages.fullDeeplinkError");
+
+      if (onlyGetContact)
+        return { didWork: true, receiveAddress: "", retrivedContact };
+
+      if (retrivedContact?.contacts?.myProfile?.sparkAddress) {
+        if (payingContactMessage?.usingTranslation) {
+          message = retrivedContact.isUsingNewNotifications
+            ? JSON.stringify({
+                name: payingContactMessage.name,
+                translation: "contacts.sendAndRequestPage.contactMessage",
+              })
+            : `${payingContactMessage.name} paid you`;
+        } else {
+          message = payingContactMessage;
+        }
+
+        receiveAddress = retrivedContact?.contacts?.myProfile?.sparkAddress;
+      } else throw new Error("errormessages.legacyContactError");
+    }
+
+    return {
+      didWork: true,
+      receiveAddress,
+      retrivedContact,
+      formattedPayingContactMessage: message,
+    };
+  } catch (err) {
+    console.log("error getting receive address for contact payment");
+    return { didWork: false, error: err.message };
+  }
+}
diff --git a/src/pages/contacts/utils/hooks.js b/src/pages/contacts/utils/hooks.js
new file mode 100644
index 0000000..3d8c549
--- /dev/null
+++ b/src/pages/contacts/utils/hooks.js
@@ -0,0 +1,43 @@
+import { useMemo } from 'react';
+
+export const useProcessedContacts = (decodedAddedContacts, contactsMessags) => {
+  return useMemo(() => {
+    return decodedAddedContacts.map(contact => {
+      const info = contactsMessags[contact.uuid] || {};
+      return {
+        contact,
+        hasUnlookedTransaction: !!info.messages?.some(m => !m.message.wasSeen),
+        lastUpdated: info.lastUpdated,
+        firstMessage: info.messages?.[0],
+      };
+    });
+  }, [decodedAddedContacts, contactsMessags]);
+};
+
+export const useFilteredContacts = (
+  contactInfoList,
+  inputText,
+  hideUnknownContacts,
+) => {
+  return useMemo(() => {
+    const searchTerm = inputText.toLowerCase();
+    return contactInfoList
+      .filter(item => {
+        const matchesSearch =
+          item.contact.name?.toLowerCase().startsWith(searchTerm) ||
+          item.contact.uniqueName?.toLowerCase().startsWith(searchTerm);
+        const isNotFavorite = !item.contact.isFavorite;
+        const shouldShow = !hideUnknownContacts || item.contact.isAdded;
+
+        return matchesSearch && isNotFavorite && shouldShow;
+      })
+      .sort((a, b) => {
+        const timeDiff = (b.lastUpdated || 0) - (a.lastUpdated || 0);
+        if (timeDiff !== 0) return timeDiff;
+
+        const nameA = a.contact.name || a.contact.uniqueName || '';
+        const nameB = b.contact.name || b.contact.uniqueName || '';
+        return nameA.localeCompare(nameB);
+      });
+  }, [contactInfoList, inputText, hideUnknownContacts]);
+};
diff --git a/src/pages/contacts/utils/imageComparison.js b/src/pages/contacts/utils/imageComparison.js
new file mode 100644
index 0000000..cd3694b
--- /dev/null
+++ b/src/pages/contacts/utils/imageComparison.js
@@ -0,0 +1,92 @@
+import sha256Hash from "../../../functions/hash";
+
+/**
+ * Convert blob to ArrayBuffer
+ */
+async function blobToArrayBuffer(blob) {
+  return await blob.arrayBuffer();
+}
+
+/**
+ * Convert data URL to ArrayBuffer
+ */
+async function dataURLToArrayBuffer(dataURL) {
+  const base64 = dataURL.split(",")[1];
+  const binaryString = atob(base64);
+  const bytes = new Uint8Array(binaryString.length);
+  for (let i = 0; i < binaryString.length; i++) {
+    bytes[i] = binaryString.charCodeAt(i);
+  }
+  return bytes.buffer;
+}
+
+/**
+ * Get MD5 hash of image from various sources
+ * @param {string|Blob} imageSource - Can be a data URL, object URL, or Blob
+ * @returns {Promise<string>} MD5 hash as hex string
+ */
+export async function getImageHash(imageSource) {
+  if (!imageSource) return "";
+
+  try {
+    let arrayBuffer;
+
+    if (imageSource instanceof Blob) {
+      // Handle Blob directly
+      arrayBuffer = await blobToArrayBuffer(imageSource);
+    } else if (typeof imageSource === "string") {
+      if (imageSource.startsWith("data:")) {
+        // Handle data URL
+        arrayBuffer = await dataURLToArrayBuffer(imageSource);
+      } else if (imageSource.startsWith("blob:")) {
+        // Handle object URL
+        const response = await fetch(imageSource);
+        const blob = await response.blob();
+        arrayBuffer = await blobToArrayBuffer(blob);
+      } else {
+        // Handle regular URL
+        const response = await fetch(imageSource);
+        const blob = await response.blob();
+        arrayBuffer = await blobToArrayBuffer(blob);
+      }
+    } else {
+      throw new Error("Invalid image source type");
+    }
+
+    // Use SubtleCrypto to compute MD5-equivalent hash
+    // Note: MD5 is not available in Web Crypto API, so we use SHA-256
+    // and take first 32 chars to simulate MD5 length
+
+    const hashBuffer = sha256Hash(arrayBuffer);
+    // await crypto.subtle.digest('SHA-256', arrayBuffer);
+    // const fullHash = arrayBufferToHex(hashBuffer);
+
+    // Return first 32 characters to match MD5 length (128 bits)
+    return hashBuffer;
+  } catch (e) {
+    console.error("Error getting image hash:", e);
+    return "";
+  }
+}
+
+/**
+ * Compare two images to see if they're identical
+ * @param {string|Blob} source1 - First image (data URL, object URL, or Blob)
+ * @param {string|Blob} source2 - Second image (data URL, object URL, or Blob)
+ * @returns {Promise<boolean>} True if images are identical
+ */
+export async function areImagesSame(source1, source2) {
+  try {
+    const hash1 = await getImageHash(source1);
+    const hash2 = await getImageHash(source2);
+    console.log(source1, source2);
+    if (!hash1 || !hash2) {
+      return false;
+    }
+
+    return hash1 === hash2;
+  } catch (e) {
+    console.error("Error comparing images:", e);
+    return false;
+  }
+}
diff --git a/src/pages/contacts/utils/transactionText.js b/src/pages/contacts/utils/transactionText.js
new file mode 100644
index 0000000..41b152b
--- /dev/null
+++ b/src/pages/contacts/utils/transactionText.js
@@ -0,0 +1,29 @@
+export const getTransactionContent = ({
+  paymentDescription,
+  didDeclinePayment,
+  txParsed,
+  t,
+}) => {
+  if (paymentDescription) {
+    return paymentDescription;
+  }
+
+  if (didDeclinePayment) {
+    return txParsed.didSend
+      ? t('transactionLabelText.requestDeclined')
+      : t('transactionLabelText.declinedRequest');
+  }
+
+  if (txParsed.isRequest) {
+    if (txParsed.didSend) {
+      return txParsed.isRedeemed === null
+        ? t('transactionLabelText.requestSent')
+        : t('transactionLabelText.requestPaid');
+    }
+    return t('transactionLabelText.paidRequest');
+  }
+
+  return txParsed.didSend
+    ? t('transactionLabelText.sent')
+    : t('transactionLabelText.received');
+};
diff --git a/src/pages/contacts/utils/useExpandedNavbar.js b/src/pages/contacts/utils/useExpandedNavbar.js
new file mode 100644
index 0000000..8497a5e
--- /dev/null
+++ b/src/pages/contacts/utils/useExpandedNavbar.js
@@ -0,0 +1,93 @@
+import { useTranslation } from "react-i18next";
+import { useNavigate } from "react-router-dom";
+import { useGlobalContacts } from "../../../contexts/globalContacts";
+import { useAppStatus } from "../../../contexts/appStatus";
+import {
+  decryptMessage,
+  encryptMessage,
+} from "../../../functions/encodingAndDecoding";
+import { useKeysContext } from "../../../contexts/keysContext";
+import { useOverlay } from "../../../contexts/overlayContext";
+
+/**
+ * Custom hook for managing profile image operations
+ * Handles adding, uploading, and deleting profile images for contacts
+ */
+export function useExpandedNavbar() {
+  const navigate = useNavigate();
+  const { t } = useTranslation();
+  const { openOverlay } = useOverlay();
+  const { contactsPrivateKey, publicKey } = useKeysContext();
+  const { isConnectedToTheInternet } = useAppStatus();
+  const { globalContactsInformation, toggleGlobalContactsInformation } =
+    useGlobalContacts();
+
+  /**
+   * toggle whether a contact is a favorite
+   * @param {object} selectedContact - The contact object (only needed if not editing own profile)
+   */
+  const handleFavortie = async ({ selectedContact }) => {
+    if (!isConnectedToTheInternet) {
+      navigate.navigate("ErrorScreen", {
+        errorMessage: t("errormessages.nointernet"),
+      });
+      return;
+    }
+    if (!selectedContact) return;
+    toggleGlobalContactsInformation(
+      {
+        myProfile: { ...globalContactsInformation.myProfile },
+        addedContacts: await encryptMessage(
+          contactsPrivateKey,
+          publicKey,
+          JSON.stringify(
+            [
+              ...JSON.parse(
+                await decryptMessage(
+                  contactsPrivateKey,
+                  publicKey,
+                  globalContactsInformation.addedContacts
+                )
+              ),
+            ].map((savedContact) => {
+              if (savedContact.uuid === selectedContact.uuid) {
+                return {
+                  ...savedContact,
+                  isFavorite: !savedContact.isFavorite,
+                };
+              } else return savedContact;
+            })
+          )
+        ),
+      },
+      true
+    );
+  };
+
+  /**
+   * navigate to settings page
+   * @param {object} params - Upload parameters
+   * @param {object} selectedContact - The contact object (only needed if not editing own profile)
+   */
+  const handleSettings = ({ selectedContact }) => {
+    if (!isConnectedToTheInternet) {
+      openOverlay({
+        for: "error",
+        errorMessage: t("errormessages.nointernet"),
+      });
+      return;
+    }
+    if (!selectedContact) return;
+    navigate("/edit-profile", {
+      state: {
+        pageType: "addedContact",
+        selectedAddedContact: selectedContact,
+      },
+    });
+  };
+
+  return {
+    handleFavortie,
+    handleSettings,
+  };
+}
diff --git a/src/pages/contacts/utils/useProfileImage.js b/src/pages/contacts/utils/useProfileImage.js
new file mode 100644
index 0000000..2eb0b34
--- /dev/null
+++ b/src/pages/contacts/utils/useProfileImage.js
@@ -0,0 +1,287 @@
+import React, { useState, useRef, createContext, useContext } from "react";
+import { useOverlay } from "../../../contexts/overlayContext";
+import { useGlobalContacts } from "../../../contexts/globalContacts";
+import { useImageCache } from "../../../contexts/imageCacheContext";
+import {
+  deleteDatabaseImage,
+  setDatabaseIMG,
+} from "../../../../db/photoStorage";
+
+// Profile Image Hook
+export function useProfileImage() {
+  const { openOverlay } = useOverlay();
+  const { globalContactsInformation, toggleGlobalContactsInformation } =
+    useGlobalContacts();
+  const { refreshCache, removeProfileImageFromCache } = useImageCache();
+
+  const [isAddingImage, setIsAddingImage] = useState(false);
+
+  /**
+   * Opens file picker and gets image from library
+   */
+  const getImageFromLibrary = async () => {
+    return new Promise((resolve) => {
+      const input = document.createElement("input");
+      input.type = "file";
+      input.accept = "image/*";
+
+      input.onchange = async (e) => {
+        const file = e.target.files?.[0];
+        if (!file) {
+          resolve({ didRun: false });
+          return;
+        }
+
+        if (!file.type.startsWith("image/")) {
+          resolve({ didRun: true, error: "Please select a valid image file" });
+          return;
+        }
+
+        try {
+          const imgURL = await fileToImageData(file);
+          resolve({ didRun: true, imgURL, file });
+        } catch (error) {
+          resolve({ didRun: true, error: "Failed to load image" });
+        }
+      };
+
+      input.click();
+    });
+  };
+
+  /**
+   * Converts File to image data with dimensions
+   */
+  const fileToImageData = (file) => {
+    return new Promise((resolve, reject) => {
+      const reader = new FileReader();
+      reader.onload = (e) => {
+        const img = new Image();
+        img.onload = () => {
+          resolve({
+            uri: e.target.result,
+            width: img.width,
+            height: img.height,
+            file,
+          });
+        };
+        img.onerror = reject;
+        img.src = e.target.result;
+      };
+      reader.onerror = reject;
+      reader.readAsDataURL(file);
+    });
+  };
+
+  /**
+   * Gets a profile picture for a contact
+   */
+  const getProfileImage = async () => {
+    try {
+      const imagePickerResponse = await getImageFromLibrary();
+      const { didRun, error, imgURL } = imagePickerResponse;
+
+      if (!didRun) return;
+
+      if (error) {
+        openOverlay({
+          for: "error",
+          errorMessage: error,
+        });
+        return;
+      }
+
+      const startTime = Date.now();
+      setIsAddingImage(true);
+
+      const savedImage = await resizeImage({ imgURL });
+
+      if (!savedImage.uri) return;
+
+      const offsetTime = Date.now() - startTime;
+      const remainingTime = Math.max(0, 700 - offsetTime);
+
+      if (remainingTime > 0) {
+        await new Promise((resolve) => setTimeout(resolve, remainingTime));
+      }
+
+      console.log(savedImage, imgURL, "test");
+      return { comparison: savedImage, imgURL };
+    } catch (err) {
+      console.log("error getting profile image", err);
+    } finally {
+      setIsAddingImage(false);
+    }
+  };
+
+  /**
+   * Saves a profile picture for a contact
+   */
+  const saveProfileImage = async (
+    imgData,
+    isEditingMyProfile,
+    selectedContact
+  ) => {
+    try {
+      if (isEditingMyProfile) {
+        const response = await uploadProfileImage({
+          imgBlob: imgData.comparison.blob, // Pass the blob, not the URI
+          imgURL: imgData.comparison.uri, // Keep URI for cache
+          uuid: globalContactsInformation.myProfile.uuid,
+        });
+
+        if (!response) return;
+
+        toggleGlobalContactsInformation(
+          {
+            myProfile: {
+              ...globalContactsInformation.myProfile,
+              hasProfileImage: true,
+            },
+            addedContacts: globalContactsInformation.addedContacts,
+          },
+          true
+        );
+        return;
+      }
+
+      if (selectedContact) {
+        await refreshCache(selectedContact.uuid, imgData.comparison.uri, false);
+      }
+    } catch (err) {
+      console.log("error saving profile image", err);
+    }
+  };
+
+  /**
+   * Resizes and crops an image to a circle for profile pictures
+   */
+  const resizeImage = async ({ imgURL }) => {
+    try {
+      const { width: originalWidth, height: originalHeight, uri } = imgURL;
+      const photoWidth = originalWidth * 0.95;
+      const photoHeight = originalHeight * 0.95;
+      const targetSize = 250;
+
+      const smallerDimension = Math.min(photoWidth, photoHeight);
+      const cropSize = smallerDimension;
+      const cropX = (photoWidth - cropSize) / 2;
+      const cropY = (photoHeight - cropSize) / 2;
+
+      return new Promise((resolve) => {
+        const img = new Image();
+        img.onload = () => {
+          const canvas = document.createElement("canvas");
+          canvas.width = targetSize;
+          canvas.height = targetSize;
+          const ctx = canvas.getContext("2d");
+
+          ctx.drawImage(
+            img,
+            cropX,
+            cropY,
+            cropSize,
+            cropSize,
+            0,
+            0,
+            targetSize,
+            targetSize
+          );
+
+          canvas.toBlob(
+            (blob) => {
+              const resizedUri = URL.createObjectURL(blob);
+              resolve({
+                uri: resizedUri,
+                width: targetSize,
+                height: targetSize,
+                blob,
+              });
+            },
+            "image/webp",
+            0.4
+          );
+        };
+        img.src = uri;
+      });
+    } catch (err) {
+      console.log("Error resizing image", err);
+      return {};
+    }
+  };
+
+  /**
+   * Uploads and processes a profile image
+   */
+  const uploadProfileImage = async ({ imgBlob, imgURL, uuid, removeImage }) => {
+    try {
+      if (!removeImage) {
+        console.log(imgURL);
+        const response = await setDatabaseIMG(uuid, imgBlob);
+        if (response) {
+          await refreshCache(uuid, imgURL, false);
+          return true;
+        } else {
+          throw new Error("Unable to save profile image");
+        }
+      } else {
+        await deleteDatabaseImage(uuid);
+        await removeProfileImageFromCache(uuid);
+        return true;
+      }
+    } catch (err) {
+      console.log(err);
+      openOverlay({ for: "error", errorMessage: err.message });
+      return false;
+    }
+  };
+
+  /**
+   * Deletes a profile picture
+   */
+  const deleteProfilePicture = async (
+    isEditingMyProfile,
+    selectedContact = null
+  ) => {
+    try {
+      if (isEditingMyProfile) {
+        console.log(globalContactsInformation.myProfile.uuid);
+        const response = await uploadProfileImage({
+          removeImage: true,
+          uuid: globalContactsInformation.myProfile.uuid,
+        });
+
+        if (!response) return;
+
+        toggleGlobalContactsInformation(
+          {
+            myProfile: {
+              ...globalContactsInformation.myProfile,
+              hasProfileImage: false,
+            },
+            addedContacts: globalContactsInformation.addedContacts,
+          },
+          true
+        );
+        return;
+      }
+
+      if (selectedContact) {
+        await removeProfileImageFromCache(selectedContact.uuid);
+      }
+    } catch (err) {
+      openOverlay({
+        for: "error",
+        errorMessage: "Failed to delete profile image",
+      });
+      console.log(err);
+    }
+  };
+
+  return {
+    isAddingImage,
+    deleteProfilePicture,
+    getProfileImage,
+    saveProfileImage,
+  };
+}
diff --git a/src/pages/contacts/utils/utilityFunctions.js b/src/pages/contacts/utils/utilityFunctions.js
new file mode 100644
index 0000000..cc4f50d
--- /dev/null
+++ b/src/pages/contacts/utils/utilityFunctions.js
@@ -0,0 +1,66 @@
+import { formatLocalTimeNumeric } from "../../../functions/timeFormatter";
+
+function isSameDay(date1, date2) {
+  return (
+    date1.getFullYear() === date2.getFullYear() &&
+    date1.getMonth() === date2.getMonth() &&
+    date1.getDate() === date2.getDate()
+  );
+}
+
+function getDaysDifference(laterDate, earlierDate) {
+  const later = new Date(
+    laterDate.getFullYear(),
+    laterDate.getMonth(),
+    laterDate.getDate()
+  );
+  const earlier = new Date(
+    earlierDate.getFullYear(),
+    earlierDate.getMonth(),
+    earlierDate.getDate()
+  );
+
+  const differenceMs = later - earlier;
+  return Math.floor(differenceMs / (1000 * 60 * 60 * 24));
+}
+
+export function createFormattedDate(time, currentTime, t) {
+  const date = new Date(time);
+  const currentDate = new Date(currentTime);
+
+  const daysOfWeek = [
+    t("weekdays.Sun"),
+    t("weekdays.Mon"),
+    t("weekdays.Tue"),
+    t("weekdays.Wed"),
+    t("weekdays.Thu"),
+    t("weekdays.Fri"),
+    t("weekdays.Sat"),
+  ];
+
+  let formattedTime;
+
+  if (isSameDay(date, currentDate)) {
+    const hours = date.getHours();
+    const minutes = date.getMinutes();
+    const ampm = hours >= 12 ? "PM" : "AM";
+    const formattedHours = hours % 12 === 0 ? 12 : hours % 12;
+    const formattedMinutes = minutes < 10 ? "0" + minutes : minutes;
+    formattedTime = `${formattedHours}:${formattedMinutes} ${ampm}`;
+  } else {
+    const daysDiff = getDaysDifference(currentDate, date);
+    if (daysDiff === 1) {
+      formattedTime = t("constants.yesterday");
+    } else if (daysDiff <= 7) {
+      formattedTime = daysOfWeek[date.getDay()];
+    } else {
+      formattedTime = formatLocalTimeNumeric(date);
+    }
+  }
+
+  return formattedTime;
+}
+
+export function formatMessage(message) {
+  return message?.message?.description;
+}
diff --git a/src/pages/createSeed/createSeed.jsx b/src/pages/createSeed/createSeed.jsx
index 349f05d..ef98604 100644
--- a/src/pages/createSeed/createSeed.jsx
+++ b/src/pages/createSeed/createSeed.jsx
@@ -13,8 +13,10 @@ import { useTranslation } from "react-i18next";
 import useThemeColors from "../../hooks/useThemeColors";
 import ThemeText from "../../components/themeText/themeText";
 import PageNavBar from "../../components/navBar/navBar";
+import { useOverlay } from "../../contexts/overlayContext";
 
-function CreateSeed({ openOverlay }) {
+function CreateSeed() {
+  const { openOverlay } = useOverlay();
   const { t } = useTranslation();
   const { mnemoinc, setMnemoinc } = useAuth();
   const seed = mnemoinc?.split(" ");
diff --git a/src/pages/customHalfModal/Modal.css b/src/pages/customHalfModal/Modal.css
index 2623c24..c143369 100644
--- a/src/pages/customHalfModal/Modal.css
+++ b/src/pages/customHalfModal/Modal.css
@@ -8,7 +8,7 @@
   display: flex;
   justify-content: center;
   align-items: flex-end; /* modal slides up from bottom */
-  z-index: 999;
+  z-index: 1002;
 }
 
 .modal {
diff --git a/src/pages/customHalfModal/components/editLNURLOnReceive/index.jsx b/src/pages/customHalfModal/components/editLNURLOnReceive/index.jsx
index 6a1fa68..243ba2d 100644
--- a/src/pages/customHalfModal/components/editLNURLOnReceive/index.jsx
+++ b/src/pages/customHalfModal/components/editLNURLOnReceive/index.jsx
@@ -4,8 +4,6 @@ import ContactProfileImage from "../../../contacts/components/profileImage/profi
 import useThemeColors from "../../../../hooks/useThemeColors";
 import ActivityIndicator from "../../../../components/activityIndicator/activityIndicator";
 import { Colors } from "../../../../constants/theme";
-import ThemeImage from "../../../../components/ThemeImage/themeImage";
-import { aboutIcon, ImagesIconDark } from "../../../../constants/icons";
 import ThemeText from "../../../../components/themeText/themeText";
 import { useTranslation } from "react-i18next";
 import CustomInput from "../../../../components/customInput/customInput";
@@ -13,13 +11,15 @@ import { useGlobalContacts } from "../../../../contexts/globalContacts";
 import CustomButton from "../../../../components/customButton/customButton";
 import { VALID_USERNAME_REGEX } from "../../../../constants";
 import { isValidUniqueName } from "../../../../../db";
+import { useOverlay } from "../../../../contexts/overlayContext";
+import { Image, Info } from "lucide-react";
 
 export default function EditLNURLContactOnReceivePage({
   theme,
   darkModeType,
-  openOverlay,
   onClose,
 }) {
+  const { openOverlay } = useOverlay();
   const { globalContactsInformation, toggleGlobalContactsInformation } =
     useGlobalContacts();
   const { t } = useTranslation();
@@ -107,11 +107,7 @@ export default function EditLNURLContactOnReceivePage({
         )}
 
         <div style={{ backgroundColor: Colors.dark.text }} className="addImage">
-          <ThemeImage
-            styles={{ width: 15, height: 15 }}
-            icon={ImagesIconDark}
-            filter={true}
-          />
+          <Image color={Colors.light.text} style={{ width: 15, height: 15 }} />
         </div>
       </button>
 
@@ -123,8 +119,8 @@ export default function EditLNURLContactOnReceivePage({
             "wallet.receivePages.editLNURLContact.usernameInputDesc"
           )}
         />
-        <ThemeImage
-          clickFunction={() =>
+        <Info
+          onClick={() =>
             openOverlay({
               for: "informationPopup",
               textContent: t(
@@ -133,8 +129,10 @@ export default function EditLNURLContactOnReceivePage({
               buttonText: t("constants.understandText"),
             })
           }
-          styles={{ width: 20, height: 20, cursor: "pointer" }}
-          icon={aboutIcon}
+          style={{ width: 20, height: 20, cursor: "pointer" }}
+          color={
+            theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+          }
         />
       </div>
       <div style={{ width: "100%", marginTop: 10, marginBottom: 10 }}>
diff --git a/src/pages/customHalfModal/index.jsx b/src/pages/customHalfModal/index.jsx
index 60c7860..a8512c2 100644
--- a/src/pages/customHalfModal/index.jsx
+++ b/src/pages/customHalfModal/index.jsx
@@ -8,6 +8,7 @@ import ManualEnterSendAddress from "../wallet/components/sendOptions/manualEnter
 import SwitchReceiveOption from "../switchReceiveOption/switchReceiveOption";
 import EditLNURLContactOnReceivePage from "./components/editLNURLOnReceive";
 import LRC20TokenInformation from "../../functions/lrc20/lrc20TokenDataHalfModal";
+import AddContactsModal from "../contacts/components/addContactsHalfModal/addContactsHalfModal";
 
 export default function CustomHalfModal({
   onClose,
@@ -81,6 +82,20 @@ export default function CustomHalfModal({
             params={params}
           />
         );
+      case "addContactsHalfModal":
+        return (
+          <AddContactsModal
+            theme={theme}
+            darkModeType={darkModeType}
+            slideHeight={slideHeight}
+            isKeyboardActive={isKeyboardActive}
+            setIsKeyboardActive={setIsKeyboardActive}
+            setContentHeight={setContentHeight}
+            openOverlay={openOverlay}
+            onClose={handleClose}
+            params={params}
+          />
+        );
       case "confirmSMS":
         return <div>Confirm SMS: {params?.message}</div>;
       default:
diff --git a/src/pages/disclaimer/disclaimer.jsx b/src/pages/disclaimer/disclaimer.jsx
index 495d682..cd4f3ca 100644
--- a/src/pages/disclaimer/disclaimer.jsx
+++ b/src/pages/disclaimer/disclaimer.jsx
@@ -8,7 +8,11 @@ import ThemeText from "../../components/themeText/themeText";
 import Icon from "../../components/customIcon/customIcon";
 import PageNavBar from "../../components/navBar/navBar";
 import { disclaimerKeys } from "../../constants/icons";
-function DisclaimerPage({ openOverlay }) {
+import { useOverlay } from "../../contexts/overlayContext";
+import { KeyRound } from "lucide-react";
+
+function DisclaimerPage() {
+  const { openOverlay } = useOverlay();
   const location = useLocation();
   const params = location.state;
   const nextPageName = params?.nextPageName;
@@ -52,7 +56,7 @@ function DisclaimerPage({ openOverlay }) {
           {t("createAccount.disclaimerPage.subHeader")}
         </p>
         <div className="imgContainer">
-          <img loading="lazy" src={disclaimerKeys} />
+          <img src={disclaimerKeys} />
         </div>
         <p className="quoteText">
           {t("createAccount.disclaimerPage.imgCaption")}
@@ -83,7 +87,7 @@ function DisclaimerPage({ openOverlay }) {
             <ThemeText
               textStyles={{ fontSize: "0.75rem", margin: 0, marginRight: 3 }}
               textContent={t("createAccount.disclaimerPage.acceptPrefix")}
-            />{" "}
+            />
             <div onClick={openTermsAndConditions}>
               <ThemeText
                 textStyles={{
diff --git a/src/pages/error/ErrorScreen.css b/src/pages/error/ErrorScreen.css
index 4db188e..32fd4e2 100644
--- a/src/pages/error/ErrorScreen.css
+++ b/src/pages/error/ErrorScreen.css
@@ -1,4 +1,6 @@
 .error-content {
+  height: max-content;
+  max-height: 95%;
   background-color: white;
   padding: 10px;
   border-radius: 8px;
@@ -7,10 +9,14 @@
   display: flex;
   flex-direction: column;
 }
+.error-content-scroll {
+  overflow-y: scroll;
+}
 
 .error-message {
   text-align: center;
   margin-bottom: 20px;
   margin-top: 10px;
   font-size: 16px;
+  line-break: anywhere;
 }
diff --git a/src/pages/error/error.jsx b/src/pages/error/error.jsx
index 8f1b96f..1d3a70d 100644
--- a/src/pages/error/error.jsx
+++ b/src/pages/error/error.jsx
@@ -72,7 +72,12 @@ export default function ErrorScreen({ overlay, onClose }) {
             className="error-content"
             onClick={(e) => e.stopPropagation()}
           >
-            <ThemeText className={"error-message"} textContent={errorMessage} />
+            <div className="error-content-scroll">
+              <ThemeText
+                className={"error-message"}
+                textContent={errorMessage}
+              />
+            </div>
 
             <div style={{ alignSelf: "center" }} onClick={handleOkClick}>
               <CustomButton
diff --git a/src/pages/expandedTxPage/expandedTxPage.jsx b/src/pages/expandedTxPage/expandedTxPage.jsx
index 970f6ab..011e6bf 100644
--- a/src/pages/expandedTxPage/expandedTxPage.jsx
+++ b/src/pages/expandedTxPage/expandedTxPage.jsx
@@ -1,332 +1,419 @@
 import { useLocation, useNavigate } from "react-router-dom";
-import BackArrow from "../../components/backArrow/backArrow";
+import { useMemo, useRef, useState } from "react";
 import "./style.css";
-import { Colors } from "../../constants/theme";
+
 import ThemeText from "../../components/themeText/themeText";
 import FormattedSatText from "../../components/formattedSatText/formattedSatText";
-import { useThemeContext } from "../../contexts/themeContext";
-import { useEffect, useState } from "react";
 import CustomButton from "../../components/customButton/customButton";
-import useThemeColors from "../../hooks/useThemeColors";
-import { check, pendingTx, xSmallIconBlack } from "../../constants/icons";
-import formatBalanceAmount from "../../functions/formatNumber";
+import BackArrow from "../../components/backArrow/backArrow";
+
+import { Colors } from "../../constants/theme";
+import { TOKEN_TICKER_MAX_LENGTH } from "../../constants";
+
+import { useThemeContext } from "../../contexts/themeContext";
+import { useGlobalContacts } from "../../contexts/globalContacts";
+import { useImageCache } from "../../contexts/imageCacheContext";
 import { useSpark } from "../../contexts/sparkContext";
-import { formatTokensNumber } from "../../functions/lrc20/formatTokensBalance";
+import useThemeColors from "../../hooks/useThemeColors";
+
+import { bulkUpdateSparkTransactions } from "../../functions/spark/transactions";
+import { formatLocalTimeShort } from "../../functions/timeFormatter";
+import displayCorrectDenomination from "../../functions/displayCorrectDenomination";
+
+import { Check, Clock, X, Pencil } from "lucide-react";
 import { useTranslation } from "react-i18next";
-import { TOKEN_TICKER_MAX_LENGTH } from "../../constants";
+import { formatTokensNumber } from "../../functions/lrc20/formatTokensBalance";
+import { useGlobalContextProvider } from "../../contexts/masterInfoObject";
+import { useNodeContext } from "../../contexts/nodeContext";
 
 export default function ExpandedTxPage() {
-  const { sparkInformation } = useSpark();
-  const { t } = useTranslation();
   const location = useLocation();
-  const props = location.state;
   const navigate = useNavigate();
-  const [windowWidth, setWindowWidth] = useState(0);
+  const { t } = useTranslation();
+
   const { theme, darkModeType } = useThemeContext();
   const { backgroundOffset, backgroundColor } = useThemeColors();
+  const { decodedAddedContacts } = useGlobalContacts();
+  const { masterInfoObject } = useGlobalContextProvider();
+  const { fiatStats } = useNodeContext();
+  const { cache } = useImageCache();
+  const { sparkInformation } = useSpark();
 
-  const transaction = props?.transaction;
-  const paymentType = transaction.paymentType;
+  const [transaction, setTransaction] = useState(location.state.transaction);
 
-  const isFailed = transaction.paymentStatus === "failed";
-  const isPending = transaction.paymentStatus === "pending";
+  const sendingContactUUID = transaction.details?.sendingUUID;
 
-  const paymentDate = new Date(transaction.details.time);
+  const selectedContact = useMemo(() => {
+    return decodedAddedContacts?.find((c) => c.uuid === sendingContactUUID);
+  }, [decodedAddedContacts, sendingContactUUID]);
 
-  const description = transaction.details.description;
+  const isPending = transaction.paymentStatus === "pending";
+  const isFailed = transaction.paymentStatus === "failed";
 
   const isLRC20Payment = transaction.details.isLRC20Payment;
   const selectedToken = isLRC20Payment
     ? sparkInformation.tokens?.[transaction.details.LRC20Token]
-    : "";
+    : undefined;
+
   const formattedTokensBalance = formatTokensNumber(
-    transaction?.details?.amount,
+    transaction.details.amount,
     selectedToken?.tokenMetadata?.decimals
   );
+  console.log(transaction, sendingContactUUID);
+  const paymentType = sendingContactUUID
+    ? t("screens.inAccount.expandedTxPage.contactPaymentType")
+    : transaction.details.isGift
+    ? t("constants.gift")
+    : transaction.paymentType;
 
-  console.log(isLRC20Payment, formattedTokensBalance);
-
-  useEffect(() => {
-    setWindowWidth(window.innerWidth);
-    window.addEventListener("resize", (e) => {
-      setWindowWidth(window.innerWidth);
-    });
-  }, []);
-  const renderLRC20TokenRow = () => {
-    if (!isLRC20Payment) return null;
+  const paymentDate = new Date(transaction.details.time);
 
-    return (
-      <>
-        <ThemeText textContent={t("constants.token")} />
-        <ThemeText
-          textStyles={{ textAlign: windowWidth > 320 ? "right" : "center" }}
-          textContent={selectedToken?.tokenMetadata?.tokenTicker
-            ?.toUpperCase()
-            ?.slice(0, TOKEN_TICKER_MAX_LENGTH)}
-        />
-      </>
+  const handleSave = async (memoText) => {
+    if (memoText === transaction.details.description) return;
+    const newTx = structuredClone(transaction);
+    newTx.details.description = memoText;
+    newTx.useTempId = true;
+    newTx.id = transaction.sparkID;
+    newTx.tempID = transaction.sparkID;
+    await bulkUpdateSparkTransactions(
+      [newTx],
+      undefined,
+      undefined,
+      undefined,
+      true
     );
+    setTransaction(newTx);
   };
 
+  const statusColors = getStatusColors({
+    theme,
+    darkModeType,
+    isPending,
+    isFailed,
+  });
+
   return (
     <>
       <BackArrow backFunction={() => navigate(-1)} />
+
       <div className="expandedTxContainer">
         <div
+          className="receiptContainer"
           style={{
             backgroundColor: theme
               ? backgroundOffset
               : Colors.light.expandedTxReceitBackground,
           }}
-          className="receiptContainer"
         >
-          <div
-            style={{ backgroundColor: backgroundColor }}
-            className="paymentStatusOuterContainer"
-          >
-            <div
-              style={{
-                backgroundColor: isPending
-                  ? theme
-                    ? Colors.dark.expandedTxPendingOuter
-                    : Colors.light.expandedTxPendingOuter
-                  : isFailed
-                  ? theme && darkModeType
-                    ? Colors.lightsout.backgroundOffset
-                    : Colors.light.expandedTxFailed
-                  : theme
-                  ? Colors.dark.expandedTxConfimred
-                  : Colors.light.expandedTxConfimred,
-              }}
-              className="paymentStatusFirstCircle"
-            >
-              <div
-                style={{
-                  backgroundColor: isPending
-                    ? theme
-                      ? Colors.dark.expandedTxPendingInner
-                      : Colors.light.expandedTxPendingInner
-                    : isFailed
-                    ? theme && darkModeType
-                      ? Colors.dark.text
-                      : Colors.constants.cancelRed
-                    : theme
-                    ? Colors.dark.text
-                    : Colors.light.blue,
-                }}
-                className="paymentStatusSecondCircle"
-              >
-                <img
-                  style={{
-                    filter: isPending
-                      ? theme
-                        ? "brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(307deg) brightness(103%) contrast(101%)" // white
-                        : "brightness(0) saturate(100%) invert(97%) sepia(31%) saturate(97%) hue-rotate(195deg) brightness(110%) contrast(84%)"
-                      : backgroundColor === "#EBEBEB"
-                      ? "brightness(0) saturate(100%) invert(97%) sepia(31%) saturate(97%) hue-rotate(195deg) brightness(110%) contrast(84%)"
-                      : backgroundColor === "#000000"
-                      ? "brightness(0) saturate(100%) invert(0%) sepia(100%) saturate(7459%) hue-rotate(44deg) brightness(92%) contrast(101%)"
-                      : "brightness(0) saturate(100%) invert(12%) sepia(40%) saturate(2530%) hue-rotate(188deg) brightness(100%) contrast(107%)",
-                  }}
-                  className="paymentStatusIcon"
-                  src={
-                    isFailed ? xSmallIconBlack : isPending ? pendingTx : check
-                  }
-                />
-              </div>
-            </div>
-          </div>
+          <StatusCircle
+            isPending={isPending}
+            isFailed={isFailed}
+            colors={statusColors}
+            backgroundColor={backgroundColor}
+            theme={theme}
+          />
+
           <ThemeText
-            className={"receiveAmountLabel"}
-            textContent={`${
-              transaction.details.direction === "OUTGOING" ? "Sent" : "Received"
-            } amount`}
+            className="receiveAmountLabel"
+            textContent={t("screens.inAccount.expandedTxPage.confirmMessage", {
+              context:
+                transaction.details.direction === "OUTGOING" || isFailed
+                  ? "sent"
+                  : "received",
+            })}
           />
+
           <FormattedSatText
-            containerStyles={{ marginTop: "-5px" }}
             neverHideBalance={true}
-            styles={{
-              fontSize: windowWidth < 200 ? "30px" : "40px",
-              margin: 0,
-            }}
             balance={
-              isLRC20Payment && formattedTokensBalance > 1
+              isLRC20Payment && formattedTokensBalance >= 1
                 ? formattedTokensBalance
                 : transaction.details.amount
             }
             useCustomLabel={isLRC20Payment}
             customLabel={selectedToken?.tokenMetadata?.tokenTicker}
             useMillionDenomination={true}
+            styles={{ margin: 0, fontSize: "1.5em" }}
           />
-          <div className="paymentStatusTextContanier">
-            <ThemeText textContent={"Payment status"} />
-            <div
-              className="paymentStatusPillContiner"
-              style={{
-                backgroundColor: isPending
-                  ? theme
-                    ? Colors.dark.expandedTxPendingInner
-                    : Colors.light.expandedTxPendingOuter
-                  : isFailed
-                  ? theme && darkModeType
-                    ? Colors.lightsout.background
-                    : Colors.light.expandedTxFailed
-                  : theme
-                  ? Colors.dark.expandedTxConfimred
-                  : Colors.light.expandedTxConfimred,
-              }}
-            >
+
+          <PaymentStatus
+            isPending={isPending}
+            isFailed={isFailed}
+            colors={statusColors}
+          />
+
+          <Border backgroundColor={backgroundColor} />
+
+          {sendingContactUUID && (
+            <div className="contactRow">
+              <div className="profileImage" style={{ backgroundColor }}>
+                <img src={cache[sendingContactUUID]?.localUri} alt="contact" />
+              </div>
               <ThemeText
-                textStyles={{
-                  color: isPending
-                    ? theme
-                      ? Colors.dark.text
-                      : Colors.light.expandedTxPendingInner
-                    : isFailed
-                    ? theme && darkModeType
-                      ? Colors.dark.text
-                      : Colors.constants.cancelRed
-                    : theme
-                    ? Colors.dark.text
-                    : Colors.light.blue,
-                }}
                 textContent={
-                  isPending ? "Pending" : isFailed ? "Failed" : "Successful"
+                  selectedContact?.name || selectedContact?.uniqueName
                 }
               />
             </div>
-          </div>
-          <Border windowWidth={windowWidth} />
+          )}
+
           <div className="infoGridContainer">
-            <ThemeText textContent={"Time"} />
-            <ThemeText
-              textStyles={{ textAlign: windowWidth > 320 ? "right" : "center" }}
-              textContent={`${
-                paymentDate.getHours() <= 9
-                  ? "0" + paymentDate.getHours()
-                  : paymentDate.getHours()
-              }:${
-                paymentDate.getMinutes() <= 9
-                  ? "0" + paymentDate.getMinutes()
-                  : paymentDate.getMinutes()
-              }`}
+            <Info
+              label={t("transactionLabelText.date")}
+              value={formatLocalTimeShort(paymentDate)}
             />
-            <ThemeText textContent={"Fee"} />
-            <FormattedSatText
-              containerStyles={{
-                justifyContent: windowWidth > 320 ? "end" : "center",
-              }}
-              styles={{ marginTop: 0, marginBottom: 0 }}
-              neverHideBalance={true}
-              balance={isFailed ? 0 : transaction.details.fee}
+            <Info
+              label={t("transactionLabelText.time")}
+              value={formatTime(paymentDate)}
             />
-            <ThemeText textContent={"Type"} />
-            <ThemeText
-              textStyles={{
-                textTransform: "capitalize",
-                textAlign: windowWidth > 320 ? "right" : "center",
-              }}
-              textContent={paymentType}
+            <Info
+              label={t("constants.fee")}
+              value={displayCorrectDenomination({
+                amount: transaction.details.fee || 0,
+                fiatStats,
+                masterInfoObject,
+              })}
             />
-            {isPending && transaction.paymentType === "bitcoin" && (
-              <>
-                <ThemeText textContent={"Confs required"} />
-                <ThemeText
-                  textStyles={{
-                    textAlign: windowWidth > 320 ? "right" : "center",
-                  }}
-                  textContent={
-                    transaction.details.direction === "INCOMING" ? "3" : "2"
-                  }
-                />
-              </>
+            <Info label={t("constants.type")} value={paymentType} />
+            {isLRC20Payment && (
+              <Info
+                label={t("constants.token")}
+                value={selectedToken?.tokenMetadata?.tokenTicker
+                  ?.toUpperCase()
+                  ?.slice(0, TOKEN_TICKER_MAX_LENGTH)}
+              />
             )}
-            {renderLRC20TokenRow()}
           </div>
-          {description && (
-            <div className="descriptionContainer">
-              <ThemeText textContent={"Memo"} />
-              <div
-                className="descriptionScrollviewContainer"
-                style={{ backgroundColor: backgroundColor }}
-              >
-                <ThemeText textContent={description} />
-              </div>
-            </div>
-          )}
+
+          <MemoSection
+            initialValue={transaction.details.description}
+            onSave={handleSave}
+            theme={theme}
+            backgroundColor={backgroundColor}
+          />
+
           <CustomButton
-            actionFunction={() =>
-              navigate("/technical-details", { state: { transaction } })
-            }
+            textContent={t("screens.inAccount.expandedTxPage.detailsBTN")}
             buttonStyles={{
-              width: "100%",
-              maxWidth: "max-content",
-              minWidth: "unset",
               backgroundColor: theme ? Colors.dark.text : Colors.light.blue,
               margin: "30px auto",
             }}
             textStyles={{ color: theme ? Colors.light.text : Colors.dark.text }}
-            textContent={"Technical details"}
+            actionFunction={() =>
+              navigate("/technical-details", { state: { transaction } })
+            }
           />
-          <ReceiptDots windowWidth={windowWidth} />
+
+          <ReceiptDots backgroundColor={backgroundColor} />
         </div>
       </div>
     </>
   );
 }
 
-function Border({ windowWidth }) {
-  console.log(windowWidth);
-  const { theme } = useThemeContext();
-  const dotsWidth = windowWidth * 0.95 - 30;
-  const numDots = Math.floor(dotsWidth / 25);
-
-  let dotElements = [];
-
-  for (let index = 0; index < numDots; index++) {
-    dotElements.push(
+function StatusCircle({ isPending, isFailed, colors, backgroundColor, theme }) {
+  return (
+    <div className="paymentStatusContainer" style={{ backgroundColor }}>
       <div
-        key={index}
-        style={{
-          width: "20px",
-          height: "2px",
-          marginRight: "5px",
-          backgroundColor: theme ? Colors.dark.text : Colors.light.background,
-        }}
-      />
-    );
-  }
+        className="paymentStatusOuterContainer"
+        style={{ backgroundColor: colors.bg }}
+      >
+        <div
+          className="paymentStatusFirstCircle"
+          style={{ backgroundColor: colors.outer }}
+        >
+          <div
+            className="paymentStatusSecondCircle"
+            style={{ backgroundColor: colors.inner }}
+          >
+            {isPending ? (
+              <Clock color={theme ? Colors.dark.text : backgroundColor} />
+            ) : isFailed ? (
+              <X color={backgroundColor} />
+            ) : (
+              <Check color={backgroundColor} />
+            )}
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
 
+function PaymentStatus({ isPending, isFailed, colors }) {
   return (
-    <div className="borderElementsContainer">
-      <div className="borderElementScroll">{dotElements}</div>
+    <div className="paymentStatusTextContanier">
+      <ThemeText textStyles={{ margin: 0 }} textContent="Payment status" />
+      <div
+        className="paymentStatusPillContiner"
+        style={{ backgroundColor: colors.bg }}
+      >
+        <ThemeText
+          textStyles={{ color: colors.text }}
+          textContent={
+            isPending ? "Pending" : isFailed ? "Failed" : "Successful"
+          }
+        />
+      </div>
     </div>
   );
 }
 
-function ReceiptDots({ windowWidth }) {
-  const { backgroundColor } = useThemeColors();
-  let dotElements = [];
-  const dotsWidth = windowWidth;
-  const numDots = Math.floor(dotsWidth / 20);
+function Info({ label, value }) {
+  return (
+    <>
+      <ThemeText textStyles={{ margin: 0 }} textContent={label} />
+      <ThemeText textStyles={{ margin: 0 }} textContent={value} />
+    </>
+  );
+}
+
+function MemoSection({ initialValue, onSave, backgroundColor }) {
+  const [editing, setEditing] = useState(false);
+  const [value, setValue] = useState(initialValue || "");
+  const ref = useRef();
 
-  for (let index = 0; index < numDots; index++) {
-    dotElements.push(
-      <div
-        key={index}
-        style={{
-          width: "20px",
-          height: "20px",
-          borderRadius: "10px",
-          backgroundColor: backgroundColor,
-        }}
-      />
-    );
-  }
+  return (
+    <div className="descriptionContainer">
+      <div className="memoHeader">
+        <ThemeText textStyles={{ margin: 0 }} textContent="Memo" />
+        {/* <button className="iconButton" onClick={() => setEditing(true)}>
+          <Pencil size={16} />
+        </button> */}
+      </div>
+
+      {(editing || initialValue) && (
+        <div
+          className="descriptionScrollviewContainer"
+          style={{ backgroundColor }}
+        >
+          {editing ? (
+            <textarea
+              ref={ref}
+              value={value}
+              maxLength={200}
+              onChange={(e) => setValue(e.target.value)}
+              onBlur={async () => {
+                await onSave(value);
+                setEditing(false);
+              }}
+            />
+          ) : (
+            <ThemeText textStyles={{ margin: 0 }} textContent={value} />
+          )}
+        </div>
+      )}
+    </div>
+  );
+}
+
+function Border({ backgroundColor }) {
+  return (
+    <div className="borderElementsContainer">
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+      <div style={{ backgroundColor }} className="border-element" />
+    </div>
+  );
+}
 
+function ReceiptDots({ backgroundColor }) {
   return (
     <div className="dotElementsContainer">
-      <div className="borderElementScroll">{dotElements}</div>
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
+      <div style={{ backgroundColor }} className="dot-element" />
     </div>
   );
 }
+
+function formatTime(date) {
+  return `${String(date.getHours()).padStart(2, "0")}:${String(
+    date.getMinutes()
+  ).padStart(2, "0")}`;
+}
+
+function getStatusColors({ theme, darkModeType, isPending, isFailed }) {
+  if (isPending) {
+    return {
+      outer: theme
+        ? Colors.dark.expandedTxPendingOuter
+        : Colors.light.expandedTxPendingOuter,
+      inner: theme
+        ? Colors.dark.expandedTxPendingInner
+        : Colors.light.expandedTxPendingInner,
+      text: theme ? Colors.dark.text : Colors.light.expandedTxPendingInner,
+      bg: theme
+        ? Colors.dark.expandedTxPendingInner
+        : Colors.light.expandedTxPendingOuter,
+    };
+  }
+
+  if (isFailed) {
+    return {
+      outer:
+        theme && darkModeType
+          ? Colors.lightsout.backgroundOffset
+          : Colors.light.expandedTxFailed,
+      inner:
+        theme && darkModeType ? Colors.dark.text : Colors.constants.cancelRed,
+      text:
+        theme && darkModeType ? Colors.dark.text : Colors.constants.cancelRed,
+      bg:
+        theme && darkModeType
+          ? Colors.lightsout.background
+          : Colors.light.expandedTxFailed,
+    };
+  }
+
+  return {
+    outer: theme
+      ? Colors.dark.expandedTxConfimred
+      : Colors.light.expandedTxConfimred,
+    inner: theme ? Colors.dark.text : Colors.constants.blue,
+    text: theme ? Colors.dark.text : Colors.constants.blue,
+    bg: theme
+      ? Colors.dark.expandedTxConfimred
+      : Colors.light.expandedTxConfimred,
+  };
+}
diff --git a/src/pages/expandedTxPage/style.css b/src/pages/expandedTxPage/style.css
index 1a07d2c..3f12feb 100644
--- a/src/pages/expandedTxPage/style.css
+++ b/src/pages/expandedTxPage/style.css
@@ -1,156 +1,254 @@
+/* Root container */
 .expandedTxContainer {
-  height: 100%;
-  max-width: 600px;
   width: 95%;
-  align-self: center;
-  overflow-y: scroll;
+  max-width: 600px;
+  margin: 0 auto;
+  height: 100%;
+  overflow-y: auto;
 }
-.expandedTxContainer .receiptContainer {
+
+/* Receipt */
+.receiptContainer {
+  position: relative;
   width: 100%;
-  height: auto;
-  border-top-right-radius: 20px;
   border-top-left-radius: 20px;
-  padding: 15px;
+  border-top-right-radius: 20px;
+  padding: 20px;
   padding-top: 40px;
+  margin-top: 70px;
   display: flex;
-  align-items: center;
   flex-direction: column;
-  margin-top: 80px;
-  margin-bottom: 20px;
-  position: relative;
+  align-items: center;
 }
 
-.expandedTxContainer .receiptContainer .paymentStatusOuterContainer {
-  width: 100px;
-  height: 100px;
+/* =========================
+   STATUS CIRCLE
+========================= */
+
+.paymentStatusContainer {
   position: absolute;
   top: -70px;
-  border-radius: 50px;
+  width: 120px;
+  height: 120px;
+  border-radius: 50%;
+  overflow: hidden;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.paymentStatusOuterContainer {
+  width: 100px;
+  height: 100px;
   display: flex;
   align-items: center;
   justify-content: center;
+  overflow: hidden;
+  border-radius: 50%;
 }
-.expandedTxContainer
-  .receiptContainer
-  .paymentStatusOuterContainer
-  .paymentStatusFirstCircle {
+
+.paymentStatusFirstCircle {
   width: 80px;
   height: 80px;
-  border-radius: 40px;
+  border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
 }
-.expandedTxContainer
-  .receiptContainer
-  .paymentStatusOuterContainer
-  .paymentStatusSecondCircle {
+
+.paymentStatusSecondCircle {
   width: 60px;
   height: 60px;
-  border-radius: 40px;
+  border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
 }
-.expandedTxContainer .receiptContainer .paymentStatusIcon {
-  width: 60%;
-  height: 60%;
+
+.paymentStatusSecondCircle svg {
+  width: 26px;
+  height: 26px;
 }
-.expandedTxContainer .receiptContainer .receiveAmountLabel {
-  font-size: 20px;
-  text-align: center;
+
+/* =========================
+   AMOUNT + LABEL
+========================= */
+
+.receiveAmountLabel {
   margin-top: 20px;
+  text-align: center;
+  margin-bottom: 0;
+}
+
+.amountContainer {
+  margin-top: 8px;
 }
 
-.expandedTxContainer .paymentStatusTextContanier {
+/* =========================
+   PAYMENT STATUS ROW
+========================= */
+
+.paymentStatusTextContanier {
+  width: 100%;
+  max-width: 320px;
   display: flex;
-  align-items: center;
   justify-content: space-between;
-  width: 100%;
-  max-width: 300px;
-  margin-top: 30px;
-  margin-bottom: 10px;
+  align-items: center;
+  margin-top: 24px;
 }
-.expandedTxContainer .paymentStatusPillContiner {
-  padding: 2px 15px;
-  border-radius: 20px;
+
+.paymentStatusPillContiner {
+  padding: 6px 16px;
+  border-radius: 16px;
 }
-.expandedTxContainer .paymentStatusPillContiner p {
+
+.paymentStatusPillContiner p {
   margin: 0;
+  white-space: nowrap;
 }
 
-.expandedTxContainer .borderElementsContainer {
+/* =========================
+   BORDER DOTS
+========================= */
+
+.borderElementsContainer {
   width: 100%;
   display: flex;
   justify-content: space-between;
-  overflow: hidden;
-}
-.expandedTxContainer .borderElementScroll {
-  width: max-content;
+  margin: 20px 0 10px;
   display: flex;
-  justify-content: space-between;
+  gap: 5px;
 }
-.expandedTxContainer .dotElementsContainer {
-  position: absolute;
-  bottom: -10px;
+.borderElementsContainer .border-element {
+  width: calc(100% / 25);
+  height: 2px;
+  background-color: red;
+}
+
+/* =========================
+   CONTACT ROW
+========================= */
+
+.contactRow {
   width: 100%;
   display: flex;
-  justify-content: space-between;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 10px;
+  padding: 10px;
+  border-radius: 8px;
+}
+
+.profileImage {
+  width: 50px;
+  height: 50px;
+  border-radius: 50%;
   overflow: hidden;
+  margin-right: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.profileImage img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
 }
-.expandedTxContainer .infoGridContainer {
+
+/* =========================
+   DETAILS GRID
+========================= */
+
+.infoGridContainer {
   width: 100%;
-  max-width: 250px;
+  max-width: 320px;
   display: grid;
   grid-template-columns: 1fr 1fr;
-  align-items: center;
+  gap: 12px 8px;
+  margin-top: 10px;
 }
 
-.expandedTxContainer .infoGridContainer p:nth-child(2n) {
+.infoGridContainer p:nth-child(2n) {
+  text-align: right;
   margin: 0;
 }
 
-.expandedTxContainer .descriptionContainer {
+/* =========================
+   MEMO SECTION
+========================= */
+
+.descriptionContainer {
   width: 100%;
-  max-width: 300px;
+  max-width: 320px;
+  margin-top: 20px;
+}
+
+.memoHeader {
   display: flex;
-  flex-direction: column;
+  justify-content: space-between;
   align-items: center;
-  margin-top: 20px;
+  margin-bottom: 12px;
+}
+
+.iconButton {
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: 4px;
 }
-.expandedTxContainer .descriptionScrollviewContainer {
+
+.descriptionScrollviewContainer {
   width: 100%;
-  max-width: 300px;
   height: 100px;
-  padding: 10px;
+  padding: 12px;
   border-radius: 8px;
-  overflow-y: scroll;
+  overflow-y: auto;
 }
-.expandedTxContainer .descriptionScrollviewContainer p {
-  margin: 0;
+
+.descriptionScrollviewContainer textarea {
+  width: 100%;
+  height: 100%;
+  resize: none;
+  border: none;
+  outline: none;
+  background: transparent;
+  font-size: 14px;
+  font-family: inherit;
 }
 
-@media screen and (max-width: 320px) {
-  .expandedTxContainer .paymentStatusTextContanier {
+/* =========================
+   RECEIPT DOTS
+========================= */
+
+.dotElementsContainer {
+  position: absolute;
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  bottom: -7.5px;
+}
+.dotElementsContainer .dot-element {
+  width: 15px;
+  height: 15px;
+  border-radius: 50%;
+}
+
+/* =========================
+   RESPONSIVE
+========================= */
+
+@media (max-width: 320px) {
+  .paymentStatusTextContanier {
     flex-direction: column;
-    margin-bottom: 20px;
-  }
-  .expandedTxContainer .paymentStatusTextContanier p {
-    margin: 0;
-    text-align: center;
+    gap: 8px;
   }
 
-  .expandedTxContainer .infoGridContainer {
+  .infoGridContainer {
     grid-template-columns: 1fr;
     text-align: center;
   }
-  .expandedTxContainer .infoGridContainer p:nth-child(1n) {
-    margin-bottom: 0px;
-  }
-}
 
-@media screen and (max-width: 200px) {
-  .expandedTxContainer .receiptContainer .receiveAmountLabel {
-    font-size: 16px;
+  .infoGridContainer p:nth-child(2n) {
+    text-align: center;
   }
 }
diff --git a/src/pages/informationPopup/index.jsx b/src/pages/informationPopup/index.jsx
index b3afd28..af52a9d 100644
--- a/src/pages/informationPopup/index.jsx
+++ b/src/pages/informationPopup/index.jsx
@@ -7,8 +7,7 @@ import CustomButton from "../../components/customButton/customButton";
 import { useThemeContext } from "../../contexts/themeContext";
 import useThemeColors from "../../hooks/useThemeColors";
 import ThemeText from "../../components/themeText/themeText";
-import ThemeImage from "../../components/ThemeImage/themeImage";
-import { xSmallIcon } from "../../constants/icons";
+import { X } from "lucide-react";
 
 export default function InformationPopup({ overlay, onClose }) {
   const navigate = useNavigate();
@@ -63,10 +62,11 @@ export default function InformationPopup({ overlay, onClose }) {
             className="contentContainer"
             onClick={(e) => e.stopPropagation()}
           >
-            <ThemeImage
-              clickFunction={handleOkClick}
-              className="closeImage"
-              icon={xSmallIcon}
+            <X
+              onClick={handleOkClick}
+              color={
+                theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+              }
             />
             <ThemeText className={"message"} textContent={errorMessage} />
 
diff --git a/src/pages/loadingScreen/index.jsx b/src/pages/loadingScreen/index.jsx
index bec6bee..d8d671c 100644
--- a/src/pages/loadingScreen/index.jsx
+++ b/src/pages/loadingScreen/index.jsx
@@ -22,6 +22,7 @@ import { useThemeContext } from "../../contexts/themeContext.jsx";
 import useThemeColors from "../../hooks/useThemeColors.js";
 import loadNewFiatData from "../../functions/saveAndUpdateFiatData.js";
 import Storage from "../../functions/localStorage.js";
+import { useTranslation } from "react-i18next";
 
 export default function LoadingScreen() {
   const didInitializeMessageIntervalRef = useRef(false);
@@ -30,29 +31,27 @@ export default function LoadingScreen() {
   const navigate = useNavigate();
   const { theme, darkModeType } = useThemeContext();
   const { textColor } = useThemeColors();
+  const { connectToSparkWallet } = useSpark();
   const {
-    setStartConnectingToSpark,
-    setNumberOfCachedTxs,
-    connectToSparkWallet,
-  } = useSpark();
-  const { toggleMasterInfoObject, masterInfoObject, setMasterInfoObject } =
-    useGlobalContextProvider();
+    toggleMasterInfoObject,
+    masterInfoObject,
+    setMasterInfoObject,
+    preloadedUserData,
+    setPreLoadedUserData,
+  } = useGlobalContextProvider();
   const { mnemoinc } = useAuth();
-  const { toggleContactsPrivateKey, contactsPrivateKey, publicKey } =
-    useKeysContext();
+  const { toggleContactsPrivateKey } = useKeysContext();
   const { toggleGlobalContactsInformation, globalContactsInformation } =
     useGlobalContacts();
-  const { onLiquidBreezEvent } = useLiquidEvent();
+  const didRunConnectionRef = useRef(false);
+  const { t } = useTranslation();
+
   const { toggleGlobalAppDataInformation } = useGlobalAppData();
-  const { setBitcoinPriceArray, toggleSelectedBitcoinPrice } =
-    useBitcoinPriceContext();
-  const { toggleFiatStats, toggleLiquidNodeInformation } = useNodeContext();
+
   const [loadingMessage, setLoadingMessage] = useState(
     "Please don't leave the tab"
   );
   const [hasError, setHasError] = useState("");
-  const [didOpenDatabases, setDidOpenDatabases] = useState(false);
-  const numberOfCachedTransactionsRef = useRef(null);
 
   useEffect(() => {
     if (didInitializeMessageIntervalRef.current) return;
@@ -71,54 +70,79 @@ export default function LoadingScreen() {
   }, []);
 
   useEffect(() => {
-    async function retriveExternalData() {
+    async function startConnectProcess() {
+      const startTime = Date.now();
+
       try {
+        console.log("Process 1", new Date().getTime());
         connectToSparkWallet();
-        const [didOpen, posTransactions, sparkTxs] = await Promise.all([
-          initializeDatabase(),
-          initializePOSTransactionsDatabase(),
-          initializeSparkDatabase(),
-        ]);
-        if (!didOpen || !posTransactions || !sparkTxs)
-          throw new Error("Database initialization failed");
-
-        const [txs, initWallet] = await Promise.all([
-          getCachedSparkTransactions(),
-          initializeUserSettings(
+
+        const hasSavedInfo = Object.keys(masterInfoObject || {}).length > 5; //arbitrary number but filters out onboarding items
+
+        if (!hasSavedInfo) {
+          // connectToLiquidNode(accountMnemoinc);
+          const [
+            didOpen,
+            giftCardTable,
+            posTransactions,
+            // sparkTxs,
+            // rootstockSwaps,
+          ] = await Promise.all([
+            initializeDatabase(),
+            initializePOSTransactionsDatabase(),
+            initializeSparkDatabase(),
+          ]);
+
+          if (!didOpen || !posTransactions || !giftCardTable)
+            throw new Error("Database initialization failed");
+
+          const didLoadUserSettings = await initializeUserSettings({
             mnemoinc,
             toggleContactsPrivateKey,
             setMasterInfoObject,
             toggleGlobalContactsInformation,
-            toggleGlobalAppDataInformation
-          ),
-        ]);
+            // toggleGLobalEcashInformation,
+            toggleGlobalAppDataInformation,
+            toggleMasterInfoObject,
+            preloadedData: preloadedUserData.data,
+            setPreLoadedUserData,
+          });
+
+          console.log("Process 2", new Date().getTime());
+
+          if (!didLoadUserSettings)
+            throw new Error(
+              t("screens.inAccount.loadingScreen.userSettingsError")
+            );
+        }
 
-        if (!initWallet) throw new Error("Error loading user profile");
+        console.log("Process 3", new Date().getTime());
 
-        numberOfCachedTransactionsRef.current = txs;
-        setDidOpenDatabases(true);
+        const elapsedTime = Date.now() - startTime;
+        const remainingTime = Math.max(
+          0,
+          (hasSavedInfo ? 500 : 800) - elapsedTime
+        );
+
+        if (remainingTime > 0) {
+          console.log(
+            `Waiting ${remainingTime}ms to reach minimum 1s duration`
+          );
+          await new Promise((resolve) => setTimeout(resolve, remainingTime));
+        }
+
+        navigate("/wallet", { replace: true });
       } catch (err) {
+        console.log("intializatiion error", err);
         setHasError(err.message);
       }
     }
-    if (!mnemoinc) return;
-    if (didInitializeWalletRef.current) return;
-    didInitializeWalletRef.current = true;
-    retriveExternalData();
-  }, [mnemoinc]);
+    if (preloadedUserData.isLoading && !preloadedUserData.data) return;
+    if (didRunConnectionRef.current) return;
+    didRunConnectionRef.current = true;
 
-  useEffect(() => {
-    if (
-      Object.keys(masterInfoObject).length === 0 ||
-      didLoadInformation.current ||
-      Object.keys(globalContactsInformation).length === 0 ||
-      !didOpenDatabases
-    )
-      return;
-    didLoadInformation.current = true;
-
-    initWallet(numberOfCachedTransactionsRef.current);
-  }, [masterInfoObject, globalContactsInformation]);
+    startConnectProcess();
+  }, [preloadedUserData, masterInfoObject]);
 
   return (
     <div id="loadingScreenContainer">
@@ -131,88 +155,4 @@ export default function LoadingScreen() {
       />
     </div>
   );
-  async function initWallet(txs) {
-    console.log("HOME RENDER BREEZ EVENT FIRST LOAD");
-
-    try {
-      setStartConnectingToSpark(true);
-      console.log(txs, "CACHED TRANSACTIONS");
-      setNumberOfCachedTxs(txs?.length || 0);
-
-      const didSetLiquid = await setLiquidNodeInformationForSession();
-
-      // Same thing for here, if liquid does not set continue on in the process
-      if (didSetLiquid) {
-        navigate("/wallet", { replace: true });
-      } else
-        throw new Error(
-          "Wallet information was not set properly, please try again."
-        );
-    } catch (err) {
-      setHasError(String(err.message));
-      console.log(err, "homepage connection to node err");
-    }
-  }
-
-  async function setupFiatCurrencies() {
-    const currency = masterInfoObject.fiatCurrency;
-
-    let fiatRate;
-    try {
-      fiatRate = await loadNewFiatData(
-        currency,
-        contactsPrivateKey,
-        publicKey,
-        masterInfoObject
-      );
-
-      if (!fiatRate.didWork) {
-        // fallback API
-        const response = await fetch(import.meta.env.FALLBACK_FIAT_PRICE_DATA);
-        const data = await response.json();
-        if (data[currency]?.["15m"]) {
-          // ✅ 4. Store in new format
-          Storage.setItem("didFetchFiatRateToday", {
-            lastFetched: new Date().getTime(),
-            fiatRate: {
-              coin: currency,
-              value: data[currency]?.["15m"],
-            },
-          });
-          Storage.setItem("cachedBitcoinPrice", {
-            coin: currency,
-            value: data[currency]?.["15m"],
-          });
-
-          fiatRate = {
-            coin: currency,
-            value: data[currency]?.["15m"],
-          };
-        } else {
-          fiatRate = {
-            coin: currency,
-            value: 100_000, // random number to make sure nothing else down the line errors out
-          };
-        }
-      } else fiatRate = fiatRate.fiatRateResponse;
-    } catch (error) {
-      console.error("Failed to fetch fiat data:", error);
-      return { coin: "USD", value: 100_000 };
-    }
-
-    return fiatRate;
-  }
-
-  async function setLiquidNodeInformationForSession() {
-    try {
-      const [fiat_rate] = await Promise.all([setupFiatCurrencies()]);
-
-      toggleFiatStats(fiat_rate);
-
-      return true;
-    } catch (err) {
-      console.log(err, "LIQUID INFORMATION ERROR");
-      return false;
-    }
-  }
 }
diff --git a/src/pages/login/login.jsx b/src/pages/login/login.jsx
index 3618892..ea4f870 100644
--- a/src/pages/login/login.jsx
+++ b/src/pages/login/login.jsx
@@ -9,8 +9,10 @@ import { Colors } from "../../constants/theme";
 import { useThemeContext } from "../../contexts/themeContext";
 import useThemeColors from "../../hooks/useThemeColors";
 import ThemeText from "../../components/themeText/themeText";
+import { useOverlay } from "../../contexts/overlayContext";
 
-function Login({ openOverlay }) {
+function Login() {
+  const { openOverlay } = useOverlay();
   const { theme, darkModeType } = useThemeContext();
   const { backgroundOffset, textInputBackground, textInputColor, textColor } =
     useThemeColors();
diff --git a/src/pages/receiveAmount/style.css b/src/pages/receiveAmount/style.css
index 54e29bb..a4a633c 100644
--- a/src/pages/receiveAmount/style.css
+++ b/src/pages/receiveAmount/style.css
@@ -42,7 +42,7 @@
 
 .description-input {
   width: 100%;
-  padding: 15px;
+  padding: 10px;
   border: unset;
   border-radius: 8px;
 }
diff --git a/src/pages/receiveQRPage/components/buttonContainer.jsx b/src/pages/receiveQRPage/components/buttonContainer.jsx
index 2a5345d..c2c209b 100644
--- a/src/pages/receiveQRPage/components/buttonContainer.jsx
+++ b/src/pages/receiveQRPage/components/buttonContainer.jsx
@@ -7,6 +7,7 @@ import CustomButton from "../../../components/customButton/customButton";
 import { useThemeContext } from "../../../contexts/themeContext";
 import { Colors } from "../../../constants/theme";
 import useThemeColors from "../../../hooks/useThemeColors";
+import { useOverlay } from "../../../contexts/overlayContext";
 
 export default function ReceiveButtonsContainer({
   generatingInvoiceQRCode,
@@ -14,8 +15,8 @@ export default function ReceiveButtonsContainer({
   receiveOption,
   initialSendAmount,
   description,
-  openOverlay,
 }) {
+  const { openOverlay } = useOverlay();
   const navigate = useNavigate();
   const location = useLocation();
   const { theme, darkModeType } = useThemeContext();
diff --git a/src/pages/receiveQRPage/receiveQRPage.jsx b/src/pages/receiveQRPage/receiveQRPage.jsx
index 990b543..cc0dc56 100644
--- a/src/pages/receiveQRPage/receiveQRPage.jsx
+++ b/src/pages/receiveQRPage/receiveQRPage.jsx
@@ -11,17 +11,18 @@ import FormattedSatText from "../../components/formattedSatText/formattedSatText
 import { useThemeContext } from "../../contexts/themeContext";
 import useThemeColors from "../../hooks/useThemeColors";
 import ThemeText from "../../components/themeText/themeText";
-import ThemeImage from "../../components/ThemeImage/themeImage";
 import { useActiveCustodyAccount } from "../../contexts/activeAccount";
 import { encodeLNURL } from "../../functions/lnurl/bench32Formmater";
 import FullLoadingScreen from "../../components/fullLoadingScreen/fullLoadingScreen";
-import { aboutIcon, editIconLight } from "../../constants/icons";
 import { useGlobalContextProvider } from "../../contexts/masterInfoObject";
 import { useNodeContext } from "../../contexts/nodeContext";
 import displayCorrectDenomination from "../../functions/displayCorrectDenomination";
 import { Colors } from "../../constants/theme";
+import { useOverlay } from "../../contexts/overlayContext";
+import { Edit, Info } from "lucide-react";
 
-export default function ReceiveQRPage({ openOverlay }) {
+export default function ReceiveQRPage() {
+  const { openOverlay } = useOverlay();
   const { masterInfoObject } = useGlobalContextProvider();
   const { fiatStats } = useNodeContext();
   const { globalContactsInformation } = useGlobalContacts();
@@ -81,18 +82,6 @@ export default function ReceiveQRPage({ openOverlay }) {
     globalContactsInformation?.myProfile?.uniqueName,
   ]);
 
-  useEffect(() => {
-    if (selectedRecieveOption !== "bitcoin") return;
-    // requestAnimationFrame(() => {
-    //   navigate("/error", {
-    //     state: {
-    //       errorMessage:
-    //         "Currently, on-chain payment addresses are single-use only...",
-    //     },
-    //   });
-    // });
-  }, [selectedRecieveOption, navigate]);
-
   return (
     <div className="receiveQrPage">
       <TopBar
@@ -125,6 +114,7 @@ export default function ReceiveQRPage({ openOverlay }) {
             masterInfoObject={masterInfoObject}
             fiatStats={fiatStats}
             openOverlay={openOverlay}
+            darkModeType={darkModeType}
           />
         )}
         <ReceiveButtonsContainer
@@ -158,10 +148,15 @@ export default function ReceiveQRPage({ openOverlay }) {
           }}
         >
           <div className="feeTextContainer">
-            <ThemeText textStyles={{ margin: 0 }} textContent={"Fee"} />
-            <ThemeImage
-              styles={{ width: 15, height: 15, marginLeft: "5px" }}
-              icon={aboutIcon}
+            <ThemeText
+              textStyles={{ margin: 0, marginRight: 5 }}
+              textContent={"Fee"}
+            />
+            <Info
+              size={15}
+              color={
+                theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+              }
             />
           </div>
           {selectedRecieveOption.toLowerCase() === "bitcoin" ? (
@@ -185,6 +180,7 @@ function LNURLContainer({
   masterInfoObject,
   fiatStats,
   openOverlay,
+  darkModeType,
 }) {
   return (
     <div
@@ -200,9 +196,6 @@ function LNURLContainer({
           for: "halfModal",
           contentType: "editLNURLOnReceive",
         });
-        navigate.navigate("CustomHalfModal", {
-          wantedContent: "editLNURLOnReceive",
-        });
       }}
       className="lnurlContainer"
     >
@@ -229,14 +222,11 @@ function LNURLContainer({
       />
       {selectedRecieveOption.toLowerCase() === "lightning" &&
         !initialSendAmount && (
-          <ThemeImage
-            filter={
-              theme
-                ? undefined
-                : "brightness(0) saturate(100%) invert(26%) sepia(93%) saturate(3135%) hue-rotate(205deg) brightness(106%) contrast(97%)"
+          <Edit
+            size={20}
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
             }
-            styles={{ height: 20, width: 20 }}
-            icon={editIconLight}
           />
         )}
     </div>
diff --git a/src/pages/restoreWallet/restoreWallet.jsx b/src/pages/restoreWallet/restoreWallet.jsx
index 473c3aa..c55b908 100644
--- a/src/pages/restoreWallet/restoreWallet.jsx
+++ b/src/pages/restoreWallet/restoreWallet.jsx
@@ -16,6 +16,7 @@ import { Colors } from "../../constants/theme";
 import { validateMnemonic } from "@scure/bip39";
 import { wordlist } from "@scure/bip39/wordlists/english";
 import { handleRestoreFromText } from "../../functions/seed";
+import { useOverlay } from "../../contexts/overlayContext";
 
 const NUMARRAY = Array.from({ length: 12 }, (_, i) => i + 1);
 const INITIAL_KEY_STATE = NUMARRAY.reduce((acc, num) => {
@@ -23,7 +24,8 @@ const INITIAL_KEY_STATE = NUMARRAY.reduce((acc, num) => {
   return acc;
 }, {});
 
-export default function RestoreWallet({ openOverlay }) {
+export default function RestoreWallet() {
+  const { openOverlay } = useOverlay();
   const location = useLocation();
   const params = location.state;
   const navigate = useNavigate();
diff --git a/src/pages/sendPage/components/acceptButton.jsx b/src/pages/sendPage/components/acceptButton.jsx
index 952ded6..64925f1 100644
--- a/src/pages/sendPage/components/acceptButton.jsx
+++ b/src/pages/sendPage/components/acceptButton.jsx
@@ -28,7 +28,7 @@ export default function AcceptButtonSendPage({
   sparkInformation,
   seletctedToken,
   isLRC20Payment,
-  sendWebViewRequest,
+
   openOverlay,
 }) {
   const { t } = useTranslation();
@@ -215,7 +215,6 @@ export default function AcceptButtonSendPage({
         seletctedToken,
         currentWalletMnemoinc,
         t,
-        sendWebViewRequest,
       });
     } catch (error) {
       console.log("Accept button error:", error);
diff --git a/src/pages/sendPage/components/feeInfo.css b/src/pages/sendPage/components/feeInfo.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/pages/sendPage/components/feeInfo.jsx b/src/pages/sendPage/components/feeInfo.jsx
new file mode 100644
index 0000000..09f079b
--- /dev/null
+++ b/src/pages/sendPage/components/feeInfo.jsx
@@ -0,0 +1,38 @@
+import { useTranslation } from "react-i18next";
+
+import ThemeText from "../../../components/themeText/themeText";
+import FormattedSatText from "../../../components/formattedSatText/formattedSatText";
+
+export default function SendTransactionFeeInfo({
+  paymentFee,
+  isLightningPayment,
+  isLiquidPayment,
+  isBitcoinPayment,
+  isSparkPayment,
+}) {
+  const { t } = useTranslation();
+  return (
+    <>
+      <ThemeText
+        textStyles={{ marginTop: 30, marginBottom: 0 }}
+        textContent={t("wallet.sendPages.feeInfo.title")}
+      />
+      <FormattedSatText
+        backText={t("wallet.sendPages.feeInfo.backTextToAmount", {
+          amount:
+            isLightningPayment || isLiquidPayment || isSparkPayment
+              ? ` ${t("constants.andLower")} ${t("constants.instant")}`
+              : ` ${t("constants.andLower")} ${t(
+                  "wallet.sendPages.feeInfo.tenMinutes",
+                  {
+                    numMins: 10,
+                  }
+                )}`,
+        })}
+        neverHideBalance={true}
+        styles={{ margin: 0 }}
+        balance={paymentFee}
+      />
+    </>
+  );
+}
diff --git a/src/pages/sendPage/components/invoiceInfo.css b/src/pages/sendPage/components/invoiceInfo.css
new file mode 100644
index 0000000..7390943
--- /dev/null
+++ b/src/pages/sendPage/components/invoiceInfo.css
@@ -0,0 +1,35 @@
+.invoiceContainer {
+  width: 80%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 8px;
+  border-radius: 8px;
+  margin-top: 30px;
+  cursor: pointer;
+  transition: opacity 0.2s;
+}
+
+.invoiceContainer .contactRow {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin: 0;
+  padding: 0;
+}
+
+.invoiceContainer .profileImage {
+  width: 40px;
+  height: 40px;
+  border-radius: 20px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  margin-right: 10px;
+}
+
+.invoiceContainer .addressText {
+  flex-shrink: 1;
+  margin: 0;
+}
diff --git a/src/pages/sendPage/components/invoiceInfo.jsx b/src/pages/sendPage/components/invoiceInfo.jsx
new file mode 100644
index 0000000..efa518e
--- /dev/null
+++ b/src/pages/sendPage/components/invoiceInfo.jsx
@@ -0,0 +1,66 @@
+import { InputTypes } from "bitcoin-address-parser";
+import formatSparkPaymentAddress from "../../../functions/sendBitcoin/formatSparkPaymentAddress";
+import useThemeColors from "../../../hooks/useThemeColors";
+import { useOverlay } from "../../../contexts/overlayContext";
+import ThemeText from "../../../components/themeText/themeText";
+import ContactProfileImage from "../../contacts/components/profileImage/profileImage";
+import "./invoiceInfo.css";
+
+export default function InvoiceInfo({
+  paymentInfo,
+  fromPage,
+  contactInfo,
+  theme,
+  darkModeType,
+}) {
+  const formmateedSparkPaymentInfo = formatSparkPaymentAddress(paymentInfo);
+  const { backgroundOffset, backgroundColor } = useThemeColors();
+  const { openOverlay } = useOverlay();
+
+  return (
+    <div
+      className="invoiceContainer"
+      onClick={() => {
+        openOverlay({
+          for: "error",
+          errorMessage: formmateedSparkPaymentInfo.address,
+        });
+      }}
+      style={{
+        backgroundColor: backgroundOffset,
+      }}
+    >
+      {fromPage === "contacts" ? (
+        <div className="contactRow">
+          <div
+            className="profileImage"
+            style={{
+              backgroundColor: backgroundColor,
+            }}
+          >
+            <ContactProfileImage
+              updated={contactInfo?.imageData?.updated}
+              uri={contactInfo?.imageData?.localUri}
+              darkModeType={darkModeType}
+              theme={theme}
+            />
+          </div>
+          <ThemeText
+            className={"addressText"}
+            CustomNumberOfLines={1}
+            textContent={contactInfo?.name || ""}
+          />
+        </div>
+      ) : (
+        <ThemeText
+          CustomNumberOfLines={2}
+          textContent={
+            paymentInfo?.type === InputTypes.LNURL_PAY
+              ? paymentInfo.data.address
+              : formmateedSparkPaymentInfo.address
+          }
+        />
+      )}
+    </div>
+  );
+}
diff --git a/src/pages/sendPage/sendPage.jsx b/src/pages/sendPage/sendPage.jsx
index a1319b8..03c3bbc 100644
--- a/src/pages/sendPage/sendPage.jsx
+++ b/src/pages/sendPage/sendPage.jsx
@@ -18,26 +18,32 @@ import {
   SMALLEST_ONCHAIN_SPARK_SEND_AMOUNT,
 } from "../../constants";
 import CustomInput from "../../components/customInput/customInput";
-import CustomNumberKeyboard from "../../components/customNumberKeyboard/customNumberKeyboard";
 import NumberInputSendPage from "./components/numberInput";
 import CustomButton from "../../components/customButton/customButton";
-import { getBoltzApiUrl } from "../../functions/boltz/boltzEndpoitns";
-
 import displayCorrectDenomination from "../../functions/displayCorrectDenomination";
 import FormattedSatText from "../../components/formattedSatText/formattedSatText";
 import formatSparkPaymentAddress from "../../functions/sendBitcoin/formatSparkPaymentAddress";
 import { useActiveCustodyAccount } from "../../contexts/activeAccount";
 import { useTranslation } from "react-i18next";
 import { InputTypes } from "bitcoin-address-parser";
-import ThemeImage from "../../components/ThemeImage/themeImage";
-import { adminHomeWallet } from "../../constants/icons";
 import ThemeText from "../../components/themeText/themeText";
 import SelectLRC20Token from "./components/selectLRC20Token";
 import { formatTokensNumber } from "../../functions/lrc20/formatTokensBalance";
 import CustomSettingsNavbar from "../../components/customSettingsNavbar";
 import AcceptButtonSendPage from "./components/acceptButton";
+import { useOverlay } from "../../contexts/overlayContext";
+import NavBarWithBalance from "../../components/navBarWithBalance/navbarWithBalance";
+import {
+  handlePaymentUpdate,
+  publishMessage,
+} from "../../functions/messaging/publishMessage";
+import { useKeysContext } from "../../contexts/keysContext";
+import SendTransactionFeeInfo from "./components/feeInfo";
+import { useThemeContext } from "../../contexts/themeContext";
+import InvoiceInfo from "./components/invoiceInfo";
 
-export default function SendPage({ openOverlay }) {
+export default function SendPage() {
+  const { openOverlay } = useOverlay();
   const location = useLocation();
   const { sparkInformation } = useSpark();
   const params = location.state || {};
@@ -49,10 +55,14 @@ export default function SendPage({ openOverlay }) {
     comingFromAccept,
     enteredPaymentInfo,
     errorMessage: globalError,
+    contactInfo,
   } = params;
+  console.log(params, "oi");
   const [paymentInfo, setPaymentInfo] = useState({});
   const { masterInfoObject, toggleMasterInfoObject } =
     useGlobalContextProvider();
+  const { theme, darkModeType } = useThemeContext();
+  const { contactsPrivateKey, publicKey } = useKeysContext();
   const { currentWalletMnemoinc } = useActiveCustodyAccount();
   const { liquidNodeInformation, fiatStats } = useNodeContext();
   const { minMaxLiquidSwapAmounts } = useAppStatus();
@@ -223,11 +233,34 @@ export default function SendPage({ openOverlay }) {
         usingZeroAmountInvoice: paymentInfo.usingZeroAmountInvoice,
         seletctedToken: selectedLRC20Asset,
         mnemonic: currentWalletMnemoinc,
+        contactInfo,
+        fromMainSendScreen: true,
       };
       // Shouuld be same for all paymetns
       const paymentResponse = await sparkPaymenWrapper(paymentObject);
 
       if (paymentResponse.didWork) {
+        if (fromPage?.includes("contacts") && paymentResponse.response?.id) {
+          if (fromPage === "contacts-request") {
+            handlePaymentUpdate({
+              transaction: params.publishMessageFuncParams.transaction,
+              didPay: params.publishMessageFuncParams.didPay,
+              txid: paymentResponse.response?.id,
+              globalContactsInformation:
+                params.publishMessageFuncParams.globalContactsInformation,
+              selectedContact: params.publishMessageFuncParams.selectedContact,
+              currentTime: params.publishMessageFuncParams.currentTime,
+              contactsPrivateKey,
+              publicKey,
+              masterInfoObject,
+            });
+          } else {
+            const sendObject = params.publishMessageFuncParams;
+            sendObject.data.txid = paymentResponse.response?.id;
+            console.log(sendObject);
+            publishMessage(sendObject);
+          }
+        }
         navigate("/confirm-page", {
           state: {
             for: "paymentsucceed",
@@ -416,40 +449,7 @@ export default function SendPage({ openOverlay }) {
 
   return (
     <div className="sendContainer">
-      <div className="navBar">
-        <BackArrow
-          backFunction={
-            enabledLRC20 &&
-            Object.keys(seletctedToken).length &&
-            paymentInfo.type === "spark"
-              ? clearSettings
-              : goBackFunction
-          }
-        />
-        <div className="label">
-          <ThemeImage
-            styles={{ width: 20, height: 20 }}
-            alt="wallet icon to show user balance"
-            icon={adminHomeWallet}
-          />
-          <FormattedSatText
-            neverHideBalance={true}
-            balance={
-              selectedLRC20Asset !== "Bitcoin"
-                ? Number(formattedTokensBalance).toFixed(
-                    formattedTokensBalance < 1 ? 4 : 2
-                  )
-                : sparkInformation.balance
-            }
-            useCustomLabel={
-              seletctedToken?.tokenMetadata?.tokenTicker !== "Bitcoin" &&
-              seletctedToken?.tokenMetadata?.tokenTicker !== undefined
-            }
-            customLabel={seletctedToken?.tokenMetadata?.tokenTicker}
-            useMillionDenomination={true}
-          />
-        </div>
-      </div>
+      <NavBarWithBalance />
       <div className="paymentInfoContainer">
         <div className="balanceContainer">
           <div className="scroll-content">
@@ -488,18 +488,24 @@ export default function SendPage({ openOverlay }) {
 
         {!canEditPaymentAmount && (
           <>
-            <ThemeText
-              textStyles={{ margin: 0, marginTop: 40 }}
-              className="paymentFeeDesc"
-              textContent={"Fee & speed"}
-            />
-            <FormattedSatText
-              styles={{ marginTop: 0 }}
-              balance={totalFee}
-              backText={"and Instant"}
+            <SendTransactionFeeInfo
+              paymentFee={totalFee}
+              isLightningPayment={isLightningPayment}
+              isLiquidPayment={isLiquidPayment}
+              isBitcoinPayment={isBitcoinPayment}
+              isSparkPayment={isSparkPayment}
             />
           </>
         )}
+        {!canEditPaymentAmount && (
+          <InvoiceInfo
+            paymentInfo={paymentInfo}
+            contactInfo={contactInfo}
+            fromPage={fromPage}
+            theme={theme}
+            darkModeType={darkModeType}
+          />
+        )}
 
         {canEditPaymentAmount && (
           <>
diff --git a/src/pages/settings/components/settingsItemWithSlider/settingsItemsWithSlider.jsx b/src/pages/settings/components/settingsItemWithSlider/settingsItemsWithSlider.jsx
index b3f1492..407b79a 100644
--- a/src/pages/settings/components/settingsItemWithSlider/settingsItemsWithSlider.jsx
+++ b/src/pages/settings/components/settingsItemWithSlider/settingsItemsWithSlider.jsx
@@ -5,9 +5,8 @@ import useThemeColors from "../../../../hooks/useThemeColors";
 import { Colors } from "../../../../constants/theme";
 import ThemeText from "../../../../components/themeText/themeText";
 import CustomToggleSwitch from "../../../../components/switch/switch";
-import ThemeImage from "../../../../components/ThemeImage/themeImage";
-import { aboutIcon } from "../../../../constants/icons";
 import FullLoadingScreen from "../../../../components/fullLoadingScreen/fullLoadingScreen";
+import { Info } from "lucide-react";
 
 export default function SettingsItemWithSlider({
   settingsTitle = "",
@@ -23,7 +22,7 @@ export default function SettingsItemWithSlider({
   containerStyles = {},
   openOverlay,
 }) {
-  const { theme } = useThemeContext();
+  const { theme, darkModeType } = useThemeContext();
   const { backgroundOffset, backgroundColor, textColor } = useThemeColors();
 
   const goToInformationPopup = () => {
@@ -72,7 +71,14 @@ export default function SettingsItemWithSlider({
               onClick={goToInformationPopup}
               className="info-button"
             >
-              <ThemeImage styles={{ width: 20, height: 20 }} icon={aboutIcon} />
+              <Info
+                size={20}
+                color={
+                  theme && darkModeType
+                    ? Colors.dark.text
+                    : Colors.constants.blue
+                }
+              />
             </button>
           )}
 
diff --git a/src/pages/settings/pages/about/about.jsx b/src/pages/settings/pages/about/about.jsx
index 9e532de..8bc1d8a 100644
--- a/src/pages/settings/pages/about/about.jsx
+++ b/src/pages/settings/pages/about/about.jsx
@@ -127,7 +127,7 @@ export default function AboutPage() {
           textContent={"Oliver Koblizek"}
         />
       </div>
-      <p style={{ color: textColor }}>Version 0.1.3</p>
+      <p style={{ color: textColor }}>Version 0.1.4</p>
     </div>
   );
 }
diff --git a/src/pages/settings/pages/currency/displayCurrency.jsx b/src/pages/settings/pages/currency/displayCurrency.jsx
index d2a6348..41536ca 100644
--- a/src/pages/settings/pages/currency/displayCurrency.jsx
+++ b/src/pages/settings/pages/currency/displayCurrency.jsx
@@ -14,8 +14,10 @@ import ThemeText from "../../../../components/themeText/themeText";
 import { fiatCurrencies } from "../../../../functions/currencyOptions";
 import { useKeysContext } from "../../../../contexts/keysContext";
 import loadNewFiatData from "../../../../functions/saveAndUpdateFiatData";
+import { useOverlay } from "../../../../contexts/overlayContext";
 
-export default function DisplayCurrency({ openOverlay }) {
+export default function DisplayCurrency() {
+  const { openOverlay } = useOverlay();
   const { masterInfoObject, toggleMasterInfoObject } =
     useGlobalContextProvider();
   const { contactsPrivateKey, publicKey } = useKeysContext();
diff --git a/src/pages/settings/pages/exploreUsers/exploreUsers.jsx b/src/pages/settings/pages/exploreUsers/exploreUsers.jsx
index c836676..a281963 100644
--- a/src/pages/settings/pages/exploreUsers/exploreUsers.jsx
+++ b/src/pages/settings/pages/exploreUsers/exploreUsers.jsx
@@ -145,7 +145,10 @@ export default function ExploreUsers() {
         if (masterInfoObject.exploreData) return;
         const pastExploreData = Storage.getItem("savedExploreData");
 
-        const shouldLoadExporeDataResp = shouldLoadExploreData(pastExploreData);
+        const shouldLoadExporeDataResp = shouldLoadExploreData(
+          pastExploreData,
+          currentTime
+        );
 
         if (!shouldLoadExporeDataResp) {
           toggleMasterInfoObject({ exploreData: pastExploreData.data });
diff --git a/src/pages/settings/pages/fastPay/fastPay.jsx b/src/pages/settings/pages/fastPay/fastPay.jsx
index 85d263c..5ddbd9c 100644
--- a/src/pages/settings/pages/fastPay/fastPay.jsx
+++ b/src/pages/settings/pages/fastPay/fastPay.jsx
@@ -6,8 +6,10 @@ import TextInputWithSliderSettingsItem from "../../components/textInputWithSlide
 import "./fastPay.css";
 import { useThemeContext } from "../../../../contexts/themeContext";
 import useThemeColors from "../../../../hooks/useThemeColors";
+import { useOverlay } from "../../../../contexts/overlayContext";
 
-export default function FastPay({ openOverlay }) {
+export default function FastPay() {
+  const { openOverlay } = useOverlay();
   const { masterInfoObject, toggleMasterInfoObject } =
     useGlobalContextProvider();
   const location = useLocation();
diff --git a/src/pages/settings/pages/sparkInfo/sparkInfo.jsx b/src/pages/settings/pages/sparkInfo/sparkInfo.jsx
index 3a8aa4e..1a0c337 100644
--- a/src/pages/settings/pages/sparkInfo/sparkInfo.jsx
+++ b/src/pages/settings/pages/sparkInfo/sparkInfo.jsx
@@ -6,15 +6,16 @@ import useThemeColors from "../../../../hooks/useThemeColors";
 import { useThemeContext } from "../../../../contexts/themeContext";
 import { Colors } from "../../../../constants/theme";
 import ThemeText from "../../../../components/themeText/themeText";
-import ThemeImage from "../../../../components/ThemeImage/themeImage";
-import { clipboardBlue } from "../../../../constants/icons";
+import { useOverlay } from "../../../../contexts/overlayContext";
+import { ClipboardIcon } from "lucide-react";
 
-export default function SparkInformation({ openOverlay }) {
+export default function SparkInformation() {
+  const { openOverlay } = useOverlay();
   const { sparkInformation } = useSpark();
   const navigate = useNavigate();
   const location = useLocation();
   const { backgroundOffset } = useThemeColors();
-  const { theme } = useThemeContext();
+  const { theme, darkModeType } = useThemeContext();
   return (
     <div id="sparkInfoContainer">
       <div className="contentContainer">
@@ -40,15 +41,19 @@ export default function SparkInformation({ openOverlay }) {
               className="techicalData"
             >
               <ThemeText
-                className="techicalData"
+                textStyles={{ marginRight: 5 }}
                 textContent={`${sparkInformation.sparkAddress.slice(0, 5)}...
                 ${sparkInformation.sparkAddress.slice(
                   sparkInformation.sparkAddress.length - 5
                 )}`}
               />
-              <ThemeImage
-                styles={{ width: 20, height: 20 }}
-                icon={clipboardBlue}
+              <ClipboardIcon
+                size={20}
+                color={
+                  theme && darkModeType
+                    ? Colors.dark.text
+                    : Colors.constants.blue
+                }
               />
             </span>
           </div>
@@ -65,15 +70,19 @@ export default function SparkInformation({ openOverlay }) {
               className="techicalData"
             >
               <ThemeText
-                className="techicalData"
+                textStyles={{ marginRight: 5 }}
                 textContent={`${sparkInformation.identityPubKey.slice(0, 5)}...
                 ${sparkInformation.identityPubKey.slice(
                   sparkInformation.identityPubKey.length - 5
                 )}`}
               />
-              <ThemeImage
-                styles={{ width: 20, height: 20 }}
-                icon={clipboardBlue}
+              <ClipboardIcon
+                size={20}
+                color={
+                  theme && darkModeType
+                    ? Colors.dark.text
+                    : Colors.constants.blue
+                }
               />
             </span>
           </div>
diff --git a/src/pages/settings/pages/sparkSettingsPage/index.jsx b/src/pages/settings/pages/sparkSettingsPage/index.jsx
index bda8d5b..fb371a4 100644
--- a/src/pages/settings/pages/sparkSettingsPage/index.jsx
+++ b/src/pages/settings/pages/sparkSettingsPage/index.jsx
@@ -6,8 +6,10 @@ import SettingsItemWithSlider from "../../components/settingsItemWithSlider/sett
 import displayCorrectDenomination from "../../../../functions/displayCorrectDenomination";
 import { useNodeContext } from "../../../../contexts/nodeContext";
 import { useSpark } from "../../../../contexts/sparkContext";
+import { useOverlay } from "../../../../contexts/overlayContext";
 
-export default function SparkSettingsPage({ openOverlay }) {
+export default function SparkSettingsPage() {
+  const { openOverlay } = useOverlay();
   const { sparkInformation } = useSpark();
   const { masterInfoObject, toggleMasterInfoObject } =
     useGlobalContextProvider();
diff --git a/src/pages/settings/settings.jsx b/src/pages/settings/settings.jsx
index f6cc820..03e1dec 100644
--- a/src/pages/settings/settings.jsx
+++ b/src/pages/settings/settings.jsx
@@ -5,71 +5,52 @@ import PageNavBar from "../../components/navBar/navBar";
 import ThemeText from "../../components/themeText/themeText";
 import { useEffect } from "react";
 import SocialOptionsBottomBar from "./socialOptions/socialOptions";
-import Icon from "../../components/customIcon/customIcon";
 import { Colors } from "../../constants/theme";
-import ThemeImage from "../../components/ThemeImage/themeImage";
 import { useThemeContext } from "../../contexts/themeContext";
 import useThemeColors from "../../hooks/useThemeColors";
-import {
-  aboutIcon,
-  colorIcon,
-  contactsIconBlue,
-  currencyIcon,
-  keyIcon,
-  leftCheveronIcon,
-  navigationIcon,
-  nodeIcon,
-  receiptIcon,
-  trashIcon,
-} from "../../constants/icons";
+import { useOverlay } from "../../contexts/overlayContext";
+import * as LucidIcons from "lucide-react";
+import CustomSettingsNavBar from "../../components/customSettingsNavbar";
 
 const GENERALOPTIONS = [
   {
     for: "general",
     name: "About",
-    icon: aboutIcon,
-    arrowIcon: leftCheveronIcon,
+    newIconName: "Info",
   },
   {
     for: "general",
     name: "Display Currency",
-    icon: currencyIcon,
-    arrowIcon: leftCheveronIcon,
+    newIconName: "Coins",
   },
   {
     for: "general",
     name: "Display Options",
-    icon: colorIcon,
-    arrowIcon: leftCheveronIcon,
+    newIconName: "Palette",
   },
 
   {
     for: "general",
     name: "Edit Contact Profile",
-    icon: contactsIconBlue,
-    arrowIcon: leftCheveronIcon,
+    newIconName: "UserPen",
   },
   {
     for: "general",
     name: "Fast Pay",
-    svgIcon: true,
-    svgName: "quickPayIcon",
-    arrowIcon: leftCheveronIcon,
+    newIconName: "ClockFading",
   },
   {
     for: "general",
     name: "Blitz Stats",
-    svgName: "crashDebugIcon",
-    icon: navigationIcon,
-    arrowIcon: leftCheveronIcon,
+    newIconName: "ChartArea",
   },
 ];
+
 const SECURITYOPTIONS = [
   {
     for: "Security & Customization",
     name: "Backup wallet",
-    icon: keyIcon,
-    arrowIcon: leftCheveronIcon,
+    newIconName: "KeyRound",
   },
 ];
 
@@ -77,20 +58,17 @@ const ADVANCEDOPTIONS = [
   {
     for: "Closing Account",
     name: "Blitz Fee Details",
-    icon: receiptIcon,
-    arrowIcon: leftCheveronIcon,
+    newIconName: "ReceiptText",
   },
   {
     for: "Closing Account",
     name: "Delete Wallet",
-    icon: trashIcon,
-    arrowIcon: leftCheveronIcon,
+    newIconName: "Trash",
   },
   {
     for: "Closing Account",
     name: "Spark Info",
-    icon: nodeIcon,
-    arrowIcon: leftCheveronIcon,
+    newIconName: "Asterisk",
   },
 ];
 const SETTINGSOPTIONS = [
@@ -103,21 +81,20 @@ const DOOMSDAYSETTINGS = [
     {
       for: "Security & Customization",
       name: "Backup wallet",
-      icon: keyIcon,
-      arrowIcon: leftCheveronIcon,
+      newIconName: "KeyRound",
     },
   ],
   [
     {
       for: "Closing Account",
       name: "Delete Wallet",
-      icon: trashIcon,
-      arrowIcon: leftCheveronIcon,
+      newIconName: "Trash",
     },
   ],
 ];
 
-export default function SettingsHome({ openOverlay }) {
+export default function SettingsHome() {
+  const { openOverlay } = useOverlay();
   const navigate = useNavigate();
   const location = useLocation();
   const queryParams = new URLSearchParams(location.search);
@@ -138,6 +115,8 @@ export default function SettingsHome({ openOverlay }) {
 
   const settingsItems = settignsList.map((item, id) => {
     const internalElements = item.map((settingsElement, id) => {
+      const IconElemnt = LucidIcons[settingsElement.newIconName];
+      console.log(IconElemnt, settingsElement.newIconName);
       return (
         <div
           style={{ borderBottomColor: backgroundOffset }}
@@ -161,28 +140,20 @@ export default function SettingsHome({ openOverlay }) {
           }}
           className="settingsItemContainer"
         >
-          {settingsElement.svgIcon ? (
-            <Icon
-              color={
-                theme && darkModeType ? Colors.dark.text : Colors.light.blue
-              }
-              name={settingsElement.svgName}
-            />
-          ) : (
-            <ThemeImage
-              className="settingsItemImage"
-              icon={settingsElement.icon}
-              styles={{ width: 20, height: 20 }}
-            />
-          )}
+          <IconElemnt
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+            }
+          />
           <ThemeText
             className={"settingsItemName"}
             textContent={settingsElement.name}
           />
-          <ThemeImage
-            styles={{ width: 20, height: 20 }}
-            className="settingsItemChevron"
-            icon={settingsElement.arrowIcon}
+          <LucidIcons.ChevronRight
+            size={20}
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+            }
           />
         </div>
       );
@@ -210,7 +181,7 @@ export default function SettingsHome({ openOverlay }) {
 
   return (
     <div className="settingsPage">
-      <PageNavBar text="Settings" />
+      <CustomSettingsNavBar text="Settings" />
       <div className="contentContainer">
         {settingsItems}
         <SocialOptionsBottomBar />
diff --git a/src/pages/settings/settingsItem/settingsItem.jsx b/src/pages/settings/settingsItem/settingsItem.jsx
index a13d4dc..a834800 100644
--- a/src/pages/settings/settingsItem/settingsItem.jsx
+++ b/src/pages/settings/settingsItem/settingsItem.jsx
@@ -12,8 +12,10 @@ import FastPay from "../pages/fastPay/fastPay";
 import BlitzFeeInformation from "../pages/feeDetails/feeInformation";
 import ExploreUsers from "../pages/exploreUsers/exploreUsers";
 import CustomSettingsNavbar from "../../../components/customSettingsNavbar";
+import { useOverlay } from "../../../contexts/overlayContext";
 
-export default function SettingsContentIndex({ openOverlay }) {
+export default function SettingsContentIndex() {
+  const { openOverlay } = useOverlay();
   const location = useLocation();
   const props = location.state;
   const selectedPage = props.for?.toLowerCase();
@@ -22,6 +24,15 @@ export default function SettingsContentIndex({ openOverlay }) {
   if (selectedPage === "point-of-sale") {
     return <>{selectedPage === "point-of-sale" && <PosSettingsPage />}</>;
   }
+
+  if (selectedPage === "edit contact profile") {
+    return (
+      <EditMyProfilePage
+        navProps={{ fromSettings: true, pageType: "myProfile" }}
+      />
+    );
+  }
+
   return (
     <SafeAreaComponent addedClassName={"settingsContentIndexContianer"}>
       <CustomSettingsNavbar
@@ -40,12 +51,6 @@ export default function SettingsContentIndex({ openOverlay }) {
         {selectedPage === "node info" && <NodeInfo />}
         {selectedPage === "display options" && <DisplayOptions />}
 
-        {selectedPage === "edit contact profile" && (
-          <EditMyProfilePage
-            navProps={{ fromSettings: true, pageType: "myProfile" }}
-          />
-        )}
-
         {selectedPage === "fast pay" && <FastPay />}
 
         {selectedPage === "blitz stats" && <ExploreUsers />}
diff --git a/src/pages/settings/socialOptions/socialOptions.jsx b/src/pages/settings/socialOptions/socialOptions.jsx
index 3960937..1138a8d 100644
--- a/src/pages/settings/socialOptions/socialOptions.jsx
+++ b/src/pages/settings/socialOptions/socialOptions.jsx
@@ -1,9 +1,6 @@
 import telegramIcon from "../../../assets/telegram.png";
-import telegramIconWhite from "../../../assets/telegramWhite.png";
 import twitter from "../../../assets/twitter.png";
-import twitterIconWhite from "../../../assets/twitterWhite.png";
 import github from "../../../assets/github.png";
-import githubIconWhite from "../../../assets/githubWhite.png";
 import "./socialOptions.css";
 import ThemeImage from "../../../components/ThemeImage/themeImage";
 export default function SocialOptionsBottomBar() {
diff --git a/src/pages/switchReceiveOption/switchReceiveOption.jsx b/src/pages/switchReceiveOption/switchReceiveOption.jsx
index dcac628..24c280c 100644
--- a/src/pages/switchReceiveOption/switchReceiveOption.jsx
+++ b/src/pages/switchReceiveOption/switchReceiveOption.jsx
@@ -4,7 +4,6 @@ import {
   blockstreamLiquid,
   lightningReceiveIcon,
   rootstockLogo,
-  smallArrowLeft,
   sparkAsteriskWhite,
 } from "../../constants/icons";
 import ThemeText from "../../components/themeText/themeText";
@@ -19,7 +18,9 @@ import { useKeysContext } from "../../contexts/keysContext";
 import { useNavigate } from "react-router-dom";
 import displayCorrectDenomination from "../../functions/displayCorrectDenomination";
 import { useNodeContext } from "../../contexts/nodeContext";
-import ThemeImage from "../../components/ThemeImage/themeImage";
+import { useOverlay } from "../../contexts/overlayContext";
+import { ArrowDown } from "lucide-react";
+import { Colors } from "../../constants/theme";
 
 const MAIN_PAYMENTS = [
   ["Lightning", "Instant"],
@@ -29,7 +30,9 @@ const MAIN_PAYMENTS = [
   // ["Rootstock", "~ 1 minute"],
 ];
 
-export default function SwitchReceiveOption({ onClose, params, openOverlay }) {
+export default function SwitchReceiveOption({ params }) {
+  const { openOverlay, closeOverlay } = useOverlay();
+  const onClose = closeOverlay;
   const navigate = useNavigate();
   const { fiatStats } = useNodeContext();
   const { currentWalletMnemonic } = useActiveCustodyAccount();
@@ -248,16 +251,16 @@ export default function SwitchReceiveOption({ onClose, params, openOverlay }) {
             }
           )}
         />
-        <ThemeImage
-          styles={{
-            width: 15,
-            height: 15,
+        <ArrowDown
+          color={
+            theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+          }
+          size={15}
+          style={{
             marginLeft: "5px",
-            transform: `rotate(${isExpanded ? 90 : -90}deg)`,
+            transform: `rotate(${isExpanded ? 180 : 0}deg)`,
             transition: "transform 0.3s ease",
           }}
-          icon={smallArrowLeft}
-          alt="arrow"
         />
       </button>
 
diff --git a/src/pages/technicalDetails/technicalDetails.jsx b/src/pages/technicalDetails/technicalDetails.jsx
index 1442163..8884cb4 100644
--- a/src/pages/technicalDetails/technicalDetails.jsx
+++ b/src/pages/technicalDetails/technicalDetails.jsx
@@ -3,7 +3,9 @@ import BackArrow from "../../components/backArrow/backArrow";
 import ThemeText from "../../components/themeText/themeText";
 import copyToClipboard from "../../functions/copyToClipboard";
 import "./style.css";
-export default function TechnicalDetailsPage({ openOverlay }) {
+import { useOverlay } from "../../contexts/overlayContext";
+export default function TechnicalDetailsPage() {
+  const { openOverlay } = useOverlay();
   const location = useLocation();
   const navigate = useNavigate();
   const props = location.state;
diff --git a/src/pages/viewkey/viewKey.jsx b/src/pages/viewkey/viewKey.jsx
index a9e0975..9d975e9 100644
--- a/src/pages/viewkey/viewKey.jsx
+++ b/src/pages/viewkey/viewKey.jsx
@@ -12,8 +12,10 @@ import copyToClipboard from "../../functions/copyToClipboard";
 import useThemeColors from "../../hooks/useThemeColors";
 import ThemeText from "../../components/themeText/themeText";
 import { useThemeContext } from "../../contexts/themeContext";
+import { useOverlay } from "../../contexts/overlayContext";
 
-export default function ViewMnemoinc({ openOverlay }) {
+export default function ViewMnemoinc() {
+  const { openOverlay } = useOverlay();
   const navigate = useNavigate();
   const location = useLocation();
   const props = location.state;
diff --git a/src/pages/wallet/components/balanceContainer/userBalanceContainer.jsx b/src/pages/wallet/components/balanceContainer/userBalanceContainer.jsx
index dd1f48c..e5825a7 100644
--- a/src/pages/wallet/components/balanceContainer/userBalanceContainer.jsx
+++ b/src/pages/wallet/components/balanceContainer/userBalanceContainer.jsx
@@ -43,6 +43,7 @@ export default function UserBalance() {
         <FormattedSatText
           styles={{ fontSize: "2rem" }}
           balance={sparkInformation.balance}
+          useSizing={true}
         />
       </div>
     </div>
diff --git a/src/pages/wallet/components/lrc20Assets/index.jsx b/src/pages/wallet/components/lrc20Assets/index.jsx
index 9c9b26b..53524b2 100644
--- a/src/pages/wallet/components/lrc20Assets/index.jsx
+++ b/src/pages/wallet/components/lrc20Assets/index.jsx
@@ -1,12 +1,8 @@
 import React, { useMemo, useState } from "react";
 import { motion, AnimatePresence } from "framer-motion";
-import { useNavigate } from "react-router-dom";
-
 import { useTranslation } from "react-i18next";
-import "./style.css"; // ✅ External CSS
+import "./style.css";
 import ThemeText from "../../../../components/themeText/themeText";
-import ThemeImage from "../../../../components/ThemeImage/themeImage";
-import { smallArrowLeft } from "../../../../constants/icons";
 import { formatTokensNumber } from "../../../../functions/lrc20/formatTokensBalance";
 import {
   getContrastingTextColor,
@@ -18,8 +14,11 @@ import CustomInput from "../../../../components/customInput/customInput";
 import formatBalanceAmount from "../../../../functions/formatNumber";
 import { useSpark } from "../../../../contexts/sparkContext";
 import { Colors } from "../../../../constants/theme";
+import { useOverlay } from "../../../../contexts/overlayContext";
+import { ArrowLeft } from "lucide-react";
 
-export default function LRC20Assets({ openOverlay }) {
+export default function LRC20Assets() {
+  const { openOverlay } = useOverlay();
   const { darkModeType, theme } = useThemeContext();
   const { sparkInformation } = useSpark();
   const { textColor } = useThemeColors();
@@ -132,9 +131,11 @@ export default function LRC20Assets({ openOverlay }) {
           animate={{ rotate: isExpanded ? 90 : -90 }}
           transition={{ duration: 0.3, ease: "easeInOut" }}
         >
-          <ThemeImage
-            styles={{ width: 15, height: 15 }}
-            icon={smallArrowLeft}
+          <ArrowLeft
+            color={
+              theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+            }
+            style={{ width: 15, height: 15 }}
           />
         </motion.div>
       </button>
diff --git a/src/pages/wallet/components/nav/nav.css b/src/pages/wallet/components/nav/nav.css
index 7b624ca..d01e2cf 100644
--- a/src/pages/wallet/components/nav/nav.css
+++ b/src/pages/wallet/components/nav/nav.css
@@ -1,6 +1,5 @@
 .walletNavBar {
   width: 100%;
-  padding-bottom: 10px;
   min-height: 40px;
   display: flex;
   justify-content: space-between;
@@ -9,11 +8,6 @@
   z-index: 99;
   align-items: center;
 }
-.walletNavBar img {
-  width: 30px;
-  height: 30px;
-  cursor: pointer;
-}
 
 .walletNavBar .themeContainer {
   display: flex;
diff --git a/src/pages/wallet/components/nav/nav.jsx b/src/pages/wallet/components/nav/nav.jsx
index 86a7b8c..9fa5198 100644
--- a/src/pages/wallet/components/nav/nav.jsx
+++ b/src/pages/wallet/components/nav/nav.jsx
@@ -4,45 +4,46 @@ import { useCallback, useState } from "react";
 import { useSpark } from "../../../../contexts/sparkContext";
 import { fullRestoreSparkState } from "../../../../functions/spark/restore";
 import { useThemeContext } from "../../../../contexts/themeContext";
-import ThemeImage from "../../../../components/ThemeImage/themeImage";
 import useThemeColors from "../../../../hooks/useThemeColors";
 import { useActiveCustodyAccount } from "../../../../contexts/activeAccount";
-import {
-  darkMode,
-  lightMode,
-  lightModeWhite,
-  refresh,
-  refreshWhite,
-  settingsIcon,
-  settingsWhite,
-} from "../../../../constants/icons";
 import { Moon, Sun, RefreshCw, Settings } from "lucide-react";
+import NavBarProfileImage from "../../../../components/navBar/profileImage";
+import { useOverlay } from "../../../../contexts/overlayContext";
+import {
+  SPARK_TX_UPDATE_ENVENT_NAME,
+  sparkTransactionsEventEmitter,
+} from "../../../../functions/spark/transactions";
 
-export default function WalletNavBar({ openOverlay, didEnabledLrc20 }) {
-  const navigate = useNavigate();
-  const location = useLocation();
+export default function WalletNavBar({ didEnabledLrc20 }) {
   const { theme, toggleTheme, darkModeType } = useThemeContext();
-  const { backgroundColor } = useThemeColors();
+  const { backgroundColor, backgroundOffset } = useThemeColors();
   const [isRefreshing, setIsRefreshing] = useState(false);
-  const { sparkInformation } = useSpark();
+  const { sparkInformation, isSendingPaymentRef } = useSpark();
   const { currentWalletMnemoinc } = useActiveCustodyAccount();
   const handleRefresh = useCallback(async () => {
-    setIsRefreshing(true);
-
-    await fullRestoreSparkState({
-      sparkAddress: sparkInformation.sparkAddress,
-      batchSize: 5,
-      isSendingPayment: false,
-      mnemonic: currentWalletMnemoinc,
-      identityPubKey: sparkInformation.identityPubKey,
-    });
+    try {
+      setIsRefreshing(true);
 
-    setIsRefreshing(false);
-    openOverlay({
-      for: "error",
-      errorMessage: "Your wallet was successfully refreshed.",
-    });
-  }, []);
+      const response = await fullRestoreSparkState({
+        sparkAddress: sparkInformation.sparkAddress,
+        batchSize: 2,
+        isSendingPayment: isSendingPaymentRef.current,
+        mnemonic: currentWalletMnemoinc,
+        identityPubKey: sparkInformation.identityPubKey,
+        isInitialRestore: false,
+      });
+      if (!response) {
+        sparkTransactionsEventEmitter.emit(
+          SPARK_TX_UPDATE_ENVENT_NAME,
+          "fullUpdate"
+        );
+      }
+    } catch (err) {
+      console.log(err);
+    } finally {
+      setIsRefreshing(false);
+    }
+  }, [sparkInformation, currentWalletMnemoinc]);
   return (
     <div style={{ backgroundColor }} className="walletNavBar">
       <div className="themeContainer" onClick={() => toggleTheme(!theme)}>
@@ -64,11 +65,7 @@ export default function WalletNavBar({ openOverlay, didEnabledLrc20 }) {
           className={`${isRefreshing ? "spinningAnimation" : ""}`}
         />
       </div>
-      <Settings
-        color={theme && darkModeType ? "var(--dmt)" : "var(--primaryBlue)"}
-        size={30}
-        onClick={() => navigate("/settings")}
-      />
+      <NavBarProfileImage />
     </div>
   );
 }
diff --git a/src/pages/wallet/components/sendAndRequestBTNS/sendAndRequstBtns.jsx b/src/pages/wallet/components/sendAndRequestBTNS/sendAndRequstBtns.jsx
index a98655b..32ed1e9 100644
--- a/src/pages/wallet/components/sendAndRequestBTNS/sendAndRequstBtns.jsx
+++ b/src/pages/wallet/components/sendAndRequestBTNS/sendAndRequstBtns.jsx
@@ -1,14 +1,13 @@
 import { useNavigate } from "react-router-dom";
-import sendRequestImage from "../../../../assets/sendRequestImage.png";
-import Qr from "../../../../assets/scanQRCodeLight.png";
 import "./style.css";
-import ThemeImage from "../../../../components/ThemeImage/themeImage";
 import { Colors } from "../../../../constants/theme";
 import { useThemeContext } from "../../../../contexts/themeContext";
 import useThemeColors from "../../../../hooks/useThemeColors";
 import { ArrowDown, ArrowUp, ScanLine } from "lucide-react";
+import { useOverlay } from "../../../../contexts/overlayContext";
 
-export default function SendAndRequestBtns({ openOverlay }) {
+export default function SendAndRequestBtns() {
+  const { openOverlay } = useOverlay();
   const { theme, darkModeType } = useThemeContext();
   const naigate = useNavigate();
   const { backgroundOffset, backgroundColor } = useThemeColors();
@@ -36,11 +35,6 @@ export default function SendAndRequestBtns({ openOverlay }) {
           }
           size={25}
         />
-        {/* <ThemeImage
-          styles={{ width: "100%", height: "100%" }}
-          icon={sendRequestImage}
-          className="send"
-        /> */}
       </div>
 
       <div
diff --git a/src/pages/wallet/components/sendOptions/index.jsx b/src/pages/wallet/components/sendOptions/index.jsx
index 51cac15..0769b4d 100644
--- a/src/pages/wallet/components/sendOptions/index.jsx
+++ b/src/pages/wallet/components/sendOptions/index.jsx
@@ -7,36 +7,29 @@ import { useTranslation } from "react-i18next";
 import { useNavigate } from "react-router-dom";
 import ThemeText from "../../../../components/themeText/themeText";
 import { useGlobalContacts } from "../../../../contexts/globalContacts";
-import ThemeImage from "../../../../components/ThemeImage/themeImage";
-import Icon from "../../../../components/customIcon/customIcon";
 import { useThemeContext } from "../../../../contexts/themeContext";
+import * as LucidIcons from "lucide-react";
 
 import "./style.css";
-import {
-  clipboardDark,
-  contactsIcon,
-  editIcon,
-  ImagesIconDark,
-} from "../../../../constants/icons";
+
 import {
   getQRImage,
   navigateToSendUsingClipboard,
 } from "../../../../functions/sendBitcoin/halfModalFunctions";
+import { Colors } from "../../../../constants/theme";
 
 export default function HalfModalSendOptions({ openOverlay, onClose }) {
   const navigate = useNavigate();
-  const { theme } = useThemeContext();
+  const { theme, darkModeType } = useThemeContext();
   const fileInput = document.getElementById("file-selector");
   const { decodedAddedContacts } = useGlobalContacts();
   const { t } = useTranslation();
 
   const sendOptionElements = ["img", "clipboard", "manual"].map((item, key) => {
-    const darkIcon =
-      item === "img"
-        ? ImagesIconDark
-        : item === "clipboard"
-        ? clipboardDark
-        : editIcon;
+    const iconName =
+      item === "img" ? "Image" : item === "clipboard" ? "Clipboard" : "Edit";
+
+    const IconElement = LucidIcons[iconName];
 
     const itemText =
       item === "img"
@@ -101,25 +94,11 @@ export default function HalfModalSendOptions({ openOverlay, onClose }) {
         }}
       >
         <div style={styles.optionRow}>
-          {item === "manual" ? (
-            <div
-              style={{
-                ...styles.icon,
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center",
-              }}
-            >
-              <Icon
-                color={theme ? "white" : "black"}
-                height={30}
-                width={30}
-                name={"editIcon"}
-              />
-            </div>
-          ) : (
-            <ThemeImage styles={styles.icon} icon={darkIcon} />
-          )}
+          <IconElement
+            color={theme ? Colors.dark.text : Colors.light.text}
+            style={styles.icon}
+            size={35}
+          />
           <ThemeText textStyles={styles.optionText} textContent={itemText} />
         </div>
       </button>
@@ -130,10 +109,11 @@ export default function HalfModalSendOptions({ openOverlay, onClose }) {
     <div className="sendOptionsContainer">
       <div style={{ overflowY: "auto", overflowX: "hidden" }}>
         {sendOptionElements}
-        {/* {decodedAddedContacts.length !== 0 && (
+        {decodedAddedContacts.length !== 0 && (
           <button
             onClick={() => {
-              navigate("ChooseContactHalfModal");
+              navigate("/chooseContactListPage");
+              onClose();
             }}
             style={{
               background: "transparent",
@@ -144,11 +124,9 @@ export default function HalfModalSendOptions({ openOverlay, onClose }) {
             }}
           >
             <div style={styles.optionRow}>
-              <ThemeImage
-                styles={styles.icon}
-                lightModeIcon={contactsIcon}
-                darkModeIcon={contactsIconLight}
-                lightsOutIcon={contactsIconLight}
+              <LucidIcons.Users
+                color={theme ? Colors.dark.text : Colors.light.text}
+                style={styles.icon}
               />
               <ThemeText
                 textStyles={{ ...styles.optionText }}
@@ -156,7 +134,7 @@ export default function HalfModalSendOptions({ openOverlay, onClose }) {
               />
             </div>
           </button>
-        )} */}
+        )}
       </div>
       <input
         style={{ zIndex: -1, display: "none" }}
diff --git a/src/pages/wallet/components/sendOptions/manualEnter.jsx b/src/pages/wallet/components/sendOptions/manualEnter.jsx
index c95affb..07a2a6c 100644
--- a/src/pages/wallet/components/sendOptions/manualEnter.jsx
+++ b/src/pages/wallet/components/sendOptions/manualEnter.jsx
@@ -1,22 +1,36 @@
 import { useTranslation } from "react-i18next";
 import { useNavigate } from "react-router-dom";
 import ThemeText from "../../../../components/themeText/themeText";
-import ThemeImage from "../../../../components/ThemeImage/themeImage";
-import { aboutIcon } from "../../../../constants/icons";
 import CustomButton from "../../../../components/customButton/customButton";
 import handlePreSendPageParsing from "../../../../functions/sendBitcoin/handlePreSendPageParsing";
 import { useState } from "react";
 import "./manualEnter.css";
 import { CONTENT_KEYBOARD_OFFSET } from "../../../../constants";
 import openLinkToNewTab from "../../../../functions/openLinkToNewTab";
+import { useOverlay } from "../../../../contexts/overlayContext";
+import { Info } from "lucide-react";
+import { useThemeContext } from "../../../../contexts/themeContext";
+import { Colors } from "../../../../constants/theme";
 
-export default function ManualEnterSendAddress(props) {
+export default function ManualEnterSendAddress() {
+  const { openOverlay, closeOverlay } = useOverlay();
   const navigate = useNavigate();
   const { t } = useTranslation();
-  const { onClose, openOverlay } = props;
+  const onClose = closeOverlay;
+  const { theme, darkModeType } = useThemeContext();
 
   const [inputValue, setInputValue] = useState("");
 
+  const handlePopup = () => {
+    openOverlay({
+      for: "informationPopup",
+      textContent: t(
+        "wallet.homeLightning.manualEnterSendAddress.paymentTypesDesc"
+      ),
+      buttonText: t("constants.understandText"),
+    });
+  };
+
   return (
     <div
       style={{ marginBottom: CONTENT_KEYBOARD_OFFSET }}
@@ -27,20 +41,12 @@ export default function ManualEnterSendAddress(props) {
           className={"infoText"}
           textContent={t("wallet.homeLightning.manualEnterSendAddress.title")}
         />
-
-        <ThemeImage
-          clickFunction={() => {
-            openOverlay({
-              for: "informationPopup",
-              textContent: t(
-                "wallet.homeLightning.manualEnterSendAddress.paymentTypesDesc"
-              ),
-              buttonText: t("constants.understandText"),
-            });
-          }}
-          className="image"
-          styles={{ width: 20, height: 20 }}
-          icon={aboutIcon}
+        <Info
+          onClick={handlePopup}
+          size={22}
+          color={
+            theme && darkModeType ? Colors.dark.text : Colors.constants.blue
+          }
         />
       </div>
 
diff --git a/src/pages/wallet/wallet.css b/src/pages/wallet/wallet.css
index e25415c..315b270 100644
--- a/src/pages/wallet/wallet.css
+++ b/src/pages/wallet/wallet.css
@@ -1,16 +1,24 @@
 #walletHomeContainer {
   width: 100%;
   height: 100%;
+  /* max-width: 800px; */
   padding-bottom: 65px;
   overflow-y: scroll;
   margin: 0 auto;
 }
-
+.customWalletHomeStyle {
+  max-width: calc(800px * 1.06);
+}
 .lrc20Overlay {
-  padding: 20px 2.5% 0;
+  padding: 20px 0 0;
   border-bottom-left-radius: 30px;
   border-bottom-right-radius: 30px;
 }
+.lrc20Overlay .lrc20ContentContiner {
+  width: 95%;
+  max-width: 800px;
+  margin: 0 auto;
+}
 .txsContainer {
   width: 90%;
   margin: 20px auto 15px;
diff --git a/src/pages/wallet/wallet.jsx b/src/pages/wallet/wallet.jsx
index c072df6..5fb4d5a 100644
--- a/src/pages/wallet/wallet.jsx
+++ b/src/pages/wallet/wallet.jsx
@@ -9,8 +9,10 @@ import { useGlobalContextProvider } from "../../contexts/masterInfoObject";
 import useThemeColors from "../../hooks/useThemeColors";
 import SafeAreaComponent from "../../components/safeAreaContainer";
 import LRC20Assets from "./components/lrc20Assets";
+import { useOverlay } from "../../contexts/overlayContext";
 
-export default function WalletHome({ openOverlay }) {
+export default function WalletHome() {
+  const { openOverlay } = useOverlay();
   const { masterInfoObject } = useGlobalContextProvider();
   const { backgroundColor, backgroundOffset } = useThemeColors();
   const { toggleDidGetToHomepage } = useAppStatus();
@@ -20,9 +22,10 @@ export default function WalletHome({ openOverlay }) {
   useEffect(() => {
     toggleDidGetToHomepage(true);
   }, []);
-  console.log(masterInfoObject);
+
   return (
     <SafeAreaComponent
+      addedClassName={"customWalletHomeStyle"}
       backgroundColor={didEnabledLrc20 ? backgroundOffset : "transparent"}
       customStyles={{ paddingTop: 0, width: "100%" }}
     >
@@ -33,13 +36,15 @@ export default function WalletHome({ openOverlay }) {
           }}
           className="lrc20Overlay"
         >
-          <WalletNavBar
-            didEnabledLrc20={didEnabledLrc20}
-            openOverlay={openOverlay}
-          />
-          <UserBalance />
-          <SendAndRequestBtns openOverlay={openOverlay} />
-          {didEnabledLrc20 && <LRC20Assets openOverlay={openOverlay} />}
+          <div className="lrc20ContentContiner">
+            <WalletNavBar
+              didEnabledLrc20={didEnabledLrc20}
+              openOverlay={openOverlay}
+            />
+            <UserBalance />
+            <SendAndRequestBtns openOverlay={openOverlay} />
+            {didEnabledLrc20 && <LRC20Assets openOverlay={openOverlay} />}
+          </div>
         </div>
 
         <div style={{ background: backgroundOffset }} className="txsContainer">
diff --git a/src/tabs/tabs.jsx b/src/tabs/tabs.jsx
index 6a0f850..0156247 100644
--- a/src/tabs/tabs.jsx
+++ b/src/tabs/tabs.jsx
@@ -29,10 +29,10 @@ export default function BottomTabs({ setValue, value, Link }) {
     <div
       style={{
         position: "fixed",
-        bottom: "10px",
+        bottom: "25px",
         left: "50%",
         transform: "translateX(-50%)",
-        width: "calc(100% - 40px)",
+        width: "max-content",
         maxWidth: "400px",
         zIndex: 1000,
       }}
@@ -55,6 +55,8 @@ export default function BottomTabs({ setValue, value, Link }) {
           style={{
             backgroundColor: "transparent",
             borderRadius: "20px",
+            height: "45px",
+            gap: "20px",
           }}
           sx={{
             "& .MuiBottomNavigationAction-root": {
@@ -71,6 +73,12 @@ export default function BottomTabs({ setValue, value, Link }) {
           <BottomNavigationAction
             disableRipple
             sx={{
+              flex: 0,
+              width: "50px",
+              "& .MuiButtonBase-root": {
+                flex: 0,
+                width: "50px",
+              },
               "& .MuiBottomNavigationAction-label": {
                 color: textColor,
               },
@@ -92,6 +100,8 @@ export default function BottomTabs({ setValue, value, Link }) {
           <BottomNavigationAction
             disableRipple
             sx={{
+              flex: 0,
+              width: "50px",
               "& .MuiBottomNavigationAction-label": {
                 color: textColor,
               },
@@ -113,6 +123,8 @@ export default function BottomTabs({ setValue, value, Link }) {
           <BottomNavigationAction
             disableRipple
             sx={{
+              flex: 0,
+              width: "50px",
               "& .MuiBottomNavigationAction-label": {
                 color: textColor,
               },
diff --git a/src/workers/messageWorker.js b/src/workers/messageWorker.js
new file mode 100644
index 0000000..989b4a7
--- /dev/null
+++ b/src/workers/messageWorker.js
@@ -0,0 +1,67 @@
+import { decryptMessage } from "../functions/encodingAndDecoding";
+
+self.onmessage = async function (e) {
+  const { type, data } = e.data;
+
+  if (type === "PROCESS_MESSAGES") {
+    const { allMessages, myPubKey, privateKey } = data;
+    const processedMessages = [];
+
+    for (let i = 0; i < allMessages.length; i++) {
+      const message = allMessages[i];
+
+      // Send progress updates every 10 messages
+      if (i % 10 === 0) {
+        self.postMessage({
+          type: "PROGRESS",
+          current: i,
+          total: allMessages.length,
+        });
+      }
+
+      try {
+        const isReceived = message.toPubKey === myPubKey;
+
+        if (typeof message.message === "string") {
+          const sendersPubkey =
+            message.toPubKey === myPubKey
+              ? message.fromPubKey
+              : message.toPubKey;
+
+          const decoded = await decryptMessage(
+            privateKey,
+            sendersPubkey,
+            message.message
+          );
+
+          if (!decoded) continue;
+
+          let parsedMessage;
+          try {
+            parsedMessage = JSON.parse(decoded);
+          } catch (err) {
+            console.log("error parsing decoded message", err);
+            continue;
+          }
+
+          processedMessages.push({
+            ...message,
+            message: parsedMessage,
+            sendersPubkey,
+            isReceived,
+          });
+        } else {
+          processedMessages.push(message);
+        }
+      } catch (err) {
+        console.log("error decoding incoming request from history");
+      }
+    }
+
+    // Send completed result
+    self.postMessage({
+      type: "COMPLETE",
+      data: processedMessages,
+    });
+  }
+};