Bid / Ask Prices

When enabled and Limit mode is active, compact Bid and Ask price buttons appear in the Quick Trade bar. Clicking Bid places a buy limit order at the best bid price. Clicking Ask places a sell limit order at the best ask price.

The bid and ask prices displayed in these chips come directly from the exchange order book data feed. The system subscribes to a real-time WebSocket stream that pushes order book snapshots and deltas as they occur. Each update recalculates the best bid (highest buy order price) and best ask (lowest sell order price) from the Level 2 order book data.

• Order book structure — the exchange maintains a sorted list of buy orders (bids) descending by price, and sell orders (asks) ascending by price. The best bid is the first entry in the bid side; the best ask is the first entry in the ask side.
• Real-time updates — price updates arrive via WebSocket at variable frequency depending on market activity. In highly liquid markets like BTC/USDT, updates can arrive multiple times per second during high volatility. The price format helper (`formatPanelPrice`) formats values — prices >= 1 use `toFixed(2)`, sub-1 prices use `toPrecision(5)`.
• Fallback logic — if the order book stream has not yet delivered data (e.g., during initial connection), the system falls back to the current last traded price from the chart. This ensures the buttons always display a price, even before the order book is fully synced.
• Reference price — when placing a market order (non-limit mode), the buy side uses the best ask (or current price fallback) and the sell side uses the best bid (or current price fallback). This aligns with standard exchange execution semantics where market buys take asks and market sells take bids.

The Bid and Ask chips have distinct visual and functional states depending on the current Quick Trade context:

Several error conditions can affect the Bid/Ask chips. Understanding these helps diagnose why prices may not appear or orders may not submit:

• Disconnected market — if the WebSocket connection to the exchange drops, the last known prices remain displayed until a heartbeat timeout triggers a connection reset. During reconnection, prices may appear stale. The orders themselves will fail if submitted during a disconnect since they route through the same connection.
• Price unavailable — when the order book is empty or the symbol has no trades, both `bestBid` and `bestAsk` will be undefined or 0. The chips display `--`. Orders placed in this state use the chart current price as fallback, which may also be 0 if the chart has no data.
• Stale data — the system does not implement a staleness indicator on the chips themselves. If the WebSocket feed stalls without disconnecting (e.g., exchange-side issue), prices stop updating without visual feedback. A cross-reference with the chart's last price can help identify stalls.
• Validation failure — when clicking a chip in the bar, the `handlePlaceOrder` function checks if the limit price is finite and positive. If not (e.g., NaN from empty input), a toast error "Enter a valid limit price" is shown and the order is not submitted.

The Bid/Ask chips and the Price Input controls share the same area of the Quick Trade bar and their visibility is interdependent:

• Chips require Limit mode — quote chips are only rendered when `isLimitMode` is true. This is controlled by both the `showQuickTradeQuotes` setting and the live `orderType` state. Switching to Market mode via the M/L toggle instantly hides both chips.
• Price field coexistence — when both Price Input and Bid/Ask chips are enabled in Limit mode, the bar shows: `[B] [−] [1.000] [+] [S] [L] [42000] [Bid 42,000] [Ask 42,010]`. The chips appear after the price field, maintaining a logical left-to-right flow: side selection → quantity → mode toggle → price → quick-fill chips.
• Chip click behaviour — clicking a chip calls `onOrder` directly with the chip price and `limit` as the order type override. It does not fill the price input field — it submits the order immediately. This is distinct from the Price Input interaction where clicking a chip fills the price field for manual review.
• Layout spillover — with all features enabled (Price Input + Bid/Ask + default controls), the estimated panel width calculation can reach up to 760px. On narrow chart areas, the bar may overflow or be truncated. The panel caps its width at `min(estimatedPanelWidth, calc(100vw - 16px))`.

The Bid/Ask chips enable a streamlined limit order workflow. Here is the complete lifecycle from clicking a chip to order confirmation:

1. 1
   Chip click detected

   User clicks the "Bid 42,000" or "Ask 42,010" chip. The `onClick` handler reads `bestBid` or `bestAsk` from the component props. If the price is 0 or undefined, it falls back to `currentPrice`.
2. 2
   Order constructed

   The `handlePlaceOrder` callback is invoked with the side (buy for Bid, sell for Ask), the chip price, the quantity from settings, and `"limit"` as the order type override. The system then calls the parent `onOrder` callback.
3. 3
   Validation

   If the parent `onOrder` leads to `createOrder` in QuickTradeContext, the settings are validated (quantity > 0, leverage 1-125x, TP/SL percentages valid). Invalid settings abort the order and show a toast error.
4. 4
   Execution & feedback

   If Trade Without Confirmation is enabled, the order is submitted directly to the exchange API. A success toast appears. If disabled, a confirmation dialog is shown with the price, quantity, and order type for review before submission.
5. 5
   Chart visual feedback

   If Quick Trade Lines are enabled, a dashed order line appears on the chart at the placed price. The line colour matches the side (green buy, red sell). The line shows the order status (pending → filled/rejected) with drag-to-retry support for rejected orders.

• Passive limit entry — a trader places a buy limit at the best bid to add liquidity and earn maker rebates. Clicking "Bid 42,000" places a buy limit at the current highest bid, joining the order book passively.
• Aggressive limit entry — a trader places a buy limit at the best ask to guarantee immediate (or near-immediate) fill while still getting the price control of a limit order. Clicking "Ask 42,010" after switching to Buy places a buy limit at the ask level, which typically fills instantly.
• Scalping the spread — a scalper alternates between Bid and Ask chips, buying at the bid and selling at the ask to capture the spread. The real-time price updates ensure they always trade at the current inside market.
• Quick price reference — even without placing orders, the chips serve as a persistent visual reference for the current spread, letting traders assess market liquidity at a glance without opening a separate order book panel.

• 1.Price Input — Must be enabled for Limit mode — the M/L toggle is required to activate chips
• 2.Default Order Mode — Setting Limit as default means chips are always visible on bar load
• 3.Panel Size — Larger sizes provide more horizontal space for the chip buttons
• 4.Click to Order — Alternative limit order placement via chart click — Bid/Ask chips are a bar-based alternative
• 5.Trade Without Confirmation — Skips the review dialog when placing orders via chip click