added sorting and Connected Icon on Station

This commit is contained in:
PxlLoewe
2025-06-08 17:03:23 -07:00
parent fc3272bca5
commit b553f8107d
2 changed files with 33 additions and 12 deletions

View File

@@ -419,6 +419,7 @@ const Rettungsmittel = ({ mission }: { mission: Mission }) => {
label: station.bosCallsign, label: station.bosCallsign,
value: station.id, value: station.id,
type: "station" as const, type: "station" as const,
isOnline: !!conenctedAircrafts?.find((a) => a.stationId === station.id),
})) || []), })) || []),
...(!mission.hpgFireEngineState || mission.hpgFireEngineState === "NOT_REQUESTED" ...(!mission.hpgFireEngineState || mission.hpgFireEngineState === "NOT_REQUESTED"
? [{ label: "Feuerwehr", value: "FW", type: "vehicle" as const }] ? [{ label: "Feuerwehr", value: "FW", type: "vehicle" as const }]
@@ -429,7 +430,21 @@ const Rettungsmittel = ({ mission }: { mission: Mission }) => {
...(!mission.hpgPoliceState || mission.hpgPoliceState === "NOT_REQUESTED" ...(!mission.hpgPoliceState || mission.hpgPoliceState === "NOT_REQUESTED"
? [{ label: "POLizei", value: "POL", type: "vehicle" as const }] ? [{ label: "POLizei", value: "POL", type: "vehicle" as const }]
: []), : []),
]; ].sort((a, b) => {
// 1. Vehicles first
if (a.type === "vehicle" && b.type !== "vehicle") return -1;
if (a.type !== "vehicle" && b.type === "vehicle") return 1;
// 2. Online stations before offline stations
if (a.type === "station" && b.type === "station") {
if (a.isOnline && !b.isOnline) return -1;
if (!a.isOnline && b.isOnline) return 1;
}
// 3. Otherwise, sort alphabetically by label
return a.label.localeCompare(b.label);
return 0;
});
useEffect(() => { useEffect(() => {
const firstOption = stationsOptions[0]; const firstOption = stationsOptions[0];
@@ -568,7 +583,6 @@ const Rettungsmittel = ({ mission }: { mission: Mission }) => {
<button <button
className="btn btn-sm btn-primary btn-outline" className="btn btn-sm btn-primary btn-outline"
onClick={async () => { onClick={async () => {
console.log("Selected Station:", selectedStation);
if (typeof selectedStation === "string") { if (typeof selectedStation === "string") {
await sendAlertMutation.mutate({ await sendAlertMutation.mutate({
id: mission.id, id: mission.id,

View File

@@ -259,11 +259,18 @@ export const MissionForm = () => {
placeholder="Wähle ein oder mehrere Rettungsmittel aus" placeholder="Wähle ein oder mehrere Rettungsmittel aus"
isMulti isMulti
form={form} form={form}
options={stations?.map((s) => ({ options={stations
?.sort((a, b) => {
const aHasAircraft = aircrafts?.some((ac) => ac.stationId === a.id) ? 0 : 1;
const bHasAircraft = aircrafts?.some((ac) => ac.stationId === b.id) ? 0 : 1;
return aHasAircraft - bHasAircraft;
})
.map((s) => ({
label: ( label: (
/* TODO: Only show radio icon if station online and sort online stations to the top */
<span className="flex items-center gap-2"> <span className="flex items-center gap-2">
{aircrafts?.some((a) => a.stationId === s.id) && (
<Radio className="text-success" size={15} /> <Radio className="text-success" size={15} />
)}
{s.bosCallsign} {s.bosCallsign}
</span> </span>
), ),