PADV-927 feat: update students table

src/features/Students/StudentsTable/_test_/columns.test.jsx

@@ -5,40 +5,28 @@ describe('getColumns', () => {
     const columns = getColumns();
 
     expect(columns).toBeInstanceOf(Array);
-    expect(columns).toHaveLength(8);
+    expect(columns).toHaveLength(5);
 
     const [
       nameColumn,
-      courseNameColumn,
-      courseIdColumn,
+      emailColumn,
       classNameColumn,
       ClassIdColumn,
-      instructorsColumn,
-      statusColumn,
       examReadyColumn,
     ] = columns;
 
     expect(nameColumn).toHaveProperty('Header', 'Student');
     expect(nameColumn).toHaveProperty('accessor', 'learnerName');
 
-    expect(courseNameColumn).toHaveProperty('Header', 'Course');
-    expect(courseNameColumn).toHaveProperty('accessor', 'courseName');
-
-    expect(courseIdColumn).toHaveProperty('Header', 'Course Id');
-    expect(courseIdColumn).toHaveProperty('accessor', 'courseId');
+    expect(emailColumn).toHaveProperty('Header', 'Email');
+    expect(emailColumn).toHaveProperty('accessor', 'learnerEmail');
 
     expect(classNameColumn).toHaveProperty('Header', 'Class Name');
     expect(classNameColumn).toHaveProperty('accessor', 'className');
 
     expect(ClassIdColumn).toHaveProperty('Header', 'Class Id');
     expect(ClassIdColumn).toHaveProperty('accessor', 'classId');
 
-    expect(instructorsColumn).toHaveProperty('Header', 'Instructor');
-    expect(instructorsColumn).toHaveProperty('accessor', 'instructors');
-
-    expect(statusColumn).toHaveProperty('Header', 'Status');
-    expect(statusColumn).toHaveProperty('accessor', 'status');
-
     expect(examReadyColumn).toHaveProperty('Header', 'Exam Ready');
     expect(examReadyColumn).toHaveProperty('accessor', 'examReady');
   });

src/features/Students/StudentsTable/_test_/index.test.jsx

@@ -32,10 +32,7 @@ describe('Student Table', () => {
         courseName: 'course 1',
         classId: '1',
         className: 'class 1',
-        instructors: ['Instructor 1'],
         created: 'Fri, 25 Aug 2023 19:01:22 GMT',
-        firstAccess: 'Fri, 25 Aug 2023 19:01:23 GMT',
-        lastAccess: 'Fri, 25 Aug 2023 20:20:22 GMT',
         status: 'Active',
         examReady: true,
       },
@@ -46,10 +43,7 @@ describe('Student Table', () => {
         courseName: 'course 2',
         classId: '2',
         className: 'class 2',
-        instructors: ['Instructor 2'],
         created: 'Sat, 26 Aug 2023 19:01:22 GMT',
-        firstAccess: 'Sat, 26 Aug 2023 19:01:24 GMT',
-        lastAccess: 'Sat, 26 Aug 2023 21:22:22 GMT',
         status: 'Pending',
         examReady: null,
       },
@@ -67,15 +61,12 @@ describe('Student Table', () => {
     expect(component.container).toHaveTextContent('Student 1');
     expect(component.container).toHaveTextContent('Student 2');
 
-    expect(component.container).toHaveTextContent('course 1');
-    expect(component.container).toHaveTextContent('course 2');
+    expect(component.container).toHaveTextContent('[email protected]');
+    expect(component.container).toHaveTextContent('[email protected]');
 
     expect(component.container).toHaveTextContent('class 1');
     expect(component.container).toHaveTextContent('class 2');
 
-    expect(component.container).toHaveTextContent('Instructor 1');
-    expect(component.container).toHaveTextContent('Instructor 2');
-
     expect(component.container).toHaveTextContent('yes');
     expect(component.container).toHaveTextContent('no');
 

src/features/Students/StudentsTable/columns.jsx

@@ -1,19 +1,13 @@
 /* eslint-disable react/prop-types */
-import React from 'react';
-import { Badge } from 'react-paragon-topaz';
 
 const getColumns = () => [
   {
     Header: 'Student',
     accessor: 'learnerName',
   },
   {
-    Header: 'Course',
-    accessor: 'courseName',
-  },
-  {
-    Header: 'Course Id',
-    accessor: 'courseId',
+    Header: 'Email',
+    accessor: 'learnerEmail',
   },
   {
     Header: 'Class Name',
@@ -23,33 +17,6 @@ const getColumns = () => [
     Header: 'Class Id',
     accessor: 'classId',
   },
-  {
-    Header: 'Instructor',
-    accessor: 'instructors',
-    Cell: ({ row }) => (
-      <ul style={{ listStyleType: 'none', paddingLeft: 0 }}>
-        {row.values.instructors.map(instructor => <li key={instructor}>{instructor}</li>)}
-      </ul>
-    ),
-  },
-  {
-    Header: 'Status',
-    accessor: 'status',
-    Cell: ({ row }) => {
-      switch (row.values.status) {
-        case 'Active':
-          return <Badge variant="success" light>Active</Badge>;
-        case 'Inactive':
-          return <Badge variant="secondary" light>Inactive</Badge>;
-        case 'Expired':
-          return <Badge variant="danger" light>Expired</Badge>;
-        case 'Pending':
-          return <Badge variant="warning" light>Pending</Badge>;
-        default:
-          return null;
-      }
-    },
-  },
   {
     Header: 'Exam Ready',
     accessor: 'examReady',
@@ -58,6 +25,6 @@ const getColumns = () => [
 ];
 
 // We don't need to show ccxId column but we need it to use handleStudentsActions.
-const hideColumns = { hiddenColumns: ['classId', 'courseId'] };
+const hideColumns = { hiddenColumns: ['classId'] };
 
 export { hideColumns, getColumns };