fix: logic for Show more button in the wallets list (#3277)

.gitignore

@@ -27,3 +27,6 @@ cypress/screenshots/**/*.png
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+
+# IDE
+.idea/

src/domains/dashboard/components/Wallets/hooks.test.tsx

@@ -45,7 +45,7 @@ describe("useWalletDisplay hook", () => {
 		});
 
 		expect(result.current.listWallets).toHaveLength(2);
-		expect(result.current.listHasMore).toBe(true);
+		expect(result.current.listHasMore).toBe(false);
 	});
 
 	it("should limit list type wallets", async () => {
@@ -73,15 +73,15 @@ describe("useWalletDisplay hook", () => {
 				useWalletDisplay({
 					wallets,
 					selectedNetworkIds: ["ark.devnet", "ark.mainnet"],
-					viewMore: false,
+					viewMore: true,
 					listPagerLimit: 1,
 				}),
 			{
 				wrapper,
 			},
 		);
 
-		expect(result.current.listWallets).toHaveLength(2);
+		expect(result.current.listWallets).toHaveLength(3);
 	});
 
 	it("should filter wallets by selectedNetworkIds", async () => {
@@ -96,7 +96,7 @@ describe("useWalletDisplay hook", () => {
 	it("should return listHasMore boolean", async () => {
 		const wrapper = ({ children }: any) => <EnvironmentProvider env={env}> {children} </EnvironmentProvider>;
 		const { result } = renderHook(
-			() => useWalletDisplay({ wallets, selectedNetworkIds: ["ark.devnet"], listPagerLimit: 1, viewMore: true }),
+			() => useWalletDisplay({ wallets, selectedNetworkIds: ["ark.devnet"], listPagerLimit: 1, viewMore: false }),
 			{
 				wrapper,
 			},

src/domains/dashboard/components/Wallets/hooks.ts

@@ -21,24 +21,14 @@ export const useWalletDisplay = ({
 
 	const { listWallets, gridWallets, listHasMore } = useMemo(() => {
 		const listWallets = wallets
-			.filter((wallet: any, index: number) => {
-				if (!viewMore && index > listPagerLimit) {
-					return false;
-				}
-
-				if (!selectedNetworkIds?.includes(wallet.network().id())) {
-					return false;
-				}
-
+			.filter((wallet: any) => {
 				if (displayType === "favorites") {
 					return wallet.isStarred();
 				}
-
 				if (displayType === "ledger") {
 					return wallet.isLedger();
 				}
-
-				return wallet && !wallet.isBlank;
+				return wallet && !wallet.isBlank && selectedNetworkIds?.includes(wallet.network().id());
 			})
 			.map((wallet) => ({ wallet }));
 
@@ -87,9 +77,9 @@ export const useWalletDisplay = ({
 		};
 
 		return {
-			listWallets,
+			listWallets: viewMore ? listWallets : listWallets.slice(0, listPagerLimit),
 			gridWallets: loadGridWallets(),
-			listHasMore: wallets.length > 0 && wallets.length > listWallets.length,
+			listHasMore: wallets.length > 0 && listWallets.length > listPagerLimit && !viewMore,
 		};
 	}, [wallets, selectedNetworkIds, displayType, viewMore, sliderOptions.slidesPerView, listPagerLimit]);