Add GroupTask to TGO for map filtering

Resolves #21
This commit is contained in:
Raffson
2023-09-03 23:21:51 +02:00
parent b7bc9efb52
commit a8a37fa3e7
12 changed files with 134 additions and 21 deletions

View File

@@ -426,6 +426,7 @@ export type Tgo = {
detection_ranges: number[];
dead: boolean;
sidc: string;
task?: string[];
};
export type SupplyRoute = {
id: string;

View File

@@ -57,6 +57,7 @@ describe("AirDefenseRangeLayer", () => {
detection_ranges: [20],
dead: false,
sidc: "",
task: [],
},
},
},
@@ -86,6 +87,7 @@ describe("AirDefenseRangeLayer", () => {
detection_ranges: [20],
dead: false,
sidc: "",
task: [],
},
},
},
@@ -125,6 +127,7 @@ describe("AirDefenseRangeLayer", () => {
detection_ranges: [20],
dead: false,
sidc: "",
task: [],
},
},
},

View File

@@ -53,6 +53,18 @@ export default function LiberationMap() {
<LayersControl.Overlay name="Air defenses" checked>
<TgosLayer categories={["aa"]} />
</LayersControl.Overlay>
<LayersControl.Overlay name="LORAD" >
<TgosLayer categories={["aa"]} task={"LORAD"} />
</LayersControl.Overlay>
<LayersControl.Overlay name="MERAD" >
<TgosLayer categories={["aa"]} task={"MERAD"} />
</LayersControl.Overlay>
<LayersControl.Overlay name="SHORAD" >
<TgosLayer categories={["aa"]} task={"SHORAD"} />
</LayersControl.Overlay>
<LayersControl.Overlay name="AAA" >
<TgosLayer categories={["aa"]} task={"AAA"} />
</LayersControl.Overlay>
<LayersControl.Overlay name="Factories" checked>
<TgosLayer categories={["factory"]} />
</LayersControl.Overlay>

View File

@@ -6,14 +6,21 @@ import { LayerGroup } from "react-leaflet";
interface TgosLayerProps {
categories?: string[];
exclude?: true;
task?: string;
}
export default function TgosLayer(props: TgosLayerProps) {
const allTgos = Object.values(useAppSelector(selectTgos).tgos);
const categoryFilter = props.categories ?? [];
const taskFilter = props.task ?? "";
const tgos = allTgos.filter(
(tgo) => categoryFilter.includes(tgo.category) === !(props.exclude ?? false)
);
(tgo) => {
if (taskFilter && tgo.task){
return taskFilter === tgo.task[0]
}
return categoryFilter.includes(tgo.category) === !(props.exclude ?? false)
}
);
return (
<LayerGroup>
{tgos.map((tgo) => {