Review submission side panel

contentcuration/contentcuration/frontend/administration/pages/Channels/ChannelItem.vue

@@ -201,6 +201,7 @@
       <CommunityLibraryStatusButton
         v-if="communityLibraryStatus"
         :status="communityLibraryStatus"
+        @click="showReviewSubmissionPanel = true"
       />
       <KEmptyPlaceholder v-else />
     </td>
@@ -210,6 +211,11 @@
         flat
       />
     </td>
+    <ReviewSubmissionSidePanel
+      v-if="showReviewSubmissionPanel"
+      :channel="channel"
+      @close="showReviewSubmissionPanel = false"
+    />
   </tr>
 
 </template>
@@ -219,6 +225,7 @@
 
   import { mapGetters, mapActions } from 'vuex';
   import ClipboardChip from '../../components/ClipboardChip';
+  import ReviewSubmissionSidePanel from '../../components/sidePanels/ReviewSubmissionSidePanel';
   import CommunityLibraryStatusButton from '../../components/CommunityLibraryStatusButton.vue';
   import { RouteNames } from '../../constants';
   import ChannelActionsDropdown from './ChannelActionsDropdown';
@@ -233,6 +240,7 @@
       ClipboardChip,
       Checkbox,
       CommunityLibraryStatusButton,
+      ReviewSubmissionSidePanel,
     },
     mixins: [fileSizeMixin],
     props: {
@@ -245,6 +253,11 @@
         required: true,
       },
     },
+    data() {
+      return {
+        showReviewSubmissionPanel: false,
+      };
+    },
     computed: {
       ...mapGetters('channel', ['getChannel']),
       selected: {

contentcuration/contentcuration/frontend/administration/pages/Channels/__tests__/channelItem.spec.js

@@ -1,5 +1,6 @@
 import { mount } from '@vue/test-utils';
 import CommunityLibraryStatusButton from '../../../components/CommunityLibraryStatusButton.vue';
+import ReviewSubmissionSidePanel from '../../../components/sidePanels/ReviewSubmissionSidePanel';
 import router from '../../../router';
 import { factory } from '../../../store';
 import { RouteNames } from '../../../constants';
@@ -176,4 +177,18 @@ describe('channelItem', () => {
       expect(statusButton.props('status')).toBe(CommunityLibraryStatus.REJECTED);
     });
   });
+
+  it('Clicking on the status button opens the review submission side panel', async () => {
+    wrapper.setData({ testedChannel: submittedChannel });
+    await wrapper.vm.$nextTick();
+
+    const statusCell = wrapper.find('[data-test="community-library-status"]');
+    const statusButton = statusCell.findComponent(CommunityLibraryStatusButton);
+
+    expect(wrapper.findComponent(ReviewSubmissionSidePanel).exists()).toBe(false);
+
+    await statusButton.trigger('click');
+
+    expect(wrapper.findComponent(ReviewSubmissionSidePanel).exists()).toBe(true);
+  });
 });

contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/SubmitToCommunityLibrarySidePanel/__tests__/SubmitToCommunityLibrarySidePanel.spec.js

@@ -4,18 +4,18 @@ import { factory } from '../../../../store';
 
 import SubmitToCommunityLibrarySidePanel from '../';
 import Box from '../Box.vue';
-import StatusChip from '../StatusChip.vue';
 
-import { usePublishedData } from '../composables/usePublishedData';
-import { useLatestCommunityLibrarySubmission } from '../composables/useLatestCommunityLibrarySubmission';
+import { useVersionDetail } from '../composables/useVersionDetail';
+import { useLatestCommunityLibrarySubmission } from 'shared/composables/useLatestCommunityLibrarySubmission';
+import CommunityLibraryStatusChip from 'shared/views/communityLibrary/CommunityLibraryStatusChip.vue';
 import { Categories, CommunityLibraryStatus } from 'shared/constants';
 import { communityChannelsStrings } from 'shared/strings/communityChannelsStrings';
 import { CommunityLibrarySubmission } from 'shared/data/resources';
 import CountryField from 'shared/views/form/CountryField.vue';
 
-jest.mock('../composables/usePublishedData');
-jest.mock('../composables/useLatestCommunityLibrarySubmission');
+jest.mock('../composables/useVersionDetail');
 jest.mock('../composables/useLicenseAudit');
+jest.mock('shared/composables/useLatestCommunityLibrarySubmission');
 jest.mock('shared/data/resources', () => ({
   CommunityLibrarySubmission: {
     create: jest.fn(() => Promise.resolve()),
@@ -40,7 +40,7 @@ async function makeWrapper({ channel, publishedData, latestSubmission }) {
   store.state.currentChannel.currentChannelId = channel.id;
   store.commit('channel/ADD_CHANNEL', channel);
 
-  usePublishedData.mockReturnValue({
+  useVersionDetail.mockReturnValue({
     isLoading,
     isFinished,
     data: computed(() => publishedData),
@@ -377,7 +377,7 @@ describe('SubmitToCommunityLibrarySidePanel', () => {
         latestSubmission: null,
       });
 
-      const statusChip = wrapper.findAllComponents(StatusChip);
+      const statusChip = wrapper.findAllComponents(CommunityLibraryStatusChip);
       expect(statusChip.exists()).toBe(false);
     });
 
@@ -389,7 +389,7 @@ describe('SubmitToCommunityLibrarySidePanel', () => {
           latestSubmission: { channel_version: 1, status: submissionStatus },
         });
 
-        const statusChip = wrapper.findComponent(StatusChip);
+        const statusChip = wrapper.findComponent(CommunityLibraryStatusChip);
         expect(statusChip.props('status')).toBe(chipStatus);
       });
     }

contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/SubmitToCommunityLibrarySidePanel/composables/usePublishedData.js → contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/SubmitToCommunityLibrarySidePanel/composables/useVersionDetail.js

@@ -1,6 +1,6 @@
-import { useFetch } from '../../../../composables/useFetch';
+import { useFetch } from 'shared/composables/useFetch';
 import { Channel } from 'shared/data/resources';
 
-export function usePublishedData(channelId) {
+export function useVersionDetail(channelId) {
   return useFetch({ asyncFetchFunc: () => Channel.getVersionDetail(channelId) });
 }

contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/SubmitToCommunityLibrarySidePanel/index.vue

@@ -61,7 +61,7 @@
                     {{ infoText }}
                   </template>
                 </div>
-                <StatusChip
+                <CommunityLibraryStatusChip
                   v-if="latestSubmissionStatus"
                   :status="latestSubmissionStatus"
                   class="status-chip"
@@ -118,8 +118,8 @@
                 class="metadata-line"
               >
                 <LoadingText
-                  :loading="publishedDataIsLoading"
-                  :finishedLoading="publishedDataIsFinished"
+                  :loading="versionDetailIsLoading"
+                  :finishedLoading="versionDetailIsFinished"
                   :omitted="!detectedLanguages"
                 >
                   {{ detectedLanguages }}
@@ -130,8 +130,8 @@
                 class="metadata-line"
               >
                 <LoadingText
-                  :loading="publishedDataIsLoading"
-                  :finishedLoading="publishedDataIsFinished"
+                  :loading="versionDetailIsLoading"
+                  :finishedLoading="versionDetailIsFinished"
                   :omitted="!detectedCategories"
                 >
                   {{ detectedCategories }}
@@ -245,14 +245,14 @@
 
   import Box from './Box';
   import LoadingText from './LoadingText';
-  import StatusChip from './StatusChip';
-  import { useLatestCommunityLibrarySubmission } from './composables/useLatestCommunityLibrarySubmission';
   import { useLicenseAudit } from './composables/useLicenseAudit';
-  import { usePublishedData } from './composables/usePublishedData';
+  import { useVersionDetail } from './composables/useVersionDetail';
 
   import InvalidLicensesNotice from './licenseCheck/InvalidLicensesNotice.vue';
   import CompatibleLicensesNotice from './licenseCheck/CompatibleLicensesNotice.vue';
   import SpecialPermissionsList from './licenseCheck/SpecialPermissionsList.vue';
+  import CommunityLibraryStatusChip from 'shared/views/communityLibrary/CommunityLibraryStatusChip';
+  import { useLatestCommunityLibrarySubmission } from 'shared/composables/useLatestCommunityLibrarySubmission';
   import { translateMetadataString } from 'shared/utils/metadataStringsTranslation';
   import countriesUtil from 'shared/utils/countries';
   import { communityChannelsStrings } from 'shared/strings/communityChannelsStrings';
@@ -269,7 +269,7 @@
       SidePanelModal,
       Box,
       LoadingText,
-      StatusChip,
+      CommunityLibraryStatusChip,
       CountryField,
       InvalidLicensesNotice,
       CompatibleLicensesNotice,
@@ -330,7 +330,7 @@
         isFinished: latestSubmissionIsFinished,
         data: latestSubmissionData,
         fetchData: fetchLatestSubmission,
-      } = useLatestCommunityLibrarySubmission(props.channel.id);
+      } = useLatestCommunityLibrarySubmission({ channelId: props.channel.id });
 
       function countryCodeToName(code) {
         return countriesUtil.getName(code, 'en');
@@ -416,11 +416,11 @@
       });
 
       const {
-        isLoading: publishedDataIsLoading,
-        isFinished: publishedDataIsFinished,
+        isLoading: versionDetailIsLoading,
+        isFinished: versionDetailIsFinished,
         data: versionDetail,
-        fetchData: fetchPublishedData,
-      } = usePublishedData(props.channel.id);
+        fetchData: fetchVersionDetail,
+      } = useVersionDetail(props.channel.id);
 
       // Use the latest version available from either channel or versionDetail
       const displayedVersion = computed(() => {
@@ -453,7 +453,7 @@
           !hasInvalidLicenses.value,
           licenseAuditIsFinished.value,
           canBeEdited.value,
-          publishedDataIsFinished.value,
+          versionDetailIsFinished.value,
           description.value.length >= 1,
         ];
 
@@ -467,7 +467,7 @@
       // Watch for when publishing completes - fetch publishedData to get the new version's data
       watch(isPublishing, async (newIsPublishing, oldIsPublishing) => {
         if (oldIsPublishing === true && newIsPublishing === false) {
-          await fetchPublishedData();
+          await fetchVersionDetail();
           await checkAndTriggerLicenseAudit();
         }
       });
@@ -476,7 +476,7 @@
         await fetchLatestSubmission();
 
         if (!isPublishing.value) {
-          await fetchPublishedData();
+          await fetchVersionDetail();
           await checkAndTriggerLicenseAudit();
         }
       });
@@ -575,8 +575,8 @@
         canBeEdited,
         displayedVersion,
         canBeSubmitted,
-        publishedDataIsLoading,
-        publishedDataIsFinished,
+        versionDetailIsLoading,
+        versionDetailIsFinished,
         detectedLanguages,
         detectedCategories,
         licenseAuditIsLoading,

contentcuration/contentcuration/frontend/shared/composables/__tests__/useLatestCommunityLibrarySubmission.spec.js

@@ -0,0 +1,40 @@
+import { useLatestCommunityLibrarySubmission } from '../useLatestCommunityLibrarySubmission';
+import { CommunityLibrarySubmission } from 'shared/data/resources';
+
+const mockResponse = {
+  results: [],
+};
+
+jest.mock('shared/data/resources', () => {
+  return {
+    CommunityLibrarySubmission: {
+      fetchCollection: jest.fn(() => Promise.resolve(mockResponse)),
+      fetchCollectionAsAdmin: jest.fn(() => Promise.resolve(mockResponse)),
+    },
+  };
+});
+
+describe('useLatestCommunityLibrarySubmission', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('by default uses non-admin endpoint', async () => {
+    const { fetchData } = useLatestCommunityLibrarySubmission({ channelId: 'channel-id' });
+    await fetchData();
+
+    expect(CommunityLibrarySubmission.fetchCollection).toHaveBeenCalled();
+    expect(CommunityLibrarySubmission.fetchCollectionAsAdmin).not.toHaveBeenCalled();
+  });
+
+  it('uses admin endpoint when initialized with admin=true', async () => {
+    const { fetchData } = useLatestCommunityLibrarySubmission({
+      channelId: 'channel-id',
+      admin: true,
+    });
+    await fetchData();
+
+    expect(CommunityLibrarySubmission.fetchCollection).not.toHaveBeenCalled();
+    expect(CommunityLibrarySubmission.fetchCollectionAsAdmin).toHaveBeenCalled();
+  });
+});

contentcuration/contentcuration/frontend/channelEdit/composables/useFetch.js → contentcuration/contentcuration/frontend/shared/composables/useFetch.js

@@ -15,9 +15,9 @@ export function useFetch({ asyncFetchFunc }) {
       data.value = await asyncFetchFunc();
       isLoading.value = false;
       isFinished.value = true;
-    } catch (error) {
-      error.value = error;
-      throw error;
+    } catch (caughtError) {
+      error.value = caughtError;
+      throw caughtError;
     } finally {
       isLoading.value = false;
     }

contentcuration/contentcuration/frontend/shared/composables/useLatestCommunityLibrarySubmission.js

@@ -0,0 +1,21 @@
+import { useFetch } from './useFetch';
+import { CommunityLibrarySubmission } from 'shared/data/resources';
+
+export function useLatestCommunityLibrarySubmission({ channelId, admin = false }) {
+  const fetchSubmissionFunc = admin
+    ? params => CommunityLibrarySubmission.fetchCollectionAsAdmin(params)
+    : params => CommunityLibrarySubmission.fetchCollection(params);
+
+  function fetchLatestSubmission() {
+    // Submissions are ordered by most recent first in the backend
+    return fetchSubmissionFunc({ channel: channelId, max_results: 1 }).then(response => {
+      if (response.results.length > 0) {
+        return response.results[0];
+      }
+      return null;
+    });
+  }
+  return useFetch({
+    asyncFetchFunc: fetchLatestSubmission,
+  });
+}

contentcuration/contentcuration/frontend/shared/constants.js

@@ -336,3 +336,11 @@ export const CommunityLibraryStatus = {
   SUPERSEDED: 'SUPERSEDED',
   LIVE: 'LIVE',
 };
+
+export const CommunityLibraryResolutionReason = {
+  INVALID_LICENSING: 'INVALID_LICENSING',
+  TECHNICAL_QUALITY_ASSURANCE: 'TECHNICAL_QUALITY_ASSURANCE',
+  INVALID_METADATA: 'INVALID_METADATA',
+  PORTABILITY_ISSUES: 'PORTABILITY_ISSUES',
+  OTHER: 'OTHER',
+};

contentcuration/contentcuration/frontend/shared/data/resources.js

@@ -2413,11 +2413,25 @@ export const CommunityLibrarySubmission = new APIResource({
       return response.data || [];
     });
   },
+  fetchCollectionAsAdmin(params) {
+    return client
+      .get(window.Urls.adminCommunityLibrarySubmissionList(), { params })
+      .then(response => {
+        return response.data || [];
+      });
+  },
   create(params) {
     return client.post(this.collectionUrl(), params).then(response => {
       return response.data;
     });
   },
+  resolveAsAdmin(id, params) {
+    return client
+      .post(window.Urls.adminCommunityLibrarySubmissionResolve(id), params)
+      .then(response => {
+        return response.data;
+      });
+  },
 });
 
 export const AuditedSpecialPermissionsLicense = new APIResource({