Update wording on industry_user access request pages

bc_obps/registration/fixtures/mock/user_operator.json

@@ -26,7 +26,7 @@
   {
     "model": "registration.useroperator",
     "fields": {
-      "user": "279c80cf57814c28872740a133d17c0d",
+      "user": "00000000-0000-0000-0000-000000000002",
       "operator": "4242ea9d-b917-4129-93c2-db00b7451051",
       "role": "pending",
       "status": "Pending",
@@ -347,18 +347,6 @@
       "user_friendly_id": 29
     }
   },
-  {
-    "model": "registration.useroperator",
-    "fields": {
-      "user": "00000000-0000-0000-0000-000000000029",
-      "operator": "7e8b72dc-4196-427f-a553-7879748139e1",
-      "role": "admin",
-      "status": "Approved",
-      "verified_at": "2024-02-26 06:24:57.293242-08",
-      "verified_by": "58f255ed-8d46-44ee-b2fe-9f8d3d92c684",
-      "user_friendly_id": 30
-    }
-  },
   {
     "model": "registration.useroperator",
     "fields": {

bciers/apps/administration-e2e/tests/workflows/industry_user/select-operator-with-beforeAll.spec.ts

@@ -130,7 +130,7 @@ test.describe("Test select operator paths with beforeAll", () => {
     // 🔍 Assert operator confirmation message
     await selectOperatorPage.msgConfirmOperatorIsVisible();
     // 👉 Action route return
-    await selectOperatorPage.routeReturn();
+    await selectOperatorPage.routeBack();
     // 🔍 Assert operator confirmation message
     await selectOperatorPage.msgSelectOpertorIsVisible();
   });

bciers/apps/administration-e2e/utils/enums.ts

@@ -84,13 +84,16 @@ export enum SelectOperatorFormField {
 
 // 💬 Operator messages
 export enum MessageTextOperatorSelect {
-  NO_ACCESS = "Looks like you do not have access to",
+  NO_ACCESS = "You do not currently have access to",
   NO_ADMIN = "does not have Administrator access set up",
   OPERATOR_CONFIRM = "Kindly confirm if this is the operator that you represent.",
+  // The actual text for REQUEST_ACCESS_CONFIRMED is "Your access request has been sent to the Administrator(s) of Existing Operator 14 Legal Name for review."
+  // However, this was repeatedly failing - I suspect the (s) was causing issues with the regex expression used for searching.
+  // This shortened string works consistently.
   REQUEST_ACCESS_CONFIRMED = "Your access request has been sent to the Administrator",
-  REQUEST_ACCESS_ADMIN_CONFIRMED = "Your access request for Operator 1 Legal Name as its Operation Representative has been received and will be reviewed.",
+  REQUEST_ACCESS_ADMIN_CONFIRMED = "Your access request as administrator for Operator 1 Legal Name has been received by ministry staff and will be reviewed shortly.",
   REQUEST_ACCESS_DECLINED = "Your access request was declined by an Administrator of Existing Operator 2 Legal Name", //"Your access request was declined by an Administrator",
-  REQUEST_ACCESS_ADMIN_DECLINED = "Your Administrator access request to be the Operation Representative of New Operator 13 Legal Name was declined",
+  REQUEST_ACCESS_ADMIN_DECLINED = "Your administrator access request for New Operator 13 Legal Name was declined",
   SELECT_OPERATOR = "Which operator would you like to log in to?",
   SEARCH_BY_CANADA_REVENUE = "Search by Canada Revenue Agency (CRA) Business Number",
   SEARCH_BY_LEGAL_NAME = "Search by Canada Revenue Agency (CRA) Business Number",

bciers/apps/administration/app/components/buttons/RequestAccessButton.tsx

@@ -21,8 +21,8 @@ export default function RequestAccessButton({
   const [errorList, setErrorList] = useState([] as any[]);
 
   const label = isAdminRequest
-    ? "Request Administrator Access"
-    : "Request Access";
+    ? "Request administrator access"
+    : "Request access";
 
   const endpointUrl = `registration/operators/${operatorId}/${
     isAdminRequest ? "request-admin-access" : "request-access"

bciers/apps/administration/app/components/userOperators/SelectOperatorConfirmForm.tsx

@@ -10,7 +10,7 @@ import {
   TableRow,
 } from "@mui/material";
 import { useState } from "react";
-import WarningIcon from "@mui/icons-material/Warning";
+import WarningRoundedIcon from "@mui/icons-material/WarningRounded";
 import RequestAccessButton from "../buttons/RequestAccessButton";
 import Link from "next/link";
 import { BC_GOV_LINKS_COLOR, DARK_GREY_BG_COLOR } from "@bciers/styles/colors";
@@ -31,13 +31,12 @@ export default function SelectOperatorConfirmForm({
   const operatorHasAdminJSX: JSX.Element = (
     <div data-testid="has-admin-message">
       <p>
-        Looks like you do not have access to <b>{operator.legal_name}</b>.
+        You do not currently have access to <b>{operator.legal_name}</b>.
       </p>
       <p>
-        An Operation Representative with Administrator access will need to
-        approve your access request.
+        Please request access below. An administrator will need to approve your
+        access request.
       </p>
-      <p>Please confirm below if you would like to submit an access request.</p>
       <RequestAccessButton
         operatorId={operator.id}
         operatorName={operator.legal_name}
@@ -48,16 +47,20 @@ export default function SelectOperatorConfirmForm({
   const operatorHasNoAdmin: JSX.Element = (
     <div data-testid="has-no-admin-message">
       <p>
-        Looks like operator <b>{operator.legal_name}</b> does not have
-        Administrator access set up.
+        The operator <b>{operator.legal_name}</b> does not have an administrator
+        yet.
       </p>
       <p>
-        Would you like to request Administrator access as an Operation
-        Representative?
+        Request administrator access if you would like to be the administrator
+        for this
+        <br />
+        operator. Ministry staff will review your request.
       </p>
       <p>
-        Please note that you will be responsible for approving any additional
-        users requesting access to the operator.
+        As an administrator, you can approve any additional users requesting
+        access to
+        <br />
+        the operator and assign additional administrators.
       </p>
       <RequestAccessButton
         operatorId={operator.id}
@@ -68,17 +71,17 @@ export default function SelectOperatorConfirmForm({
   );
 
   return (
-    <section className="text-center my-auto text-2xl flex flex-col gap-3">
+    <section className="text-center my-auto flex flex-col gap-3">
       {hasConfirmedOperator ? (
         <>
           <span>
-            <WarningIcon sx={{ color: "#ff0e0e", fontSize: 50 }} />
+            <WarningRoundedIcon sx={{ color: "#fcba19", fontSize: "40px" }} />
           </span>
           <div>{hasAdmin ? operatorHasAdminJSX : operatorHasNoAdmin}</div>
           <Link
             href="#"
             className="underline hover:no-underline"
-            style={{ color: BC_GOV_LINKS_COLOR }}
+            style={{ color: BC_GOV_LINKS_COLOR, fontSize: "16px" }}
             onClick={() => setHasConfirmedOperator(false)}
           >
             Go Back
@@ -139,7 +142,7 @@ export default function SelectOperatorConfirmForm({
               type="button"
               onClick={() => setHasConfirmedOperator(true)}
             >
-              Yes, this is my operator.
+              Yes this is my operator
             </Button>
             <span className="text-sm">
               This is not my operator.{" "}
@@ -149,7 +152,7 @@ export default function SelectOperatorConfirmForm({
                 style={{ color: BC_GOV_LINKS_COLOR }}
                 onClick={() => setHasConfirmedOperator(false)}
               >
-                Return.
+                Go back
               </Link>
             </span>
           </div>

bciers/apps/administration/app/components/userOperators/SelectOperatorConfirmPage.tsx

@@ -1,4 +1,4 @@
-import CancelIcon from "@mui/icons-material/Cancel";
+import WarningIcon from "@mui/icons-material/Warning";
 import Link from "next/link";
 import { notFound } from "next/navigation";
 import { BC_GOV_LINKS_COLOR } from "@bciers/styles/colors";
@@ -37,12 +37,12 @@ export default async function SelectOperatorConfirmPage({
       const declinedNoAdminJSX: JSX.Element = (
         <div data-testid="access-declined-no-admin-message">
           <p>
-            Your Administrator access request to be the Operation Representative
-            of <b>{(operator as Operator).legal_name}</b> was declined.
+            Your administrator access request for{" "}
+            <b>{(operator as Operator).legal_name}</b> was declined.
           </p>
           <p className="text-center">
             If you believe this is an error and you should be granted access,
-            please email us at <br />
+            please email us at{" "}
             <a
               href="mailto:GHGRegulator@gov.bc.ca"
               className="text-black font-bold no-underline"
@@ -53,9 +53,9 @@ export default async function SelectOperatorConfirmPage({
         </div>
       );
       return (
-        <section className="text-center my-auto text-2xl flex flex-col gap-3">
+        <section className="text-center my-auto flex flex-col gap-3">
           <span>
-            <CancelIcon sx={{ color: "#FF0000", fontSize: 50 }} />
+            <WarningIcon sx={{ color: "#D8292F", fontSize: 50 }} />
           </span>
           {hasAdmin ? declinedHasAdminJSX : declinedNoAdminJSX}
           <span className="text-sm">

bciers/apps/administration/app/components/userOperators/SelectOperatorReceivedPage.tsx

@@ -1,4 +1,4 @@
-import AccessTimeIcon from "@mui/icons-material/AccessTime";
+import AccessTimeFilledIcon from "@mui/icons-material/AccessTimeFilled";
 
 import { notFound } from "next/navigation";
 import { Operator } from "../userOperators/types";
@@ -22,13 +22,16 @@ export default async function SelectOperatorReceivedPage({
       throw new Error("Failed to retrieve operator information.");
     }
     const adminRequestJSX: JSX.Element = (
-      <>
-        <p>Once approved, you will receive an email.</p>
+      <div style={{ fontSize: "16px" }}>
+        <p>
+          Your access request as administrator for <b>{operator.legal_name}</b>{" "}
+          has been received by ministry staff and will be reviewed shortly.
+        </p>
         <p>
-          You can then log back in using your Business BCeID with Administrator
-          access.
+          Once approved, you will receive a confirmation email. You can then log
+          back in using your Business BCeID.
         </p>
-      </>
+      </div>
     );
 
     const addOperatorJSX: JSX.Element = (
@@ -60,20 +63,13 @@ export default async function SelectOperatorReceivedPage({
     else if (hasAdmin) content = requestSubsequentAccessJSX;
     else if (step === "request-access")
       content = (
-        <div data-testid="access-request-message">
-          <p>
-            Your access request for <b>{operator.legal_name}</b> as its
-            Operation Representative has been received and will be reviewed.
-          </p>
-
-          {adminRequestJSX}
-        </div>
+        <div data-testid="access-request-message">{adminRequestJSX}</div>
       );
 
     return (
       <section className="text-center my-auto text-2xl flex flex-col gap-3">
         <span>
-          <AccessTimeIcon sx={{ color: "#FFCC00", fontSize: 50 }} />
+          <AccessTimeFilledIcon sx={{ color: "#FFCC00", fontSize: 50 }} />
         </span>
         {content}
       </section>

bciers/apps/administration/tests/components/buttons/RequestAccessButton.test.tsx

@@ -25,21 +25,21 @@ describe("RequestAccessButton", () => {
       />,
     );
     expect(
-      screen.getByRole("button", { name: "Request Administrator Access" }),
+      screen.getByRole("button", { name: "Request administrator access" }),
     ).toBeInTheDocument();
   });
 
   it("renders the button with correct label for non-admin request", () => {
     render(<RequestAccessButton operatorId={1} operatorName="Test Operator" />);
     expect(
-      screen.getByRole("button", { name: "Request Access" }),
+      screen.getByRole("button", { name: "Request access" }),
     ).toBeInTheDocument();
   });
 
   it("calls actionHandler and redirects on successful access request", async () => {
     actionHandler.mockResolvedValueOnce({});
     render(<RequestAccessButton operatorId={1} operatorName="Test Operator" />);
-    fireEvent.click(screen.getByRole("button", { name: "Request Access" }));
+    fireEvent.click(screen.getByRole("button", { name: "Request access" }));
 
     await waitFor(() => {
       expect(actionHandler).toHaveBeenCalledWith(
@@ -54,7 +54,7 @@ describe("RequestAccessButton", () => {
     actionHandler.mockResolvedValueOnce({ error: "Access request failed" });
 
     render(<RequestAccessButton operatorId={1} operatorName="Test Operator" />);
-    fireEvent.click(screen.getByRole("button", { name: "Request Access" }));
+    fireEvent.click(screen.getByRole("button", { name: "Request access" }));
 
     await waitFor(() => {
       expect(actionHandler).toHaveBeenCalledWith(

bciers/apps/administration/tests/components/userOperators/SelectOperatorConfirmForm.test.tsx

@@ -52,7 +52,7 @@ describe("Select Operator Confirm Form", () => {
 
     expectButton("Yes this is my operator");
     expect(screen.getByText(/This is not my operator./)).toBeInTheDocument();
-    expectLink("Return.", "/select-operator");
+    expectLink("Go back", "/select-operator");
   });
   it("confirms the operator with admin when confirm button is clicked", async () => {
     render(
@@ -61,15 +61,15 @@ describe("Select Operator Confirm Form", () => {
     await userEvent.click(
       screen.getByRole("button", { name: /Yes this is my operator/i }),
     );
-    expectIcon("WarningIcon", {
-      color: "#FF0E0E",
-      fontSize: "50px",
+    expectIcon("WarningRoundedIcon", {
+      color: "#FCBA19",
+      fontSize: "40px",
     });
     expectMessage(
       "has-admin-message",
-      `Looks like you do not have access to ${operatorJSON.legal_name}.An Operation Representative with Administrator access will need to approve your access request.Please confirm below if you would like to submit an access request.Request Access`,
+      `You do not currently have access to ${operatorJSON.legal_name}.Please request access below. An administrator will need to approve your access request.Request access`,
     );
-    expectButton("Request Access");
+    expectButton("Request access");
     expectLink("Go Back", "#");
   });
   it("confirms the operator with no admin when confirm button is clicked", async () => {
@@ -79,15 +79,15 @@ describe("Select Operator Confirm Form", () => {
     await userEvent.click(
       screen.getByRole("button", { name: /Yes this is my operator/i }),
     );
-    expectIcon("WarningIcon", {
-      color: "#FF0E0E",
-      fontSize: "50px",
+    expectIcon("WarningRoundedIcon", {
+      color: "#FCBA19",
+      fontSize: "40px",
     });
     expectMessage(
       "has-no-admin-message",
-      `Looks like operator ${operatorJSON.legal_name} does not have Administrator access set up.Would you like to request Administrator access as an Operation Representative?Please note that you will be responsible for approving any additional users requesting access to the operator.Request Administrator Access`,
+      `The operator ${operatorJSON.legal_name} does not have an administrator yet.Request administrator access if you would like to be the administrator for thisoperator. Ministry staff will review your request.As an administrator, you can approve any additional users requesting access tothe operator and assign additional administrators.Request administrator access`,
     );
-    expectButton("Request Administrator Access");
+    expectButton("Request administrator access");
     expectLink("Go Back", "#");
   });
 });

bciers/apps/administration/tests/components/userOperators/SelectOperatorConfirmPage.test.tsx

@@ -44,7 +44,7 @@ describe("Select Operator Confirm Page", () => {
   it("renders message for access declined, has admin", async () => {
     mockOperatorState(true, true);
     await renderSelectOperatorConfirmPage();
-    expectIcon("CancelIcon");
+    expectIcon("WarningIcon", { color: "#D8292F" });
     expectMessage(
       "access-declined-admin-message",
       `Your access request was declined by an Administrator of ${operatorJSON.legal_name}If you believe this is an error and you should be granted access, please contact the administrator of ${operatorJSON.legal_name}`,
@@ -54,10 +54,10 @@ describe("Select Operator Confirm Page", () => {
   it("renders message for access declined, has no admin", async () => {
     mockOperatorState(false, true);
     await renderSelectOperatorConfirmPage();
-    expectIcon("CancelIcon");
+    expectIcon("WarningIcon", { color: "#D8292F" });
     expectMessage(
       "access-declined-no-admin-message",
-      `Your Administrator access request to be the Operation Representative of ${operatorJSON.legal_name} was declined.If you believe this is an error and you should be granted access, please email us at GHGRegulator@gov.bc.ca`,
+      `Your administrator access request for ${operatorJSON.legal_name} was declined.If you believe this is an error and you should be granted access, please email us at GHGRegulator@gov.bc.ca`,
     );
     expectLink("Select another operator", "/select-operator");
   });

bciers/apps/administration/tests/components/userOperators/SelectOperatorReceivedPage.test.tsx

@@ -25,19 +25,19 @@ describe("Select Operator Received Page", () => {
   it("renders the selected operator received page, admin access request correctly", async () => {
     mockOperatorState(false);
     render(await SelectOperatorReceivedPage({ step: "request-access", id }));
-    expectIcon("AccessTimeIcon", {
+    expectIcon("AccessTimeFilledIcon", {
       color: "#FFCC00",
       fontSize: "50px",
     });
     expectMessage(
       "access-request-message",
-      `Your access request for ${operatorJSON.legal_name} as its Operation Representative has been received and will be reviewed.Once approved, you will receive an email.You can then log back in using your Business BCeID with Administrator access.`,
+      `Your access request as administrator for ${operatorJSON.legal_name} has been received by ministry staff and will be reviewed shortly.Once approved, you will receive a confirmation email. You can then log back in using your Business BCeID.`,
     );
   });
   it("renders the selected operator received page, subsequent access request correctly", async () => {
     mockOperatorState(true);
     render(await SelectOperatorReceivedPage({ step: "request-access", id }));
-    expectIcon("AccessTimeIcon", {
+    expectIcon("AccessTimeFilledIcon", {
       color: "#FFCC00",
       fontSize: "50px",
     });
@@ -49,13 +49,13 @@ describe("Select Operator Received Page", () => {
   it("renders the selected operator received page, add operator correctly", async () => {
     mockOperatorState(false);
     render(await SelectOperatorReceivedPage({ step: "add-operator", id }));
-    expectIcon("AccessTimeIcon", {
+    expectIcon("AccessTimeFilledIcon", {
       color: "#FFCC00",
       fontSize: "50px",
     });
     expectMessage(
       "add-operator-message",
-      `Your request to add ${operatorJSON.legal_name} and become its Operation Representative has been received and will be reviewed.Once approved, you will receive an email.You can then log back in using your Business BCeID with Administrator access.`,
+      `Your request to add ${operatorJSON.legal_name} and become its Operation Representative has been received and will be reviewed.Your access request as administrator for ${operatorJSON.legal_name} has been received by ministry staff and will be reviewed shortly.Once approved, you will receive a confirmation email. You can then log back in using your Business BCeID.`,
     );
   });
   it("renders error when getOperator fails", async () => {