Sort stations in combo box alphabetically (#139)

* feat(global): add toSortedStationsAlphabetically fn;

* chore(global): remove unnecessary parentheses;

* fixed the root station to always appear on top

---------

Co-authored-by: Amar Cerim <[email protected]>

frontend/src/app/lib/utils.ts

@@ -1,6 +1,16 @@
+import Station from '@/models/station.model';
 import { clsx, type ClassValue } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs));
 }
+
+export function toSortedStationsAlphabetically(stations:Station[]):Station[] {
+  const rootStationName = 'Zenica "AS"'
+
+  return stations.sort((a, b) => {
+    if (a.name === rootStationName || b.name === rootStationName) return 1;
+    return a.name.localeCompare(b.name);
+  });
+}

frontend/src/app/page.tsx

@@ -14,6 +14,7 @@ import RouteSearchResult from "./routes/RouteSearchResult";
 import AgencyService from "./services/agency.service";
 import RouteService from "./services/route.service";
 import StationService from "./services/station.service";
+import { toSortedStationsAlphabetically } from "@/lib/utils";
 
 const HomePage: React.FC = () => {
   const [routeResults, setRouteResults] = useState<RouteLap[]>([]);
@@ -83,7 +84,7 @@ const HomePage: React.FC = () => {
     const fetchStations = async () => {
       try {
         const fetchedStations = await StationService.getStations();
-        setStations(fetchedStations);
+        setStations(toSortedStationsAlphabetically(fetchedStations));
       } catch (error) {
         console.error("Error fetching stations:", error);
       }