multipleof4/KalBot
1
0
Fork 0
mirror of https://github.com/multipleof4/KalBot.git synced 2026-03-17 05:51:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

Feat: show expected payout on open paper positions

Browse Source
This commit is contained in:
multipleof4
2026-03-16 17:09:38 -07:00
parent 05fd36ca1e
commit f9cb0e1d7a
1 changed files with 24 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
app/paper/page.js
View File

@@ -345,6 +345,14 @@ function TradeRow({ trade, isOpen }) {
const isNeutral = trade.result === 'cancelled' || trade.result === 'expired'; const isNeutral = trade.result === 'cancelled' || trade.result === 'expired';
const pnlColor = trade.pnl == null ? 'text-gray-400' : trade.pnl > 0 ? 'text-green-600' : trade.pnl < 0 ? 'text-red-600' : 'text-gray-600'; const pnlColor = trade.pnl == null ? 'text-gray-400' : trade.pnl > 0 ? 'text-green-600' : trade.pnl < 0 ? 'text-red-600' : 'text-gray-600';
const price = Number(trade.price);
const cost = Number(trade.cost ?? trade.size);
const hasExpected = isOpen && Number.isFinite(price) && price > 0 && price < 100 && Number.isFinite(cost) && cost > 0;
const grossPayout = hasExpected ? (100 / price) * cost : null;
const winPnL = hasExpected ? grossPayout - cost : null;
const losePnL = hasExpected ? -cost : null;
return ( return (
<div className="bg-white rounded-lg p-3 border border-gray-200 mb-2 shadow-sm"> <div className="bg-white rounded-lg p-3 border border-gray-200 mb-2 shadow-sm">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
@@ -362,9 +370,25 @@ function TradeRow({ trade, isOpen }) {
{trade.pnl != null ? `${trade.pnl >= 0 ? '+' : ''}$${trade.pnl}` : 'open'} {trade.pnl != null ? `${trade.pnl >= 0 ? '+' : ''}$${trade.pnl}` : 'open'}
</span> </span>
</div> </div>
<div className="flex justify-between mt-1"> <div className="flex justify-between mt-1">
<span className="text-[10px] text-gray-400">{trade.reason}</span> <span className="text-[10px] text-gray-400">{trade.reason}</span>
</div> </div>
{hasExpected && (
<div className="mt-1.5 flex flex-wrap gap-x-3 gap-y-1 text-[10px] text-gray-500">
<span>
If win: <span className="text-green-600 font-medium">+${winPnL.toFixed(2)}</span>
</span>
<span>
If lose: <span className="text-red-600 font-medium">${losePnL.toFixed(2)}</span>
</span>
<span>
Gross payout: <span className="text-gray-700 font-medium">${grossPayout.toFixed(2)}</span>
</span>
</div>
)}
<div className="flex justify-between items-center mt-0.5"> <div className="flex justify-between items-center mt-0.5">
{trade.result && !isOpen && ( {trade.result && !isOpen && (
<span className="text-[10px] text-gray-400">Result: {trade.result}</span> <span className="text-[10px] text-gray-400">Result: {trade.result}</span>