Market data

@orderly.network/hooks provides the following hooks related to market data:

useMarketsStream - Retreive all listed symbols and its market data
useMarkPrice - Get the mark price of a single symbol
useMarkPricesStream - Get the mark price of all symbols
useMarketTradeStream - Get the market trades history of a symbol

Markets

import { useMarketsStream } from "@orderly.network/hooks";

() => {
  const { data } = useMarketsStream();

  return (
    <div className="text-sm">
      <pre>{JSON.stringify(data, null, 2)}</pre>
    </div>
  );
};

Market trade history

() => {
  const { data, isLoading } = useMarketTradeStream("PERP_ETH_USDC");

  if (isLoading) return <div>Loading...</div>;

  return (
    <div className="text-sm">
      {data.map((item) => {
        return (
          <div key={item.ts} className="flex justify-between border-b">
            <span>{item.price}</span>
            <span>{item.size}</span>
            <span>{item.side}</span>
          </div>
        );
      })}
    </div>
  );
};

Orderbook Deposit