feat: Enable menus in component info sideber in unit page

Author: ChrisChV

plugins/course-apps/proctoring/Settings.test.jsx

@@ -74,6 +74,8 @@ describe('ProctoredExamSettings', () => {
       provider: null,
     });
 
+    axiosMock.onGet(/course_index/).reply(200, { sections: [] });
+
     axiosMock.onGet(
       StudioApiService.getProctoredExamSettingsUrl(defaultProps.courseId),
     ).reply(200, {
@@ -466,7 +468,8 @@ describe('ProctoredExamSettings', () => {
       // (1) for studio settings
       // (2) waffle flags
       // (3) for course details
-      expect(axiosMock.history.get.length).toBe(3);
+      // (4) for course outline index (from CourseAuthoringProvider)
+      expect(axiosMock.history.get.length).toBe(4);
       expect(axiosMock.history.get[0].url.includes('proctored_exam_settings')).toEqual(true);
     });
 

src/content-tags-drawer/data/apiHooks.test.jsx

@@ -78,7 +78,7 @@ describe('useTaxonomyTagsData', () => {
     // Assert that useQueries was called with the correct arguments
     expect(useQueries).toHaveBeenCalledWith({
       queries: [
-        { queryKey: ['taxonomyTags', taxonomyId, null, 1, ''], queryFn: expect.any(Function), staleTime: Infinity },
+        { queryKey: ['contentTags', 'taxonomyTags', taxonomyId, null, 1, ''], queryFn: expect.any(Function), staleTime: Infinity },
       ],
     });
 

src/content-tags-drawer/data/apiHooks.ts

@@ -20,6 +20,33 @@ import { libraryAuthoringQueryKeys, libraryQueryPredicate, xblockQueryKeys } fro
 import { getLibraryId } from '../../generic/key-utils';
 import type { UpdateTagsData } from './types';
 
+export const contentTagsQueryKeys = {
+  all: ['contentTags'],
+  taxonomyTags: (taxonomyId: number, parentTag: string | null, page: number, searchTerm: string) => [
+    ...contentTagsQueryKeys.all,
+    'taxonomyTags',
+    taxonomyId,
+    parentTag,
+    page,
+    searchTerm,
+  ],
+  contentTaxonomyTags: (contentId: string) => [
+    ...contentTagsQueryKeys.all,
+    'contentTaxonomyTags',
+    contentId,
+  ],
+  contentData: (contentId?: string) => [
+    ...contentTagsQueryKeys.all,
+    'contentData',
+    contentId,
+  ],
+  contentTagsCount: (contentPattern: string) => [
+    ...contentTagsQueryKeys.all,
+    'contentTagsCount',
+    contentPattern,
+  ],
+};
+
 /**
  * Builds the query to get the taxonomy tags
  */
@@ -43,7 +70,7 @@ export const useTaxonomyTagsData = (
   const queries: { queryKey: any[]; queryFn: typeof queryFn; staleTime: number }[] = [];
   for (let page = 1; page <= numPages; page++) {
     queries.push(
-      { queryKey: ['taxonomyTags', taxonomyId, parentTag, page, searchTerm], queryFn, staleTime: Infinity },
+      { queryKey: contentTagsQueryKeys.taxonomyTags(taxonomyId, parentTag, page, searchTerm), queryFn, staleTime: Infinity },
     );
   }
 
@@ -74,7 +101,7 @@ export const useTaxonomyTagsData = (
 
     // Store the pre-loaded descendants into the query cache:
     preLoadedData.forEach((tags, parentValue) => {
-      const queryKey = ['taxonomyTags', taxonomyId, parentValue, 1, searchTerm];
+      const queryKey = contentTagsQueryKeys.taxonomyTags(taxonomyId, parentValue, 1, searchTerm);
       const cachedData: TagListData = {
         next: '',
         previous: '',
@@ -106,7 +133,7 @@ export const useTaxonomyTagsData = (
  */
 export const useContentTaxonomyTagsData = (contentId: string) => (
   useQuery({
-    queryKey: ['contentTaxonomyTags', contentId],
+    queryKey: contentTagsQueryKeys.contentTaxonomyTags(contentId),
     queryFn: () => getContentTaxonomyTagsData(contentId),
   })
 );
@@ -118,7 +145,7 @@ export const useContentTaxonomyTagsData = (contentId: string) => (
  */
 export const useContentData = (contentId?: string, enabled: boolean = true) => (
   useQuery({
-    queryKey: ['contentData', contentId],
+    queryKey: contentTagsQueryKeys.contentData(contentId),
     queryFn: (enabled && contentId) ? () => getContentData(contentId) : skipToken,
   })
 );
@@ -137,15 +164,15 @@ export const useContentTaxonomyTagsUpdater = (contentId: string) => {
       updateContentTaxonomyTags(contentId, tagsData)
     ),
     onSettled: () => {
-      queryClient.invalidateQueries({ queryKey: ['contentTaxonomyTags', contentId] });
+      queryClient.invalidateQueries({ queryKey: contentTagsQueryKeys.contentTaxonomyTags(contentId) });
       /// Invalidate query with pattern on course outline
       let contentPattern;
       if (contentId.includes('course-v1')) {
         contentPattern = contentId;
       } else {
         contentPattern = contentId.replace(/\+type@.*$/, '*');
       }
-      queryClient.invalidateQueries({ queryKey: ['contentTagsCount', contentPattern] });
+      queryClient.invalidateQueries({ queryKey: contentTagsQueryKeys.contentTagsCount(contentPattern) });
       if (contentId.startsWith('lb:') || contentId.startsWith('lib-collection:') || contentId.startsWith('lct:')) {
         // Obtain library id from contentId
         const libraryId = getLibraryId(contentId);

src/course-outline/outline-sidebar/OutlineSidebar.test.tsx

@@ -15,6 +15,8 @@ jest.mock('@src/course-outline/data/apiHooks', () => ({
   useCourseDetails: jest.fn().mockReturnValue({ isPending: false, data: { title: 'Test Course' } }),
   useCreateCourseBlock: jest.fn(),
   useCourseItemData: jest.fn().mockReturnValue({ data: {} }),
+  useDuplicateItem: jest.fn().mockReturnValue({ duplicateItem: jest.fn() }),
+  useDeleteCourseItem: jest.fn().mockReturnValue({ mutateAsync: jest.fn() }),
 }));
 
 const courseId = '123';

src/course-outline/outline-sidebar/info-sidebar/InfoSection.tsx

@@ -54,6 +54,11 @@ export const InfoSection = ({ itemId }: Props) => {
     }
   }, [dispatch, selectedContainerState, queryClient, courseId]);
 
+  /* istanbul ignore next */
+  if (!itemData) {
+    return null;
+  }
+
   return (
     <>
       <LibraryReferenceCard