search

NEAR-DevHub / neardevhub-treasury-dashboard

Frontend for Treasury Dashboard Product (includes DevHub, Infinex) + Testing front end. Note – we leverage Sputnik DAO contract.
MIT License
3 stars 0 forks source link

UX: Improve voting options & horizontal scroll #79

Open ori-near opened 1 week ago

ori-near commented 1 week ago

Background

Voting options are currently located on the far right side of the pending requests table, making them difficult to find and decreasing voting ease. It is also difficult for users to know that they have a horizontal bar to scroll left and right within table.

Image

UX Need

Need to update the Pending Requests table with a more prominent and clearly visible voting option. This will make it easier for users with voting permissions to take immediate action. Also need to make it easier for users to know that they can scroll left and right in the horizontal table.

Acceptance Criteria

FREZZZBE commented 1 week ago

Solution

  1. Open table settings
  2. Hover selected option
  3. Click Pin icont to pin> Lets pin voting column by default

We make an option to pin any column from left or rite side of the table

https://github.com/user-attachments/assets/d61640ea-052f-408a-ad3f-00024bebcde0

ori-near commented 1 week ago

Solution

  1. Open table settings
  2. Hover selected option
  3. Click Pin icont to pin> Lets pin voting column by default

We make an option to pin any column from left or rite side of the table

Treasury.Pin.column.flow.mp4

Hey @FREZZZBE – I like this direction for sure. A couple of quick reactions:

FREZZZBE commented 1 week ago

Hey @FREZZZBE – I like this direction for sure. A couple of quick reactions:

  • Right now the pin button doesn't seem visible unless you hover over the table. Could we always show it but make it light/transparent ish similar to the eye button when not selected?
  • Are we only making the option to pin votes? Or any other columns? If the latter, can you show that would look when you select multiple random ones? Will they always show on the right?

Hey @ori-near

ori-near commented 1 week ago

@FREZZZBE – agree that we don't need to overcomplicate. Let's get input from @Megha-Dev-19 and the other devs to see what would be the easiest path.

FREZZZBE commented 1 week ago

@ori-near are we ready to mark as done?

Megha-Dev-19 commented 1 week ago

hey, sorry I missed my mention, I like the pinned solution, but it will be pretty complicated to add it for all columns, so maybe we can only do it for votes now, and I think it's better if it's enabled by default, since first time voters should definitely see their vote option, and they can turn it off if needed.

FREZZZBE commented 1 week ago

hey, sorry I missed my mention, I like the pinned solution, but it will be pretty complicated to add it for all columns, so maybe we can only do it for votes now, and I think it's better if it's enabled by default, since first time voters should definitely see their vote option, and they can turn it off if needed.

Agree with this solution. @ori-near could you update following task if you are agree with this too?

ori-near commented 3 days ago

Hi @FREZZZBE @Megha-Dev-19 – thank you for you feedback. I went ahead and updated the development ticket for the voting column and removed the dependency on this ticket: https://github.com/NEAR-DevHub/neardevhub-treasury-dashboard/issues/74

A couple of follow ups:

  1. @Megha-Dev-19 I think we named the "Votes" column "Actions" – because actions might vary based on the user. But should we relabel them "Votes"? OR will that cause an issue?
  2. @FREZZZBE Can you please work on the second part of this ticket (horizontal scroll)? I updated the AC.
FREZZZBE commented 2 days ago

Can you please work on the second part of this ticket (horizontal scroll)? I updated the AC.

@ori-near fill like it's overrated problem. A lot of tools have tables and when it's too wide it's use common horisontal scroll. I would like to test it with just pined vots. Pined votes must more visual indicate that.