diff --git a/src/app/components/StampListSection.tsx b/src/app/components/StampListSection.tsx
index 6e13dfe..38ee1b2 100644
--- a/src/app/components/StampListSection.tsx
+++ b/src/app/components/StampListSection.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useCallback } from 'react';
 import styles from './css/StampListSection.module.css';
 import { formatUnits } from 'viem';
 import { UploadStep } from './types';
@@ -58,6 +58,8 @@ interface BatchEvent {
   batchTTL?: number;
   bucketDepth?: number;
   isPropagating?: boolean; // Flag to indicate stamp is still propagating on network
+  payer?: string; // The payer address (actual buyer if bought through proxy)
+  owner?: string; // The owner address (from the registry query)
 }
 
 interface StampInfo {
@@ -180,7 +182,7 @@ const StampListSection: React.FC<StampListSectionProps> = ({
     }
   };
 
-  const markStampAsExpired = (batchId: string, stampTimestamp?: number) => {
+  const markStampAsExpired = useCallback((batchId: string, stampTimestamp?: number) => {
     try {
       const cache = getExpiredStampsCache();
       const now = Date.now();
@@ -220,7 +222,7 @@ const StampListSection: React.FC<StampListSectionProps> = ({
     } catch (error) {
       console.warn('Error updating expired stamps cache:', error);
     }
-  };
+  }, []);
 
   useEffect(() => {
     const isStampKnownExpired = (batchId: string): boolean => {
@@ -330,6 +332,7 @@ const StampListSection: React.FC<StampListSectionProps> = ({
             const stampInfo = await fetchStampInfo(batchId, stampTimestamp);
 
             const depth = Number(contractBatch.depth);
+            const payer = contractBatch.payer?.toString();
 
             // If no stamp info, determine if it's propagating or expired
             if (!stampInfo) {
@@ -349,6 +352,8 @@ const StampListSection: React.FC<StampListSectionProps> = ({
                   batchTTL: 30 * 24 * 60 * 60, // Assume 30 days default
                   bucketDepth: 16, // Standard bucket depth
                   isPropagating: true, // Flag to show propagation message
+                  payer,
+                  owner: address,
                 };
               }
 
@@ -366,6 +371,8 @@ const StampListSection: React.FC<StampListSectionProps> = ({
               batchTTL: stampInfo.batchTTL,
               bucketDepth: stampInfo.bucketDepth,
               isPropagating: false, // Not propagating, we have real data
+              payer,
+              owner: address,
             };
           });
 
@@ -392,7 +399,7 @@ const StampListSection: React.FC<StampListSectionProps> = ({
     };
 
     fetchStamps();
-  }, [address, beeApiUrl]); // Only dependencies that actually need to trigger re-fetching
+  }, [address, beeApiUrl, markStampAsExpired]); // Only dependencies that actually need to trigger re-fetching
 
   // Function to refresh a specific stamp
   const refreshSingleStamp = async (stampToRefresh: BatchEvent) => {
@@ -465,30 +472,93 @@ const StampListSection: React.FC<StampListSectionProps> = ({
           <div className={styles.stampListEmpty}>No stamps found</div>
         ) : (
           <>
-            {stamps.map((stamp, index) => (
-              <div key={index} className={styles.stampListItem}>
-                <div
-                  className={styles.stampListId}
-                  onClick={() => {
-                    const idToCopy = stamp.batchId.startsWith('0x')
-                      ? stamp.batchId.slice(2)
-                      : stamp.batchId;
-                    navigator.clipboard.writeText(idToCopy);
-                    // Show temporary "Copied!" message
-                    const element = document.querySelector(`[data-stamp-id="${stamp.batchId}"]`);
-                    if (element) {
-                      element.setAttribute('data-copied', 'true');
-                      setTimeout(() => {
-                        element.setAttribute('data-copied', 'false');
-                      }, 2000);
-                    }
-                  }}
-                  data-stamp-id={stamp.batchId}
-                  data-copied="false"
-                  title="Click to copy stamp ID"
-                >
-                  ID: {stamp.batchId.startsWith('0x') ? stamp.batchId.slice(2) : stamp.batchId}
-                </div>
+            {stamps.map((stamp, index) => {
+              // Determine which address to show (payer if bought through proxy, otherwise owner)
+              const getOwnerToDisplay = () => {
+                if (!stamp.owner && !stamp.payer) return null;
+                // If owner and payer are different, it was bought through proxy - show payer
+                if (
+                  stamp.owner &&
+                  stamp.payer &&
+                  stamp.owner.toLowerCase() !== stamp.payer.toLowerCase()
+                ) {
+                  return stamp.payer;
+                }
+                // Otherwise show owner (or payer if owner is not available)
+                return stamp.owner || stamp.payer || null;
+              };
+
+              // Determine the label for the owner field
+              const getOwnerLabel = () => {
+                if (!stamp.owner || !stamp.payer) return 'Owner';
+                // If they're different, it was bought through proxy
+                if (stamp.owner.toLowerCase() !== stamp.payer.toLowerCase()) {
+                  return 'Buyer';
+                }
+                return 'Owner';
+              };
+
+              // Format address with truncation (first6...last4)
+              const formatAddress = (address: string) => {
+                const cleanAddress = address.startsWith('0x') ? address.slice(2) : address;
+                if (cleanAddress.length <= 10) return cleanAddress;
+                return `${cleanAddress.slice(0, 6)}...${cleanAddress.slice(-4)}`;
+              };
+
+              const ownerToDisplay = getOwnerToDisplay();
+
+              return (
+                <div key={index} className={styles.stampListItem}>
+                  <div className={styles.stampIdRow}>
+                    <div
+                      className={styles.stampListId}
+                      onClick={() => {
+                        const idToCopy = stamp.batchId.startsWith('0x')
+                          ? stamp.batchId.slice(2)
+                          : stamp.batchId;
+                        navigator.clipboard.writeText(idToCopy);
+                        // Show temporary "Copied!" message
+                        const element = document.querySelector(`[data-stamp-id="${stamp.batchId}"]`);
+                        if (element) {
+                          element.setAttribute('data-copied', 'true');
+                          setTimeout(() => {
+                            element.setAttribute('data-copied', 'false');
+                          }, 2000);
+                        }
+                      }}
+                      data-stamp-id={stamp.batchId}
+                      data-copied="false"
+                      title="Click to copy stamp ID"
+                    >
+                      ID: {stamp.batchId.startsWith('0x') ? stamp.batchId.slice(2) : stamp.batchId}
+                    </div>
+                    {ownerToDisplay && (
+                      <div
+                        className={styles.stampOwner}
+                        onClick={() => {
+                          const addressToCopy = ownerToDisplay.startsWith('0x')
+                            ? ownerToDisplay
+                            : `0x${ownerToDisplay}`;
+                          navigator.clipboard.writeText(addressToCopy);
+                          // Show temporary "Copied!" message
+                          const element = document.querySelector(
+                            `[data-owner-address="${stamp.batchId}"]`
+                          );
+                          if (element) {
+                            element.setAttribute('data-copied', 'true');
+                            setTimeout(() => {
+                              element.setAttribute('data-copied', 'false');
+                            }, 2000);
+                          }
+                        }}
+                        data-owner-address={stamp.batchId}
+                        data-copied="false"
+                        title="Click to copy owner address"
+                      >
+                        {getOwnerLabel()}: {formatAddress(ownerToDisplay)}
+                      </div>
+                    )}
+                  </div>
                 <div className={styles.stampListDetails}>
                   <span>Paid: {Number(stamp.totalAmount).toFixed(2)} BZZ</span>
                   <span>Size: {stamp.size}</span>
@@ -608,7 +678,8 @@ const StampListSection: React.FC<StampListSectionProps> = ({
                   </button>
                 </div>
               </div>
-            ))}
+              );
+            })}
           </>
         )}
 
diff --git a/src/app/components/SwapComponent.tsx b/src/app/components/SwapComponent.tsx
index 0e95985..ee58dbc 100644
--- a/src/app/components/SwapComponent.tsx
+++ b/src/app/components/SwapComponent.tsx
@@ -38,6 +38,7 @@ import SearchableChainDropdown from './SearchableChainDropdown';
 import SearchableTokenDropdown from './SearchableTokenDropdown';
 import StorageStampsDropdown from './StorageStampsDropdown';
 import StorageDurationDropdown from './StorageDurationDropdown';
+import TTLDisplay from './TTLDisplay';
 
 import {
   formatErrorMessage,
@@ -50,6 +51,8 @@ import {
   // handleExchangeRateUpdate removed - was only used by LiFi
   fetchCurrentPriceFromOracle,
   fetchStampInfo,
+  fetchBatchInfoFromContract,
+  fetchBatchOwnerInfo,
   formatExpiryTime,
   isExpiringSoon,
   getStampUsage,
@@ -227,6 +230,18 @@ const SwapComponent: React.FC = () => {
   // Add state for original stamp info (used in top-ups)
   const [originalStampInfo, setOriginalStampInfo] = useState<StampInfo | null>(null);
 
+  // Add state for batch info from contract (TTL and remaining balance)
+  const [contractBatchInfo, setContractBatchInfo] = useState<{
+    ttlSeconds: number;
+    remainingBalance: string;
+    depth: number;
+    owner?: string;
+    payer?: string;
+  } | null>(null);
+
+  // Add state for TTL display flashing animation
+  const [isTTLFlashing, setIsTTLFlashing] = useState(false);
+
   // Add a ref to track the current wallet client
   const currentWalletClientRef = useRef(walletClient);
 
@@ -628,6 +643,18 @@ const SwapComponent: React.FC = () => {
     }
   };
 
+  // Calculate amount for topping up an existing batch
+  const calculateTopUpAmount = useCallback((originalDepth: number) => {
+    if (currentPrice === null || !selectedDays) return 0n;
+
+    // We use the original depth from the stamp, not the currently selected depth
+    const initialPaymentPerChunkPerDay = BigInt(currentPrice) * BigInt(17280);
+    const totalPricePerDuration = initialPaymentPerChunkPerDay * BigInt(selectedDays);
+
+    // Calculate for the original batch depth
+    return totalPricePerDuration * BigInt(2 ** originalDepth);
+  }, [currentPrice, selectedDays]);
+
   // Check approval status when relevant parameters change
   useEffect(() => {
     const checkApprovalStatus = async () => {
@@ -673,6 +700,7 @@ const SwapComponent: React.FC = () => {
     originalStampInfo,
     selectedDepth,
     checkBzzApproval,
+    calculateTopUpAmount,
   ]);
 
   useEffect(() => {
@@ -1554,6 +1582,7 @@ const SwapComponent: React.FC = () => {
     // Only fetch if we have a topUpBatchId and we're in top-up mode
     if (topUpBatchId && isTopUp) {
       const getStampInfo = async () => {
+        // Fetch from Bee API for depth info
         const stampInfo = await fetchStampInfoForComponent(topUpBatchId);
         if (stampInfo) {
           console.log('Fetched original stamp info:', stampInfo);
@@ -1568,23 +1597,58 @@ const SwapComponent: React.FC = () => {
             swarmBatchDepth: stampInfo.depth.toString(),
           }));
         }
+
+        // Fetch TTL and balance from contract
+        const batchInfo = await fetchBatchInfoFromContract(topUpBatchId);
+        if (batchInfo) {
+          // Fetch owner info from registry by querying events
+          const ownerInfo = await fetchBatchOwnerInfo(topUpBatchId);
+
+          const combinedInfo = {
+            ...batchInfo,
+            owner: ownerInfo?.owner,
+            payer: ownerInfo?.payer,
+          };
+
+          setContractBatchInfo(combinedInfo);
+        }
       };
 
       getStampInfo();
     }
   }, [topUpBatchId, isTopUp, fetchStampInfoForComponent]);
 
-  // Calculate amount for topping up an existing batch
-  const calculateTopUpAmount = (originalDepth: number) => {
-    if (currentPrice === null || !selectedDays) return 0n;
+  // Add this effect to refresh stamp info periodically (every 60 seconds)
+  useEffect(() => {
+    if (!topUpBatchId || !isTopUp) return;
+
+    const refreshStampInfo = async () => {
+      // Flash before refreshing
+      setIsTTLFlashing(true);
+      setTimeout(() => setIsTTLFlashing(false), 600); // Match flash animation duration
+
+      // Fetch updated TTL and balance from contract
+      const batchInfo = await fetchBatchInfoFromContract(topUpBatchId);
+      if (batchInfo) {
+        // Fetch owner info from registry by querying events
+        const ownerInfo = await fetchBatchOwnerInfo(topUpBatchId);
+
+        const combinedInfo = {
+          ...batchInfo,
+          owner: ownerInfo?.owner,
+          payer: ownerInfo?.payer,
+        };
 
-    // We use the original depth from the stamp, not the currently selected depth
-    const initialPaymentPerChunkPerDay = BigInt(currentPrice) * BigInt(17280);
-    const totalPricePerDuration = initialPaymentPerChunkPerDay * BigInt(selectedDays);
+        setContractBatchInfo(combinedInfo);
+      }
+    };
 
-    // Calculate for the original batch depth
-    return totalPricePerDuration * BigInt(2 ** originalDepth);
-  };
+    // Set up interval to refresh every 60 seconds
+    const intervalId = setInterval(refreshStampInfo, 60000);
+
+    // Clean up interval on unmount
+    return () => clearInterval(intervalId);
+  }, [topUpBatchId, isTopUp]);
 
   // Add useEffect to set hasMounted after component mounts
   useEffect(() => {
@@ -1654,6 +1718,22 @@ const SwapComponent: React.FC = () => {
 
       {!showHelp && !showStampList && !showUploadHistory ? (
         <>
+          {isTopUp && contractBatchInfo && (
+            <div className={styles.inputGroup}>
+              <label className={styles.label}>
+                Stamp expiry:
+              </label>
+              <TTLDisplay
+                ttlSeconds={contractBatchInfo.ttlSeconds}
+                stampValue={contractBatchInfo.remainingBalance}
+                stampId={topUpBatchId || undefined}
+                owner={contractBatchInfo.owner}
+                payer={contractBatchInfo.payer}
+                isFlashing={isTTLFlashing}
+              />
+            </div>
+          )}
+
           <div className={styles.inputGroup}>
             <label className={styles.label} data-tooltip="Select chain with funds">
               From chain
@@ -2563,8 +2643,10 @@ const SwapComponent: React.FC = () => {
                         if (typeof window !== 'undefined') {
                           const url = new URL(window.location.href);
                           if (url.searchParams.has('topup')) {
-                            // Remove the topup parameter and navigate to clean URL
-                            window.location.href = window.location.origin;
+                            // Get the topup batch ID to preserve in URL
+                            const topupParam = url.searchParams.get('topup');
+                            // Navigate with topup parameter preserved
+                            window.location.href = `${window.location.origin}/?topup=${topupParam}`;
                           }
                         }
                       }}
diff --git a/src/app/components/TTLDisplay.tsx b/src/app/components/TTLDisplay.tsx
new file mode 100644
index 0000000..2ca90b5
--- /dev/null
+++ b/src/app/components/TTLDisplay.tsx
@@ -0,0 +1,365 @@
+import React, { useState, useEffect, useRef } from 'react';
+import { formatDetailedTTL, fetchBatchInfoFromContract } from './utils';
+import styles from './css/TTLDisplay.module.css';
+
+interface TTLDisplayProps {
+  ttlSeconds: number;
+  stampValue: string; // The amount/balance of the stamp
+  stampId?: string; // The stamp/batch ID
+  owner?: string; // The owner of the stamp
+  payer?: string; // The payer (actual buyer if bought through proxy)
+  isFlashing?: boolean;
+  onTTLUpdate?: (newTTL: number, newBalance: string) => void; // Callback when TTL is updated from blockchain
+}
+
+const TTLDisplay: React.FC<TTLDisplayProps> = ({
+  ttlSeconds: initialTTLSeconds,
+  stampValue: initialStampValue,
+  stampId,
+  owner,
+  payer,
+  isFlashing = false,
+  onTTLUpdate
+}) => {
+  // State for live countdown
+  const [currentTTL, setCurrentTTL] = useState(initialTTLSeconds);
+  const [currentBalance, setCurrentBalance] = useState(initialStampValue);
+  const lastBlockchainSyncRef = useRef<number>(Date.now());
+  const countdownIntervalRef = useRef<NodeJS.Timeout | null>(null);
+  const syncIntervalRef = useRef<NodeJS.Timeout | null>(null);
+
+  // Constants for character width calculation
+  // Using font-size: 1.2rem with letter-spacing: 0.06rem from CSS
+  // For the countdown string, we need to estimate conservatively
+  // Font: 1.2rem with letter-spacing 0.06rem
+  // Average character width including spacing: ~0.65rem (conservative)
+  // Container typically 600-800px wide, minus padding
+  // "remaining..." text adds ~12 characters worth of space
+  const APPROX_CHAR_WIDTH = 0.65; // in rem (conservative for proportional font)
+  const BASE_FONT_SIZE = 16; // Default browser font size in pixels
+  const CONTAINER_PADDING_REM = 1.5; // 12px * 2 = 24px = ~1.5rem in padding
+  const ESTIMATED_WIDTH_REM = 45; // ~720px container width in rem
+  const REMAINING_TEXT_WIDTH_REM = 8; // "remaining..." takes about 8rem
+  const AVAILABLE_WIDTH_REM = ESTIMATED_WIDTH_REM - CONTAINER_PADDING_REM - REMAINING_TEXT_WIDTH_REM;
+  const MAX_CHARS = Math.floor(AVAILABLE_WIDTH_REM / APPROX_CHAR_WIDTH);
+
+  // Update local state when props change
+  useEffect(() => {
+    setCurrentTTL(initialTTLSeconds);
+    setCurrentBalance(initialStampValue);
+  }, [initialTTLSeconds, initialStampValue]);
+
+  // Client-side countdown - updates every second
+  useEffect(() => {
+    if (currentTTL <= 0) return;
+
+    countdownIntervalRef.current = setInterval(() => {
+      setCurrentTTL(prev => {
+        const newTTL = prev - 1;
+        return newTTL > 0 ? newTTL : 0;
+      });
+    }, 1000);
+
+    return () => {
+      if (countdownIntervalRef.current) {
+        clearInterval(countdownIntervalRef.current);
+      }
+    };
+  }, [currentTTL]);
+
+  // Periodic blockchain sync - every 1 minute
+  useEffect(() => {
+    if (!stampId) return;
+
+    const syncWithBlockchain = async () => {
+      try {
+        const batchInfo = await fetchBatchInfoFromContract(stampId);
+
+        if (batchInfo) {
+          setCurrentTTL(batchInfo.ttlSeconds);
+          setCurrentBalance(batchInfo.remainingBalance);
+          lastBlockchainSyncRef.current = Date.now();
+
+          // Notify parent component of the update
+          if (onTTLUpdate) {
+            onTTLUpdate(batchInfo.ttlSeconds, batchInfo.remainingBalance);
+          }
+        }
+      } catch (error) {
+        console.error('Error syncing TTL with blockchain:', error);
+      }
+    };
+
+    // Initial sync after component mount
+    syncWithBlockchain();
+
+    // Set up periodic sync every 60 seconds
+    syncIntervalRef.current = setInterval(syncWithBlockchain, 60000);
+
+    return () => {
+      if (syncIntervalRef.current) {
+        clearInterval(syncIntervalRef.current);
+      }
+    };
+  }, [stampId, onTTLUpdate]);
+
+  // Format TTL for detailed display with character limit
+  const formattedTTL = formatDetailedTTL(currentTTL, MAX_CHARS);
+
+  // Calculate estimated expiry time
+  const formatExpiryDateTime = (seconds: number): string => {
+    if (seconds <= 0) {
+      return 'Expired';
+    }
+    const expiryDate = new Date(Date.now() + seconds * 1000);
+    return expiryDate.toLocaleString('en-GB', {
+      day: '2-digit',
+      month: '2-digit',
+      year: 'numeric',
+      hour: '2-digit',
+      minute: '2-digit',
+      hour12: false,
+    });
+  };
+
+  const estimatedExpiry = formatExpiryDateTime(currentTTL);
+
+  // Format stamp value in BZZ (BZZ has 16 decimal places: 1 BZZ = 10^16 PLUR)
+  const formatStampValue = (amount: string): string => {
+    try {
+      const amountBigInt = BigInt(amount);
+      // Convert PLUR to BZZ by dividing by 10^16
+      const bzz = Number(amountBigInt) / 1e16;
+
+      // Format with appropriate decimal places, removing trailing zeros
+      const formatted = bzz.toFixed(6);
+      return formatted.replace(/\.?0+$/, '') || '0';
+    } catch (error) {
+      return '0';
+    }
+  };
+
+  const bzzValue = formatStampValue(currentBalance);
+
+  // Handle copy to clipboard for balance
+  const handleCopyBalance = () => {
+    navigator.clipboard.writeText(`${bzzValue} BZZ`);
+
+    const element = document.querySelector('[data-balance]');
+    if (element) {
+      element.setAttribute('data-copied', 'true');
+      setTimeout(() => {
+        element.setAttribute('data-copied', 'false');
+      }, 2000);
+    }
+  };
+
+  // Handle copy to clipboard for expiration date
+  const handleCopyExpiration = () => {
+    navigator.clipboard.writeText(estimatedExpiry);
+
+    const element = document.querySelector('[data-expiration]');
+    if (element) {
+      element.setAttribute('data-copied', 'true');
+      setTimeout(() => {
+        element.setAttribute('data-copied', 'false');
+      }, 2000);
+    }
+  };
+
+  // Handle copy to clipboard for countdown
+  const handleCopyCountdown = () => {
+    navigator.clipboard.writeText(formattedTTL);
+
+    const element = document.querySelector('[data-countdown]');
+    if (element) {
+      element.setAttribute('data-copied', 'true');
+      setTimeout(() => {
+        element.setAttribute('data-copied', 'false');
+      }, 2000);
+    }
+  };
+
+  // Handle copy to clipboard for stamp ID
+  const handleCopyStampId = () => {
+    if (!stampId) return;
+    const idToCopy = stampId.startsWith('0x') ? stampId.slice(2) : stampId;
+    navigator.clipboard.writeText(idToCopy);
+
+    // Show temporary "Copied!" message
+    const element = document.querySelector(`[data-stamp-id="${stampId}"]`);
+    if (element) {
+      element.setAttribute('data-copied', 'true');
+      setTimeout(() => {
+        element.setAttribute('data-copied', 'false');
+      }, 2000);
+    }
+  };
+
+  // Handle copy to clipboard for share link
+  const handleCopyShareLink = () => {
+    if (typeof window === 'undefined') return;
+    const currentUrl = window.location.href;
+    navigator.clipboard.writeText(currentUrl);
+
+    // Show temporary "Copied!" message
+    const element = document.querySelector('[data-share-link]');
+    if (element) {
+      element.setAttribute('data-copied', 'true');
+      setTimeout(() => {
+        element.setAttribute('data-copied', 'false');
+      }, 2000);
+    }
+  };
+
+  // Format stamp ID with truncation (first6...last4)
+  const formatStampId = (id: string): string => {
+    const cleanId = id.startsWith('0x') ? id.slice(2) : id;
+    if (cleanId.length <= 10) return cleanId;
+    return `${cleanId.slice(0, 6)}...${cleanId.slice(-4)}`;
+  };
+
+  // Format address with truncation (first6...last4)
+  const formatAddress = (address: string): string => {
+    const cleanAddress = address.startsWith('0x') ? address.slice(2) : address;
+    if (cleanAddress.length <= 10) return cleanAddress;
+    return `${cleanAddress.slice(0, 6)}...${cleanAddress.slice(-4)}`;
+  };
+
+  // Handle copy to clipboard for owner address
+  const handleCopyOwner = () => {
+    const addressToCopy = getOwnerToCopy();
+    if (!addressToCopy) return;
+    const cleanAddress = addressToCopy.startsWith('0x') ? addressToCopy : `0x${addressToCopy}`;
+    navigator.clipboard.writeText(cleanAddress);
+
+    // Show temporary "Copied!" message
+    const element = document.querySelector('[data-owner-address]');
+    if (element) {
+      element.setAttribute('data-copied', 'true');
+      setTimeout(() => {
+        element.setAttribute('data-copied', 'false');
+      }, 2000);
+    }
+  };
+
+  // Determine which address to show (payer if bought through proxy, otherwise owner)
+  const getOwnerToDisplay = (): string | null => {
+    if (!owner && !payer) return null;
+    // If owner and payer are different, it was bought through proxy - show payer
+    if (owner && payer && owner.toLowerCase() !== payer.toLowerCase()) {
+      return payer;
+    }
+    // Otherwise show owner (or payer if owner is not available)
+    return owner || payer || null;
+  };
+
+  // Get the address to copy (with 0x prefix)
+  const getOwnerToCopy = (): string | null => {
+    const displayAddress = getOwnerToDisplay();
+    if (!displayAddress) return null;
+    return displayAddress.startsWith('0x') ? displayAddress : `0x${displayAddress}`;
+  };
+
+  // Determine the label for the owner field
+  const getOwnerLabel = (): string => {
+    if (!owner || !payer) return 'Owner';
+    // If they're different, it was bought through proxy
+    if (owner.toLowerCase() !== payer.toLowerCase()) {
+      return 'Buyer';
+    }
+    return 'Owner';
+  };
+
+  const ownerToDisplay = getOwnerToDisplay();
+
+  return (
+    <div className={`${styles.ttlContainer} ${isFlashing ? styles.flashing : ''}`}>
+      {(stampId || ownerToDisplay) && (
+        <div className={styles.infoRow}>
+          {stampId && (
+            <div
+              className={styles.stampId}
+              onClick={handleCopyStampId}
+              data-stamp-id={stampId}
+              data-copied="false"
+              title="Click to copy stamp ID"
+            >
+              Stamp: {formatStampId(stampId)}
+            </div>
+          )}
+          {stampId && (
+            <div
+              className={styles.shareButton}
+              onClick={handleCopyShareLink}
+              data-share-link
+              data-copied="false"
+              title="Click to copy share link"
+            >
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                width="16"
+                height="16"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                strokeWidth="2"
+                strokeLinecap="round"
+                strokeLinejoin="round"
+              >
+                <circle cx="18" cy="5" r="3"></circle>
+                <circle cx="6" cy="12" r="3"></circle>
+                <circle cx="18" cy="19" r="3"></circle>
+                <line x1="8.59" y1="13.51" x2="15.42" y2="17.49"></line>
+                <line x1="15.41" y1="6.51" x2="8.59" y2="10.49"></line>
+              </svg>
+            </div>
+          )}
+          {ownerToDisplay && (
+            <div
+              className={styles.ownerAddress}
+              onClick={handleCopyOwner}
+              data-owner-address
+              data-copied="false"
+              title="Click to copy owner address"
+            >
+              {getOwnerLabel()}: {formatAddress(ownerToDisplay)}
+            </div>
+          )}
+        </div>
+      )}
+      <div
+        className={styles.mainTTL}
+        onClick={handleCopyCountdown}
+        data-countdown
+        data-copied="false"
+        title="Click to copy countdown"
+      >
+        {formattedTTL}
+      </div>
+      <div className={styles.detailsRow}>
+        <span
+          className={styles.leftDetail}
+          onClick={handleCopyBalance}
+          data-balance
+          data-copied="false"
+          title="Click to copy balance"
+        >
+          Balance: {bzzValue} BZZ
+        </span>
+        <span> • </span>
+        <span
+          className={styles.rightDetail}
+          onClick={handleCopyExpiration}
+          data-expiration
+          data-copied="false"
+          title="Click to copy expiration"
+        >
+          Expires: {estimatedExpiry}
+        </span>
+      </div>
+    </div>
+  );
+};
+
+export default TTLDisplay;
diff --git a/src/app/components/UploadHistorySection.tsx b/src/app/components/UploadHistorySection.tsx
index 19b65a6..8efe3bf 100644
--- a/src/app/components/UploadHistorySection.tsx
+++ b/src/app/components/UploadHistorySection.tsx
@@ -72,12 +72,12 @@ const UploadHistorySection: React.FC<UploadHistoryProps> = ({ address, setShowUp
   const [isMigrating, setIsMigrating] = React.useState(false);
   const [migrationProgress, setMigrationProgress] = React.useState<string>('');
 
-  const formatStampId = (stampId: string) => {
+  const formatStampId = React.useCallback((stampId: string) => {
     if (!stampId || typeof stampId !== 'string' || stampId.length < 10) {
       return stampId || 'Invalid Stamp ID';
     }
     return `${stampId.slice(0, 6)}...${stampId.slice(-4)}`;
-  };
+  }, []);
 
   const formatReference = (reference: string) => {
     if (!reference || typeof reference !== 'string' || reference.length < 10) {
@@ -90,20 +90,20 @@ const UploadHistorySection: React.FC<UploadHistoryProps> = ({ address, setShowUp
    * Checks if an expiry date needs migration
    * Returns true if the expiry date is in an old/invalid format
    */
-  const needsExpiryMigration = (expiryDate: number): boolean => {
+  const needsExpiryMigration = React.useCallback((expiryDate: number): boolean => {
     // Valid timestamp format: Unix timestamp in milliseconds
     // Should be > 1000000000000 (after Sep 9, 2001) and < 32503680000000 (before year 3000)
     if (!isNaN(expiryDate) && expiryDate > 1000000000000 && expiryDate < 32503680000000) {
       return false; // Already in correct format
     }
     return true; // Needs migration
-  };
+  }, []);
 
   /**
    * Auto-migrates old expiry dates by querying the Bee API
    * This runs on every load and updates localStorage when complete
    */
-  const migrateOldExpiryDates = async (records: UploadRecord[], userAddress: string) => {
+  const migrateOldExpiryDates = React.useCallback(async (records: UploadRecord[], userAddress: string) => {
     // Find records that need migration
     const recordsToMigrate = records.filter(record => needsExpiryMigration(record.expiryDate));
 
@@ -221,7 +221,7 @@ const UploadHistorySection: React.FC<UploadHistoryProps> = ({ address, setShowUp
       setIsMigrating(false);
       setMigrationProgress('');
     }
-  };
+  }, [needsExpiryMigration, formatStampId]);
 
   React.useEffect(() => {
     if (address) {
@@ -262,7 +262,7 @@ const UploadHistorySection: React.FC<UploadHistoryProps> = ({ address, setShowUp
         migrateOldExpiryDates(uniqueHistory, address);
       }
     }
-  }, [address]);
+  }, [address, migrateOldExpiryDates]);
 
   const formatDate = (timestamp: number) => {
     if (timestamp === undefined) return 'Unknown';
diff --git a/src/app/components/constants.ts b/src/app/components/constants.ts
index 094407d..fa9249e 100644
--- a/src/app/components/constants.ts
+++ b/src/app/components/constants.ts
@@ -205,6 +205,52 @@ export const GNOSIS_PRICE_ORACLE_ABI = [
   },
 ] as const;
 
+// PostageStamp contract ABI for querying batch information
+export const POSTAGE_STAMP_ABI = [
+  {
+    name: 'remainingBalance',
+    type: 'function',
+    stateMutability: 'view',
+    inputs: [{ name: '_batchId', type: 'bytes32' }],
+    outputs: [{ type: 'uint256' }],
+  },
+  {
+    name: 'batchNormalisedBalance',
+    type: 'function',
+    stateMutability: 'view',
+    inputs: [{ name: '_batchId', type: 'bytes32' }],
+    outputs: [{ type: 'uint256' }],
+  },
+  {
+    name: 'currentTotalOutPayment',
+    type: 'function',
+    stateMutability: 'view',
+    inputs: [],
+    outputs: [{ type: 'uint256' }],
+  },
+  {
+    name: 'lastPrice',
+    type: 'function',
+    stateMutability: 'view',
+    inputs: [],
+    outputs: [{ type: 'uint64' }],
+  },
+  {
+    name: 'batchDepth',
+    type: 'function',
+    stateMutability: 'view',
+    inputs: [{ name: '_batchId', type: 'bytes32' }],
+    outputs: [{ type: 'uint8' }],
+  },
+  {
+    name: 'batchOwner',
+    type: 'function',
+    stateMutability: 'view',
+    inputs: [{ name: '_batchId', type: 'bytes32' }],
+    outputs: [{ type: 'address' }],
+  },
+] as const;
+
 // Sushiswap V3 Pool ABI (minimal for price)
 export const V3_POOL_ABI = [
   {
@@ -289,4 +335,19 @@ export const REGISTRY_ABI = [
     stateMutability: 'view',
     type: 'function',
   },
+  {
+    anonymous: false,
+    inputs: [
+      { indexed: true, internalType: 'bytes32', name: 'batchId', type: 'bytes32' },
+      { indexed: true, internalType: 'address', name: 'owner', type: 'address' },
+      { indexed: false, internalType: 'address', name: 'payer', type: 'address' },
+      { indexed: false, internalType: 'uint256', name: 'totalAmount', type: 'uint256' },
+      { indexed: false, internalType: 'uint256', name: 'normalisedBalance', type: 'uint256' },
+      { indexed: false, internalType: 'uint8', name: 'depth', type: 'uint8' },
+      { indexed: false, internalType: 'uint8', name: 'bucketDepth', type: 'uint8' },
+      { indexed: false, internalType: 'bool', name: 'immutableFlag', type: 'bool' },
+    ],
+    name: 'BatchCreated',
+    type: 'event',
+  },
 ] as const;
diff --git a/src/app/components/css/StampListSection.module.css b/src/app/components/css/StampListSection.module.css
index 8b9d2e1..8b3571e 100644
--- a/src/app/components/css/StampListSection.module.css
+++ b/src/app/components/css/StampListSection.module.css
@@ -53,15 +53,35 @@
   border: 1px solid #30363d;
 }
 
+.stampIdRow {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  flex-wrap: wrap;
+  margin-bottom: 8px;
+}
+
 .stampListId {
   font-family: monospace;
   font-size: 14px;
-  margin-bottom: 8px;
   cursor: pointer;
+  padding: 4px 8px;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+  position: relative;
+  word-break: break-all;
+}
+
+.stampOwner {
+  font-family: monospace;
+  font-size: 14px;
+  cursor: pointer;
+  padding: 4px 8px;
   border-radius: 4px;
   transition: all 0.2s ease;
   position: relative;
   word-break: break-all;
+  color: #8b949e;
 }
 
 .stampListId:hover {
@@ -81,6 +101,24 @@
   color: #28a745;
 }
 
+.stampOwner:hover {
+  background-color: rgba(255, 255, 255, 0.1);
+  color: #ffffff;
+}
+
+.stampOwner[data-copied="true"] {
+  background-color: rgba(40, 167, 69, 0.2);
+  color: #28a745;
+}
+
+.stampOwner[data-copied="true"]::after {
+  content: "Copied!";
+  position: absolute;
+  right: 8px;
+  font-size: 12px;
+  color: #28a745;
+}
+
 .stampListDetails {
   display: flex;
   flex-direction: column;
diff --git a/src/app/components/css/TTLDisplay.module.css b/src/app/components/css/TTLDisplay.module.css
new file mode 100644
index 0000000..3228a20
--- /dev/null
+++ b/src/app/components/css/TTLDisplay.module.css
@@ -0,0 +1,330 @@
+.ttlContainer {
+  z-index: 1000;
+  background-color: rgba(30, 30, 30, 0.75);
+  -webkit-backdrop-filter: blur(4px);
+  backdrop-filter: blur(4px);
+  padding: 8px 0px;
+  border-radius: 8px;
+  font-size: 0.85rem;
+  color: rgba(255, 255, 255, 0.8);
+  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  user-select: none;
+  cursor: default;
+  opacity: 0.85;
+  margin: 0px auto;
+  border: 1px solid #30363d;
+}
+
+.label {
+  display: none;
+}
+
+.infoRow {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  justify-content: center;
+  flex-wrap: wrap;
+}
+
+.stampId {
+  font-family: monospace;
+  font-size: 0.75rem;
+  cursor: pointer;
+  padding: 4px 8px;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+  position: relative;
+  text-align: center;
+  color: rgba(255, 255, 255, 0.7);
+  white-space: nowrap;
+}
+
+.stampId:hover {
+  background-color: rgba(255, 255, 255, 0.1);
+  color: rgba(255, 255, 255, 0.9);
+}
+
+.stampId[data-copied="true"] {
+  background-color: rgba(40, 167, 69, 0.2);
+  color: transparent;
+}
+
+.stampId[data-copied="true"]::after {
+  content: "Copied!";
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  font-size: 11px;
+  color: #28a745;
+  font-weight: 600;
+}
+
+.shareButton {
+  cursor: pointer;
+  padding: 6px;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: rgba(255, 255, 255, 0.7);
+  width: 50px;
+}
+
+.shareButton svg {
+  transition: opacity 0.2s ease;
+  opacity: 1;
+}
+
+.shareButton:hover {
+  background-color: rgba(255, 255, 255, 0.1);
+  color: rgba(255, 255, 255, 0.9);
+}
+
+.shareButton:hover svg {
+  opacity: 0;
+}
+
+.shareButton:hover::before {
+  content: "Share";
+  position: absolute;
+  font-size: 12px;
+  font-weight: 500;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+  white-space: nowrap;
+  opacity: 1;
+  animation: fadeIn 0.2s ease;
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+.shareButton[data-copied="true"] {
+  background-color: rgba(40, 167, 69, 0.2);
+}
+
+.shareButton[data-copied="true"] svg {
+  opacity: 0;
+}
+
+.shareButton[data-copied="true"]::before {
+  display: none;
+}
+
+.shareButton[data-copied="true"]::after {
+  content: "Copied!";
+  position: absolute;
+  font-size: 10px;
+  color: #28a745;
+  font-weight: 600;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+  white-space: nowrap;
+}
+
+.ownerAddress {
+  font-family: monospace;
+  font-size: 0.75rem;
+  cursor: pointer;
+  padding: 4px 8px;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+  position: relative;
+  text-align: center;
+  color: rgba(255, 255, 255, 0.7);
+  white-space: nowrap;
+}
+
+.ownerAddress:hover {
+  background-color: rgba(255, 255, 255, 0.1);
+  color: rgba(255, 255, 255, 0.9);
+}
+
+.ownerAddress[data-copied="true"] {
+  background-color: rgba(40, 167, 69, 0.2);
+  color: transparent;
+}
+
+.ownerAddress[data-copied="true"]::after {
+  content: "Copied!";
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  font-size: 11px;
+  color: #28a745;
+  font-weight: 600;
+}
+
+.mainTTL {
+  font-size: 1.2rem;
+  font-weight: 500;
+  color: #fbba00;
+  text-align: center;
+  margin-bottom: 5px;
+  line-height: 1.8;
+  letter-spacing: 0.06rem;
+  cursor: pointer;
+  padding: 4px 8px;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+  position: relative;
+}
+
+.mainTTL:hover {
+  background-color: rgba(251, 186, 0, 0.1);
+  color: #ffd966;
+}
+
+.mainTTL[data-copied="true"] {
+  background-color: rgba(40, 167, 69, 0.2);
+  color: transparent;
+}
+
+.mainTTL[data-copied="true"]::after {
+  content: "Copied!";
+  position: absolute;
+  top: 8px;
+  left: 50%;
+  transform: translateX(-50%);
+  font-size: 14px;
+  color: #28a745;
+  font-weight: 600;
+}
+
+.mainTTL[data-copied="true"] .remainingText {
+  opacity: 0;
+}
+
+.remainingText {
+  font-size: 0.96rem;
+  opacity: 0.2;
+  font-style: italic;
+  margin-left: 5px;
+  letter-spacing: 0.01rem;
+}
+
+.detailsRow {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 0.85rem;
+  color: rgba(255, 255, 255, 0.8);
+  justify-content: center;
+  flex-wrap: wrap;
+  margin-bottom: 4px;
+}
+
+.leftDetail {
+  color: #42b883; /* Green shade for remaining balance - matching PriceTracker liquidity color */
+  font-weight: 500;
+  cursor: pointer;
+  padding: 2px 6px;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+  position: relative;
+}
+
+.leftDetail:hover {
+  background-color: rgba(66, 184, 131, 0.1);
+  color: #5dd39e;
+}
+
+.leftDetail[data-copied="true"] {
+  background-color: rgba(40, 167, 69, 0.2);
+  color: transparent;
+}
+
+.leftDetail[data-copied="true"]::after {
+  content: "Copied!";
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  font-size: 11px;
+  color: #28a745;
+  font-weight: 600;
+}
+
+.rightDetail {
+  color: #17a2b8; /* Blue shade for technical TTL - matching PriceTracker depth color */
+  font-weight: 500;
+  cursor: pointer;
+  padding: 2px 6px;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+  position: relative;
+}
+
+.rightDetail:hover {
+  background-color: rgba(23, 162, 184, 0.1);
+  color: #20c1e8;
+}
+
+.rightDetail[data-copied="true"] {
+  background-color: rgba(40, 167, 69, 0.2);
+  color: transparent;
+}
+
+.rightDetail[data-copied="true"]::after {
+  content: "Copied!";
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  font-size: 11px;
+  color: #28a745;
+  font-weight: 600;
+}
+
+/* Flash animation before refresh */
+.flashing {
+  animation: flash 2s ease;
+}
+
+@keyframes flash {
+  0% {
+    background-color: rgba(30, 30, 30, 0.75);
+  }
+  15% {
+    background-color: rgba(60, 60, 60, 0.9);
+  }
+  100% {
+    background-color: rgba(30, 30, 30, 0.75);
+  }
+}
+
+/* Responsive design for smaller screens */
+@media (max-width: 768px) {
+  .mainTTL {
+    font-size: 2rem;
+  }
+
+  .detailsRow {
+    font-size: 0.75rem;
+    gap: 10px;
+  }
+}
+
+@media (max-width: 480px) {
+  .mainTTL {
+    font-size: 1.5rem;
+  }
+
+  .detailsRow {
+    flex-direction: column;
+    gap: 5px;
+    text-align: center;
+  }
+
+  .leftDetail,
+  .rightDetail {
+    text-align: center;
+  }
+}
diff --git a/src/app/components/utils.ts b/src/app/components/utils.ts
index 12935d7..817e7ea 100644
--- a/src/app/components/utils.ts
+++ b/src/app/components/utils.ts
@@ -475,6 +475,271 @@ export const isExpiryWarning = (ttlSeconds: number): boolean => {
   return ttlSeconds <= 259200 && ttlSeconds > 86400; // 3 days but more than 1 day
 };
 
+/**
+ * Format TTL in detailed human-readable format showing smart time units
+ * Shows only the rightmost available units based on magnitude
+ * Examples:
+ *   - 1 year 2 months 3 weeks → shows years, months, weeks (not days, hours, minutes, seconds)
+ *   - 3 months 1 week 3 days → shows months, weeks, days (not hours, minutes, seconds)
+ *   - 3 hours 2 minutes 54 seconds → shows hours, minutes, seconds
+ * @param ttlSeconds The TTL in seconds
+ * @param maxLength Optional maximum character length - will truncate from the right if exceeded
+ */
+export const formatDetailedTTL = (ttlSeconds: number, maxLength?: number): string => {
+  if (ttlSeconds <= 0) {
+    return 'Expired';
+  }
+
+  // Calculate all time units
+  const years = Math.floor(ttlSeconds / 31536000); // 365 days
+  const months = Math.floor((ttlSeconds % 31536000) / 2592000); // 30 days
+  const weeks = Math.floor((ttlSeconds % 2592000) / 604800); // 7 days
+  const days = Math.floor((ttlSeconds % 604800) / 86400);
+  const hours = Math.floor((ttlSeconds % 86400) / 3600);
+  const minutes = Math.floor((ttlSeconds % 3600) / 60);
+  const seconds = Math.floor(ttlSeconds % 60);
+
+  // Determine which units to show based on the largest unit present
+  const parts: string[] = [];
+
+  // Determine the granularity level based on the largest time unit
+  let showLevel = 0; // 0=seconds, 1=minutes, 2=hours, 3=days, 4=weeks, 5=months, 6=years
+
+  if (years > 0) showLevel = 6;
+  else if (months > 0) showLevel = 5;
+  else if (weeks > 0) showLevel = 4;
+  else if (days > 0) showLevel = 3;
+  else if (hours > 0) showLevel = 2;
+  else if (minutes > 0) showLevel = 1;
+  else showLevel = 0;
+
+  // Add parts based on show level (show 4 levels of granularity to include hours/minutes)
+  if (showLevel >= 6 && years > 0) {
+    parts.push(`${years} year${years === 1 ? '' : 's'}`);
+  }
+  if (showLevel >= 5 && showLevel <= 7 && months > 0) {
+    parts.push(`${months} month${months === 1 ? '' : 's'}`);
+  }
+  if (showLevel >= 4 && showLevel <= 6 && weeks > 0) {
+    parts.push(`${weeks} week${weeks === 1 ? '' : 's'}`);
+  }
+  if (showLevel >= 3 && showLevel <= 5 && days > 0) {
+    parts.push(`${days} day${days === 1 ? '' : 's'}`);
+  }
+  if (showLevel >= 2 && showLevel <= 5 && hours > 0) {
+    parts.push(`${hours} hour${hours === 1 ? '' : 's'}`);
+  }
+  if (showLevel >= 1 && showLevel <= 4 && minutes > 0) {
+    parts.push(`${minutes} minute${minutes === 1 ? '' : 's'}`);
+  }
+  if (showLevel <= 3 && seconds > 0) {
+    parts.push(`${seconds} second${seconds === 1 ? '' : 's'}`);
+  }
+
+  if (parts.length === 0) {
+    return 'Less than 1 second';
+  }
+
+  // If maxLength is specified and we exceed it, truncate from the right
+  if (maxLength) {
+    const result = parts.join(' ');
+    if (result.length > maxLength) {
+      // Remove parts from the end until we fit
+      while (parts.length > 1 && parts.join(' ').length > maxLength) {
+        parts.pop();
+      }
+    }
+  }
+
+  return parts.join(' ');
+};
+
+/**
+ * Query batch information from PostageStamp contract on Gnosis Chain
+ * @param batchId The batch ID (with or without 0x prefix)
+ * @returns Object containing TTL in seconds, remaining balance (total), and depth
+ */
+export const fetchBatchInfoFromContract = async (
+  batchId: string
+): Promise<{ ttlSeconds: number; remainingBalance: string; depth: number } | null> => {
+  try {
+    const { GNOSIS_STAMP_ADDRESS, POSTAGE_STAMP_ABI } = await import('./constants');
+
+    // Ensure batchId has 0x prefix
+    const formattedBatchId = batchId.startsWith('0x') ? batchId : `0x${batchId}`;
+
+    const { client } = getGnosisPublicClient(0);
+
+    // Query all necessary data from the contract
+    const [lastPrice, remainingBalancePerChunk, depth] = await Promise.all([
+      client.readContract({
+        address: GNOSIS_STAMP_ADDRESS as `0x${string}`,
+        abi: POSTAGE_STAMP_ABI,
+        functionName: 'lastPrice',
+      }),
+      client.readContract({
+        address: GNOSIS_STAMP_ADDRESS as `0x${string}`,
+        abi: POSTAGE_STAMP_ABI,
+        functionName: 'remainingBalance',
+        args: [formattedBatchId as `0x${string}`],
+      }),
+      client.readContract({
+        address: GNOSIS_STAMP_ADDRESS as `0x${string}`,
+        abi: POSTAGE_STAMP_ABI,
+        functionName: 'batchDepth',
+        args: [formattedBatchId as `0x${string}`],
+      }),
+    ]);
+
+    // Use the contract's remainingBalance function result directly
+    // This returns the per-chunk balance (normalizedBalance - currentTotalOutPayment)
+    const lastPriceBigInt = BigInt(lastPrice as bigint);
+    const remainingBalancePerChunkBigInt = BigInt(remainingBalancePerChunk as bigint);
+    const depthNumber = Number(depth);
+
+    if (lastPriceBigInt === 0n) {
+      console.error('lastPrice is 0, cannot calculate TTL');
+      return null;
+    }
+
+    // Calculate TTL following Bee's implementation
+    // ttl = (remainingBalance) * blockTime / pricePerBlock
+    const remainingBlocks = remainingBalancePerChunkBigInt / lastPriceBigInt;
+
+    // Convert to seconds (Gnosis Chain: ~5 second blocks)
+    const ttlSeconds = Number(remainingBlocks) * 5;
+
+    // Calculate total remaining balance by multiplying per-chunk balance by number of chunks (2^depth)
+    // Formula from PostageStamp.sol: totalAmount = initialBalancePerChunk * (1 << depth)
+    const totalRemainingBalance = remainingBalancePerChunkBigInt * (1n << BigInt(depthNumber));
+    const remainingBalanceString = totalRemainingBalance.toString();
+
+    return {
+      ttlSeconds,
+      remainingBalance: remainingBalanceString,
+      depth: depthNumber,
+    };
+  } catch (error) {
+    console.error('Error fetching batch info from contract:', error);
+    return null;
+  }
+};
+
+/**
+ * Fetch the owner/payer information for a specific batch from the registry by querying events
+ * @param batchId The batch ID to look up
+ * @returns Owner address and payer address, or null if not found
+ */
+export const fetchBatchOwnerInfo = async (
+  batchId: string
+): Promise<{ owner: string; payer: string } | null> => {
+  try {
+    const { GNOSIS_CUSTOM_REGISTRY_ADDRESS } = await import('./constants');
+    const { REGISTRY_ABI } = await import('./constants');
+
+    // Ensure batchId has 0x prefix
+    const formattedBatchId = batchId.startsWith('0x') ? batchId : `0x${batchId}`;
+
+    const { client } = getGnosisPublicClient(0);
+
+    const batchCreatedEvent = REGISTRY_ABI.find(item => item.type === 'event' && item.name === 'BatchCreated');
+
+    // Query the BatchCreated event logs for this specific batchId
+    const logs = await client.getLogs({
+      address: GNOSIS_CUSTOM_REGISTRY_ADDRESS as `0x${string}`,
+      event: batchCreatedEvent!,
+      args: {
+        batchId: formattedBatchId as `0x${string}`,
+      },
+      fromBlock: BigInt(0), // Search from genesis - could optimize with a known start block
+      toBlock: 'latest',
+    });
+
+    if (logs.length === 0) {
+      // Fallback: Try to get owner from PostageStamp contract
+      try {
+        const { GNOSIS_STAMP_ADDRESS, POSTAGE_STAMP_ABI } = await import('./constants');
+
+        const owner = await client.readContract({
+          address: GNOSIS_STAMP_ADDRESS as `0x${string}`,
+          abi: POSTAGE_STAMP_ABI,
+          functionName: 'batchOwner',
+          args: [formattedBatchId as `0x${string}`],
+        }) as string;
+
+        return {
+          owner,
+          payer: owner, // For stamps created directly, owner = payer
+        };
+      } catch (error) {
+        console.error('Error fetching owner from PostageStamp contract:', error);
+        return null;
+      }
+    }
+
+    // Get the most recent event (in case there are multiple, though there shouldn't be)
+    const latestLog = logs[logs.length - 1];
+
+    const owner = latestLog.args.owner as string;
+    const payer = latestLog.args.payer as string;
+
+    return {
+      owner,
+      payer,
+    };
+  } catch (error) {
+    console.error('Error fetching batch owner info from events:', error);
+    return null;
+  }
+};
+
+/**
+ * Fetch the owner/payer information for a specific batch from the registry
+ * @param batchId The batch ID to look up
+ * @param ownerAddress The address to check if they own this batch
+ * @returns Owner address and payer address, or null if not found in this owner's batches
+ */
+export const fetchBatchOwnerInfoForAddress = async (
+  batchId: string,
+  ownerAddress: string
+): Promise<{ owner: string; payer: string } | null> => {
+  try {
+    // Use static imports from constants
+    const { GNOSIS_CUSTOM_REGISTRY_ADDRESS } = await import('./constants');
+    const { REGISTRY_ABI } = await import('./constants');
+
+    // Ensure batchId has 0x prefix
+    const formattedBatchId = batchId.startsWith('0x') ? batchId : `0x${batchId}`;
+
+    const { client } = getGnosisPublicClient(0);
+
+    // Query the registry for all batches owned by this address
+    const batches = await client.readContract({
+      address: GNOSIS_CUSTOM_REGISTRY_ADDRESS as `0x${string}`,
+      abi: REGISTRY_ABI,
+      functionName: 'getOwnerBatches',
+      args: [ownerAddress as `0x${string}`],
+    });
+
+    // Find the batch with matching ID
+    const batch = (batches as any[]).find(
+      b => b.batchId.toLowerCase() === formattedBatchId.toLowerCase()
+    );
+
+    if (!batch) {
+      return null;
+    }
+
+    return {
+      owner: ownerAddress,
+      payer: batch.payer,
+    };
+  } catch (error) {
+    console.error('Error fetching batch owner info for address:', error);
+    return null;
+  }
+};
+
 /**
  * Calculate the real stamp usage percentage
  * @param utilization Raw utilization value from Bee API (decimal, e.g., 0.01 for 1%)