Apps: Allow paste + enter to select pasted address

Created on 28 Oct 2019  ยท  11Comments  ยท  Source: polkadot-js/apps

Currently you need to select via mouse

-size-xs @react-components

All 11 comments

Can you describe the steps to produce this scenario?

So what happens -

  • the user pastes an address into eg. Recipient for transfer
  • the input box adds the address, but you need to physically select it from the drop down (it gets added as a โ€œrecentโ€)

Ideally what should happen is that the address is pasted and just automatically either selected or when pressing enter, it is selected.

Ah! Now I know what you mean. Thank you.
Let me try fixing this tomorrow.

It seems that when a user pastes an address and hit enter, state updates with the pasted address. Then somehow another state change happens with the old address. Thus it looks like hitting enter doesn't update state. The same thing happens when a user hits arrow keys.

Commenting out this line fixes the issues but I'm not confident to remove the useEffect hook.

https://github.com/polkadot-js/apps/blob/master/packages/react-components/src/Dropdown.tsx#L65

Will take a peek as well, and see what the negatives could be.

Thanks you very much for the investigation and investment of time.

Not sure about the above change at all - so on any changes (real changes), it should alert the parent. It is exceptionally weird that that "makes it work", sadly I think we are going to chase breakages elsewhere then where forms rely on this behavior :(

The good news is that it probably brings us one step closer understanding, and that is good.

I don't fully understand why the Dropdown component needs to hold any state in the first place. Usually, all form states should be managed by a form level component not filed level component.

So the InputAddress does a couple of things that you certainly don't want to delegate to all upper-layer forms -

  • it keeps tracks of the last used per type, so for instance if you selected a "from account", the next time the component renders that is the default
  • it handles stuff like recently users lists for addresses, i.e. when a new address is entered, it gets added to "recents"

So with stuff likes "enter a balance", yes, the upper-layer should 100% take care of it.

I feel like #1930 will give us a same result that you described above. Let me know if I missed some details.

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue if you think you have a related problem or query.

Was this page helpful?
0 / 5 - 0 ratings