Patient Details Modal tests

src/components/Modal/Modal.tsx

@@ -15,7 +15,11 @@ const Modal = (props: ModalProps) => {
           {props.header != null && (
             <div className={styles.ModalHeaderText}>{props.header}</div>
           )}
-          <div onClick={props.action} className={styles.ModalHeaderClose}>
+          <div
+            onClick={props.action}
+            className={styles.ModalHeaderClose}
+            data-testid="modal-close"
+          >
             <div className={styles.ModalCircle}>
               <Icon glyph="times" />
             </div>

src/pages/PassengersPage/components/PatientDetailsModal/__tests__/PatientDetailsModal.test.tsx

@@ -0,0 +1,32 @@
+import { createTestPassengerData } from "../../../../../util/test-data.util";
+import PatientDetailsModal from "../PatientDetailsModal";
+import { render, fireEvent } from "@testing-library/react";
+
+describe("PatientDetailsModal", () => {
+  const mockOnClose = jest.fn();
+  const mockPatient = createTestPassengerData();
+
+  it("renders patient details correctly", () => {
+    const { getByText } = render(
+      <PatientDetailsModal patient={mockPatient} onClose={mockOnClose} />,
+    );
+
+    expect(getByText("Gender")).toBeTruthy();
+    expect(getByText(mockPatient.fields.Gender)).toBeTruthy();
+    expect(getByText("DOB")).toBeTruthy();
+    expect(
+      getByText(mockPatient.fields["Date of Birth"].split("T")[0]),
+    ).toBeTruthy();
+    // Add similar checks for other fields
+  });
+
+  it("calls onClose when the modal action is triggered", () => {
+    const component = render(
+      <PatientDetailsModal patient={mockPatient} onClose={mockOnClose} />,
+    );
+
+    fireEvent.click(component.getByTestId("modal-close")); // Assuming the action triggers on a button click
+
+    expect(mockOnClose).toHaveBeenCalled();
+  });
+});