feat: stabilize chat realtime, dashboard insights, and account flows

Refines PR #57 into a single clean commit covering chat, dashboard, landing, settings, and migration updates.

Includes reviewer follow-ups for BOM cleanup, component fixes, migration readability, and history hygiene.

Author: 0x3EF8

app/(auth)/login/page.tsx

@@ -2,6 +2,8 @@ import Link from "next/link";
 import Image from "next/image";
 import LoginForm from "@/app/components/auth/LoginForm";
 import { Metadata } from "next";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faChevronLeft } from "@fortawesome/free-solid-svg-icons";
 
 export const metadata: Metadata = {
   title: "Login - DevPulse",
@@ -63,7 +65,15 @@ export default async function Login(props: {
       : undefined;
 
   return (
-    <div className="min-h-screen flex bg-[#0a0a1a] text-white">
+    <div className="min-h-screen flex bg-[#0a0a1a] text-white relative">
+      <Link
+        href="/"
+        className="absolute top-5 left-5 sm:top-6 sm:left-6 z-40 inline-flex items-center gap-2 text-sm text-gray-400 hover:text-white transition-colors"
+      >
+        <FontAwesomeIcon icon={faChevronLeft} className="w-4 h-4" />
+        Back
+      </Link>
+
       {/* Left Side - Visual / Branding */}
       <div className="hidden lg:flex lg:w-1/2 relative flex-col justify-between p-12 md:p-16 xl:p-24 border-r border-white/5 bg-gradient-to-br from-[#0a0a1a] to-[#0a0a1a] overflow-hidden">
         {/* Background elements */}

app/(auth)/signup/page.tsx

@@ -2,6 +2,8 @@ import Link from "next/link";
 import Image from "next/image";
 import SignupForm from "@/app/components/auth/SignupForm";
 import { Metadata } from "next";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faChevronLeft } from "@fortawesome/free-solid-svg-icons";
 
 export const metadata: Metadata = {
   title: "Sign Up - DevPulse",
@@ -50,7 +52,15 @@ export default async function Signup(props: {
       : undefined;
 
   return (
-    <div className="min-h-screen flex bg-[#0a0a1a] text-white">
+    <div className="min-h-screen flex bg-[#0a0a1a] text-white relative">
+      <Link
+        href="/"
+        className="absolute top-5 left-5 sm:top-6 sm:left-6 z-40 inline-flex items-center gap-2 text-sm text-gray-400 hover:text-white transition-colors"
+      >
+        <FontAwesomeIcon icon={faChevronLeft} className="w-4 h-4" />
+        Back
+      </Link>
+
       {/* Left Side - Visual / Branding */}
       <div className="hidden lg:flex lg:w-1/2 relative flex-col justify-between p-12 md:p-16 xl:p-24 border-r border-white/5 bg-gradient-to-br from-[#0a0a1a] to-[#0a0a1a] overflow-hidden">
         {/* Background elements */}

app/(user)/dashboard/settings/page.tsx

@@ -1,31 +1,61 @@
 import { Metadata } from "next";
 import UserProfile from "@/app/components/dashboard/Settings/Profile";
 import ResetPassword from "@/app/components/dashboard/Settings/ResetPassword";
+import WakaTimeKey from "@/app/components/dashboard/Settings/WakaTimeKey";
 import { getUserWithProfile } from "@/app/lib/supabase/help/user";
 import { redirect } from "next/navigation";
 
 export const metadata: Metadata = {
   title: "Settings - DevPulse",
 };
 
-export default async function LeaderboardsPage() {
-  const { user } = await getUserWithProfile();
+export default async function SettingsPage() {
+  const { user, profile } = await getUserWithProfile();
   if (!user) return redirect("/login?from=/dashboard/settings");
 
+  const hasWakaKey = Boolean(profile?.wakatime_api_key);
+  const maskedWakaKey = profile?.wakatime_api_key
+    ? `${profile.wakatime_api_key.slice(0, 8)}...${profile.wakatime_api_key.slice(-4)}`
+    : null;
+
   return (
-    <div className="p-6 md:p-8 space-y-6">
-      <div>
-        <h1 className="text-2xl font-bold text-white">Settings</h1>
-        <p className="text-sm text-gray-600">
-          Manage your account settings and including your WakaTime API key.
-        </p>
+    <div className="p-4 md:p-6 space-y-4 max-w-7xl mx-auto">
+      <div className="glass-card p-4 md:p-5 border-t-4 border-indigo-500/50">
+        <div className="flex flex-col md:flex-row md:items-center justify-between gap-4">
+          <div>
+            <h1 className="text-xl md:text-2xl font-bold text-white tracking-tight">
+              Account Settings
+            </h1>
+            <p className="text-xs md:text-sm text-gray-400 mt-1">
+              Manage profile details, WakaTime connection, and account security.
+            </p>
+          </div>
+
+          <div className="flex items-center gap-2 text-[11px] uppercase tracking-wider">
+            <span
+              className={`px-2 py-1 rounded-full border font-semibold ${
+                hasWakaKey
+                  ? "border-emerald-500/30 bg-emerald-500/10 text-emerald-300"
+                  : "border-amber-500/30 bg-amber-500/10 text-amber-300"
+              }`}
+            >
+              {hasWakaKey ? "WakaTime Connected" : "WakaTime Not Connected"}
+            </span>
+          </div>
+        </div>
       </div>
 
       {user && (
-        <>
-          <UserProfile user={user} />
-          <ResetPassword user={user} />
-        </>
+        <div className="grid grid-cols-1 xl:grid-cols-3 gap-4 items-start">
+          <div className="xl:col-span-2 space-y-4">
+            <UserProfile user={user} />
+            <WakaTimeKey hasKey={hasWakaKey} maskedKey={maskedWakaKey} />
+          </div>
+
+          <div className="xl:col-span-1">
+            <ResetPassword user={user} />
+          </div>
+        </div>
       )}
     </div>
   );

app/api/wakatime/sync/route.ts

@@ -1,8 +1,14 @@
 import { NextResponse } from "next/server";
 import { createClient } from "../../../lib/supabase/server";
 import { getUserWithProfile } from "@/app/lib/supabase/help/user";
+import {
+  buildSnapshotMetrics,
+  formatDateYMD,
+  toDateKey,
+} from "@/app/utils/wakatime";
 
 export async function GET(request: Request) {
+  const CONSISTENCY_DAYS = 365;
   const supabase = await createClient();
   const { user, profile } = await getUserWithProfile();
   const { searchParams } = new URL(request.url);
@@ -45,21 +51,29 @@ export async function GET(request: Request) {
 
     const now = new Date();
     const sixHours = 6 * 60 * 60 * 1000;
+    const existingDailyStats = Array.isArray(existing?.daily_stats)
+      ? existing.daily_stats
+      : [];
 
     if (existing?.last_fetched_at) {
       const lastFetch = new Date(existing.last_fetched_at).getTime();
-      if (now.getTime() - lastFetch < sixHours) {
+      if (
+        now.getTime() - lastFetch < sixHours &&
+        existingDailyStats.length >= CONSISTENCY_DAYS
+      ) {
         return NextResponse.json({ success: true, data: existing });
       }
     }
   }
 
   // Fetch from WakaTime API endpoints
   const endDate = new Date();
+  endDate.setHours(0, 0, 0, 0);
   const startDate = new Date();
-  startDate.setDate(endDate.getDate() - 6);
-  const endStr = endDate.toISOString().split("T")[0];
-  const startStr = startDate.toISOString().split("T")[0];
+  startDate.setHours(0, 0, 0, 0);
+  startDate.setDate(endDate.getDate() - (CONSISTENCY_DAYS - 1));
+  const endStr = formatDateYMD(endDate);
+  const startStr = formatDateYMD(startDate);
 
   const authHeader = `Basic ${Buffer.from(profile$.wakatime_api_key).toString("base64")}`;
 
@@ -94,11 +108,17 @@ export async function GET(request: Request) {
       range: { date: string };
       grand_total: { total_seconds: number };
     }) => ({
-      date: day.range.date,
-      total_seconds: day.grand_total.total_seconds,
+      date: toDateKey(day.range.date),
+      total_seconds: Math.floor(day.grand_total.total_seconds || 0),
     }),
   );
 
+  const snapshotMetrics = buildSnapshotMetrics(daily_stats);
+  const topLanguage =
+    Array.isArray(wakaStats.languages) && wakaStats.languages.length > 0
+      ? wakaStats.languages[0]
+      : null;
+
   if (apiKey) {
     const { error } = await supabase
       .from("profiles")
@@ -158,6 +178,35 @@ export async function GET(request: Request) {
     projects: projectsResult?.projects || [],
   };
 
+  const { error: snapshotError } = await supabase
+    .from("user_dashboard_snapshots")
+    .upsert(
+      {
+        user_id: user.id,
+        snapshot_date: endStr,
+        total_seconds_7d: snapshotMetrics.totalSeconds7d,
+        active_days_7d: snapshotMetrics.activeDays7d,
+        consistency_percent: snapshotMetrics.consistencyPercent,
+        current_streak: snapshotMetrics.currentStreak,
+        best_streak: snapshotMetrics.bestStreak,
+        peak_day: snapshotMetrics.peakDayDate,
+        peak_day_seconds: snapshotMetrics.peakDaySeconds,
+        top_language: topLanguage?.name || null,
+        top_language_percent:
+          typeof topLanguage?.percent === "number"
+            ? Number(topLanguage.percent.toFixed(2))
+            : null,
+        updated_at: new Date().toISOString(),
+      },
+      {
+        onConflict: "user_id,snapshot_date",
+      },
+    );
+
+  if (snapshotError) {
+    console.error("Failed to upsert user dashboard snapshot", snapshotError);
+  }
+
   return NextResponse.json({
     success: !!statsResult && !statsError && !projectsError,
     data: mergedResult,

app/components/BrowserCheck.tsx

@@ -24,4 +24,4 @@ export default function BrowserCheck() {
   }, []);
 
   return null;
-}
+}