richie-education 2.25.0-b2.dev32 → 2.25.0-b2.dev34

package/js/pages/TeacherDashboardContractsLayout/hooks/useDownloadContractArchive/index.spec.tsx

@@ -0,0 +1,266 @@
+import { faker } from '@faker-js/faker';
+import { act, renderHook, waitFor } from '@testing-library/react';
+import { IntlProvider } from 'react-intl';
+import { PropsWithChildren } from 'react';
+import { RichieContextFactory as mockRichieContextFactory } from 'utils/test/factories/richie';
+import JoanieApiProvider from 'contexts/JoanieApiContext';
+import { CONTRACT_DOWNLOAD_SETTINGS } from 'settings';
+import {
+  getStoredContractArchiveId,
+  storeContractArchiveId,
+  unstoreContractArchiveId,
+} from './contractArchiveLocalStorage';
+import useDownloadContractArchive, { ContractDownloadStatus } from '.';
+
+jest.mock('settings', () => ({
+  ...jest.requireActual('settings'),
+  CONTRACT_DOWNLOAD_SETTINGS: {
+    ...jest.requireActual('settings').CONTRACT_DOWNLOAD_SETTINGS,
+    pollInterval: 100,
+  },
+}));
+
+jest.mock('utils/context', () => ({
+  __esModule: true,
+  default: mockRichieContextFactory({
+    authentication: { backend: 'fonzie', endpoint: 'https://auth.test' },
+    joanie_backend: { endpoint: 'https://joanie.test' },
+  }).one(),
+}));
+
+const mockCheckArchive = jest.fn();
+const mockCreateArchive = jest.fn();
+const mockGetArchive = jest.fn();
+jest.mock('hooks/useContractArchive', () => ({
+  __esModule: true,
+  default: () => ({
+    methods: { get: mockGetArchive, create: mockCreateArchive, check: mockCheckArchive },
+  }),
+}));
+
+let mockHasContractToDownload: boolean;
+jest.mock('pages/TeacherDashboardContractsLayout/hooks/useHasContractToDownload/index.tsx', () => ({
+  __esModule: true,
+  default: () => mockHasContractToDownload,
+}));
+
+describe('useDownloadContractArchive', () => {
+  let organizationId: string;
+  const Wrapper = ({ children }: PropsWithChildren) => {
+    return (
+      <IntlProvider locale="en">
+        <JoanieApiProvider>{children}</JoanieApiProvider>
+      </IntlProvider>
+    );
+  };
+
+  afterEach(() => {
+    jest.resetAllMocks();
+    unstoreContractArchiveId();
+  });
+
+  describe('with no contract available for download', () => {
+    beforeEach(() => {
+      organizationId = faker.string.uuid();
+      mockHasContractToDownload = false;
+    });
+
+    it('should return IDLE status when no contractArchiveId is stored', async () => {
+      const { result } = renderHook(() => useDownloadContractArchive({ organizationId }), {
+        wrapper: Wrapper,
+      });
+      expect(result.current.status).toBe(ContractDownloadStatus.IDLE);
+
+      // no api call should have been done.
+      expect(mockCheckArchive).not.toHaveBeenCalled();
+      expect(mockGetArchive).not.toHaveBeenCalled();
+      expect(mockCreateArchive).not.toHaveBeenCalled();
+    });
+
+    it('should return IDLE status when contractArchiveId is stored', async () => {
+      const contractArchiveId = faker.string.uuid();
+      storeContractArchiveId(contractArchiveId);
+
+      const { result } = renderHook(() => useDownloadContractArchive({ organizationId }), {
+        wrapper: Wrapper,
+      });
+
+      expect(result.current.status).toBe(ContractDownloadStatus.IDLE);
+
+      // no api call should have been done.
+      expect(mockCheckArchive).not.toHaveBeenCalled();
+      expect(mockGetArchive).not.toHaveBeenCalled();
+      expect(mockCreateArchive).not.toHaveBeenCalled();
+    });
+  });
+
+  describe('with contracts available for download', () => {
+    beforeEach(() => {
+      organizationId = faker.string.uuid();
+      mockHasContractToDownload = true;
+    });
+
+    it('should return IDLE status when no contractArchiveId is stored', async () => {
+      const { result } = renderHook(() => useDownloadContractArchive({ organizationId }), {
+        wrapper: Wrapper,
+      });
+
+      // ensure that initial effects are done
+      expect(result.current.status).toBe(ContractDownloadStatus.IDLE);
+
+      // no api call should have been done.
+      expect(mockCheckArchive).not.toHaveBeenCalled();
+      expect(mockGetArchive).not.toHaveBeenCalled();
+      expect(mockCreateArchive).not.toHaveBeenCalled();
+    });
+
+    it('should return PENDING status when a contractArchiveId is stored', async () => {
+      const contractArchiveId = faker.string.uuid();
+      storeContractArchiveId(contractArchiveId);
+      mockCheckArchive.mockResolvedValue(false);
+
+      const { result } = renderHook(() => useDownloadContractArchive({ organizationId }), {
+        wrapper: Wrapper,
+      });
+
+      await waitFor(() => {
+        expect(result.current.status).toBe(ContractDownloadStatus.PENDING);
+      });
+
+      expect(mockCheckArchive).toHaveBeenCalledTimes(1);
+      expect(mockGetArchive).not.toHaveBeenCalled();
+      expect(mockCreateArchive).not.toHaveBeenCalled();
+    });
+
+    it('should return READY status when a contractArchiveId is stored and it exists on the server', async () => {
+      const contractArchiveId = faker.string.uuid();
+      storeContractArchiveId(contractArchiveId);
+      mockCheckArchive.mockResolvedValue(true);
+
+      const { result } = renderHook(() => useDownloadContractArchive({ organizationId }), {
+        wrapper: Wrapper,
+      });
+
+      // ensure that initial effects are done
+      await waitFor(() => {
+        expect(result.current.status).toBe(ContractDownloadStatus.READY);
+      });
+
+      expect(mockCheckArchive).toHaveBeenCalledTimes(1);
+      expect(mockGetArchive).not.toHaveBeenCalled();
+      expect(mockCreateArchive).not.toHaveBeenCalled();
+    });
+
+    it("doDownloadArchive should call 'getArchive' if the archive is ready for download", async () => {
+      const contractArchiveId = faker.string.uuid();
+      storeContractArchiveId(contractArchiveId);
+      mockCheckArchive.mockResolvedValue(true);
+
+      const { result } = renderHook(() => useDownloadContractArchive({ organizationId }), {
+        wrapper: Wrapper,
+      });
+
+      // ensure that initial effects are done
+      await waitFor(() => {
+        expect(result.current.status).toBe(ContractDownloadStatus.READY);
+      });
+      expect(mockCheckArchive).toHaveBeenCalledTimes(1);
+
+      act(() => {
+        result.current.downloadContractArchive();
+      });
+
+      await waitFor(() => {
+        expect(result.current.status).toBe(ContractDownloadStatus.IDLE);
+      });
+
+      expect(mockCheckArchive).toHaveBeenCalledTimes(1);
+      // backend is called to download the archive
+      expect(mockGetArchive).toHaveBeenCalledTimes(1);
+
+      // but not to generate the archive
+      expect(mockCreateArchive).not.toHaveBeenCalled();
+    });
+
+    it("doDownloadArchive should call 'createArchive' if no contractArchiveId is stored", async () => {
+      const { result } = renderHook(() => useDownloadContractArchive({ organizationId }), {
+        wrapper: Wrapper,
+      });
+
+      mockCheckArchive.mockResolvedValue(true);
+      mockCreateArchive.mockResolvedValue(faker.string.uuid());
+      act(() => {
+        result.current.downloadContractArchive();
+      });
+
+      await waitFor(() => {
+        expect(result.current.status).toBe(ContractDownloadStatus.IDLE);
+      });
+
+      expect(mockCreateArchive).toHaveBeenCalledTimes(1);
+      expect(mockCheckArchive).toHaveBeenCalledTimes(1);
+      expect(mockGetArchive).toHaveBeenCalledTimes(1);
+    });
+  });
+
+  describe('with contracts available for download and expired contractArchiveId', () => {
+    let contractArchiveId: string;
+    beforeEach(() => {
+      organizationId = faker.string.uuid();
+      mockHasContractToDownload = true;
+
+      const now = Date.now();
+      const unvalidCreationTime =
+        now - CONTRACT_DOWNLOAD_SETTINGS.contractArchiveLocalVaklidityDurationMs * 2;
+
+      jest.useFakeTimers();
+      jest.setSystemTime(new Date(unvalidCreationTime));
+      contractArchiveId = faker.string.uuid();
+      storeContractArchiveId(contractArchiveId);
+      jest.setSystemTime(new Date(now));
+    });
+
+    afterEach(() => {
+      jest.runOnlyPendingTimers();
+      jest.useRealTimers();
+    });
+
+    it('should return READY status when archive exists on the server', async () => {
+      mockCheckArchive.mockResolvedValue(true);
+
+      const { result } = renderHook(() => useDownloadContractArchive({ organizationId }), {
+        wrapper: Wrapper,
+      });
+
+      // ensure that initial effects are done
+      await waitFor(() => {
+        expect(result.current.status).toBe(ContractDownloadStatus.READY);
+      });
+
+      expect(getStoredContractArchiveId()).toBe(contractArchiveId);
+
+      expect(mockCheckArchive).toHaveBeenCalledTimes(1);
+      expect(mockGetArchive).not.toHaveBeenCalled();
+      expect(mockCreateArchive).not.toHaveBeenCalled();
+    });
+
+    it("should return IDLE status and clear stored id when archive doesn't exists on the server", async () => {
+      mockCheckArchive.mockResolvedValue(false);
+
+      const { result } = renderHook(() => useDownloadContractArchive({ organizationId }), {
+        wrapper: Wrapper,
+      });
+
+      // ensure that initial effects are done
+      await waitFor(() => {
+        expect(result.current.status).toBe(ContractDownloadStatus.IDLE);
+      });
+
+      expect(getStoredContractArchiveId()).toBe(null);
+
+      expect(mockCheckArchive).toHaveBeenCalledTimes(1);
+      expect(mockGetArchive).not.toHaveBeenCalled();
+      expect(mockCreateArchive).not.toHaveBeenCalled();
+    });
+  });
+});

package/js/pages/TeacherDashboardContractsLayout/hooks/useDownloadContractArchive/index.tsx

@@ -0,0 +1,153 @@
+import { useEffect, useMemo, useState } from 'react';
+import useContractArchive from 'hooks/useContractArchive';
+import useCheckContractArchiveExists from '../useCheckContractArchiveExists';
+import useHasContractToDownload from '../useHasContractToDownload';
+import {
+  storeContractArchiveId,
+  unstoreContractArchiveId,
+  getStoredContractArchiveId,
+  isStoredContractArchiveIdExpired,
+} from './contractArchiveLocalStorage';
+
+export enum ContractDownloadStatus {
+  INITIALIZING = 'initializing',
+  IDLE = 'idle',
+  PENDING = 'pending',
+  READY = 'ready',
+}
+
+interface UseTeacherContractsBulkDownloadProps {
+  organizationId: string;
+}
+
+const useDownloadContractArchive = ({ organizationId }: UseTeacherContractsBulkDownloadProps) => {
+  // Contract's archive api interface
+  const {
+    methods: { get: getArchive, create: createArchive },
+  } = useContractArchive();
+
+  // Simple hook that verifiy if current user have some fully signed contracts to download.
+  const hasContractToDownload = useHasContractToDownload(organizationId);
+
+  // Component state of the localstorage contract's archive id
+  const [contractArchiveId, setContractArchiveId] = useState<string | null>(
+    getStoredContractArchiveId(),
+  );
+
+  // Hook that handle contract archive existence check and recursive polling of it.
+  const { isPolling, isContractArchiveExists, checkArchiveExists } = useCheckContractArchiveExists({
+    enable: !!hasContractToDownload,
+  });
+
+  // Stored contract's archive id have to be cleanup at some point.
+  // this expired logic is handle by ./contractArchiveLocalStorage and
+  // this isContractArchiveIdExpired track it at a component level.
+  const [isContractArchiveIdExpired, setIsContractArchiveIdExpired] = useState<boolean | null>(
+    null,
+  );
+
+  // This state track if the user have request the download or not.
+  // if he have click the download button, it will be true.
+  // if he just load the page, it will be false.
+  const [isDownloadRequest, setIsDownloadRequest] = useState(false);
+
+  // Here we compute the download status.
+  // It stay as INITIALIZING until all needed data get fetched.
+  // Then it become either:
+  // * READY: the archive is ready to be download from the server
+  // * PENDING: the archive is generating on the server
+  // * IDLE: A fresh new download process
+  const contractDownloadStatus = useMemo(() => {
+    if (
+      [hasContractToDownload, isContractArchiveExists, isContractArchiveIdExpired].includes(null)
+    ) {
+      return ContractDownloadStatus.INITIALIZING;
+    }
+
+    if (hasContractToDownload && contractArchiveId) {
+      if (isContractArchiveExists) {
+        return ContractDownloadStatus.READY;
+      }
+
+      return ContractDownloadStatus.PENDING;
+    }
+
+    return ContractDownloadStatus.IDLE;
+  }, [
+    hasContractToDownload,
+    contractArchiveId,
+    isContractArchiveExists,
+    isContractArchiveIdExpired,
+  ]);
+
+  const clearContractArchive = () => {
+    setIsDownloadRequest(false);
+    setContractArchiveId(null);
+    unstoreContractArchiveId();
+  };
+
+  // Either download the archive
+  // or flag the download as requested and request the archive's creation
+  const downloadContractArchive = async () => {
+    if (isContractArchiveExists && contractArchiveId !== null) {
+      await getArchive(contractArchiveId);
+      clearContractArchive();
+    } else {
+      // When archive is ready and download is requested
+      // a useEffect will trigger the download.
+      setIsDownloadRequest(true);
+      createContractArchive();
+    }
+  };
+
+  // Request the archive's creation if needed
+  // then can start archive's polling (if option.polling === true)
+  const createContractArchive = async () => {
+    let newContractArchiveId;
+    if (contractArchiveId === null) {
+      newContractArchiveId = await createArchive(organizationId);
+      setContractArchiveId(newContractArchiveId);
+      storeContractArchiveId(newContractArchiveId);
+    } else {
+      newContractArchiveId = contractArchiveId;
+    }
+
+    if (!isPolling) {
+      checkArchiveExists(newContractArchiveId, { polling: true });
+    }
+  };
+
+  // Here we check the validity of stored id timestamp
+  // if an id is expired, we'll either:
+  // * when it exists on the server: switch expired state but nothing else
+  // * when didn't exists on the server: switch expired state and clear download data.
+  useEffect(() => {
+    if (isContractArchiveExists === null) {
+      return;
+    }
+
+    if (isStoredContractArchiveIdExpired() && isContractArchiveExists === false) {
+      setIsContractArchiveIdExpired(true);
+      clearContractArchive();
+    } else {
+      setIsContractArchiveIdExpired(false);
+    }
+  }, [contractDownloadStatus, isContractArchiveExists]);
+
+  // When the archive become ready for download
+  // this effect will trigger the download
+  // if it have been previously requested by the user
+  useEffect(() => {
+    if (isDownloadRequest && isContractArchiveExists) {
+      downloadContractArchive();
+    }
+  }, [isDownloadRequest, isContractArchiveExists]);
+
+  return {
+    status: contractDownloadStatus,
+    downloadContractArchive,
+    createContractArchive,
+  };
+};
+
+export default useDownloadContractArchive;

package/js/pages/TeacherDashboardContractsLayout/hooks/useHasContractToDownload/index.spec.tsx

@@ -0,0 +1,100 @@
+import fetchMock from 'fetch-mock';
+import { faker } from '@faker-js/faker';
+import { renderHook, waitFor } from '@testing-library/react';
+import { IntlProvider } from 'react-intl';
+import { QueryClientProvider } from '@tanstack/react-query';
+import { PropsWithChildren } from 'react';
+import { PER_PAGE } from 'settings';
+import { RichieContextFactory as mockRichieContextFactory } from 'utils/test/factories/richie';
+import { ContractState } from 'types/Joanie';
+import { ContractFactory } from 'utils/test/factories/joanie';
+import { createTestQueryClient } from 'utils/test/createTestQueryClient';
+import JoanieSessionProvider from 'contexts/SessionContext/JoanieSessionProvider';
+import useHasContractToDownload from '.';
+
+jest.mock('utils/context', () => ({
+  __esModule: true,
+  default: mockRichieContextFactory({
+    authentication: { backend: 'fonzie', endpoint: 'https://auth.test' },
+    joanie_backend: { endpoint: 'https://joanie.test' },
+  }).one(),
+}));
+
+describe('hooks/useHasContractToDownload', () => {
+  const Wrapper = ({ children }: PropsWithChildren) => {
+    return (
+      <IntlProvider locale="en">
+        <QueryClientProvider client={createTestQueryClient({ user: true })}>
+          <JoanieSessionProvider>{children}</JoanieSessionProvider>
+        </QueryClientProvider>
+      </IntlProvider>
+    );
+  };
+
+  beforeEach(() => {
+    // Joanie providers calls
+    fetchMock.get('https://joanie.test/api/v1.0/orders/', []);
+    fetchMock.get('https://joanie.test/api/v1.0/credit-cards/', []);
+    fetchMock.get('https://joanie.test/api/v1.0/addresses/', []);
+  });
+
+  afterEach(() => {
+    fetchMock.restore();
+  });
+
+  it('should return null when joanie request is pending', async () => {
+    const organizationId = faker.string.uuid();
+    const contractListUrl = `https://joanie.test/api/v1.0/organizations/${organizationId}/contracts/?signature_state=${ContractState.SIGNED}&page=1&page_size=${PER_PAGE.teacherContractList}`;
+    fetchMock.get(contractListUrl, {
+      count: 1,
+      next: null,
+      previous: null,
+      results: [ContractFactory().one()],
+    });
+
+    const { result } = renderHook(() => useHasContractToDownload(organizationId), {
+      wrapper: Wrapper,
+    });
+
+    expect(result.current).toBeNull();
+  });
+
+  it('should return true when joanie return some signed contracts', async () => {
+    const organizationId = faker.string.uuid();
+    const contractListUrl = `https://joanie.test/api/v1.0/organizations/${organizationId}/contracts/?signature_state=${ContractState.SIGNED}&page=1&page_size=${PER_PAGE.teacherContractList}`;
+    fetchMock.get(contractListUrl, {
+      count: 1,
+      next: null,
+      previous: null,
+      results: [ContractFactory().one()],
+    });
+
+    const { result } = renderHook(() => useHasContractToDownload(organizationId), {
+      wrapper: Wrapper,
+    });
+
+    await waitFor(() => {
+      expect(fetchMock.calls().map((call) => call[0])).toContain(contractListUrl);
+      expect(result.current).toBe(true);
+    });
+  });
+
+  it("should return false when joanie doesn't return any signed contracts", async () => {
+    const organizationId = faker.string.uuid();
+    const contractListUrl = `https://joanie.test/api/v1.0/organizations/${organizationId}/contracts/?signature_state=${ContractState.SIGNED}&page=1&page_size=${PER_PAGE.teacherContractList}`;
+    fetchMock.get(contractListUrl, {
+      count: 0,
+      next: null,
+      previous: null,
+      results: [],
+    });
+
+    const { result } = renderHook(() => useHasContractToDownload(organizationId), {
+      wrapper: Wrapper,
+    });
+    await waitFor(() => {
+      expect(fetchMock.calls().map((call) => call[0])).toContain(contractListUrl);
+      expect(result.current).toBe(false);
+    });
+  });
+});

package/js/pages/TeacherDashboardContractsLayout/hooks/useHasContractToDownload/index.tsx

@@ -0,0 +1,23 @@
+import { useOrganizationContracts } from 'hooks/useContracts';
+import { PER_PAGE } from 'settings';
+import { ContractState, Organization } from 'types/Joanie';
+
+const useHasContractToDownload = (organizationId: Organization['id']) => {
+  const {
+    items: contracts,
+    states: { isFetched },
+  } = useOrganizationContracts({
+    organization_id: organizationId,
+    signature_state: ContractState.SIGNED,
+    page: 1,
+    page_size: PER_PAGE.teacherContractList,
+  });
+
+  if (!isFetched) {
+    return null;
+  }
+
+  return contracts.length > 0;
+};
+
+export default useHasContractToDownload;

package/js/settings.ts

@@ -46,6 +46,13 @@ export const CONTRACT_SETTINGS = {
   dummySignatureSignTimeout: 2000,
 };
 
+export const CONTRACT_DOWNLOAD_SETTINGS = {
+  // Interval in ms to poll the related contract's archive.
+  pollInterval: 1000,
+  contractArchiveLocalStorageKey: 'RICHIE_CONTRACT_ARCHIVE',
+  contractArchiveLocalVaklidityDurationMs: 10 * 60 * 60 * 1000, // 10min
+};
+
 const DEFAULT_PER_PAGE = 50;
 export const PER_PAGE = {
   teacherContractList: 25,

package/js/types/Joanie.ts

@@ -520,6 +520,11 @@ interface APIUser {
       ? Promise<Nullable<Contract>>
       : Promise<PaginatedResponse<Contract>>;
     download(id: string): Promise<File>;
+    zip_archive: {
+      check: (id: string) => Promise<Response>;
+      create: ({ organization_id }: { organization_id: string }) => Promise<{ url: string }>;
+      get: (id: string) => Promise<File>;
+    };
   };
 }
 

package/js/utils/errors/HttpError.ts

@@ -25,6 +25,7 @@ export function isHttpError(error: any): error is HttpError {
 
 export enum HttpStatusCode {
   OK = 200,
+  NO_CONTENT = 204,
   UNAUTHORIZED = 401,
   BAD_REQUEST = 400,
   FORBIDDEN = 403,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "richie-education",
-  "version": "2.25.0-b2.dev32",
+  "version": "2.25.0-b2.dev34",
   "description": "A CMS to build learning portals for Open Education",
   "main": "sandbox/manage.py",
   "scripts": {