Voting history for DReps and Single Voters

[m-i-k-e]

As democracy becomes a working thing on GovTool, it will be essential for users to be able to know what the voting history of their representatives are.

user stories for this:

• As a user or participant in governance on Cardano, I want to know the voting history of DReps so that I can make informed choices as to who I want to delegate my ADA-power to.
• As a delegator to a specific DRep, I want to know what my Voting Power was used for, so I may understand if I'm being represented in a way that I want to, and if not, so that I have the information to make a change to another DRep or other type of Voting.
• As a Sole Voter, I want to be able to know what my own voting history is, so that I may understand my participation in governance, and to have a reference for future discussions, etc.

Below is a draft idea for a table that would live on a DRep's detail page. It shows, in order: Gov Action name (link to the detail page of the GA, possibly in a new window) Type of GA Voting Date (should also have epoch number) How many Votes were cast at the appropriate epoch boundary Vote (Yes, no Abstain) Status of the GA

[kgrzonka]

I've designed simple table with all data and added it at the end of the Drep Profile. https://www.figma.com/file/mJTBiUofLfb74Xc3W2U59o/branch/c83OylfqzruMR4RqBBfdyN/Voltaire---GOV-TOOL?type=design&node-id=13223%3A89038&mode=design&t=eDDOjzAxdD7XxmSG-1

At first I thought about making a button that would redirect the user to a separate subpage with the table but that would require a lot of clicking. On the other hand - as is the case with tables we may run out of space (e.g. if the title is too long) and we will have to cut the sentence by adding "..." and a tooltip or add a bottom scroll. Here I also have concerns when it comes to mobile versions - horizontal tables on a phone are a pain and they have to be legible. So I dont know if it will be a good solution: a) table on desktop and another type of data recording on mobile b) different, same type of recording for desktop and mobile c) tables for desktop and mobile

Next thing is a Voting History for DRep and Sole Vote user. Maybe we should add new page and item to the navigation with table screen ? In this situation voter can saw own history quick and maybe can share this specific page? WDYT @m-i-k-e

[m-i-k-e]

@kgrzonka Looks really good, nice and simple. So for the mobile version, can you please see what material design provides/suggests?

On the table itself:

• I think the arrows could be simplified
• The title of the G-Action needs to be a link to the action
• Voting date - I'm not sure what that means. what dates do we need to show? Also, maybe we need epoch numbers in as well
• The "pills" need to be redesigned (in general) as they look like buttons. Could you change them?
• Voting Power should be separated by commas
• Status needs to have status in it, I guess the statuses are 'Active' , 'Enacted', 'Expired' (there may be others)
• I think that for this table, we could use paging, as in material design

Please can you make these changes, and we will be able to put this into the backlog as 'nearly ready to develop'

[kgrzonka]

@m-i-k-e I corrected the tables a bit. I gave up badges to save space (long GA names and mobile version): https://www.figma.com/design/mJTBiUofLfb74Xc3W2U59o/branch/c83OylfqzruMR4RqBBfdyN/Voltaire---GOV-TOOL?m=auto&node-id=13223%3A89038&t=YtNG3nYaDVxAXCOQ-1b

This is a sketch for now so if this version is fine - let me know I need create this in proper way (on original screens and create components for table) :)

About mobile version... I think the best solution is transformed -> https://medium.com/appnroll-publication/5-practical-solutions-to-make-responsive-data-tables-ff031c48b122 - collapsing of the table rows into separate cards. This will be look nice and practical in this case. WDYT?

[m-i-k-e]

@kgrzonka Looks really good. Please can you do these things to make this finished:

1. make the table at least 10 rows high
2. abbreviate the date and epoch like '28 May 23 (430)
3. Alter the title of the "Voting Date" column to say "Voted on (epoch)"
4. Then you can lose one line (the epoch) in the table and make it less high
5. Make a mobile version

[m-i-k-e]

Kasia still working on this, will be a lower priority for now.

[GypsyBinar]

howdy! i have finished desktop and mobile screens + add an empty state for a drep without history https://www.figma.com/design/mJTBiUofLfb74Xc3W2U59o/branch/c83OylfqzruMR4RqBBfdyN/Voltaire---GOV-TOOL?m=auto&node-id=13223%3A89037&t=ugfHIXuIebwogWAH-1

[m-i-k-e]

OK, very good. Could you please do the following:

• separate the mobile ones better, with a space or shadow, line, or both. Using the purple line does not delineate them as well as maybe they could be.
• See if you can find a way (search material design) to make the mobile table sortable
• add pagination controls at the bottom - with 10 rows showing at a time. @GypsyBinar @kgrzonka

[GypsyBinar]

https://www.figma.com/design/mJTBiUofLfb74Xc3W2U59o/branch/c83OylfqzruMR4RqBBfdyN/Voltaire---GOV-TOOL?m=auto&node-id=13223-89037&t=3e7cIR3bjuUSCqCA-1

[m-i-k-e]

A user has submitted a suggestion that we add the voting rationale from the DRep as well. This is a really good idea. It will have to be worked into the design

https://github.com/IntersectMBO/govtool/issues/1771