Export api course functions in an object due to TypeScript update

It turns out that you can no longer stub free-standing functions in Typescript 3.9.2+ according to this issue:

microsoft/TypeScript#38568
sinonjs/sinon#562

Currently, my package-lock.json has 3.9.5, so that appears to be why I was having these problems in my test. My fix was to use an object where the functions become methods instead.

Author: natalynyu

src/client/api/__tests__/courses.test.ts

@@ -10,7 +10,7 @@ import {
   physicsCourseResponse,
   error,
 } from 'testData';
-import * as api from 'client/api';
+import { CourseAPI } from 'client/api';
 import { ManageCourseResponseDTO } from 'common/dto/courses/ManageCourseResponse.dto';
 import {
   strictEqual,
@@ -37,7 +37,7 @@ describe('Course Admin API', function () {
               physicsCourseResponse,
             ],
           } as AxiosResponse<ManageCourseResponseDTO[]>);
-          result = await api.getAllCourses();
+          result = await CourseAPI.getAllCourses();
         });
         it('should call getAllCourses', function () {
           strictEqual(getStub.callCount, 1);
@@ -60,7 +60,7 @@ describe('Course Admin API', function () {
         });
         it('should throw an error', async function () {
           try {
-            await api.getAllCourses();
+            await CourseAPI.getAllCourses();
             fail('Did not throw an error');
           } catch (err) {
             deepStrictEqual(err, error);

src/client/api/courses.ts

@@ -5,15 +5,20 @@ import { ManageCourseResponseDTO } from '../../common/dto/courses/ManageCourseRe
 /**
  * Retrieves all courses
  */
-export const getAllCourses = async (): Promise<ManageCourseResponseDTO[]> => {
+const getAllCourses = async (): Promise<ManageCourseResponseDTO[]> => {
   const response = await request.get('/api/courses/');
   return response.data;
 };
 
-export const getCourseInstancesForYear = async (
+const getCourseInstancesForYear = async (
   acadYear: number
 ): Promise<CourseInstanceResponseDTO[][]> => {
   const response = await request
     .get(`/api/course-instances/?acadYear=${acadYear}`);
   return response.data;
 };
+
+export const CourseAPI = {
+  getAllCourses,
+  getCourseInstancesForYear,
+};

src/client/components/pages/CourseAdmin.tsx

@@ -23,7 +23,7 @@ import { MessageContext } from 'client/context';
 import { TableRowProps } from 'mark-one/lib/Tables/TableRow';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faEdit } from '@fortawesome/free-solid-svg-icons';
-import { getAllCourses } from '../../api/courses';
+import { CourseAPI } from '../../api/courses';
 
 /**
  * The component represents the Course Admin page, which will be rendered at
@@ -45,7 +45,7 @@ const CourseAdmin: FunctionComponent = function (): ReactElement {
    * If it fails, display a message for the user
    */
   useEffect((): void => {
-    getAllCourses()
+    CourseAPI.getAllCourses()
       .then((courses): ManageCourseResponseDTO[] => {
         setCourses(courses);
         return courses;

src/client/components/pages/Courses/CoursesPage.tsx

@@ -8,7 +8,7 @@ import React, {
 import { LoadSpinner } from 'mark-one';
 import { MessageContext } from 'client/context';
 import CourseInstanceResponseDTO from 'common/dto/courses/CourseInstanceResponse';
-import { getCourseInstancesForYear } from 'client/api';
+import { CourseAPI } from 'client/api';
 import { MESSAGE_TYPE, MESSAGE_ACTION, AppMessage } from 'client/classes';
 import { OFFERED, COURSE_TABLE_COLUMN } from 'common/constants';
 import CourseInstanceTable from './CourseInstanceTable';
@@ -64,7 +64,7 @@ const CoursesPage: FunctionComponent = (): ReactElement => {
 
   useEffect((): void => {
     setFetching(true);
-    getCourseInstancesForYear(acadYear)
+    CourseAPI.getCourseInstancesForYear(acadYear)
       .then((courses: CourseInstanceResponseDTO[][]): void => {
         setCourses(courses[0]);
       })

src/client/components/pages/Courses/__tests__/CoursesPage.test.tsx

@@ -4,7 +4,7 @@ import { stub, SinonStub } from 'sinon';
 import {
   render, BoundFunction, QueryByText, FindByText, wait,
 } from 'test-utils';
-import * as courseAPI from 'client/api';
+import { CourseAPI } from 'client/api';
 import { AppMessage, MESSAGE_TYPE, MESSAGE_ACTION } from 'client/classes';
 import { cs50CourseInstance } from 'testData';
 import CoursesPage from '../CoursesPage';
@@ -13,7 +13,7 @@ describe('Course Instances List', function () {
   let getStub: SinonStub;
   let dispatchStub: SinonStub;
   beforeEach(function () {
-    getStub = stub(courseAPI, 'getCourseInstancesForYear');
+    getStub = stub(CourseAPI, 'getCourseInstancesForYear');
     dispatchStub = stub();
   });
   describe('fetching data on render', function () {