Render a live chart

import WebSocket from "ws";

type Candle = { time: number; open: number; high: number; low: number; close: number; volume: number };

const series = { chain: "solana", token: "DezXAZ8z7PnrnRJjz3wXBoRgixCa6xjnB7YaB1pPB263", timeframe: "1m", metric: "price", denomination: "usd" };
const headers = { Authorization: `Bearer ${process.env.API_KEY}` };

const socket = new WebSocket("wss://{{API_HOST}}/v1/stream", { headers });
const pending: Candle[] = [];
let bars: Candle[] | null = null;

socket.on("error", (error) => console.error("stream error:", error.message));

const subscribed = new Promise<void>((resolve) => {
  socket.on("message", (raw) => {
    const frame = JSON.parse(raw.toString());
    if (frame.type === "ack") resolve();
    if (frame.type !== "update") return;
    if (bars) upsert(bars, frame.data);
    else pending.push(frame.data);
  });
});

socket.on("open", () => {
  socket.send(JSON.stringify({ action: "subscribe", channel: "spot.candles", filters: series }));
});

await subscribed;

const params = new URLSearchParams({ timeframe: series.timeframe, metric: series.metric, denomination: series.denomination, countBack: "500" });
const response = await fetch(`https://{{API_HOST}}/v1/tokens/${series.chain}/${series.token}/ohlcv?${params}`, { headers });
if (!response.ok) throw new Error(`HTTP ${response.status}`);
const history = await response.json();

const loaded: Candle[] = history.candles;
for (const candle of pending) upsert(loaded, candle);
bars = loaded;
draw(bars);

function upsert(bars: Candle[], candle: Candle) {
  const last = bars[bars.length - 1];
  if (last && last.time === candle.time) bars[bars.length - 1] = candle;
  else if (!last || candle.time > last.time) bars.push(candle);
  draw(bars);
}

async function loadOlder(bars: Candle[]) {
  const params = new URLSearchParams({ timeframe: series.timeframe, metric: series.metric, denomination: series.denomination, countBack: "500", to: String(bars[0].time) });
  const response = await fetch(`https://{{API_HOST}}/v1/tokens/${series.chain}/${series.token}/ohlcv?${params}`, { headers });
  if (!response.ok) throw new Error(`HTTP ${response.status}`);
  const older = await response.json();
  bars.unshift(...older.candles);
}