Add progress donut component to leaderboard entries with variant supp… #3192
Conversation
Codecov Report✅ All modified and coverable lines are covered by tests. 📢 Thoughts on this report? Let us know! |
Bundle ReportChanges will decrease total bundle size by 632 bytes (-0.0%) ⬇️. This is within the configured threshold ✅ Detailed changes
Affected Assets, Files, and Routes:view changes for bundle: client-array-pushAssets Changed:
|
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
…ghestPossibleScore
| Args: { | ||
| total: number; | ||
| completed: number; | ||
| variant?: 'default' | 'teal' | 'grey'; |
There was a problem hiding this comment.
What's your thought process behind this name? Why did we choose variant instead of color?
| return htmlSafe(`--target-offset: ${targetOffset}`); | ||
| } | ||
|
|
||
| get variant(): 'default' | 'teal' | 'grey' { |
There was a problem hiding this comment.
Let's remove the default and make the caller always pass this in - defaults are used when it's obvious what the default is, here it's not obvious that a default progress donut would be blue.
Look at what other components do:
| class="{{if this.isComplete 'stroke-teal-100 dark:stroke-teal-900' 'stroke-blue-100 dark:stroke-blue-900'}}" | ||
| class="{{if | ||
| (eq this.variant 'grey') | ||
| 'stroke-gray-100 dark:stroke-gray-900' |
There was a problem hiding this comment.
These colors look weird in dark mode:
Let's experiment with making them look better, feel free to share a few versions (screenshots) if you aren't sure and I can pick one
…ort.
Checklist:
[percy]in the message to trigger)Note
Displays a progress donut in leaderboard rows and adds variant-based styling (teal/grey/default) to
ProgressDonut, with tests for visibility.ProgressDonuttoapp/components/leaderboard-page/entries-table/row.hbsnext to stages count (@total=@entry.leaderboard.language.liveOrBetaStagesCount,@completed=@entry.scoreUpdatesCount,@variant= teal for current user, grey otherwise). Usesdata-test-progress-donutand spacing tweaks.ProgressDonut:variant?: 'default' | 'teal' | 'grey'arg andvariantgetter with default.progressDonutvia[data-test-progress-donut].Written by Cursor Bugbot for commit e1a211d. This will update automatically on new commits. Configure here.