Make selected filters affect each other (#6474)

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

Hide file tree

Showing 2 changed files with 44 additions and 5 deletions.
diff --git a/lms/static/scripts/frontend_apps/components/dashboard/DashboardActivityFilters.tsx b/lms/static/scripts/frontend_apps/components/dashboard/DashboardActivityFilters.tsx
@@ -39,11 +39,21 @@ export default function DashboardActivityFilters({
   const { dashboard } = useConfig(['dashboard']);
   const { routes } = dashboard;
 
-  const courses = useAPIFetch<{ courses: Course[] }>(routes.courses);
+  const courses = useAPIFetch<{ courses: Course[] }>(routes.courses, {
+    h_userid: selectedStudentIds,
+    assignment_id: selectedAssignmentIds,
+  });
   const assignments = useAPIFetch<{ assignments: Assignment[] }>(
     routes.assignments,
+    {
+      h_userid: selectedStudentIds,
+      course_id: selectedCourseIds,
+    },
   );
-  const students = useAPIFetch<{ students: Student[] }>(routes.students);
+  const students = useAPIFetch<{ students: Student[] }>(routes.students, {
+    assignment_id: selectedAssignmentIds,
+    course_id: selectedCourseIds,
+  });
   const studentsWithName = useMemo(
     () => students.data?.students.filter(s => !!s.display_name),
     [students.data?.students],

diff --git a/lms/static/scripts/frontend_apps/components/dashboard/test/DashboardActivityFilters-test.js b/lms/static/scripts/frontend_apps/components/dashboard/test/DashboardActivityFilters-test.js
@@ -245,9 +245,9 @@ describe('DashboardActivityFilters', () => {
 
     it('shows amount of selected items when more than one is selected', () => {
       const wrapper = createComponent({
-        selectedCourseIds: [...courses],
-        selectedAssignmentIds: [...assignments],
-        selectedStudentIds: [...studentsWithName],
+        selectedCourseIds: courses.map(c => `${c.id}`),
+        selectedAssignmentIds: assignments.map(a => `${a.id}`),
+        selectedStudentIds: studentsWithName.map(s => s.h_userid),
       });
 
       assert.equal(getSelectContent(wrapper, 'courses-select'), '2 courses');
@@ -257,6 +257,35 @@ describe('DashboardActivityFilters', () => {
       );
       assert.equal(getSelectContent(wrapper, 'students-select'), '2 students');
     });
+
+    it('filters each dropdown by the values selected in the other dropdowns', () => {
+      const selectedCourseIds = [`${courses[0].id}`];
+      const selectedAssignmentIds = [`${assignments[1].id}`];
+      const selectedStudentIds = studentsWithName.map(s => s.h_userid);
+
+      createComponent({
+        selectedCourseIds,
+        selectedAssignmentIds,
+        selectedStudentIds,
+      });
+
+      assert.calledWith(fakeUseAPIFetch.getCall(0), '/api/dashboard/courses', {
+        h_userid: selectedStudentIds,
+        assignment_id: selectedAssignmentIds,
+      });
+      assert.calledWith(
+        fakeUseAPIFetch.getCall(1),
+        '/api/dashboard/assignments',
+        {
+          h_userid: selectedStudentIds,
+          course_id: selectedCourseIds,
+        },
+      );
+      assert.calledWith(fakeUseAPIFetch.getCall(2), '/api/dashboard/students', {
+        assignment_id: selectedAssignmentIds,
+        course_id: selectedCourseIds,
+      });
+    });
   });
 
   describe('clear filters', () => {