Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/azahel79/Spartans-gym/llms.txt

Use this file to discover all available pages before exploring further.

The Dashboard is the central command panel of Spartans Gym. It surfaces the most important operational data at a glance — from today’s check-in volume and current occupancy to upcoming membership expirations and a live activity feed. Every metric on the page refreshes automatically in the background so staff never need to reload manually.

Role-Based Visibility

The dashboard renders different data depending on the authenticated user’s role. Admins see the full financial picture; receptionists see only attendance and movement data.
SectionAdminRecepcionista
Ingresos Totales del Mes (MXN)
Meta Mensual ($60,000)
Porcentaje de Meta
Total Movimientos
Ocupación Actual (%)
Afluencia por Hora
Afluencia por Día
Próximos Vencimientos
Actividad Reciente
Exportar CSV
The financial fields (ingresosTotalesMes, metaMensual, porcentajeMeta) are excluded from the API response entirely when the requesting user has the recepcionista role. They are not simply hidden on the frontend.

Stat Cards

Ingresos Totales del Mes

Admin only. Displays the sum of all transactions created in the current calendar month, formatted as MXN currency. A thin progress bar beneath the figure shows progress toward the fixed monthly goal of $60,000 MXN.

Total Movimientos

The cumulative count of all transactions recorded in the system. Visible to both roles. Sourced from dashboardStats.totalMovimientos or falls back to the local transaction count.

Ocupación Actual

Current occupancy expressed as a percentage: (todayAttendances / activeClients) × 100, capped at 100 %. An inline mini bar chart (Recharts) plots occupancy across the eight operating-hour buckets of the day.

Fecha de Hoy

A non-interactive badge in the top-right corner showing today’s date in dd de MMMM format (Spanish locale). Updates on each page render.

Charts

Afluencia por Hora (Hourly Occupancy)

A compact bar chart embedded inside the Ocupación Actual stat card. It groups today’s attendance records into two-hour buckets from 08:00 to 20:00. Each bar is colour-coded by load:
Occupancy rangeBar colour
> 80 %Dark red (#d60000)
61 – 80 %Red (#ff3b3b)
≤ 60 %Light grey (#e6e6e6)

Afluencia por Día (Weekly Chart)

A full-width grouped bar chart spanning the current ISO week (Monday – Sunday). Each day shows two bars side-by-side:
  • Proyectado (grey) — number of financial transactions recorded on that day.
  • Real (red) — number of attendance check-ins recorded on that day.
Data is sourced from dashboardStats.afluenciaPorDia when available, and computed locally from the client and transaction stores as a fallback.

Upcoming Expirations

The Próximos Vencimientos sidebar panel lists up to 5 active clients whose membership expires within the next 7 days, sorted by soonest first. Each row displays the client’s avatar (or initials if no photo is uploaded), full name, plan name, and a coloured urgency badge:
Days remainingBadge labelColour
≤ 3 daysURGENTERed
4 – 7 daysPENDIENTEOrange
Clicking Ver todos from this panel navigates to the full client list pre-filtered by expiration status, so staff can take immediate action on renewals.

Recent Activity Feed

The Actividad de Recepción table at the bottom of the page shows the 5 most recent combined events — both financial transactions and attendance check-ins — sorted by timestamp descending. Each row shows:
  • Iconcheck_circle (blue) for memberships/attendances, credit_card (red) for product sales, person_add (orange) for new registrations.
  • Name and concept — the member’s full name and the transaction or action label.
  • Area and time — the payment method (or “Recepcion”) and the time in HH:MM AM/PM format.

Auto-Refresh

The dashboard polls for fresh data every 30 seconds using a setInterval hook mounted in useEffect. On each tick, the following stores are re-fetched:
  • fetchTransactions() — updates the activity feed and revenue calculations.
  • fetchClients() — refreshes occupancy, upcoming expirations, and chart data.
  • fetchDashboardStats() — pulls the latest server-side aggregates from GET /api/dashboard/stats.
The interval is cleared automatically when the component unmounts to prevent memory leaks.

CSV Export

Clicking the Exportar button in the top-right header downloads a UTF-8 BOM-encoded CSV file immediately from the browser — no server round-trip required. The file name is generated dynamically based on the current user’s role and today’s date:
dashboard_admin_YYYY-MM-DD.csv
dashboard_recepcion_YYYY-MM-DD.csv
The CSV contains three logical sections concatenated into a single file with a shared four-column header (Seccion, Dato, Detalle, Extra):
Six summary rows covering:
  • Ingresos Totales Mes (admin) or “No disponible para este rol” (receptionist)
  • Meta Mensual
  • Porcentaje Meta
  • Total Movimientos
  • Ocupación Actual
  • Fecha de Exportación (full locale timestamp)
The export captures a point-in-time snapshot of whatever data is currently loaded in the browser. If the page has not refreshed in the last 30 seconds, the exported figures may be up to 30 seconds behind the live database.

Build docs developers (and LLMs) love