Reorganize React project structure.

Whatever I was doing was getting out of control :)

client/src/api/controlPointsSlice.ts

@@ -0,0 +1,22 @@
+import { PayloadAction, createSlice } from "@reduxjs/toolkit";
+
+import { ControlPoint } from "./controlpoint";
+import { RootState } from "../app/store";
+
+const initialState: ControlPoint[] = [];
+
+export const controlPointsSlice = createSlice({
+  name: "controlPoints",
+  initialState,
+  reducers: {
+    setControlPoints: (state, action: PayloadAction<ControlPoint[]>) => {
+      state = action.payload;
+    },
+  },
+});
+
+export const { setControlPoints } = controlPointsSlice.actions;
+
+export const selectControlPoints = (state: RootState) => state.controlPoints;
+
+export default controlPointsSlice.reducer;

client/src/api/controlpoint.ts

@@ -0,0 +1,11 @@
+import { LatLng } from "leaflet";
+
+export interface ControlPoint {
+  id: number;
+  name: string;
+  blue: boolean;
+  position: LatLng;
+  mobile: boolean;
+  destination: LatLng | null;
+  sidc: string;
+}

client/src/api/flight.ts

@@ -0,0 +1,10 @@
+import { LatLng } from "leaflet";
+import { Waypoint } from "./waypoint";
+
+export interface Flight {
+  id: string;
+  blue: boolean;
+  position: LatLng;
+  sidc: string;
+  waypoints: Waypoint[] | null;
+}

client/src/api/flightsSlice.ts

@@ -0,0 +1,53 @@
+import { PayloadAction, createSlice } from "@reduxjs/toolkit";
+
+import { Flight } from "./flight";
+import { RootState } from "../app/store";
+
+interface FlightsState {
+  blue: { [id: string]: Flight };
+  red: { [id: string]: Flight };
+}
+
+const initialState: FlightsState = {
+  blue: {},
+  red: {},
+};
+
+export const flightsSlice = createSlice({
+  name: "flights",
+  initialState,
+  reducers: {
+    clearFlights: (state) => {
+      state.blue = {};
+      state.red = {};
+    },
+    registerFlight: (state, action: PayloadAction<Flight>) => {
+      const flight = action.payload;
+      const coalitionFlights = flight.blue ? state.blue : state.red;
+      if (flight.id in coalitionFlights) {
+        console.log(`Overriding flight with ID: ${flight.id}`);
+      }
+      coalitionFlights[flight.id] = flight;
+    },
+    unregisterFlight: (state, action: PayloadAction<string>) => {
+      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`
+        );
+      }
+    },
+  },
+});
+
+export const { clearFlights, registerFlight, unregisterFlight } =
+  flightsSlice.actions;
+
+export const selectFlights = (state: RootState) => state.flights;
+
+export default flightsSlice.reducer;

client/src/api/waypoint.ts

@@ -0,0 +1,11 @@
+import { LatLng } from "leaflet";
+
+export interface Waypoint {
+  name: string;
+  position: LatLng;
+  altitude_ft: number;
+  altitude_reference: string;
+  is_movable: boolean;
+  should_mark: boolean;
+  include_in_path: boolean;
+}