From 5e7ecd5919a2ce97c7ea9ff1eeb6d342535ecceb Mon Sep 17 00:00:00 2001
From: victor62-art <olaojo62@gmail.com>
Date: Tue, 2 Jun 2026 12:23:03 +0100
Subject: [PATCH] Add estimated proceeds calculation for sell orders

---
 src/components/common/TradeDialog.tsx | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/src/components/common/TradeDialog.tsx b/src/components/common/TradeDialog.tsx
index 728850b..570d237 100644
--- a/src/components/common/TradeDialog.tsx
+++ b/src/components/common/TradeDialog.tsx
@@ -71,6 +71,13 @@ const TradeDialog: React.FC<TradeDialogProps> = ({
 	const amountValid = validationError === null;
 	const showError = touched && validationError !== null;
 
+	const estimatedProceedsStroops = useMemo(() => {
+		if (side !== 'sell') return null;
+		if (!keyPriceStroops || !Number.isFinite(keyPriceStroops)) return null;
+		if (!parsedAmount || !Number.isFinite(parsedAmount) || parsedAmount <= 0) return null;
+		return keyPriceStroops * parsedAmount;
+	}, [side, keyPriceStroops, parsedAmount]);
+
 	const title = side === 'buy' ? 'Buy keys' : 'Sell keys';
 	const confirmLabel = side === 'buy' ? 'Confirm buy' : 'Confirm sell';
 	const estimatedNetworkFee = formatTransactionFeeDisplay(
@@ -177,6 +184,20 @@ const TradeDialog: React.FC<TradeDialogProps> = ({
 							className="text-white/45"
 						/>
 					)}
+					{side === 'sell' && (
+						<div className="text-xs text-white/45">
+							{estimatedProceedsStroops != null ? (
+								<>
+									Approximate proceeds:{' '}
+									<span className="font-semibold text-amber-300/90 tabular-nums">
+										{formatDisplayKeyPrice(estimatedProceedsStroops)}
+									</span>
+								</>
+							) : (
+								'Approximate proceeds unavailable'
+							)}
+						</div>
+					)}
 				</div>
 
 				{/*