Showcase orchestrator voting activity in the UI #457
Conversation
- Introduced a new component to present a list of orchestrators with their voting statistics, including proposals voted on, votes casted, recent votes, and voting turnout.
- Added Cube.js client for data fetching with new utility functions for querying voting history. - Introduced VotingHistoryView component to display voting statistics, including proposals voted on and voting turnout. - Updated package.json and pnpm-lock.yaml to include Cube.js client dependencies.
- Exported VoterSummary type for better type management in voting components. - Integrated VotingHistoryView into the account layout for displaying voting statistics. - Added new VotingHistory page to handle routing and data fetching for user voting history. - Updated account layout to include a new tab for voting history, improving user navigation. - Implemented utility functions for processing and summarizing voting data from Cube.js.
- Added OrchestratorVotingList component to display voting data for orchestrators. - Implemented tabbed interface for Yield Overview and Voting History sections. - Integrated voter summary processing functions to aggregate voting data. - Updated getStaticProps to fetch and pass initial voter data to the page.
- Adds treasury proposals voting overview
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Jipperism
force-pushed
the
310-showcase-orchestrator-voting-activity-in-the-ui
branch
from
894848d to
3e5ac11
Compare
- Changed the method of accessing raw data from Cube.js API to use a function call. - Simplified response validation in getStaticProps by removing unnecessary checks and directly using the response for voter summaries.
- Fetches voting metrics (voted/eligible) from Cube.js using LivepeerVoteProposals - Adds an interactive Stat card to OrchestratingView with a visual progress bar - Displays participation rate percentage and integrated link to account history - Adds utility to the Cube query generator
…nology - Moved to a friendlier "Sky & Tomato" color scheme to keep voting separate from our main green brand accent. - Standardized labels to "For / Against / Abstain" everywhere, including the global transaction feed. - Rebuilt the vote table using our core data table component for a consistent look. - Made it easier to explore voter history with new dedicated buttons, better tooltips, and subtle animations. - Cleaned up the layout by stripping out redundant titles and shrinking fonts where they were getting too loud. - Polished the details: added specific styling for "No reason provided" and refined how voter profiles are we showing voter names and txn links.
- Eliminated the agent log useEffect that was posting debug information. - Streamlined imports by removing unnecessary useEffect import.
…List - Changed badge colors to use a "Sky & Tomato" color scheme for better visual distinction. - Updated badge labels from "Yes/No" to "For/Against" to standardize terminology across the application.
…prove title trimming Update variable names for treasury vote events for consistency and clarity. Enhance the rendering of event titles by trimming whitespace to improve presentation in the UI.
Addressed in 443921f |
thebeyondr
changed the title
…tors Change text colors for For and Against labels to match their respective vote indicators. Update border radius for progress bars in the TreasuryVotingWidget and VotingWidget components to create a more modern, rounded appearance.
|
Great work! My main piece of feedback I have is that the votes section is too buried beneath the fold. Most users will likely not know it exists unless they scroll all the way down a lengthy proposal. My recommendation is to move it inside a tabbed interface like this: 
The other thing I noticed is the "reason" text is too long for the table cell and has little padding so it's cramped against the cell borders and will be too tall and hard to scan with longer given reasons. We need a way to keep it compact but still accessible. 
Truncation with expansion could work here. Show the first line or two of the reason with an ellipsis, then let users click to expand inline or open a popover. WDYT? |
- Allow passing `votesTabHref` to TreasuryVotingWidget for better linking to the votes tab. - Show "View votes" as a proper link when the href is provided, falling back to the anchor hash. - Add horizontal scrolling for tabs on the proposal page. - Clean up tab logic to show active states and vote counts more clearly. - Polish layout and accessibility for proposal details.
Show vote reasons in a popover when they're longer than 50 chars. Replace Tooltip with ExplorerTooltip in vote tables for consistency.
Addressed in a011063
Addressed in 7eb8b56 
|
|
Nice, looking good. A few more minor UI adjustments:
|
…ansion - Update notification badge style to match navigation - Fix tab border alignment and stacking context - Remove redundant outer container from votes view - Add click-to-expand functionality for vote reasons on mobile
Thanks for catching those @adamsoffer! 
|
|
Awesome. Last thing...these tabs have a couple styling inconsistencies - they're using different border widths and the first one is still not flush with the bottom of the component like the other one. After that's fixed LGTM. |
🫡🫡 fixed in 1114a71, pesky badge size was throwing off the spacing |
|
Yeah it's the badge size causing the issue. I'm still seeing a discrepancy though. If you give this component a |
added in 590080f |
Description
Surface orchestrator governance activity so stakeholders can see how they vote over time and per proposal.
Type of Change
Related Issue
Closes #310
Closes #464
xxx## Changes Made
Governance visibility (core of #310)
Voting Widget Formatting (fixes #464)
SectionLabel) and layout.Refactors
Fixes
Testing
Screenshots (if applicable)
Checklist