Account value shows wrong values on mobile

Account value on Wallet section of account page seems to be correct when viewed on desktop on any browser, even when switched to mobile view, but on actual phone the value is "random", especially for accounts with notable value. The value is not actually random - it is the same no matter what browser is used (checked on Samsung Internet, Chrome and Firefox on the same phone, also on DeX), but can be different on different phones, still wrong though.

Example: at the moment https://hivescan.info/@gtg? shows 867,126.54$ value, but on three different phones it showed 250$ (two different Samsungs and one Oppo). Switching to "PC version" on phone does not fix the problem.

hey @ABW , we tried testing this out on our end and could not reproduce, so additional details would be helpful.

Could you share a screenshot of what you are seeing on your phone as well as your phone locale settings?

The screenshots were made on DeX, because that was the fastest way for me, but the look is exactly the same on phone directly.

Language settings are just all defaults Polish set. I suspect all other phones that I've checked that problem have the same language settings.

My gut feeling tells me that once #416 (closed) is fixed, the above problem will also disappear.

Thanks @ABW , yea this looks like some formatting causing calculation issues. We will look into it.

added To Do label

mentioned in issue #423 (closed)

Okay, other people start signaling this issue, so I took a look. There is a lot of things to settle over there.

There are hooks to collect, format and return converted data of wallets and similar entities, like: useConvertedAccountDetails.tsx. The only place we have the raw values is at the very beginning there. Later all the data is prepared for future display. Using it according to its purpose should make all the necessary data ready to display in AccountBalanceCard.

But as I see you decided to calculate the sum of dollars value in component. It's a very bad UI designing practice to handle data processing on component level, especially when you have dedicated place to do this. And deformatting it there, calculating sum, and formatting again, all on the end level, is even worse. And as we see it produces a lot of error with display in different systems (mobiles and Windows).

Instead of trying to fix the end formatting in useEffect with grabNumericValue or other methods, sum all the values on the top hook level, and format it there. Expanding hook to return one more numeric value is nothing big, and it will be much safer.

1. It will use only Wax's method and default formatters.
2. The calculations will be done outside of component.
3. You don't need to change any string to numbers, just use existing structure as pattern and get the sum there.

All of them all in the same asset (HBD), so just add numeric value and format the result. It should work without other problems you have.

@jlachor wait, wasn't there some issue earlier related that some calculations should be done locally and don't use Wax? I can't remember exactly what was it, but maybe it's related

marked this issue as related to #423 (closed)

added bug label

assigned to @delrifai

removed To Do label

added Doing label

mentioned in commit 693f764f

mentioned in commit 32baf03d

mentioned in commit 552f3621

mentioned in merge request !529 (merged)

removed Doing label

assigned to @mcfarhat and unassigned @delrifai

added Review label

mentioned in commit 7d69f6e6

mentioned in commit 189b4b16

mentioned in commit 95b1554b

mentioned in issue #416 (closed)

marked this issue as related to #416 (closed)

mentioned in commit 45c74f80

mentioned in commit db9b35ec

mentioned in commit 763aee67

closed