Add helper functions to easily display customized messages for a contract transaction

[DoubleOTheven]

Feature Request

Define a good design pattern to handle status messages then create helper functions to make it easy.

const tx = useContractTx(...) sets a variable that can use a signAndSend() functions to initiate a wallet signature and contract transaction like this tx.signAndSend(...args).

We can then track the status with tx.status, which will change from 'NONE', to 'PENDING_SIGNATURE', to 'IN_BLOCK', etc. It is very common to set a button to disabled and change the title if a transaction status is not 'NONE' or 'FINALIZED'.

Suggestion

We should create a helper function that returns a formatted string. e.g.

<button
  onClick={flipTx.signAndSend}
  disabled={shouldDisable(flipTx)}                 
>
  {toStatusName(fipTx)}
</button>

where toStatusName(flipTx) will return "Please sign the transaction to flip!"` for 'PENDING_SIGNATURE', then "Flipping..." when the status is 'IN_BLOCK', etc. Messages should be customizable and allow for 18n.

Do we provide defaults? Can a user define generic ones such as "Pending signature" for 'PENDING_SIGNATURE' status?

Motivation

Simplify a very common use case.

Use Cases

Building a UI for any contract transaction.