feat: basic modal on landing page for OSI (#31)

* feat: basic modal on landing page for OSI

* fixup! feat: basic modal on landing page for OSI

js/components/home.tsx

@@ -1,12 +1,16 @@
+import { OperatorSignInModal } from "./operatorSignIn/operatorSignInModal";
 import { ReactElement } from "react";
 
 export const Home = (): ReactElement => {
   return (
-    <div className="text-3xl">
-      🪐
-      <span className="text-mbta-orange">O</span>
-      <span className="text-mbta-red">r</span>
-      <span className="text-mbta-blue">b</span>it
-    </div>
+    <>
+      <div className="text-3xl">
+        🪐
+        <span className="text-mbta-orange">O</span>
+        <span className="text-mbta-red">r</span>
+        <span className="text-mbta-blue">b</span>it
+      </div>
+      <OperatorSignInModal />
+    </>
   );
 };

js/components/operatorSignIn/operatorSignInModal.tsx

@@ -0,0 +1,19 @@
+import { Modal } from "../modal";
+import { OperatorSelection } from "./operatorSelection";
+import { ReactElement, useState } from "react";
+
+export const OperatorSignInModal = (): ReactElement => {
+  const [show, setShow] = useState<boolean>(true);
+
+  return (
+    <Modal
+      show={show}
+      title={<span className="text-lg font-bold">Fit for Duty Check</span>}
+      onClose={() => {
+        setShow(false);
+      }}
+    >
+      <OperatorSelection nfcSupported={true} />
+    </Modal>
+  );
+};

js/test/components/operatorSignIn/operatorSignInModal.test.tsx

@@ -0,0 +1,19 @@
+import { OperatorSignInModal } from "../../../components/operatorSignIn/operatorSignInModal";
+import { render } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+
+describe("OperatorSignInModal", () => {
+  test("shows badge tap message by default", () => {
+    const view = render(<OperatorSignInModal />);
+
+    expect(view.getByText(/waiting for badge tap/i)).toBeInTheDocument();
+  });
+
+  test("can close the modal", async () => {
+    const view = render(<OperatorSignInModal />);
+
+    await userEvent.click(view.getByRole("button"));
+
+    expect(view.queryByText(/fit for duty check/i)).not.toBeInTheDocument();
+  });
+});