From 48f935e1054bdc653583890fcde32dbae36bea56 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Richard=20Jedli=C4=8Dka?= Date: Tue, 14 Nov 2023 13:59:32 +0100 Subject: [PATCH] fix pagination --- src/components/ItemsTable.tsx | 2 +- .../account/AccountBalancesTable.tsx | 5 +- src/model/pageInfo.ts | 3 +- src/services/balancesService.ts | 7 ++- src/services/blocksService.ts | 14 ++++- src/services/callsService.ts | 14 ++++- src/services/eventsService.ts | 15 +++++- src/services/extrinsicsService.ts | 14 ++++- src/services/searchService.ts | 51 +++++++++++++------ src/services/transfersService.ts | 26 ++-------- src/utils/itemsConnection.ts | 18 +++---- src/utils/itemsResponse.ts | 5 +- 12 files changed, 112 insertions(+), 62 deletions(-) diff --git a/src/components/ItemsTable.tsx b/src/components/ItemsTable.tsx index 22b1693e..3fd81cff 100644 --- a/src/components/ItemsTable.tsx +++ b/src/components/ItemsTable.tsx @@ -191,7 +191,7 @@ export const ItemsTable = )} diff --git a/src/components/account/AccountBalancesTable.tsx b/src/components/account/AccountBalancesTable.tsx index 20e95f74..d7a9c49b 100644 --- a/src/components/account/AccountBalancesTable.tsx +++ b/src/components/account/AccountBalancesTable.tsx @@ -101,8 +101,9 @@ export const AccountBalancesTable = (props: AccountBalancesTableProps) => { const pageInfo = useMemo(() => ({ page: pagination.page, pageSize: pagination.pageSize, - hasNextPage: pagination.page * pagination.pageSize < data.length, - totalPageCount: Math.ceil(data.length / pagination.pageSize) + totalPageCount: Math.ceil(data.length / pagination.pageSize), + hasPrevious: pagination.page > 0, + hasNext: pagination.page * pagination.pageSize < data.length, }), [data, pagination]); const handleSortSelected = useCallback((value: SortOrder>) => { diff --git a/src/model/pageInfo.ts b/src/model/pageInfo.ts index 00d147a7..b3f9d89c 100644 --- a/src/model/pageInfo.ts +++ b/src/model/pageInfo.ts @@ -1,6 +1,7 @@ export type PageInfo = { page: number; pageSize: number; - hasNextPage: boolean; totalPageCount: number|undefined; + hasPrevious: boolean; + hasNext: boolean; } diff --git a/src/services/balancesService.ts b/src/services/balancesService.ts index ea774a73..22bf645e 100644 --- a/src/services/balancesService.ts +++ b/src/services/balancesService.ts @@ -58,7 +58,12 @@ export async function getBalances( } ); - const balances = extractConnectionItems(response.accountsConnection, unifyStatsSquidAccountBalance, network); + const balances = extractConnectionItems( + response.accountsConnection, + pagination, + unifyStatsSquidAccountBalance, + network + ); return balances; } diff --git a/src/services/blocksService.ts b/src/services/blocksService.ts index 7f2fc5fa..797ff2c2 100644 --- a/src/services/blocksService.ts +++ b/src/services/blocksService.ts @@ -134,7 +134,12 @@ async function getArchiveBlocks( } ); - const blocks = extractConnectionItems(response.blocksConnection, unifyArchiveBlock, network); + const blocks = extractConnectionItems( + response.blocksConnection, + pagination, + unifyArchiveBlock, + network + ); return blocks; } @@ -179,7 +184,12 @@ async function getExplorerSquidBlocks( } ); - const blocks = extractConnectionItems(response.blocksConnection, unifyExplorerSquidBlock, network); + const blocks = extractConnectionItems( + response.blocksConnection, + pagination, + unifyExplorerSquidBlock, + network + ); return blocks; } diff --git a/src/services/callsService.ts b/src/services/callsService.ts index cd96ef14..94442c93 100644 --- a/src/services/callsService.ts +++ b/src/services/callsService.ts @@ -168,7 +168,12 @@ async function getArchiveCalls( } ); - return extractConnectionItems(response?.callsConnection, unifyArchiveCall, network); + return extractConnectionItems( + response.callsConnection, + pagination, + unifyArchiveCall, + network + ); } async function getExplorerSquidCalls( @@ -220,7 +225,12 @@ async function getExplorerSquidCalls( } ); - return extractConnectionItems(response.callsConnection, unifyExplorerSquidCall, network); + return extractConnectionItems( + response.callsConnection, + pagination, + unifyExplorerSquidCall, + network + ); } async function getArchiveCallsArgs(network: string, callsIds: string[]) { diff --git a/src/services/eventsService.ts b/src/services/eventsService.ts index ff2f6376..25ba33ea 100644 --- a/src/services/eventsService.ts +++ b/src/services/eventsService.ts @@ -235,7 +235,12 @@ async function getArchiveEvents( } ); - return extractConnectionItems(response.eventsConnection, unifyArchiveEvent, network); + return extractConnectionItems( + response.eventsConnection, + pagination, + unifyArchiveEvent, + network + ); } async function getExplorerSquidEvents( @@ -287,7 +292,13 @@ async function getExplorerSquidEvents( } ); - const data = await extractConnectionItems(response.eventsConnection, unifyExplorerSquidEvent, network); + const data = await extractConnectionItems( + response.eventsConnection, + pagination, + unifyExplorerSquidEvent, + network + ); + const events = await addEventsArgs(network, data); return events; diff --git a/src/services/extrinsicsService.ts b/src/services/extrinsicsService.ts index 03d9d212..a5979f59 100644 --- a/src/services/extrinsicsService.ts +++ b/src/services/extrinsicsService.ts @@ -201,7 +201,12 @@ async function getArchiveExtrinsics( } ); - return extractConnectionItems(response.extrinsicsConnection, unifyArchiveExtrinsic, network); + return extractConnectionItems( + response.extrinsicsConnection, + pagination, + unifyArchiveExtrinsic, + network + ); } async function getExplorerSquidExtrinsics( @@ -258,7 +263,12 @@ async function getExplorerSquidExtrinsics( } ); - return extractConnectionItems(response.extrinsicsConnection, unifyExplorerSquidExtrinsic, network); + return extractConnectionItems( + response.extrinsicsConnection, + pagination, + unifyExplorerSquidExtrinsic, + network + ); } /** diff --git a/src/services/searchService.ts b/src/services/searchService.ts index d35f6a98..c3d41f6b 100644 --- a/src/services/searchService.ts +++ b/src/services/searchService.ts @@ -80,8 +80,9 @@ export async function search(query: string, networks: Network[], pagination: Sea pageInfo: { page: 1, pageSize: 10, // TODO constant - hasNextPage: false, - totalPageCount: 1 + totalPageCount: 1, + hasPrevious: false, + hasNext: false, }, totalCount: 1 }, @@ -159,9 +160,9 @@ async function searchNetwork( if (isHex(query)) { return searchNetworkByHash(network, query, pagination); } else if (query?.match(/^\d+$/)) { - return searchNetworkByBlockHeight(network, parseInt(query)); + return searchNetworkByBlockHeight(network, parseInt(query), pagination); } else if (isEncodedAddress(network, query)) { - return searchNetworkByEncodedAddress(network, query); + return searchNetworkByEncodedAddress(network, query, pagination); } else { return searchNetworkByName(network, query, pagination, fetchAll); } @@ -256,8 +257,19 @@ async function searchNetworkByHash( } ); - const blocks = await extractConnectionItems(response.blocks, unifyExplorerSquidBlock, network.name); - const extrinsics = await extractConnectionItems(response.extrinsics, unifyExplorerSquidExtrinsic, network.name); + const blocks = await extractConnectionItems( + response.blocks, + pagination.blocks, + unifyExplorerSquidBlock, + network.name + ); + + const extrinsics = await extractConnectionItems( + response.extrinsics, + pagination.extrinsics, + unifyExplorerSquidExtrinsic, + network.name + ); const result: NetworkSearchResult = { network, @@ -271,7 +283,7 @@ async function searchNetworkByHash( return result; } -async function searchNetworkByBlockHeight(network: Network, height: number) { +async function searchNetworkByBlockHeight(network: Network, height: number, pagination: SearchPaginationOptions) { const blocksFilter: BlocksFilter = {height}; const response = await fetchExplorerSquid<{ @@ -305,7 +317,12 @@ async function searchNetworkByBlockHeight(network: Network, height: number) { } ); - const blocks = await extractConnectionItems(response.blocks, unifyExplorerSquidBlock, network.name); + const blocks = await extractConnectionItems( + response.blocks, + pagination.blocks, + unifyExplorerSquidBlock, + network.name + ); const result: NetworkSearchResult = { network, @@ -319,7 +336,7 @@ async function searchNetworkByBlockHeight(network: Network, height: number) { return result; } -async function searchNetworkByEncodedAddress(network: Network, encodedAddress: string) { +async function searchNetworkByEncodedAddress(network: Network, encodedAddress: string, pagination: SearchPaginationOptions) { const result: NetworkSearchResult = { network, accounts: { @@ -330,10 +347,11 @@ async function searchNetworkByEncodedAddress(network: Network, encodedAddress: s identity: null }], pageInfo: { - page: 1, - pageSize: 10, - hasNextPage: false, - totalPageCount: 1 + page: pagination.accounts.page, + pageSize: pagination.accounts.pageSize, + totalPageCount: 1, + hasPrevious: false, + hasNext: false, }, totalCount: 1 }, @@ -491,6 +509,7 @@ async function searchNetworkByName( const extrinsics = await extractConnectionItems( response.extrinsics, + pagination.extrinsics, unifyExplorerSquidExtrinsic, network.name ); @@ -499,6 +518,7 @@ async function searchNetworkByName( network.name, await extractConnectionItems( response.events, + pagination.events, unifyExplorerSquidEvent, network.name ) @@ -571,8 +591,9 @@ function networkResultsToSearchResultItems 0, + hasNext: pagination.page * pagination.pageSize < data.length, }, totalCount }; diff --git a/src/services/transfersService.ts b/src/services/transfersService.ts index dedfa3c9..aac73c6a 100644 --- a/src/services/transfersService.ts +++ b/src/services/transfersService.ts @@ -84,28 +84,12 @@ async function getMainSquidTransfers( } ); - return await extractConnectionItems(response.transfersConnection, unifyMainSquidTransfer, network); -} - -async function getArchiveExtrinsicsInfo(network: string, extrinsicHashes: string[]) { - const response = await fetchArchive<{extrinsics: {id: string, hash: string}[]}>( - network, - `query($hashes: [String!], $limit: Int!) { - extrinsics(where: { hash_in: $hashes }, limit: $limit) { - id, - hash - } - }`, - { - hashes: extrinsicHashes, - limit: extrinsicHashes.length - } + return await extractConnectionItems( + response.transfersConnection, + pagination, + unifyMainSquidTransfer, + network ); - - return response.extrinsics.reduce((extrinsicInfoByHash, extrinsic) => { - extrinsicInfoByHash[extrinsic.hash] = extrinsic; - return extrinsicInfoByHash; - }, {} as Record); } function unifyMainSquidTransfer(transfer: MainSquidTransfer, networkName: string): Transfer { diff --git a/src/utils/itemsConnection.ts b/src/utils/itemsConnection.ts index b864c179..42bd0e3d 100644 --- a/src/utils/itemsConnection.ts +++ b/src/utils/itemsConnection.ts @@ -16,6 +16,7 @@ export function paginationToConnectionCursor(pagination: PaginationOptions) { export async function extractConnectionItems( connection: ItemsConnection, + pagination: PaginationOptions, transformNode: (node: T, ...a: A) => R|Promise, ...additionalArgs: A ): Promise> { @@ -25,23 +26,18 @@ export async function extractConnectionItems; diff --git a/src/utils/itemsResponse.ts b/src/utils/itemsResponse.ts index b52802dd..09f277fc 100644 --- a/src/utils/itemsResponse.ts +++ b/src/utils/itemsResponse.ts @@ -8,8 +8,9 @@ export function emptyItemsResponse(totalCount?: number): ItemsResponse { pageInfo: { page: 1, pageSize: 10, // TODO constant - hasNextPage: false, - totalPageCount: 0 + totalPageCount: 0, + hasPrevious: false, + hasNext: false, }, totalCount, };