colm3na / polkastats-v3

PolkaStats V3 frontend

PolkaStats v3

Polkadot network statistics

This repository is ARCHIVED, for latest version go to https://github.com/polkastats/polkastats

Build frontend

# Clone this repo
$ git clone https://github.com/Colm3na/polkastats-v3.git
$ cd polkastats-v3

# Install dependencies
$ npm install

# Serve with hot reload at localhost:3000
$ npm run dev

# Build for production
$ npm run build

# generate static project
$ npm run generate

Build backend

See: https://github.com/Colm3na/polkastats-backend-v3

polkastats-v3's Issues

Add i18n for translations

Is your feature request related to a problem? Please describe.
Would be nice to have the possibility to translate PolkaStats to another languages.

Describe the solution you'd like
We can use nuxt-i18n to accomplish it.

Describe alternatives you've considered

Additional context

BAT link text typo in Footer

Describe the bug
Typo in the footer "Built with Basic Atttention Token"

To Reproduce
Should show up in footer on every page.

Expected behavior
"Built with Basic Attention Token"

Screenshots

Additional context

Fix Produced block chart

After changes in the backend, we need to change the data source for Produced Blocks charts.

Misc UX

Is your feature request related to a problem? Please describe.

• Complete team info
• Filter out system tx / events in dashboard
• Include parent display in single account page
• Include number of tx in rich accounts

Validator data not loading (Kusama)

Describe the bug
No validator data loading for Kusama

To Reproduce

1. Go to: https://kusama.polkastats.io
2. If you click on an author, it links you for example to: https://kusama.polkastats.io/validator?accountId=DahPwrmRmSEjNCqEehzuGddTmvFnk9q7g6wo4saRqBQ18RK

Expected behavior
Should load data

Screenshots

Message for long time loading Account

To load Accounts table takes a long time and users can think that the page is not working.

We should put an information message to inform about it.

Ledger

The goal is to allow nominators to operate using Polkastats platform and Ledger hardware wallet

Add economic info to dashboard

Is your feature request related to a problem? Please describe.

Add economic info to dashboard:

• Validator slots
• Waiting validators
• Total issuance
• Bonded stake

Reenable imOnline and currentElected icons in frontend

Is your feature request related to a problem? Please describe.

As the backend problem is now fixed, we need to reenable those icons in all places.

NOTE: For testing the fixed backend version is running in v3dev2 server. Please use it while we rebuild it in v3dev1.

Thank you!

Change package management from npm to yarn in frontend repository

We want to use Yarn for managing the frontend repository

UX. Optimize space of nominators list. If possible one line per nominator.

Improve Nominators UX.

Fix validtors filter

Validator filters are not working.

Show transaction status in Send/Stake

Is your feature request related to a problem? Please describe.

Describe the solution you'd like

Describe alternatives you've considered

Additional context

Improve search in validators and nominators

User should be able to search validator and nominators by Identity properties.

Add i18n for translations

Would be nice to have the possibility to translate PolkaStats to another languages.

Describe the solution you'd like
We can use nuxt-i18n to accomplish it.

Fix Produced Blocks charts

There is an error in the Produced Block chart.
The Y-axis is not showing the proper data.

New home page

Is your feature request related to a problem? Please describe.

including:

• Network info
• Economic info
• Top 10 validators
• Top 10 rich accounts
• Last 10 blocks
• Last 10 extrinsics
• Last 10 events

Fix favorites

There are some favorite buttons that are not working properly.

Fix styles in validators table

Some elements were moved from positions after hiding imOnline flag.

New Validators Graphs

Is your feature request related to a problem? Please describe.
We are getting a lot of new data from our new backend.

We should take advantage and create new graphs with this data to help users to understand it.

Our plan is to implement new validator graphs:

• Rewards
• Slashes
• Produced blocks
• Status (active or not)

Describe the solution you'd like
We have created a new Chart component for this purpose.

Describe alternatives you've considered
*

Additional context
*

Vested amount not shown correctly

https://polkadot.polkastats.io/account/16iZ5JgtXmH7kedwxbbPwvzMXYtRUgwmiwiALSkWLZY8eFR

Today on 2020-12-29 at block height ~3109000 it says Total Balance | 7.1000 kDOT / Vested Balance | 104.5129 DOT

I am not sure how this is being calculated, however if you query the chain vesting.vesting($accId) e.g. via polkadot-js you get:

{
  locked: 7.1000 kDOT,
  perBlock: 1.3508 mDOT,
  startingBlock: 2,047,000
}

From this we calculate (3109000 - 2047000) * 0.00013508 = 143.45 as the vested balance, not 104.5 as stated by polkastats.

Fix search in Index Page

Search is not working properly.

You can search by validator address, but can't search by Identity

Add Slashes and Produced Blocks charts

We need to add new charts in validator Page:

• Slashes
• Produced Blocks.

Upgrade polkadot api to v1.20.1

Is your feature request related to a problem? Please describe.

Describe the solution you'd like

Describe alternatives you've considered

Additional context

Migrate Frontend

We need to migrate the frontend to use GraphQL queries to our new Hasura backend server.

Describe the solution you'd like
Use Hasura in backend

Polkadot Era Index is wrong

It is currently session 851 and Era 135 but the UI displays session 851 and Era 136

Polkastats's frontend design revamp. (UI Upgrade)

Is your feature request related to a problem? Please describe.
I am submitting this feature request of a frontend design revamp for Polkastats website. I have prepared a demo for a review using Adobe XD. I will include screenshots below and an open public link for the design which can viewed by anyone to share their suggestions & feedback on that.

Describe the solution you'd like
The solution I have worked upon so far can be reviewed through this link : https://xd.adobe.com/view/1449d4d1-4fc0-4d8b-97e9-a75572b25cba-411a/
In addition to the existing layout I can Add/Remove/Edit any feature that will be necessary for a Revamp. In this link shared here, apart from Blockchain, Staking & Wallet page most of the pages have been redesigned.

Describe alternatives you've considered
I have designed current demo based upon the existing color theme and original design. As an alternative I can change the whole styling & designing as per the suggestions shared.

Additional context
Screenshots -
Buttons

Main_Network Page

Validator Page 1

Validator Page 1_2

How to Stake Page1

How to Stake Page2

How to Stake Page3

Accounts Page

Incorrect ordering by total stake in Accounts

Describe the bug
Incorrect ordering by total stake in Accounts. The order is being done by comparing strings instead of the correct (parsing the int/hex big number and use it for ordering).

To Reproduce

1. Go to accounts
2. Order by any amount desc
3. Compare with the results from PolkaScan ->Accounts

Fix pagination warnings

There are a lot of new warnings about pagination prop perPage.

It could be for a new props type validation in Boostrap library.
We are taking this value some times from localstorage and passing it like a string instead of number.

Polkadot browser extension

The goal is to allow nominators to operate using Polkastats platform and Polkadot browser extension

Upgrade @polkadot/api to v1.19.1

Is your feature request related to a problem? Please describe.

Upgrade @polkadot/api to v1.19.1

Reenable Phragmen views

Is your feature request related to a problem? Please describe.

Reenable Phragmen views.

New Validators Graphs

We are getting a lot of new data from our new backend.

We should take advantage and create new graphs with this data to help users to understand it.

Our plan is to implement new validator graphs:

Rewards

Add rich list in dashboard page

Is your feature request related to a problem? Please describe.

Add rich list to the dashboard page

Migrate frontend

Is your feature request related to a problem? Please describe.
We need to migrate the frontend to use GraphQL queries to our new Hasura backend server.

Describe the solution you'd like
Use Hasura in backend

Describe alternatives you've considered
*

Additional context
*

Revamp project info and add W3f Grant badge

Is your feature request related to a problem? Please describe.

Some pending tasks for long time :-)

• Add W3f Grant badge in footer following w3f guidelines (check https://github.com/w3f/General-Grants-Program/blob/master/grants/grant-badge-guidelines.md).
• Add Team page with description, team background and members.
• Replace message in the footer : Made by PolkaStats Team in La Colmena Labs .

Create Targets page

Is your feature request related to a problem? Please describe.

Create Targets page, similar to https://polkadot.js.org/apps/#/staking/targets

Improve search in intentions

We need to improve the search in the intention page and make possible to search by identity properties.

Better info in the phragmen page.

Hey, I am the Phragmen guy at parity. I have some notes for you about the page:

1. I would not call it phragmen but rather something like election prediction. Soon we will change this election to something else and the keyword phragmen does not make much sense anymore.

2. Make sure you run offline-elections with the exact parameters explained here: https://github.com/paritytech/substrate-debug-kit/tree/master/offline-election#builders

3. If you confirm that you are using this tool (so far I just assumed this), I will add you to the list of builders there.

Also, I will soon work on compiling this to wasm and providing it as javascript package. Let me know if you'd be interested in trying it out first hand!