[feat #163] extract react-query usage into custom hooks

[jorgezerpa]

#163 Create custom hooks for react-query usage:

useQuery:

• (was already implemented) useCollection
• useCollectionTraits
• (was already implemented) useTokenMarketData
• useSearchCollection
• useSystemStatus
• (was already implemented) useBalance
• (was already implemented) usePortfolioStats
• (was already implemented) usePrices

useInfiniteQuery:

• useCollectionActivity
• useTokenActivity
• useTokenOffers
• useWalletActivity
• useWalletCollections
• useWalletOffers
• useWalletTokens

useSuspenseQuery:

• useCollectionTraits --> renamed to useCollectionTraitsSuspense (there are another hook called useCollectionTraits but with useQuery instead of useSuspenseQuery)

useSuspenseInfiniteQuery:

• useCollectionTokens

[vercel]

@jorgezerpa is attempting to deploy a commit to the Screenshot Team on Vercel.

A member of the Team first needs to authorize it.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
ark-arkmarket	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Oct 8, 2024 6:27pm
ark-market-unframed	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Oct 8, 2024 6:27pm

[YohanTz]

Hey @jorgezerpa, thanks for your PR! Could you replace the places where we use react query with your hooks?

[jorgezerpa]

Hey @jorgezerpa, thanks for your PR! Could you replace the places where we use react query with your hooks?

Hey @YohanTz of course! I'll do it🚀 I think it can be ready no later than tomorrow afternoon, but I'll try to make it today

[jorgezerpa]

GN! @YohanTz hooks already implemented, here the files modified and which hook is used:

useCollection

• apps/arkmarket/src/app/collection/[collectionAddress]/components/collection-header.tsx
• apps/arkmarket/src/app/token/[contractAddress]/[tokenId]/components/token-actions-create-listing.tsx

useCollectionTraits

• apps/arkmarket/src/app/collection/[collectionAddress]/components/collection-items-filters-dialog.tsx

useTokenMarketData

• apps/arkmarket/src/app/token/[contractAddress]/[tokenId]/components/token-actions.tsx

useSearchCollection

• apps/arkmarket/src/components/global-search.tsx
• apps/arkmarket/src/components/mobile-global-search.tsx

useSystemStatus

• apps/arkmarket/src/components/system-status.tsx

useBalance

• Still not used

usePortfolioStats

• Still not used

usePrices

• Still not used

useCollectionActivity

• apps/arkmarket/src/app/collection/[collectionAddress]/components/collection-activity-data.tsx

useTokenActivity

• apps/arkmarket/src/app/token/[contractAddress]/[tokenId]/components/token-activity.tsx

useTokenOffers

• apps/arkmarket/src/app/token/[contractAddress]/[tokenId]/components/token-offers.tsx

useWalletActivity

• apps/arkmarket/src/app/wallet/[walletAddress]/components/portfolio-activity-data.tsx

useWalletCollections

• apps/arkmarket/src/app/wallet/[walletAddress]/components/portfolio-items-filters-content.tsx

useWalletOffers

• apps/arkmarket/src/app/wallet/[walletAddress]/components/portfolio-offers-data.tsx

useWalletTokens

• apps/arkmarket/src/app/wallet/[walletAddress]/components/portfolio.tsx

useCollectionTraitsSuspense

• apps/arkmarket/src/app/collection/[collectionAddress]/components/collection-items-filters-panel.tsx

useCollectionTokens

• apps/arkmarket/src/app/collection/[collectionAddress]/components/collection-items-data.tsx

[YohanTz]

Hey @jorgezerpa, thanks! I will try to review as quick as possible 🙏🏽

[gershon]

Hi @jorgezerpa, please rebase from main. I'll review and merge once it's resolved. Let me know if you need any more informations.

[jorgezerpa]

Hi @jorgezerpa, please rebase from main. I'll review and merge once it's resolved. Let me know if you need any more informations.

Hi @gershon I'll do it fast

[jorgezerpa]

@gershon Ready here🚀 I found just 2 conflicts on the next files:

• apps/arkmarket/src/app/collection/[collectionAddress]/components/collection-items-data.tsx:

add a new queryKey -> buyNow (Already added to the correspondant hook)

• apps/arkmarket/src/app/collection/[collectionAddress]/components/collection-items-filters-panel.tsx:

Just add an import and remove unused one