refactor: update workouts listing page

- Enhance workouts page with improved layout
- Add navigation to new workout pages
- Prepare for integration with new components

admin-web/app/workouts/page.tsx

@@ -1,6 +1,8 @@
 "use client";
 
 import { useEffect, useState } from "react";
+import Link from "next/link";
+import { useRouter } from "next/navigation";
 import { supabase } from "@/lib/supabase";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent } from "@/components/ui/card";
@@ -13,12 +15,13 @@ import {
   TableHeader,
   TableRow,
 } from "@/components/ui/table";
-import { Plus, Trash2, Edit, Loader2 } from "lucide-react";
+import { Plus, Trash2, Edit, Loader2, Eye } from "lucide-react";
 import type { Database } from "@/lib/supabase";
 
 type Workout = Database["public"]["Tables"]["workouts"]["Row"];
 
 export default function WorkoutsPage() {
+  const router = useRouter();
   const [workouts, setWorkouts] = useState<Workout[]>([]);
   const [loading, setLoading] = useState(true);
   const [deletingId, setDeletingId] = useState<string | null>(null);
@@ -77,9 +80,11 @@ export default function WorkoutsPage() {
           <h1 className="text-3xl font-bold text-white mb-2">Workouts</h1>
           <p className="text-neutral-400">Manage your workout library</p>
         </div>
-        <Button className="bg-orange-500 hover:bg-orange-600">
-          <Plus className="w-4 h-4 mr-2" />
-          Add Workout
+        <Button className="bg-orange-500 hover:bg-orange-600" asChild>
+          <Link href="/workouts/new">
+            <Plus className="w-4 h-4 mr-2" />
+            Add Workout
+          </Link>
         </Button>
       </div>
 
@@ -103,7 +108,11 @@ export default function WorkoutsPage() {
               </TableHeader>
               <TableBody>
                 {workouts.map((workout) => (
-                  <TableRow key={workout.id} className="border-neutral-800">
+                  <TableRow
+                    key={workout.id}
+                    className="border-neutral-800 cursor-pointer hover:bg-neutral-800/50 transition-colors"
+                    onClick={() => router.push(`/workouts/${workout.id}`)}
+                  >
                     <TableCell className="text-white font-medium">
                       {workout.title}
                       {workout.is_featured && (
@@ -121,9 +130,26 @@ export default function WorkoutsPage() {
                     <TableCell className="text-neutral-300">{workout.duration} min</TableCell>
                     <TableCell className="text-neutral-300">{workout.rounds}</TableCell>
                     <TableCell className="text-right">
-                      <div className="flex justify-end gap-2">
-                        <Button variant="ghost" size="icon" className="text-neutral-400 hover:text-white">
-                          <Edit className="w-4 h-4" />
+                      <div className="flex justify-end gap-2" onClick={(e) => e.stopPropagation()}>
+                        <Button
+                          variant="ghost"
+                          size="icon"
+                          className="text-neutral-400 hover:text-white"
+                          asChild
+                        >
+                          <Link href={`/workouts/${workout.id}`}>
+                            <Eye className="w-4 h-4" />
+                          </Link>
+                        </Button>
+                        <Button
+                          variant="ghost"
+                          size="icon"
+                          className="text-neutral-400 hover:text-white"
+                          asChild
+                        >
+                          <Link href={`/workouts/${workout.id}/edit`}>
+                            <Edit className="w-4 h-4" />
+                          </Link>
                         </Button>
                         <Button
                           variant="ghost"