Fix loading and type issue

LedgerHQ · Jan 29, 2024 · ec512f6 · ec512f6
1 parent d6ee9eb
commit ec512f6
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 19 deletions.
diff --git a/apps/ledger-live-mobile/src/components/Nft/NftGallery/NftList.tsx b/apps/ledger-live-mobile/src/components/Nft/NftGallery/NftList.tsx
@@ -168,22 +168,28 @@ const NftList = ({ data, hasNextPage, fetchNextPage, isLoading }: Props) => {
  marginBottom: multiSelectModeEnabled ? 0 : space[3],
  }}
  ListFooterComponent={
- hasNextPage ? (
+ !isLoading && hasNextPage ? (
  <Flex paddingBottom={25} paddingTop={25}>
- <InfiniteLoader />
+ <InfiniteLoader color="yellow" />
  </Flex>
  ) : null
  }
  ListEmptyComponent={
- <EmptyState
- onPress={() => {
- track("button_clicked", {
- button: "Reset Filters",
- page: ScreenName.WalletNftGallery,
- });
- openFilterDrawer();
- }}
- />
+ isLoading ? (
+ <Flex flexGrow={1} justifyContent="center" paddingBottom={150}>
+ <InfiniteLoader />
+ </Flex>
+ ) : (
+ <EmptyState
+ onPress={() => {
+ track("button_clicked", {
+ button: "Reset Filters",
+ page: ScreenName.WalletNftGallery,
+ });
+ openFilterDrawer();
+ }}
+ />
+ )
  }
  data={data.length > 0 ? dataWithAdd : data}
  renderItem={renderItem}

diff --git a/apps/ledger-live-mobile/src/hooks/useNftGallery/index.ts b/apps/ledger-live-mobile/src/hooks/useNftGallery/index.ts
@@ -72,13 +72,14 @@ export function useNftGallery({ addresses, nftsOwned, chains }: HookProps) {
 
  return {
  ...queryResult,
- nfts: queryResult.data?.pages
- .flatMap(x => x?.whiteList || [])
- .map(elem =>
- nftsWithProperties.get(
- encodeNftId("", elem.contract ?? "", elem.tokenId ?? "", elem.currencyId ?? ""),
- ),
- )
- .filter(Boolean) as ProtoNFT[],
+ nfts:
+ (queryResult.data?.pages
+ .flatMap(x => x?.whiteList || [])
+ .map(elem =>
+ nftsWithProperties.get(
+ encodeNftId("", elem.contract ?? "", elem.tokenId ?? "", elem.currencyId ?? ""),
+ ),
+ )
+ .filter(Boolean) as ProtoNFT[]) || [],
  };
 }