diff --git a/apps/mobile/src/features/Assets/components/NFTs/NFTs.container.test.tsx b/apps/mobile/src/features/Assets/components/NFTs/NFTs.container.test.tsx
new file mode 100644
index 0000000000..d3dedda2a2
--- /dev/null
+++ b/apps/mobile/src/features/Assets/components/NFTs/NFTs.container.test.tsx
@@ -0,0 +1,59 @@
+import React from 'react'
+import { render, screen } from '@/src/tests/test-utils'
+import { NFTsContainer } from './NFTs.container'
+import { server } from '@/src/tests/server'
+import { http, HttpResponse } from 'msw'
+import { GATEWAY_URL } from '@/src/config/constants'
+
+// Mock active safe selector with memoized object
+const mockActiveSafe = { chainId: '1', address: '0x123' }
+
+jest.mock('@/src/store/activeSafeSlice', () => ({
+ selectActiveSafe: () => mockActiveSafe,
+}))
+
+describe('NFTsContainer', () => {
+ afterAll(() => {
+ server.resetHandlers()
+ })
+ it('renders loading state initially', () => {
+ render()
+ expect(screen.getByTestId('fallback')).toBeTruthy()
+ })
+
+ it('renders error state when API fails', async () => {
+ server.use(
+ http.get(`${GATEWAY_URL}//v2/chains/:chainId/safes/:safeAddress/collectibles`, () => {
+ return HttpResponse.error()
+ }),
+ )
+
+ render()
+ expect(await screen.findByTestId('fallback')).toBeTruthy()
+ })
+
+ it('renders NFT list when data is available', async () => {
+ render()
+
+ // First verify we see the loading state
+ expect(screen.getByTestId('fallback')).toBeTruthy()
+
+ // Then check for NFT content
+ const nft1 = await screen.findByText('NFT #1')
+ const nft2 = await screen.findByText('NFT #2')
+
+ expect(nft1).toBeTruthy()
+ expect(nft2).toBeTruthy()
+ })
+
+ it('renders fallback when data is empty', async () => {
+ server.use(
+ http.get(`${GATEWAY_URL}//v2/chains/:chainId/safes/:safeAddress/collectibles`, () => {
+ return HttpResponse.json({ results: [] })
+ }),
+ )
+
+ render()
+ expect(await screen.findByTestId('fallback')).toBeTruthy()
+ })
+})
diff --git a/apps/mobile/src/features/Assets/components/NoFunds/NoFunds.test.tsx b/apps/mobile/src/features/Assets/components/NoFunds/NoFunds.test.tsx
new file mode 100644
index 0000000000..628372895e
--- /dev/null
+++ b/apps/mobile/src/features/Assets/components/NoFunds/NoFunds.test.tsx
@@ -0,0 +1,22 @@
+import React from 'react'
+import { render, screen } from '@/src/tests/test-utils'
+import { NoFunds } from './NoFunds'
+
+describe('NoFunds', () => {
+ it('renders the empty token component', () => {
+ render()
+
+ // Check for the main elements
+ expect(screen.getByText('Add funds to get started')).toBeTruthy()
+ expect(
+ screen.getByText('Send funds to your Safe Account from another wallet by copying your address.'),
+ ).toBeTruthy()
+ })
+
+ it('renders the EmptyToken component', () => {
+ render()
+
+ // Check if EmptyToken is rendered by looking for its container
+ expect(screen.getByTestId('empty-token')).toBeTruthy()
+ })
+})
diff --git a/apps/mobile/src/features/Assets/components/NoFunds/NoFunds.tsx b/apps/mobile/src/features/Assets/components/NoFunds/NoFunds.tsx
index b0cf7f0e9d..1c5baad6e8 100644
--- a/apps/mobile/src/features/Assets/components/NoFunds/NoFunds.tsx
+++ b/apps/mobile/src/features/Assets/components/NoFunds/NoFunds.tsx
@@ -4,7 +4,7 @@ import EmptyToken from './EmptyToken'
export function NoFunds() {
return (
-
+
Add funds to get started
diff --git a/apps/mobile/src/tests/handlers.ts b/apps/mobile/src/tests/handlers.ts
index fafdae7897..69258153ad 100644
--- a/apps/mobile/src/tests/handlers.ts
+++ b/apps/mobile/src/tests/handlers.ts
@@ -1,22 +1,12 @@
import { http, HttpResponse } from 'msw'
-
-export const mockBalanceData = {
- items: [
- {
- tokenInfo: {
- name: 'Ethereum',
- symbol: 'ETH',
- decimals: 18,
- logoUri: 'https://safe-transaction-assets.safe.global/chains/1/chain_logo.png',
- },
- balance: '1000000000000000000',
- fiatBalance: '2000',
- },
- ],
-}
+import { mockBalanceData, mockNFTData } from './mocks'
+import { GATEWAY_URL } from '../config/constants'
export const handlers = [
- http.get('https://safe-client.safe.global//v1/chains/1/safes/0x123/balances/USD', () => {
+ http.get(`${GATEWAY_URL}//v1/chains/1/safes/0x123/balances/USD`, () => {
return HttpResponse.json(mockBalanceData)
}),
+ http.get(`${GATEWAY_URL}//v2/chains/:chainId/safes/:safeAddress/collectibles`, () => {
+ return HttpResponse.json(mockNFTData)
+ }),
]
diff --git a/apps/mobile/src/tests/mocks.ts b/apps/mobile/src/tests/mocks.ts
index 7b1b4861ec..dcbc5e2db9 100644
--- a/apps/mobile/src/tests/mocks.ts
+++ b/apps/mobile/src/tests/mocks.ts
@@ -20,6 +20,52 @@ import {
Transaction,
} from '@safe-global/store/gateway/AUTO_GENERATED/transactions'
+export const mockBalanceData = {
+ items: [
+ {
+ tokenInfo: {
+ name: 'Ethereum',
+ symbol: 'ETH',
+ decimals: 18,
+ logoUri: 'https://safe-transaction-assets.safe.global/chains/1/chain_logo.png',
+ },
+ balance: '1000000000000000000',
+ fiatBalance: '2000',
+ },
+ ],
+}
+
+export const mockNFTData = {
+ count: 2,
+ next: null,
+ previous: null,
+ results: [
+ {
+ id: '1',
+ address: '0x123',
+ tokenName: 'Cool NFT',
+ tokenSymbol: 'CNFT',
+ logoUri: 'https://example.com/nft1.png',
+ name: 'NFT #1',
+ description: 'A cool NFT',
+ tokenId: '1',
+ uri: 'https://example.com/nft1.json',
+ imageUri: 'https://example.com/nft1.png',
+ },
+ {
+ id: '2',
+ address: '0x456',
+ tokenName: 'Another NFT',
+ tokenSymbol: 'ANFT',
+ logoUri: 'https://example.com/nft2.png',
+ name: 'NFT #2',
+ description: 'Another cool NFT',
+ tokenId: '2',
+ uri: 'https://example.com/nft2.json',
+ imageUri: 'https://example.com/nft2.png',
+ },
+ ],
+}
export const fakeToken = {
address: '0x1111111111',
decimals: 18,