useOrderEntry

​

Order entry

The useOrderEntry hook provides a variety of supporting functions according to input parameters and the prevailing market data.

export interface OrderEntryReturn {
  onSubmit: (values: OrderEntity) => Promise<any>;
  maxQty: number;
  freeCollateral: number;
  markPrice: number;
  estLiqPrice?: number | null;
  estLeverage?: number | null;

  symbolConfig: API.SymbolExt;
  helper: {
    calculate: (values: Partial<OrderEntity>, field: keyof OrderEntity, value: any) => Partial<OrderEntity>;
    validator: (values: any) => any;
  };
}

const useOrderEntry = (
  symbol: string,
  side: OrderSide,
  reduceOnly: boolean = false,
): OrderEntryReturn

​

Real-time data

useOrderEntry provides some real-time data that the UI will use when creating orders based on the latest market data.

• maxQty: The maximum quantity that the user can trade based on the free collateral.
• freeCollateral: The amount collateral available for trading, factoring in open positions and pending orders.
• markPrice: The mark price of the symbol.
• estLiqPrice: The estimated liquidation price, if a position is created from given order paramters.
• estLeverage: The estimated leverage, if a position is created from given order paramters.

Note: Calculating estLiqPrice requires the watchOrderbook option to be set to true. It also depends on the orderbook:update event emitted by the useOrderbookStream hook, which must be used elsewhere in your application.

​

Data calculations

The useOrderEntry hook provides a calculate() function to format user’s input:

• Converts the input quantity into USDC
• Truncates the input quantity and price according to the symbol’s tick size

const {
  helper: { calculate }
} = useOrderEntry({
  symbol: "PERP_ETH_USDC",
  side: OrderSide.BUY,
  orderType: OrderType.MARKET,
  order_quantity: 1
});

const newValue = calculate(values, "order_quantity", 1);

​

Order validations

Order inputs should be validated by the frontend before submitting to provide the best user experience.

const {
  helper: { validator }
} = useOrderEntry({
  symbol: "PERP_ETH_USDC",
  side: OrderSide.BUY,
  orderType: OrderType.MARKET,
  order_quantity: 1
});

const errors = validator(values);

​

Placing orders

const { onSubmit } = useOrderEntry({
  symbol: "PERP_ETH_USDC",
  side: OrderSide.BUY,
  orderType: OrderType.MARKET,
  order_quantity: 1
});

const onSubmit = async (values) => {
  const res = await onSubmit(values);
  //...
};