Fix: [AEA-4755] - PUT /selectedRole (#384)

## Summary

🎫 [AEA-4755](https://nhsd-jira.digital.nhs.uk/browse/AEA-4755) PUT
/selectedRole
🧪 Regression Tests:
NHSDigital/electronic-prescription-service-api-regression-tests#237
👤 Audrey Ricker: 555043304334
`CONFIDENTIAL: PERSONAL PATIENT DATA accessed by RICKER, Audrey -
General Medical Practitioner - NO_ORG_NAME (ODS: N82668)`
👤 Curtis Rogers: 555043308597
`CONFIDENTIAL: PERSONAL PATIENT DATA accessed by ROGERS, Curtis -
Registration Authority Manager - NO_ORG_NAME (ODS: A21293)`

- Routine Change



### Details of the Fix

- If the role with access matches `selectedRoleId`, it is added to the
`currently_selected_role` but not to the `roles_with_access` array. Move
the previously selected role back into rolesWithAccess, but only if it
was set.

- The RBAC (Role-Based Access Control) User Profile Banner follows these
patterns:
   - Standard user:
CONFIDENTIAL: PERSONAL PATIENT DATA accessed by LAST NAME, First Name -
RBAC Role - Site Name (ODS: ODS)
   - Locum user:
CONFIDENTIAL: PERSONAL PATIENT DATA accessed by LAST NAME, First Name -
RBAC Role - Locum pharmacy (ODS: FFFFF) - Site Name (ODS: ODS Code)

- The `confirmButtonText` contains the text: "Continue to find a
prescription"

---------

Co-authored-by: Sean Steberis <[email protected]>

Author: kris-szlapa

package-lock.json

@@ -16,8 +16,8 @@ jest.mock("@/constants/ui-strings/CardStrings", () => {
         "You are currently logged in at GREENE'S PHARMACY (ODS: FG419) with Health Professional Access Role.",
     },
     confirmButton: {
-      text: "Confirm and continue to find a prescription",
-      link: "tracker-presc-no",
+      text: "Continue to find a prescription",
+      link: "searchforaprescription",
     },
     alternativeMessage: "Alternatively, you can choose a new role below.",
     organisation: "Organisation",
@@ -280,4 +280,58 @@ describe("ChangeRolePage", () => {
       expect(mockPush).toHaveBeenCalledWith("/searchforaprescription")
     })
   })
+
+  it("renders loading state when waiting for API response", async () => {
+    mockFetch.mockImplementation(() => new Promise(() => {}))
+    renderWithAuth()
+    expect(screen.getByText("Loading...")).toBeInTheDocument()
+  })
+
+  it("redirects when a single role is available", async () => {
+    (useRouter as jest.Mock).mockReturnValue({
+      push: jest.fn()
+    })
+
+    const mockUserInfo = {
+      roles_with_access: [{
+        role_name: "Pharmacist",
+        org_name: "Test Pharmacy",
+        org_code: "ORG123",
+        site_address: "123 Test St"
+      }],
+      roles_without_access: []
+    }
+
+    mockFetch.mockResolvedValue({
+      status: 200,
+      json: async () => ({userInfo: mockUserInfo})
+    })
+
+    renderWithAuth({isSignedIn: true, idToken: {toString: jest.fn().mockReturnValue("mock-id-token")}})
+
+    await waitFor(() => {
+      expect(useRouter().push).toHaveBeenCalledWith("/searchforaprescription")
+    })
+  })
+
+  it("does not fetch user roles if user is not signed in", async () => {
+    const mockFetch = jest.fn()
+    global.fetch = mockFetch
+
+    renderWithAuth({isSignedIn: false}) // Simulating a user who is not signed in
+
+    expect(mockFetch).not.toHaveBeenCalled()
+  })
+
+  it("displays an error when the API request fails", async () => {
+    mockFetch.mockRejectedValue(new Error("Failed to fetch user roles"))
+
+    renderWithAuth({isSignedIn: true, idToken: {toString: jest.fn().mockReturnValue("mock-id-token")}})
+
+    await waitFor(() => {
+      const errorSummary = screen.getByRole("heading", {name: "Error during role selection"})
+      expect(errorSummary).toBeInTheDocument()
+      expect(screen.getByText("Failed to fetch CPT user info")).toBeInTheDocument()
+    })
+  })
 })

packages/cpt-ui/__tests__/ChangeRolePage.test.tsx

@@ -1,8 +1,8 @@
 import "@testing-library/jest-dom"
-import { render, screen } from "@testing-library/react"
-import { useRouter } from "next/navigation"
+import {render, screen} from "@testing-library/react"
+import {useRouter} from "next/navigation"
 import React from "react"
-import { JWT } from "aws-amplify/auth"
+import {JWT} from "aws-amplify/auth"
 
 import RBACBanner from "@/components/RBACBanner"
 
@@ -19,10 +19,10 @@ jest.mock("@/constants/ui-strings/RBACBannerStrings", () => {
         LOCUM_NAME: "Locum pharmacy"
     }
 
-    return { RBAC_BANNER_STRINGS }
+    return {RBAC_BANNER_STRINGS}
 })
 
-const { RBAC_BANNER_STRINGS } = require("@/constants/ui-strings/RBACBannerStrings")
+const {RBAC_BANNER_STRINGS} = require("@/constants/ui-strings/RBACBannerStrings")
 
 // Mock `next/navigation`
 jest.mock("next/navigation", () => ({
@@ -46,8 +46,8 @@ jest.mock("@/context/AccessProvider", () => {
             org_name: "org name"
         },
         userDetails: {
-            given_name: "Jane",
-            family_name: "Doe"
+            given_name: "JaNe",
+            family_name: "DoE"
         },
         setUserDetails: jest.fn(),
         setSelectedRole: jest.fn(),
@@ -57,7 +57,7 @@ jest.mock("@/context/AccessProvider", () => {
     const useAccess = () => React.useContext(MockAccessContext)
 
     const __setMockContextValue = (newValue: any) => {
-        mockContextValue = { ...mockContextValue, ...newValue }
+        mockContextValue = {...mockContextValue, ...newValue}
         // Reassign the context’s defaultValue so subsequent consumers get new values
         MockAccessContext._currentValue = mockContextValue
         MockAccessContext._currentValue2 = mockContextValue
@@ -70,7 +70,7 @@ jest.mock("@/context/AccessProvider", () => {
         __setMockContextValue
     }
 })
-const { __setMockContextValue } = require("@/context/AccessProvider")
+const {__setMockContextValue} = require("@/context/AccessProvider")
 
 // Mock an AuthContext
 const AuthContext = React.createContext<any>(null)
@@ -90,7 +90,7 @@ const defaultAuthContext = {
 }
 
 export const renderWithAuth = (authOverrides = {}) => {
-    const authValue = { ...defaultAuthContext, ...authOverrides }
+    const authValue = {...defaultAuthContext, ...authOverrides}
 
     return render(
         <AuthContext.Provider value={authValue}>
@@ -112,7 +112,7 @@ describe("RBACBanner", () => {
                 org_name: "org name"
             },
             userDetails: {
-                family_name: "Doe",
+                family_name: "DoE",
                 given_name: "Jane"
             }
         })
@@ -145,7 +145,7 @@ describe("RBACBanner", () => {
         expect(bannerText).toBeInTheDocument()
 
         // Check that placeholders are properly replaced
-        const expectedText = `CONFIDENTIAL: PERSONAL PATIENT DATA accessed by Doe, Jane - Role Name - org name (ODS: deadbeef)`
+        const expectedText = `CONFIDENTIAL: PERSONAL PATIENT DATA accessed by DOE, Jane - Role Name - org name (ODS: deadbeef)`
         expect(bannerText).toHaveTextContent(expectedText)
     })
 
@@ -165,7 +165,7 @@ describe("RBACBanner", () => {
         const bannerText = screen.getByTestId("rbac-banner-text")
         // Locum pharmacy name should appear
         expect(bannerText).toHaveTextContent(
-            `CONFIDENTIAL: PERSONAL PATIENT DATA accessed by Doe, Jane - Role Name - Locum pharmacy (ODS: FFFFF)`
+            `CONFIDENTIAL: PERSONAL PATIENT DATA accessed by DOE, Jane - Role Name - Locum pharmacy (ODS: FFFFF)`
         )
     })
 
@@ -198,7 +198,25 @@ describe("RBACBanner", () => {
         const bannerText = screen.getByTestId("rbac-banner-text")
         // Notice fallback values: NO_ROLE_NAME, NO_ORG_NAME, NO_ODS_CODE
         expect(bannerText).toHaveTextContent(
-            `CONFIDENTIAL: PERSONAL PATIENT DATA accessed by Doe, Jane - NO_ROLE_NAME - NO_ORG_NAME (ODS: NO_ODS_CODE)`
+            `CONFIDENTIAL: PERSONAL PATIENT DATA accessed by DOE, Jane - NO_ROLE_NAME - NO_ORG_NAME (ODS: NO_ODS_CODE)`
+        )
+    })
+
+    it("should fallback to NO_ORG_NAME if org_name is missing", () => {
+        __setMockContextValue({
+            selectedRole: {
+                role_name: "Role Name",
+                role_id: "role-id",
+                org_code: "deadbeef"
+                // org_name is missing
+            }
+        })
+
+        renderWithAuth()
+
+        const bannerText = screen.getByTestId("rbac-banner-text")
+        expect(bannerText).toHaveTextContent(
+            `CONFIDENTIAL: PERSONAL PATIENT DATA accessed by DOE, Jane - Role Name - NO_ORG_NAME (ODS: deadbeef)`
         )
     })
 

packages/cpt-ui/__tests__/RBACBanner.test.tsx

@@ -20,8 +20,8 @@ jest.mock("@/constants/ui-strings/CardStrings", () => {
         "You are currently logged in at GREENE'S PHARMACY (ODS: FG419) with Health Professional Access Role.",
     },
     confirmButton: {
-      text: "Confirm and continue to find a prescription",
-      link: "tracker-presc-no",
+      text: "Continue to find a prescription",
+      link: "searchforaprescription",
     },
     alternativeMessage: "Alternatively, you can choose a new role below.",
     organisation: "Organisation",
@@ -321,4 +321,25 @@ describe("SelectYourRolePage", () => {
       expect(useRouter().push).toHaveBeenCalledWith("/searchforaprescription")
     })
   })
+
+  it("does not fetch user roles if user is not signed in", async () => {
+    const mockFetch = jest.fn()
+    global.fetch = mockFetch
+
+    renderWithAuth({isSignedIn: false}) // Simulating a user who is not signed in
+
+    expect(mockFetch).not.toHaveBeenCalled()
+  })
+
+  it("displays an error when the API request fails", async () => {
+    mockFetch.mockRejectedValue(new Error("Failed to fetch user roles"))
+
+    renderWithAuth({isSignedIn: true, idToken: {toString: jest.fn().mockReturnValue("mock-id-token")}})
+
+    await waitFor(() => {
+      const errorSummary = screen.getByRole("heading", {name: "Error during role selection"})
+      expect(errorSummary).toBeInTheDocument()
+      expect(screen.getByText("Failed to fetch CPT user info")).toBeInTheDocument()
+    })
+  })
 })

packages/cpt-ui/__tests__/SelectYourRolePage.test.tsx

@@ -15,7 +15,7 @@ jest.mock("@/constants/ui-strings/YourSelectedRoleStrings", () => {
         roleLabel: "Role",
         orgLabel: "Organisation",
         changeLinkText: "Change",
-        confirmButtonText: "Confirm and continue to find a prescription",
+        confirmButtonText: "Continue to find a prescription",
         noODSCode: "NO ODS CODE",
         noRoleName: "NO ROLE NAME",
         noOrgName: "NO ORG NAME"

packages/cpt-ui/__tests__/YourSelectedRole.test.tsx

@@ -1,7 +1,7 @@
 'use client'
-import React from "react";
+import React from "react"
 
-import { Button, Card, Container, Col, InsetText, Row } from "nhsuk-react-components";
+import {Button, Card, Container, Col, InsetText, Row} from "nhsuk-react-components"
 export default function Page() {
     return (
         <main className="nhsuk-main-wrapper">
@@ -26,7 +26,7 @@ export default function Page() {
                                     </p>
                                 </InsetText>
                                 <Button>
-                                    Confirm and continue to find a prescription
+                                    Continue to find a prescription
                                 </Button>
                                 <p>Alternatively, you can choose a new role below.</p>
 

packages/cpt-ui/app/confirmrole/page.tsx

@@ -1,54 +1,53 @@
 'use client'
-import React, { useContext, useEffect } from "react";
-import { Container } from "nhsuk-react-components"
-import Link from "next/link";
+import React, {useContext, useEffect} from "react"
+import {Container} from "nhsuk-react-components"
+import Link from "next/link"
 
-import { AuthContext } from "@/context/AuthProvider";
-import { useAccess } from "@/context/AccessProvider"
-import EpsSpinner from "@/components/EpsSpinner";
-import { EpsLogoutStrings } from "@/constants/ui-strings/EpsLogoutPageStrings";
+import {AuthContext} from "@/context/AuthProvider"
+import {useAccess} from "@/context/AccessProvider"
+import EpsSpinner from "@/components/EpsSpinner"
+import {EpsLogoutStrings} from "@/constants/ui-strings/EpsLogoutPageStrings"
 
 export default function LogoutPage() {
-
-    const auth = useContext(AuthContext);
-    const { clear } = useAccess();
+    const auth = useContext(AuthContext)
+    const {clear} = useAccess()
 
     // Log out on page load
     useEffect(() => {
         const signOut = async () => {
-            console.log("Signing out", auth);
+            console.log("Signing out", auth)
+
+            await auth?.cognitoSignOut()
 
-            await auth?.cognitoSignOut();
-            console.log("Signed out: ", auth);
+            // Ensure user details & roles are cleared from local storage
+            clear()
+            console.log("Signed out and cleared session data")
         }
 
         if (auth?.isSignedIn) {
-            signOut();
-            clear();
+            signOut()
         } else {
-            console.log("Cannot sign out - not signed in");
+            console.log("Cannot sign out - not signed in")
+            clear() // Clear data even if not signed in
         }
-    }, [auth, clear]);
+    }, [auth, clear])
 
     return (
         <main id="main-content" className="nhsuk-main-wrapper">
             <Container>
-                {auth?.isSignedIn ? (
+                {!auth?.isSignedIn ? (
                     <>
-                        <h1>{EpsLogoutStrings.loading}</h1>
-                        <EpsSpinner />
+                        <h1>{EpsLogoutStrings.title}</h1>
+                        <p>{EpsLogoutStrings.body}</p>
+                        <Link href="/login">{EpsLogoutStrings.login_link}</Link>
                     </>
                 ) : (
                     <>
-                        <h1>{EpsLogoutStrings.title}</h1>
-                        <div>{EpsLogoutStrings.body}</div>
-                        <p />
-                        <Link href="/login">
-                            {EpsLogoutStrings.login_link}
-                        </Link>
+                        <h1>{EpsLogoutStrings.loading}</h1>
+                        <EpsSpinner />
                     </>
                 )}
             </Container>
         </main>
-    );
+    )
 }

packages/cpt-ui/app/logout/page.tsx

@@ -133,12 +133,20 @@ export default function RoleSelectionPage({contentText}: RoleSelectionPageProps)
             const rolesWithAccess = userInfo.roles_with_access || []
             const rolesWithoutAccess = userInfo.roles_without_access || []
 
-            const selectedRole = userInfo?.currently_selected_role
-                ? {
-                    ...userInfo?.currently_selected_role,
-                    uuid: `selected_role_0`
-                }
-                : undefined
+            // Check if the user info object and currently_selected_role exist
+            const selectedRole =
+                userInfo?.currently_selected_role && Object.keys(userInfo.currently_selected_role).length > 0
+                    ? {
+                        // If currently_selected_role is not empty, spread its properties
+                        ...userInfo.currently_selected_role,
+                        // Add uuid only if the selected role is not an empty object
+                        uuid: `selected_role_0`
+                    }
+                    // If currently_selected_role is an empty object `{}`, set selectedRole to undefined
+                    : undefined
+
+            console.log("Selected role:", selectedRole)
+            setSelectedRole(selectedRole)
 
             // Populate the EPS card props
             setRolesWithAccess(
@@ -158,7 +166,6 @@ export default function RoleSelectionPage({contentText}: RoleSelectionPageProps)
                 }))
             )
 
-            setSelectedRole(selectedRole)
             setNoAccess(rolesWithAccess.length === 0)
             setSingleAccess(rolesWithAccess.length === 1)