LaconicNetwork/vega-frontend-monorepo
6
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

chore: update account, fills and orders subscriptions in data providers

Browse Source
This commit is contained in:
Bartłomiej Głownia
2022-09-15 08:19:33 +02:00
parent 7b1bd0384a
commit 37aafeebe4
5 changed files with 61 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files
libs/orders/src/lib/components/order-list/order-edit-dialog.tsx
+4 -4
View File
@@ -16,12 +16,12 @@ import {
} from '@vegaprotocol/ui-toolkit';
import { OrderTimeInForce } from '@vegaprotocol/types';
import { useForm } from 'react-hook-form';
import type { OrderFields } from '../order-data-provider';
import type { OrderWithMarket } from '../order-data-provider';
interface OrderEditDialogProps {
isOpen: boolean;
onChange: (isOpen: boolean) => void;
order: OrderFields;
order: OrderWithMarket;
onSubmit: (fields: FormFields) => void;
}
@@ -69,13 +69,13 @@ export const OrderEditDialog = ({
<div>
<p className={headerClassName}>{t(`Size`)}</p>
<p>
{
{order.market && (
<Size
value={order.size}
side={order.side}
positionDecimalPlaces={order.market.positionDecimalPlaces}
/>
}
)}
</p>
</div>
</div>
libs/orders/src/lib/components/order-list/order-list.tsx
+8 -14
View File
@@ -101,12 +101,12 @@ type OrderListTableValueFormatterParams = Omit<
ValueFormatterParams,
'data' | 'value'
> & {
data: Orders_party_ordersConnection_edges_node | null;
data: OrderWithMarket | null;
};
type OrderListTableProps = (AgGridReactProps | AgReactUiProps) & {
cancel: (order: OrderFields) => void;
setEditOrder: (order: OrderFields) => void;
cancel: (order: OrderWithMarket) => void;
setEditOrder: (order: OrderWithMarket) => void;
};
export const OrderListTable = forwardRef<AgGridReact, OrderListTableProps>(
@@ -131,22 +131,16 @@ export const OrderListTable = forwardRef<AgGridReact, OrderListTableProps>(
cellClass="font-mono text-right"
type="rightAligned"
cellClassRules={{
[positiveClassNames]: ({
data,
}: {
data: Orders_party_ordersConnection_edges_node;
}) => data?.side === Side.SIDE_BUY,
[negativeClassNames]: ({
data,
}: {
data: Orders_party_ordersConnection_edges_node;
}) => data?.side === Side.SIDE_SELL,
[positiveClassNames]: ({ data }: { data: OrderWithMarket }) =>
data?.side === Side.SIDE_BUY,
[negativeClassNames]: ({ data }: { data: OrderWithMarket }) =>
data?.side === Side.SIDE_SELL,
}}
valueFormatter={({
value,
data,
}: OrderListTableValueFormatterParams & {
value?: Orders_party_ordersConnection_edges_node['size'];
value?: OrderWithMarket['size'];
}) => {
if (value === undefined || !data || !data.market) {
return undefined;
libs/trades/src/lib/trades-container.tsx
+16 -22
View File
@@ -6,16 +6,13 @@ import { AsyncRenderer } from '@vegaprotocol/ui-toolkit';
import type { AgGridReact } from 'ag-grid-react';
import { useCallback, useMemo, useRef } from 'react';
import type { BodyScrollEvent, BodyScrollEndEvent } from 'ag-grid-community';
import {
MAX_TRADES,
tradesDataProvider as dataProvider,
} from './trades-data-provider';
import { MAX_TRADES, tradesWithMarketProvider } from './trades-data-provider';
import { TradesTable } from './trades-table';
import type { TradeFields } from './__generated__/TradeFields';
import type {
TradesVariables,
Trades_market_tradesConnection_edges,
} from './__generated__/Trades';
TradeWithMarket,
TradeWithMarketEdge,
} from './trades-data-provider';
import type { TradesVariables } from './__generated__/Trades';
interface TradesContainerProps {
marketId: string;
@@ -23,9 +20,7 @@ interface TradesContainerProps {
export const TradesContainer = ({ marketId }: TradesContainerProps) => {
const gridRef = useRef<AgGridReact | null>(null);
const dataRef = useRef<
(Trades_market_tradesConnection_edges | null)[] | null
>(null);
const dataRef = useRef<TradeWithMarketEdge[] | null>(null);
const totalCountRef = useRef<number | undefined>(undefined);
const newRows = useRef(0);
const scrolledToTop = useRef(true);
@@ -54,8 +49,8 @@ export const TradesContainer = ({ marketId }: TradesContainerProps) => {
data,
delta,
}: {
data: (Trades_market_tradesConnection_edges | null)[];
delta: TradeFields[];
data: TradeWithMarketEdge[];
delta: TradeWithMarket[];
}) => {
if (!gridRef.current?.api) {
return false;
@@ -80,7 +75,7 @@ export const TradesContainer = ({ marketId }: TradesContainerProps) => {
data,
totalCount,
}: {
data: (Trades_market_tradesConnection_edges | null)[];
data: TradeWithMarketEdge[];
totalCount?: number;
}) => {
dataRef.current = data;
@@ -91,7 +86,7 @@ export const TradesContainer = ({ marketId }: TradesContainerProps) => {
);
const { data, error, loading, load, totalCount } = useDataProvider({
dataProvider,
dataProvider: tradesWithMarketProvider,
update,
insert,
variables,
@@ -99,13 +94,12 @@ export const TradesContainer = ({ marketId }: TradesContainerProps) => {
totalCountRef.current = totalCount;
dataRef.current = data;
const getRows =
makeInfiniteScrollGetRows<Trades_market_tradesConnection_edges>(
newRows,
dataRef,
totalCountRef,
load
);
const getRows = makeInfiniteScrollGetRows<TradeWithMarketEdge>(
newRows,
dataRef,
totalCountRef,
load
);
const onBodyScrollEnd = (event: BodyScrollEndEvent) => {
if (event.top === 0) {
libs/trades/src/lib/trades-data-provider.ts
+13 -1
View File
@@ -75,7 +75,19 @@ const update = (
} else {
const firstNode = draft[0]?.node;
if (firstNode && node.createdAt >= firstNode.createdAt) {
draft.unshift({ node, cursor: '', __typename: 'TradeEdge' });
const { marketId, ...nodeData } = node;
draft.unshift({
node: {
...nodeData,
__typename: 'Trade',
market: {
__typename: 'Market',
id: marketId,
},
},
cursor: '',
__typename: 'TradeEdge',
});
}
}
});
libs/trades/src/lib/trades-table.tsx
+20 -7
View File
@@ -8,9 +8,10 @@ import {
getDateTimeFormat,
t,
} from '@vegaprotocol/react-helpers';
import type { IDatasource, IGetRowsParams } from 'ag-grid-community';
import type { CellClassParams, ValueFormatterParams } from 'ag-grid-community';
import type { AgGridReactProps, AgReactUiProps } from 'ag-grid-react';
import type { Trades_market_tradesConnection_edges_node } from './__generated__/Trades';
import type { AgGridReactProps } from 'ag-grid-react';
import type { TradeWithMarket } from './trades-data-provider';
import BigNumber from 'bignumber.js';
export const UP_CLASS = 'text-vega-green-dark dark:text-vega-green';
@@ -37,12 +38,24 @@ const changeCellClass =
return ['font-mono text-right', colorClass].join(' ');
};
type Props = AgGridReactProps | AgReactUiProps;
export interface GetRowsParams extends Omit<IGetRowsParams, 'successCallback'> {
successCallback(rowsThisBlock: TradeWithMarket[], lastRow?: number): void;
}
export interface Datasource extends IDatasource {
getRows(params: GetRowsParams): void;
}
interface Props extends AgGridReactProps {
rowData?: TradeWithMarket[] | null;
datasource?: Datasource;
}
type TradesTableValueFormatterParams = Omit<
ValueFormatterParams,
'data' | 'value'
> & {
data: Trades_market_tradesConnection_edges_node | null;
data: TradeWithMarket | null;
};
export const TradesTable = forwardRef<AgGridReact, Props>((props, ref) => {
@@ -67,7 +80,7 @@ export const TradesTable = forwardRef<AgGridReact, Props>((props, ref) => {
value,
data,
}: TradesTableValueFormatterParams & {
value: Trades_market_tradesConnection_edges_node['price'];
value: TradeWithMarket['price'];
}) => {
if (!data?.market) {
return null;
@@ -84,7 +97,7 @@ export const TradesTable = forwardRef<AgGridReact, Props>((props, ref) => {
value,
data,
}: TradesTableValueFormatterParams & {
value: Trades_market_tradesConnection_edges_node['size'];
value: TradeWithMarket['size'];
}) => {
if (!data?.market) {
return null;
@@ -100,7 +113,7 @@ export const TradesTable = forwardRef<AgGridReact, Props>((props, ref) => {
valueFormatter={({
value,
}: TradesTableValueFormatterParams & {
value: Trades_market_tradesConnection_edges_node['createdAt'];
value: TradeWithMarket['createdAt'];
}) => {
return value && getDateTimeFormat().format(new Date(value));
}}