diff --git a/app/hooks/map/index.ts b/app/hooks/map/index.ts index f70aeeb5a6..b094e6a14d 100644 --- a/app/hooks/map/index.ts +++ b/app/hooks/map/index.ts @@ -239,7 +239,11 @@ export function useContinuousFeaturesLayers({ return useMemo(() => { if (!active) return []; - return features.map((fid) => { + const fs = [...features]; + + fs.reverse(); + + return fs.map((fid) => { const { amountRange, color, diff --git a/app/layout/project/sidebar/scenario/grid-setup/features/target-spf/index.tsx b/app/layout/project/sidebar/scenario/grid-setup/features/target-spf/index.tsx index 784e482433..0d70f20a6c 100644 --- a/app/layout/project/sidebar/scenario/grid-setup/features/target-spf/index.tsx +++ b/app/layout/project/sidebar/scenario/grid-setup/features/target-spf/index.tsx @@ -66,10 +66,14 @@ const TargetAndSPFFeatures = (): JSX.Element => { const selectedFeaturesMutation = useSaveSelectedFeatures({}); const dispatch = useAppDispatch(); - const scenarioSlice = getScenarioEditSlice(sid); - const { setLayerSettings } = scenarioSlice.actions; - const { layerSettings } = useAppSelector((state) => state[`/scenarios/${sid}/edit`]); + + const { setSelectedFeatures, setSelectedContinuousFeatures, setLayerSettings } = + scenarioSlice.actions; + + const { selectedFeatures, selectedContinuousFeatures, layerSettings } = useAppSelector( + (state) => state[`/scenarios/${sid}/edit`] + ); const allFeaturesQuery = useAllFeatures( pid, @@ -85,7 +89,6 @@ const TargetAndSPFFeatures = (): JSX.Element => { const targetedFeatures = useMemo(() => { let parsedData = []; - console.log({ featureValues }); selectedFeaturesQuery.data?.forEach((feature) => { if (feature.splitFeaturesSelected?.length > 0) { const featureMetadata = allFeaturesQuery.data?.find(({ id }) => id === feature.id); @@ -208,19 +211,38 @@ const TargetAndSPFFeatures = (): JSX.Element => { const toggleSeeOnMap = useCallback( (id: Feature['id']) => { - const selectedFeature = targetedFeatures.find(({ id: featureId }) => featureId === id); - const isContinuous = - selectedFeature.amountRange.min !== null && selectedFeature.amountRange.max !== null; + const { color, amountRange } = targetedFeatures.find(({ id: featureId }) => featureId === id); + // const isContinuous = + // selectedFeature.amountRange.min !== null && selectedFeature.amountRange.max !== null; + + console.log(id, layerSettings); + + const newSelectedFeatures = [...selectedContinuousFeatures]; + const isIncluded = newSelectedFeatures.includes(id); + + if (!isIncluded) { + newSelectedFeatures.push(id); + } else { + const i = newSelectedFeatures.indexOf(id); + newSelectedFeatures.splice(i, 1); + } + console.log(newSelectedFeatures); + dispatch(setSelectedContinuousFeatures(newSelectedFeatures)); + + console.log(selectedContinuousFeatures); dispatch( setLayerSettings({ id, settings: { visibility: layerSettings[id] ? !layerSettings[id].visibility : true, - color: selectedFeature?.color, - ...(isContinuous && { - amountRange: selectedFeature.amountRange, - }), + amountRange, + color, + + // color: selectedFeature?.color, + // ...(isContinuous && { + // amountRange: selectedFeature.amountRange, + // }), }, }) ); diff --git a/app/layout/scenarios/edit/map/legend/hooks/index.ts b/app/layout/scenarios/edit/map/legend/hooks/index.ts index beb13ada91..28db65276c 100644 --- a/app/layout/scenarios/edit/map/legend/hooks/index.ts +++ b/app/layout/scenarios/edit/map/legend/hooks/index.ts @@ -299,6 +299,7 @@ export const useFeaturesLegend = () => { const i = newSelectedFeatures.indexOf(featureId); newSelectedFeatures.splice(i, 1); } + dispatch(setSelectedContinuousFeatures(newSelectedFeatures)); dispatch(