Add new precision filter to RPC component

[alfarok]

This PR addresses #3986 and replaces the hard-coded values in #3954.

This issue was caused by the use of the HumanReadable filter which was rounding the total values to zero due to a lack of precision in supporting smaller values. To address the issue we add a new Precise filter that still adequately converts the chain values to the appropriate denomination, but avoids the toFixed() invocation.

Before:

After:

[emresurmeli]

Nice - this works. Would it be possible to inject some react to actually get the answer for the multiplication?

[alfarok]

@emresurmeli yes it is totally possible but may be a little tricky. One approach would be to create a RPCMath component that wraps two child RPC components and receives an operator prop to apply, something like:

<RPCMath operator="*">
  <RPC id="inputA" visible=false />
  <RPC id="inputB" visible=false />
</RPCMath>

You would need to prevent the children from rendering anything, making sure only the result gets rendered. This is why I added the visible prop which could default to true but be overridden in scenarios like this.

If the team thinks something like this would be useful or we find several existing scenarios where this applications could replace hard-coded values we can outline it in a new task.

Until this is possible we can also revert the math example to display fixed values in order to display a result if you think it adds clarity.

[alfarok]

The more challenging aspect would be handling the events sequence. The component should run initially using the default values and run again when both RPC invocations in the child components are complete.

[alfarok]

Hey @emresurmeli, I restored the hard-coded example. I think this one should be ready for another look whenever you have a chance.

[DrW3RK]

Looks good to me! Thank you @alfarok