🚚(frontend) update deposited files related urls

As we have changed api endpoints to always use the current deposit id, related urls should be updated too.
openfun · Aug 7, 2023 · 7d868fb · 7d868fb
1 parent 750615d
commit 7d868fb
Show file tree

Hide file tree

Showing 12 changed files with 135 additions and 61 deletions.
diff --git a/src/frontend/apps/lti_site/apps/deposit/api/useDepositedFileMetadata/index.spec.tsx b/src/frontend/apps/lti_site/apps/deposit/api/useDepositedFileMetadata/index.spec.tsx
@@ -21,6 +21,7 @@ describe('useDepositedFileMetadata', () => {
   });
 
   it('requests the deposited file metadata', async () => {
+    const fileDepositoryId = '1';
     const depositedFileMetadata = {
       name: 'Deposited files List',
       description: 'Viewset for the API of the deposited file object.',
@@ -32,16 +33,24 @@ describe('useDepositedFileMetadata', () => {
       ],
       upload_max_size_bytes: 100,
     };
-    fetchMock.mock(`/api/depositedfiles/`, depositedFileMetadata);
+    fetchMock.mock(
+      `/api/filedepositories/${fileDepositoryId}/depositedfiles/`,
+      depositedFileMetadata,
+    );
 
-    const { result } = renderHook(() => useDepositedFileMetadata('fr'), {
-      wrapper: WrapperReactQuery,
-    });
+    const { result } = renderHook(
+      () => useDepositedFileMetadata('fr', fileDepositoryId),
+      {
+        wrapper: WrapperReactQuery,
+      },
+    );
     await waitFor(() => {
       expect(result.current.isSuccess).toBeTruthy();
     });
 
-    expect(fetchMock.lastCall()![0]).toEqual(`/api/depositedfiles/`);
+    expect(fetchMock.lastCall()![0]).toEqual(
+      `/api/filedepositories/${fileDepositoryId}/depositedfiles/`,
+    );
     expect(fetchMock.lastCall()![1]).toEqual({
       headers: {
         Authorization: 'Bearer some token',
@@ -55,17 +64,26 @@ describe('useDepositedFileMetadata', () => {
   });
 
   it('fails to get the deposited file metadata', async () => {
-    fetchMock.mock(`/api/depositedfiles/`, 404);
+    const fileDepositoryId = '1';
+    fetchMock.mock(
+      `/api/filedepositories/${fileDepositoryId}/depositedfiles/`,
+      404,
+    );
 
-    const { result } = renderHook(() => useDepositedFileMetadata('en'), {
-      wrapper: WrapperReactQuery,
-    });
+    const { result } = renderHook(
+      () => useDepositedFileMetadata('en', fileDepositoryId),
+      {
+        wrapper: WrapperReactQuery,
+      },
+    );
 
     await waitFor(() => {
       expect(result.current.isError).toBeTruthy();
     });
 
-    expect(fetchMock.lastCall()![0]).toEqual(`/api/depositedfiles/`);
+    expect(fetchMock.lastCall()![0]).toEqual(
+      `/api/filedepositories/${fileDepositoryId}/depositedfiles/`,
+    );
     expect(fetchMock.lastCall()![1]).toEqual({
       headers: {
         Authorization: 'Bearer some token',

diff --git a/src/frontend/apps/lti_site/apps/deposit/api/useDepositedFileMetadata/index.ts b/src/frontend/apps/lti_site/apps/deposit/api/useDepositedFileMetadata/index.ts
@@ -5,14 +5,15 @@ import { DepositedFileMetadata } from 'apps/deposit/types/metadata';
 
 export const useDepositedFileMetadata = (
   locale: string,
+  fileDepositoryId: string,
   queryConfig?: UseQueryOptions<
     DepositedFileMetadata,
     'depositedfiles',
     DepositedFileMetadata,
     string[]
   >,
 ) => {
-  const key = ['depositedfiles', locale];
+  const key = [`filedepositories/${fileDepositoryId}/depositedfiles`, locale];
   return useQuery<
     DepositedFileMetadata,
     'depositedfiles',

diff --git a/...ps/lti_site/apps/deposit/components/Dashboard/DashboardStudent/UploadFiles/index.spec.tsx b/...ps/lti_site/apps/deposit/components/Dashboard/DashboardStudent/UploadFiles/index.spec.tsx
@@ -114,7 +114,7 @@ describe('<UploadFiles />', () => {
     });
 
     fetchMock.mock(
-      '/api/depositedfiles/',
+      '/api/filedepositories/1/depositedfiles/',
       {
         upload_max_size_bytes: Math.pow(10, 9),
       },

diff --git a/...nd/apps/lti_site/apps/deposit/components/Dashboard/DashboardStudent/UploadFiles/index.tsx b/...nd/apps/lti_site/apps/deposit/components/Dashboard/DashboardStudent/UploadFiles/index.tsx
@@ -65,7 +65,10 @@ export const UploadFiles = () => {
   const { addUpload, uploadManagerState } = useUploadManager();
   const [filesToUpload, setFilesToUpload] = useState<File[]>([]);
   const [uploading, setUploading] = useState(false);
-  const metadata = useDepositedFileMetadata(intl.locale);
+  const metadata = useDepositedFileMetadata(
+    intl.locale,
+    depositAppData.fileDepository?.id || '',
+  );
 
   const uploadsInProgress = Object.values(uploadManagerState).filter((state) =>
     [UploadManagerStatus.INIT, UploadManagerStatus.UPLOADING].includes(
@@ -87,10 +90,13 @@ export const UploadFiles = () => {
 
     setUploading(true);
     try {
-      const depositedFile = await createDepositedFile({
-        size: file.size,
-        filename: file.name,
-      });
+      const depositedFile = await createDepositedFile(
+        {
+          size: file.size,
+          filename: file.name,
+        },
+        depositAppData.fileDepository?.id || '',
+      );
       addUpload(
         modelName.DepositedFiles,
         depositedFile.id,

diff --git a/...nd/apps/lti_site/apps/deposit/components/Dashboard/common/DepositedFileRow/index.spec.tsx b/...nd/apps/lti_site/apps/deposit/components/Dashboard/common/DepositedFileRow/index.spec.tsx
@@ -36,17 +36,20 @@ describe('<DepositedFileRow />', () => {
       'https://example.com/file.txt',
     );
 
-    fetchMock.patch(`/api/depositedfiles/${depositedFile.id}/`, {
-      ...depositedFile,
-      read: true,
-    });
+    fetchMock.patch(
+      `/api/filedepositories/${depositedFile.file_depository.id}/depositedfiles/${depositedFile.id}/`,
+      {
+        ...depositedFile,
+        read: true,
+      },
+    );
 
     fireEvent.click(downloadButton);
     fireEvent.blur(window);
 
     await waitFor(() =>
       expect(fetchMock.lastCall()![0]).toEqual(
-        `/api/depositedfiles/${depositedFile.id}/`,
+        `/api/filedepositories/${depositedFile.file_depository.id}/depositedfiles/${depositedFile.id}/`,
       ),
     );
     expect(fetchMock.lastCall()![1]).toEqual({

diff --git a/...rontend/apps/lti_site/apps/deposit/components/Dashboard/common/DepositedFileRow/index.tsx b/...rontend/apps/lti_site/apps/deposit/components/Dashboard/common/DepositedFileRow/index.tsx
@@ -29,7 +29,7 @@ export const DepositedFileRow = ({ file }: DepositedFileProps) => {
   const uploadedOnDate = uploadedOn ? uploadedOn.toFormat('dd/MM/yyyy') : null;
   const uploadedOnTime = uploadedOn ? uploadedOn.toFormat('HH:mm') : null;
 
-  const { mutate } = useUpdateDepositedFile(file.id);
+  const { mutate } = useUpdateDepositedFile(file.id, file.file_depository.id);
   const markFileAsRead = () => {
     const callback = () => {
       mutate(

diff --git a/src/frontend/apps/lti_site/apps/deposit/data/queries/index.spec.tsx b/src/frontend/apps/lti_site/apps/deposit/data/queries/index.spec.tsx
@@ -398,12 +398,16 @@ describe('queries', () => {
     it('updates the resource', async () => {
       const depositedFile = depositedFileMockFactory();
       fetchMock.patch(
-        `/api/depositedfiles/${depositedFile.id}/`,
+        `/api/filedepositories/${depositedFile.file_depository.id}/depositedfiles/${depositedFile.id}/`,
         depositedFile,
       );
 
       const { result } = renderHook(
-        () => useUpdateDepositedFile(depositedFile.id),
+        () =>
+          useUpdateDepositedFile(
+            depositedFile.id,
+            depositedFile.file_depository.id,
+          ),
         {
           wrapper: WrapperReactQuery,
         },
@@ -416,7 +420,7 @@ describe('queries', () => {
       });
 
       expect(fetchMock.lastCall()![0]).toEqual(
-        `/api/depositedfiles/${depositedFile.id}/`,
+        `/api/filedepositories/${depositedFile.file_depository.id}/depositedfiles/${depositedFile.id}/`,
       );
       expect(fetchMock.lastCall()![1]).toEqual({
         headers: {
@@ -434,10 +438,17 @@ describe('queries', () => {
 
     it('fails to update the resource', async () => {
       const depositedFile = depositedFileMockFactory();
-      fetchMock.patch(`/api/depositedfiles/${depositedFile.id}/`, 400);
+      fetchMock.patch(
+        `/api/filedepositories/${depositedFile.file_depository.id}/depositedfiles/${depositedFile.id}/`,
+        400,
+      );
 
       const { result } = renderHook(
-        () => useUpdateDepositedFile(depositedFile.id),
+        () =>
+          useUpdateDepositedFile(
+            depositedFile.id,
+            depositedFile.file_depository.id,
+          ),
         {
           wrapper: WrapperReactQuery,
         },
@@ -450,7 +461,7 @@ describe('queries', () => {
       });
 
       expect(fetchMock.lastCall()![0]).toEqual(
-        `/api/depositedfiles/${depositedFile.id}/`,
+        `/api/filedepositories/${depositedFile.file_depository.id}/depositedfiles/${depositedFile.id}/`,
       );
       expect(fetchMock.lastCall()![1]).toEqual({
         headers: {

diff --git a/src/frontend/apps/lti_site/apps/deposit/data/queries/index.tsx b/src/frontend/apps/lti_site/apps/deposit/data/queries/index.tsx
@@ -202,6 +202,7 @@ type UseUpdateDepositedFileOptions = UseMutationOptions<
 >;
 export const useUpdateDepositedFile = (
   id: string,
+  parentId: string,
   options?: UseUpdateDepositedFileOptions,
 ) => {
   const queryClient = useQueryClient();
@@ -212,7 +213,7 @@ export const useUpdateDepositedFile = (
   >({
     mutationFn: (updatedDepositedFile) =>
       updateOne({
-        name: modelName.DepositedFiles,
+        name: `${modelName.FileDepositories}/${parentId}/${modelName.DepositedFiles}`,
         id,
         object: updatedDepositedFile,
       }),

diff --git a/src/frontend/apps/lti_site/apps/deposit/data/sideEffects/createDepositedFile/index.spec.ts b/src/frontend/apps/lti_site/apps/deposit/data/sideEffects/createDepositedFile/index.spec.ts
@@ -13,19 +13,26 @@ describe('sideEffects/createDepositedFile', () => {
   afterEach(() => fetchMock.restore());
 
   it('creates a new deposited file and returns it', async () => {
-    fetchMock.mock('/api/depositedfiles/', {
-      id: 'shared_live_media_id',
-      is_ready_to_show: false,
-      show_download: true,
-      upload_state: 'pending',
-      video: 'video_id',
-    });
+    const fileDepositoryId = '1';
+    fetchMock.mock(
+      `/api/filedepositories/${fileDepositoryId}/depositedfiles/`,
+      {
+        id: 'shared_live_media_id',
+        is_ready_to_show: false,
+        show_download: true,
+        upload_state: 'pending',
+        video: 'video_id',
+      },
+    );
     const file = new File(['anrusitanrsui tnarsuit narsuit'], 'TestFile.txt');
 
-    const depositedFile = await createDepositedFile({
-      size: file.size,
-      filename: file.name,
-    });
+    const depositedFile = await createDepositedFile(
+      {
+        size: file.size,
+        filename: file.name,
+      },
+      fileDepositoryId,
+    );
 
     const fetchArgs = fetchMock.lastCall()![1]!;
 
@@ -44,23 +51,34 @@ describe('sideEffects/createDepositedFile', () => {
   });
 
   it('throws when it fails to create the deposited file (request failure)', async () => {
+    const fileDepositoryId = '1';
     fetchMock.mock(
-      '/api/depositedfiles/',
+      `/api/filedepositories/${fileDepositoryId}/depositedfiles/`,
       Promise.reject(new Error('Failed to perform the request')),
     );
     const file = new File(['anrusitanrsui tnarsuit narsuit'], 'TestFile.txt');
 
     await expect(
-      createDepositedFile({ size: file.size, filename: file.name }),
+      createDepositedFile(
+        { size: file.size, filename: file.name },
+        fileDepositoryId,
+      ),
     ).rejects.toThrow();
   });
 
   it('throws when it fails to create the deposited file (API error)', async () => {
-    fetchMock.mock('/api/depositedfiles/', 400);
+    const fileDepositoryId = '1';
+    fetchMock.mock(
+      `/api/filedepositories/${fileDepositoryId}/depositedfiles/`,
+      400,
+    );
     const file = new File(['anrusitanrsui tnarsuit narsuit'], 'TestFile.txt');
 
     await expect(
-      createDepositedFile({ size: file.size, filename: file.name }),
+      createDepositedFile(
+        { size: file.size, filename: file.name },
+        fileDepositoryId,
+      ),
     ).rejects.toThrow();
   });
 });
diff --git a/src/frontend/apps/lti_site/apps/deposit/data/sideEffects/createDepositedFile/index.ts b/src/frontend/apps/lti_site/apps/deposit/data/sideEffects/createDepositedFile/index.ts
@@ -7,18 +7,21 @@ import {
   useJwt,
 } from 'lib-components';
 
-export const createDepositedFile = async (file: {
-  size: number;
-  filename: string;
-}): Promise<DepositedFile> => {
+export const createDepositedFile = async (
+  file: {
+    size: number;
+    filename: string;
+  },
+  fileDepositoryId: string,
+): Promise<DepositedFile> => {
   const jwt = useJwt.getState().getJwt();
 
   if (!jwt) {
     throw new Error('No JWT found.');
   }
 
   const response = await fetchWrapper(
-    `${API_ENDPOINT}/${modelName.DepositedFiles}/`,
+    `${API_ENDPOINT}/${modelName.FileDepositories}/${fileDepositoryId}/${modelName.DepositedFiles}/`,
     {
       headers: {
         Authorization: `Bearer ${jwt}`,

diff --git a/src/frontend/apps/lti_site/data/queries/index.spec.tsx b/src/frontend/apps/lti_site/data/queries/index.spec.tsx
@@ -255,18 +255,24 @@ describe('queries', () => {
   describe('useThumbnail', () => {
     it('requests the resource', async () => {
       const thumbnail = thumbnailMockFactory();
-      fetchMock.mock(`/api/thumbnails/${thumbnail.id}/`, thumbnail);
+      fetchMock.mock(
+        `/api/videos/${thumbnail.video}/thumbnails/${thumbnail.id}/`,
+        thumbnail,
+      );
 
-      const { result } = renderHook(() => useThumbnail(thumbnail.id), {
-        wrapper: WrapperReactQuery,
-      });
+      const { result } = renderHook(
+        () => useThumbnail(thumbnail.id, thumbnail.video),
+        {
+          wrapper: WrapperReactQuery,
+        },
+      );
       await waitFor(() => {
         expect(result.current.isSuccess).toBeTruthy();
       });
 
       expect(fetchMock.calls().length).toEqual(1);
       expect(fetchMock.lastCall()![0]).toEqual(
-        `/api/thumbnails/${thumbnail.id}/`,
+        `/api/videos/${thumbnail.video}/thumbnails/${thumbnail.id}/`,
       );
       expect(fetchMock.lastCall()![1]).toEqual({
         headers: {
@@ -280,18 +286,24 @@ describe('queries', () => {
 
     it('fails to get the resource', async () => {
       const thumbnail = thumbnailMockFactory();
-      fetchMock.mock(`/api/thumbnails/${thumbnail.id}/`, 404);
+      fetchMock.mock(
+        `/api/videos/${thumbnail.video}/thumbnails/${thumbnail.id}/`,
+        404,
+      );
 
-      const { result } = renderHook(() => useThumbnail(thumbnail.id), {
-        wrapper: WrapperReactQuery,
-      });
+      const { result } = renderHook(
+        () => useThumbnail(thumbnail.id, thumbnail.video),
+        {
+          wrapper: WrapperReactQuery,
+        },
+      );
 
       await waitFor(() => {
         expect(result.current.isError).toBeTruthy();
       });
 
       expect(fetchMock.lastCall()![0]).toEqual(
-        `/api/thumbnails/${thumbnail.id}/`,
+        `/api/videos/${thumbnail.video}/thumbnails/${thumbnail.id}/`,
       );
       expect(fetchMock.lastCall()![1]).toEqual({
         headers: {