consultoria-as/app-padel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: translate dashboard page and components to English

Browse Source 
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Ivan
2026-03-01 21:22:53 +00:00
parent 55676f59bd
commit 0fb27b1825
5 changed files with 38 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
apps/web/app/(admin)/dashboard/page.tsx
View File

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

14
apps/web/components/dashboard/occupancy-chart.tsx
View File

@@ -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" 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> </svg>
Ocupacion de Canchas Court Occupancy
</CardTitle> </CardTitle>
</CardHeader> </CardHeader>
<CardContent> <CardContent>
@@ -57,7 +57,7 @@ export function OccupancyChart({ data, isLoading = false }: OccupancyChartProps)
d="M20 12H4M12 20V4" d="M20 12H4M12 20V4"
/> />
</svg> </svg>
<p className="text-sm">No hay canchas configuradas</p> <p className="text-sm">No courts configured</p>
</div> </div>
</CardContent> </CardContent>
</Card> </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" 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> </svg>
Ocupacion de Canchas Court Occupancy
</CardTitle> </CardTitle>
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<span <span
@@ -147,10 +147,10 @@ export function OccupancyChart({ data, isLoading = false }: OccupancyChartProps)
: "text-primary-500" : "text-primary-500"
)} )}
> >
{court.occupancyPercent}% ocupado {court.occupancyPercent}% booked
</span> </span>
<span className="text-xs text-green-600"> <span className="text-xs text-green-600">
{court.availableHours - court.bookedHours}h disponible {court.availableHours - court.bookedHours}h available
</span> </span>
</div> </div>
</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 justify-center gap-6 mt-6 pt-4 border-t border-primary-100">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="w-3 h-3 rounded-full bg-blue-400"></div> <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>
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="w-3 h-3 rounded-full bg-green-100"></div> <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>
</div> </div>
</CardContent> </CardContent>

18
apps/web/components/dashboard/quick-actions.tsx
View File

@@ -14,7 +14,7 @@ interface QuickAction {
const quickActions: QuickAction[] = [ const quickActions: QuickAction[] = [
{ {
label: "Nueva Reserva", label: "New Booking",
href: "/bookings", href: "/bookings",
icon: ( icon: (
<svg <svg
@@ -32,10 +32,10 @@ const quickActions: QuickAction[] = [
</svg> </svg>
), ),
color: "bg-blue-500 hover:bg-blue-600", 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", href: "/pos",
icon: ( icon: (
<svg <svg
@@ -53,10 +53,10 @@ const quickActions: QuickAction[] = [
</svg> </svg>
), ),
color: "bg-green-500 hover:bg-green-600", 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", href: "/pos",
icon: ( icon: (
<svg <svg
@@ -74,10 +74,10 @@ const quickActions: QuickAction[] = [
</svg> </svg>
), ),
color: "bg-purple-500 hover:bg-purple-600", 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", href: "/clients",
icon: ( icon: (
<svg <svg
@@ -95,7 +95,7 @@ const quickActions: QuickAction[] = [
</svg> </svg>
), ),
color: "bg-orange-500 hover:bg-orange-600", 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" d="M13 10V3L4 14h7v7l9-11h-7z"
/> />
</svg> </svg>
Acciones Rapidas Quick Actions
</CardTitle> </CardTitle>
</CardHeader> </CardHeader>
<CardContent> <CardContent>

18
apps/web/components/dashboard/recent-bookings.tsx
View File

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

2
apps/web/components/dashboard/stat-card.tsx
View File

@@ -98,7 +98,7 @@ export function StatCard({ title, value, icon, trend, color = "primary" }: StatC
{trend.isPositive ? "+" : ""} {trend.isPositive ? "+" : ""}
{trend.value}% {trend.value}%
</span> </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>
)} )}
</div> </div>