Skip to content

feat(dashboard): depth-of-market orderbook + 3-column activity feeds#120

Draft
e35ventura wants to merge 3 commits into
testfrom
feat/dashboard-orderbook
Draft

feat(dashboard): depth-of-market orderbook + 3-column activity feeds#120
e35ventura wants to merge 3 commits into
testfrom
feat/dashboard-orderbook

Conversation

@e35ventura

Copy link
Copy Markdown
Collaborator

Summary

Reworks the dashboard into a trading-terminal layout and wires in the Depth of Market orderbook.

  • Right column → Depth of Market orderbook. Surfaces cumulative miner liquidity at each rate (the existing OrderbookDepth, previously unused).
  • Orderbook is driven by the shared chart direction. Its own dropdown is removed; the market-rate chart's BTC↔TAO toggle now drives the chart, the Active Rates table, and the orderbook together, so they're always in sync.
  • BOTH view = two-sided book. The chart's BOTH state is lifted to the page; in BOTH the orderbook overlays both sides on one shared TAO/BTC price axis — asks (TAO→BTC) above, bids (BTC→TAO) below — with a Spread divider showing the gap, like a traditional depth-of-market book.
  • Chart line colors match the orderbook. BTC→TAO uses the BTC accent, TAO→BTC uses the TAO accent (both theme tokens), so chart and book are color-consistent.
  • Activity feeds → 3 columns. Transactions / Reservations / Events now render as three side-by-side columns on desktop (each with a mono-eyebrow header + info tooltip), in a full-width row below the terminal. Below the md breakpoint they collapse back into a single toggled panel.

No backend or data-model changes; all colors come from theme tokens.

Related Issues

None.

Type of Change

  • New feature
  • Bug fix
  • Refactor
  • Documentation
  • Other

Testing

  • npm run build passes (TypeScript + Vite); npm run lint clean.
  • Manually verified against the live API: orderbook syncs with the chart toggle (BTC→TAO / TAO→BTC / BOTH); BOTH renders the two-sided book with a correct positive spread; chart/orderbook colors match; activity columns render on desktop and collapse to the toggle below md.

Before / After

⚠️ Media to attach before marking ready: UI change, so the contributing guide requires before/after screenshots.

  • Before: dashboard with the tabbed activity panel in the right column, no orderbook.
  • After: Depth of Market in the right column (incl. BOTH two-sided book) + 3-column activity row below.

(Screenshots to be added.)

Checklist

  • Follows existing code patterns and conventions
  • Self-reviewed the changes
  • npm run build passes
  • Before/after media attached (UI change)

e35ventura and others added 2 commits June 13, 2026 14:55
Reworks the dashboard layout and wires in the Depth of Market orderbook:

- Right column now shows the Depth of Market orderbook; the Transactions /
  Reservations / Events tabbed panel moves to a full-width row below.
- The orderbook drops its own dropdown and is driven by the shared market-rate
  chart direction, so chart, rates table, and orderbook stay in sync.
- The chart's BOTH view is lifted to the page; in BOTH the orderbook overlays
  both sides on one shared TAO/BTC price axis (asks above, bids below) with a
  Spread divider, like a traditional depth-of-market book.
- Chart direction line colors now match the orderbook: BTC→TAO uses the BTC
  accent, TAO→BTC uses the TAO accent (both from theme tokens).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Transactions, Reservations, and Events now render as three side-by-side
columns on desktop, each with its own mono-eyebrow header + info tooltip.
Below the md breakpoint they collapse back into a single toggled TabbedPanel
(now including Events in the toggle).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@e35ventura

Copy link
Copy Markdown
Collaborator Author
image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant