feat: translate dashboard page and components to English

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

apps/web/app/(admin)/dashboard/page.tsx

@@ -67,14 +67,14 @@ export default function DashboardPage() {
       const response = await fetch(url);
 
       if (!response.ok) {
-        throw new Error("Error al cargar los datos del dashboard");
+        throw new Error("Error loading dashboard data");
       }
 
       const data = await response.json();
       setDashboardData(data);
     } catch (err) {
       console.error("Dashboard fetch error:", err);
-      setError(err instanceof Error ? err.message : "Error desconocido");
+      setError(err instanceof Error ? err.message : "Unknown error");
     } finally {
       setIsLoading(false);
     }
@@ -84,7 +84,7 @@ export default function DashboardPage() {
     fetchDashboardData();
   }, [fetchDashboardData]);
 
-  const userName = session?.user?.name?.split(" ")[0] || "Usuario";
+  const userName = session?.user?.name?.split(" ")[0] || "User";
   const today = new Date();
 
   return (
@@ -93,10 +93,10 @@ export default function DashboardPage() {
       <div className="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
         <div>
           <h1 className="text-2xl font-bold text-primary-800">
-            Bienvenido, {userName}
+            Welcome, {userName}
           </h1>
           <p className="text-primary-500 mt-1">
-            {formatDate(today)} - Panel de administracion
+            {formatDate(today)} - Admin panel
           </p>
         </div>
         {selectedSite && (
@@ -121,7 +121,7 @@ export default function DashboardPage() {
               />
             </svg>
             <span className="text-sm font-medium text-accent-700">
-              Mostrando: {selectedSite.name}
+              Showing: {selectedSite.name}
             </span>
           </div>
         )}
@@ -161,7 +161,7 @@ export default function DashboardPage() {
         ) : dashboardData ? (
           <>
             <StatCard
-              title="Reservas Hoy"
+              title="Today's Bookings"
               value={dashboardData.stats.todayBookings}
               color="blue"
               icon={
@@ -181,7 +181,7 @@ export default function DashboardPage() {
               }
             />
             <StatCard
-              title="Ingresos Hoy"
+              title="Today's Revenue"
               value={formatCurrency(dashboardData.stats.todayRevenue)}
               color="green"
               icon={
@@ -201,7 +201,7 @@ export default function DashboardPage() {
               }
             />
             <StatCard
-              title="Ocupacion"
+              title="Occupancy"
               value={`${dashboardData.stats.occupancyRate}%`}
               color="purple"
               icon={
@@ -221,7 +221,7 @@ export default function DashboardPage() {
               }
             />
             <StatCard
-              title="Miembros Activos"
+              title="Active Members"
               value={dashboardData.stats.activeMembers}
               color="accent"
               icon={
@@ -248,7 +248,7 @@ export default function DashboardPage() {
       {!isLoading && dashboardData && (
         <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
           <StatCard
-            title="Reservas Pendientes"
+            title="Pending Bookings"
             value={dashboardData.stats.pendingBookings}
             color="orange"
             icon={
@@ -268,7 +268,7 @@ export default function DashboardPage() {
             }
           />
           <StatCard
-            title="Torneos Proximos"
+            title="Upcoming Events"
             value={dashboardData.stats.upcomingTournaments}
             color="primary"
             icon={

apps/web/components/dashboard/occupancy-chart.tsx

@@ -39,7 +39,7 @@ export function OccupancyChart({ data, isLoading = false }: OccupancyChartProps)
                 d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"
               />
             </svg>
-            Ocupacion de Canchas
+            Court Occupancy
           </CardTitle>
         </CardHeader>
         <CardContent>
@@ -57,7 +57,7 @@ export function OccupancyChart({ data, isLoading = false }: OccupancyChartProps)
                 d="M20 12H4M12 20V4"
               />
             </svg>
-            <p className="text-sm">No hay canchas configuradas</p>
+            <p className="text-sm">No courts configured</p>
           </div>
         </CardContent>
       </Card>
@@ -89,7 +89,7 @@ export function OccupancyChart({ data, isLoading = false }: OccupancyChartProps)
                 d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"
               />
             </svg>
-            Ocupacion de Canchas
+            Court Occupancy
           </CardTitle>
           <div className="flex items-center gap-2">
             <span
@@ -147,10 +147,10 @@ export function OccupancyChart({ data, isLoading = false }: OccupancyChartProps)
                       : "text-primary-500"
                   )}
                 >
-                  {court.occupancyPercent}% ocupado
+                  {court.occupancyPercent}% booked
                 </span>
                 <span className="text-xs text-green-600">
-                  {court.availableHours - court.bookedHours}h disponible
+                  {court.availableHours - court.bookedHours}h available
                 </span>
               </div>
             </div>
@@ -161,11 +161,11 @@ export function OccupancyChart({ data, isLoading = false }: OccupancyChartProps)
         <div className="flex items-center justify-center gap-6 mt-6 pt-4 border-t border-primary-100">
           <div className="flex items-center gap-2">
             <div className="w-3 h-3 rounded-full bg-blue-400"></div>
-            <span className="text-xs text-primary-500">Ocupado</span>
+            <span className="text-xs text-primary-500">Booked</span>
           </div>
           <div className="flex items-center gap-2">
             <div className="w-3 h-3 rounded-full bg-green-100"></div>
-            <span className="text-xs text-primary-500">Disponible</span>
+            <span className="text-xs text-primary-500">Available</span>
           </div>
         </div>
       </CardContent>

apps/web/components/dashboard/quick-actions.tsx

@@ -14,7 +14,7 @@ interface QuickAction {
 
 const quickActions: QuickAction[] = [
   {
-    label: "Nueva Reserva",
+    label: "New Booking",
     href: "/bookings",
     icon: (
       <svg
@@ -32,10 +32,10 @@ const quickActions: QuickAction[] = [
       </svg>
     ),
     color: "bg-blue-500 hover:bg-blue-600",
-    description: "Crear una nueva reserva de cancha",
+    description: "Create a new court booking",
   },
   {
-    label: "Abrir Caja",
+    label: "Open Register",
     href: "/pos",
     icon: (
       <svg
@@ -53,10 +53,10 @@ const quickActions: QuickAction[] = [
       </svg>
     ),
     color: "bg-green-500 hover:bg-green-600",
-    description: "Iniciar turno de caja registradora",
+    description: "Start cash register shift",
   },
   {
-    label: "Nueva Venta",
+    label: "New Sale",
     href: "/pos",
     icon: (
       <svg
@@ -74,10 +74,10 @@ const quickActions: QuickAction[] = [
       </svg>
     ),
     color: "bg-purple-500 hover:bg-purple-600",
-    description: "Registrar venta en el punto de venta",
+    description: "Record a point of sale transaction",
   },
   {
-    label: "Registrar Cliente",
+    label: "Register Player",
     href: "/clients",
     icon: (
       <svg
@@ -95,7 +95,7 @@ const quickActions: QuickAction[] = [
       </svg>
     ),
     color: "bg-orange-500 hover:bg-orange-600",
-    description: "Agregar un nuevo cliente al sistema",
+    description: "Add a new player to the system",
   },
 ];
 
@@ -117,7 +117,7 @@ export function QuickActions() {
               d="M13 10V3L4 14h7v7l9-11h-7z"
             />
           </svg>
-          Acciones Rapidas
+          Quick Actions
         </CardTitle>
       </CardHeader>
       <CardContent>

apps/web/components/dashboard/recent-bookings.tsx

@@ -27,23 +27,23 @@ interface RecentBookingsProps {
 
 const statusConfig: Record<string, { label: string; className: string }> = {
   PENDING: {
-    label: "Pendiente",
+    label: "Pending",
     className: "bg-yellow-100 text-yellow-700",
   },
   CONFIRMED: {
-    label: "Confirmada",
+    label: "Confirmed",
     className: "bg-blue-100 text-blue-700",
   },
   COMPLETED: {
-    label: "Completada",
+    label: "Completed",
     className: "bg-green-100 text-green-700",
   },
   CANCELLED: {
-    label: "Cancelada",
+    label: "Cancelled",
     className: "bg-red-100 text-red-700",
   },
   NO_SHOW: {
-    label: "No asistio",
+    label: "No Show",
     className: "bg-gray-100 text-gray-700",
   },
 };
@@ -71,11 +71,11 @@ export function RecentBookings({ bookings, isLoading = false }: RecentBookingsPr
                 d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"
               />
             </svg>
-            Reservas de Hoy
+            Today's Bookings
           </CardTitle>
           <Link href="/bookings">
             <Button variant="ghost" size="sm" className="text-sm">
-              Ver todas
+              View all
               <svg
                 className="w-4 h-4 ml-1"
                 fill="none"
@@ -109,7 +109,7 @@ export function RecentBookings({ bookings, isLoading = false }: RecentBookingsPr
                 d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"
               />
             </svg>
-            <p className="text-sm">No hay reservas para hoy</p>
+            <p className="text-sm">No bookings for today</p>
           </div>
         ) : (
           <div className="space-y-3">
@@ -139,7 +139,7 @@ export function RecentBookings({ bookings, isLoading = false }: RecentBookingsPr
                   {/* Details */}
                   <div className="flex-1 min-w-0">
                     <p className="text-sm font-medium text-primary-800 truncate">
-                      {booking.client?.name || "Sin cliente"}
+                      {booking.client?.name || "Walk-in"}
                     </p>
                     <p className="text-xs text-primary-500 truncate">
                       {booking.court.name}

apps/web/components/dashboard/stat-card.tsx

@@ -98,7 +98,7 @@ export function StatCard({ title, value, icon, trend, color = "primary" }: StatC
                   {trend.isPositive ? "+" : ""}
                   {trend.value}%
                 </span>
-                <span className="text-xs text-primary-400 ml-1">vs ayer</span>
+                <span className="text-xs text-primary-400 ml-1">vs yesterday</span>
               </div>
             )}
           </div>