Replace api.ts with auto-generated API.

All the slices will come later.

client/src/components/controlpoints/ControlPoint.tsx

@@ -1,9 +1,9 @@
-import {
-  useControlPointCancelTravelMutation,
-  useSetControlPointDestinationMutation,
-} from "../../api/api";
 import backend from "../../api/backend";
 import { ControlPoint as ControlPointModel } from "../../api/controlpoint";
+import {
+  useClearControlPointDestinationMutation,
+  useSetControlPointDestinationMutation,
+} from "../../api/liberationApi";
 import {
   Icon,
   LatLng,
@@ -118,7 +118,7 @@ function PrimaryMarker(props: ControlPointProps) {
 
   const [putDestination, { isLoading }] =
     useSetControlPointDestinationMutation();
-  const [cancelTravel] = useControlPointCancelTravelMutation();
+  const [cancelTravel] = useClearControlPointDestinationMutation();
 
   useEffect(() => {
     marker.current?.setTooltipContent(
@@ -159,7 +159,7 @@ function PrimaryMarker(props: ControlPointProps) {
           },
           contextmenu: () => {
             if (props.controlPoint.destination) {
-              cancelTravel(props.controlPoint.id).then(() => {
+              cancelTravel({ cpId: props.controlPoint.id }).then(() => {
                 resetDestination();
               });
             } else {
@@ -196,8 +196,8 @@ function PrimaryMarker(props: ControlPointProps) {
             setDestination(destination);
             try {
               await putDestination({
-                id: props.controlPoint.id,
-                destination: destination,
+                cpId: props.controlPoint.id,
+                body: { lat: destination.lat, lng: destination.lng },
               }).unwrap();
             } catch (error) {
               console.error("setDestination failed", error);

client/src/components/flightplan/FlightPlan.tsx

@@ -1,6 +1,7 @@
-import { useGetCommitBoundaryForFlightQuery } from "../../api/api";
 import { Flight } from "../../api/flight";
+import { useGetCommitBoundaryForFlightQuery } from "../../api/liberationApi";
 import WaypointMarker from "../waypointmarker";
+import { LatLng } from "leaflet";
 import { ReactElement } from "react";
 import { Polyline } from "react-leaflet";
 
@@ -66,14 +67,31 @@ interface CommitBoundaryProps {
 }
 
 function CommitBoundary(props: CommitBoundaryProps) {
-  const { data, error, isLoading } = useGetCommitBoundaryForFlightQuery(
-    props.flightId
-  );
-  if (isLoading || error || !data) {
+  const { data, error, isLoading } = useGetCommitBoundaryForFlightQuery({
+    flightId: props.flightId,
+  });
+  if (isLoading) {
     return <></>;
   }
+  if (error) {
+    console.error(`Error loading commit boundary for ${props.flightId}`, error);
+    return <></>;
+  }
+  if (!data) {
+    console.log(
+      `Null response data when loading commit boundary for ${props.flightId}`
+    );
+    return <></>;
+  }
+  // TODO: Fix the response model and clean up.
+  const positions = data.map(([lat, lng]) => new LatLng(lat, lng));
   return (
-    <Polyline positions={data} color="#ffff00" weight={1} interactive={false} />
+    <Polyline
+      positions={positions}
+      color="#ffff00"
+      weight={1}
+      interactive={false}
+    />
   );
 }