refactor(workout-session): simplify WorkoutSessionHeader and WorkoutSessionTimer components by removing unused props and state variables to enhance clarity and maintainability

refactor(workout-stepper): streamline WorkoutStepper component by removing unnecessary variables and props to improve readability and reduce complexity

src/features/workout-builder/ui/exercise-list-item.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable max-len */
 import { useState } from "react";
 import Image from "next/image";
 import { Play, Shuffle, Trash2, GripVertical, Loader2 } from "lucide-react";
@@ -44,7 +45,7 @@ export function ExerciseListItem({ exercise, muscle, onShuffle, onPick, onDelete
     setShowVideo(true);
   };
 
-  const handleOpenPickModal = () => {
+  const _handleOpenPickModal = () => {
     setShowPickModal(true);
   };
 

src/features/workout-builder/ui/workout-stepper.tsx

@@ -77,8 +77,7 @@ export function WorkoutStepper() {
     }
   }, [currentStep, selectedEquipment, selectedMuscles, fromSession]);
 
-  const { isWorkoutActive, session, startWorkout, formatElapsedTime, isTimerRunning, toggleTimer, resetTimer, quitWorkout } =
-    useWorkoutSession();
+  const { isWorkoutActive, session, startWorkout, quitWorkout } = useWorkoutSession();
 
   const canContinue = currentStep === 1 ? canProceedToStep2 : currentStep === 2 ? canProceedToStep3 : exercisesByMuscle.length > 0;
 
@@ -165,15 +164,7 @@ export function WorkoutStepper() {
   if (isWorkoutActive && session) {
     return (
       <div className="w-full max-w-6xl mx-auto">
-        {!showCongrats && (
-          <WorkoutSessionHeader
-            elapsedTime={formatElapsedTime()}
-            isTimerRunning={isTimerRunning}
-            onQuitWorkout={quitWorkout}
-            onResetTimer={resetTimer}
-            onToggleTimer={toggleTimer}
-          />
-        )}
+        {!showCongrats && <WorkoutSessionHeader onQuitWorkout={quitWorkout} />}
         <WorkoutSessionSets isWorkoutActive={isWorkoutActive} onCongrats={() => setShowCongrats(true)} showCongrats={showCongrats} />
       </div>
     );

src/features/workout-session/ui/workout-session-header.tsx

@@ -12,23 +12,12 @@ import { Button } from "@/components/ui/button";
 import { QuitWorkoutDialog } from "../../workout-builder/ui/quit-workout-dialog";
 
 interface WorkoutSessionHeaderProps {
-  elapsedTime: string;
-  isTimerRunning: boolean;
-  onToggleTimer: VoidFunction;
-  onResetTimer: VoidFunction;
   onQuitWorkout: VoidFunction;
 }
 
-export function WorkoutSessionHeader({
-  elapsedTime,
-  isTimerRunning,
-  onToggleTimer,
-  onResetTimer,
-  onQuitWorkout,
-}: WorkoutSessionHeaderProps) {
+export function WorkoutSessionHeader({ onQuitWorkout }: WorkoutSessionHeaderProps) {
   const t = useI18n();
   const [showQuitDialog, setShowQuitDialog] = useState(false);
-  const [resetCount, setResetCount] = useState(0);
   const [volumeUnit, setVolumeUnit] = useState<WeightUnit>("kg");
   const locale = useCurrentLocale();
   const { getExercisesCompleted, getTotalExercises, session, getTotalVolumeInUnit } = useWorkoutSession();

src/features/workout-session/ui/workout-session-timer.tsx

@@ -3,17 +3,13 @@
 import { useState } from "react";
 import { Play, Pause, RotateCcw } from "lucide-react";
 
-import { useI18n } from "locales/client";
 import { cn } from "@/shared/lib/utils";
 import { useWorkoutSession } from "@/features/workout-builder";
 import { Timer } from "@/components/ui/timer";
 import { Button } from "@/components/ui/button";
 
 export function WorkoutSessionTimer() {
-  const t = useI18n();
-
   const { isWorkoutActive, isTimerRunning, toggleTimer, resetTimer } = useWorkoutSession();
-  console.log("isWorkoutActive:", isWorkoutActive);
 
   const [resetCount, setResetCount] = useState(0);
 
@@ -27,7 +23,7 @@ export function WorkoutSessionTimer() {
   }
 
   return (
-    <div className="absolute bottom-16 left-0 right-0 flex justify-center mb-3">
+    <div className="absolute bottom-16 left-0 right-4 flex justify-center mb-3">
       <div className="bg-white dark:bg-slate-900 rounded-full px-6 py-4 border border-slate-200 dark:border-slate-700 shadow-lg backdrop-blur-sm">
         <div className="flex items-center justify-between gap-4">
           {/* Timer display */}