fix: update reservoir names to a friendlier format

front/src/app/embalse/[embalse]/page.tsx

@@ -12,7 +12,7 @@ import {
   mapEmbalseToReservoirData,
   mapHistoricalReservoirToViewModel,
 } from "@/pods/embalse/embalse.mapper";
-import { formatEmbalseDisplayName } from "@/pods/embalse/embalse-name.helper";
+import { formatEmbalseDisplayName } from "@/common/helpers/embalse-name.helper";
 
 export const revalidate = 300; // ISR: regenerar cada 5 minutos
 

front/src/pods/embalse/embalse-name.helper.spec.ts → front/src/common/helpers/embalse-name.helper.spec.ts

@@ -6,6 +6,9 @@ describe("formatEmbalseDisplayName", () => {
     expect(formatEmbalseDisplayName("Atazar, El")).toBe("El Atazar");
     expect(formatEmbalseDisplayName("Pardo, El")).toBe("El Pardo");
     expect(formatEmbalseDisplayName("Villar, El")).toBe("El Villar");
+    expect(formatEmbalseDisplayName("Forcadas, As")).toBe("As Forcadas");
+    expect(formatEmbalseDisplayName("Peares, Os")).toBe("Os Peares");
+    expect(formatEmbalseDisplayName("Ribeira, A")).toBe("A Ribeira");
   });
 
   it("flips comma-inverted La", () => {
@@ -30,4 +33,7 @@ describe("formatEmbalseDisplayName", () => {
   it("returns empty string for empty input", () => {
     expect(formatEmbalseDisplayName("")).toBe("");
   });
+  it("inverts article in parenthesized format", () => {
+    expect(formatEmbalseDisplayName("Loteta (La)")).toBe("La Loteta");
+  });
 });

front/src/pods/embalse/embalse-name.helper.ts → front/src/common/helpers/embalse-name.helper.ts

@@ -1,4 +1,5 @@
-const INVERTED_ARTICLE_PATTERN = /^(.+?),\s*(El|La|Los|Las)\b\s*(.*)$/;
+const INVERTED_ARTICLE_PATTERN =
+  /^(.+?)(?:,\s*|\s*\()(El|La|Los|Las|Os|A|As)(?:\)|\b\s*)\s*(.*)$/;
 
 export const formatEmbalseDisplayName = (rawName: string): string => {
   if (!rawName) return "";

front/src/pods/embalse-cuenca/embalse-cuenca.component.tsx

@@ -1,8 +1,8 @@
-"use client";
 import { Card } from "@/common/components/card.component";
 import { Lookup } from "@/common/models";
 import { generateSlug } from "db-model";
 import Link from "next/link";
+import { formatEmbalseDisplayName } from "@/common/helpers/embalse-name.helper";
 
 export interface Props {
   nombreCuenca: string;
@@ -26,7 +26,7 @@ export const EmbalseCuencaComponent: React.FC<Props> = (props) => {
               href={`/embalse/${generateSlug(name)}`}
               className="link-accessible"
             >
-              {name}
+              {formatEmbalseDisplayName(name)}
             </Link>
           ))}
         </div>

front/src/pods/embalse-provincia/embalse-provincia.component.tsx

@@ -2,6 +2,7 @@ import { Card } from "@/common/components/card.component";
 import { Lookup } from "@/common/models";
 import Link from "next/link";
 import React from "react";
+import { formatEmbalseDisplayName } from "@/common/helpers/embalse-name.helper";
 
 interface Props {
   nombreProvincia: string;
@@ -21,7 +22,7 @@ export const EmbalseProvincia: React.FC<Props> = (props) => {
         <div className="grid grid-cols-1 gap-4 p-6 sm:grid-cols-2 md:grid-cols-3">
           {embalses.map(({ id, name }) => (
             <Link key={id} href={`/embalse/${id}`} className="link-accessible">
-              {name}
+              {formatEmbalseDisplayName(name)}
             </Link>
           ))}
         </div>

front/src/pods/embalse-search/components/filtered-list.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 import { useCombobox } from "downshift";
 import { EmbalseSearchModel } from "../embalse-search.vm";
+import { formatEmbalseDisplayName } from "@/common/helpers/embalse-name.helper";
 
 interface Props {
   isOpen: boolean;
@@ -35,7 +36,7 @@ export const FilteredList: React.FC<Props> = (props) => {
               highlightedIndex === index ? "bg-primary text-white" : ""
             }`}
           >
-            {item.name}
+            {formatEmbalseDisplayName(item.name)}
           </li>
         ))}
     </ul>

front/src/pods/embalse-search/components/recent-searches/recent-searches.component.tsx

@@ -1,5 +1,6 @@
 import Link from "next/link";
 import { EmbalseSearchModel } from "../../embalse-search.vm";
+import { formatEmbalseDisplayName } from "@/common/helpers/embalse-name.helper";
 
 interface Props {
   searches: EmbalseSearchModel[];
@@ -14,7 +15,9 @@ export const RecentSearches: React.FC<Props> = (props) => {
       <ul>
         {searches.map((item) => (
           <li key={item.slug} className="mt-3">
-            <Link className="link-accessible" href={`/embalse/${item.slug}`}>{item.name} </Link>
+            <Link className="link-accessible" href={`/embalse/${item.slug}`}>
+              {formatEmbalseDisplayName(item.name)}
+            </Link>
           </li>
         ))}
       </ul>

front/src/pods/embalse-search/embalse-search.tsx

@@ -10,6 +10,7 @@ import { getFilteredEmbalses as getFilteredEmbalsesBusiness } from "./embalse-se
 import { FilteredList } from "./components/filtered-list";
 import { Input } from "./components/input";
 import { RecentSearches, useRecentSearches } from "./components";
+import { formatEmbalseDisplayName } from "@/common/helpers/embalse-name.helper";
 
 interface Props {
   embalses: Embalse[];
@@ -23,7 +24,8 @@ export const EmbalseSearch: React.FC<Props> = (props) => {
   >([]);
   const [isNavigating, setIsNavigating] = useState<boolean>(false);
   const [inputValue, setInputValue] = useState<string>("");
-  const { addNewEmbalseToLatestSearchCollection, recentSearches } = useRecentSearches();
+  const { addNewEmbalseToLatestSearchCollection, recentSearches } =
+    useRecentSearches();
 
   const getFilteredEmbalses = (inputValue: string): EmbalseSearchModel[] => {
     return getFilteredEmbalsesBusiness(inputValue, embalses);
@@ -36,7 +38,7 @@ export const EmbalseSearch: React.FC<Props> = (props) => {
     highlightedIndex,
   } = useCombobox<EmbalseSearchModel>({
     items: filteredEmbalses,
-    itemToString: (item) => (item ? item.name : ""),
+    itemToString: (item) => (item ? formatEmbalseDisplayName(item.name) : ""),
     onInputValueChange: ({ inputValue: newValue }) => {
       setInputValue(newValue || "");
       setFilteredEmbalses(newValue ? getFilteredEmbalses(newValue) : []);

front/src/pods/embalse/components/reservoir-card-gauge.tsx

@@ -9,7 +9,7 @@ import { GaugeChart } from "./reservoir-gauge";
 import { GaugeLegend } from "./reservoir-gauge/gauge-chart/components/gauge-legend.component";
 import { HistoryChart } from "./chart";
 import { useIsMobile } from "./useIsMobile";
-import { formatEmbalseDisplayName } from "../embalse-name.helper";
+import { formatEmbalseDisplayName } from "@/common/helpers/embalse-name.helper";
 interface Props {
   name: string;
   reservoirData: ReservoirData;

front/src/pods/embalse/components/reservoir-card-info.component.tsx

@@ -1,6 +1,6 @@
 import { ReservoirInfo } from "../embalse.vm";
 import React from "react";
-import Image from "next/image";
+import { formatEmbalseDisplayName } from "@/common/helpers/embalse-name.helper";
 
 interface Props {
   reservoirInfo: ReservoirInfo;
@@ -14,7 +14,9 @@ export const ReservoirCardInfo: React.FC<Props> = (props) => {
       className="flex w-full flex-col items-start gap-4"
       aria-labelledby="discover-title"
     >
-      <h2 id="discover-title">Descubre el embalse {reservoirInfo?.name}</h2>
+      <h2 id="discover-title">
+        Descubre el embalse {formatEmbalseDisplayName(reservoirInfo?.name)}
+      </h2>
       <p>{reservoirInfo?.description}</p>
       {reservoirInfo?.mainPicture?.url && (
         <>