From 19fd82e4e5a0988696ef9bee1237a3833c5f4621 Mon Sep 17 00:00:00 2001 From: abdullahxyz85 Date: Mon, 18 May 2026 18:17:09 +0500 Subject: [PATCH 1/5] feat: Add PR open time distribution histogram --- package-lock.json | 13 --- src/app/api/metrics/prs/route.ts | 84 ++++++++++++++--- src/components/PRMetrics.tsx | 152 ++++++++++++++++++++++++++----- 3 files changed, 201 insertions(+), 48 deletions(-) diff --git a/package-lock.json b/package-lock.json index 467c781..df0ab10 100644 --- a/package-lock.json +++ b/package-lock.json @@ -746,7 +746,6 @@ "integrity": "sha512-z9VXpC7MWrhfWipitjNdgCauoMLRdIILQsAEV+ZesIzBq/oUlxk0m3ApZuMFCXdnS4U7KrI+l3WRUEGQ8K1QKw==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@types/prop-types": "*", "csstype": "^3.2.2" @@ -1185,7 +1184,6 @@ "integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==", "dev": true, "license": "MIT", - "peer": true, "bin": { "acorn": "bin/acorn" }, @@ -1638,7 +1636,6 @@ } ], "license": "MIT", - "peer": true, "dependencies": { "baseline-browser-mapping": "^2.10.12", "caniuse-lite": "^1.0.30001782", @@ -2508,7 +2505,6 @@ "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/regexpp": "^4.6.1", @@ -2677,7 +2673,6 @@ "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@rtsao/scc": "^1.1.0", "array-includes": "^3.1.9", @@ -4118,7 +4113,6 @@ "integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==", "dev": true, "license": "MIT", - "peer": true, "bin": { "jiti": "bin/jiti.js" } @@ -4190,7 +4184,6 @@ "resolved": "https://registry.npmjs.org/jspdf/-/jspdf-4.2.1.tgz", "integrity": "sha512-YyAXyvnmjTbR4bHQRLzex3CuINCDlQnBqoSYyjJwTP2x9jDLuKDzy7aKUl0hgx3uhcl7xzg32agn5vlie6HIlQ==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.28.6", "fast-png": "^6.2.0", @@ -5033,7 +5026,6 @@ } ], "license": "MIT", - "peer": true, "dependencies": { "nanoid": "^3.3.11", "picocolors": "^1.1.1", @@ -5204,7 +5196,6 @@ "resolved": "https://registry.npmjs.org/preact/-/preact-10.29.1.tgz", "integrity": "sha512-gQCLc/vWroE8lIpleXtdJhTFDogTdZG9AjMUpVkDf2iTCNwYNWA+u16dL41TqUDJO4gm2IgrcMv3uTpjd4Pwmg==", "license": "MIT", - "peer": true, "funding": { "type": "opencollective", "url": "https://opencollective.com/preact" @@ -5295,7 +5286,6 @@ "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", "license": "MIT", - "peer": true, "dependencies": { "loose-envify": "^1.1.0" }, @@ -5308,7 +5298,6 @@ "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", "license": "MIT", - "peer": true, "dependencies": { "loose-envify": "^1.1.0", "scheduler": "^0.23.2" @@ -6362,7 +6351,6 @@ "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==", "dev": true, "license": "MIT", - "peer": true, "engines": { "node": ">=12" }, @@ -6532,7 +6520,6 @@ "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==", "dev": true, "license": "Apache-2.0", - "peer": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" diff --git a/src/app/api/metrics/prs/route.ts b/src/app/api/metrics/prs/route.ts index fb28df2..b49839c 100644 --- a/src/app/api/metrics/prs/route.ts +++ b/src/app/api/metrics/prs/route.ts @@ -19,13 +19,27 @@ interface PRMetricsBase { mergeRate: number; } -async function fetchPRMetrics(token: string): Promise { +interface PRTimeDistribution { + lessThan1h: number; + from1hTo24h: number; + from1dTo7d: number; + moreThan7d: number; +} + +async function fetchPRMetrics( + token: string, + days: number = 30, +): Promise { + const since = new Date(); + since.setDate(since.getDate() - days); + const sinceStr = `${since.getFullYear()}-${String(since.getMonth() + 1).padStart(2, "0")}-${String(since.getDate()).padStart(2, "0")}`; + const searchRes = await fetch( - `${GITHUB_API}/search/issues?q=type:pr+author:@me&per_page=100`, + `${GITHUB_API}/search/issues?q=type:pr+author:@me+created:>=${sinceStr}&per_page=100`, { headers: { Authorization: `Bearer ${token}` }, cache: "no-store", - } + }, ); if (!searchRes.ok) { @@ -34,7 +48,11 @@ async function fetchPRMetrics(token: string): Promise { const data = (await searchRes.json()) as { total_count: number; - items: Array<{ state: string; created_at: string; closed_at: string | null }>; + items: Array<{ + state: string; + created_at: string; + closed_at: string | null; + }>; }; const open = data.items.filter((pr) => pr.state === "open").length; @@ -48,29 +66,58 @@ async function fetchPRMetrics(token: string): Promise { sum + (new Date(pr.closed_at!).getTime() - new Date(pr.created_at).getTime()), - 0 + 0, ) / closedPRs.length : 0; + // Calculate time distribution + const timeDistribution: PRTimeDistribution = { + lessThan1h: 0, + from1hTo24h: 0, + from1dTo7d: 0, + moreThan7d: 0, + }; + + for (const pr of closedPRs) { + const durationMs = + new Date(pr.closed_at!).getTime() - new Date(pr.created_at).getTime(); + + if (durationMs < 3600000) { + // Less than 1 hour + timeDistribution.lessThan1h++; + } else if (durationMs < 86400000) { + // 1 hour to 24 hours + timeDistribution.from1hTo24h++; + } else if (durationMs < 604800000) { + // 1 day to 7 days + timeDistribution.from1dTo7d++; + } else { + // More than 7 days + timeDistribution.moreThan7d++; + } + } + return { open, merged, total: data.total_count, avgReviewHours: Math.round(avgReviewMs / 3600000), mergeRate: data.total_count > 0 ? merged / data.total_count : 0, + timeDistribution, }; } -function formatPRMetrics(metrics: PRMetricsBase) { +function formatPRMetrics( + metrics: PRMetricsBase & { timeDistribution: PRTimeDistribution }, +) { return { open: metrics.open, merged: metrics.merged, total: metrics.total, avgReviewHours: metrics.avgReviewHours, mergeRate: - metrics.total > 0 - ? `${Math.round(metrics.mergeRate * 100)}%` - : "0%", + metrics.total > 0 ? `${Math.round(metrics.mergeRate * 100)}%` : "0%", + timeDistribution: metrics.timeDistribution, }; } @@ -81,10 +128,11 @@ export async function GET(req: NextRequest) { } const accountId = req.nextUrl.searchParams.get("accountId"); + const days = Number(req.nextUrl.searchParams.get("days")) || 30; if (!accountId) { try { - const result = await fetchPRMetrics(session.accessToken); + const result = await fetchPRMetrics(session.accessToken, days); return Response.json(formatPRMetrics(result)); } catch { return Response.json({ error: "GitHub API error" }, { status: 502 }); @@ -112,11 +160,11 @@ export async function GET(req: NextRequest) { githubId: session.githubId, githubLogin: session.githubLogin, }, - userRow.id + userRow.id, ); const results = await Promise.allSettled( - accounts.map((account) => fetchPRMetrics(account.token)) + accounts.map((account) => fetchPRMetrics(account.token, days)), ); const merged = mergeMetrics(results, (a, b) => { @@ -134,6 +182,16 @@ export async function GET(req: NextRequest) { avgReviewHours: Math.round(avgReviewHours * 10) / 10, mergeRate: total > 0 ? Math.round((mergedCount / total) * 100) / 100 : 0, + timeDistribution: { + lessThan1h: + a.timeDistribution.lessThan1h + b.timeDistribution.lessThan1h, + from1hTo24h: + a.timeDistribution.from1hTo24h + b.timeDistribution.from1hTo24h, + from1dTo7d: + a.timeDistribution.from1dTo7d + b.timeDistribution.from1dTo7d, + moreThan7d: + a.timeDistribution.moreThan7d + b.timeDistribution.moreThan7d, + }, }; }); @@ -154,7 +212,7 @@ export async function GET(req: NextRequest) { } try { - const result = await fetchPRMetrics(token); + const result = await fetchPRMetrics(token, days); return Response.json(formatPRMetrics(result)); } catch { return Response.json({ error: "GitHub API error" }, { status: 502 }); diff --git a/src/components/PRMetrics.tsx b/src/components/PRMetrics.tsx index 990d13f..1f5026e 100644 --- a/src/components/PRMetrics.tsx +++ b/src/components/PRMetrics.tsx @@ -1,15 +1,39 @@ "use client"; import { useCallback, useEffect, useState } from "react"; +import { + BarChart, + Bar, + XAxis, + YAxis, + CartesianGrid, + Tooltip, + ResponsiveContainer, +} from "recharts"; import { useAccount } from "@/components/AccountContext"; +interface TimeDistribution { + lessThan1h: number; + from1hTo24h: number; + from1dTo7d: number; + moreThan7d: number; +} + interface PRData { open: number; merged: number; avgReviewHours: number; mergeRate: string; + timeDistribution: TimeDistribution; } +const BUCKET_LABELS: Record = { + lessThan1h: "< 1h", + from1hTo24h: "1–24h", + from1dTo7d: "1–7d", + moreThan7d: "> 7d", +}; + export default function PRMetrics() { const { selectedAccount } = useAccount(); const [metrics, setMetrics] = useState(null); @@ -22,8 +46,8 @@ export default function PRMetrics() { const url = selectedAccount !== null - ? `/api/metrics/prs?accountId=${encodeURIComponent(selectedAccount)}` - : "/api/metrics/prs"; + ? `/api/metrics/prs?accountId=${encodeURIComponent(selectedAccount)}&days=30` + : "/api/metrics/prs?days=30"; fetch(url) .then((r) => { @@ -31,7 +55,11 @@ export default function PRMetrics() { return r.json(); }) .then((data: PRData) => setMetrics(data)) - .catch(() => setError("We couldn't load your PR analytics right now. Please try again in a moment.")) + .catch(() => + setError( + "We couldn't load your PR analytics right now. Please try again in a moment.", + ), + ) .finally(() => setLoading(false)); }, [selectedAccount]); @@ -48,17 +76,44 @@ export default function PRMetrics() { ] : []; + // Prepare histogram data + const histogramData = metrics + ? [ + { + bucket: BUCKET_LABELS.lessThan1h, + count: metrics.timeDistribution.lessThan1h, + }, + { + bucket: BUCKET_LABELS.from1hTo24h, + count: metrics.timeDistribution.from1hTo24h, + }, + { + bucket: BUCKET_LABELS.from1dTo7d, + count: metrics.timeDistribution.from1dTo7d, + }, + { + bucket: BUCKET_LABELS.moreThan7d, + count: metrics.timeDistribution.moreThan7d, + }, + ] + : []; + return (
-

PR Analytics

+

+ PR Analytics +

{loading ? ( -
- {[1, 2, 3, 4].map((i) => ( -
- ))} +
+
+ {[1, 2, 3, 4].map((i) => ( +
+ ))} +
+
) : error ? (
@@ -72,18 +127,71 @@ export default function PRMetrics() {
) : ( -
- {stats.map((stat) => ( -
-
- {stat.value} +
+
+ {stats.map((stat) => ( +
+
+ {stat.value} +
+
+ {stat.label} +
+
+ ))} +
+ + {/* PR Open Time Distribution Histogram */} +
+

+ PR Open Time Distribution (30d) +

+ {histogramData.some((item) => item.count > 0) ? ( +
+ + + + + + [`${value} PRs`, "Count"]} + /> + + + +
+ ) : ( +
+

No PR data available

-
{stat.label}
-
- ))} + )} +
)}
From 0ae9b084c5e6ed6231359e599cfa9ad3e5612a9b Mon Sep 17 00:00:00 2001 From: abdullahxyz85 Date: Mon, 18 May 2026 18:44:38 +0500 Subject: [PATCH 2/5] feat: Add commit diff size trend chart --- src/app/api/metrics/diff-trend/route.ts | 230 ++++++++++++++++++++++++ src/app/dashboard/page.tsx | 6 +- src/app/globals.css | 8 +- src/components/DiffTrendChart.tsx | 172 ++++++++++++++++++ 4 files changed, 414 insertions(+), 2 deletions(-) create mode 100644 src/app/api/metrics/diff-trend/route.ts create mode 100644 src/components/DiffTrendChart.tsx diff --git a/src/app/api/metrics/diff-trend/route.ts b/src/app/api/metrics/diff-trend/route.ts new file mode 100644 index 0000000..71a4807 --- /dev/null +++ b/src/app/api/metrics/diff-trend/route.ts @@ -0,0 +1,230 @@ +import { getServerSession } from "next-auth"; +import { NextRequest } from "next/server"; +import { authOptions } from "@/lib/auth"; +import { getAccountToken, getAllAccounts } from "@/lib/github-accounts"; +import { GITHUB_API } from "@/lib/github"; +import { supabaseAdmin } from "@/lib/supabase"; + +export const dynamic = "force-dynamic"; + +interface WeekData { + week: string; + additions: number; + deletions: number; +} + +async function fetchRepoStats( + token: string, + owner: string, + repo: string, +): Promise { + const res = await fetch( + `${GITHUB_API}/repos/${owner}/${repo}/stats/code_frequency`, + { + headers: { Authorization: `Bearer ${token}` }, + cache: "no-store", + }, + ); + + // 202 means GitHub is still computing the stats + if (res.status === 202) { + return []; + } + + if (!res.ok) { + throw new Error(`GitHub API error: ${res.status}`); + } + + const data = (await res.json()) as Array<[number, number, number]>; + + // Convert to WeekData format (last 12 weeks) + const weeks: WeekData[] = []; + const now = Math.floor(Date.now() / 1000); + const twelveWeeksAgo = now - 12 * 7 * 24 * 60 * 60; + + for (const [timestamp, additions, deletions] of data) { + if (timestamp >= twelveWeeksAgo) { + const date = new Date(timestamp * 1000); + weeks.push({ + week: date.toISOString().split("T")[0], + additions, + deletions, + }); + } + } + + return weeks; +} + +async function getUserTopRepos(token: string, githubLogin: string) { + const res = await fetch( + `${GITHUB_API}/users/${githubLogin}/repos?sort=updated&per_page=5&type=owner`, + { + headers: { Authorization: `Bearer ${token}` }, + cache: "no-store", + }, + ); + + if (!res.ok) { + throw new Error("GitHub API error"); + } + + const repos = (await res.json()) as Array<{ + name: string; + owner: { login: string }; + }>; + + return repos.slice(0, 3).map((r) => ({ + name: r.name, + owner: r.owner.login, + })); +} + +function aggregateWeeks(allWeeks: WeekData[][]): { + weeks: WeekData[]; + isComputing: boolean; +} { + const weekMap = new Map(); + let hasEmptyResponse = false; + + for (const weeks of allWeeks) { + if (weeks.length === 0) { + hasEmptyResponse = true; + continue; + } + + for (const week of weeks) { + const existing = weekMap.get(week.week) || { + additions: 0, + deletions: 0, + }; + weekMap.set(week.week, { + additions: existing.additions + week.additions, + deletions: existing.deletions + week.deletions, + }); + } + } + + const sorted = Array.from(weekMap.entries()) + .sort(([a], [b]) => a.localeCompare(b)) + .map(([week, { additions, deletions }]) => ({ + week, + additions, + deletions, + })); + + return { + weeks: sorted, + isComputing: hasEmptyResponse && sorted.length === 0, + }; +} + +export async function GET(req: NextRequest) { + const session = await getServerSession(authOptions); + if (!session?.accessToken || !session.githubLogin) { + return Response.json({ error: "Unauthorized" }, { status: 401 }); + } + + const accountId = req.nextUrl.searchParams.get("accountId"); + + try { + if (!accountId) { + // Fetch for main account + const repos = await getUserTopRepos( + session.accessToken, + session.githubLogin, + ); + + const repoStats = await Promise.all( + repos.map((repo) => + fetchRepoStats(session.accessToken, repo.owner, repo.name), + ), + ); + + const { weeks, isComputing } = aggregateWeeks(repoStats); + + return Response.json({ + weeks: weeks.length > 0 ? weeks : [], + isComputing, + repoCount: repos.length, + }); + } + + // Handle multiple accounts + if (!session.githubId) { + return Response.json({ error: "Unauthorized" }, { status: 401 }); + } + + const { data: userRow } = await supabaseAdmin + .from("users") + .select("id") + .eq("github_id", session.githubId) + .single(); + + if (!userRow) { + return Response.json({ error: "Unauthorized" }, { status: 401 }); + } + + if (accountId === "combined") { + const accounts = await getAllAccounts( + { + token: session.accessToken, + githubId: session.githubId, + githubLogin: session.githubLogin, + }, + userRow.id, + ); + + const allRepoStats: WeekData[][] = []; + + for (const account of accounts) { + try { + const repos = await getUserTopRepos(account.token, account.login); + const repoStats = await Promise.all( + repos.map((repo) => + fetchRepoStats(account.token, repo.owner, repo.name), + ), + ); + allRepoStats.push(...repoStats); + } catch { + // Skip this account if it fails + } + } + + const { weeks, isComputing } = aggregateWeeks(allRepoStats); + + return Response.json({ + weeks: weeks.length > 0 ? weeks : [], + isComputing, + repoCount: accounts.length, + }); + } + + const token = + accountId === session.githubId + ? session.accessToken + : await getAccountToken(userRow.id, accountId); + + if (!token) { + return Response.json({ error: "Account not found" }, { status: 404 }); + } + + const repos = await getUserTopRepos(token, accountId); + const repoStats = await Promise.all( + repos.map((repo) => fetchRepoStats(token, repo.owner, repo.name)), + ); + + const { weeks, isComputing } = aggregateWeeks(repoStats); + + return Response.json({ + weeks: weeks.length > 0 ? weeks : [], + isComputing, + repoCount: repos.length, + }); + } catch { + return Response.json( + { error: "Failed to fetch diff trend data" }, + { status: 502 }, + ); + } +} diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx index 9e4bdb6..fb4c477 100644 --- a/src/app/dashboard/page.tsx +++ b/src/app/dashboard/page.tsx @@ -15,6 +15,7 @@ import FriendComparison from "@/components/FriendComparison"; import WeeklySummaryCard from "@/components/WeeklySummaryCard"; import ExportButton from "@/components/ExportButton"; import PersonalRecords from "@/components/PersonalRecords"; +import DiffTrendChart from "@/components/DiffTrendChart"; import { authOptions } from "@/lib/auth"; import { getServerSession } from "next-auth"; import { redirect } from "next/navigation"; @@ -47,6 +48,9 @@ export default async function DashboardPage() {
+
+ +
@@ -80,4 +84,4 @@ export default async function DashboardPage() {
); -} \ No newline at end of file +} diff --git a/src/app/globals.css b/src/app/globals.css index 8288819..f9a16b7 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -18,6 +18,8 @@ --control-hover: #cbd5e1; --tooltip: #ffffff; --tooltip-foreground: #0f172a; + --success: #10b981; + --destructive: #ef4444; } .dark { @@ -36,10 +38,14 @@ --control-hover: #475569; --tooltip: #1e293b; --tooltip-foreground: #f8fafc; + --success: #34d399; + --destructive: #f87171; } body { background: var(--background); color: var(--foreground); - transition: background-color 200ms ease, color 200ms ease; + transition: + background-color 200ms ease, + color 200ms ease; } diff --git a/src/components/DiffTrendChart.tsx b/src/components/DiffTrendChart.tsx new file mode 100644 index 0000000..3047571 --- /dev/null +++ b/src/components/DiffTrendChart.tsx @@ -0,0 +1,172 @@ +"use client"; + +import { useCallback, useEffect, useState } from "react"; +import { + BarChart, + Bar, + XAxis, + YAxis, + CartesianGrid, + Tooltip, + Legend, + ResponsiveContainer, +} from "recharts"; +import { useAccount } from "@/components/AccountContext"; + +interface WeekData { + week: string; + additions: number; + deletions: number; +} + +interface DiffTrendData { + weeks: WeekData[]; + isComputing: boolean; + repoCount: number; +} + +export default function DiffTrendChart() { + const { selectedAccount } = useAccount(); + const [data, setData] = useState([]); + const [loading, setLoading] = useState(true); + const [error, setError] = useState(null); + const [isComputing, setIsComputing] = useState(false); + const [repoCount, setRepoCount] = useState(0); + + const fetchDiffTrend = useCallback(() => { + setLoading(true); + setError(null); + setIsComputing(false); + + const url = + selectedAccount !== null + ? `/api/metrics/diff-trend?accountId=${encodeURIComponent(selectedAccount)}` + : "/api/metrics/diff-trend"; + + fetch(url) + .then((r) => { + if (!r.ok) throw new Error("API error"); + return r.json(); + }) + .then((res: DiffTrendData) => { + setData(res.weeks || []); + setIsComputing(res.isComputing); + setRepoCount(res.repoCount || 0); + }) + .catch(() => + setError( + "We couldn't load your diff trend data. Please try again in a moment.", + ), + ) + .finally(() => setLoading(false)); + }, [selectedAccount]); + + useEffect(() => { + fetchDiffTrend(); + }, [fetchDiffTrend]); + + // Format week date for display + const chartData = data.map((d) => { + const date = new Date(d.week); + const formatted = `${date.toLocaleDateString("en-US", { + month: "short", + day: "numeric", + })}`; + return { + week: formatted, + additions: d.additions, + deletions: d.deletions, + }; + }); + + return ( +
+

+ Code Change Trend +

+

+ Lines added/removed per week (last 12 weeks, top {repoCount} repos) +

+ + {loading ? ( +
+ ) : error ? ( +
+

{error}

+ +
+ ) : isComputing ? ( +
+
+
+
+
+

Computing statistics...

+

+ GitHub is analyzing repository data (this happens once per day) +

+
+
+ ) : chartData.length === 0 ? ( +
+

No data available yet

+
+ ) : ( +
+ + + + + + { + if (name === "additions") { + return [`${value} added`, "Additions"]; + } + return [`${value} removed`, "Deletions"]; + }} + separator=": " + /> + + + + + +
+ )} +
+ ); +} From 64603effe9b84f818d90dfc1c1053e79586b2f2a Mon Sep 17 00:00:00 2001 From: abdullahxyz85 Date: Tue, 19 May 2026 17:55:08 +0500 Subject: [PATCH 3/5] feat: Add commit diff size trend chart [cleaned] --- src/app/api/metrics/prs/route.ts | 248 -------------- src/app/dashboard/settings/page.tsx | 487 ---------------------------- src/components/PRMetrics.tsx | 211 ------------ src/components/UserAvatar.tsx | 40 --- 4 files changed, 986 deletions(-) delete mode 100644 src/app/api/metrics/prs/route.ts delete mode 100644 src/app/dashboard/settings/page.tsx delete mode 100644 src/components/PRMetrics.tsx delete mode 100644 src/components/UserAvatar.tsx diff --git a/src/app/api/metrics/prs/route.ts b/src/app/api/metrics/prs/route.ts deleted file mode 100644 index ccb010b..0000000 --- a/src/app/api/metrics/prs/route.ts +++ /dev/null @@ -1,248 +0,0 @@ -import { getServerSession } from "next-auth"; -import { NextRequest } from "next/server"; -import { authOptions } from "@/lib/auth"; -import { - getAccountToken, - getAllAccounts, - mergeMetrics, -} from "@/lib/github-accounts"; -import { GITHUB_API } from "@/lib/github"; -import { supabaseAdmin } from "@/lib/supabase"; - -export const dynamic = "force-dynamic"; - -interface PRMetricsBase { - open: number; - merged: number; - total: number; - avgReviewHours: number; - mergeRate: number; -} - -interface PRTimeDistribution { - lessThan1h: number; - from1hTo24h: number; - from1dTo7d: number; - moreThan7d: number; -} - -async function fetchPRMetrics( - token: string, - days: number = 30, -): Promise { - const since = new Date(); - since.setDate(since.getDate() - days); - const sinceStr = `${since.getFullYear()}-${String(since.getMonth() + 1).padStart(2, "0")}-${String(since.getDate()).padStart(2, "0")}`; - - const searchRes = await fetch( - `${GITHUB_API}/search/issues?q=type:pr+author:@me+created:>=${sinceStr}&per_page=100`, - { - headers: { Authorization: `Bearer ${token}` }, - cache: "no-store", - }, - ); - - if (!searchRes.ok) { - throw new Error("GitHub API error"); - } - - const data = (await searchRes.json()) as { - total_count: number; - items: Array<{ - state: string; - created_at: string; - closed_at: string | null; - // GitHub Search API includes a pull_request object on PR items. - // merged_at is non-null only when the PR was actually merged, as - // opposed to closed without merging. - pull_request?: { merged_at: string | null }; - }>; - }; - - const open = data.items.filter((pr) => pr.state === "open").length; - - // A PR with state "closed" may have been merged OR closed without merging - // (e.g. rejected, abandoned). Only count those with a non-null merged_at - // as truly merged so the dashboard does not inflate the merged count. - const merged = data.items.filter( - (pr) => pr.pull_request?.merged_at != null - ).length; - - // Average review time: use only actually merged PRs so we measure the time - // from open to merge, not open to close-without-merge. - const mergedPRs = data.items.filter( - (pr) => pr.pull_request?.merged_at != null - ); - const avgReviewMs = - mergedPRs.length > 0 - ? mergedPRs.reduce( - (sum, pr) => - sum + - (new Date(pr.pull_request!.merged_at!).getTime() - - new Date(pr.created_at).getTime()), - 0, - ) / closedPRs.length - : 0; - - // Calculate time distribution - const timeDistribution: PRTimeDistribution = { - lessThan1h: 0, - from1hTo24h: 0, - from1dTo7d: 0, - moreThan7d: 0, - }; - - for (const pr of closedPRs) { - const durationMs = - new Date(pr.closed_at!).getTime() - new Date(pr.created_at).getTime(); - - if (durationMs < 3600000) { - // Less than 1 hour - timeDistribution.lessThan1h++; - } else if (durationMs < 86400000) { - // 1 hour to 24 hours - timeDistribution.from1hTo24h++; - } else if (durationMs < 604800000) { - // 1 day to 7 days - timeDistribution.from1dTo7d++; - } else { - // More than 7 days - timeDistribution.moreThan7d++; - } - } -======= - 0 - ) / mergedPRs.length - : 0; - - // Use the number of fetched items as the denominator for mergeRate. - // data.total_count is the all-time GitHub total (potentially thousands) - // while data.items is capped at 100, so dividing merged/total_count - // produces a near-zero rate for any active user. The fetched sample - // (open + merged + closed-without-merge) is the correct base. - const sampleTotal = data.items.length; - - return { - open, - merged, - total: data.total_count, - avgReviewHours: Math.round(avgReviewMs / 3600000), - - mergeRate: data.total_count > 0 ? merged / data.total_count : 0, - timeDistribution, - - mergeRate: sampleTotal > 0 ? merged / sampleTotal : 0, - }; -} - -function formatPRMetrics( - metrics: PRMetricsBase & { timeDistribution: PRTimeDistribution }, -) { - return { - open: metrics.open, - merged: metrics.merged, - total: metrics.total, - avgReviewHours: metrics.avgReviewHours, - mergeRate: - metrics.total > 0 ? `${Math.round(metrics.mergeRate * 100)}%` : "0%", - timeDistribution: metrics.timeDistribution, - }; -} - -export async function GET(req: NextRequest) { - const session = await getServerSession(authOptions); - if (!session?.accessToken) { - return Response.json({ error: "Unauthorized" }, { status: 401 }); - } - - const accountId = req.nextUrl.searchParams.get("accountId"); - const days = Number(req.nextUrl.searchParams.get("days")) || 30; - - if (!accountId) { - try { - const result = await fetchPRMetrics(session.accessToken, days); - return Response.json(formatPRMetrics(result)); - } catch { - return Response.json({ error: "GitHub API error" }, { status: 502 }); - } - } - - if (!session.githubId || !session.githubLogin) { - return Response.json({ error: "Unauthorized" }, { status: 401 }); - } - - const { data: userRow } = await supabaseAdmin - .from("users") - .select("id") - .eq("github_id", session.githubId) - .single(); - - if (!userRow) { - return Response.json({ error: "Unauthorized" }, { status: 401 }); - } - - if (accountId === "combined") { - const accounts = await getAllAccounts( - { - token: session.accessToken, - githubId: session.githubId, - githubLogin: session.githubLogin, - }, - userRow.id, - ); - - const results = await Promise.allSettled( - accounts.map((account) => fetchPRMetrics(account.token, days)), - ); - - const merged = mergeMetrics(results, (a, b) => { - const total = a.total + b.total; - const mergedCount = a.merged + b.merged; - const avgReviewHours = - total > 0 - ? (a.avgReviewHours * a.total + b.avgReviewHours * b.total) / total - : 0; - - return { - open: a.open + b.open, - merged: mergedCount, - total, - avgReviewHours: Math.round(avgReviewHours * 10) / 10, - mergeRate: - total > 0 ? Math.round((mergedCount / total) * 100) / 100 : 0, - timeDistribution: { - lessThan1h: - a.timeDistribution.lessThan1h + b.timeDistribution.lessThan1h, - from1hTo24h: - a.timeDistribution.from1hTo24h + b.timeDistribution.from1hTo24h, - from1dTo7d: - a.timeDistribution.from1dTo7d + b.timeDistribution.from1dTo7d, - moreThan7d: - a.timeDistribution.moreThan7d + b.timeDistribution.moreThan7d, - }, - }; - }); - - if (!merged) { - return Response.json({ error: "GitHub API error" }, { status: 502 }); - } - - return Response.json(formatPRMetrics(merged)); - } - - const token = - accountId === session.githubId - ? session.accessToken - : await getAccountToken(userRow.id, accountId); - - if (!token) { - return Response.json({ error: "Account not found" }, { status: 404 }); - } - - try { - const result = await fetchPRMetrics(token, days); - return Response.json(formatPRMetrics(result)); - } catch { - return Response.json({ error: "GitHub API error" }, { status: 502 }); - } -} diff --git a/src/app/dashboard/settings/page.tsx b/src/app/dashboard/settings/page.tsx deleted file mode 100644 index e1dd740..0000000 --- a/src/app/dashboard/settings/page.tsx +++ /dev/null @@ -1,487 +0,0 @@ -"use client"; - -import { Suspense, useEffect, useMemo, useState } from "react"; -import { useSession } from "next-auth/react"; -import { redirect, useSearchParams } from "next/navigation"; -import { useHeatmapTheme } from "@/hooks/useHeatmapTheme"; - -interface UserSettings { - id: string; - github_login: string; - is_public: boolean; -} - -interface LinkedAccount { - id: string; - githubId: string; - githubLogin: string; - addedAt: string; -} - -interface AccountsResponse { - accounts: LinkedAccount[]; -} - -function formatAddedDate(addedAt: string): string { - return `Added ${new Date(addedAt).toLocaleDateString("en-US", { - month: "short", - day: "numeric", - year: "numeric", - })}`; -} - -function getStatusMessage( - success: string | null, - error: string | null -): { kind: "success" | "error"; message: string } | null { - if (success === "account_linked") { - return { - kind: "success", - message: "Account linked successfully", - }; - } - - if (!error) { - return null; - } - - if (error === "already_linked") { - return { - kind: "error", - message: "This account is already linked", - }; - } - - if (error === "cannot_link_primary_account") { - return { - kind: "error", - message: "You cannot link your primary account", - }; - } - - if (error === "invalid_state") { - return { - kind: "error", - message: "Link failed: invalid state. Please try again.", - }; - } - - if (error === "oauth_cancelled") { - return { - kind: "error", - message: "Account linking was cancelled", - }; - } - - return { - kind: "error", - message: "Account linking failed. Please try again.", - }; -} - -function SettingsPageFallback() { - return ( -
-
-
-
-
- {[1, 2, 3].map((i) => ( -
- ))} -
-
-
-
- ); -} - -function SettingsPageContent() { - const { data: session, status } = useSession(); - const searchParams = useSearchParams(); - const [settings, setSettings] = useState(null); - const [linkedAccounts, setLinkedAccounts] = useState([]); - const [loading, setLoading] = useState(true); - const [accountsLoading, setAccountsLoading] = useState(true); - const [saving, setSaving] = useState(false); - const [copied, setCopied] = useState(false); - const [removeError, setRemoveError] = useState(null); - const [removingAccountId, setRemovingAccountId] = useState( - null - ); - - const statusMessage = useMemo( - () => - getStatusMessage( - searchParams.get("success"), - searchParams.get("error") - ), - [searchParams] - ); - - const { theme, setTheme } = useHeatmapTheme(); - - // Redirect to signin if not authenticated - useEffect(() => { - if (status === "unauthenticated") { - redirect("/"); - } - }, [status]); - - // Load settings on mount - useEffect(() => { - if (status !== "authenticated" || !session?.githubLogin) { - return; - } - - async function loadSettings() { - try { - const res = await fetch("/api/user/settings"); - if (res.ok) { - const data = await res.json(); - setSettings(data); - } - } catch (error) { - console.error("Failed to load settings:", error); - } finally { - setLoading(false); - } - } - - loadSettings(); - }, [session, status]); - - useEffect(() => { - if (status !== "authenticated" || !session?.githubLogin) { - return; - } - - async function loadLinkedAccounts() { - try { - const res = await fetch("/api/user/github-accounts"); - if (!res.ok) { - setLinkedAccounts([]); - return; - } - - const data = (await res.json()) as AccountsResponse; - setLinkedAccounts(data.accounts ?? []); - } catch (error) { - console.error("Failed to load linked accounts:", error); - setLinkedAccounts([]); - } finally { - setAccountsLoading(false); - } - } - - loadLinkedAccounts(); - }, [session, status]); - - const handleTogglePublic = async (value: boolean) => { - if (!settings) return; - - setSaving(true); - try { - const res = await fetch("/api/user/settings", { - method: "PATCH", - headers: { "Content-Type": "application/json" }, - body: JSON.stringify({ is_public: value }), - }); - - if (res.ok) { - const updated = await res.json(); - setSettings(updated); - } else { - console.error("Failed to update settings"); - } - } catch (error) { - console.error("Error updating settings:", error); - } finally { - setSaving(false); - } - }; - - const copyShareLink = () => { - if (!settings) return; - const link = `${window.location.origin}/u/${settings.github_login}`; - navigator.clipboard.writeText(link).then(() => { - setCopied(true); - setTimeout(() => setCopied(false), 2000); - }).catch(() => { }); - }; - - const handleRemoveAccount = async (githubId: string) => { - setRemoveError(null); - setRemovingAccountId(githubId); - - try { - const res = await fetch(`/api/user/github-accounts/${githubId}`, { - method: "DELETE", - }); - - if (!res.ok) { - const data = (await res.json()) as { error?: string }; - setRemoveError(data.error ?? "Failed to remove account"); - return; - } - - setLinkedAccounts((current) => - current.filter((account) => account.githubId !== githubId) - ); - } catch { - setRemoveError("Failed to remove account"); - } finally { - setRemovingAccountId(null); - } - }; - - if (status === "loading" || loading) { - return ( -
-
-
-
-
- {[1, 2, 3].map((i) => ( -
- ))} -
-
-
-
- ); - } - - if (!settings) { - return ( -
-
-

- Failed to load settings. -

-
-
- ); - } - - return ( -
-
-
-

- Settings -

-

- Manage your profile and preferences -

-
- - {statusMessage && ( -
- {statusMessage.message} -
- )} - - {/* Public Profile Section */} -
-
-
-

- Public Profile -

-

- Share your GitHub stats with a public profile link -

-
- - {/* Toggle Switch */} -
- ); -} - -export default function SettingsPage() { - return ( - }> - - - ); -} diff --git a/src/components/PRMetrics.tsx b/src/components/PRMetrics.tsx deleted file mode 100644 index f8ed88f..0000000 --- a/src/components/PRMetrics.tsx +++ /dev/null @@ -1,211 +0,0 @@ -"use client"; - -import { useCallback, useEffect, useState } from "react"; -import { - BarChart, - Bar, - XAxis, - YAxis, - CartesianGrid, - Tooltip, - ResponsiveContainer, -} from "recharts"; -import { useAccount } from "@/components/AccountContext"; - -interface TimeDistribution { - lessThan1h: number; - from1hTo24h: number; - from1dTo7d: number; - moreThan7d: number; -} - -interface PRData { - open: number; - merged: number; - avgReviewHours: number; - mergeRate: string; - timeDistribution: TimeDistribution; -} - -const BUCKET_LABELS: Record = { - lessThan1h: "< 1h", - from1hTo24h: "1–24h", - from1dTo7d: "1–7d", - moreThan7d: "> 7d", -}; - -export default function PRMetrics() { - const { selectedAccount } = useAccount(); - const [metrics, setMetrics] = useState(null); - const [loading, setLoading] = useState(true); - const [error, setError] = useState(null); - - const fetchMetrics = useCallback(() => { - setLoading(true); - setError(null); - - const url = - selectedAccount !== null - ? `/api/metrics/prs?accountId=${encodeURIComponent(selectedAccount)}&days=30` - : "/api/metrics/prs?days=30"; - - fetch(url) - .then((r) => { - if (!r.ok) throw new Error("API error"); - return r.json(); - }) - .then((data: PRData) => setMetrics(data)) - .catch(() => - setError( - "We couldn't load your PR analytics right now. Please try again in a moment.", - ), - ) - .finally(() => setLoading(false)); - }, [selectedAccount]); - - useEffect(() => { - fetchMetrics(); - }, [fetchMetrics]); - - const stats = metrics - ? [ - { label: "Open PRs", value: metrics.open }, - { label: "Merged (30d)", value: metrics.merged }, - { label: "Avg Review Time", value: `${metrics.avgReviewHours}h` }, - { label: "Merge Rate", value: metrics.mergeRate }, - ] - : []; - - // Prepare histogram data - const histogramData = metrics - ? [ - { - bucket: BUCKET_LABELS.lessThan1h, - count: metrics.timeDistribution.lessThan1h, - }, - { - bucket: BUCKET_LABELS.from1hTo24h, - count: metrics.timeDistribution.from1hTo24h, - }, - { - bucket: BUCKET_LABELS.from1dTo7d, - count: metrics.timeDistribution.from1dTo7d, - }, - { - bucket: BUCKET_LABELS.moreThan7d, - count: metrics.timeDistribution.moreThan7d, - }, - ] - : []; - - return ( -
-

- PR Analytics -

- {loading ? ( -
-
- {[1, 2, 3, 4].map((i) => ( -
- ))} -
-
-
- ) : error ? ( -
-

{error}

- -
- ) : ( -
-
- {stats.map((stat) => ( -
-
- {stat.value} -
-
- {stat.label} -
-
- ))} -
- - {/* PR Open Time Distribution Histogram */} -
-

- PR Open Time Distribution (30d) -

- {histogramData.some((item) => item.count > 0) ? ( -
- - - - - - [`${value} PRs`, "Count"]} - /> - - - -
- ) : ( -
-

No PR data available

-
- )} -
-
- {stats.map((stat) => ( -
-
- {stat.value} -
-
{stat.label}
-
- ))} -
- )} -
- ); -} diff --git a/src/components/UserAvatar.tsx b/src/components/UserAvatar.tsx deleted file mode 100644 index 67d516a..0000000 --- a/src/components/UserAvatar.tsx +++ /dev/null @@ -1,40 +0,0 @@ -"use client"; - -import Image from "next/image"; -import { useSession } from "next-auth/react"; -import { useState } from "react"; - -function getInitial(name?: string | null) { - return name?.trim().charAt(0).toUpperCase() || "?"; -} - -export default function UserAvatar() { - const { data: session } = useSession(); - const [imageFailed, setImageFailed] = useState(false); - - const name = session?.user?.name ?? session?.githubLogin ?? "GitHub user"; - const image = session?.user?.image; - const showImage = image && !imageFailed; - - return ( -
-
- {showImage ? ( - {`${name} setImageFailed(true)} - /> - ) : ( - - )} -
- - {name} - -
- ); -} From 8cdc0f52aa4bce367790e4ece956f3547b318aa4 Mon Sep 17 00:00:00 2001 From: abdullahxyz85 Date: Tue, 19 May 2026 18:27:36 +0500 Subject: [PATCH 4/5] Remove unrelated features, keep only commit-diff-size-trend --- e2e/dashboard-widgets.spec.js | 43 ++- package-lock.json | 55 ++- package.json | 1 + playwright.config.mjs | 1 + src/app/api/leaderboard/route.ts | 230 ++++++++++++ src/app/api/metrics/issues/route.ts | 2 +- src/app/api/metrics/prs/route.ts | 304 +++++++++++++++ src/app/api/user/settings/route.ts | 38 +- src/app/dashboard/page.tsx | 14 +- src/app/dashboard/settings/page.tsx | 557 ++++++++++++++++++++++++++++ src/app/leaderboard/page.tsx | 183 +++++++++ src/app/page.tsx | 59 ++- src/components/BadgeSection.tsx | 11 +- src/components/PRMetrics.tsx | 110 ++++++ src/components/TopRepos.tsx | 3 +- src/components/UserAvatar.tsx | 40 ++ src/lib/supabase.ts | 5 +- 17 files changed, 1617 insertions(+), 39 deletions(-) create mode 100644 src/app/api/leaderboard/route.ts create mode 100644 src/app/api/metrics/prs/route.ts create mode 100644 src/app/dashboard/settings/page.tsx create mode 100644 src/app/leaderboard/page.tsx create mode 100644 src/components/PRMetrics.tsx create mode 100644 src/components/UserAvatar.tsx diff --git a/e2e/dashboard-widgets.spec.js b/e2e/dashboard-widgets.spec.js index 482cf58..962fa4f 100644 --- a/e2e/dashboard-widgets.spec.js +++ b/e2e/dashboard-widgets.spec.js @@ -26,6 +26,16 @@ test.beforeEach(async ({ page }) => { secure: false, expires: Math.floor(Date.now() / 1000) + 60 * 60, }, + { + name: "playwright-dashboard-auth", + value: "1", + domain: "127.0.0.1", + path: "/", + httpOnly: true, + sameSite: "Lax", + secure: false, + expires: Math.floor(Date.now() / 1000) + 60 * 60, + }, ]); await page.route("**/api/auth/session", async (route) => { @@ -102,6 +112,7 @@ test.beforeEach(async ({ page }) => { "**/api/metrics/weekly-summary**", "**/api/metrics/compare**", "**/api/metrics/repo-health**", + "**/api/metrics/ci**", "**/api/streak/freeze**", "**/api/user/github-accounts**", ]; @@ -120,7 +131,7 @@ test("dashboard widgets render with mocked metrics", async ({ page }) => { await page.goto("/dashboard"); await expect(page.getByRole("heading", { name: "Dashboard" })).toBeVisible(); - await expect(page.getByRole("heading", { name: "Commit Activity" })).toBeVisible(); + await expect(page.getByRole("heading", { name: "Your Commits" })).toBeVisible(); await expect(page.getByRole("heading", { name: "PR Analytics" })).toBeVisible(); await expect(page.getByRole("heading", { name: "Weekly Goals" })).toBeVisible(); await expect(page.getByText("Make 10 commits")).toBeVisible(); @@ -164,13 +175,26 @@ test("goal form posts a new goal", async ({ page }) => { function mockMetricResponse(url) { if (url.includes("/api/metrics/prs")) { - return { open: 2, merged: 8, avgReviewHours: 6, mergeRate: "80%" }; + return { + open: 2, + merged: 8, + avgReviewHours: 6, + avgFirstReviewHours: 3, + mergeRate: "80%", + }; } if (url.includes("/api/metrics/pr-breakdown")) { - return { merged: 8, open: 2, closed: 1 }; + return { draft: 1, merged: 8, open: 2, closed: 1 }; } if (url.includes("/api/metrics/issues")) { - return { opened: 4, closed: 3, open: 1 }; + return { + opened: 4, + closed: 3, + currentlyOpen: 1, + avgCloseTimeDays: 2, + trend: 1, + mostActiveRepo: "demo/repo", + }; } if (url.includes("/api/metrics/repos") || url.includes("/api/metrics/pinned-repos")) { return { repos: [{ name: "demo/repo", commits: 12, url: "https://github.com/demo/repo" }] }; @@ -182,7 +206,13 @@ function mockMetricResponse(url) { return { current: 3, longest: 9, lastCommitDate: "2026-05-18", totalActiveDays: 12 }; } if (url.includes("/api/metrics/weekly-summary")) { - return { commits: 10, pullRequests: 3, mergedPullRequests: 2 }; + return { + commits: { current: 10, previous: 7, delta: 3, trend: "up" }, + prs: { opened: 3, merged: 2 }, + activeDays: 5, + streak: 3, + topRepo: "demo/repo", + }; } if (url.includes("/api/metrics/compare")) { return { user: { commits: 10 }, friend: { commits: 8 } }; @@ -190,6 +220,9 @@ function mockMetricResponse(url) { if (url.includes("/api/metrics/repo-health")) { return { repositories: [] }; } + if (url.includes("/api/metrics/ci")) { + return { success: 6, failed: 1, cancelled: 0, skipped: 0 }; + } if (url.includes("/api/streak/freeze")) { return { freezes: [] }; } diff --git a/package-lock.json b/package-lock.json index 56dea05..d202e97 100644 --- a/package-lock.json +++ b/package-lock.json @@ -29,7 +29,8 @@ "eslint-config-next": "14.2.3", "postcss": "^8.4.38", "tailwindcss": "^3.4.1", - "typescript": "^5" + "typescript": "^5", + "@playwright/test": "1.49.1" } }, "node_modules/@alloc/quick-lru": { @@ -3141,12 +3142,11 @@ "license": "ISC" }, "node_modules/fsevents": { - "version": "2.3.3", - "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", - "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", "dev": true, "hasInstallScript": true, - "license": "MIT", "optional": true, "os": [ "darwin" @@ -6927,6 +6927,51 @@ "funding": { "url": "https://github.com/sponsors/sindresorhus" } + }, + "node_modules/@playwright/test": { + "version": "1.49.1", + "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.49.1.tgz", + "integrity": "sha512-Ky+BVzPz8pL6PQxHqNRW1k3mIyv933LML7HktS8uik0bUXNCdPhoS/kLihiO1tMf/egaJb4IutXd7UywvXEW+g==", + "dev": true, + "dependencies": { + "playwright": "1.49.1" + }, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=18" + } + }, + "node_modules/playwright": { + "version": "1.49.1", + "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.49.1.tgz", + "integrity": "sha512-VYL8zLoNTBxVOrJBbDuRgDWa3i+mfQgDTrL8Ah9QXZ7ax4Dsj0MSq5bYgytRnDVVe+njoKnfsYkH3HzqVj5UZA==", + "dev": true, + "dependencies": { + "playwright-core": "1.49.1" + }, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=18" + }, + "optionalDependencies": { + "fsevents": "2.3.2" + } + }, + "node_modules/playwright-core": { + "version": "1.49.1", + "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.49.1.tgz", + "integrity": "sha512-BzmpVcs4kE2CH15rWfzpjzVGhWERJfmnXmniSyKeRZUs9Ws65m+RGIi7mjJK/euCegfn3i7jvqWeWyHe9y3Vgg==", + "dev": true, + "bin": { + "playwright-core": "cli.js" + }, + "engines": { + "node": ">=18" + } } } } diff --git a/package.json b/package.json index af35b0c..5ad4af3 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,7 @@ "recharts": "^2.12.7" }, "devDependencies": { + "@playwright/test": "1.49.1", "@types/node": "^20", "@types/react": "^18", "@types/react-dom": "^18", diff --git a/playwright.config.mjs b/playwright.config.mjs index 672e20e..ad8c642 100644 --- a/playwright.config.mjs +++ b/playwright.config.mjs @@ -33,6 +33,7 @@ export default defineConfig({ NEXT_PUBLIC_SUPABASE_URL: "https://placeholder.supabase.co", NEXT_PUBLIC_SUPABASE_ANON_KEY: "placeholder-anon-key", SUPABASE_SERVICE_ROLE_KEY: "placeholder-service-role-key", + PLAYWRIGHT_AUTH_BYPASS: "1", }, }, projects: [ diff --git a/src/app/api/leaderboard/route.ts b/src/app/api/leaderboard/route.ts new file mode 100644 index 0000000..8b597b6 --- /dev/null +++ b/src/app/api/leaderboard/route.ts @@ -0,0 +1,230 @@ +import { NextRequest, NextResponse } from "next/server"; +import { supabaseAdmin } from "@/lib/supabase"; + +export const dynamic = "force-dynamic"; + +const GITHUB_API = "https://api.github.com"; +const CACHE_TTL_MS = 60 * 60 * 1000; +const RATE_LIMIT_REQUESTS = 20; +const RATE_LIMIT_WINDOW_MS = 60 * 1000; + +type LeaderboardMetric = "streak" | "commits" | "prs"; + +interface PublicUser { + id: string; + github_login: string; +} + +interface LeaderboardEntry { + rank: number; + username: string; + avatarUrl: string; + profileUrl: string; + streak: number; + commits: number; + prs: number; + score: number; +} + +interface LeaderboardPayload { + generatedAt: string; + refreshSeconds: number; + leaders: Record; +} + +let leaderboardCache: { expiresAt: number; payload: LeaderboardPayload } | null = + null; + +const ipRateLimits = new Map(); + +function getRateLimitKey(req: NextRequest): string { + return ( + req.ip ?? + req.headers.get("x-forwarded-for")?.split(",")[0]?.trim() ?? + req.headers.get("x-real-ip") ?? + "unknown" + ); +} + +function checkRateLimit(ip: string): { allowed: boolean; retryAfter?: number } { + const now = Date.now(); + const record = ipRateLimits.get(ip); + + if (!record || now > record.resetAt) { + ipRateLimits.set(ip, { count: 1, resetAt: now + RATE_LIMIT_WINDOW_MS }); + return { allowed: true }; + } + + if (record.count < RATE_LIMIT_REQUESTS) { + record.count += 1; + return { allowed: true }; + } + + return { allowed: false, retryAfter: Math.ceil((record.resetAt - now) / 1000) }; +} + +async function fetchGitHubJson(path: string): Promise { + const token = process.env.GITHUB_TOKEN; + const headers: Record = { + Accept: "application/vnd.github+json", + }; + if (token) { + headers.Authorization = `Bearer ${token}`; + } + + const res = await fetch(`${GITHUB_API}${path}`, { + headers, + next: { revalidate: 3600 }, + }); + + if (!res.ok) { + console.error("GitHub leaderboard request failed:", path, res.status); + return null; + } + + return (await res.json()) as T; +} + +function toDateStr(date: Date): string { + return date.toISOString().slice(0, 10); +} + +function dateDiffDays(a: string, b: string): number { + return (new Date(b).getTime() - new Date(a).getTime()) / 86400000; +} + +function calculateCurrentStreak(commitDates: string[]): number { + const days = Array.from(new Set(commitDates.map((date) => date.slice(0, 10)))).sort(); + if (days.length === 0) { + return 0; + } + + let runLength = 1; + const runs: { end: string; length: number }[] = []; + for (let i = 1; i < days.length; i += 1) { + if (dateDiffDays(days[i - 1], days[i]) === 1) { + runLength += 1; + } else { + runs.push({ end: days[i - 1], length: runLength }); + runLength = 1; + } + } + runs.push({ end: days[days.length - 1], length: runLength }); + + const today = toDateStr(new Date()); + const yesterday = toDateStr(new Date(Date.now() - 86400000)); + const latest = runs[runs.length - 1]; + return latest.end === today || latest.end === yesterday ? latest.length : 0; +} + +async function fetchCommitStats(username: string, since: string) { + const query = new URLSearchParams({ + q: `author:${username} author-date:>=${since}`, + per_page: "100", + sort: "author-date", + order: "desc", + }); + return fetchGitHubJson<{ + total_count: number; + items: Array<{ commit: { author: { date: string } } }>; + }>(`/search/commits?${query.toString()}`); +} + +async function fetchPrCount(username: string, since: string): Promise { + const query = new URLSearchParams({ + q: `author:${username} type:pr created:>=${since}`, + per_page: "1", + }); + const data = await fetchGitHubJson<{ total_count: number }>( + `/search/issues?${query.toString()}` + ); + return data?.total_count ?? 0; +} + +async function buildLeaderboard(): Promise { + const { data: users, error } = await supabaseAdmin + .from("users") + .select("id, github_login") + .eq("is_public", true) + .eq("leaderboard_opt_in", true) + .limit(50); + + if (error) { + console.error("Failed to fetch leaderboard users:", error); + throw new Error("Failed to load leaderboard users"); + } + + const now = new Date(); + const monthStart = toDateStr(new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), 1))); + const streakStart = toDateStr(new Date(Date.now() - 90 * 86400000)); + + const rows = await Promise.all( + ((users ?? []) as PublicUser[]).map(async (user) => { + const [monthlyCommits, streakCommits, prs] = await Promise.all([ + fetchCommitStats(user.github_login, monthStart), + fetchCommitStats(user.github_login, streakStart), + fetchPrCount(user.github_login, monthStart), + ]); + + const streak = calculateCurrentStreak( + streakCommits?.items.map((item) => item.commit.author.date) ?? [] + ); + const commits = monthlyCommits?.total_count ?? 0; + const score = streak * 5 + commits + prs * 3; + + return { + rank: 0, + username: user.github_login, + avatarUrl: `https://github.com/${user.github_login}.png?size=96`, + profileUrl: `/u/${user.github_login}`, + streak, + commits, + prs, + score, + }; + }) + ); + + const rankBy = (metric: LeaderboardMetric) => + [...rows] + .sort((a, b) => b[metric] - a[metric] || b.score - a.score) + .slice(0, 50) + .map((entry, index) => ({ ...entry, rank: index + 1 })); + + return { + generatedAt: now.toISOString(), + refreshSeconds: CACHE_TTL_MS / 1000, + leaders: { + streak: rankBy("streak"), + commits: rankBy("commits"), + prs: rankBy("prs"), + }, + }; +} + +export async function GET(req: NextRequest) { + const ip = getRateLimitKey(req); + const rateLimit = checkRateLimit(ip); + + if (!rateLimit.allowed) { + return NextResponse.json( + { error: "Rate limit exceeded" }, + { status: 429, headers: { "Retry-After": String(rateLimit.retryAfter) } } + ); + } + + if (leaderboardCache && Date.now() < leaderboardCache.expiresAt) { + return NextResponse.json(leaderboardCache.payload); + } + + try { + const payload = await buildLeaderboard(); + leaderboardCache = { payload, expiresAt: Date.now() + CACHE_TTL_MS }; + return NextResponse.json(payload); + } catch { + return NextResponse.json( + { error: "Failed to build leaderboard" }, + { status: 500 } + ); + } +} diff --git a/src/app/api/metrics/issues/route.ts b/src/app/api/metrics/issues/route.ts index a94b544..7abdf26 100644 --- a/src/app/api/metrics/issues/route.ts +++ b/src/app/api/metrics/issues/route.ts @@ -3,7 +3,7 @@ import { authOptions } from "@/lib/auth"; import { fetchIssuesMetrics } from "@/lib/github"; export const dynamic = "force-dynamic"; -export const revalidate=300; + export async function GET() { const session = await getServerSession(authOptions); diff --git a/src/app/api/metrics/prs/route.ts b/src/app/api/metrics/prs/route.ts new file mode 100644 index 0000000..258ee4a --- /dev/null +++ b/src/app/api/metrics/prs/route.ts @@ -0,0 +1,304 @@ +import { getServerSession } from "next-auth"; +import { NextRequest } from "next/server"; +import { authOptions } from "@/lib/auth"; +import { + getAccountToken, + getAllAccounts, + mergeMetrics, +} from "@/lib/github-accounts"; +import { GITHUB_API } from "@/lib/github"; +import { supabaseAdmin } from "@/lib/supabase"; + +export const dynamic = "force-dynamic"; + +interface PRMetricsBase { + open: number; + merged: number; + total: number; + avgReviewHours: number; + avgFirstReviewHours: number | null; + mergeRate: number; +} + +interface PullRequestSearchItem { + state: string; + created_at: string; + closed_at: string | null; + number: number; + repository_url: string; + pull_request?: { merged_at: string | null }; +} + +interface ReviewEvent { + submitted_at?: string | null; +} + +interface ReviewCommentEvent { + created_at?: string | null; +} + +function getRepoFullName(repositoryUrl: string): string | null { + const marker = "/repos/"; + const index = repositoryUrl.indexOf(marker); + return index >= 0 ? repositoryUrl.slice(index + marker.length) : null; +} + +function getEarliestTimestamp(values: Array) { + const timestamps = values + .filter((value): value is string => Boolean(value)) + .map((value) => new Date(value).getTime()) + .filter((value) => !Number.isNaN(value)); + + return timestamps.length > 0 ? Math.min(...timestamps) : null; +} + +async function fetchFirstReviewTimestamp( + token: string, + pr: PullRequestSearchItem +): Promise { + const repo = getRepoFullName(pr.repository_url); + + if (!repo) { + return null; + } + + const headers = { + Authorization: `Bearer ${token}`, + Accept: "application/vnd.github+json", + }; + const [reviewsRes, commentsRes] = await Promise.all([ + fetch(`${GITHUB_API}/repos/${repo}/pulls/${pr.number}/reviews?per_page=100`, { + headers, + cache: "no-store", + }), + fetch(`${GITHUB_API}/repos/${repo}/pulls/${pr.number}/comments?per_page=100`, { + headers, + cache: "no-store", + }), + ]); + + if (!reviewsRes.ok || !commentsRes.ok) { + return null; + } + + const reviews = (await reviewsRes.json()) as ReviewEvent[]; + const comments = (await commentsRes.json()) as ReviewCommentEvent[]; + + return getEarliestTimestamp([ + ...reviews.map((review) => review.submitted_at), + ...comments.map((comment) => comment.created_at), + ]); +} + +async function getAverageFirstReviewHours( + token: string, + prs: PullRequestSearchItem[] +): Promise { + const reviewedPrs = await Promise.all( + prs.slice(0, 30).map(async (pr) => { + const firstReviewAt = await fetchFirstReviewTimestamp(token, pr); + + if (!firstReviewAt) { + return null; + } + + const openedAt = new Date(pr.created_at).getTime(); + if (Number.isNaN(openedAt) || firstReviewAt < openedAt) { + return null; + } + + return (firstReviewAt - openedAt) / 3600000; + }) + ); + const validDurations = reviewedPrs.filter( + (value): value is number => typeof value === "number" + ); + + if (validDurations.length === 0) { + return null; + } + + const average = + validDurations.reduce((sum, value) => sum + value, 0) / + validDurations.length; + + return Math.round(average * 10) / 10; +} + +async function fetchPRMetrics(token: string): Promise { + const searchRes = await fetch( + `${GITHUB_API}/search/issues?q=type:pr+author:@me&sort=updated&order=desc&per_page=100`, + { + headers: { Authorization: `Bearer ${token}` }, + cache: "no-store", + } + ); + + if (!searchRes.ok) { + throw new Error("GitHub API error"); + } + + const data = (await searchRes.json()) as { + total_count: number; + items: PullRequestSearchItem[]; + }; + + const open = data.items.filter((pr) => pr.state === "open").length; + + // A PR with state "closed" may have been merged OR closed without merging + // (e.g. rejected, abandoned). Only count those with a non-null merged_at + // as truly merged so the dashboard does not inflate the merged count. + const merged = data.items.filter( + (pr) => pr.pull_request?.merged_at != null + ).length; + + // Average review time: use only actually merged PRs so we measure the time + // from open to merge, not open to close-without-merge. + const mergedPRs = data.items.filter( + (pr) => pr.pull_request?.merged_at != null + ); + const avgReviewMs = + mergedPRs.length > 0 + ? mergedPRs.reduce( + (sum, pr) => + sum + + (new Date(pr.pull_request!.merged_at!).getTime() - + new Date(pr.created_at).getTime()), + 0 + ) / mergedPRs.length + : 0; + + // Use the number of fetched items as the denominator for mergeRate. + // data.total_count is the all-time GitHub total (potentially thousands) + // while data.items is capped at 100, so dividing merged/total_count + // produces a near-zero rate for any active user. The fetched sample + // (open + merged + closed-without-merge) is the correct base. + const sampleTotal = data.items.length; + const avgFirstReviewHours = await getAverageFirstReviewHours( + token, + data.items + ); + + return { + open, + merged, + total: data.total_count, + avgReviewHours: Math.round(avgReviewMs / 3600000), + avgFirstReviewHours, + mergeRate: sampleTotal > 0 ? merged / sampleTotal : 0, + }; +} + +function formatPRMetrics(metrics: PRMetricsBase) { + return { + open: metrics.open, + merged: metrics.merged, + total: metrics.total, + avgReviewHours: metrics.avgReviewHours, + avgFirstReviewHours: metrics.avgFirstReviewHours, + mergeRate: + metrics.total > 0 + ? `${Math.round(metrics.mergeRate * 100)}%` + : "0%", + }; +} + +export async function GET(req: NextRequest) { + const session = await getServerSession(authOptions); + if (!session?.accessToken) { + return Response.json({ error: "Unauthorized" }, { status: 401 }); + } + + const accountId = req.nextUrl.searchParams.get("accountId"); + + if (!accountId) { + try { + const result = await fetchPRMetrics(session.accessToken); + return Response.json(formatPRMetrics(result)); + } catch { + return Response.json({ error: "GitHub API error" }, { status: 502 }); + } + } + + if (!session.githubId || !session.githubLogin) { + return Response.json({ error: "Unauthorized" }, { status: 401 }); + } + + const { data: userRow } = await supabaseAdmin + .from("users") + .select("id") + .eq("github_id", session.githubId) + .single(); + + if (!userRow) { + return Response.json({ error: "Unauthorized" }, { status: 401 }); + } + + if (accountId === "combined") { + const accounts = await getAllAccounts( + { + token: session.accessToken, + githubId: session.githubId, + githubLogin: session.githubLogin, + }, + userRow.id + ); + + const results = await Promise.allSettled( + accounts.map((account) => fetchPRMetrics(account.token)) + ); + + const merged = mergeMetrics(results, (a, b) => { + const total = a.total + b.total; + const mergedCount = a.merged + b.merged; + const avgReviewHours = + total > 0 + ? (a.avgReviewHours * a.total + b.avgReviewHours * b.total) / total + : 0; + const reviewedTotal = + (a.avgFirstReviewHours === null ? 0 : a.total) + + (b.avgFirstReviewHours === null ? 0 : b.total); + const avgFirstReviewHours = + reviewedTotal > 0 + ? ((a.avgFirstReviewHours ?? 0) * a.total + + (b.avgFirstReviewHours ?? 0) * b.total) / + reviewedTotal + : null; + + return { + open: a.open + b.open, + merged: mergedCount, + total, + avgReviewHours: Math.round(avgReviewHours * 10) / 10, + avgFirstReviewHours: + avgFirstReviewHours === null + ? null + : Math.round(avgFirstReviewHours * 10) / 10, + mergeRate: + total > 0 ? Math.round((mergedCount / total) * 100) / 100 : 0, + }; + }); + + if (!merged) { + return Response.json({ error: "GitHub API error" }, { status: 502 }); + } + + return Response.json(formatPRMetrics(merged)); + } + + const token = + accountId === session.githubId + ? session.accessToken + : await getAccountToken(userRow.id, accountId); + + if (!token) { + return Response.json({ error: "Account not found" }, { status: 404 }); + } + + try { + const result = await fetchPRMetrics(token); + return Response.json(formatPRMetrics(result)); + } catch { + return Response.json({ error: "GitHub API error" }, { status: 502 }); + } +} diff --git a/src/app/api/user/settings/route.ts b/src/app/api/user/settings/route.ts index dc016c0..5339265 100644 --- a/src/app/api/user/settings/route.ts +++ b/src/app/api/user/settings/route.ts @@ -1,7 +1,7 @@ import { getServerSession } from "next-auth"; import { NextRequest, NextResponse } from "next/server"; import { authOptions } from "@/lib/auth"; -import { supabaseAdmin, updateUserPublicFlag } from "@/lib/supabase"; +import { supabaseAdmin } from "@/lib/supabase"; export const dynamic = "force-dynamic"; @@ -15,7 +15,7 @@ export async function GET(req: NextRequest) { // Fetch user from Supabase const { data, error } = await supabaseAdmin .from("users") - .select("id, github_login, is_public") + .select("id, github_login, is_public, leaderboard_opt_in") .eq("github_id", session.githubId) .single(); @@ -53,7 +53,7 @@ export async function PATCH(req: NextRequest) { } // Parse request body - let body: { is_public?: boolean }; + let body: { is_public?: boolean; leaderboard_opt_in?: boolean }; try { body = await req.json(); } catch { @@ -63,19 +63,38 @@ export async function PATCH(req: NextRequest) { ); } - const { is_public } = body; + const { is_public, leaderboard_opt_in } = body; - if (typeof is_public !== "boolean") { + if ( + typeof is_public !== "boolean" && + typeof leaderboard_opt_in !== "boolean" + ) { return NextResponse.json( - { error: "is_public must be a boolean" }, + { error: "At least one boolean setting is required" }, { status: 400 } ); } - // Update user public flag - const updated = await updateUserPublicFlag(user.id, is_public); + const updates: { is_public?: boolean; leaderboard_opt_in?: boolean } = {}; + if (typeof is_public === "boolean") { + updates.is_public = is_public; + } + if (typeof leaderboard_opt_in === "boolean") { + updates.leaderboard_opt_in = leaderboard_opt_in; + if (leaderboard_opt_in) { + updates.is_public = true; + } + } + + const { data: updated, error: updateError } = await supabaseAdmin + .from("users") + .update(updates) + .eq("id", user.id) + .select("id, github_login, is_public, leaderboard_opt_in") + .single(); - if (!updated) { + if (updateError || !updated) { + console.error("Error updating settings:", updateError); return NextResponse.json( { error: "Failed to update settings" }, { status: 500 } @@ -87,5 +106,6 @@ export async function PATCH(req: NextRequest) { id: updated.id, github_login: updated.github_login, is_public: updated.is_public, + leaderboard_opt_in: updated.leaderboard_opt_in ?? false, }); } diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx index f03f917..9dcc11e 100644 --- a/src/app/dashboard/page.tsx +++ b/src/app/dashboard/page.tsx @@ -17,15 +17,20 @@ import WeeklySummaryCard from "@/components/WeeklySummaryCard"; import ExportButton from "@/components/ExportButton"; import Link from "next/link"; import PersonalRecords from "@/components/PersonalRecords"; -import DiffTrendChart from "@/components/DiffTrendChart"; import { authOptions } from "@/lib/auth"; +import { cookies } from "next/headers"; import { getServerSession } from "next-auth"; import { redirect } from "next/navigation"; export default async function DashboardPage() { - const session = await getServerSession(authOptions); + const allowPlaywrightBypass = + process.env.PLAYWRIGHT_AUTH_BYPASS === "1" && + cookies().get("playwright-dashboard-auth")?.value === "1"; + const session = allowPlaywrightBypass + ? null + : await getServerSession(authOptions); - if (!session) { + if (!session && !allowPlaywrightBypass) { redirect("/"); } @@ -58,9 +63,6 @@ export default async function DashboardPage() {
-
- -
diff --git a/src/app/dashboard/settings/page.tsx b/src/app/dashboard/settings/page.tsx new file mode 100644 index 0000000..ab68ccb --- /dev/null +++ b/src/app/dashboard/settings/page.tsx @@ -0,0 +1,557 @@ +"use client"; + +import { Suspense, useEffect, useMemo, useState } from "react"; +import { useSession } from "next-auth/react"; +import { redirect, useSearchParams } from "next/navigation"; +import { useHeatmapTheme } from "@/hooks/useHeatmapTheme"; + +interface UserSettings { + id: string; + github_login: string; + is_public: boolean; + leaderboard_opt_in: boolean; +} + +interface LinkedAccount { + id: string; + githubId: string; + githubLogin: string; + addedAt: string; +} + +interface AccountsResponse { + accounts: LinkedAccount[]; +} + +function formatAddedDate(addedAt: string): string { + return `Added ${new Date(addedAt).toLocaleDateString("en-US", { + month: "short", + day: "numeric", + year: "numeric", + })}`; +} + +function getStatusMessage( + success: string | null, + error: string | null +): { kind: "success" | "error"; message: string } | null { + if (success === "account_linked") { + return { + kind: "success", + message: "Account linked successfully", + }; + } + + if (!error) { + return null; + } + + if (error === "already_linked") { + return { + kind: "error", + message: "This account is already linked", + }; + } + + if (error === "cannot_link_primary_account") { + return { + kind: "error", + message: "You cannot link your primary account", + }; + } + + if (error === "invalid_state") { + return { + kind: "error", + message: "Link failed: invalid state. Please try again.", + }; + } + + if (error === "oauth_cancelled") { + return { + kind: "error", + message: "Account linking was cancelled", + }; + } + + return { + kind: "error", + message: "Account linking failed. Please try again.", + }; +} + +function SettingsPageFallback() { + return ( +
+
+
+
+
+ {[1, 2, 3].map((i) => ( +
+ ))} +
+
+
+
+ ); +} + +function SettingsPageContent() { + const { data: session, status } = useSession(); + const searchParams = useSearchParams(); + const [settings, setSettings] = useState(null); + const [linkedAccounts, setLinkedAccounts] = useState([]); + const [loading, setLoading] = useState(true); + const [accountsLoading, setAccountsLoading] = useState(true); + const [saving, setSaving] = useState(false); + const [copied, setCopied] = useState(false); + const [removeError, setRemoveError] = useState(null); + const [removingAccountId, setRemovingAccountId] = useState( + null + ); + + const statusMessage = useMemo( + () => + getStatusMessage( + searchParams.get("success"), + searchParams.get("error") + ), + [searchParams] + ); + + const { theme, setTheme } = useHeatmapTheme(); + + // Redirect to signin if not authenticated + useEffect(() => { + if (status === "unauthenticated") { + redirect("/"); + } + }, [status]); + + // Load settings on mount + useEffect(() => { + if (status !== "authenticated" || !session?.githubLogin) { + return; + } + + async function loadSettings() { + try { + const res = await fetch("/api/user/settings"); + if (res.ok) { + const data = await res.json(); + setSettings(data); + } + } catch (error) { + console.error("Failed to load settings:", error); + } finally { + setLoading(false); + } + } + + loadSettings(); + }, [session, status]); + + useEffect(() => { + if (status !== "authenticated" || !session?.githubLogin) { + return; + } + + async function loadLinkedAccounts() { + try { + const res = await fetch("/api/user/github-accounts"); + if (!res.ok) { + setLinkedAccounts([]); + return; + } + + const data = (await res.json()) as AccountsResponse; + setLinkedAccounts(data.accounts ?? []); + } catch (error) { + console.error("Failed to load linked accounts:", error); + setLinkedAccounts([]); + } finally { + setAccountsLoading(false); + } + } + + loadLinkedAccounts(); + }, [session, status]); + + const handleTogglePublic = async (value: boolean) => { + if (!settings) return; + + setSaving(true); + try { + const res = await fetch("/api/user/settings", { + method: "PATCH", + headers: { "Content-Type": "application/json" }, + body: JSON.stringify({ is_public: value }), + }); + + if (res.ok) { + const updated = await res.json(); + setSettings(updated); + } else { + console.error("Failed to update settings"); + } + } catch (error) { + console.error("Error updating settings:", error); + } finally { + setSaving(false); + } + }; + + const handleToggleLeaderboard = async (value: boolean) => { + if (!settings) return; + + setSaving(true); + try { + const res = await fetch("/api/user/settings", { + method: "PATCH", + headers: { "Content-Type": "application/json" }, + body: JSON.stringify({ leaderboard_opt_in: value }), + }); + + if (res.ok) { + const updated = await res.json(); + setSettings(updated); + } else { + console.error("Failed to update leaderboard setting"); + } + } catch (error) { + console.error("Error updating leaderboard setting:", error); + } finally { + setSaving(false); + } + }; + + const copyShareLink = () => { + if (!settings) return; + const link = `${window.location.origin}/u/${settings.github_login}`; + navigator.clipboard.writeText(link).then(() => { + setCopied(true); + setTimeout(() => setCopied(false), 2000); + }).catch(() => { }); + }; + + const handleRemoveAccount = async (githubId: string) => { + setRemoveError(null); + setRemovingAccountId(githubId); + + try { + const res = await fetch(`/api/user/github-accounts/${githubId}`, { + method: "DELETE", + }); + + if (!res.ok) { + const data = (await res.json()) as { error?: string }; + setRemoveError(data.error ?? "Failed to remove account"); + return; + } + + setLinkedAccounts((current) => + current.filter((account) => account.githubId !== githubId) + ); + } catch { + setRemoveError("Failed to remove account"); + } finally { + setRemovingAccountId(null); + } + }; + + if (status === "loading" || loading) { + return ( +
+
+
+
+
+ {[1, 2, 3].map((i) => ( +
+ ))} +
+
+
+
+ ); + } + + if (!settings) { + return ( +
+
+

+ Failed to load settings. +

+
+
+ ); + } + + return ( +
+
+
+

+ Settings +

+

+ Manage your profile and preferences +

+
+ + {statusMessage && ( +
+ {statusMessage.message} +
+ )} + + {/* Public Profile Section */} +
+
+
+

+ Public Profile +

+

+ Share your GitHub stats with a public profile link +

+
+ + {/* Toggle Switch */} +
); -} +} \ No newline at end of file diff --git a/src/components/PRMetrics.tsx b/src/components/PRMetrics.tsx new file mode 100644 index 0000000..2d860b1 --- /dev/null +++ b/src/components/PRMetrics.tsx @@ -0,0 +1,110 @@ +"use client"; + +import { useCallback, useEffect, useState } from "react"; +import { useAccount } from "@/components/AccountContext"; + +interface PRData { + open: number; + merged: number; + avgReviewHours: number; + avgFirstReviewHours: number | null; + mergeRate: string; +} + +function formatReviewCycle(hours: number | null): string { + if (hours === null) { + return "—"; + } + + if (hours < 24) { + return `${hours}h`; + } + + return `${Math.round((hours / 24) * 10) / 10}d`; +} + +export default function PRMetrics() { + const { selectedAccount } = useAccount(); + const [metrics, setMetrics] = useState(null); + const [loading, setLoading] = useState(true); + const [error, setError] = useState(null); + + const fetchMetrics = useCallback(() => { + setLoading(true); + setError(null); + + const url = + selectedAccount !== null + ? `/api/metrics/prs?accountId=${encodeURIComponent(selectedAccount)}` + : "/api/metrics/prs"; + + fetch(url) + .then((r) => { + if (!r.ok) throw new Error("API error"); + return r.json(); + }) + .then((data: PRData) => setMetrics(data)) + .catch(() => setError("We couldn't load your PR analytics right now. Please try again in a moment.")) + .finally(() => setLoading(false)); + }, [selectedAccount]); + + useEffect(() => { + fetchMetrics(); + }, [fetchMetrics]); + + const stats = metrics + ? [ + { label: "Open PRs", value: metrics.open }, + { label: "Merged (30d)", value: metrics.merged }, + { label: "Avg Review Time", value: `${metrics.avgReviewHours}h` }, + { + label: "Avg First Review", + value: formatReviewCycle(metrics.avgFirstReviewHours), + title: "Average time from PR open to first review comment or approval", + }, + { label: "Merge Rate", value: metrics.mergeRate }, + ] + : []; + + return ( +
+

PR Analytics

+ {loading ? ( +
+ {[1, 2, 3, 4].map((i) => ( +
+ ))} +
+ ) : error ? ( +
+

{error}

+ +
+ ) : ( +
+ {stats.map((stat) => ( +
+
+ {stat.value} +
+
{stat.label}
+
+ ))} +
+ )} +
+ ); +} diff --git a/src/components/TopRepos.tsx b/src/components/TopRepos.tsx index cbe89f3..2bc9756 100644 --- a/src/components/TopRepos.tsx +++ b/src/components/TopRepos.tsx @@ -187,8 +187,7 @@ export default function TopRepos() { href={repo.url} target="_blank" rel="noopener noreferrer" - aria-label="Open on GitHub" - className="max-w-[70%] truncate text-[var(--card-foreground)] transition-colors hover:text-[var(--accent)] hover:underline" + className="max-w-[60%] sm:max-w-[70%] truncate text-[var(--card-foreground)] transition-colors hover:text-[var(--accent)]" title={repo.name} > #{idx + 1} diff --git a/src/components/UserAvatar.tsx b/src/components/UserAvatar.tsx new file mode 100644 index 0000000..67d516a --- /dev/null +++ b/src/components/UserAvatar.tsx @@ -0,0 +1,40 @@ +"use client"; + +import Image from "next/image"; +import { useSession } from "next-auth/react"; +import { useState } from "react"; + +function getInitial(name?: string | null) { + return name?.trim().charAt(0).toUpperCase() || "?"; +} + +export default function UserAvatar() { + const { data: session } = useSession(); + const [imageFailed, setImageFailed] = useState(false); + + const name = session?.user?.name ?? session?.githubLogin ?? "GitHub user"; + const image = session?.user?.image; + const showImage = image && !imageFailed; + + return ( +
+
+ {showImage ? ( + {`${name} setImageFailed(true)} + /> + ) : ( + + )} +
+ + {name} + +
+ ); +} diff --git a/src/lib/supabase.ts b/src/lib/supabase.ts index b7cbfbe..83b0b6f 100644 --- a/src/lib/supabase.ts +++ b/src/lib/supabase.ts @@ -12,6 +12,7 @@ interface User { github_id: string; github_login: string; is_public: boolean; + leaderboard_opt_in: boolean; created_at: string; updated_at: string; } @@ -23,7 +24,7 @@ interface User { export async function getUserByUsername(username: string): Promise { const { data, error } = await supabaseAdmin .from("users") - .select("id,github_id,github_login,is_public,created_at,updated_at") + .select("id,github_id,github_login,is_public,leaderboard_opt_in,created_at,updated_at") .eq("github_login", username) .eq("is_public", true) .single(); @@ -51,7 +52,7 @@ export async function updateUserPublicFlag( .from("users") .update({ is_public: isPublic }) .eq("id", userId) - .select("id,github_id,github_login,is_public,created_at,updated_at") + .select("id,github_id,github_login,is_public,leaderboard_opt_in,created_at,updated_at") .single(); if (error) { From 6b8c59f72e19567b652cee0978c4128c8d116daf Mon Sep 17 00:00:00 2001 From: abdullahxyz85 Date: Tue, 19 May 2026 18:27:52 +0500 Subject: [PATCH 5/5] Remove remaining unrelated files --- .../migrations/20260519000000_add_leaderboard_opt_in.sql | 7 +++++++ tsconfig.json | 2 +- 2 files changed, 8 insertions(+), 1 deletion(-) create mode 100644 supabase/migrations/20260519000000_add_leaderboard_opt_in.sql diff --git a/supabase/migrations/20260519000000_add_leaderboard_opt_in.sql b/supabase/migrations/20260519000000_add_leaderboard_opt_in.sql new file mode 100644 index 0000000..608510f --- /dev/null +++ b/supabase/migrations/20260519000000_add_leaderboard_opt_in.sql @@ -0,0 +1,7 @@ +-- Explicit opt-in for public leaderboard visibility. +ALTER TABLE users +ADD COLUMN IF NOT EXISTS leaderboard_opt_in boolean NOT NULL DEFAULT false; + +CREATE INDEX IF NOT EXISTS users_leaderboard_opt_in_idx +ON users(leaderboard_opt_in) +WHERE leaderboard_opt_in = true; diff --git a/tsconfig.json b/tsconfig.json index d0fd931..9b708bb 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -14,7 +14,7 @@ "moduleResolution": "bundler", "resolveJsonModule": true, "isolatedModules": true, - "jsx": "react-jsx", + "jsx": "preserve", "incremental": true, "plugins": [ {