Git Product home page Git Product logo

neon-faucet-ui's Introduction

neon-faucet-ui's People

Contributors

zapolnoch avatar webkieth avatar melisovm avatar oable avatar eubash avatar vodolaz avatar

Watchers

Rozhkov Dmitrii avatar  avatar Andrey Voloshin avatar  avatar

neon-faucet-ui's Issues

uniswap performance test. Description of the steps

Need to implement these steps:

  • step deploy: erc20, count(erc20) == cout(transactions)
  • step create_pair:
tokenA.approve(router2)
tokenB.approve(router2)
router2.addliquidity(tokenA, tokenB, sum, to)
		- cretePair
		- tokenA.call(transferFrom, router2, pair, sum)
		- tokenB.call(transferFrom, router2, pair, sum)
		- pair.mint(to)
  • step swap: pair.swap(sum1, sum2, to)

Create button to import tokens into wallet from Neon-Faucet

Currently, users have to manually import devnet/testnet ERC20 tokens to theirs metamask wallet. This approach is quite tricky: user have to find out required token address, copy it, setup metamask an so on.
It is suggested to implement additional UI element (button or token-list table) on neonfaucet which will automatically import selected token into metamask.

Add ERC20 tokens

Add support for ERC20 tokens airdrop:

  • Add drop-down list with available tokens.
  • Use request_erc20_list method (see neonlabsorg/neon-faucet#11) to retrieve addresses of tokens available on faucet.
  • Use https://github.com/neonlabsorg/token-list/blob/main/tokenlist.json file to determine token names and token symbols to construct drop-down list: filter out tokens which have supported 'chainId' (245022926 for devnet) and 'address'
  • Add NEON token by default, use old logic and request to drop NEON tokens.
  • Client should select token from list before pressing Get Tokens button.
  • Use faucet method request_erc20 to airdrop selected ERC20 token:
{ 'wallet': <metamask_addr>, 'token_addr': <address_of_selected_token>, 'amount': <amount_selected_by_user> }

Neonswap is not able to display the full list of available tokens

STR:
Click on the 'Select a token' link, a drop-down with token names appears.
Note: it's only possible until MetaMask is connected to our network

Expected result:
I'm able to navigate the whole list, from the top to the bottom and in the backward direction.

Actual result
I scroll through the dropping list, token names are literally jumping and disappearing on a small increase of scroll speed.
See the video attached

24-list-of-token-names.mov

.

UI problems

  1. "TEST AIRDROP" button must be in center and another color for disabled state
    image

  2. We need add a notice about limits, because if i enter more 1000 we disable button test airdrop only.

  3. For ERC20 limit - 100 tokens but we don't handle this

  4. Bad UX on loading. Loading icon is shown in top of page and all content scroll down. We need to use loader in button after click
    image

  5. If i try receive twice neon tokens (without wait 1 minute) I receive error: "Request seems to be blocked by CORS policy. Response isn't avaliable" and response 429 code - we need to change error message

  6. Time limit doesn't work for erc20

  7. Add disclaimer about test tokens

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.