test: add test for submission popup header

__tests__/components/popups/submission/_partials/Header.test.tsx

@@ -0,0 +1,28 @@
+import SubmissionPopup from "@/components/popups/submission/_partials/Header";
+import "@testing-library/jest-dom";
+import { render, screen, fireEvent } from "@testing-library/react";
+
+describe("SubmissionPopup", () => {
+  const mockOnClose = jest.fn();
+
+
+  it("renders the component with correct text", () => {
+    render(<SubmissionPopup onClose={mockOnClose} />);
+    expect(screen.getByText("communities.submission")).toBeInTheDocument();
+  });
+
+  it("Invokes the onClose function when the arrow icon is clicked", () => {
+    render(<SubmissionPopup onClose={mockOnClose} />);
+    const arrowButton = screen.getByTestId("arrow-button");
+    fireEvent.click(arrowButton);
+    expect(mockOnClose).toHaveBeenCalled();
+  });
+
+  it("Invokes the onClose function when the close button is clicked", () => {
+    render(<SubmissionPopup onClose={mockOnClose} />);
+    const closeButton = screen.getByRole("button");
+    fireEvent.click(closeButton);
+    expect(mockOnClose).toHaveBeenCalled();
+  });
+
+});

__tests__/components/popups/submission/index.test.tsx

@@ -0,0 +1,27 @@
+import SubmissionPopup from "@/components/popups/submission";
+import { renderWithRedux } from "@__mocks__/renderWithRedux";
+import "@testing-library/jest-dom";
+import { fireEvent, screen } from "@testing-library/react";
+describe("SubmissionPopup", () => {
+
+  const mockOnClose = jest.fn();
+
+  it("renders the popup when show is true", () => {
+    renderWithRedux(<SubmissionPopup show={true} onClose={mockOnClose} submissionId="123" />);
+    expect(screen.getByTestId("overlay")).toBeInTheDocument();
+    expect(screen.getByText("communities.submission")).toBeInTheDocument();
+    expect(screen.getByTestId("viewId")).toBeInTheDocument();
+  });
+
+  it("does not render the popup when show is false", () => {
+    renderWithRedux(<SubmissionPopup show={false} onClose={mockOnClose} submissionId="123" />);
+    expect(screen.queryByTestId("overlay")).not.toBeInTheDocument();
+  });
+
+  it("calls the onClose function when the close button is clicked", () => {
+    renderWithRedux(<SubmissionPopup show={true} onClose={mockOnClose} submissionId="123" />);
+    const closeButton = screen.getByTestId("overlay");
+    fireEvent.click(closeButton);
+    expect(mockOnClose).toHaveBeenCalled();
+  });
+});

src/components/popups/submission/_partials/Header.tsx

@@ -26,7 +26,7 @@ export default function SubmissionPopup({ onClose }: SubmissionPopup): ReactElem
   const { t } = useTranslation();
   return (
     <div className="flex justify-between items-center border-b border-solid border-gray-200">
-      <div className="text-left pl-5 flex items-center space-x-6 cursor-pointer" onClick={onClose}>
+      <div className="text-left pl-5 flex items-center space-x-6 cursor-pointer" onClick={onClose} data-testid="arrow-button">
         <ArrowLeftIcon className="block" />
         <span className="text-lg font-medium block">{t("communities.submission")}</span>
       </div>