Move useGetCoins to core (MystenLabs#12020)

## Description 

Describe the changes or additions included in this PR.

- Move useGetCoins for core
- Explorer and Wallet, useGetCoins  from core 
- Update wallet to keep calling `fetchNextPage` until hasNextPage is
false

## Test Plan 

How did you test the new or updated feature?

---
If your changes are not user-facing and not a breaking change, you can
skip the following section. Otherwise, please indicate what changed, and
then add to the Release Notes section as highlighted during the release
process.

### Type of Change (Check all that apply)

- [ ] user-visible impact
- [ ] breaking change for a client SDKs
- [ ] breaking change for FNs (FN binary must upgrade)
- [ ] breaking change for validators or node operators (must upgrade
binaries)
- [ ] breaking change for on-chain data layout
- [ ] necessitate either a data wipe or data migration

### Release notes

apps/explorer/src/hooks/useGetCoins.ts → apps/core/src/hooks/useGetCoins.ts

@@ -1,30 +1,33 @@
 // Copyright (c) Mysten Labs, Inc.
 // SPDX-License-Identifier: Apache-2.0
 
-import { useRpcClient } from '@mysten/core';
+import { useRpcClient } from '../api/RpcClientContext';
 import { useInfiniteQuery } from '@tanstack/react-query';
 
 import type { SuiAddress } from '@mysten/sui.js';
 
 const MAX_COINS_PER_REQUEST = 10;
 
-// Fetch all coins for an address, this will keep calling the API until all coins are fetched
-export function useGetCoins(coinType: string, address?: SuiAddress | null) {
+export function useGetCoins(
+    coinType: string,
+    address?: SuiAddress | null,
+    maxCoinsPerRequest = MAX_COINS_PER_REQUEST
+) {
     const rpc = useRpcClient();
     return useInfiniteQuery(
-        ['get-coins', address, coinType],
-        async ({ pageParam }) =>
-            await rpc.getCoins({
+        ['get-coins', address, coinType, maxCoinsPerRequest],
+        ({ pageParam }) =>
+            rpc.getCoins({
                 owner: address!,
                 coinType,
                 cursor: pageParam ? pageParam.cursor : null,
-                limit: MAX_COINS_PER_REQUEST,
+                limit: maxCoinsPerRequest,
             }),
         {
-            getNextPageParam: (lastPage) =>
-                lastPage?.hasNextPage
+            getNextPageParam: ({ hasNextPage, nextCursor }) =>
+                hasNextPage
                     ? {
-                          cursor: lastPage.nextCursor,
+                          cursor: nextCursor,
                       }
                     : false,
             enabled: !!address,

apps/core/src/index.ts

@@ -29,3 +29,4 @@ export * from './hooks/useGetOwnedObjects';
 export * from './hooks/useCopyToClipboard';
 export * from './hooks/useGetOriginByteKioskContents';
 export * from './hooks/useAppsBackend';
+export * from './hooks/useGetCoins';

apps/explorer/src/components/OwnedCoins/OwnedCoinsPanel.tsx

@@ -1,12 +1,11 @@
 // Copyright (c) Mysten Labs, Inc.
 // SPDX-License-Identifier: Apache-2.0
 
-import { useOnScreen } from '@mysten/core';
+import { useOnScreen, useGetCoins } from '@mysten/core';
 import { useEffect, useRef } from 'react';
 
 import CoinItem from './CoinItem';
 
-import { useGetCoins } from '~/hooks/useGetCoins';
 import { LoadingSpinner } from '~/ui/LoadingSpinner';
 
 type CoinsPanelProps = {

apps/wallet/src/ui/app/hooks/index.ts

@@ -18,7 +18,7 @@ export { useGetTransferAmount } from './useGetTransferAmount';
 export { useGetCoinBalance } from './useGetCoinBalance';
 export { useGetAllBalances } from './useGetAllBalances';
 export { useOwnedNFT } from './useOwnedNFT';
-export { useGetCoins } from './useGetCoins';
 export * from './useSigner';
 export * from './useTransactionData';
 export * from './useActiveAddress';
+export * from './useGetAllCoins';

apps/wallet/src/ui/app/hooks/useGetCoins.ts → apps/wallet/src/ui/app/hooks/useGetAllCoins.ts

@@ -8,10 +8,10 @@ import type { SuiAddress, PaginatedCoins, CoinStruct } from '@mysten/sui.js';
 const MAX_COINS_PER_REQUEST = 100;
 
 // Fetch all coins for an address, this will keep calling the API until all coins are fetched
-export function useGetCoins(coinType: string, address?: SuiAddress | null) {
+export function useGetAllCoins(coinType: string, address?: SuiAddress | null) {
     const rpc = useRpcClient();
     return useQuery({
-        queryKey: ['get-coins', address, coinType],
+        queryKey: ['get-all-coins', address, coinType],
         queryFn: async () => {
             let cursor: string | null = null;
             const allData: CoinStruct[] = [];
@@ -36,5 +36,6 @@ export function useGetCoins(coinType: string, address?: SuiAddress | null) {
             return allData;
         },
         enabled: !!address,
+        initialData: [],
     });
 }

apps/wallet/src/ui/app/pages/home/transfer-coin/SendTokenForm.tsx

@@ -20,7 +20,7 @@ import { AddressInput } from '_components/address-input';
 import Alert from '_components/alert';
 import Loading from '_components/loading';
 import { parseAmount } from '_helpers';
-import { useTransactionGasBudget, useGetCoins } from '_hooks';
+import { useTransactionGasBudget, useGetAllCoins } from '_hooks';
 import { GAS_SYMBOL } from '_src/ui/app/redux/slices/sui-objects/Coin';
 import { InputWithAction } from '_src/ui/app/shared/InputWithAction';
 
@@ -107,40 +107,33 @@ export function SendTokenForm({
 }: SendTokenFormProps) {
     const activeAddress = useActiveAddress();
     // Get all coins of the type
-    const { data: coinsData, isLoading: coinsIsLoading } = useGetCoins(
+    const { data: coinsData, isLoading: coinsIsLoading } = useGetAllCoins(
         coinType,
         activeAddress!
     );
 
-    const { data: suiCoinsData, isLoading: suiCoinsIsLoading } = useGetCoins(
+    const { data: suiCoinsData, isLoading: suiCoinsIsLoading } = useGetAllCoins(
         SUI_TYPE_ARG,
         activeAddress!
     );
 
     const suiCoins = suiCoinsData;
     const coins = coinsData;
-    const coinBalance = CoinAPI.totalBalance(coins || []);
-    const suiBalance = CoinAPI.totalBalance(suiCoinsData || []);
+    const coinBalance = CoinAPI.totalBalance(coins);
+    const suiBalance = CoinAPI.totalBalance(suiCoins);
 
-    const coinSymbol = (coinType && CoinAPI.getCoinSymbol(coinType)) || '';
     const coinMetadata = useCoinMetadata(coinType);
     const coinDecimals = coinMetadata.data?.decimals ?? 0;
 
-    const validationSchemaStepOne = useMemo(
-        () =>
-            createValidationSchemaStepOne(
-                coinBalance,
-                coinSymbol,
-                coinDecimals
-            ),
-        [coinBalance, coinSymbol, coinDecimals]
-    );
-
     const [tokenBalance, symbol, queryResult] = useFormatCoin(
         coinBalance,
         coinType,
         CoinFormat.FULL
     );
+    const validationSchemaStepOne = useMemo(
+        () => createValidationSchemaStepOne(coinBalance, symbol, coinDecimals),
+        [coinBalance, symbol, coinDecimals]
+    );
 
     // remove the comma from the token balance
     const formattedTokenBalance = tokenBalance.replace(/,/g, '');