Workers Auto Approve
Implement UI status and animation for a simulated tx in React
TypeScript, HTML, CSS, react, web3
This bounty is reserved for @owonwo
This task is part of a larger project to create an interactive web demo / playground for users to learn about zero-knowledge (ZK) assets and gain intuition about them by directly transacting with the contracts on-chain.
There are three kinds of transactions (tx's) that a user of ZK Transfer will need to know about, and that we should implement with this task.
* confidential sending of tokens, when a user clicks the "send" button in the demo
* confidential receiving of tokens, when a user is the recipient of someone else click their "send" button
* minting, which happens automatically when a page refreshes.
Minting is already part of the demo, but we'll have to fake transactions for confidential sending and receiving, so that we can display them. For this task, you can use a fixed fake user, "Vitalik Buterin" as both the recipient and sender of our fake tx's.
This task is to implement the design created in #57
the third column for transaction statuses. Each type of tx (mint, send, receive) could succeed or fail, so there are 6 possible displays. There is also a "transaction in progress" animation which should display while waiting for a tx to be mined, and to determine it's success / failure outcome.
The history of tx's only need to be kept while the page is loaded. If the page is refreshed, the third column can be erased and re-populated from scratch.
Two ZK tokens can be deployed for easier testing. Sending/receiving from one could always result in failure, and sending/receiving from the the other one could always result in success.
* Confidential sending: this occurs after the user presses the send button next to a token, and you can display the animation for a fixed amount of time (say 15 seconds) before converting it to a mined tx.
* Confidential receiving: this can happen randomly in the background
* Minting: this occurs after every page refresh.
## Task Description and Examples
A static demo, created with `react-scripts`, is currently running on:
In this task, you'll modify the source code in
## How to Work on This Task
Working on this task requires the following steps
* Introduce yourself in our [gitter channel](https://gitter.im/invisible-college/democracy)! You'll be working with me (@cryptogoth ) and @owonwo and give an update every day or two letting us know what you're thinking, what you're curious about, and asking questions if you're stuck.
* Install the [Mullvad VPN client](mullvad.net) for your OS and ask us in Gitter for the account number.
* Fork this repo, and set up your local environment with your fork using these instructions https://github.com/invisible-college/democracy#get-the-source-code-to-experiment-and-run-tests
* go through the minting example in issue #45 instructions, both web and CLI, and learn about ImmutableJS data structures which we use in this project
* test your changes locally, mint yourself some notes, transfer them to the Rinkeby admin user, and verify them at https://aztec-web.netlify.com
* Create a pull-request for this issue, and submit the URL in Gitcoin.
* I'll create a code review in your PR thread to give feedback and collaborate. When we're both happy with the result, I'll merge / close it.
### Deploying to Netlify
When you create your pull request of your fork back to the base repo, Netlify will include a preview deploy.
Looking forward to working and learning with you on this project ⛰
Setup your profile
Tell us a little about you:
No results found for
Type to search skills..
Required [[totalcharacter]] / 240
Are you currently looking for work?
[[ option.string ]]
Setup your profile
Our tools are based on the principles of earn (💰), learn (📖), and meet (💬).
Select the ones you are interested in. You can change it later in your settings.
I'm also an organization manager looking for a great community.
Enable your organization profile
Gitcoin products can help grow community around your brand. Create your tribe, events, and incentivize your community with bounties. Announce new and upcoming events using townsquare. Find top-quality hackers and fund them to work with you on a grant.
These are the organizations you own. If you don't see your organization here please be sure that information is public on your GitHub profile. Gitcoin will sync this information for you.
Select the products you are interested in:
Out of the box you will receive Tribes Lite for your organization. Please provide us with a contact email: