Refactor user detail page: split components, unify formatters
Break the 615-line UserDetail.tsx into focused sub-components (header, stat cards, activity chart, request history, open alerts) and extract shared utilities to lib/ (format, userChart, enrichRequests). Promote storage load (GB/hr) to a stat card and collapse the chart UX to a single metric picker. Add server-wide average reference line alongside the user's own on every metric, and link request titles to their Seerr pages. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,27 @@
|
||||
export function formatGB(gb: number): string {
|
||||
if (gb >= 1000) return `${(gb / 1000).toFixed(2)} TB`;
|
||||
return `${gb.toFixed(1)} GB`;
|
||||
}
|
||||
|
||||
export function formatHours(h: number): string {
|
||||
if (h >= 1000) return `${(h / 1000).toFixed(1)}k h`;
|
||||
return `${h.toFixed(0)}h`;
|
||||
}
|
||||
|
||||
export function timeAgo(iso: string | null | undefined): string {
|
||||
if (!iso) return "Never";
|
||||
const diff = Date.now() - new Date(iso).getTime();
|
||||
const mins = Math.floor(diff / 60_000);
|
||||
if (mins < 1) return "just now";
|
||||
if (mins < 60) return `${mins}m ago`;
|
||||
const hrs = Math.floor(mins / 60);
|
||||
if (hrs < 24) return `${hrs}h ago`;
|
||||
const days = Math.floor(hrs / 24);
|
||||
if (days < 30) return `${days}d ago`;
|
||||
return new Date(iso).toLocaleDateString(undefined, { month: "short", year: "numeric" });
|
||||
}
|
||||
|
||||
export function unixTimeAgo(ts: number | null): string {
|
||||
if (ts === null) return "Never";
|
||||
return timeAgo(new Date(ts * 1000).toISOString());
|
||||
}
|
||||
Reference in New Issue
Block a user