feat: fix bug in filters

Pearson-Advance · Dec 6, 2023 · 24ddeb6 · 24ddeb6
1 parent 6c82929
commit 24ddeb6
Show file tree

Hide file tree

Showing 13 changed files with 43 additions and 34 deletions.
diff --git a/src/features/Common/data/_test_/api.test.js b/src/features/Common/data/_test_/api.test.js
@@ -29,7 +29,7 @@ describe('getCoursesByInstitution', () => {
 
     expect(httpClientMock.get).toHaveBeenCalledTimes(1);
     expect(httpClientMock.get).toHaveBeenCalledWith(
-      'http://localhost:18000/pearson_course_operation/api/v2/courses/?institution_id=1',
+      'http://localhost:18000/pearson_course_operation/api/v2/courses/?limit=false&institution_id=1',
     );
   });
 });
diff --git a/src/features/Common/data/api.js b/src/features/Common/data/api.js
@@ -3,7 +3,7 @@ import { getConfig } from '@edx/frontend-platform';
 
 function getCoursesByInstitution(institutionId) {
   return getAuthenticatedHttpClient().get(
-    `${getConfig().COURSE_OPERATIONS_API_V2_BASE_URL}/courses/?institution_id=${institutionId}`,
+    `${getConfig().COURSE_OPERATIONS_API_V2_BASE_URL}/courses/?limit=false&institution_id=${institutionId}`,
   );
 }
 

diff --git a/src/features/Instructors/InstructorsFilters/_test_/index.test.jsx b/src/features/Instructors/InstructorsFilters/_test_/index.test.jsx
@@ -4,11 +4,17 @@ import InstructorsFilters from 'features/Instructors/InstructorsFilters';
 import '@testing-library/jest-dom/extend-expect';
 
 describe('InstructorsFilters Component', () => {
+  const mockSetFilters = jest.fn();
+
+  beforeEach(() => {
+    mockSetFilters.mockClear();
+  });
+
   test('call service when apply filters', async () => {
     const fetchData = jest.fn();
     const resetPagination = jest.fn();
     const { getByPlaceholderText, getByText } = render(
-      <InstructorsFilters fetchData={fetchData} resetPagination={resetPagination} />,
+      <InstructorsFilters fetchData={fetchData} resetPagination={resetPagination} setFilters={mockSetFilters} />,
     );
 
     const nameInput = getByPlaceholderText('Enter Instructor Name');
@@ -35,7 +41,7 @@ describe('InstructorsFilters Component', () => {
     const fetchData = jest.fn();
     const resetPagination = jest.fn();
     const { getByPlaceholderText, getByText } = render(
-      <InstructorsFilters fetchData={fetchData} resetPagination={resetPagination} />,
+      <InstructorsFilters fetchData={fetchData} resetPagination={resetPagination} setFilters={mockSetFilters} />,
     );
 
     const nameInput = getByPlaceholderText('Enter Instructor Name');

diff --git a/src/features/Instructors/InstructorsFilters/_test_/reducer.test.jsx b/src/features/Instructors/InstructorsFilters/_test_/reducer.test.jsx
@@ -40,9 +40,7 @@ describe('Student filter reducers', () => {
     };
     const action = {
       type: FETCH_COURSES_DATA_SUCCESS,
-      payload: {
-        results: [],
-      },
+      payload: [],
     };
     expect(reducer(state, action)).toEqual(state);
   });

diff --git a/src/features/Instructors/InstructorsFilters/index.jsx b/src/features/Instructors/InstructorsFilters/index.jsx
@@ -26,7 +26,7 @@ const initialState = {
   },
 };
 
-const InstructorsFilters = ({ fetchData, resetPagination }) => {
+const InstructorsFilters = ({ fetchData, resetPagination, setFilters }) => {
   const stateInstitution = useContext(InstitutionContext);
   const [state, dispatch] = useReducer(reducer, initialState);
   const [courseOptions, setCourseOptions] = useState([]);
@@ -57,13 +57,15 @@ const InstructorsFilters = ({ fetchData, resetPagination }) => {
     setInstructorName('');
     setInstructorEmail('');
     setCourseSelected(null);
+    setFilters({});
   };
 
   const handleInstructorsFilter = async (e) => {
     e.preventDefault();
     const form = e.target;
     const formData = new FormData(form);
     const formJson = Object.fromEntries(formData.entries());
+    setFilters(formJson);
     try {
       fetchData(formJson);
     } catch (error) {
@@ -143,6 +145,7 @@ const InstructorsFilters = ({ fetchData, resetPagination }) => {
 InstructorsFilters.propTypes = {
   fetchData: PropTypes.func.isRequired,
   resetPagination: PropTypes.func.isRequired,
+  setFilters: PropTypes.func.isRequired,
 };
 
 export default InstructorsFilters;
diff --git a/src/features/Instructors/InstructorsFilters/reducer.jsx b/src/features/Instructors/InstructorsFilters/reducer.jsx
@@ -15,17 +15,15 @@ const reducer = (state, action) => {
           status: RequestStatus.LOADING,
         },
       };
-    case FETCH_COURSES_DATA_SUCCESS: {
-      const { results } = action.payload;
+    case FETCH_COURSES_DATA_SUCCESS:
       return {
         ...state,
         courses: {
           ...state.courses,
           status: RequestStatus.SUCCESS,
-          data: results,
+          data: action.payload,
         },
       };
-    }
     case FETCH_COURSES_DATA_FAILURE:
       return {
         ...state,

diff --git a/src/features/Instructors/InstructorsPage/index.jsx b/src/features/Instructors/InstructorsPage/index.jsx
@@ -31,12 +31,13 @@ const initialState = {
 const InstructorsPage = () => {
   const [state, dispatch] = useReducer(reducer, initialState);
   const [currentPage, setCurrentPage] = useState(1);
+  const [filters, setFilters] = useState({});
 
-  const fetchData = async (filters) => {
+  const fetchData = async (filtersData) => {
     dispatch({ type: FETCH_INSTRUCTOR_DATA_REQUEST });
 
     try {
-      const response = camelCaseObject(await getInstructorData(currentPage, filters));
+      const response = camelCaseObject(await getInstructorData(currentPage, filtersData));
       dispatch({ type: FETCH_INSTRUCTOR_DATA_SUCCESS, payload: response.data });
     } catch (error) {
       dispatch({ type: FETCH_INSTRUCTOR_DATA_FAILURE, payload: error });
@@ -45,13 +46,12 @@ const InstructorsPage = () => {
   };
 
   useEffect(() => {
-    fetchData(); // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [currentPage]);
+    fetchData(filters); // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [currentPage, filters]);
 
   const handlePagination = (targetPage) => {
     setCurrentPage(targetPage);
     dispatch({ type: UPDATE_CURRENT_PAGE, payload: targetPage });
-    fetchData();
   };
 
   const resetPagination = () => {
@@ -65,7 +65,7 @@ const InstructorsPage = () => {
         <AddInstructors />
       </div>
       <div className="page-content-container">
-        <InstructorsFilters fetchData={fetchData} resetPagination={resetPagination} />
+        <InstructorsFilters fetchData={fetchData} resetPagination={resetPagination} setFilters={setFilters} />
         <InstructorsTable
           data={state.data}
           count={state.count}

diff --git a/src/features/Main/data/api.js b/src/features/Main/data/api.js
@@ -3,7 +3,7 @@ import { getConfig } from '@edx/frontend-platform';
 
 function getInstitutionName() {
   return getAuthenticatedHttpClient().get(
-    `${getConfig().COURSE_OPERATIONS_API_V2_BASE_URL}/institutions/`,
+    `${getConfig().COURSE_OPERATIONS_API_V2_BASE_URL}/institutions/?limit=false`,
   );
 }
 

diff --git a/src/features/Students/StudentsFilters/_test_/index.test.jsx b/src/features/Students/StudentsFilters/_test_/index.test.jsx
@@ -12,10 +12,15 @@ jest.mock('@edx/frontend-platform/logging', () => ({
 describe('StudentsFilters Component', () => {
   const fetchData = jest.fn();
   const resetPagination = jest.fn();
+  const mockSetFilters = jest.fn();
+
+  beforeEach(() => {
+    mockSetFilters.mockClear();
+  });
 
   test('renders input fields with placeholders', () => {
     const { getByText, getByPlaceholderText } = render(
-      <StudentsFilters fetchData={fetchData} resetPagination={resetPagination} />,
+      <StudentsFilters fetchData={fetchData} resetPagination={resetPagination} setFilters={mockSetFilters} />,
     );
 
     expect(getByPlaceholderText('Enter Student Name')).toBeInTheDocument();

diff --git a/src/features/Students/StudentsFilters/_test_/reducer.test.jsx b/src/features/Students/StudentsFilters/_test_/reducer.test.jsx
@@ -48,9 +48,7 @@ describe('Student filter reducers', () => {
     };
     const action = {
       type: FETCH_COURSES_DATA_SUCCESS,
-      payload: {
-        results: [],
-      },
+      payload: [],
     };
     expect(reducer(state, action)).toEqual(state);
   });

diff --git a/src/features/Students/StudentsFilters/index.jsx b/src/features/Students/StudentsFilters/index.jsx
@@ -33,7 +33,7 @@ const initialState = {
   },
 };
 
-const StudentsFilters = ({ resetPagination, fetchData }) => {
+const StudentsFilters = ({ resetPagination, fetchData, setFilters }) => {
   const stateInstitution = useContext(InstitutionContext);
   const [state, dispatch] = useReducer(reducer, initialState);
   const [courseOptions, setCourseOptions] = useState([]);
@@ -83,6 +83,7 @@ const StudentsFilters = ({ resetPagination, fetchData }) => {
     setClassSelected(null);
     setStatusSelected(null);
     setExamSelected(null);
+    setFilters({});
   };
 
   useEffect(() => {
@@ -113,6 +114,7 @@ const StudentsFilters = ({ resetPagination, fetchData }) => {
     const form = e.target;
     const formData = new FormData(form);
     const formJson = Object.fromEntries(formData.entries());
+    setFilters(formJson);
     try {
       fetchData(formJson);
     } catch (error) {
@@ -222,6 +224,7 @@ const StudentsFilters = ({ resetPagination, fetchData }) => {
 StudentsFilters.propTypes = {
   fetchData: PropTypes.func.isRequired,
   resetPagination: PropTypes.func.isRequired,
+  setFilters: PropTypes.func.isRequired,
 };
 
 export default StudentsFilters;
diff --git a/src/features/Students/StudentsFilters/reducer.jsx b/src/features/Students/StudentsFilters/reducer.jsx
@@ -18,17 +18,15 @@ const reducer = (state, action) => {
           status: RequestStatus.LOADING,
         },
       };
-    case FETCH_COURSES_DATA_SUCCESS: {
-      const { results } = action.payload;
+    case FETCH_COURSES_DATA_SUCCESS:
       return {
         ...state,
         courses: {
           ...state.courses,
           status: RequestStatus.SUCCESS,
-          data: results,
+          data: action.payload,
         },
       };
-    }
     case FETCH_COURSES_DATA_FAILURE:
       return {
         ...state,

diff --git a/src/features/Students/StudentsPage/index.jsx b/src/features/Students/StudentsPage/index.jsx
@@ -30,12 +30,13 @@ const initialState = {
 const StudentsPage = () => {
   const [state, dispatch] = useReducer(reducer, initialState);
   const [currentPage, setCurrentPage] = useState(1);
+  const [filters, setFilters] = useState({});
 
-  const fetchData = async (filters) => {
+  const fetchData = async (filtersData) => {
     dispatch({ type: FETCH_STUDENTS_DATA_REQUEST });
 
     try {
-      const response = camelCaseObject(await getStudentbyInstitutionAdmin(currentPage, filters));
+      const response = camelCaseObject(await getStudentbyInstitutionAdmin(currentPage, filtersData));
       dispatch({ type: FETCH_STUDENTS_DATA_SUCCESS, payload: response.data });
     } catch (error) {
       dispatch({ type: FETCH_STUDENTS_DATA_FAILURE, payload: error });
@@ -44,8 +45,8 @@ const StudentsPage = () => {
   };
 
   useEffect(() => {
-    fetchData(); // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [currentPage]);
+    fetchData(filters); // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [currentPage, filters]);
 
   const resetPagination = () => {
     setCurrentPage(1);
@@ -54,14 +55,13 @@ const StudentsPage = () => {
   const handlePagination = (targetPage) => {
     setCurrentPage(targetPage);
     dispatch({ type: UPDATE_CURRENT_PAGE, payload: targetPage });
-    fetchData();
   };
 
   return (
     <Container size="xl">
       <h1>Students</h1>
       <div className="page-content-container">
-        <StudentsFilters fetchData={fetchData} resetPagination={resetPagination} />
+        <StudentsFilters fetchData={fetchData} resetPagination={resetPagination} setFilters={setFilters} />
         <StudentsTable
           data={state.data}
           count={state.count}