Province Total Reservoir Capacity Gauge

[manudous]

Feature: Province Total Reservoir Capacity Gauge

Context

Currently, the province page (/embalse-provincia/[provincia]) only displays a list of links to individual reservoirs. We want to add a visual gauge that shows the aggregated total capacity of all reservoirs in that province and the overall fill percentage, using the same gauge components used in the reservoir detail page.

---

Goals

• Reuse the existing gauge components (GaugeChart and GaugeLegend).
• Aggregate data across multiple reservoirs, applying the SAIH > AEMET prioritization per reservoir.
• Display:
  • Total capacity (hm³)
  • Aggregated current volume (hm³)
  • Overall fill percentage
  • Most recent measurement date among all reservoirs
• Keep visual consistency with the rest of the application and ensure responsive design.

---

Tasks

Update repository to fetch full data

File: embalse-provincia.repository.ts

Update the MongoDB projection to include the required fields:

• capacidad
• aguaActualSAIH
• aguaActualAemet
• fechaMedidaAguaActualSAIH
• fechaMedidaAguaActualAemet

Currently it only fetches _id, nombre, and slug.

---

Update API model

File: embalse-provincia.api-model.ts

Extend the EmbalseApi interface to include the new fields:

• capacidad
• aguaActualSAIH
• aguaActualAemet
• fechaMedidaAguaActualSAIH
• fechaMedidaAguaActualAemet

---

Create aggregation function in the mapper

File: embalse-provincia.mapper.ts

Implement aggregateProvinciaCapacityData() that:

• Iterates over all reservoirs in the province.
• For each reservoir, applies prioritization:
  • aguaActualSAIH ?? aguaActualAemet ?? 0
  • (same logic as in embalse.mapper.ts around lines 31–35)
• Sums:
  • totalCapacity = sum of all capacidad
  • currentVolume = sum of prioritized current water values
• Determines the most recent measurement date among all reservoirs.
• Returns:
  • { totalCapacity, currentVolume, measurementDate }

⚠️ Important: The prioritization SAIH > AEMET must be applied per reservoir before summing, since SAIH updates more frequently (basin scrapers).

Note: This is already being done in embalse.mapper.ts, see if it works for us. If so, move it to common.

---

Create province gauge component (new)

File: provincia-capacity-gauge.component.tsx (new)

Create a component that:

• Receives nombreProvincia and capacityData
• Reuses:
  • GaugeChart
  • GaugeLegend
    from @/pods/embalse/components/reservoir-gauge
• Displays a title like: "Capacidad Total de [NombreProvincia]"
• Computes percentage:
  • percentage = currentVolume / totalCapacity
• Uses semantic HTML and accessibility attributes (e.g., aria-label).

⚠️ Important:: As GaugeChart and GaugeLegend will be used in different components, move them to common.

---

Integrate in the page

File: page.tsx

• Call aggregateProvinciaCapacityData() with the reservoirs fetched for the province.
• Pass aggregated data to the pod.

---

Update the pod to render the gauge

File: embalse-provincia.pod.tsx

• Receive capacityData as a prop.
• Render <ProvinciaCapacityGauge /> before <EmbalseProvincia />.
• Apply responsive, consistent styles (matching the app layout).

[brauliodiez]

Update:

Server side

• We are going to implement this using calculated fields.

• We will create a collection named "totales_provincias".

• This collection will hold the following info:

interface TotalesProvincia {
  _id -> GUID
  capacidad
  aguaActual
}

¿How are we going to fill this collection? executing an aggregate like this:

{
  _id: "$provincia",
  totalCapacidad: {
    $sum: "$capacidad"
  },
  totalAguaActualAemet: {
    $sum: "$aguaActualAemet"
  }
}

We need to update this the collection, upsert like?

Create a new function that will be executed twice per week.

front end

In the front end add to each province the total guage chart and just query the collection we have created previously