Skip to content

feat(statistics): render score in RankingEdge #24

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.

Sign up for GitHub

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

Merged
pan93412 merged 2 commits into from
Oct 13, 2025
Merged

feat(statistics): render score in RankingEdge #24

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a45de58
feat(statistics): render score in RankingEdge
pan93412 Oct 13, 2025
7400c99
fix(statistics): Math.abs() for negative points
pan93412 Oct 13, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion app/(app)/statistics/_components/ranking/completed-questions.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@
import { graphql } from "@/gql";
import type { RankingPeriod } from "@/gql/graphql";
import { useSuspenseQuery } from "@apollo/client/react";
import { ScoreDiff } from "./score";

const COMPLETED_QUESTIONS_RANKING = graphql(`
query CompletedQuestionRanking($period: RankingPeriod!) {
Expand All @@ -19,6 +20,7 @@ const COMPLETED_QUESTIONS_RANKING = graphql(`
solvedQuestions
}
}
score
}
}
}
Expand Down Expand Up @@ -47,7 +49,9 @@ export default function SolvedQuestionsRanking({
return (
<TableRow key={edge.node.id}>
<TableCell>{edge.node.name}</TableCell>
<TableCell>{edge.node.submissionStatistics.solvedQuestions}</TableCell>
<TableCell>
{edge.node.submissionStatistics.solvedQuestions} (<ScoreDiff score={edge.score} />)
</TableCell>
</TableRow>
);
})}
Expand Down
6 changes: 5 additions & 1 deletion app/(app)/statistics/_components/ranking/points.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@
import { graphql } from "@/gql";
import type { RankingPeriod } from "@/gql/graphql";
import { useSuspenseQuery } from "@apollo/client/react";
import { ScoreDiff } from "./score";

const POINTS_RANKING = graphql(`
query PointsRanking($period: RankingPeriod!) {
Expand All @@ -14,6 +15,7 @@ const POINTS_RANKING = graphql(`
name
totalPoints
}
score
}
}
}
Expand All @@ -38,7 +40,9 @@ export default function PointsRanking({ period }: { period: RankingPeriod }) {
return (
<TableRow key={edge.node.id}>
<TableCell>{edge.node.name}</TableCell>
<TableCell>{edge.node.totalPoints}</TableCell>
<TableCell>
{edge.node.totalPoints} (<ScoreDiff score={edge.score} />)
</TableCell>
</TableRow>
);
})}
Expand Down
11 changes: 11 additions & 0 deletions app/(app)/statistics/_components/ranking/score.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
export function ScoreDiff({ score }: { score: number }) {
if (score > 0) {
return <span className="text-green-800">+{score}</span>;
}

if (score < 0) {
return <span className="text-red-800">-{Math.abs(score)}</span>;
}

return <span className="text-gray-800">無變化</span>;
}
12 changes: 6 additions & 6 deletions gql/gql.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,8 +30,8 @@ type Documents = {
"\n query MaterialsSchemaContent($id: ID!) {\n database(id: $id) {\n id\n schema\n }\n }\n": typeof types.MaterialsSchemaContentDocument,
"\n query MaterialsSchema {\n databases {\n id\n ...MaterialsSchemaCard\n }\n }\n": typeof types.MaterialsSchemaDocument,
"\n query CompletedQuestions {\n me {\n id\n submissionStatistics {\n totalQuestions\n solvedQuestions\n }\n }\n }\n": typeof types.CompletedQuestionsDocument,
"\n query CompletedQuestionRanking($period: RankingPeriod!) {\n ranking(\n first: 10\n filter: { order: DESC, by: COMPLETED_QUESTIONS, period: $period }\n ) {\n edges {\n node {\n id\n name\n submissionStatistics {\n solvedQuestions\n }\n }\n }\n }\n }\n": typeof types.CompletedQuestionRankingDocument,
"\n query PointsRanking($period: RankingPeriod!) {\n ranking(first: 10, filter: { order: DESC, by: POINTS, period: $period }) {\n edges {\n node {\n id\n name\n totalPoints\n }\n }\n }\n }\n": typeof types.PointsRankingDocument,
"\n query CompletedQuestionRanking($period: RankingPeriod!) {\n ranking(\n first: 10\n filter: { order: DESC, by: COMPLETED_QUESTIONS, period: $period }\n ) {\n edges {\n node {\n id\n name\n submissionStatistics {\n solvedQuestions\n }\n }\n score\n }\n }\n }\n": typeof types.CompletedQuestionRankingDocument,
"\n query PointsRanking($period: RankingPeriod!) {\n ranking(first: 10, filter: { order: DESC, by: POINTS, period: $period }) {\n edges {\n node {\n id\n name\n totalPoints\n }\n score\n }\n }\n }\n": typeof types.PointsRankingDocument,
"\n query Points {\n me {\n id\n totalPoints\n\n points(first: 5, orderBy: { field: GRANTED_AT, direction: DESC }) {\n edges {\n node {\n id\n ...PointFragment\n }\n }\n }\n }\n }\n": typeof types.PointsDocument,
"\n fragment PointFragment on Point {\n description\n points\n }\n": typeof types.PointFragmentFragmentDoc,
"\n query ResolvedQuestions {\n me {\n id\n submissionStatistics {\n totalQuestions\n solvedQuestions\n }\n }\n }\n": typeof types.ResolvedQuestionsDocument,
Expand Down Expand Up @@ -60,8 +60,8 @@ const documents: Documents = {
"\n query MaterialsSchemaContent($id: ID!) {\n database(id: $id) {\n id\n schema\n }\n }\n": types.MaterialsSchemaContentDocument,
"\n query MaterialsSchema {\n databases {\n id\n ...MaterialsSchemaCard\n }\n }\n": types.MaterialsSchemaDocument,
"\n query CompletedQuestions {\n me {\n id\n submissionStatistics {\n totalQuestions\n solvedQuestions\n }\n }\n }\n": types.CompletedQuestionsDocument,
"\n query CompletedQuestionRanking($period: RankingPeriod!) {\n ranking(\n first: 10\n filter: { order: DESC, by: COMPLETED_QUESTIONS, period: $period }\n ) {\n edges {\n node {\n id\n name\n submissionStatistics {\n solvedQuestions\n }\n }\n }\n }\n }\n": types.CompletedQuestionRankingDocument,
"\n query PointsRanking($period: RankingPeriod!) {\n ranking(first: 10, filter: { order: DESC, by: POINTS, period: $period }) {\n edges {\n node {\n id\n name\n totalPoints\n }\n }\n }\n }\n": types.PointsRankingDocument,
"\n query CompletedQuestionRanking($period: RankingPeriod!) {\n ranking(\n first: 10\n filter: { order: DESC, by: COMPLETED_QUESTIONS, period: $period }\n ) {\n edges {\n node {\n id\n name\n submissionStatistics {\n solvedQuestions\n }\n }\n score\n }\n }\n }\n": types.CompletedQuestionRankingDocument,
"\n query PointsRanking($period: RankingPeriod!) {\n ranking(first: 10, filter: { order: DESC, by: POINTS, period: $period }) {\n edges {\n node {\n id\n name\n totalPoints\n }\n score\n }\n }\n }\n": types.PointsRankingDocument,
"\n query Points {\n me {\n id\n totalPoints\n\n points(first: 5, orderBy: { field: GRANTED_AT, direction: DESC }) {\n edges {\n node {\n id\n ...PointFragment\n }\n }\n }\n }\n }\n": types.PointsDocument,
"\n fragment PointFragment on Point {\n description\n points\n }\n": types.PointFragmentFragmentDoc,
"\n query ResolvedQuestions {\n me {\n id\n submissionStatistics {\n totalQuestions\n solvedQuestions\n }\n }\n }\n": types.ResolvedQuestionsDocument,
Expand Down Expand Up @@ -155,11 +155,11 @@ export function graphql(source: "\n query CompletedQuestions {\n me {\n
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n query CompletedQuestionRanking($period: RankingPeriod!) {\n ranking(\n first: 10\n filter: { order: DESC, by: COMPLETED_QUESTIONS, period: $period }\n ) {\n edges {\n node {\n id\n name\n submissionStatistics {\n solvedQuestions\n }\n }\n }\n }\n }\n"): (typeof documents)["\n query CompletedQuestionRanking($period: RankingPeriod!) {\n ranking(\n first: 10\n filter: { order: DESC, by: COMPLETED_QUESTIONS, period: $period }\n ) {\n edges {\n node {\n id\n name\n submissionStatistics {\n solvedQuestions\n }\n }\n }\n }\n }\n"];
export function graphql(source: "\n query CompletedQuestionRanking($period: RankingPeriod!) {\n ranking(\n first: 10\n filter: { order: DESC, by: COMPLETED_QUESTIONS, period: $period }\n ) {\n edges {\n node {\n id\n name\n submissionStatistics {\n solvedQuestions\n }\n }\n score\n }\n }\n }\n"): (typeof documents)["\n query CompletedQuestionRanking($period: RankingPeriod!) {\n ranking(\n first: 10\n filter: { order: DESC, by: COMPLETED_QUESTIONS, period: $period }\n ) {\n edges {\n node {\n id\n name\n submissionStatistics {\n solvedQuestions\n }\n }\n score\n }\n }\n }\n"];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n query PointsRanking($period: RankingPeriod!) {\n ranking(first: 10, filter: { order: DESC, by: POINTS, period: $period }) {\n edges {\n node {\n id\n name\n totalPoints\n }\n }\n }\n }\n"): (typeof documents)["\n query PointsRanking($period: RankingPeriod!) {\n ranking(first: 10, filter: { order: DESC, by: POINTS, period: $period }) {\n edges {\n node {\n id\n name\n totalPoints\n }\n }\n }\n }\n"];
export function graphql(source: "\n query PointsRanking($period: RankingPeriod!) {\n ranking(first: 10, filter: { order: DESC, by: POINTS, period: $period }) {\n edges {\n node {\n id\n name\n totalPoints\n }\n score\n }\n }\n }\n"): (typeof documents)["\n query PointsRanking($period: RankingPeriod!) {\n ranking(first: 10, filter: { order: DESC, by: POINTS, period: $period }) {\n edges {\n node {\n id\n name\n totalPoints\n }\n score\n }\n }\n }\n"];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
Expand Down
Loading