diff --git a/package.json b/package.json index bce27c4..33a73b0 100644 --- a/package.json +++ b/package.json @@ -11,9 +11,8 @@ }, "dependencies": { "@reduxjs/toolkit": "1.9.5", - "@sliit-foss/bashaway-ui": "0.10.6", + "@sliit-foss/bashaway-ui": "0.12.3", "framer-motion": "10.14.0", - "jwt-decode": "^3.1.2", "lodash": "4.17.21", "lucide-react": "0.263.1", "react": "18.0.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9164bf6..9793bb6 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -14,14 +14,11 @@ dependencies: specifier: 1.9.5 version: 1.9.5(react-redux@8.1.2)(react@18.0.0) '@sliit-foss/bashaway-ui': - specifier: 0.10.6 - version: 0.10.6(@babel/core@7.22.9)(@types/react-dom@18.0.11)(@types/react@18.0.28)(redux@4.2.1)(tailwindcss@3.3.2) + specifier: 0.12.3 + version: 0.12.3(@babel/core@7.22.9)(@types/react-dom@18.0.11)(@types/react@18.0.28)(redux@4.2.1)(tailwindcss@3.3.2) framer-motion: specifier: 10.14.0 version: 10.14.0(react-dom@18.0.0)(react@18.0.0) - jwt-decode: - specifier: ^3.1.2 - version: 3.1.2 lodash: specifier: 4.17.21 version: 4.17.21 @@ -1530,8 +1527,8 @@ packages: engines: {node: '>=14'} dev: false - /@sliit-foss/bashaway-ui@0.10.6(@babel/core@7.22.9)(@types/react-dom@18.0.11)(@types/react@18.0.28)(redux@4.2.1)(tailwindcss@3.3.2): - resolution: {integrity: sha512-yPuAq1yArfOaIZS5fbm+bnFp/zw5QC2Oger7+QcRO2+BTimmUK9YEi5d39Id+YhUIl1bJ/euNqyRg+Ag80upQA==} + /@sliit-foss/bashaway-ui@0.12.3(@babel/core@7.22.9)(@types/react-dom@18.0.11)(@types/react@18.0.28)(redux@4.2.1)(tailwindcss@3.3.2): + resolution: {integrity: sha512-IGBx/UwOdNfNKEVLLlnwVtBvfZQ/gROvquvXoF5eO//BbVFSdBSAKloLk0DRnCNx6HnLUgUpgkJVJ2Y3+CTwLQ==} dependencies: '@radix-ui/react-accordion': 1.1.2(@types/react-dom@18.0.11)(@types/react@18.0.28)(react-dom@18.0.0)(react@18.0.0) '@radix-ui/react-alert-dialog': 1.0.4(@types/react-dom@18.0.11)(@types/react@18.0.28)(react-dom@18.0.0)(react@18.0.0) @@ -3060,10 +3057,6 @@ packages: object.values: 1.1.6 dev: true - /jwt-decode@3.1.2: - resolution: {integrity: sha512-UfpWE/VZn0iP50d8cz9NrZLM9lSWhcJ+0Gt/nm4by88UL+J1SiKN8/5dkjMmbEzwL2CAe+67GsegCbIKtbp75A==} - dev: false - /kind-of@6.0.3: resolution: {integrity: sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==} engines: {node: '>=0.10.0'} diff --git a/src/components/home/score-card/index.jsx b/src/components/home/score-card/index.jsx index cd46e0c..9845670 100644 --- a/src/components/home/score-card/index.jsx +++ b/src/components/home/score-card/index.jsx @@ -1,5 +1,7 @@ import { GraduationCap } from "lucide-react"; import { twMerge } from "tailwind-merge"; +import { useBreakpoint } from "@/hooks"; +import { Button } from "@sliit-foss/bashaway-ui/components"; import { Body, Body2, Footnote, Title } from "@sliit-foss/bashaway-ui/typography"; const topThreeGradient = (position) => { @@ -11,7 +13,19 @@ const topThreeGradient = (position) => { export { default as ScoreCardSkeleton } from "./skeleton"; -export const ScoreCard = ({ item, ...props }) => { +const Eliminated = ({ className, eliminated, ...props }) => + eliminated && ( + + ); + +export const ScoreCard = ({ item, round, ...props }) => { + const breakpoints = useBreakpoint(); + const eliminated = round === 2 && item.eliminated; return (
{ {item.place}
- - {item.name} - -
- - {item.university} +
+ + {item.name} + + {breakpoints["md"] && } +
+
+ + {item.university} + {!breakpoints["md"] && ( + + )}
diff --git a/src/pages/home.jsx b/src/pages/home.jsx index 601b7e1..abf61f7 100644 --- a/src/pages/home.jsx +++ b/src/pages/home.jsx @@ -1,4 +1,5 @@ import { useEffect, useState } from "react"; +import { twMerge } from "tailwind-merge"; import { ScoreCardSkeleton } from "@/components"; import { ScoreCard } from "@/components/home"; import { filters as filterData, sorts as sortData } from "@/filters"; @@ -12,7 +13,8 @@ import { Sorts, TwinSwitch } from "@sliit-foss/bashaway-ui/components"; -import { useRound } from "@sliit-foss/bashaway-ui/hooks"; +import { useGhostLegion, useRound } from "@sliit-foss/bashaway-ui/hooks"; +import { Ghost } from "@sliit-foss/bashaway-ui/icons"; import { Footnote, Title } from "@sliit-foss/bashaway-ui/typography"; import { computeFilterQuery, computeSortQuery } from "@sliit-foss/bashaway-ui/utils"; @@ -23,11 +25,13 @@ const Home = () => { const { rounds, round, roundKey, onRoundChange } = useRound(); - const { data: scores, isFetching } = useFetchLeaderboardQuery({ page, filters, sorts, round }); + const { ghostLegion, toggleGhostLegion } = useGhostLegion(); + + const { data: scores, isFetching } = useFetchLeaderboardQuery({ page, filters, sorts, round, ghostLegion }); useEffect(() => { if (page !== 1) setPage(1); - }, [filters, sorts, round]); + }, [filters, sorts, round, ghostLegion]); useTitle("Leaderboard | Bashaway"); @@ -41,13 +45,31 @@ const Home = () => { -
- - +
+ +
+
+ + Ghost Legion + + +
+ +
{ scores?.data?.docs?.length ? ( <> {scores.data.docs.map((item, index) => ( - + ))} ) : ( diff --git a/src/store/api/leaderboard.js b/src/store/api/leaderboard.js index b7898e7..50ef0fc 100644 --- a/src/store/api/leaderboard.js +++ b/src/store/api/leaderboard.js @@ -8,7 +8,7 @@ export const leaderboardApi = createApi({ baseQuery, endpoints: (builder) => ({ fetchLeaderboard: builder.query({ - query: ({ round }) => `/api/leaderboard?round=${round}`, + query: ({ round, ghostLegion }) => `/api/leaderboard?round=${round}&ghost_legion=${ghostLegion}`, transformResponse: (response, _, arg) => { const { page, filters, sorts } = arg; response.data = response.data.map((item, index) => ({ ...item, place: index + 1 }));