Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add achievement overview and leaderboard #5169

Open
wants to merge 3 commits into
base: master
Choose a base branch
from

Conversation

jonasdeluna
Copy link
Member

@jonasdeluna jonasdeluna commented Nov 10, 2024

Description

Adds achievement overview and leaderboard.

Result

If you've made visual changes, please check the boxes below and include images showing the changes. Descriptions are appreciated.

  • Changes look good on both light and dark theme.
  • Changes look good with different viewports (mobile, tablet, etc.).
  • Changes look good with slower Internet connections.

Caution

Make sure your images do not contain any real user information.

image

image

image

Testing

  • I have thoroughly tested my changes.

Please describe what and how the changes have been tested, and provide instructions to reproduce if necessary.


Resolves ... (either GitHub issue or Linear task)

Copy link

vercel bot commented Nov 10, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Skipped Deployment
Name Status Preview Comments Updated (UTC)
lego-bricks-storybook ⬜️ Ignored (Inspect) Visit Preview Nov 13, 2024 8:52pm

@jonasdeluna jonasdeluna marked this pull request as draft November 10, 2024 17:30
@github-actions github-actions bot added the review-needed Pull requests that need review label Nov 10, 2024
@jonasdeluna jonasdeluna force-pushed the feat-add-leaderboard-and-overview-achievements branch from 5300ead to 6c8a446 Compare November 10, 2024 17:36
@jonasdeluna jonasdeluna force-pushed the feat-add-leaderboard-and-overview-achievements branch 2 times, most recently from b12fd87 to 4dd48c6 Compare November 13, 2024 17:53
@jonasdeluna jonasdeluna changed the title WIP Add achievement overview and leaderboard Add achievement overview and leaderboard Nov 13, 2024
@jonasdeluna jonasdeluna requested review from eikhr and ShaileshS1702 and removed request for eikhr November 13, 2024 17:54
@jonasdeluna jonasdeluna marked this pull request as ready for review November 13, 2024 17:54
@jonasdeluna jonasdeluna force-pushed the feat-add-leaderboard-and-overview-achievements branch 2 times, most recently from 5174378 to fa79b0f Compare November 13, 2024 20:40
@jonasdeluna jonasdeluna force-pushed the feat-add-leaderboard-and-overview-achievements branch from fa79b0f to 0b4fecf Compare November 13, 2024 20:52
Copy link
Member

@danielyanghansen danielyanghansen left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks very good! I've left some suggestions, some nitpicks and some comments. We'll get this running real fast 😎

@@ -245,6 +245,7 @@ export const NotificationsFeed = {
*/
export const User = {
FETCH: generateStatuses('User.FETCH') as AAT,
FETCH_LEADERBOARD: generateStatuses('User.FETCH') as AAT,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Try to avoid using the same status for different actions

export function fetchLeaderboardUsers() {
return callAPI<PublicUser[]>({
types: User.FETCH_LEADERBOARD,
endpoint: `/achievements/leaderboard/`,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Might want to declare method as GET here

selectUserEntities,
(userEntities) => {
return Object.values(userEntities).filter(
(user) => user.achievementScore != null,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

might want to do

(user) => !!user.achievementScore,

so that we catch undefined and 0 as well as null

}));
const columns: ColumnProps<RankedUser>[] = [
{
title: 'Posisjon',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

change to "Rang" or "Rangering"?

Comment on lines +19 to +46
const allTrophies = Object.entries(AchievementsInfo).flatMap(
([key, achievements]) =>
achievements.map((achievement, index) => ({
...achievement,
identifier: key,
level: index,
})),
);

const filteredTrophies = allTrophies.filter((trophy) => {
const rarity = trophy.rarity;
const minRarity =
query.min_rarity !== 'any' ? parseInt(query.min_rarity, 10) : 0;
const maxRarity =
query.max_rarity !== 'any' ? parseInt(query.max_rarity, 10) : Infinity;
return rarity >= minRarity && rarity <= maxRarity;
});

const sortedTrophies = [...filteredTrophies].sort((a, b) => {
let comparison = 0;
if (query.sort === 'rarity') comparison = a.rarity - b.rarity;
if (query.sort === 'alphabetical')
comparison = a.name.localeCompare(b.name);
if (query.sort === 'hidden')
comparison = a.hidden === b.hidden ? 0 : a.hidden ? -1 : 1;

return query.sort_order === 'desc' ? -comparison : comparison;
});
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is there a reason we are explicitly storing each list?
I get that it's nice to divide clearly up into filtering and sorting, but it might be better to just define the filter and sorting lambda's instead and then do

const trophies = 
	Obejct.entries(Achievements)
	.flatMap(flatMapper)
	.filter(trophyFilter)
	.sort(trophyComparator)

where flatMapper, trophyFilter, and trophyComparator are just named lambdas:

const trophyFilter: (trophy: Trophy) => boolean = (trophy)  => {
//...
} 

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

An named lambda for the flatMapper isn't really that important though

@@ -37,6 +38,7 @@ export const routerConfig: RouteObject[] = [
Component: AppRoute,
children: [
{ index: true, Component: Frontpage },
{ path: 'achievements/*', children: achievementRoute },
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: achievementsRoute (with an s)

Copy link
Contributor

@ch0rizo ch0rizo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Very nice feature, looks great!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
review-needed Pull requests that need review
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants