Add back the "selected only" flight plans layer.

Fixes https://github.com/dcs-liberation/dcs_liberation/issues/2058

client/src/components/flightplan/FlightPlan.tsx

@@ -11,10 +11,11 @@ const SELECTED_PATH = "#ffff00";
 interface FlightPlanProps {
   flight: Flight;
   selected: boolean;
+  highlight?: boolean;
 }
 
 const pathColor = (props: FlightPlanProps) => {
-  if (props.selected) {
+  if (props.selected && props.highlight) {
     return SELECTED_PATH;
   } else if (props.flight.blue) {
     return BLUE_PATH;

client/src/components/flightplanslayer/FlightPlansLayer.tsx

@@ -6,6 +6,7 @@ import { LayerGroup } from "react-leaflet";
 
 interface FlightPlansLayerProps {
   blue: boolean;
+  selectedOnly?: true;
 }
 
 function SelectedFlightPlan(props: FlightPlansLayerProps) {
@@ -19,10 +20,17 @@ function SelectedFlightPlan(props: FlightPlansLayerProps) {
     return <></>;
   }
 
-  return <FlightPlan key={flight.id} flight={flight} selected={true} />;
+  return (
+    <FlightPlan
+      key={flight.id}
+      flight={flight}
+      selected={true}
+      highlight={!props.selectedOnly}
+    />
+  );
 }
 
-export default function FlightPlansLayer(props: FlightPlansLayerProps) {
+function UnselectedFlightPlans(props: FlightPlansLayerProps) {
   const flightData = useAppSelector(selectFlights);
   const isNotSelected = (flight: Flight) => {
     if (flightData.selected == null) {
@@ -31,8 +39,12 @@ export default function FlightPlansLayer(props: FlightPlansLayerProps) {
     return flightData.selected !== flight.id;
   };
 
+  if (props.selectedOnly) {
+    return <></>;
+  }
+
   return (
-    <LayerGroup>
+    <>
       {Object.values(flightData.flights)
         .filter(isNotSelected)
         .filter((flight) => props.blue === flight.blue)
@@ -41,6 +53,14 @@ export default function FlightPlansLayer(props: FlightPlansLayerProps) {
             <FlightPlan key={flight.id} flight={flight} selected={false} />
           );
         })}
+    </>
+  );
+}
+
+export default function FlightPlansLayer(props: FlightPlansLayerProps) {
+  return (
+    <LayerGroup>
+      <UnselectedFlightPlans {...props} />
       <SelectedFlightPlan {...props} />
     </LayerGroup>
   );

client/src/components/liberationmap/LiberationMap.tsx

@@ -80,6 +80,9 @@ export default function LiberationMap() {
         <LayersControl.Overlay name="Allied SAM detection range">
           <AirDefenseRangeLayer blue={true} detection />
         </LayersControl.Overlay>
+        <LayersControl.Overlay name="Selected blue flight plan">
+          <FlightPlansLayer blue={true} selectedOnly />
+        </LayersControl.Overlay>
         <LayersControl.Overlay name="All blue flight plans" checked>
           <FlightPlansLayer blue={true} />
         </LayersControl.Overlay>