diff --git a/packages/bridge-ui/src/app.config.ts b/packages/bridge-ui/src/app.config.ts
index 13804914dd1..8c9ebc03692 100644
--- a/packages/bridge-ui/src/app.config.ts
+++ b/packages/bridge-ui/src/app.config.ts
@@ -42,7 +42,7 @@ export const toastConfig = {
 };
 
 export const apiService = {
-  timeout: 5000,
+  timeout: 10_000, // 10 seconds
 };
 
 export const ipfsConfig = {
diff --git a/packages/bridge-ui/src/components/Bridge/SharedBridgeComponents/ConfirmationStep/ConfirmationStep.svelte b/packages/bridge-ui/src/components/Bridge/SharedBridgeComponents/ConfirmationStep/ConfirmationStep.svelte
index 2d72fdedda1..31b0dbb3a55 100644
--- a/packages/bridge-ui/src/components/Bridge/SharedBridgeComponents/ConfirmationStep/ConfirmationStep.svelte
+++ b/packages/bridge-ui/src/components/Bridge/SharedBridgeComponents/ConfirmationStep/ConfirmationStep.svelte
@@ -90,7 +90,7 @@
     }
 
     const bridgeTx = {
-      hash: txHash,
+      srcTxHash: txHash,
       from: $account.address,
       amount: $enteredAmount,
       symbol: $selectedToken?.symbol,
diff --git a/packages/bridge-ui/src/components/Dialogs/ClaimDialog/ClaimDialog.svelte b/packages/bridge-ui/src/components/Dialogs/ClaimDialog/ClaimDialog.svelte
index 137d311eed9..146c838754f 100644
--- a/packages/bridge-ui/src/components/Dialogs/ClaimDialog/ClaimDialog.svelte
+++ b/packages/bridge-ui/src/components/Dialogs/ClaimDialog/ClaimDialog.svelte
@@ -56,7 +56,7 @@
   };
 
   let force = false;
-  let canForceTransaction = false;
+  // let canForceTransaction = false;
   let canContinue = false;
   let claiming: boolean;
   let claimingDone = false;
@@ -124,7 +124,7 @@
   const handleClaimError = (event: CustomEvent<{ error: unknown; action: ClaimAction }>) => {
     //TODO: update this to display info alongside toasts
     const err = event.detail.error;
-    canForceTransaction = true;
+    // canForceTransaction = true;
     switch (true) {
       case err instanceof NotConnectedError:
         warningToast({ title: $t('messages.account.required') });
@@ -172,7 +172,7 @@
   const reset = () => {
     activeStep = INITIAL_STEP;
     claimingDone = false;
-    canForceTransaction = false;
+    // canForceTransaction = false;
   };
 
   let previousStep: ClaimSteps;
@@ -204,7 +204,7 @@
           isActive={activeStep === ClaimSteps.CONFIRM}>{$t('bridge.step.confirm.title')}</DialogStep>
       </DialogStepper>
       {#if activeStep === ClaimSteps.CHECK}
-        <ClaimPreCheck tx={bridgeTx} bind:canContinue bind:hideContinueButton />
+        <ClaimPreCheck tx={bridgeTx} bind:canContinue bind:hideContinueButton on:closeDialog={closeDialog} />
       {:else if activeStep === ClaimSteps.REVIEW}
         <ReviewStep tx={bridgeTx} {nft} />
       {:else if activeStep === ClaimSteps.CONFIRM}
@@ -214,11 +214,6 @@
           on:claim={handleClaimClick}
           bind:claiming
           bind:canClaim={canContinue}
-          {canForceTransaction}
-          on:forceClaim={() => {
-            force = true;
-            handleClaimClick();
-          }}
           bind:claimingDone />
       {/if}
       <div class="f-col text-left self-end h-full w-full">
diff --git a/packages/bridge-ui/src/components/Dialogs/RetryDialog/RetryDialog.svelte b/packages/bridge-ui/src/components/Dialogs/RetryDialog/RetryDialog.svelte
index ab01ed55c35..3a90c0a6624 100644
--- a/packages/bridge-ui/src/components/Dialogs/RetryDialog/RetryDialog.svelte
+++ b/packages/bridge-ui/src/components/Dialogs/RetryDialog/RetryDialog.svelte
@@ -138,7 +138,7 @@
       </DialogStepper>
 
       {#if activeStep === RetrySteps.CHECK}
-        <ClaimPreCheck tx={bridgeTx} bind:canContinue bind:hideContinueButton />
+        <ClaimPreCheck tx={bridgeTx} bind:canContinue bind:hideContinueButton on:closeDialog={closeDialog} />
       {:else if activeStep === RetrySteps.SELECT}
         <RetryOptionStep bind:canContinue />
       {:else if activeStep === RetrySteps.REVIEW}
diff --git a/packages/bridge-ui/src/components/Dialogs/Shared/ClaimConfirmStep.svelte b/packages/bridge-ui/src/components/Dialogs/Shared/ClaimConfirmStep.svelte
index f86aa869e60..fb0a110d2b1 100644
--- a/packages/bridge-ui/src/components/Dialogs/Shared/ClaimConfirmStep.svelte
+++ b/packages/bridge-ui/src/components/Dialogs/Shared/ClaimConfirmStep.svelte
@@ -20,7 +20,7 @@
 
   export let txHash: Hash;
 
-  export let canForceTransaction = false;
+  // export let canForceTransaction = false;
 
   const dispatch = createEventDispatcher();
 
@@ -28,9 +28,9 @@
     dispatch('claim');
   };
 
-  const handleForceClaim = async () => {
-    dispatch('forceClaim');
-  };
+  // const handleForceClaim = async () => {
+  //   dispatch('forceClaim');
+  // };
 
   const getSuccessTitle = () => {
     return $t('bridge.step.confirm.success.claim');
@@ -93,16 +93,15 @@
           priority="primary"
           loading={claiming}
           on:click={() => handleClaimClick()}
-          disabled={claimDisabled || canForceTransaction}
-          >{$t('transactions.claim.steps.confirm.claim_button')}</ActionButton>
-        {#if canForceTransaction}
+          disabled={claimDisabled}>{$t('transactions.claim.steps.confirm.claim_button')}</ActionButton>
+        <!-- {#if canForceTransaction}
           <ActionButton
             onPopup
             priority="primary"
             loading={claiming}
             on:click={() => handleForceClaim()}
             disabled={claimDisabled}>Force transaction</ActionButton>
-        {/if}
+        {/if} -->
       </section>
     {/if}
   </div>
diff --git a/packages/bridge-ui/src/components/Dialogs/Shared/ClaimPreCheck.svelte b/packages/bridge-ui/src/components/Dialogs/Shared/ClaimPreCheck.svelte
index c94916b5ba2..3351c040dc0 100644
--- a/packages/bridge-ui/src/components/Dialogs/Shared/ClaimPreCheck.svelte
+++ b/packages/bridge-ui/src/components/Dialogs/Shared/ClaimPreCheck.svelte
@@ -1,9 +1,10 @@
 <script lang="ts">
   import { getBalance, switchChain } from '@wagmi/core';
-  import { onMount } from 'svelte';
+  import { createEventDispatcher, onMount } from 'svelte';
   import { t } from 'svelte-i18n';
-  import { type Address, parseEther } from 'viem';
+  import { type Address, getAddress, parseEther } from 'viem';
 
+  import Alert from '$components/Alert/Alert.svelte';
   import { ActionButton } from '$components/Button';
   import { Icon } from '$components/Icon';
   import Spinner from '$components/Spinner/Spinner.svelte';
@@ -12,6 +13,7 @@
   import { type BridgeTransaction } from '$libs/bridge';
   import { checkEnoughBridgeQuotaForClaim } from '$libs/bridge/checkBridgeQuota';
   import { getChainName, isL2Chain } from '$libs/chain';
+  import { shortenAddress } from '$libs/util/shortenAddress';
   import { config } from '$libs/wagmi';
   import { account } from '$stores/account';
   import { connectedSourceChain, switchingNetwork } from '$stores/network';
@@ -20,6 +22,12 @@
   export let canContinue = false;
   export let hideContinueButton = false;
 
+  export const closeDialog = () => {
+    dispatch('closeDialog');
+  };
+
+  const dispatch = createEventDispatcher();
+
   let checkingPrerequisites: boolean;
 
   const switchChains = async () => {
@@ -78,7 +86,7 @@
 
   $: successFullPreChecks = correctChain && hasEnoughEth && hasEnoughQuota;
 
-  $: if (!checkingPrerequisites && successFullPreChecks && $account) {
+  $: if (!checkingPrerequisites && successFullPreChecks && $account && !differentRecipient) {
     hideContinueButton = false;
     canContinue = true;
   } else {
@@ -93,6 +101,17 @@
   $: hasEnoughEth = false;
   $: hasEnoughQuota = false;
 
+  $: hasPaidProcessingFee = tx.processingFee > 0;
+
+  $: differentRecipient = false;
+  $: if (tx.message?.destOwner && $account?.address) {
+    if (getAddress(tx.message.destOwner) === getAddress($account?.address)) {
+      differentRecipient = false;
+    } else {
+      differentRecipient = true;
+    }
+  }
+
   onMount(() => {
     checkConditions();
   });
@@ -103,62 +122,90 @@
     <div class="font-bold text-primary-content">{$t('transactions.claim.steps.pre_check.title')}</div>
   </div>
   <div class="min-h-[150px] grid content-between">
-    <div>
+    {#if differentRecipient}
       <div class="f-between-center">
         <div class="f-row gap-1">
-          <span class="text-secondary-content">{$t('transactions.claim.steps.pre_check.chain_check')}</span>
-          <Tooltip>
-            <h2>{$t('transactions.claim.steps.pre_check.tooltip.chain.title')}</h2>
-
-            <span>{$t('transactions.claim.steps.pre_check.tooltip.chain.description')}</span>
-          </Tooltip>
+          <div class="f-col">
+            <Alert type="info"
+              >{$t('transactions.claim.steps.pre_check.different_recipient')}
+              <div class="h-sep" />
+              <span class="font-bold">{$t('common.recipient')}: </span>{shortenAddress(tx.message?.destOwner, 6, 4)}
+            </Alert>
+          </div>
         </div>
-
         {#if checkingPrerequisites}
           <Spinner />
-        {:else if correctChain}
-          <Icon type="check-circle" fillClass="fill-positive-sentiment" />
         {:else}
           <Icon type="x-close-circle" fillClass="fill-negative-sentiment" />
         {/if}
       </div>
-      <div class="f-between-center">
-        <div class="f-row gap-1">
-          <span class="text-secondary-content">{$t('transactions.claim.steps.pre_check.funds_check')}</span>
-          <Tooltip>
-            <h2>{$t('transactions.claim.steps.pre_check.tooltip.funds.title')}</h2>
-            <span>{$t('transactions.claim.steps.pre_check.tooltip.funds.description')} </span>
-          </Tooltip>
+    {:else}
+      <div>
+        <div class="f-between-center">
+          <div class="f-row gap-1">
+            <span class="text-secondary-content">{$t('transactions.claim.steps.pre_check.chain_check')}</span>
+            <Tooltip>
+              <h2>{$t('transactions.claim.steps.pre_check.tooltip.chain.title')}</h2>
+
+              <span>{$t('transactions.claim.steps.pre_check.tooltip.chain.description')}</span>
+            </Tooltip>
+          </div>
+          {#if checkingPrerequisites}
+            <Spinner />
+          {:else if correctChain}
+            <Icon type="check-circle" fillClass="fill-positive-sentiment" />
+          {:else}
+            <Icon type="x-close-circle" fillClass="fill-negative-sentiment" />
+          {/if}
         </div>
-        {#if checkingPrerequisites}
-          <Spinner />
-        {:else if hasEnoughEth}
-          <Icon type="check-circle" fillClass="fill-positive-sentiment" />
-        {:else}
-          <Icon type="x-close-circle" fillClass="fill-negative-sentiment" />
-        {/if}
-      </div>
-      {#if isL2Chain(Number(tx.srcChainId))}
         <div class="f-between-center">
           <div class="f-row gap-1">
-            <span class="text-secondary-content">{$t('transactions.claim.steps.pre_check.quota_check')}</span>
+            <span class="text-secondary-content">{$t('transactions.claim.steps.pre_check.funds_check')}</span>
             <Tooltip>
-              <h2>{$t('transactions.claim.steps.pre_check.tooltip.quota.title')}</h2>
-              <span>{$t('transactions.claim.steps.pre_check.tooltip.quota.description')} </span>
+              <h2>{$t('transactions.claim.steps.pre_check.tooltip.funds.title')}</h2>
+              <span>{$t('transactions.claim.steps.pre_check.tooltip.funds.description')} </span>
             </Tooltip>
           </div>
           {#if checkingPrerequisites}
             <Spinner />
-          {:else if hasEnoughQuota}
+          {:else if hasEnoughEth}
             <Icon type="check-circle" fillClass="fill-positive-sentiment" />
           {:else}
             <Icon type="x-close-circle" fillClass="fill-negative-sentiment" />
           {/if}
         </div>
-      {/if}
-    </div>
+        {#if isL2Chain(Number(tx.srcChainId))}
+          <div class="f-between-center">
+            <div class="f-row gap-1">
+              <span class="text-secondary-content">{$t('transactions.claim.steps.pre_check.quota_check')}</span>
+              <Tooltip>
+                <h2>{$t('transactions.claim.steps.pre_check.tooltip.quota.title')}</h2>
+                <span>{$t('transactions.claim.steps.pre_check.tooltip.quota.description')} </span>
+              </Tooltip>
+            </div>
+            {#if checkingPrerequisites}
+              <Spinner />
+            {:else if hasEnoughQuota}
+              <Icon type="check-circle" fillClass="fill-positive-sentiment" />
+            {:else}
+              <Icon type="x-close-circle" fillClass="fill-negative-sentiment" />
+            {/if}
+          </div>
+        {/if}
+        {#if hasPaidProcessingFee}
+          <div class="h-sep" />
+          <div class="f-between-center">
+            {#if checkingPrerequisites}
+              <Spinner />
+            {:else}
+              <Alert type="info">{$t('transactions.claim.steps.pre_check.tooltip.processing_fee.description')}</Alert>
+            {/if}
+          </div>
+        {/if}
+      </div>
+    {/if}
   </div>
-  {#if !canContinue && !correctChain}
+  {#if !canContinue && !correctChain && !differentRecipient}
     <div class="h-sep" />
     <div class="f-col space-y-[16px]">
       <ActionButton
@@ -170,5 +217,15 @@
           switchChains();
         }}>{$t('common.switch_to')} {txDestChainName}</ActionButton>
     </div>
+  {:else if !canContinue}
+    <div class="h-sep" />
+    <div class="f-col space-y-[16px]">
+      <ActionButton
+        onPopup
+        priority="primary"
+        on:click={() => {
+          closeDialog();
+        }}>{$t('common.ok')}</ActionButton>
+    </div>
   {/if}
 </div>
diff --git a/packages/bridge-ui/src/components/Transactions/MobileDetailsDialog.svelte b/packages/bridge-ui/src/components/Transactions/MobileDetailsDialog.svelte
index 560a3d5057e..6968d9431a4 100644
--- a/packages/bridge-ui/src/components/Transactions/MobileDetailsDialog.svelte
+++ b/packages/bridge-ui/src/components/Transactions/MobileDetailsDialog.svelte
@@ -201,7 +201,7 @@
             <h4 class="text-secondary-content">{$t('transactions.header.explorer')}</h4>
             <a
               class="flex justify-start content-center link"
-              href={`${chainConfig[Number(selectedItem.srcChainId)]?.blockExplorers?.default.url}/tx/${selectedItem.hash}`}
+              href={`${chainConfig[Number(selectedItem.srcChainId)]?.blockExplorers?.default.url}/tx/${selectedItem.srcTxHash}`}
               target="_blank">
               {$t('transactions.link.explorer')}
               <Icon type="arrow-top-right" />
diff --git a/packages/bridge-ui/src/components/Transactions/Transaction.svelte b/packages/bridge-ui/src/components/Transactions/Transaction.svelte
index a27e720be9e..586e95bb92c 100644
--- a/packages/bridge-ui/src/components/Transactions/Transaction.svelte
+++ b/packages/bridge-ui/src/components/Transactions/Transaction.svelte
@@ -69,7 +69,7 @@
     loading = true;
     try {
       token = await mapTransactionHashToNFT({
-        hash: item.hash,
+        hash: item.srcTxHash,
         srcChainId: Number(item.srcChainId),
         type: item.tokenType,
       });
@@ -194,7 +194,7 @@
     <div class="hidden md:flex grow py-2 flex flex-col justify-center">
       <a
         class="flex justify-center py-3 link"
-        href={`${chainConfig[Number(item.srcChainId)]?.blockExplorers?.default.url}/tx/${item.hash}`}
+        href={`${chainConfig[Number(item.srcChainId)]?.blockExplorers?.default.url}/tx/${item.srcTxHash}`}
         target="_blank">
         {$t('transactions.link.explorer')}
         <Icon type="arrow-top-right" fillClass="fill-primary-link" />
@@ -254,7 +254,7 @@
     <div class="hidden md:flex w-1/5 py-2 flex flex-col justify-center">
       <a
         class="flex justify-start py-3 link"
-        href={`${chainConfig[Number(item.srcChainId)]?.blockExplorers?.default.url}/tx/${item.hash}`}
+        href={`${chainConfig[Number(item.srcChainId)]?.blockExplorers?.default.url}/tx/${item.srcTxHash}`}
         target="_blank">
         {$t('transactions.link.explorer')}
         <Icon type="arrow-top-right" fillClass="fill-primary-link" />
diff --git a/packages/bridge-ui/src/components/Transactions/Transactions.svelte b/packages/bridge-ui/src/components/Transactions/Transactions.svelte
index 8c278355759..88ea55e2104 100644
--- a/packages/bridge-ui/src/components/Transactions/Transactions.svelte
+++ b/packages/bridge-ui/src/components/Transactions/Transactions.svelte
@@ -244,7 +244,7 @@
           <div
             class="flex flex-col items-center"
             style={isBlurred ? `filter: blur(5px); transition: filter ${transitionTime / 1000}s ease-in-out` : ''}>
-            {#each transactionsToShow as item (item.hash)}
+            {#each transactionsToShow as item (item.srcTxHash)}
               <Transaction {item} />
               <div class="h-sep !my-0 {isDesktopOrLarger ? 'display-inline' : 'hidden'}" />
             {/each}
diff --git a/packages/bridge-ui/src/i18n/en.json b/packages/bridge-ui/src/i18n/en.json
index 04879abbfd7..824bb73d6b2 100644
--- a/packages/bridge-ui/src/i18n/en.json
+++ b/packages/bridge-ui/src/i18n/en.json
@@ -491,6 +491,7 @@
         },
         "pre_check": {
           "chain_check": "Connected to the correct chain",
+          "different_recipient": "The recipient of this transaction does not match the sender or the currently connected wallet. To  manually claim, please connect to the recipient's wallet.",
           "funds_check": "Sufficient funds to claim",
           "quota_check": "Sufficient daily quota",
           "ready": "You can continue with the claim process!",
@@ -506,6 +507,9 @@
               "description": "In order to claim the transaction yourself, you need enough funds on the destination chain (>= 0.0015 ETH). If you've kept the default processing fee, the relayer will likely claim for you soon.",
               "title": "What is \"Sufficient funds to claim\"?"
             },
+            "processing_fee": {
+              "description": "A processing fee has been set for this transaction. If the fee is high enough, a relayer may claim it automatically. Regardless, you can choose to manually claim the transaction. Note that the fee is non-refundable."
+            },
             "quota": {
               "description": "Currently there is a daily limit of how much of this asset can be bridged to L1. If the quota is reached, please try again the next day.",
               "title": "What is \"Sufficient daily quota\"?"
diff --git a/packages/bridge-ui/src/libs/bridge/Bridge.ts b/packages/bridge-ui/src/libs/bridge/Bridge.ts
index a84bae5ba91..7ddf31b95ea 100644
--- a/packages/bridge-ui/src/libs/bridge/Bridge.ts
+++ b/packages/bridge-ui/src/libs/bridge/Bridge.ts
@@ -1,5 +1,5 @@
 import { getPublicClient, readContract, simulateContract, writeContract } from '@wagmi/core';
-import { getContract, type Hash, UserRejectedRequestError, type WalletClient } from 'viem';
+import { getAddress, getContract, type Hash, UserRejectedRequestError, type WalletClient } from 'viem';
 
 import { bridgeAbi } from '$abi';
 import { routingContractsMap } from '$bridgeConfig';
@@ -40,12 +40,12 @@ export abstract class Bridge {
     const srcChainId = Number(message.srcChainId);
     const destChainId = Number(message.destChainId);
 
-    const { srcOwner } = message;
+    const { srcOwner, destOwner } = message;
     if (!wallet || !wallet.account || !wallet.chain) throw new Error('Wallet is not connected');
 
     const userAddress = wallet.account.address;
-    // Are we the owner of the message?
-    if (srcOwner.toLowerCase() !== userAddress.toLowerCase()) {
+    // Are we the owner of the message, either src or dest?
+    if (getAddress(srcOwner) !== getAddress(userAddress) && getAddress(destOwner) !== getAddress(userAddress)) {
       throw new WrongOwnerError('user cannot process this as it is not their message');
     }
 
diff --git a/packages/bridge-ui/src/libs/bridge/fetchTransactions.ts b/packages/bridge-ui/src/libs/bridge/fetchTransactions.ts
index 0e5b180aeb0..ddae488c078 100644
--- a/packages/bridge-ui/src/libs/bridge/fetchTransactions.ts
+++ b/packages/bridge-ui/src/libs/bridge/fetchTransactions.ts
@@ -46,7 +46,7 @@ export async function fetchTransactions(userAddress: Address) {
   if (outdatedLocalTransactions.length > 0) {
     log(
       `found ${outdatedLocalTransactions.length} outdated transaction(s)`,
-      outdatedLocalTransactions.map((tx) => tx.hash),
+      outdatedLocalTransactions.map((tx) => tx.srcTxHash),
     );
   }
 
diff --git a/packages/bridge-ui/src/libs/bridge/types.ts b/packages/bridge-ui/src/libs/bridge/types.ts
index eda3f8410f7..40905e6ccc4 100644
--- a/packages/bridge-ui/src/libs/bridge/types.ts
+++ b/packages/bridge-ui/src/libs/bridge/types.ts
@@ -90,7 +90,8 @@ export type RelayerMessage = {
 export type ModifiedTransactionReceipt = Omit<TransactionReceipt, 'blockNumber'> & { blockNumber: Hex };
 
 export type BridgeTransaction = {
-  hash: Hash;
+  srcTxHash: Hash;
+  destTxHash: Hash;
   from: Address;
   amount: bigint;
   symbol: string;
@@ -100,6 +101,7 @@ export type BridgeTransaction = {
   tokenType: TokenType;
   blockNumber: Hex;
   msgHash: Hash;
+  processingFee: bigint;
   message?: Message;
   msgStatus?: MessageStatus;
 
diff --git a/packages/bridge-ui/src/libs/polling/messageStatusPoller.ts b/packages/bridge-ui/src/libs/polling/messageStatusPoller.ts
index 81a200e8fe2..fc2f0b5f56a 100644
--- a/packages/bridge-ui/src/libs/polling/messageStatusPoller.ts
+++ b/packages/bridge-ui/src/libs/polling/messageStatusPoller.ts
@@ -49,7 +49,7 @@ const hashIntervalMap: Record<Hash, Interval> = {};
  * }
  */
 export function startPolling(bridgeTx: BridgeTransaction, runImmediately = true) {
-  const { hash, srcChainId, destChainId, msgHash, msgStatus } = bridgeTx;
+  const { srcTxHash, srcChainId, destChainId, msgHash, msgStatus } = bridgeTx;
 
   // Without this we cannot poll at all. Let's throw an error
   // that can be handled in the UI
@@ -63,8 +63,8 @@ export function startPolling(bridgeTx: BridgeTransaction, runImmediately = true)
 
   // We want to notify whoever is calling this function of different
   // events: PollingEvent
-  let emitter = hashEmitterMap[hash];
-  let interval = hashIntervalMap[hash];
+  let emitter = hashEmitterMap[srcTxHash];
+  let interval = hashIntervalMap[srcTxHash];
 
   const destChainClient = createPublicClient({
     chain: chains.find((chain) => chain.id === Number(destChainId)),
@@ -93,15 +93,15 @@ export function startPolling(bridgeTx: BridgeTransaction, runImmediately = true)
   });
 
   const stopPolling = () => {
-    const interval = hashIntervalMap[hash];
+    const interval = hashIntervalMap[srcTxHash];
     if (interval) {
       log('Stop polling for transaction', bridgeTx);
 
       // Clean up
       clearInterval(interval as ReturnType<typeof setInterval>); // clearInterval only needs the ID
-      delete hashEmitterMap[hash];
-      delete hashIntervalMap[hash];
-      hashIntervalMap[hash] = null;
+      delete hashEmitterMap[srcTxHash];
+      delete hashIntervalMap[srcTxHash];
+      hashIntervalMap[srcTxHash] = null;
 
       emitter.emit(PollingEvent.STOP);
     }
@@ -113,7 +113,7 @@ export function startPolling(bridgeTx: BridgeTransaction, runImmediately = true)
   };
 
   const pollingFn = async () => {
-    log('Polling for transaction', bridgeTx.hash);
+    log('Polling for transaction', bridgeTx.srcTxHash);
     const isProcessable = await isTransactionProcessable(bridgeTx);
     emitter.emit(PollingEvent.PROCESSABLE, isProcessable);
 
@@ -134,13 +134,13 @@ export function startPolling(bridgeTx: BridgeTransaction, runImmediately = true)
 
       let blockNumber: Hex;
       if (!bridgeTx.blockNumber) {
-        const receipt = await getTransactionReceipt(config, { hash: bridgeTx.hash });
+        const receipt = await getTransactionReceipt(config, { hash: bridgeTx.srcTxHash });
         blockNumber = toHex(receipt.blockNumber);
         bridgeTx.blockNumber = blockNumber;
       }
 
       if (messageStatus === MessageStatus.DONE) {
-        log(`Poller has picked up the change of status to DONE for hash ${hash}.`);
+        log(`Poller has picked up the change of status to DONE for hash ${srcTxHash}.`);
         stopPolling();
       }
     } catch (err) {
@@ -156,8 +156,8 @@ export function startPolling(bridgeTx: BridgeTransaction, runImmediately = true)
     emitter = new EventEmitter();
     interval = setInterval(pollingFn, bridgeTransactionPoller.interval);
 
-    hashEmitterMap[hash] = emitter;
-    hashIntervalMap[hash] = interval;
+    hashEmitterMap[srcTxHash] = emitter;
+    hashIntervalMap[srcTxHash] = interval;
 
     // setImmediate isn't standard
     if (runImmediately) {
diff --git a/packages/bridge-ui/src/libs/proof/BridgeProver.test.ts b/packages/bridge-ui/src/libs/proof/BridgeProver.test.ts
index 4282167757e..a92d2d402e5 100644
--- a/packages/bridge-ui/src/libs/proof/BridgeProver.test.ts
+++ b/packages/bridge-ui/src/libs/proof/BridgeProver.test.ts
@@ -1,5 +1,14 @@
 import { getPublicClient, readContract } from '@wagmi/core';
-import { BlockNotFoundError, keccak256, numberToHex, stringToHex, toBytes, zeroAddress, zeroHash } from 'viem';
+import {
+  BlockNotFoundError,
+  type Hash,
+  keccak256,
+  numberToHex,
+  stringToHex,
+  toBytes,
+  zeroAddress,
+  zeroHash,
+} from 'viem';
 
 import { signalServiceAbi } from '$abi';
 import { routingContractsMap } from '$bridgeConfig';
@@ -102,9 +111,11 @@ describe('BridgeProver', () => {
       decimals: 0,
       destChainId: BigInt(167001),
       from: '0x8626f6940E2eb28930eFb4CeF49B2d1F2C9C1199',
-      hash: '0xc0a3476ac80c3468a65702864ff4ef22ca5b54afac3d0911fb14165cdada7f1c',
+      srcTxHash: '0xc0a3476ac80c3468a65702864ff4ef22ca5b54afac3d0911fb14165cdada7f1c',
+      destTxHash: '' as Hash,
       msgHash: '0x36973cd4172846df09d48d0bf428802d674848d39229962bbaec2e2fea465f15',
       srcChainId: 32382n,
+      processingFee: 0n,
       message: {
         data: '0x',
         destChainId: 167001n,
diff --git a/packages/bridge-ui/src/libs/relayer/RelayerAPIService.test.ts b/packages/bridge-ui/src/libs/relayer/RelayerAPIService.test.ts
index 337f78301a3..54bb60637f4 100644
--- a/packages/bridge-ui/src/libs/relayer/RelayerAPIService.test.ts
+++ b/packages/bridge-ui/src/libs/relayer/RelayerAPIService.test.ts
@@ -63,7 +63,6 @@ describe('RelayerAPIService', () => {
     const relayerAPIService = new RelayerAPIService(baseUrl);
     const address = '0x123';
     const paginationParams = { page: 1, size: 10 };
-    const chainID = 1;
 
     const mockResponse = {
       data: {
@@ -77,7 +76,7 @@ describe('RelayerAPIService', () => {
     mockedAxios.get.mockResolvedValue(mockResponse);
 
     // When
-    const result = await relayerAPIService.getAllBridgeTransactionByAddress(address, paginationParams, chainID);
+    const result = await relayerAPIService.getAllBridgeTransactionByAddress(address, paginationParams);
 
     // Then
     expect(result).toBeDefined();
diff --git a/packages/bridge-ui/src/libs/relayer/RelayerAPIService.ts b/packages/bridge-ui/src/libs/relayer/RelayerAPIService.ts
index 5d9ad527908..c3735a31afa 100644
--- a/packages/bridge-ui/src/libs/relayer/RelayerAPIService.ts
+++ b/packages/bridge-ui/src/libs/relayer/RelayerAPIService.ts
@@ -1,7 +1,7 @@
 import { getTransactionReceipt, readContract } from '@wagmi/core';
 import axios from 'axios';
 import { Buffer } from 'buffer';
-import type { Address, Hash, Hex, TransactionReceipt } from 'viem';
+import { type Address, getAddress, type Hash, type Hex, type TransactionReceipt } from 'viem';
 
 import { bridgeAbi } from '$abi';
 import { routingContractsMap } from '$bridgeConfig';
@@ -137,11 +137,9 @@ export class RelayerAPIService {
   async getAllBridgeTransactionByAddress(
     address: Address,
     paginationParams: PaginationParams,
-    chainID?: number,
   ): Promise<GetAllByAddressResponse> {
     const params = {
       address,
-      chainID,
       event: 'MessageSent',
       ...paginationParams,
     };
@@ -187,21 +185,23 @@ export class RelayerAPIService {
         amount: BigInt(tx.amount),
         symbol: tx.canonicalTokenSymbol || 'ETH',
         decimals: tx.canonicalTokenDecimals,
-        hash: tx.data.Raw.transactionHash,
-        from: tx.messageOwner,
+        srcTxHash: tx.data.Raw.transactionHash,
+        destTxHash: tx.processedTxHash,
+        from: getAddress(tx.messageOwner),
         srcChainId: tx.data.Message.SrcChainId,
         destChainId: tx.data.Message.DestChainId,
         msgHash: tx.msgHash,
         tokenType: tokenType,
         blockNumber: tx.data.Raw.blockNumber,
         canonicalTokenAddress: tx.canonicalTokenAddress,
+        processingFee: BigInt(tx.data.Message.Fee.toString()),
         message: {
           id: tx.data.Message.Id,
-          to: tx.data.Message.To,
-          destOwner: tx.data.Message.DestOwner,
+          to: getAddress(tx.data.Message.To),
+          destOwner: getAddress(tx.data.Message.DestOwner),
           data: data as Hex,
-          srcOwner: tx.data.Message.SrcOwner,
-          from: tx.data.Message.From,
+          srcOwner: getAddress(tx.data.Message.SrcOwner),
+          from: getAddress(tx.data.Message.From),
           gasLimit: tx.data.Message.GasLimit,
           value,
           srcChainId: BigInt(tx.data.Message.SrcChainId),
@@ -216,16 +216,20 @@ export class RelayerAPIService {
     const txsPromises = txs.map(async (bridgeTx) => {
       if (!bridgeTx) return;
 
-      if (bridgeTx.from.toLowerCase() !== address.toLowerCase()) return;
-      const { destChainId, srcChainId, hash, msgHash } = bridgeTx;
+      const senderMatch = getAddress(bridgeTx.from) === getAddress(address);
+      const receiverMatch = bridgeTx.message && getAddress(bridgeTx.message.destOwner) === getAddress(address);
+
+      if (!senderMatch && !receiverMatch) return;
+
+      const { destChainId, srcChainId, srcTxHash, msgHash } = bridgeTx;
 
       // Returns the transaction receipt for hash or null
       // if the transaction has not been mined.
-      const receipt = await RelayerAPIService._getTransactionReceipt(Number(srcChainId), hash);
+      const receipt = await RelayerAPIService._getTransactionReceipt(Number(srcChainId), srcTxHash);
 
       // TODO: do we want to show these transactions?
       if (!receipt || receipt === null) {
-        log('Transaction not mined yet', { hash, srcChainId });
+        log('Transaction not mined yet', { srcTxHash, srcChainId });
       }
 
       bridgeTx.receipt = receipt as TransactionReceipt;
diff --git a/packages/bridge-ui/src/libs/relayer/types.ts b/packages/bridge-ui/src/libs/relayer/types.ts
index 90ed2b64ed0..9c73ffd04cd 100644
--- a/packages/bridge-ui/src/libs/relayer/types.ts
+++ b/packages/bridge-ui/src/libs/relayer/types.ts
@@ -1,4 +1,4 @@
-import type { Address, Hex } from 'viem';
+import type { Address, Hash, Hex } from 'viem';
 
 import type { BridgeTransaction, RelayerMessage } from '$libs/bridge';
 
@@ -58,9 +58,11 @@ export type APIResponseTransaction = {
   canonicalTokenName: string;
   canonicalTokenDecimals: number;
   amount: string;
-  msgHash: Hex;
+  msgHash: Hash;
   messageOwner: Address;
   event: string;
+  claimedBy: Address;
+  processedTxHash: Hash;
 };
 
 export type RelayerBlockInfo = {
diff --git a/packages/bridge-ui/src/libs/storage/BridgeTxService.ts b/packages/bridge-ui/src/libs/storage/BridgeTxService.ts
index f69c8373287..2653e768afe 100644
--- a/packages/bridge-ui/src/libs/storage/BridgeTxService.ts
+++ b/packages/bridge-ui/src/libs/storage/BridgeTxService.ts
@@ -98,7 +98,7 @@ export class BridgeTxService {
 
     const bridgeTx: BridgeTransaction = { ...tx }; // prevent mutation
 
-    const { destChainId, srcChainId, hash } = bridgeTx;
+    const { destChainId, srcChainId, srcTxHash } = bridgeTx;
 
     // Ignore transactions from chains not supported by the bridge
     if (!isSupportedChain(Number(srcChainId))) return;
@@ -108,14 +108,14 @@ export class BridgeTxService {
     if (waitForTx) {
       // We might want to wait for the transaction to be mined
       receipt = await waitForTransactionReceipt(config, {
-        hash,
+        hash: srcTxHash,
         chainId: Number(srcChainId),
         timeout: pendingTransaction.waitTimeout,
       });
     } else {
       // Returns the transaction receipt for hash or null
       // if the transaction has not been mined.
-      receipt = await BridgeTxService._getTransactionReceipt(Number(srcChainId), hash);
+      receipt = await BridgeTxService._getTransactionReceipt(Number(srcChainId), srcTxHash);
     }
 
     if (!receipt) {
@@ -201,7 +201,7 @@ export class BridgeTxService {
   async getTxByHash(hash: Hash, address: Address) {
     const txs = this._getTxFromStorage(address);
 
-    const tx = txs.find((tx) => tx.hash === hash) as BridgeTransaction;
+    const tx = txs.find((tx) => tx.srcTxHash === hash) as BridgeTransaction;
 
     log('Transaction from storage', { ...tx });
 
@@ -237,9 +237,9 @@ export class BridgeTxService {
     log('Removing transactions from storage', txs);
     const txsFromStorage = this._getTxFromStorage(address);
 
-    const txsToRemove = txs.map((tx) => tx.hash);
+    const txsToRemove = txs.map((tx) => tx.srcTxHash);
 
-    const filteredTxs = txsFromStorage.filter((tx) => !txsToRemove.includes(tx.hash));
+    const filteredTxs = txsFromStorage.filter((tx) => !txsToRemove.includes(tx.srcTxHash));
 
     this.updateByAddress(address, filteredTxs);
   }
diff --git a/packages/bridge-ui/src/libs/util/mergeTransactions.test.ts b/packages/bridge-ui/src/libs/util/mergeTransactions.test.ts
index f6196e92cee..ffb09bc4a03 100644
--- a/packages/bridge-ui/src/libs/util/mergeTransactions.test.ts
+++ b/packages/bridge-ui/src/libs/util/mergeTransactions.test.ts
@@ -47,11 +47,13 @@ describe('mergeUniqueTransactions', () => {
   // Given
   const localTxs: BridgeTransaction[] = [
     {
-      hash: 'hash1' as Hex,
+      srcTxHash: 'hash1' as Hex,
+      destTxHash: 'destHash1' as Hex,
       from: 'address1' as Address,
       amount: BigInt(1000),
       symbol: 'symbol1',
       decimals: 2,
+      processingFee: 1111n,
       srcChainId: BigInt(1),
       destChainId: BigInt(2),
       msgStatus: MessageStatus.DONE,
@@ -62,11 +64,13 @@ describe('mergeUniqueTransactions', () => {
       tokenType: 'ERC20' as TokenType,
     },
     {
-      hash: 'hash2' as Hex,
+      srcTxHash: 'hash2' as Hex,
+      destTxHash: 'destHash2' as Hex,
       from: 'address2' as Address,
       amount: BigInt(2000),
       symbol: 'symbol2',
       decimals: 2,
+      processingFee: 1111n,
       srcChainId: BigInt(1),
       destChainId: BigInt(2),
       msgStatus: MessageStatus.DONE,
@@ -79,11 +83,13 @@ describe('mergeUniqueTransactions', () => {
 
   const relayerTx: BridgeTransaction[] = [
     {
-      hash: 'hash3' as Hex,
+      srcTxHash: 'hash3' as Hex,
+      destTxHash: 'destHash3' as Hex,
       from: 'address3' as Address,
       amount: BigInt(3000),
       symbol: 'symbol3',
       decimals: 2,
+      processingFee: 1111n,
       srcChainId: BigInt(1),
       destChainId: BigInt(2),
       msgStatus: MessageStatus.DONE,
@@ -93,11 +99,13 @@ describe('mergeUniqueTransactions', () => {
       blockNumber: '0x123',
     },
     {
-      hash: 'hash4' as Hex,
+      srcTxHash: 'hash4' as Hex,
+      destTxHash: 'destHash4' as Hex,
       from: 'address4' as Address,
       amount: BigInt(4000),
       symbol: 'symbol4',
       decimals: 2,
+      processingFee: 1111n,
       srcChainId: BigInt(1),
       destChainId: BigInt(2),
       msgStatus: MessageStatus.DONE,
@@ -136,10 +144,12 @@ describe('mergeUniqueTransactions', () => {
     const localWithOutdated = [
       ...localTxs,
       {
-        hash: 'hash3' as Hex,
+        srcTxHash: 'hash3' as Hex,
+        destTxHash: 'destHash3' as Hex,
         from: 'address2' as Address,
         amount: BigInt(2000),
         symbol: 'symbol2',
+        processingFee: 1111n,
         decimals: 2,
         srcChainId: BigInt(1),
         destChainId: BigInt(2),
@@ -164,5 +174,5 @@ describe('mergeUniqueTransactions', () => {
 });
 
 function extractHashes(transactions: BridgeTransaction[]): Hex[] {
-  return transactions.map((tx) => tx.hash);
+  return transactions.map((tx) => tx.srcTxHash);
 }
diff --git a/packages/bridge-ui/src/libs/util/mergeTransactions.ts b/packages/bridge-ui/src/libs/util/mergeTransactions.ts
index 42805471ed3..d5865fa665b 100644
--- a/packages/bridge-ui/src/libs/util/mergeTransactions.ts
+++ b/packages/bridge-ui/src/libs/util/mergeTransactions.ts
@@ -10,13 +10,13 @@ export const mergeAndCaptureOutdatedTransactions = (
   relayerTx: BridgeTransaction[],
 ): MergeResult => {
   const relayerTxMap: Map<string, BridgeTransaction> = new Map();
-  relayerTx.forEach((tx) => relayerTxMap.set(tx.hash, tx));
+  relayerTx.forEach((tx) => relayerTxMap.set(tx.srcTxHash, tx));
 
   const outdatedLocalTransactions: BridgeTransaction[] = [];
   const mergedTransactions: BridgeTransaction[] = [];
 
   for (const tx of localTxs) {
-    if (!relayerTxMap.has(tx.hash)) {
+    if (!relayerTxMap.has(tx.srcTxHash)) {
       mergedTransactions.push(tx);
     } else {
       outdatedLocalTransactions.push(tx);
diff --git a/packages/bridge-ui/src/libs/util/shortenAddress.ts b/packages/bridge-ui/src/libs/util/shortenAddress.ts
index 23902b714fa..25588b0718b 100644
--- a/packages/bridge-ui/src/libs/util/shortenAddress.ts
+++ b/packages/bridge-ui/src/libs/util/shortenAddress.ts
@@ -1,4 +1,4 @@
-export const shortenAddress = (address: string, charsStart = 6, charsEnd = 4, sep = '…') => {
+export const shortenAddress = (address: string | undefined, charsStart = 6, charsEnd = 4, sep = '…') => {
   if (!address) return '0x';
   return [address.slice(0, charsStart), address.slice(-charsEnd)].join(sep);
 };
diff --git a/packages/bridge-ui/src/tests/mocks/transactions.ts b/packages/bridge-ui/src/tests/mocks/transactions.ts
index 57dfaa6fa80..101ee295376 100644
--- a/packages/bridge-ui/src/tests/mocks/transactions.ts
+++ b/packages/bridge-ui/src/tests/mocks/transactions.ts
@@ -9,10 +9,12 @@ import { L1_CHAIN_ID, L2_CHAIN_ID } from './chains';
 import { MOCK_MESSAGE_L1_L2 } from './messages';
 
 export const MOCK_BRIDGE_TX_1 = {
-  hash: zeroHash,
+  srcTxHash: zeroHash,
+  destTxHash: zeroHash,
   status: 0,
   msgStatus: MessageStatus.NEW,
   msgHash: zeroHash,
+  processingFee: 1111n,
   from: ALICE,
   amount: 123n,
   symbol: 'WAGMI',
diff --git a/packages/bridge-ui/tailwind.config.js b/packages/bridge-ui/tailwind.config.js
index 2aef58aa151..d13370033e9 100644
--- a/packages/bridge-ui/tailwind.config.js
+++ b/packages/bridge-ui/tailwind.config.js
@@ -248,6 +248,9 @@ export default {
           '--warning-sentiment': '#EBB222', // yellow-400
           '--warning-background': '#382800', // yellow-800
 
+          '--neutral-sentiment': '#0052CC', // blue-500
+          '--neutral-sentiment-background': '#002966', //  blue-700
+
           '--elevated-background': '#191E28', // grey-800
           '--neutral-background': '#2B303B', // grey-700
           '--neutral-content': '#2B303B', // grey-800