admin/stonks-oracle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: positions totals row aligned with DataTable columns, restore $ prefix

Browse Source
This commit is contained in:
Celes Renata
2026-04-21 06:11:19 +00:00
parent 50c61b0e18
commit 3bcb84ed41
2 changed files with 20 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/pages/Positions.tsx
+13 -17
View File
@@ -41,6 +41,18 @@ export function PositionsPage() {
{ quantity: 0, unrealized_pnl: 0, realized_pnl: 0, market_value: 0, cost_basis: 0 },
);
const footer = positions.length > 0 ? (
<tr className="font-semibold text-gray-200">
<td className="px-3 py-2">Totals</td>
<td className="px-3 py-2">{totals.quantity}</td>
<td className="px-3 py-2">{fmtUsd(totals.cost_basis)}</td>
<td className="px-3 py-2">{fmtUsd(totals.market_value)}</td>
<td className={`px-3 py-2 ${pnlColor(totals.unrealized_pnl)}`}>{fmtUsd(totals.unrealized_pnl)}</td>
<td className={`px-3 py-2 ${pnlColor(totals.realized_pnl)}`}>{fmtUsd(totals.realized_pnl)}</td>
<td className="px-3 py-2" />
</tr>
) : undefined;
return (
<div>
<h1 className="mb-4 text-xl font-semibold text-gray-100">Positions</h1>
@@ -48,24 +60,8 @@ export function PositionsPage() {
data={positions}
columns={columns}
keyField="id"
footerRow={footer}
/>
{positions.length > 0 && (
<div className="mt-px overflow-x-auto rounded-b-lg border border-t-0 border-surface-700 bg-surface-900">
<table className="w-full text-sm">
<tfoot>
<tr className="font-semibold text-gray-200">
<td className="px-3 py-2">Totals</td>
<td className="px-3 py-2">{totals.quantity}</td>
<td className="px-3 py-2">{fmtUsd(totals.cost_basis)}</td>
<td className="px-3 py-2">{fmtUsd(totals.market_value)}</td>
<td className={`px-3 py-2 ${pnlColor(totals.unrealized_pnl)}`}>{fmtUsd(totals.unrealized_pnl)}</td>
<td className={`px-3 py-2 ${pnlColor(totals.realized_pnl)}`}>{fmtUsd(totals.realized_pnl)}</td>
<td className="px-3 py-2" />
</tr>
</tfoot>
</table>
</div>
)}
</div>
);
}