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

feat(trading): update fills queries, fix empty fills list issue (#3636)

Browse Source
This commit is contained in:
Bartłomiej Głownia 2023-05-09 10:40:06 +02:00 committed by GitHub
parent db75261cd5
commit 72d93bb568
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 62 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
libs/fills/src/lib/Fills.graphql
View File

@ -34,25 +34,22 @@ fragment FillEdge on TradeEdge {
cursor cursor
} }
query Fills($partyId: ID!, $marketId: ID, $pagination: Pagination) { query Fills($filter: TradesFilter, $pagination: Pagination) {
party(id: $partyId) { trades(filter: $filter, pagination: $pagination) {
id edges {
tradesConnection(marketId: $marketId, pagination: $pagination) { ...FillEdge
edges { }
...FillEdge pageInfo {
} startCursor
pageInfo { endCursor
startCursor hasNextPage
endCursor hasPreviousPage
hasNextPage
hasPreviousPage
}
} }
} }
} }
subscription FillsEvent($partyId: ID!) { subscription FillsEvent($filter: TradesSubscriptionFilter!) {
trades(partyId: $partyId) { tradesStream(filter: $filter) {
id id
marketId marketId
buyOrder buyOrder

43
libs/fills/src/lib/__generated__/Fills.ts generated
View File

@ -8,20 +8,19 @@ export type FillFieldsFragment = { __typename?: 'Trade', id: string, createdAt:
export type FillEdgeFragment = { __typename?: 'TradeEdge', cursor: string, node: { __typename?: 'Trade', id: string, createdAt: any, price: string, size: string, buyOrder: string, sellOrder: string, aggressor: Types.Side, market: { __typename?: 'Market', id: string }, buyer: { __typename?: 'Party', id: string }, seller: { __typename?: 'Party', id: string }, buyerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string }, sellerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string } } }; export type FillEdgeFragment = { __typename?: 'TradeEdge', cursor: string, node: { __typename?: 'Trade', id: string, createdAt: any, price: string, size: string, buyOrder: string, sellOrder: string, aggressor: Types.Side, market: { __typename?: 'Market', id: string }, buyer: { __typename?: 'Party', id: string }, seller: { __typename?: 'Party', id: string }, buyerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string }, sellerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string } } };
export type FillsQueryVariables = Types.Exact<{ export type FillsQueryVariables = Types.Exact<{
partyId: Types.Scalars['ID']; filter?: Types.InputMaybe<Types.TradesFilter>;
marketId?: Types.InputMaybe<Types.Scalars['ID']>;
pagination?: Types.InputMaybe<Types.Pagination>; pagination?: Types.InputMaybe<Types.Pagination>;
}>; }>;
export type FillsQuery = { __typename?: 'Query', party?: { __typename?: 'Party', id: string, tradesConnection?: { __typename?: 'TradeConnection', edges: Array<{ __typename?: 'TradeEdge', cursor: string, node: { __typename?: 'Trade', id: string, createdAt: any, price: string, size: string, buyOrder: string, sellOrder: string, aggressor: Types.Side, market: { __typename?: 'Market', id: string }, buyer: { __typename?: 'Party', id: string }, seller: { __typename?: 'Party', id: string }, buyerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string }, sellerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string } } }>, pageInfo: { __typename?: 'PageInfo', startCursor: string, endCursor: string, hasNextPage: boolean, hasPreviousPage: boolean } } | null } | null }; export type FillsQuery = { __typename?: 'Query', trades?: { __typename?: 'TradeConnection', edges: Array<{ __typename?: 'TradeEdge', cursor: string, node: { __typename?: 'Trade', id: string, createdAt: any, price: string, size: string, buyOrder: string, sellOrder: string, aggressor: Types.Side, market: { __typename?: 'Market', id: string }, buyer: { __typename?: 'Party', id: string }, seller: { __typename?: 'Party', id: string }, buyerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string }, sellerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string } } }>, pageInfo: { __typename?: 'PageInfo', startCursor: string, endCursor: string, hasNextPage: boolean, hasPreviousPage: boolean } } | null };
export type FillsEventSubscriptionVariables = Types.Exact<{ export type FillsEventSubscriptionVariables = Types.Exact<{
partyId: Types.Scalars['ID']; filter: Types.TradesSubscriptionFilter;
}>; }>;
export type FillsEventSubscription = { __typename?: 'Subscription', trades?: Array<{ __typename?: 'TradeUpdate', id: string, marketId: string, buyOrder: string, sellOrder: string, buyerId: string, sellerId: string, aggressor: Types.Side, price: string, size: string, createdAt: any, type: Types.TradeType, buyerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string }, sellerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string } }> | null }; export type FillsEventSubscription = { __typename?: 'Subscription', tradesStream?: Array<{ __typename?: 'TradeUpdate', id: string, marketId: string, buyOrder: string, sellOrder: string, buyerId: string, sellerId: string, aggressor: Types.Side, price: string, size: string, createdAt: any, type: Types.TradeType, buyerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string }, sellerFee: { __typename?: 'TradeFee', makerFee: string, infrastructureFee: string, liquidityFee: string } }> | null };
export const FillFieldsFragmentDoc = gql` export const FillFieldsFragmentDoc = gql`
fragment FillFields on Trade { fragment FillFields on Trade {
@ -62,19 +61,16 @@ export const FillEdgeFragmentDoc = gql`
} }
${FillFieldsFragmentDoc}`; ${FillFieldsFragmentDoc}`;
export const FillsDocument = gql` export const FillsDocument = gql`
query Fills($partyId: ID!, $marketId: ID, $pagination: Pagination) { query Fills($filter: TradesFilter, $pagination: Pagination) {
party(id: $partyId) { trades(filter: $filter, pagination: $pagination) {
id edges {
tradesConnection(marketId: $marketId, pagination: $pagination) { ...FillEdge
edges { }
...FillEdge pageInfo {
} startCursor
pageInfo { endCursor
startCursor hasNextPage
endCursor hasPreviousPage
hasNextPage
hasPreviousPage
}
} }
} }
} }
@ -92,13 +88,12 @@ export const FillsDocument = gql`
* @example * @example
* const { data, loading, error } = useFillsQuery({ * const { data, loading, error } = useFillsQuery({
* variables: { * variables: {
* partyId: // value for 'partyId' * filter: // value for 'filter'
* marketId: // value for 'marketId'
* pagination: // value for 'pagination' * pagination: // value for 'pagination'
* }, * },
* }); * });
*/ */
export function useFillsQuery(baseOptions: Apollo.QueryHookOptions<FillsQuery, FillsQueryVariables>) { export function useFillsQuery(baseOptions?: Apollo.QueryHookOptions<FillsQuery, FillsQueryVariables>) {
const options = {...defaultOptions, ...baseOptions} const options = {...defaultOptions, ...baseOptions}
return Apollo.useQuery<FillsQuery, FillsQueryVariables>(FillsDocument, options); return Apollo.useQuery<FillsQuery, FillsQueryVariables>(FillsDocument, options);
} }
@ -110,8 +105,8 @@ export type FillsQueryHookResult = ReturnType<typeof useFillsQuery>;
export type FillsLazyQueryHookResult = ReturnType<typeof useFillsLazyQuery>; export type FillsLazyQueryHookResult = ReturnType<typeof useFillsLazyQuery>;
export type FillsQueryResult = Apollo.QueryResult<FillsQuery, FillsQueryVariables>; export type FillsQueryResult = Apollo.QueryResult<FillsQuery, FillsQueryVariables>;
export const FillsEventDocument = gql` export const FillsEventDocument = gql`
subscription FillsEvent($partyId: ID!) { subscription FillsEvent($filter: TradesSubscriptionFilter!) {
trades(partyId: $partyId) { tradesStream(filter: $filter) {
id id
marketId marketId
buyOrder buyOrder
@ -149,7 +144,7 @@ export const FillsEventDocument = gql`
* @example * @example
* const { data, loading, error } = useFillsEventSubscription({ * const { data, loading, error } = useFillsEventSubscription({
* variables: { * variables: {
* partyId: // value for 'partyId' * filter: // value for 'filter'
* }, * },
* }); * });
*/ */

13
libs/fills/src/lib/fills-data-provider.ts
View File

@ -22,7 +22,7 @@ import type {
const update = ( const update = (
data: FillEdgeFragment[] | null, data: FillEdgeFragment[] | null,
delta: FillsEventSubscription['trades'] delta: FillsEventSubscription['tradesStream']
) => { ) => {
return produce(data, (draft) => { return produce(data, (draft) => {
orderBy(delta, 'createdAt').forEach((node) => { orderBy(delta, 'createdAt').forEach((node) => {
@ -36,7 +36,10 @@ const update = (
} }
} else { } else {
const firstNode = draft[0]?.node; const firstNode = draft[0]?.node;
if (firstNode && node.createdAt >= firstNode.createdAt) { if (
(firstNode && node.createdAt >= firstNode.createdAt) ||
!firstNode
) {
const { buyerId, sellerId, marketId, ...trade } = node; const { buyerId, sellerId, marketId, ...trade } = node;
draft.unshift({ draft.unshift({
node: { node: {
@ -65,13 +68,13 @@ export type Trade = Omit<FillFieldsFragment, 'market'> & {
export type TradeEdge = Edge<Trade>; export type TradeEdge = Edge<Trade>;
const getData = (responseData: FillsQuery | null): FillEdgeFragment[] => const getData = (responseData: FillsQuery | null): FillEdgeFragment[] =>
responseData?.party?.tradesConnection?.edges || []; responseData?.trades?.edges || [];
const getPageInfo = (responseData: FillsQuery | null): PageInfo | null => const getPageInfo = (responseData: FillsQuery | null): PageInfo | null =>
responseData?.party?.tradesConnection?.pageInfo || null; responseData?.trades?.pageInfo || null;
const getDelta = (subscriptionData: FillsEventSubscription) => const getDelta = (subscriptionData: FillsEventSubscription) =>
subscriptionData.trades || []; subscriptionData.tradesStream || [];
export const fillsProvider = makeDataProvider< export const fillsProvider = makeDataProvider<
Parameters<typeof getData>['0'], Parameters<typeof getData>['0'],

32
libs/fills/src/lib/fills.mock.ts
View File

@ -12,24 +12,20 @@ export const fillsQuery = (
vegaPublicKey?: string vegaPublicKey?: string
): FillsQuery => { ): FillsQuery => {
const defaultResult: FillsQuery = { const defaultResult: FillsQuery = {
party: { trades: {
id: vegaPublicKey || 'vega-0', __typename: 'TradeConnection',
tradesConnection: { edges: fills(vegaPublicKey).map((node) => ({
__typename: 'TradeConnection', __typename: 'TradeEdge',
edges: fills(vegaPublicKey).map((node) => ({ cursor: '3',
__typename: 'TradeEdge', node,
cursor: '3', })),
node, pageInfo: {
})), __typename: 'PageInfo',
pageInfo: { startCursor: '1',
__typename: 'PageInfo', endCursor: '2',
startCursor: '1', hasNextPage: false,
endCursor: '2', hasPreviousPage: false,
hasNextPage: false,
hasPreviousPage: false,
},
}, },
__typename: 'Party',
}, },
}; };
@ -169,7 +165,7 @@ export const fillsEventSubscription = (
): FillsEventSubscription => { ): FillsEventSubscription => {
const defaultResult: FillsEventSubscription = { const defaultResult: FillsEventSubscription = {
__typename: 'Subscription', __typename: 'Subscription',
trades: [ tradesStream: [
{ {
__typename: 'TradeUpdate', __typename: 'TradeUpdate',
id: '0', id: '0',

10
libs/fills/src/lib/use-fills-list.ts
View File

@ -2,6 +2,7 @@ import type { RefObject } from 'react';
import type { AgGridReact } from 'ag-grid-react'; import type { AgGridReact } from 'ag-grid-react';
import { useCallback, useRef } from 'react'; import { useCallback, useRef } from 'react';
import { makeInfiniteScrollGetRows } from '@vegaprotocol/data-provider'; import { makeInfiniteScrollGetRows } from '@vegaprotocol/data-provider';
import type * as Types from '@vegaprotocol/types';
import { updateGridData } from '@vegaprotocol/datagrid'; import { updateGridData } from '@vegaprotocol/datagrid';
import { useDataProvider } from '@vegaprotocol/data-provider'; import { useDataProvider } from '@vegaprotocol/data-provider';
import type { Trade, TradeEdge } from './fills-data-provider'; import type { Trade, TradeEdge } from './fills-data-provider';
@ -89,11 +90,18 @@ export const useFillsList = ({
[gridRef] [gridRef]
); );
const filter: Types.TradesFilter & Types.TradesSubscriptionFilter = {
partyIds: [partyId],
};
if (marketId) {
filter.marketIds = [marketId];
}
const { data, error, loading, load, totalCount, reload } = useDataProvider({ const { data, error, loading, load, totalCount, reload } = useDataProvider({
dataProvider: fillsWithMarketProvider, dataProvider: fillsWithMarketProvider,
update, update,
insert, insert,
variables: { partyId, marketId: marketId || '' }, variables: { filter },
}); });
totalCountRef.current = totalCount; totalCountRef.current = totalCount;