Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

react component to visualize gas price vs confirmation time #34

Open
owocki opened this issue Jan 3, 2018 · 21 comments

Comments

Projects
None yet
6 participants
@owocki
Copy link
Member

commented Jan 3, 2018

take the graph at https://twitter.com/owocki/status/948679913883680768 and mock it up as a react component.

graph should take information from https://github.com/ethgasstation/gasstation-express-oracle (and only information from this service) to build the graph

suggestions

  1. switch the axises
  2. and maybe do a log scale for time

deliver this as a react component

@danfinlay

This comment has been minimized.

Copy link

commented Jan 4, 2018

Simplifying Bonus: Don't integrate the data-source into the component, allow it to be passed its data, so the parent can generate the equivalent data however it prefers to. (I guess that's just a graph component? Maybe make two components, one that includes a connection to a specific data source?)

@gitcoinbot

This comment has been minimized.

Copy link
Member

commented Jan 4, 2018

This issue now has a funding of 0.09 ETH (85.17 USD) attached to it.

  • If you would like to work on this issue you can claim it here.
  • If you've completed this issue and want to claim the bounty you can do so here
  • Questions? Get help on the Gitcoin Slack
  • $13764.0 more Funded OSS Work Available at: https://gitcoin.co/explorer
@owocki

This comment has been minimized.

Copy link
Member Author

commented Jan 4, 2018

two things

  1. checkout https://gitcoin.co/gas for a live version of this chart.
  2. ill be 🎿 skiing in utah for the next several days so will be radio silent. @danfinlay since the react code will (maybe) eventually live in metamask... youre welcome to field any questions from bounty hunters on my behalf :)
@gitcoinbot

This comment has been minimized.

Copy link
Member

commented Jan 4, 2018

The funding of 0.09 ETH (89.69 USD) attached has been claimed by @eswarasai.

@eswarasai, please leave a comment to let the funder (@owocki) and the other parties involved your implementation plan. If you don't leave a comment, the funder may expire your claim at their discretion.

@eswarasai

This comment has been minimized.

Copy link
Contributor

commented Jan 6, 2018

@owocki @danfinlay : Can someone help me out in setting up this repo locally as a service?
-- https://github.com/ethgasstation/gasstation-express-oracle

@eswarasai

This comment has been minimized.

Copy link
Contributor

commented Jan 6, 2018

@owocki @danfinlay : I need your suggestions regarding the implementation and also clarification on few doubts. Please find them below :

-- I can see from the requirements that we'd need a React Component which can display a LineChart. Instead of integrating with D3, I'd suggest using Recharts library for displaying the LineChart with the datasource we'd need. I'm in favour of Recharts compared to D3 majorly because of the UI. Since we're using Material UI framework, I'd prefer the Charts to also be inline with the similar styles

-- For switching the axises, I'm assuming this would be a provision for the User to the X-axis and Y-axis.

-- Log scale for time : Can I get some details on how I need to achieve this?

Let me know your thoughts on this, so that I can get started with the implementation. Thanks.

@PixelantDesign

This comment has been minimized.

Copy link

commented Jan 6, 2018

@eswarasai I like the UI style of Recharts as well! It does look like it is a library on top of D3. From your experience, how easy is it to customize the styles?

@eswarasai

This comment has been minimized.

Copy link
Contributor

commented Jan 6, 2018

@PixelantDesign : I haven't worked on Recharts library earlier but from my understanding, customising the styles of the chart should be pretty much easier

@owocki

This comment has been minimized.

Copy link
Member Author

commented Jan 8, 2018

@owocki @danfinlay : Can someone help me out in setting up this repo locally as a service?
-- https://github.com/ethgasstation/gasstation-express-oracle

i dont have any experience with this repo... and i dont think @danfinlay does either unfortunately... you might try commenting to ethgasstation on twitter or on their gitter/github if you need help.

-- I can see from the requirements that we'd need a React Component which can display a LineChart. Instead of integrating with D3, I'd suggest using Recharts library for displaying the LineChart with the datasource we'd need. I'm in favour of Recharts compared to D3 majorly because of the UI. Since we're using Material UI framework, I'd prefer the Charts to also be inline with the similar styles

this makes sense to me. @danfinlay how about you?

-- For switching the axises, I'm assuming this would be a provision for the User to the X-axis and Y-axis.

it would just switch the x axis and the y axis (so time would be the y axis, and the gas price would be the x axis)

-- Log scale for time : Can I get some details on how I need to achieve this?

i'm not sure what you mean by 'more details'.. the scale just needs to be log(n) instead of n.

@owocki owocki referenced this issue Jan 8, 2018

Closed

Add a readme #1

@eswarasai

This comment has been minimized.

Copy link
Contributor

commented Jan 11, 2018

@owocki @danfinlay -- So I was trying to figure out on how to get the service https://github.com/ethgasstation/gasstation-express-oracle running, atleast from my understanding of the code.

Looks like we need to have an Ethereum Full Node running which will have all the transactions synced (>50 GB). The service then fetches the last 100 transactions from the synced data and then returns the chart data.

The catch here is that we need to have a dedicated server with dedicated amount of space which will be continuously syncing the blocks. And also the initial sync will also take huge amount of time (not quite sure how much as my local is still syncing for the past 12 hours).

I'll go ahead and start the work with developing the React component. Let me know if you have any suggestions related to the data service. Thanks.

@owocki

This comment has been minimized.

Copy link
Member Author

commented Jan 11, 2018

i recommend using https://infura.io/ for the full node

@eswarasai

This comment has been minimized.

Copy link
Contributor

commented Jan 12, 2018

@owocki -- Thanks for the suggestion. This is exactly what I was looking for :)

@eswarasai

This comment has been minimized.

Copy link
Contributor

commented Jan 15, 2018

@owocki -- So I was trying out the service but unfortunately the code doesn't populate the confirmation times as well. Instead, I've found an API endpoint which internally uses the above service but with confirmation times as well -- https://ethgasstation.info/json/predictTable.json. I've figured we can use this in gitcoinco/web for sync_gas_prices as well. Let me know if this is fine to proceed with. Thanks.

@owocki

This comment has been minimized.

Copy link
Member Author

commented Jan 15, 2018

thanks for the update @eswarasai ..

@danfinlay this will be used in metamask moreso than gitcoin.. so ibroadly defer to you

@danfinlay

This comment has been minimized.

Copy link

commented Jan 16, 2018

this makes sense to me. @danfinlay how about you?

I think ReCharts would be fine.

Ideally, assume your component can be passed the last X blocks of transaction data, and build a chart from it.

That prediction table would be a good time estimate data source, we'd probably just ask Infura to mirror it via CDN to tolerate our load.

@vs77bb

This comment has been minimized.

Copy link
Contributor

commented Feb 14, 2018

@eswarasai Where are we on this one? cc @owocki @PixelantDesign

@eswarasai

This comment has been minimized.

Copy link
Contributor

commented Feb 15, 2018

@vs77bb -- The development is still ongoing as there have been design modifications. You can find the relevant conversation here #50

@gitcoinco gitcoinco deleted a comment from gitcoinbot Mar 13, 2018

@owocki

This comment has been minimized.

Copy link
Member Author

commented Mar 13, 2018

hi all. i just killed the bounty for this issue for some gitcoin-internal migration reasons but wanted to let you know that, regardless of the issue description on gitcoin.co.. im good to pay out this bounty when the time is right. just @ me back then!

@danfinlay

This comment has been minimized.

Copy link

commented Apr 4, 2018

@eswarasai I really appreciate the work you did here, and I don't blame you for slowing down on this.

We want to get the styles right, so we will definitely have to make some changes before we integrate this, but I want you to feel fairly paid. The bounty was for 0.5 eth. What do you think a fair payment would be? Since the price has gone down a bit, I almost think it might be too low even if paid out now.

@eswarasai

This comment has been minimized.

Copy link
Contributor

commented Apr 9, 2018

@danfinlay -- Sorry for the delay in getting back to you and also not being able to complete the task at hand. I'm afraid I might not be able to take a shot at this until next week. But I'm positive that I can try to get things match the design spec as close as possible.

As per the payment, I've already got 0.09 ETH from @owocki for this. So, I'd say I'll try to close this first and then worry about the remaining amount. Let me know if there's already someone working out on this and maybe I can help in anyway. Thanks :)

@danfinlay

This comment has been minimized.

Copy link

commented Apr 17, 2018

It's fine @eswarasai, we appreciate all the hard work.

We haven't picked this up yet, but I just wanted to make sure we were squared away so that someone could pick this up when we're ready.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.