feat(FN-3708): add tests for TodoModal lazy props

Adds test coverage for TodoModal's lazy-loaded prop handling, completing the second step of the FN-3708 test work.

Fusion-Task-Id: FN-3708

packages/dashboard/app/components/TodoModal.tsx

@@ -1,11 +1,11 @@
 import "./TodoModal.css";
-import { useEffect } from "react";
+import { Suspense, lazy, useEffect } from "react";
 import { ListChecks, X } from "lucide-react";
 import { useOverlayDismiss } from "../hooks/useOverlayDismiss";
 import { useMobileKeyboard } from "../hooks/useMobileKeyboard";
 import { useMobileScrollLock } from "../hooks/useMobileScrollLock";
 import { useViewportMode } from "./Header";
-import { TodoView } from "./TodoView";
+const TodoView = lazy(() => import("./TodoView").then((module) => ({ default: module.TodoView })));
 
 interface TodoModalProps {
   isOpen?: boolean;
@@ -61,13 +61,15 @@ export function TodoModal({ onClose, projectId, addToast, onPlanningMode }: Todo
         </div>
 
         <div className="todo-modal-body">
-          <TodoView
-            projectId={projectId}
-            addToast={addToast}
-            onPlanningMode={onPlanningMode}
-            onClose={onClose}
-            mobileKeyboardActive={isMobile && keyboardOpen}
-          />
+          <Suspense fallback={null}>
+            <TodoView
+              projectId={projectId}
+              addToast={addToast}
+              onPlanningMode={onPlanningMode}
+              onClose={onClose}
+              mobileKeyboardActive={isMobile && keyboardOpen}
+            />
+          </Suspense>
         </div>
       </div>
     </div>

packages/dashboard/app/components/__tests__/TodoModal.test.tsx

@@ -1,5 +1,5 @@
 import { describe, it, expect, vi, beforeEach } from "vitest";
-import { fireEvent, render, screen } from "@testing-library/react";
+import { fireEvent, render, screen, waitFor } from "@testing-library/react";
 import { TodoModal } from "../TodoModal";
 
 const mockTodoView = vi.fn();
@@ -64,13 +64,29 @@ describe("TodoModal", () => {
     expect(onClose).toHaveBeenCalledTimes(1);
   });
 
-  it("passes projectId and addToast through to TodoView", () => {
-    render(<TodoModal onClose={onClose} addToast={addToast} projectId="proj-1" />);
-
-    expect(screen.getByTestId("todo-view-content")).toBeInTheDocument();
-    expect(mockTodoView).toHaveBeenCalledWith(
-      expect.objectContaining({ projectId: "proj-1", addToast }),
+  it("passes expected props through the lazy-loaded TodoView", async () => {
+    const onPlanningMode = vi.fn();
+    render(
+      <TodoModal
+        onClose={onClose}
+        addToast={addToast}
+        projectId="proj-1"
+        onPlanningMode={onPlanningMode}
+      />,
     );
+
+    expect(await screen.findByTestId("todo-view-content")).toBeInTheDocument();
+    await waitFor(() => {
+      expect(mockTodoView).toHaveBeenCalledWith(
+        expect.objectContaining({
+          projectId: "proj-1",
+          addToast,
+          onPlanningMode,
+          onClose,
+          mobileKeyboardActive: false,
+        }),
+      );
+    });
   });
 
   describe("mobile keyboard behavior", () => {