Improve Nabla swap design

[Sharqiewicz]

What:

• Remove "Your" from "Your Balance" from the UI inputs fields
• Change to "Balance" in the destination input field
• From "Your Balance: 22 X0", remove the token name i.e XO

✅ Remove NumberInput and replace any use of it with NumericInput
✅ Change texts

Closes: #473

[netlify]

✅ Deploy Preview for rococo-souffle-a625f5 ready!

Name	Link
🔨 Latest commit	51e6a75
🔍 Latest deploy log	https://app.netlify.com/sites/rococo-souffle-a625f5/deploys/665e22923d13fd0009b303a6
😎 Deploy Preview	https://deploy-preview-483--rococo-souffle-a625f5.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[ebma]

LGTM, just one comment

[prayagd]

LGTM
Not related by strange thing i observed was after opening the deploy preview, i could not see any button on the swap ui. see screenshot. It appeared after i selected the tokens from the dropdown

[Sharqiewicz]

@ebma I applied the changes you mentioned

[ebma]

Nice thanks 👍 something is off though. I noticed that on Foucoco, no matter which asset I'm using in the swap form, it's limited to 12 decimals.

If you check the foucoco squid with the following query, you'll see that the mock tokens have varying decimals though and not always just 12.

query MyQuery {
  nablaTokens {
    decimals
    name
    id
    symbol
  }
}

Did you log and check the values that maxBalance?.decimals gets? Maybe it's always undefined for some reason.

[Sharqiewicz]

Nice thanks 👍 something is off though. I noticed that on Foucoco, no matter which asset I'm using in the swap form, it's limited to 12 decimals.

If you check the foucoco squid with the following query, you'll see that the mock tokens have varying decimals though and not always just 12.

query MyQuery {
  nablaTokens {
    decimals
    name
    id
    symbol
  }
}

Did you log and check the values that maxBalance?.decimals gets? Maybe it's always undefined for some reason.

@ebma It works correctly for me. I receive decimals: 18 for BRL and in the input I can type max of 18 decimals. For AMPE - 12 decimals, EURC - 15 decimals, USDC - 7 decimals and USDT - 10 decimals

[ebma]

Okay, I notice the difference now. The decimals are only queried when an account is connected. If no wallet account is connected, it will not check for the decimals. It then works as expected. Since the user eventually needs to connect to an account to be able to submit anything, the validation will trigger and it works fine.

[ebma]

Looks good to me then