tdd-solidity / ethdrop Goto Github PK

It would be awesome if we had automated builds and test runs on pushes and pull requests!

Preferably we could hook into things that are free for over source (such as github actions, circle ci, or travis ci...)

the initial script just needs to run "truffle test" in the root directory and "npm test" in the client directory. 👍

The footer can be tricky, talk with Jim on this one.

We want a rectangle that sits at the bottom of the page of the content is smaller than the browser viewport but sits at the bottom of the page content if the content is longer than the viewport height...

In the footer we can just have some centered text that says, "Made with ❤️ by EthbuildersNYC devs."

Then aligned right in the footer I think it would be cool to have 3 (5?) image links:

• a slack icon linking to our slack group
• a discord icon linking to our discord group
• a meetup icon linking to our meetup page
• a twitter icon linking to our twitter page
• a youtube icon linking to our youtube channel

I added a blank circleci script file, but it doesn't actually do anything yet...

since we have a "monorepo" (both the smart contracts and javascript in one repo) I guess we just run the "npm test" command for both here!

Bonus: start looking into how to handle deployments from ci pipelines...

In the recipient's table the "Eligible" column has just the word "true" or "false"

I think it would be fun if these had icons (which maybe display the full word in a tooltip on hover)

• When a user is eligible and registered: icon: ✅ , tooltip: "Registered"

• When a user is eligible but not yet registered: icon: 🎟 , tooltip: "Eligible, Not Registered"

• User has winnings waiting to be claimed: 💰 , tooltip: "Winnings Not Claimed"

• User has claimed his or her winnings: 😊 , tooltip: "Winnings Claimed!"

Possibly also change the column header "Eligible" to something else, maybe "Status"?

for example, when I'm on rinkeby and go the home page: https://tdd-solidity.github.io/EthDrop/, and then navigate to a group page, I can see things.

When I refresh the page however, or paste the url in the address bar, I get a github 404 page... 🤔

These are arguably the most important-to-be-secured-correctly functions in the whole smart contract!

Have tests that check that functions like "setCOO", "setCFO" work properly and also tests to make sure it reverts when called by not the ceo

Somehow use a multisig wallet for the CEO / doing withdraws from the dev team account?

It's so nice to explicit see the json shape of input and output data being passed around! 🤓

Things to do for this:

• change .js files to .ts

• update package.json to build the ts

• creates files with ts interfaces for things

• add return types to all functions

• add return types for all function arguments

NOTE: this could be actually a lot of work to fully complete... feel free to split this into 2 or more PRs of you feel like it. 👍

With gh-pages, the site is technically not hosted at the root '/' but rather at the 'EthDrop' route after the base domain...

The issue currently is that "Groups" button goes to the 404 page...

notice that the url it jumps to is "tdd-solidity.github.io" and not the one it should be, "https://tdd-solidity.github.io/EthDrop/"

Fixing this bug should be as simple as having the button link to "/EthDrop/" rather than "/"

Hmm on rinkeby I add myself as an admin, but then it still says "isAdmin" false in the console and doesn't show the admin forms for adding a sponsor and eligible recipients... 🤔

It's nice to be able to just run "npm test" or "npm test:watch" to run the tests and have the project figure out the details.

For this issue, let's add these commands into the package.json file in the project root.

technical notes: probably want to use nodemon for the watch mode aspect...

Bell gave an awesome talk on security. This will probably be an ongoing thing that we need to do rather than a real ticket to be closed, but we definitely should go through some common / high impact vulnerabilities with respect to this dApp!

So much commented out code that we don't need anymore... let's clean it up!

Look into breaking the two massive page components into smaller components!

Similar to how we have a human readable name for "recipients", it would be awesome to have a human readable name for the admins in the "add admin" form!

Experiment with loading spinners, and decide on a good one to use after clicking buttons.

https://tailwind-elements.com/docs/standard/components/spinners/

Also, should the spinner show inside of the button, above the button, or below the button? 🤔

Only rinkeby this is slllllllooooooooowwwwwwwww, and the user gets no feedback at all that stuff is happening.

It would be awesome to have some kind of loading spinner (and disable the button) here until there is a response

Because of the way github pages works, we have to deploy at the /EthDrop route.

However, our app default loads up localhost:3000

Let's change this so that whenever users go to the route localhost:3000/ it redirects automatically to localhost:3000/EthDrop

In the USA, you are allowed to gift up to $15k in crypto per year without it being a taxable event.

Source: https://www.google.com/url?sa=t&source=web&rct=j&url=https://www.coinbase.com/learn/tips-and-tutorials/crypto-and-bitcoin-taxes-US&ved=2ahUKEwimnvLI5qfyAhXmQzABHdxID6UQFnoECAQQBQ&usg=AOvVaw1Z_0n4H_dinBwZDYiTjR1j

I think it's safe to assume each address can be considered a "person" (need to get some legal confirmation on this)

So, we need to keep track of how much $USD worth of crypto has been giving from each sender address to each recipient address.

When recipient tries to claim winnings, return a meaningful error message to the user that they have reached the yearly 15k maximum (ain't nobody wants to deal with legal tax headaches, cost basis calcs, etc...).

An error could potentially be shown when the user registers, but this is tricky because the total number of registered recipients in the event, and thus the payout per recipient, is not necessarily known at the time the users registers...

What can we do to make things look nicer on the page?

open to any suggestions on design that will make things look prettier, from spacing and padding to sparkle explosions!

This is not used in our dApp!

When I go to "https://tdd-solidity.github.io/EthDrop/foo" it sends me to a github 404 page rather than the EthDrop 404 page that I was expecting... 🤔

Currently it just shows an alert that says "this button does nothing yet..." 😅

(to be used for cool things like the crypto giveaway wheel)

So when I coded out the frontend (and backend) I didn't realize that EVERY call uses up some infura bandwidth, and I ended up hitting the 100k free tier maximum from just myself hitting rinkeby testnet... 😅

We can definitely be smarter about having just a single "initial data" call to our smart contract that gives everything for a page (or perhaps "everything this user needs to use the app")

Other things to consider- use "localstorage" to save the state across browser refreshes

                                      - preserve the state as users move between pages rather than making a new call for data each time (possibly integrate redux for this?)

There should be a page where it just explains how everything works...

I'm thinking maybe in white (or blue) navbar area here we could have a button with just a question mark as the text on it.

This would go to a new component, the "HelpPage".

At first this can just be a basic component that renders something like "this is the help page!", and we'll fill it out more later.

I implemented this for eligible recipients- when creating them you add a human readable name and display it in the table... I think this would be nice to have for the list of admins too!

Current admin form (only takes an address)

Compare this to the nice eligible recipient form with two text inputs:

Currently, the user has no feedback that stuff is happening...

it would be nice to have some kind of loading spinner and disable the "Add Admin" button until the call returns with either a success or failure.

Do we want to use something like catptcha or brightID: https://dev.brightid.org/ ?

Currently, when you try to go to EthDrop on some network other than rinkeby it flashes some jarring popups and then seems like it kind of loads and works.

However, in the console you can see that it can't find the contract.

Notice though if you go to it on mainnet it does actually handle that and show a nice error (although there is still an error in the console...)

Please take out the alerts too...

You can see the 404 page by visiting: https://tdd-solidity.github.io./

We don't need anything that crazy here, but at least vertically and horizontally centering the text on the page would make it a bit nice.

Possibly even add some funny image like this one!

When hovering over a shortened address in the browser it shows the fully address, but it is positioned pretty wonkily...

Ideally the tooltip should be above the text, and horizontally centered.

Also, red it kind of a "warning" or "danger" text, to me this doesn't really need to be red. maybe a blue or black would look better?