lab49 / react-order-book Goto Github PK

Here's a good template for a guide like this from the Electron repo: https://github.com/electron/electron/blob/56ab3d73c6f9b2716281b53de3dfcbbbcc1f2188/CONTRIBUTING.md

Expose functions to help add a price update into the order book. Something like (book: Book, update: BookUpdate) => Book, but possibly a class to maintain the book prices in a tree for efficient insert and deletes. See bintrees, and the RBTree.

This could also be written as a hook.

Here's a rough example of what this might look like:

import { OrderBook, mergeUpdates } from '@lab49/react-order-book';

const MyComponent = ({ bookData: Book, bookUpdate: BookUpdate }) => {
  const book = mergeUpdates(bookData, bookUpdate);

  return <OrderBook book={book} />; 
}

As of this writing, this is only working in the @next tag of Storybook. Follow along here: storybookjs/storybook#17831

See https://github.com/lab49/angular-value-flash for an example of how to do this. Moving all of our automated checks over will help make it easier to manage because everything will be in one place.

Expose an HOC to connect to some popular streaming APIs (Coinbase, IEX Cloud), and immediately start rendering an OrderBook.

Plus, we could expose various props to allow customization of the behavior for use with internal streaming APIs of various types (Websocket, SSE, etc).

in case this repo is still maintained, I get this error from my frontend:

Warning: OrderBook: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.
OrderBook@webpack-internal:///(app-pages-browser)/./node_modules/@lab49/react-order-book/dist/OrderBook.mjs:53:17
ConditionalMarketOrderBook@webpack-internal:///(app-pages-browser)/./components/Markets/ConditionalMarketOrderBook.tsx:14:26
div

Right now, you can pick custom colors (bidColor and askColor) which will get interpolated over the length of the order book. But, those colors simply get interpolated into white. Instead, we can add props to let users choose a custom end color. This could be quite useful when trying to match the visual design of your order book to an existing application's visual style.