[Explorer] Adds Sender / Recipients / Amount data to Pay transaction type

[apburnie]

This PR adds a list of recipients and amounts sent for the Pay Transaction Type. The wonky display when examining a single sender and recipient is also fixed

One sender many recipients

Before

After

On Galaxy Fold

One sender one recipient

Before

After

On Galaxy Fold

[mystie711]

Looking great @Andrew47.
For mobile, may i request we add the same amount of minimum padding as what we have on left so there is more breathing room for the text to wrap?

[Jordan-Mysten]

Please address the other comments.

[apburnie]

Please address the other comments.

@Jordan-Mysten, Switching to useQuery will take some time. Could you please explain the benefits of switching to useQuery so that I am using this new technology appropriately?

[Jordan-Mysten]

@Andrew47 I don't think it should take more than 15-30 minutes to update this code to use it. We're moving all data fetching to it, it's an epic in Jira that we'll continually add migration tasks for. If you're interested in learning more I suggest reading the docs: https://tanstack.com/query/v4

[apburnie]

@Andrew47 I don't think it should take more than 15-30 minutes to update this code to use it. We're moving all data fetching to it, it's an epic in Jira that we'll continually add migration tasks for. If you're interested in learning more I suggest reading the docs: https://tanstack.com/query/v4

I like the idea of data caching. I've switched the useEffect for useQuery and used the 'Heading' components.

[github-actions]

💳 Wallet Extension has been built, you can download the packaged extension here: https://github.com/MystenLabs/sui/actions/runs/3378176878#artifacts