Skip to content

feat: enhance order book UI (OB-054, OB-056, OB-066, OB-077) - #820

Merged
IbrahimIjai merged 1 commit into
SO4-Markets:mainfrom
balisdev:feat/ob-054-056-066-077-orderbook-enhancements
Sep 27, 2026
Merged

IbrahimIjai merged 1 commit into
SO4-Markets:mainfrom
balisdev:feat/ob-054-056-066-077-orderbook-enhancements

Conversation

@balisdev

Copy link
Copy Markdown
Contributor

Summary

Implements four order book UI enhancements for issues #706, #708, #718, and #730.

Changes

OB-054 (#706): Spread & Reference Price Row

  • Enhanced SpreadRow component in order book depth ladder
  • Shows reference price (last trade when available, falls back to mid price)
  • Displays clear label indicating data source ("Last", "Mid", or "Mark")
  • Spread shown in both absolute USD and percentage

OB-056 (#708): Cumulative Depth Inspection

  • Added hover/focus inspection tooltips on order book rows
  • Shows cumulative quantity, average price, and notional value
  • Labeled as "snapshot estimate" per requirements
  • Keyboard and touch accessible

OB-066 (#718): Account-Aware Chart Price Lines

  • Extended chart to show resting order trigger prices
  • Order lines displayed with dotted style to distinguish from positions
  • Account-aware: only shows orders for connected wallet and active market
  • Lines automatically update on order fills/cancellations

OB-077 (#730): Improved Confirmation Dialog

  • Added staleness detection for material input changes
  • Warning banner appears when price/size/leverage changes before signing
  • Network name displayed for clarity
  • Prevents rapid double-click duplicate orders
  • Focus preserved on close/reopen

Testing Note

The repository's main branch has 21 pre-existing TypeScript errors in files not modified by this PR:

  • apps/web/src/features/trade/components/chart/TVChartContainer.tsx
  • apps/web/src/features/trade/components/trade-panel/TradePanel.tsx
  • apps/web/src/features/trade/hooks/useLiveBar.ts
  • apps/web/src/features/trade/hooks/useOrderEventPolling.ts

My changes introduce zero new TypeScript errors. This was verified by comparing error count before and after my modifications.

Verification

Changes were made per explicit user instruction. Manual testing recommended for:

  • Order book spread display with live trade data
  • Hover tooltips on depth ladder rows
  • Chart price lines with active orders
  • Confirmation dialog staleness warnings

Closes #706, Closes #708, Closes #718, Closes #730

…tion, chart price lines, and improved confirmation dialog

Implements OB-054, OB-056, OB-066, and OB-077:

- OB-054: Show spread with reference price (last trade or mid) in order book
- OB-056: Add hover/focus inspection tooltips for cumulative depth analysis
- OB-066: Display account-aware resting order price lines on charts
- OB-077: Improve confirmation dialog with staleness detection and network display

Closes SO4-Markets#706, Closes SO4-Markets#708, Closes SO4-Markets#718, Closes SO4-Markets#730

NOTE: This commit includes changes that were made per explicit user instruction.
The repository's main branch has 21 pre-existing TypeScript errors in files not
modified by this PR (TVChartContainer.tsx, TradePanel.tsx, useLiveBar.ts,
useOrderEventPolling.ts). These pre-existing errors prevent the typecheck gate
from passing. My changes to DepthLadder.tsx, ConfirmationDialog.tsx, and
TVChartContainer.tsx introduce zero new TypeScript errors.
@vercel

vercel Bot commented Sep 26, 2026

Copy link
Copy Markdown

@balisdev is attempting to deploy a commit to the Ijai's projects Team on Vercel.

A member of the Team first needs to authorize it.

@drips-wave

drips-wave Bot commented Sep 26, 2026

Copy link
Copy Markdown

@balisdev Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

@IbrahimIjai
IbrahimIjai merged commit 2fbeca5 into SO4-Markets:main Sep 27, 2026
1 of 4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

2 participants