diff --git a/src/lib/misc.ts b/src/lib/misc.ts index 7dbcbeb54c..751cf8e508 100644 --- a/src/lib/misc.ts +++ b/src/lib/misc.ts @@ -656,7 +656,8 @@ export function getCurrentGameId() { return null; } -// x is a date, y is data for that date +// x is a date, y is data for that date +// sets y for the last date in the data array to null export function dropCurrentPeriod(data: { x: string; y: number | null }[]) { const newData = [...data]; if (newData.length > 0) { diff --git a/src/views/User/VoteActivityGraph.tsx b/src/views/User/VoteActivityGraph.tsx index 8d074d909a..9b375e588c 100644 --- a/src/views/User/VoteActivityGraph.tsx +++ b/src/views/User/VoteActivityGraph.tsx @@ -19,7 +19,7 @@ import React, { useEffect, useState } from "react"; import { get } from "@/lib/requests"; import * as data from "@/lib/data"; -import { ResponsiveLine } from "@nivo/line"; +import { ResponsiveLine, Serie } from "@nivo/line"; import { dropCurrentPeriod } from "@/lib/misc"; interface VoteCountPerDay { @@ -49,6 +49,7 @@ const VoteActivityGraph = ({ vote_data }: VoteActivityGraphProps) => { [key: string]: number; } = {}; + // Note: The vote_data.counts array is sorted by date in the backend vote_data.counts.forEach((day) => { const weekStart = startOfWeek(new Date(day.date)).toISOString().slice(0, 10); // Format as YYYY-MM-DD if (!aggregatedByWeek[weekStart]) { @@ -65,10 +66,17 @@ const VoteActivityGraph = ({ vote_data }: VoteActivityGraphProps) => { y: count, // y-axis will use the aggregated count })); + const completed_weeks = dropCurrentPeriod(data); + const current_week = data.pop(); + return [ { - id: "votes", - data: dropCurrentPeriod(data), + id: "weekly_votes", + data: completed_weeks, + }, + { + id: "current_week", + data: [current_week], }, ]; }, [vote_data]); @@ -88,13 +96,19 @@ const VoteActivityGraph = ({ vote_data }: VoteActivityGraphProps) => { return