fix: invalidate item hierarchy on add/remove to/from container

Author: rpenido

src/library-authoring/data/apiHooks.test.tsx

@@ -292,7 +292,7 @@ describe('library api hooks', () => {
   });
 
   it('should remove container children', async () => {
-    const containerId = 'lct:org:lib1';
+    const containerId = 'lct:org:lib:unit:unit-1';
     const url = getLibraryContainerChildrenApiUrl(containerId);
 
     axiosMock.onDelete(url).reply(200);
@@ -331,7 +331,8 @@ describe('library api hooks', () => {
     // 2. containerChildren
     // 3. containerHierarchy
     // 4 & 5. subsections
-    expect(spy).toHaveBeenCalledTimes(5);
+    // 6 & 7. subsections hierarchy
+    expect(spy).toHaveBeenCalledTimes(7);
   });
 
   describe('publishContainer', () => {

src/library-authoring/data/apiHooks.ts

@@ -790,6 +790,14 @@ export const useAddItemsToContainer = (containerId?: string) => {
       queryClient.invalidateQueries({ predicate: (query) => libraryQueryPredicate(query, libraryId) });
 
       const containerType = getBlockType(containerId);
+      if (['subsection', 'section'].includes(containerType)) {
+        // If the container is a subsection or section, we invalidate the
+        // children query to update the hierarchy.
+        variables.forEach((itemId) => {
+          queryClient.invalidateQueries({ queryKey: libraryAuthoringQueryKeys.containerHierarchy(itemId) });
+        });
+      }
+
       if (containerType === 'section') {
         // We invalidate the search query of the each itemId if the container is a section.
         // This because the subsection page calls this query individually.
@@ -849,13 +857,13 @@ export const useUpdateContainerChildren = (containerId?: string) => {
 export const useRemoveContainerChildren = (containerId?: string) => {
   const queryClient = useQueryClient();
   return useMutation({
-    mutationFn: async (usageKeys: string[]) => {
+    mutationFn: async (itemIds: string[]) => {
       if (!containerId) {
         return undefined;
       }
-      return api.removeLibraryContainerChildren(containerId, usageKeys);
+      return api.removeLibraryContainerChildren(containerId, itemIds);
     },
-    onSettled: () => {
+    onSettled: (_data, _error, variables) => {
       if (!containerId) {
         return;
       }
@@ -864,6 +872,15 @@ export const useRemoveContainerChildren = (containerId?: string) => {
       const libraryId = getLibraryId(containerId);
       queryClient.invalidateQueries({ predicate: (query) => libraryQueryPredicate(query, libraryId) });
       queryClient.invalidateQueries({ queryKey: libraryAuthoringQueryKeys.container(containerId) });
+
+      const containerType = getBlockType(containerId);
+      if (['subsection', 'section'].includes(containerType)) {
+        // If the container is a subsection or section, we invalidate the
+        // children query to update the hierarchy.
+        variables.forEach((itemId) => {
+          queryClient.invalidateQueries({ queryKey: libraryAuthoringQueryKeys.containerHierarchy(itemId) });
+        });
+      }
     },
   });
 };