feat: translate dashboard page and components to English

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

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>