feat: new level calculations and score in leaderboard #1931
Conversation
WalkthroughThe pull request refines the juror level evaluation by introducing a coherence score, replacing multiple vote metrics with a unified metric. A new juror level ("Diogenes") is added, and existing levels are updated with revised coherence score ranges. User interface components are modified to reflect these changes, including updated text, tooltips, and layout adjustments. New Score components are introduced for displaying score-related information across both desktop and mobile views, and interfaces throughout the codebase are updated to support the new coherenceScore-based logic. Changes
Sequence Diagram(s)sequenceDiagram
participant U as User
participant PI as Profile/JurorInfo
participant GL as getUserLevelData
participant JL as JurorLevel Component
participant SC as Score Component
U->>PI: Provide coherenceScore data
PI->>GL: Call getUserLevelData(coherenceScore)
GL-->>PI: Return level data (via score ranges)
PI->>JL: Render juror level based on coherenceScore
JL->>SC: Pass coherenceScore for display
SC->>U: Display score and tooltip on hover
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (2)
🚧 Files skipped from review as they are similar to previous changes (2)
⏰ Context from checks skipped due to timeout of 90000ms (15)
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
✅ Deploy Preview for kleros-v2-neo ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
✅ Deploy Preview for kleros-v2-testnet-devtools ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
✅ Deploy Preview for kleros-v2-university ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
✅ Deploy Preview for kleros-v2-testnet ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (3)
web/src/pages/Home/TopJurors/Header/Score.tsx (1)
10-25: Consider avoiding!importantin CSS rules.Using
!importantin CSS (line 12) breaks the natural cascade of styles and makes maintenance more difficult. It's generally better to structure your selectors with higher specificity if you need to override styles.- font-size: 12px !important; + font-size: 12px;And similarly on line 21:
- font-size: 14px !important; + font-size: 14px;web/src/pages/Home/TopJurors/JurorCard/Score.tsx (2)
15-17: Consider using number instead of string for coherenceScore.The coherenceScore is typed as a string, which works for display purposes, but might require conversion if calculations are needed elsewhere. Consider using a number type and formatting it for display within the component.
interface IScore { - coherenceScore: string; + coherenceScore: number; } const Score: React.FC<IScore> = ({ coherenceScore }) => { return ( <Container> - <Tooltip text={coherenceScore}>{coherenceScore}</Tooltip> + <Tooltip text={coherenceScore.toString()}>{coherenceScore.toString()}</Tooltip> </Container> ); };
1-27: Potential confusion with duplicate Score components.There are now two different
Scorecomponents in different directories:
web/src/pages/Home/TopJurors/Header/Score.tsxweb/src/pages/Home/TopJurors/JurorCard/Score.tsx(this file)This could lead to confusion for developers. Consider consolidating these into a single, reusable component or using more specific naming to differentiate their purposes.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (12)
web/src/components/Popup/MiniGuides/JurorLevels.tsx(1 hunks)web/src/pages/Home/TopJurors/Header/Coherence.tsx(2 hunks)web/src/pages/Home/TopJurors/Header/DesktopHeader.tsx(3 hunks)web/src/pages/Home/TopJurors/Header/Score.tsx(1 hunks)web/src/pages/Home/TopJurors/JurorCard/Coherence.tsx(1 hunks)web/src/pages/Home/TopJurors/JurorCard/DesktopCard.tsx(3 hunks)web/src/pages/Home/TopJurors/JurorCard/JurorLevel.tsx(1 hunks)web/src/pages/Home/TopJurors/JurorCard/MobileCard.tsx(2 hunks)web/src/pages/Home/TopJurors/JurorCard/Score.tsx(1 hunks)web/src/pages/Home/TopJurors/JurorCard/index.tsx(1 hunks)web/src/pages/Profile/JurorInfo/index.tsx(1 hunks)web/src/utils/userLevelCalculation.ts(1 hunks)
🧰 Additional context used
🧠 Learnings (3)
web/src/pages/Home/TopJurors/Header/Coherence.tsx (1)
Learnt from: Harman-singh-waraich
PR: kleros/kleros-v2#1739
File: web/src/pages/Home/TopJurors/JurorCard/Coherency.tsx:22-26
Timestamp: 2025-03-27T13:00:21.271Z
Learning: In the `Coherency` component (`web/src/pages/Home/TopJurors/JurorCard/Coherency.tsx`), `totalResolvedVotes` is always greater than or equal to `totalCoherentVotes`. When both are zero, `0/0` results in `NaN`, which is acceptable in this context.
web/src/pages/Home/TopJurors/JurorCard/index.tsx (1)
Learnt from: Harman-singh-waraich
PR: kleros/kleros-v2#1739
File: web/src/pages/Home/TopJurors/JurorCard/Coherency.tsx:22-26
Timestamp: 2025-03-27T13:00:21.271Z
Learning: In the `Coherency` component (`web/src/pages/Home/TopJurors/JurorCard/Coherency.tsx`), `totalResolvedVotes` is always greater than or equal to `totalCoherentVotes`. When both are zero, `0/0` results in `NaN`, which is acceptable in this context.
web/src/pages/Home/TopJurors/JurorCard/Coherence.tsx (1)
Learnt from: Harman-singh-waraich
PR: kleros/kleros-v2#1739
File: web/src/pages/Home/TopJurors/JurorCard/Coherency.tsx:22-26
Timestamp: 2025-03-27T13:00:21.271Z
Learning: In the `Coherency` component (`web/src/pages/Home/TopJurors/JurorCard/Coherency.tsx`), `totalResolvedVotes` is always greater than or equal to `totalCoherentVotes`. When both are zero, `0/0` results in `NaN`, which is acceptable in this context.
🧬 Code Definitions (3)
web/src/pages/Profile/JurorInfo/index.tsx (1)
web/src/utils/userLevelCalculation.ts (1)
getUserLevelData(16-23)
web/src/pages/Home/TopJurors/JurorCard/JurorLevel.tsx (1)
web/src/utils/userLevelCalculation.ts (1)
getUserLevelData(16-23)
web/src/pages/Home/TopJurors/JurorCard/Coherence.tsx (1)
web/src/utils/getCoherencePercent.tsx (1)
getCoherencePercent(1-4)
⏰ Context from checks skipped due to timeout of 90000ms (6)
- GitHub Check: Redirect rules - kleros-v2-testnet
- GitHub Check: Redirect rules - kleros-v2-testnet
- GitHub Check: Header rules - kleros-v2-testnet
- GitHub Check: Header rules - kleros-v2-testnet
- GitHub Check: Pages changed - kleros-v2-testnet
- GitHub Check: Pages changed - kleros-v2-testnet
🔇 Additional comments (31)
web/src/pages/Home/TopJurors/JurorCard/Coherence.tsx (1)
27-29: LGTM! Improved tooltip display logic.This change improves the user experience by displaying the raw vote ratio (e.g., "3/4") as the main content and showing the percentage (e.g., "75%") in the tooltip when hovering. This is more intuitive than the previous implementation.
web/src/pages/Profile/JurorInfo/index.tsx (2)
48-49: LGTM! Simplified user level calculation logic.This change improves the code architecture by:
- Using a unified coherenceScore directly from the user data
- Simplifying the
getUserLevelDatafunction to accept just one parameter- Removing unnecessary calculations in this component
This aligns with the broader refactoring to focus on coherence scores rather than multiple voting metrics.
48-49:❓ Verification inconclusive
Verify coherenceScore is always available in user data.
Make sure that the
coherenceScorefield is reliably available in the user data returned by the API to prevent potential undefined values.Run the following script to check if all users have coherenceScore:
🏁 Script executed:
#!/bin/bash # Check if coherenceScore exists in GraphQL schema and sample responses # Check schema definition echo "Checking GraphQL schema for coherenceScore field..." fd --type f --extension graphql | xargs grep -l "type User" | xargs cat # Check any sample query responses if available echo "Checking sample responses..." fd --type f --name "*.json" --exec grep -l "user" {} \; | xargs grep "coherenceScore"Length of output: 9424
Action: Confirm Coherence Score Field Consistency
The GraphQL schema definitively requires the
coherenceScorefield on the User entity (defined as a non-nullBigInt), which means it should always be present when user data is provided. Note, however, that our automated sample response check did not return output due to command issues. Please manually verify that all API responses include thecoherenceScorefield, and if any anomalies are found, consider adding additional runtime validations.web/src/pages/Home/TopJurors/Header/Coherence.tsx (2)
14-14: Improved label for better user clarityChanging "Coherence" to "Coherent\u00a0Votes" makes the purpose of this component clearer to users. The non-breaking space ensures the label stays together on the same line.
27-31: Enhanced tooltip explanationThe updated tooltip message provides a more comprehensive explanation of the coherence ratio, with clear instructions about hovering to see the percentage. This improves user understanding of the metric being displayed.
web/src/pages/Home/TopJurors/JurorCard/index.tsx (2)
9-9: New coherenceScore property added to interfaceAdding the coherenceScore property to the IJurorCard interface aligns with the PR objective of refactoring juror level evaluation to use a unified coherence score.
14-15: Updated component parameters to include coherenceScoreThe JurorCard component correctly incorporates the new coherenceScore parameter and passes it to child components via allProps. This ensures the coherence score is available throughout the component hierarchy.
web/src/pages/Home/TopJurors/Header/DesktopHeader.tsx (3)
19-19: Added Score component importThe import of the new Score component is consistent with the PR objectives to display coherence scores prominently in the UI.
35-37: Refined grid layout for better component spacingThe grid layout has been updated with more precise fractional widths instead of min-content and repeat. This provides better control over column widths to accommodate the new Score component while maintaining responsiveness.
67-69: Logical component ordering in the headerThe Score component is now rendered before Coherence, followed by Rewards. This ordering creates a natural flow from general score to specific metrics (coherence and rewards), improving the user experience.
web/src/pages/Home/TopJurors/JurorCard/MobileCard.tsx (3)
85-85: Added coherenceScore to MobileCard interfaceThe coherenceScore property has been added to the IMobileCard interface, aligning with the PR objective of refactoring to use a unified coherence score system.
93-94: Updated component parameters to include coherenceScoreThe MobileCard component correctly incorporates the new coherenceScore parameter, ensuring it's available for use within the component.
102-102: Simplified JurorLevel props with coherenceScoreThe JurorLevel component now receives only the coherenceScore (converted from string to number) instead of multiple metrics. This simplification aligns with the PR objective of using a unified coherence score for level calculations.
web/src/pages/Home/TopJurors/JurorCard/DesktopCard.tsx (5)
13-13: New Score component importedThe addition of the Score component aligns with the coherence score refactoring seen across the codebase.
29-30: Layout adjustment looks goodThe grid template columns have been updated to use fixed fractions instead of responsive sizes, and the column gap has been adjusted. This change supports the new layout requirements for displaying the coherence score.
42-42: Interface update for coherence scoreThe addition of the coherenceScore property to the interface aligns with the PR objective of using a unified coherence scoring system.
50-51: Props updated for coherence scoreThe component props now include coherenceScore, which aligns with the interface changes.
60-63: Updated component usage with coherence scoreThe implementation now uses the new Score component to display the coherence score and passes the numeric coherence score to the JurorLevel component. These changes align with the new coherence score-based approach.
web/src/pages/Home/TopJurors/JurorCard/JurorLevel.tsx (2)
42-42: Simplified interface to use coherence score onlyThe interface has been streamlined to only require the coherenceScore property, which aligns with the PR objective of unifying juror evaluation around a coherence score.
45-46: Simplified component implementationThe component now directly uses the coherenceScore to determine the user level, which is more straightforward than the previous approach that required multiple vote metrics.
web/src/utils/userLevelCalculation.ts (4)
4-5: Updated interface for coherence score-based evaluationThe interface now uses minCoherenceScore and maxCoherenceScore instead of the previous metrics, which aligns with the PR objective of using a unified coherence score.
9-13: Updated level criteria with new Diogenes levelThe level criteria now include a new level 0 (Diogenes) for lower coherence scores and updated ranges for existing levels. This provides a more granular approach to categorizing jurors based on their performance.
16-18: Simplified getUserLevelData functionThe function now accepts coherenceScore directly as a number and checks if it falls within the defined ranges for each level. This is more straightforward than the previous approach.
22-22: Default to lowest level if no matchThe function now returns the lowest level (Diogenes) if no matching criteria are found, which is a reasonable default.
web/src/components/Popup/MiniGuides/JurorLevels.tsx (7)
34-40: Added description for new Diogenes levelThe addition of the Diogenes level description with a coherence score below 25 aligns with the updated level criteria in userLevelCalculation.ts.
44-45: Updated Pythagoras level descriptionThe description now uses coherence score range (25-49) instead of previous metrics, which is consistent with the new scoring approach.
51-52: Updated Socrates level descriptionThe description now uses coherence score range (50-69) instead of previous metrics, which is consistent with the new scoring approach.
58-59: Updated Plato level descriptionThe description now uses coherence score range (70-89) instead of previous metrics, which is consistent with the new scoring approach.
65-66: Updated Aristotle level descriptionThe description now uses coherence score range (90-100) instead of previous metrics, which is consistent with the new scoring approach.
72-77: Added data for new Diogenes levelThe userLevelData array now includes an entry for the Diogenes level with appropriate coherent and resolved vote counts. This provides example data for the new level in the mini-guide.
82-82: Updated vote counts for existing levelsThe coherent and resolved vote counts for existing levels have been updated to better represent the new coherence score ranges. For example, Aristotle now has 90 coherent votes out of 90 resolved votes, representing a perfect 100% coherence score.
Also applies to: 87-88, 93-94, 99-100
|
Code Climate has analyzed commit e4d1246 and detected 8 issues on this pull request. Here's the issue category breakdown:
View more on Code Climate. |
|
PR-Codex overview
This PR focuses on refactoring the
JurorCardcomponent and related files to incorporate a newScorefeature, which calculates and displays a juror's coherence score. It also modifies various components to accommodate this new feature and updates the user level calculation logic.Detailed summary
Scorecomponent to display the coherence score.JurorCardto includecoherenceScoreand removedtotalResolvedDisputes.JurorLevelto usecoherenceScoreinstead of voting totals.coherenceScoreinstead of percentage.MobileCardandDesktopCardto utilize the newScorecomponent.Summary by CodeRabbit
New Features
Refactor
Bug Fixes