diff --git a/src/components/common/TradeDialog.tsx b/src/components/common/TradeDialog.tsx index 728850b..14038b4 100644 --- a/src/components/common/TradeDialog.tsx +++ b/src/components/common/TradeDialog.tsx @@ -11,7 +11,7 @@ import { } from '@/components/ui/dialog'; import { cn } from '@/lib/utils'; import { formatNumber } from '@/utils/numberFormat.utils'; -import { formatDisplayKeyPrice } from '@/utils/keyPriceDisplay.utils'; +import { formatDisplayKeyPrice, estimateSellProceeds } from '@/utils/keyPriceDisplay.utils'; import PercentageBadge from '@/components/common/PercentageBadge'; import NetworkFeeHint from '@/components/common/NetworkFeeHint'; import { TRADE_FEE_ESTIMATE } from '@/constants/fees'; @@ -26,6 +26,8 @@ export interface TradeDialogProps { availableHoldings: number; /** Per-key price in stroops, shown on the buy confirmation step. */ keyPriceStroops?: number | null; + /** Current key supply for estimating sell proceeds. */ + currentSupply?: number | null; onOpenChange: (open: boolean) => void; onConfirm: (amount: number) => Promise | void; isSubmitting?: boolean; @@ -37,6 +39,7 @@ const TradeDialog: React.FC = ({ creatorName, availableHoldings, keyPriceStroops, + currentSupply, onOpenChange, onConfirm, isSubmitting = false, @@ -78,6 +81,13 @@ const TradeDialog: React.FC = ({ { unit: TRADE_FEE_ESTIMATE.UNIT } ); + const estimatedProceedsStroops = useMemo(() => { + if (side !== 'sell' || !Number.isFinite(parsedAmount) || parsedAmount <= 0) { + return null; + } + return estimateSellProceeds(keyPriceStroops, currentSupply, parsedAmount); + }, [side, keyPriceStroops, currentSupply, parsedAmount]); + return ( = ({ className="text-white/45" /> )} + {side === 'sell' && ( +
+ {estimatedProceedsStroops != null ? ( + <> + Estimated proceeds (approximate):{' '} + + {formatDisplayKeyPrice(estimatedProceedsStroops)} + + + ) : ( + <>Estimated proceeds unavailable + )} +
+ )} {/* diff --git a/src/pages/LandingPage.tsx b/src/pages/LandingPage.tsx index b61b52c..9c26ce8 100644 --- a/src/pages/LandingPage.tsx +++ b/src/pages/LandingPage.tsx @@ -1414,6 +1414,7 @@ function LandingPage() { creatorName="Alex Rivers" availableHoldings={featuredHoldings} keyPriceStroops={resolveCreatorKeyPriceStroops(featuredCreator)} + currentSupply={featuredCreator.creatorShareSupply} isSubmitting={tradeSubmitting} onOpenChange={setTradeDialogOpen} onConfirm={handleConfirmTrade} diff --git a/src/utils/keyPriceDisplay.utils.ts b/src/utils/keyPriceDisplay.utils.ts index 9251fb1..3b0acd1 100644 --- a/src/utils/keyPriceDisplay.utils.ts +++ b/src/utils/keyPriceDisplay.utils.ts @@ -22,6 +22,31 @@ export function resolveCreatorKeyPriceStroops( return null; } +/** + * Estimates sell proceeds from current key price, supply, and sell quantity. + * Returns null if estimate cannot be computed. + */ +export function estimateSellProceeds( + keyPriceStroops: number | null | undefined, + currentSupply: number | null | undefined, + sellQuantity: number +): number | null { + if ( + keyPriceStroops == null || + !Number.isFinite(keyPriceStroops) || + currentSupply == null || + !Number.isFinite(currentSupply) || + sellQuantity <= 0 || + !Number.isFinite(sellQuantity) + ) { + return null; + } + + // For estimate purposes, calculate proceeds as key price multiplied by quantity + const estimatedProceeds = keyPriceStroops * sellQuantity; + return estimatedProceeds; +} + /** * Formats a stroop amount for display as XLM, falling back to stroops when the * XLM value would round to zero at the default display precision.