diff --git a/client/src/api/flightsSlice.ts b/client/src/api/flightsSlice.ts index a7be6fab..8057468e 100644 --- a/client/src/api/flightsSlice.ts +++ b/client/src/api/flightsSlice.ts @@ -4,14 +4,12 @@ import { PayloadAction, createSlice } from "@reduxjs/toolkit"; import { LatLng } from "leaflet"; interface FlightsState { - blue: { [id: string]: Flight }; - red: { [id: string]: Flight }; + flights: { [id: string]: Flight }; selected: Flight | null; } const initialState: FlightsState = { - blue: {}, - red: {}, + flights: {}, selected: null, }; @@ -20,46 +18,33 @@ export const flightsSlice = createSlice({ initialState, reducers: { clearFlights: (state) => { - state.blue = {}; - state.red = {}; + state.flights = {}; }, registerFlight: (state, action: PayloadAction) => { const flight = action.payload; - const coalitionFlights = flight.blue ? state.blue : state.red; - if (flight.id in coalitionFlights) { + if (flight.id in state.flights) { console.log(`Overriding flight with ID: ${flight.id}`); } - coalitionFlights[flight.id] = flight; + state.flights[flight.id] = flight; }, unregisterFlight: (state, action: PayloadAction) => { const id = action.payload; - if (id in state.blue) { - delete state.blue[id]; - } else if (id in state.red) { - delete state.red[id]; - } else { - console.log( - `Could not delete flight with ID ${id} because no flight with that ` + - `ID exists` - ); - } + delete state.flights[id]; }, updateFlight: (state, action: PayloadAction) => { const flight = action.payload; - const ato = flight.blue ? state.blue : state.red; - ato[flight.id] = flight; + state.flights[flight.id] = flight; }, deselectFlight: (state) => { state.selected = null; }, selectFlight: (state, action: PayloadAction) => { const id = action.payload; - state.selected = state.blue[id]; + state.selected = state.flights[id]; }, updateFlightPosition: (state, action: PayloadAction<[string, LatLng]>) => { const [id, position] = action.payload; - const ato = id in state.blue ? state.blue : state.red; - ato[id].position = position; + state.flights[id].position = position; }, }, }); diff --git a/client/src/components/aircraftlayer/AircraftLayer.tsx b/client/src/components/aircraftlayer/AircraftLayer.tsx index b44119bb..c7a5fcb2 100644 --- a/client/src/components/aircraftlayer/AircraftLayer.tsx +++ b/client/src/components/aircraftlayer/AircraftLayer.tsx @@ -4,13 +4,10 @@ import Aircraft from "../aircraft"; import { LayerGroup } from "react-leaflet"; export default function AircraftLayer() { - const atos = useAppSelector(selectFlights); + const flights = useAppSelector(selectFlights).flights; return ( - {Object.values(atos.blue).map((flight) => { - return ; - })} - {Object.values(atos.red).map((flight) => { + {Object.values(flights).map((flight) => { return ; })} diff --git a/client/src/components/flightplanslayer/FlightPlansLayer.tsx b/client/src/components/flightplanslayer/FlightPlansLayer.tsx index 9cb961e8..5c736a79 100644 --- a/client/src/components/flightplanslayer/FlightPlansLayer.tsx +++ b/client/src/components/flightplanslayer/FlightPlansLayer.tsx @@ -9,25 +9,30 @@ interface FlightPlansLayerProps { } export default function FlightPlansLayer(props: FlightPlansLayerProps) { - const atos = useAppSelector(selectFlights); - const flights = props.blue ? atos.blue : atos.red; + const flightData = useAppSelector(selectFlights); const isNotSelected = (flight: Flight) => { - if (atos.selected == null) { + if (flightData.selected == null) { return true; } - return atos.selected.id !== flight.id; + return flightData.selected.id !== flight.id; }; - const selectedFlight = atos.selected ? ( - - ) : ( - <> - ); + const selectedFlight = + flightData.selected && flightData.selected.blue === props.blue ? ( + + ) : ( + <> + ); return ( - {Object.values(flights) + {Object.values(flightData.flights) .filter(isNotSelected) + .filter((flight) => props.blue === flight.blue) .map((flight) => { return (