Trading terminalPro

• Live last price
• Candlesticks with MA 20 / 50
• Watchlist with sparklines
• Order ticket with fills

• Trading, crypto and portfolio products.

• Long-term investing dashboards where live prices aren't needed.

Import it from @/components/blocks/trading-terminal after installing. It ships with sample data, so it renders straight away; swap in your own data when you're ready.

import { TradingTerminal } from "@/components/blocks/trading-terminal";

export default function Page() {
  return (
    <main className="mx-auto max-w-6xl p-6">
      <TradingTerminal />
    </main>
  );
}

• Buy and sell are a labelled toggle with aria-pressed.
• Prices are text with up and down signs, not only colors.

• The last price ticks every 2.2 seconds; digits roll.
• Fills slide into the order list.

• The watchlist moves under the chart below 1024px.

• One interval drives the live price; it's cleared on unmount.
• Sample data is plain arrays at the top of the file. Replace them with your API data and keep the shapes.

• Replace the interval with your WebSocket feed and keep the candle shape.