vega-frontend-monorepo/apps/trading/components/page-query-container/page-query-container.tsx
Bartłomiej Głownia d0ec016adc
Feature/151 orderbook (#266)
* [#151] Add orderbook

* [#151] Add orderbook components

* [#151] Add market-depth data provider

* [#151] Add orderbook manager

* [#151] handle market depth updates in orderbook manager

* [#151] Fix PageQueryContainer usage of AsyncRenderer

* [#151] Move data handling logig out from orderbook manager

* [#151] Use mocked data, fix data issues

* [#151] Add compact order book data unit tests

* [#151] Add updateData unit tests

* [#151] Add updateCompactedData unit tests

* [#151] update cummulative vol on update, move data ref handling from effect to manager

* [#151] Update cummulative vol on update, fixes

* [#151] Optimieze orderbook ag-grid render

* [#151] Replace ag-grid with orderbook component

* [#151] Use react memo to optimize orderbook rendering

* [#151] Fix cummulative vol computation on compacted data update

* [#151] Add resolution controls

* [#151] Fix cumulative spelling mistake

* [#151] Use number instead of string for cumulative values

* [#151] Expose restart callback in useDataProvider hook

* [#151] Update empty cumulative values

* [#151] Add horizontal line under header in orderbook

* [#151] reuse orderbook data in market-depth chart

* [#151] restart market depth provider on sequenceNumber gap

* [#151] use throttle in orderbook and depth-chart

* [#151] Add comments, refactor data functions

* [#151] Add comments, refactor data functions

* [#151] move orderbook and depth-chart libs to market-depth
2022-04-26 17:26:28 +02:00

29 lines
807 B
TypeScript

import type { OperationVariables, QueryHookOptions } from '@apollo/client';
import { useQuery } from '@apollo/client';
import type { DocumentNode } from 'graphql';
import type { ReactNode } from 'react';
import { AsyncRenderer } from '@vegaprotocol/ui-toolkit';
interface PageQueryContainerProps<TData, TVariables> {
query: DocumentNode;
options?: QueryHookOptions<TData, TVariables>;
render: (data: TData) => ReactNode;
}
export const PageQueryContainer = <TData, TVariables = OperationVariables>({
query,
options,
render,
}: PageQueryContainerProps<TData, TVariables>) => {
const { data, loading, error } = useQuery<TData, TVariables>(query, options);
return (
<AsyncRenderer<TData>
loading={loading}
error={error}
data={data}
render={render}
/>
);
};