From c16965a87aeeb9a5daf87a14f46ab3ad20d70459 Mon Sep 17 00:00:00 2001 From: Brian Douglas Date: Wed, 31 Jan 2024 19:29:20 -0800 Subject: [PATCH] feat: Clean up charts so it makes sense (sort of) (#33) * wip getting a zero based chart going * fixes closed totals * removed sorting * remove merged state * removes console.log * format * fixes build error * fix spacing * still fixing the build, merged error * indent eslint remove --- components/CIResponsiveLine.tsx | 6 +++--- hooks/useContributorData.ts | 2 +- lib/prCounts.ts | 35 ++++++++++----------------------- pages/[owner]/[repo]/index.tsx | 23 +++++++++++----------- 4 files changed, 25 insertions(+), 41 deletions(-) diff --git a/components/CIResponsiveLine.tsx b/components/CIResponsiveLine.tsx index a66af5d..858c377 100644 --- a/components/CIResponsiveLine.tsx +++ b/components/CIResponsiveLine.tsx @@ -13,7 +13,7 @@ const CIResponsiveLine = ({ data }: Datum) => { stacked: true, }} motionConfig="stiff" - curve="basis" + curve="linear" enableSlices="x" axisTop={null} isInteractive={true} @@ -48,10 +48,10 @@ const CIResponsiveLine = ({ data }: Datum) => { }} pointSize={0} pointColor={{ theme: "background" }} - enableGridX={false} + enableGridX={true} enableGridY={false} useMesh={true} - enableArea={false} + enableArea={true} enablePointLabel={false} colors={(d) => d.color} /> diff --git a/hooks/useContributorData.ts b/hooks/useContributorData.ts index 7346ee3..c2354d1 100644 --- a/hooks/useContributorData.ts +++ b/hooks/useContributorData.ts @@ -27,7 +27,7 @@ const useContributorData = ({ repo, startDate, status, limit, initialData }: que } query.set("repo", `${repo}`); - query.set("limit", "100"); + query.set("orderBy", "updated_at"); const baseEndpoint = "prs/search"; diff --git a/lib/prCounts.ts b/lib/prCounts.ts index 914b06f..1c10da6 100644 --- a/lib/prCounts.ts +++ b/lib/prCounts.ts @@ -1,5 +1,3 @@ -import { format, parse } from "date-fns"; - const count = (prData: DBContributorsPR[]): { mergedCount: number; closedCount: number; totalCount: number } => { const mergedCount = prData.filter((item) => item.pr_is_merged).length; // Merged PRs const closedCount = prData.filter((item) => item.pr_state === "closed").length; // Closed PRs @@ -14,21 +12,8 @@ const count = (prData: DBContributorsPR[]): { mergedCount: number; closedCount: }; const prPerDay = (open: DBContributorsPR[], closed: DBContributorsPR[]) => { - const sortedMergedPRs = closed.sort((a, b) => { - const aDate = new Date(a.pr_closed_at); - const bDate = new Date(b.pr_closed_at); - - return aDate.getTime() - bDate.getTime(); - }); - - const sortedOpenedPRs = open.sort((a, b) => { - const aDate = new Date(a.pr_created_at); - const bDate = new Date(b.pr_created_at); - - return aDate.getTime() - bDate.getTime(); - }); - const mergedPRsPerDay = sortedMergedPRs.reduce>((acc, item) => { - const mergedDate = format(new Date(item.pr_merged_at), "MM/dd/yyyy"); + const mergedPRsPerDay = closed.reduce>((acc, item) => { + const mergedDate = new Date(item.pr_merged_at).toLocaleDateString(); if (item.pr_is_merged) { if (!acc[mergedDate]) { @@ -40,8 +25,8 @@ const prPerDay = (open: DBContributorsPR[], closed: DBContributorsPR[]) => { return acc; }, {}); - const closedPRsPerDay = sortedMergedPRs.reduce>((acc, item) => { - const closedDate = format(new Date(item.pr_closed_at), "MM/dd/yyyy"); + const closedPRsPerDay = closed.reduce>((acc, item) => { + const closedDate = new Date(item.pr_closed_at).toLocaleDateString(); if (item.pr_is_merged === false) { if (!acc[closedDate]) { @@ -53,8 +38,8 @@ const prPerDay = (open: DBContributorsPR[], closed: DBContributorsPR[]) => { return acc; }, {}); - const openedPRsPerDay = sortedOpenedPRs.reduce>((acc, item) => { - const openedDate = format(new Date(item.pr_created_at), "MM/dd/yyyy"); + const openedPRsPerDay = open.reduce>((acc, item) => { + const openedDate = new Date(item.pr_updated_at).toLocaleDateString(); if (!acc[openedDate]) { acc[openedDate] = 0; @@ -73,17 +58,17 @@ const prPerDay = (open: DBContributorsPR[], closed: DBContributorsPR[]) => { { id: "Opened PRs", color: "#10b981", - data: openedPRs, + data: openedPRs.reverse(), }, { id: "Merged PRs", - color: "#A78BFA", - data: mergedPrs, + color: "#3b38f1", + data: mergedPrs.reverse(), }, { id: "Closed PRs", color: "#ef4444", - data: closedPRs, + data: closedPRs.reverse(), }, ]; }; diff --git a/pages/[owner]/[repo]/index.tsx b/pages/[owner]/[repo]/index.tsx index a3cd036..0037695 100644 --- a/pages/[owner]/[repo]/index.tsx +++ b/pages/[owner]/[repo]/index.tsx @@ -1,3 +1,4 @@ +/* eslint-disable indent */ import React from "react"; import { useRouter } from "next/router"; import dynamic from "next/dynamic"; @@ -20,7 +21,7 @@ export interface PaginatedDataResponse { interface StatsCardProps { type: "issue" | "pr"; count: number; - status: "open" | "closed" | "merged"; + status: "open" | "closed"; prevMonthCount?: number; } @@ -51,9 +52,7 @@ const StatsCard = ({ type, status, count, prevMonthCount }: StatsCardProps) => { > {IconMap[type][status]} -
- Pull Requests {status === "merged" || status === "closed" ? status : null} -
+
Pull Requests {status === "closed" ? status : null}
{count}
@@ -75,12 +74,12 @@ const StatsCard = ({ type, status, count, prevMonthCount }: StatsCardProps) => { const DataLabel = ({ label, type }: { label: string; type: "merged" | "closed" | "open" }) => { const getColorByType = (type: string) => { switch (type) { - case "merged": - return "bg-violet-400"; - case "closed": - return "bg-red-500"; - case "open": - return "bg-green-500"; + case "merged": + return "bg-violet-400"; + case "closed": + return "bg-red-500"; + case "open": + return "bg-green-500"; } }; @@ -147,14 +146,14 @@ const OwnerRepo = ({ /> pr.pr_is_merged === true).length} prevMonthCount={prevMonthClosedPrs ? prevMonthClosedPrsMeta.itemCount : undefined} /> item.pr_state === "close" && !item.pr_is_merged).length} + count={closedPrs.filter((item) => item.pr_state === "closed" && !item.pr_is_merged).length} prevMonthCount={prevMonthClosedPrsMeta ? prevMonthClosedPrsMeta.itemCount : undefined} />