refactor: remove hardcoded data window strings in dashboard components

src/app/u/[username]/page.tsx

@@ -18,6 +18,8 @@ import {
   type PublicProfileData,
 } from "@/lib/public-profile-data";
 
+const DATA_WINDOW_DAYS = 90;
+
 async function fetchPublicProfile(
   username: string,
   options: { includeAchievements?: boolean } = {}
@@ -292,7 +294,7 @@ function PublicStreakTracker({ streak }: { streak: any }) {
       icon: "🏆",
     },
     {
-      label: "Active Days (90d)",
+      label: `Active Days (${DATA_WINDOW_DAYS}d)`,
       value: streak.totalActiveDays,
       unit: "days",
       highlight: false,

src/components/ActivityRingChart.tsx

@@ -19,6 +19,7 @@ export default function ActivityRingChart() {
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const [days, setDays] = useState(30);
+  const WINDOW_OPTIONS = [7, 30, 90];
   const [hoveredHour, setHoveredHour] = useState<HourData | null>(null);
   const [animated, setAnimated] = useState(false);
   const prefersReduced = useRef(
@@ -91,9 +92,9 @@ export default function ActivityRingChart() {
           onChange={(e) => setDays(Number(e.target.value))}
           className="rounded-lg border border-[var(--border)] bg-[var(--card)] px-2 py-1 text-sm text-[var(--card-foreground)] focus:outline-none focus:border-[var(--accent)]"
         >
-          <option value={7}>Last 7d</option>
-          <option value={30}>Last 30d</option>
-          <option value={90}>Last 90d</option>
+          {WINDOW_OPTIONS.map((n) => (
+            <option key={n} value={n}>{`Last ${n}d`}</option>
+          ))}
         </select>
       </div>
 

src/components/CommitTimeChart.tsx

@@ -32,6 +32,7 @@ export default function CommitTimeChart() {
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const [days, setDays] = useState(30);
+  const WINDOW_OPTIONS = [7, 30, 90];
   const [peakTime, setPeakTime] = useState<string | null>(null);
 
   const fetchContributions = useCallback(() => {
@@ -107,9 +108,9 @@ export default function CommitTimeChart() {
           onChange={(e) => setDays(Number(e.target.value))}
           className="rounded-lg border border-[var(--border)] bg-[var(--control)] px-2 py-1 text-sm text-[var(--card-foreground)] focus:outline-none focus:border-[var(--accent)]"
         >
-          <option value={7}>Last 7d</option>
-          <option value={30}>Last 30d</option>
-          <option value={90}>Last 90d</option>
+          {WINDOW_OPTIONS.map((n) => (
+            <option key={n} value={n}>{`Last ${n}d`}</option>
+          ))}
         </select>
       </div>
 

src/components/LocalCodingTime.tsx

@@ -39,6 +39,7 @@ export default function LocalCodingTime() {
   } | null>(null);
   const [loading, setLoading] = useState(true);
   const [days, setDays] = useState(30);
+  const WINDOW_OPTIONS = [7, 30, 90];
 
   useEffect(() => {
     async function loadStats() {
@@ -82,9 +83,9 @@ export default function LocalCodingTime() {
             onChange={(e) => setDays(Number(e.target.value))}
             className="bg-[var(--control)] border border-[var(--border)] rounded px-2 py-1 text-sm text-[var(--foreground)]"
           >
-            <option value={7}>Last 7 days</option>
-            <option value={30}>Last 30 days</option>
-            <option value={90}>Last 90 days</option>
+            {WINDOW_OPTIONS.map((n) => (
+              <option key={n} value={n}>{`Last ${n} days`}</option>
+            ))}
           </select>
         </div>
         <div className="flex flex-col items-center justify-center py-8 text-center">
@@ -125,9 +126,9 @@ export default function LocalCodingTime() {
           onChange={(e) => setDays(Number(e.target.value))}
           className="bg-[var(--control)] border border-[var(--border)] rounded px-2 py-1 text-sm text-[var(--foreground)]"
         >
-          <option value={7}>Last 7 days</option>
-          <option value={30}>Last 30 days</option>
-          <option value={90}>Last 90 days</option>
+          {WINDOW_OPTIONS.map((n) => (
+            <option key={n} value={n}>{`Last ${n} days`}</option>
+          ))}
         </select>
       </div>
 

src/components/RepoHealthPanel.tsx

@@ -2,6 +2,7 @@
 
 import { useEffect } from "react";
 import type { RepoHealthScore } from "@/types/repo-health";
+const DATA_WINDOW_DAYS = 30;
 interface Props {
   health: RepoHealthScore;
   isOpen: boolean;
@@ -92,7 +93,7 @@ export default function RepoHealthPanel({ health, isOpen, onClose }: Props) {
           ))}
         </div>
         <p className="mt-5 text-xs text-[var(--muted-foreground)] border-t border-[var(--border)] pt-4">
-          Score based on activity in the last 30 days. Updates on page refresh.
+          {`Score based on activity in the last ${DATA_WINDOW_DAYS} days. Updates on page refresh.`}
         </p>
       </div>
     </div>

src/components/StreakTracker.tsx

@@ -9,6 +9,7 @@ import { toast } from "sonner";
 import { toPng } from "html-to-image";
 import { Flame, Trophy, Calendar, Zap, Copy, CheckCircle, Medal, Star, Sparkles } from "lucide-react";
 
+const DATA_WINDOW_DAYS = 90;
 const STREAK_MILESTONES = [7, 30, 50, 100, 200, 365];
 
 interface StreakData {
@@ -331,12 +332,12 @@ export default function StreakTracker() {
           tooltip: "Your longest streak ever",
         },
         {
-          label: "Active Days (90d)",
+          label: `Active Days (${DATA_WINDOW_DAYS}d)`,
           value: animatedActiveDays,
           unit: "days",
           highlight: false,
-          icon: Calendar,
-          tooltip: "Days you made commits in the last 90 days",
+          icon: "📅",
+          tooltip: `Days you made commits in the last ${DATA_WINDOW_DAYS} days`,
         },
         {
           label: "Last Commit",

src/components/TopRepos.tsx

@@ -78,6 +78,7 @@ export default function TopRepos() {
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const [days, setDays] = useState(30);
+  const WINDOW_OPTIONS = [7, 30, 90];
   const [lastUpdated, setLastUpdated] = useState<Date | null>(null);
   const [minutesAgo, setMinutesAgo] = useState(0);
   const [healthScores, setHealthScores] = useState<Record<string, RepoHealthScore>>({});
@@ -234,9 +235,9 @@ export default function TopRepos() {
           aria-label="Select time range for top repositories"
           className="rounded-lg border border-[var(--border)] bg-[var(--control)] px-2 py-1 text-sm text-[var(--card-foreground)] focus:outline-none focus:border-[var(--accent)]"
         >
-          <option value={7}>Last 7d</option>
-          <option value={30}>Last 30d</option>
-          <option value={90}>Last 90d</option>
+          {WINDOW_OPTIONS.map((n) => (
+            <option key={n} value={n}>{`Last ${n}d`}</option>
+          ))}
         </select>
       </div>
       {loading ? (