LF-4384 Refactor useAnimalOrBatchRemoval hook and adjust Inventory an…

…d SingleAnimalView
LiteFarmOrg · Nov 27, 2024 · 5290430 · 5290430
1 parent 2325f80
commit 5290430
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 59 deletions.
diff --git a/packages/webapp/src/containers/Animals/Inventory/index.tsx b/packages/webapp/src/containers/Animals/Inventory/index.tsx
@@ -41,6 +41,9 @@ import { isAdminSelector } from '../../userFarmSlice';
 import { useAnimalsFilterReduxState } from './KPI/useAnimalsFilterReduxState';
 import FloatingContainer from '../../../components/FloatingContainer';
 import AnimalsBetaSpotlight from './AnimalsBetaSpotlight';
+import { parseInventoryId } from '../../../util/animal';
+import { AnimalOrBatchKeys } from '../types';
+import { Animal } from '../../../store/api/types';
 
 export enum View {
   DEFAULT = 'default',
@@ -102,9 +105,18 @@ function AnimalInventory({
     [updateSelectedTypeIds],
   );
 
+  const onRemovalSuccess = (animalOrBatchKey: AnimalOrBatchKeys, ids: Animal['id'][]) => {
+    setSelectedInventoryIds((selectedInventoryIds) => {
+      return selectedInventoryIds.filter((i) => {
+        const { kind, id } = parseInventoryId(i);
+        return kind === animalOrBatchKey && ids.includes(id);
+      });
+    });
+  };
+
   const { onConfirmRemoveAnimals, removalModalOpen, setRemovalModalOpen } = useAnimalOrBatchRemoval(
-    selectedInventoryIds,
-    setSelectedInventoryIds,
+    selectedInventoryIds.map(parseInventoryId),
+    onRemovalSuccess,
   );
 
   const animalsColumns = useMemo(

diff --git a/packages/webapp/src/containers/Animals/Inventory/useAnimalOrBatchRemoval.ts b/packages/webapp/src/containers/Animals/Inventory/useAnimalOrBatchRemoval.ts
@@ -13,25 +13,32 @@
  *  GNU General Public License for more details, see <https://www.gnu.org/licenses/>.
  */
 
-import { Dispatch, SetStateAction, useState } from 'react';
+import { useState } from 'react';
 import {
   useDeleteAnimalBatchesMutation,
   useDeleteAnimalsMutation,
   useRemoveAnimalBatchesMutation,
   useRemoveAnimalsMutation,
 } from '../../../store/api/apiSlice';
 import { toLocalISOString } from '../../../util/moment';
-import { parseInventoryId } from '../../../util/animal';
 import { CREATED_IN_ERROR_ID, FormFields } from '../../../components/Animals/RemoveAnimalsModal';
 import useMutations from '../../../hooks/api/useMutations';
 import { enqueueErrorSnackbar, enqueueSuccessSnackbar } from '../../Snackbar/snackbarSlice';
 import { AnimalOrBatchKeys } from '../types';
 import { useDispatch } from 'react-redux';
 import { useTranslation } from 'react-i18next';
+import { Animal } from '../../../store/api/types';
+
+interface Removal {
+  id: Animal['id'];
+  animal_removal_reason_id: number;
+  removal_explanation: string;
+  removal_date: string;
+}
 
 const useAnimalOrBatchRemoval = (
-  selectedInventoryIds: string[],
-  setSelectedInventoryIds?: Dispatch<SetStateAction<string[]>>,
+  selectedIds: { kind: AnimalOrBatchKeys; id: Animal['id'] }[],
+  onSuccess?: (kind: AnimalOrBatchKeys, ids: Animal['id'][]) => void,
 ) => {
   const dispatch = useDispatch();
   const { t } = useTranslation(['message']);
@@ -48,31 +55,25 @@ const useAnimalOrBatchRemoval = (
   const handleAnimalOrBatchRemoval = async (formData: FormFields) => {
     const timestampedDate = toLocalISOString(formData.date);
 
-    const animalRemovalArray = [];
-    const animalBatchRemovalArray = [];
-    const selectedAnimalIds: string[] = [];
-    const selectedBatchIds: string[] = [];
+    const animalRemovalArray: Removal[] = [];
+    const animalBatchRemovalArray: Removal[] = [];
+    const selectedAnimalIds: Animal['id'][] = [];
+    const selectedBatchIds: Animal['id'][] = [];
     let result;
 
-    for (const id of selectedInventoryIds) {
-      const { kind, id: entity_id } = parseInventoryId(id);
-      if (kind === AnimalOrBatchKeys.ANIMAL) {
-        animalRemovalArray.push({
-          id: entity_id,
-          animal_removal_reason_id: Number(formData.reason), // mobile UI uses a native radio input & will always generate a string
-          removal_explanation: formData.explanation,
-          removal_date: timestampedDate,
-        });
-        selectedAnimalIds.push(id);
-      } else if (kind === AnimalOrBatchKeys.BATCH) {
-        animalBatchRemovalArray.push({
-          id: entity_id,
-          animal_removal_reason_id: Number(formData.reason),
-          removal_explanation: formData.explanation,
-          removal_date: timestampedDate,
-        });
-        selectedBatchIds.push(id);
-      }
+    for (const { kind, id } of selectedIds) {
+      const [removalArray, selectedIdsArray] =
+        kind === AnimalOrBatchKeys.ANIMAL
+          ? [animalRemovalArray, selectedAnimalIds]
+          : [animalBatchRemovalArray, selectedBatchIds];
+
+      removalArray.push({
+        id,
+        animal_removal_reason_id: Number(formData.reason), // mobile UI uses a native radio input & will always generate a string
+        removal_explanation: formData.explanation,
+        removal_date: timestampedDate,
+      });
+      selectedIdsArray.push(id);
     }
 
     if (animalRemovalArray.length) {
@@ -82,9 +83,7 @@ const useAnimalOrBatchRemoval = (
         console.log(result.error);
         dispatch(enqueueErrorSnackbar(t('ANIMALS.FAILED_REMOVE_ANIMALS', { ns: 'message' })));
       } else {
-        setSelectedInventoryIds?.((selectedInventoryIds) =>
-          selectedInventoryIds.filter((i) => !selectedAnimalIds.includes(i)),
-        );
+        onSuccess?.(AnimalOrBatchKeys.ANIMAL, selectedAnimalIds);
         dispatch(enqueueSuccessSnackbar(t('ANIMALS.SUCCESS_REMOVE_ANIMALS', { ns: 'message' })));
       }
     }
@@ -96,9 +95,7 @@ const useAnimalOrBatchRemoval = (
         console.log(result.error);
         dispatch(enqueueErrorSnackbar(t('ANIMALS.FAILED_REMOVE_BATCHES', { ns: 'message' })));
       } else {
-        setSelectedInventoryIds?.((selectedInventoryIds) =>
-          selectedInventoryIds.filter((i) => !selectedBatchIds.includes(i)),
-        );
+        onSuccess?.(AnimalOrBatchKeys.BATCH, selectedBatchIds);
         dispatch(enqueueSuccessSnackbar(t('ANIMALS.SUCCESS_REMOVE_BATCHES', { ns: 'message' })));
       }
     }
@@ -109,20 +106,12 @@ const useAnimalOrBatchRemoval = (
 
   const handleAnimalOrBatchDeletion = async () => {
     const animalIds: number[] = [];
-    const selectedAnimalIds: string[] = [];
     const animalBatchIds: number[] = [];
-    const selectedBatchIds: string[] = [];
     let result;
 
-    for (const id of selectedInventoryIds) {
-      const { kind, id: entity_id } = parseInventoryId(id);
-      if (kind === AnimalOrBatchKeys.ANIMAL) {
-        animalIds.push(entity_id);
-        selectedAnimalIds.push(id);
-      } else if (AnimalOrBatchKeys.BATCH) {
-        animalBatchIds.push(entity_id);
-        selectedBatchIds.push(id);
-      }
+    for (const { kind, id } of selectedIds) {
+      const idsArray = kind === AnimalOrBatchKeys.ANIMAL ? animalIds : animalBatchIds;
+      idsArray.push(id);
     }
 
     if (animalIds.length) {
@@ -132,9 +121,7 @@ const useAnimalOrBatchRemoval = (
         console.log(result.error);
         dispatch(enqueueErrorSnackbar(t('ANIMALS.FAILED_REMOVE_ANIMALS', { ns: 'message' })));
       } else {
-        setSelectedInventoryIds?.((selectedInventoryIds) =>
-          selectedInventoryIds.filter((i) => !selectedAnimalIds.includes(i)),
-        );
+        onSuccess?.(AnimalOrBatchKeys.ANIMAL, animalIds);
         dispatch(enqueueSuccessSnackbar(t('ANIMALS.SUCCESS_REMOVE_ANIMALS', { ns: 'message' })));
       }
     }
@@ -145,9 +132,7 @@ const useAnimalOrBatchRemoval = (
         console.log(result.error);
         dispatch(enqueueErrorSnackbar(t('ANIMALS.FAILED_REMOVE_BATCHES', { ns: 'message' })));
       } else {
-        setSelectedInventoryIds?.((selectedInventoryIds) =>
-          selectedInventoryIds.filter((i) => !selectedBatchIds.includes(i)),
-        );
+        onSuccess?.(AnimalOrBatchKeys.BATCH, animalBatchIds);
         dispatch(enqueueSuccessSnackbar(t('ANIMALS.SUCCESS_REMOVE_BATCHES', { ns: 'message' })));
       }
     }

diff --git a/packages/webapp/src/containers/Animals/SingleAnimalView/index.tsx b/packages/webapp/src/containers/Animals/SingleAnimalView/index.tsx
@@ -43,7 +43,6 @@ import { AnimalOrBatchKeys } from '../types';
 import { AnimalDetailsFormFields } from '../AddAnimals/types';
 import RemoveAnimalsModal, { FormFields } from '../../../components/Animals/RemoveAnimalsModal';
 import useAnimalOrBatchRemoval from '../Inventory/useAnimalOrBatchRemoval';
-import { generateInventoryId } from '../../../util/animal';
 import { CustomRouteComponentProps } from '../../../types';
 import { isAdminSelector } from '../../userFarmSlice';
 
@@ -169,13 +168,13 @@ function SingleAnimalView({ isCompactSideMenu, history, match, location }: AddAn
     }
   };
 
-  const getInventoryId = () => {
-    const animalOrBatch = AnimalOrBatchKeys[selectedAnimal ? 'ANIMAL' : 'BATCH'];
-    return generateInventoryId(animalOrBatch, (selectedAnimal || selectedBatch)!);
-  };
-
   const { onConfirmRemoveAnimals, removalModalOpen, setRemovalModalOpen } = useAnimalOrBatchRemoval(
-    [getInventoryId()],
+    [
+      {
+        kind: AnimalOrBatchKeys[selectedAnimal ? 'ANIMAL' : 'BATCH'],
+        id: (selectedAnimal || selectedBatch)!.id,
+      },
+    ],
   );
 
   const onConfirmRemoval = async (formData: FormFields) => {