Browse Source

refactor(profile/page.tsx): simplify session loading by using useWorkoutSessions hook and remove unnecessary state management
style(workout-session-heatmap.tsx): update heatmap color definitions for high and max activity to use consistent color scheme

Mathias 1 month ago
parent
commit
9e832cdedc

+ 4 - 17
app/[locale]/profile/page.tsx

@@ -1,37 +1,24 @@
 "use client";
-import { useEffect, useState } from "react";
 import { useRouter } from "next/navigation";
 
 import { useI18n } from "locales/client";
-import { useWorkoutSessionService } from "@/shared/lib/workout-session/use-workout-session.service";
 import { WorkoutSessionList } from "@/features/workout-session/ui/workout-session-list";
 import { WorkoutSessionHeatmap } from "@/features/workout-session/ui/workout-session-heatmap";
-import { useSession } from "@/features/auth/lib/auth-client";
+import { useWorkoutSessions } from "@/features/workout-session/model/use-workout-sessions";
 import { LocalAlert } from "@/components/ui/local-alert";
 import { Button } from "@/components/ui/button";
 
-import type { WorkoutSession } from "@/shared/lib/workout-session/types/workout-session";
-
 export default function ProfilePage() {
   const router = useRouter();
   const t = useI18n();
-  const [sessions, setSessions] = useState<WorkoutSession[]>([]);
-  const { getAll } = useWorkoutSessionService();
-  const { data: session } = useSession();
-
-  useEffect(() => {
-    const loadSessions = async () => {
-      const loadedSessions = await getAll();
-      setSessions(loadedSessions);
-    };
-    loadSessions();
-  }, []);
+  const { data: sessions = [] } = useWorkoutSessions();
 
   const values: Record<string, number> = {};
   sessions.forEach((session) => {
     const date = session.startedAt.slice(0, 10);
     values[date] = (values[date] || 0) + 1;
   });
+
   const until =
     sessions.length > 0
       ? sessions.reduce((max, s) => (s.startedAt > max ? s.startedAt : max), sessions[0].startedAt).slice(0, 10)
@@ -39,7 +26,7 @@ export default function ProfilePage() {
 
   return (
     <div>
-      {!session && <LocalAlert className="my-4" />}
+      {!sessions.length && <LocalAlert className="my-4" />}
       <WorkoutSessionHeatmap until={until} values={values} />
       <WorkoutSessionList />
       <div className="mt-8 flex justify-center">

+ 2 - 2
src/features/workout-session/ui/workout-session-heatmap.tsx

@@ -16,8 +16,8 @@ const DEFAULT_PANEL_COLORS = [
   "var(--color-base-300)", // 0: empty
   "var(--color-success)", // 1: low activity
   "var(--color-success-content)", // 2: medium activity
-  "var(--color-primary)", // 3: high activity
-  "var(--color-primary-content)", // 4: max activity
+  "var(--color-success-content)", // 3: high activity
+  "var(--color-success-content)", // 4: max activity
 ];
 const DEFAULT_DATE_FORMAT = "YYYY-MM-DD";