From d519f775b5f6f66c5d5b023c16649b60584855fb Mon Sep 17 00:00:00 2001
From: acouch <acinternets@gmail.com>
Date: Fri, 10 Jan 2025 10:31:17 -0500
Subject: [PATCH] Move LoginModal to LoginModalButton

---
 .../{LoginModal.tsx => LoginButtonModal.tsx}          |  6 +++---
 frontend/src/components/user/UserControl.tsx          |  4 ++--
 frontend/src/i18n/messages/en/index.ts                |  2 +-
 ...{LoginModal.test.tsx => LoginButtonModal.test.tsx} | 11 ++++++++---
 4 files changed, 14 insertions(+), 9 deletions(-)
 rename frontend/src/components/{LoginModal.tsx => LoginButtonModal.tsx} (94%)
 rename frontend/tests/components/{LoginModal.test.tsx => LoginButtonModal.test.tsx} (83%)

diff --git a/frontend/src/components/LoginModal.tsx b/frontend/src/components/LoginButtonModal.tsx
similarity index 94%
rename from frontend/src/components/LoginModal.tsx
rename to frontend/src/components/LoginButtonModal.tsx
index 7d3649575..ae3ef0430 100644
--- a/frontend/src/components/LoginModal.tsx
+++ b/frontend/src/components/LoginButtonModal.tsx
@@ -11,14 +11,14 @@ import {
 
 import { USWDSIcon } from "src/components/USWDSIcon";
 
-const LOGIN_URL = "/api/auth/login";
+export const LOGIN_URL = "/api/auth/login";
 
-export const LoginModal = ({
+export const LoginButtonModal = ({
   navLoginLinkText,
 }: {
   navLoginLinkText: string;
 }) => {
-  const t = useTranslations("LoginModal");
+  const t = useTranslations("LoginButtonModal");
   const modalRef = useRef<ModalRef>(null);
 
   return (
diff --git a/frontend/src/components/user/UserControl.tsx b/frontend/src/components/user/UserControl.tsx
index d26113617..2a8d66a81 100644
--- a/frontend/src/components/user/UserControl.tsx
+++ b/frontend/src/components/user/UserControl.tsx
@@ -10,7 +10,7 @@ import {
   NavDropDownButton,
 } from "@trussworks/react-uswds";
 
-import { LoginModal } from "src/components/LoginModal";
+import { LoginButtonModal } from "src/components/LoginButtonModal";
 import { USWDSIcon } from "src/components/USWDSIcon";
 
 // used in three different places
@@ -116,7 +116,7 @@ export const UserControl = () => {
 
   return (
     <>
-      {!user?.token && <LoginModal navLoginLinkText={t("nav_link_login")} />}
+      {!user?.token && <LoginButtonModal navLoginLinkText={t("nav_link_login")} />}
       {!!user?.token && (
         <UserDropdown
           user={user}
diff --git a/frontend/src/i18n/messages/en/index.ts b/frontend/src/i18n/messages/en/index.ts
index d06c45fac..10a846be9 100644
--- a/frontend/src/i18n/messages/en/index.ts
+++ b/frontend/src/i18n/messages/en/index.ts
@@ -482,7 +482,7 @@ export const messages = {
     nav_link_logout: "Sign out",
     title: "Simpler.Grants.gov",
   },
-  LoginModal: {
+  LoginButtonModal: {
     title: "Sign in to Simpler.Grants.gov",
     help: "Simpler.Grants.gov uses Login.gov to verify your identity and manage your account securely. You don't need a separate username or password for this site.",
     description:
diff --git a/frontend/tests/components/LoginModal.test.tsx b/frontend/tests/components/LoginButtonModal.test.tsx
similarity index 83%
rename from frontend/tests/components/LoginModal.test.tsx
rename to frontend/tests/components/LoginButtonModal.test.tsx
index 591298767..4aad84f9e 100644
--- a/frontend/tests/components/LoginModal.test.tsx
+++ b/frontend/tests/components/LoginButtonModal.test.tsx
@@ -2,7 +2,7 @@ import userEvent from "@testing-library/user-event";
 import { render, screen } from "tests/react-utils";
 
 import Header from "src/components/Header";
-import { LoginModal } from "src/components/LoginModal";
+import { LOGIN_URL, LoginButtonModal } from "src/components/LoginButtonModal";
 
 const usePathnameMock = jest.fn().mockReturnValue("/fakepath");
 
@@ -16,13 +16,18 @@ jest.mock("src/hooks/useFeatureFlags", () => ({
   }),
 }));
 
-describe("LoginModal", () => {
+describe("LoginButtonModal", () => {
   it("renders", () => {
-    render(<LoginModal navLoginLinkText="Sign in" />);
+    render(<LoginButtonModal navLoginLinkText="Sign in" />);
     const loginGovLink = screen.getByRole("link", {
       name: /Sign in with Login.gov/i,
     });
     expect(loginGovLink).toBeInTheDocument();
+    expect(loginGovLink).toHaveAttribute(
+      "href",
+      LOGIN_URL,
+    );
+
     const modalTitle = screen.getByRole("heading", { level: 2 });
     expect(modalTitle).toHaveTextContent("Sign in to Simpler.Grants.gov");
   });