Allow query params with value undefined in api calls

hypothesis · Jul 30, 2024 · 2b1e9dd · 2b1e9dd
1 parent 0514078
commit 2b1e9dd
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 14 deletions.
diff --git a/lms/static/scripts/frontend_apps/utils/api.ts b/lms/static/scripts/frontend_apps/utils/api.ts
@@ -45,7 +45,7 @@ export type APICallOptions = {
   path: string;
 
   /** Query parameters. */
-  params?: Record<string, string | string[]>;
+  params?: Record<string, string | string[] | undefined>;
 
   /** JSON-serializable body of request. */
   data?: object;
@@ -186,7 +186,7 @@ export function urlPath(strings: TemplateStringsArray, ...params: string[]) {
  */
 export function useAPIFetch<T = unknown>(
   path: string | null,
-  params?: Record<string, string | string[]>,
+  params?: Record<string, string | string[] | undefined>,
 ): FetchResult<T> {
   const {
     api: { authToken },

diff --git a/lms/static/scripts/frontend_apps/utils/dashboard/hooks.ts b/lms/static/scripts/frontend_apps/utils/dashboard/hooks.ts
@@ -36,16 +36,12 @@ export function useDashboardFilters(): UseDashboardFilters {
   const [, navigate] = useLocation();
   const updateFilters = useCallback(
     ({ courseIds, assignmentIds, studentIds }: Partial<DashboardFilters>) => {
-      const newQueryParams = { ...queryParams };
-      if (courseIds) {
-        newQueryParams.course_id = courseIds;
-      }
-      if (assignmentIds) {
-        newQueryParams.assignment_id = assignmentIds;
-      }
-      if (studentIds) {
-        newQueryParams.student_id = studentIds;
-      }
+      const newQueryParams = {
+        ...queryParams,
+        course_id: courseIds,
+        assignment_id: assignmentIds,
+        student_id: studentIds,
+      };
 
       navigate(recordToQueryString(newQueryParams), { replace: true });
     },

diff --git a/lms/static/scripts/frontend_apps/utils/test/url-test.js b/lms/static/scripts/frontend_apps/utils/test/url-test.js
@@ -47,6 +47,7 @@ describe('recordToSearchParams', () => {
     const result = recordToSearchParams({
       foo: 'bar',
       baz: ['1', '2', '3'],
+      ignored: undefined,
     });
 
     assert.equal(result.toString(), 'foo=bar&baz=1&baz=2&baz=3');

diff --git a/lms/static/scripts/frontend_apps/utils/url.ts b/lms/static/scripts/frontend_apps/utils/url.ts
@@ -34,10 +34,15 @@ export function replaceURLParams<Param>(
  * Any param which is an array will be appended for every one of its values.
  */
 export function recordToSearchParams(
-  params: Record<string, string | string[]>,
+  params: Record<string, string | string[] | undefined>,
 ): URLSearchParams {
   const queryParams = new URLSearchParams();
   Object.entries(params).forEach(([name, value]) => {
+    // Skip params if their value is undefined
+    if (value === undefined) {
+      return;
+    }
+
     if (Array.isArray(value)) {
       value.forEach(v => queryParams.append(name, v));
     } else {
@@ -59,7 +64,7 @@ export function recordToSearchParams(
  *    { foo: 'bar', something: ['hello', 'world'] } -> '?foo=bar&something=hello&something=world'
  */
 export function recordToQueryString(
-  params: Record<string, string | string[]>,
+  params: Record<string, string | string[] | undefined>,
 ): string {
   const queryString = recordToSearchParams(params).toString();
   return queryString.length > 0 ? `?${queryString}` : '';