add tests

services/QuillLMS/client/app/bundles/Shared/components/shared/dataTableChip.tsx

@@ -8,7 +8,7 @@ interface DataTableChipProps {
   },
   label: string,
   link?: string,
-  onClick?: () => void
+  onClick?: (e: any) => void
 }
 
 export const DataTableChip = ({ color, icon, label, link, onClick }: DataTableChipProps) => {

services/QuillLMS/client/app/bundles/Teacher/components/assignment_flow/classroom_lessons.jsx

@@ -234,7 +234,6 @@ export default class ClassroomLessons extends React.Component {
   }
 
   render() {
-    console.log('classroom lessons component')
     const { empty, loaded, classrooms, lessons, selectedClassroomId, } = this.state
     if (empty) {
       return this.renderEmptyState();

services/QuillLMS/client/app/bundles/Teacher/components/assignment_flow/manage_units/__tests__/unit.test.tsx

@@ -0,0 +1,79 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import Unit from '../unit';
+
+const mockData = {
+  classroomActivities: new Map([
+    [
+      '1',
+      {
+        name: 'Activity 1',
+        completed: false,
+        started: false,
+        studentCount: 10,
+        ownedByCurrentUser: true,
+        ownerName: 'Teacher A',
+        activityId: 'a1',
+        classroom_unit_id: 'cu1',
+      },
+    ],
+    [
+      '2',
+      {
+        name: 'Activity 2',
+        completed: true,
+        started: true,
+        studentCount: 0,
+        ownedByCurrentUser: false,
+        ownerName: 'Teacher B',
+        activityId: 'a2',
+        classroom_unit_id: 'cu2',
+      },
+    ],
+  ]),
+  classrooms: ['Class 1', 'Class 2'],
+  num_students_assigned: 20,
+  unitName: 'Sample Unit',
+  unitId: 'unit1',
+};
+
+describe('Unit Component', () => {
+  it('renders the unit name and assigned information', () => {
+    render(<Unit data={mockData} />);
+
+    expect(screen.getByText('Sample Unit')).toBeInTheDocument();
+    expect(screen.getByText('Assigned to')).toBeInTheDocument();
+    expect(screen.getByText('20 Students')).toBeInTheDocument();
+    expect(screen.getByText('2 classes (Class 1, Class 2)')).toBeInTheDocument();
+  });
+
+  it('renders classroom activities as rows in the DataTable', () => {
+    render(<Unit data={mockData} />);
+
+    expect(screen.getByText('Activity 1')).toBeInTheDocument();
+    expect(screen.getByText('Activity 2')).toBeInTheDocument();
+  });
+
+  it('renders launch lesson options based on activity state', () => {
+    render(<Unit data={mockData} />);
+
+    const launchButtons = screen.getAllByText('Launch Lesson');
+    expect(launchButtons.length).toBeGreaterThan(0);
+
+    const viewReportButtons = screen.getAllByText('View Report');
+    expect(viewReportButtons.length).toBeGreaterThan(0);
+  });
+
+  it('renders the customize and download links', () => {
+    render(<Unit data={mockData} />);
+
+    const customizeIcons = screen.getAllByAltText('extra small pencil icon');
+    expect(customizeIcons[0]).toBeInTheDocument();
+    expect(customizeIcons[1]).toBeInTheDocument();
+
+    const downloadIcons = screen.getAllByAltText('extra small arrow down icon');
+    expect(downloadIcons[0]).toBeInTheDocument();
+    expect(downloadIcons[1]).toBeInTheDocument();
+  });
+});

services/QuillLMS/client/app/bundles/Teacher/components/assignment_flow/manage_units/unit.jsx → services/QuillLMS/client/app/bundles/Teacher/components/assignment_flow/manage_units/unit.tsx

@@ -2,7 +2,7 @@ import Pluralize from 'pluralize';
 import React from 'react';
 
 import PreviewOrLaunchModal from '../../shared/preview_or_launch_modal';
-import { DataTable, DataTableChip, EXTRA_SMALL_ICON_BASE_SRC, SMALL_ICON_BASE_SRC } from '../../../../Shared';
+import { DataTable, DataTableChip, EXTRA_SMALL_ICON_BASE_SRC } from '../../../../Shared';
 
 const headers = [
   {
@@ -60,7 +60,7 @@ export const Unit = ({ data }) => {
     unitId,
     unitName
   } = data
-  const [lessonActivityId, setLessonActivityId] = React.useState<string | number>(null)
+  const [lessonActivityId, setLessonActivityId] = React.useState<number>(null)
   const [showModal, setShowModal] = React.useState<boolean>(false)
 
   function assignedToText () {
@@ -181,7 +181,7 @@ export const Unit = ({ data }) => {
   function renderDownloadCell(id) {
     return(
       <a className="download-link focus-on-light" href={`/activities/${id}/supporting_info`} rel="noopener noreferrer" target="_blank">
-        <img alt="extra small pencil icon" src={`${EXTRA_SMALL_ICON_BASE_SRC}/arrow-down.svg`} />
+        <img alt="extra small arrow down icon" src={`${EXTRA_SMALL_ICON_BASE_SRC}/arrow-down.svg`} />
       </a>
     )
   }