Prevent errors from legend. Invalidate all-paginated-features

Vizzuality · Jan 15, 2024 · 4c9e7aa · 4c9e7aa
1 parent 6c0cab8
commit 4c9e7aa
Show file tree

Hide file tree

Showing 7 changed files with 22 additions and 6 deletions.
diff --git a/app/hooks/features/index.ts b/app/hooks/features/index.ts
@@ -610,6 +610,7 @@ export function useUploadFeaturesShapefile({
     onSuccess: async (data, variables) => {
       const { id: projectId } = variables;
       await queryClient.invalidateQueries(['all-features', projectId]);
+      await queryClient.invalidateQueries(['all-paginated-features', projectId]);
     },
   });
 }
@@ -640,6 +641,7 @@ export function useUploadFeaturesCSV({
     onSuccess: async (data, variables) => {
       const { id: projectId } = variables;
       await queryClient.invalidateQueries(['all-features', projectId]);
+      await queryClient.invalidateQueries(['all-paginated-features', projectId]);
     },
   });
 }
@@ -701,6 +703,7 @@ export function useEditFeatureTag() {
       await queryClient.invalidateQueries(['feature', featureId]);
       await queryClient.invalidateQueries(['project-tags', projectId]);
       await queryClient.invalidateQueries(['all-features', projectId]);
+      await queryClient.invalidateQueries(['all-paginated-features', projectId]);
     },
     onError: (error, variables, context) => {
       console.info('Error', error, variables, context);
@@ -734,6 +737,7 @@ export function useDeleteFeatureTag() {
       const { featureId, projectId } = variables;
       await queryClient.invalidateQueries(['feature', featureId]);
       await queryClient.invalidateQueries(['all-features', projectId]);
+      await queryClient.invalidateQueries(['all-paginated-features', projectId]);
     },
     onError: (error, variables, context) => {
       console.info('Error', error, variables, context);

diff --git a/app/layout/project/sidebar/project/inventory-panel/features/modals/delete/index.tsx b/app/layout/project/sidebar/project/inventory-panel/features/modals/delete/index.tsx
@@ -52,6 +52,7 @@ const DeleteModal = ({
     bulkDeleteFeatureFromProject(pid, deletableFeatureIds, session)
       .then(async () => {
         await queryClient.invalidateQueries(['all-features', pid]);
+        await queryClient.invalidateQueries(['all-paginated-features', pid]);
         await queryClient.invalidateQueries(['project-tags', pid]);
 
         onDismiss();

diff --git a/app/layout/project/sidebar/project/inventory-panel/features/modals/edit-bulk/index.tsx b/app/layout/project/sidebar/project/inventory-panel/features/modals/edit-bulk/index.tsx
@@ -74,6 +74,8 @@ const EditBulkModal = ({
         editFeaturesTagsBulk(pid, selectedFeaturesIds, session, data)
           .then(async () => {
             await queryClient.invalidateQueries(['all-features', pid]);
+            await queryClient.invalidateQueries(['all-paginated-features', pid]);
+
             handleModal('edit', false);
 
             addToast(
@@ -103,6 +105,8 @@ const EditBulkModal = ({
         deleteFeaturesTagsBulk(pid, selectedFeaturesIds, session)
           .then(async () => {
             await queryClient.invalidateQueries(['all-features', pid]);
+            await queryClient.invalidateQueries(['all-paginated-features', pid]);
+
             handleModal('edit', false);
 
             addToast(

diff --git a/app/layout/project/sidebar/project/inventory-panel/features/modals/edit/index.tsx b/app/layout/project/sidebar/project/inventory-panel/features/modals/edit/index.tsx
@@ -100,6 +100,8 @@ const EditModal = ({
       Promise.all([editFeaturePromise, editFeatureTagPromise()])
         .then(async () => {
           await queryClient.invalidateQueries(['all-features', pid]);
+          await queryClient.invalidateQueries(['all-paginated-features', pid]);
+
           onDone?.();
           handleModal('edit', false);
 

diff --git a/app/layout/project/sidebar/project/scenarios-list/index.tsx b/app/layout/project/sidebar/project/scenarios-list/index.tsx
@@ -101,6 +101,8 @@ export const ScenariosList: React.FC = () => {
           );
           await queryClient.invalidateQueries(['scenarios', pid]);
           await queryClient.invalidateQueries(['all-features', pid]);
+          await queryClient.invalidateQueries(['all-paginated-features', pid]);
+
           setDelete(null);
         },
         onError: () => {

diff --git a/app/layout/scenarios/edit/map/component.tsx b/app/layout/scenarios/edit/map/component.tsx
@@ -549,7 +549,7 @@ export const ScenariosEditMap = (): JSX.Element => {
     }
   };
 
-  console.log({ LAYERS });
+  // console.log({ LAYERS });
 
   return (
     <div className="relative h-full w-full overflow-hidden">

diff --git a/app/layout/scenarios/edit/map/legend/hooks/index.ts b/app/layout/scenarios/edit/map/legend/hooks/index.ts
@@ -143,7 +143,8 @@ export const useFeaturesLegend = () => {
   const featureColors = useColorFeatures(pid, sid);
 
   const selectedFeaturesQuery = useSelectedFeatures(sid);
-  const selectedFeaturesIds = selectedFeaturesQuery.data?.map(({ metadata }) => metadata?.id) || [];
+  const selectedFeaturesIds =
+    selectedFeaturesQuery.data?.filter((s) => s.metadata).map(({ metadata: { id } }) => id) || [];
 
   const projectFeaturesQuery = useAllFeatures(
     pid,
@@ -200,8 +201,9 @@ export const useFeaturesLegend = () => {
 
   const targetedFeatures = useTargetedFeatures(sid);
 
-  const parsedTargetedFeatures = targetedFeatures.data?.map(
-    ({ id, name, splitted, parentId, splitSelected }) => {
+  const parsedTargetedFeatures = targetedFeatures.data
+    ?.filter(({ featureId }) => selectedFeaturesIds.includes(featureId))
+    ?.map(({ id, name, splitted, parentId, splitSelected }) => {
       const allFeatures = queryClient.getQueryData<any>(['all-features', pid], {
         exact: false,
       })?.data;
@@ -217,8 +219,7 @@ export const useFeaturesLegend = () => {
         split: splitSelected,
         color: featureColors?.find(({ id: featureId }) => featureId === id)?.color,
       };
-    }
-  );
+    });
 
   const targetedFeaturesByRange = parsedTargetedFeatures?.reduce(
     (acc, x) => ({
@@ -254,6 +255,8 @@ export const useFeaturesLegend = () => {
       index === self.findIndex((t) => JSON.stringify(t) === JSON.stringify(item))
   );
 
+  // console.log({ uniqueBinaryFeatures, uniqueContinuousFeatures });
+
   return [
     ...LEGEND_LAYERS['binary-features']({
       items: uniqueBinaryFeatures,