feat: Memoise token balance controler hook

[NicolasMassart]

Development & PR Process

1. Follow MetaMask Mobile Coding Standards
2. Add release-xx label to identify the PR slated for a upcoming release (will be used in release discussion)
3. Add needs-dev-review label when work is completed
4. Add needs-qa label when dev review is completed
5. Add QA Passed label when QA has signed off

Description

Create a hook that memoises the state request for token balances from TokenBalancesController.
This hook uses a deep object equality check to replace the default shallow comparison of useSelector.
Shallow comparison is not fitting the need for the complex data type we use here and it ends in some unwanted re-rendering or render misses due to data not being properly evaluated.

1. What is the reason for the change?
Need for performance improvement that prevents re-rendering when data hasn't deeply changed.

2. What is the improvement/solution?

• Use deep data comparison with isEqual form Lodash lib on useSelector dependencies to trigger a new state retrieval.
• Replace the useSelector call with this new hook in app/components/UI/Tokens/index.tsx
• Implement the hook in order to start using the {data,loading,retry,error} return object pattern. Currently only {data} is implemented as the others require some deep controller changes out of the scope of this PR. This is a first step toward generalised controller hooks.
• {data,loading,retry,error} return value type interface created with optional loading, retry and error as they are not yet implemented on controlers. But leads the way for future consistent use.
• Implement tests that ensure the data is only returned when changed to prevent triggering of unnecessary render.

Issue

fixes https://github.com/MetaMask/mobile-planning/issues/808

QA test builds

iOS and Android builds available at https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/d0e62919-1ca8-4518-887c-0cf96b2afea3

Recording

Simulator.Screen.Recording.-.iPhone.12.Pro.-.2023-06-23.at.17.08.56.mov

Checklist

• There is a related GitHub issue
• Tests are included if applicable
• Any added code is fully documented

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[Cal-L]

left some comments

[Cal-L]

LGTM

[cortisiko]

hey @NicolasMassart ! Great work on getting this done. Can you add recordings of what you tested?

[NicolasMassart]

@cortisiko I added recording and a link to Bitrise QA builds

[cortisiko]

This is QA passed! Feel free to merge whenever @NicolasMassart

[sonarcloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

100.0% Coverage
0.0% Duplication