Updating banner messages and adding tests for it

src/components/MyAccount/Settings/StatusBanner.test.tsx

@@ -0,0 +1,37 @@
+import { render, screen } from "@testing-library/react"
+import { StatusBanner } from "./StatusBanner"
+
+describe("Status banner", () => {
+  it("displays specific failure message", () => {
+    render(<StatusBanner status="failure" statusMessage="Specific failure" />)
+    expect(
+      screen.getByText(/Specific failure Please try again/)
+    ).toBeInTheDocument()
+    expect(screen.getByRole("link")).toHaveAttribute(
+      "href",
+      "https://www.nypl.org/get-help/contact-us"
+    )
+    expect(screen.getByRole("complementary")).toHaveAttribute(
+      "data-type",
+      "negative"
+    )
+  })
+
+  it("displays general failure message", () => {
+    render(<StatusBanner status="failure" statusMessage="" />)
+    expect(screen.getByText(/Your changes were not saved/)).toBeInTheDocument()
+    expect(screen.getByRole("complementary")).toHaveAttribute(
+      "data-type",
+      "negative"
+    )
+  })
+
+  it("displays success message", () => {
+    render(<StatusBanner status="success" statusMessage="" />)
+    expect(screen.getByText(/Your changes were saved/)).toBeInTheDocument()
+    expect(screen.getByRole("complementary")).toHaveAttribute(
+      "data-type",
+      "positive"
+    )
+  })
+})

src/components/MyAccount/Settings/UsernameForm.tsx

@@ -17,10 +17,8 @@ import AddButton from "./AddButton"
 import { BASE_URL } from "../../../config/constants"
 
 export const usernameStatusMessages = {
-  USERNAME_FAILURE:
-    "This username already exists. Please try a different username or contact us for assistance.",
-  FAILURE:
-    "Your changes could not be saved. Please try again or contact us for assistance. ",
+  USERNAME_FAILURE: "This username already exists.",
+  FAILURE: "Your changes could not be saved.",
   SUCCESS: "Your changes were saved.",
 }