Code Monkey home page Code Monkey logo

Comments (8)

youfoundron avatar youfoundron commented on September 23, 2024 2

These seems like a fun one. New to web3 so I'll be getting some education. 🎓

from icostats.

jamesyoung avatar jamesyoung commented on September 23, 2024 1

FYI web3/web3.js#905

from icostats.

youfoundron avatar youfoundron commented on September 23, 2024

Seems like our little exchange form is submitting on successful wallet address validation which is fired in a debounced onchange handler.

Since there is no submit button, the web3 enabled user will be stuck experiencing one of two scenarios:

  1. A user's wallet address is prepopulated on componentWillMount, but they need to trigger an onchange for it to validate (triggering submission).
  2. A user's wallet address is preopulated and immediately validated on componentWillMount, triggering submit before they have the chance to enter an amount of ETH to send.

To address this we can:

  1. Add a submit button and force the user to manually submit.
  2. Fire validation for every onblur of either input, and trigger submit if both pass validation.
  3. Do something else?

I'm personally prone to option 2, but am open to any suggestions.

from icostats.

coopermaruyama avatar coopermaruyama commented on September 23, 2024

Hmmmm... Honestly if they don't have to type or copy-paste then I think both of those interactions are kind of awkward. My vote is that we stick to the conventions we're already used to seeing on web3 sites - the input box becomes a dropdown list.

If the user has web3, we should also be triggering the transaction for them to send to the deposit address. Basically right now, people have to type in ETH address, then copy the deposit address, then go open their wallet and manually enter the transaction.

For web3 users, we have all the APIs available so that they can simply:

  1. choose from their saved addresses on a dropdown.
  2. Transaction is auto-generated in metamask (or similar) and they just click 'Accept' and sign the transaction.

Thoughts? And yeah, this should be a really fun one!

from icostats.

youfoundron avatar youfoundron commented on September 23, 2024

@cooper care to show me an example of this user flow in the wild? Thanks! 😁

from icostats.

coopermaruyama avatar coopermaruyama commented on September 23, 2024

Yeah, examples off the top of my head are etheroll.com and etherdelta.github.io

Etherdelta has a dropdown to choose an address. Etheroll just chooses the first one for you.

Also, on Etheroll, when you place a bet, its creating an ETH transaction pre-filled for you with the right data, and then asks you to sign it via web3. we could do the same.

from icostats.

youfoundron avatar youfoundron commented on September 23, 2024

Looking at these two sites I'm thinking we should always do dropdown.

My reasoning being that selecting an address will act as the submit action, triggering address validation and transaction prefilling. Seem good?

from icostats.

coopermaruyama avatar coopermaruyama commented on September 23, 2024

Yeah, exactly what I had in mind.

from icostats.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.