CCM-8023: conditionally render cognito login form

NHSDigital · Feb 4, 2025 · bf40415 · bf40415
1 parent ae38680
commit bf40415
Show file tree

Hide file tree

Showing 5 changed files with 77 additions and 2 deletions.
diff --git a/infrastructure/terraform/components/app/amplify_app.tf b/infrastructure/terraform/components/app/amplify_app.tf
@@ -32,6 +32,7 @@ resource "aws_amplify_app" "main" {
     NOTIFY_ENVIRONMENT             = var.environment
     NOTIFY_DOMAIN_NAME             = local.root_domain_name
     NEXT_PUBLIC_DISABLE_CONTENT    = var.disable_content
+    NEXT_PUBLIC_ENABLE_COGNITO_IDP = var.enable_cognito_built_in_idp
     NEXT_PUBLIC_CIS2_PROVIDER_NAME = local.cis2_idp_name
   }
 }
diff --git a/scripts/generate-outputs.ts b/scripts/generate-outputs.ts
@@ -8,6 +8,7 @@ let userPoolClientId = process.env.NEXT_PUBLIC_USER_POOL_CLIENT_ID || '';
 let cognitoDomain = process.env.NEXT_PUBLIC_COGNITO_DOMAIN || '';
 let redirectDomain = process.env.NEXT_PUBLIC_REDIRECT_DOMAIN || '';
 let cis2ProviderName = process.env.NEXT_PUBLIC_CIS2_PROVIDER_NAME || '';
+let enableCognitoIdp = process.env.NEXT_PUBLIC_ENABLE_COGNITO_IDP || '';
 
 if (inputType === 'sandbox-output') {
   const outputsFileContent = JSON.parse(readFileSync('./sandbox_tf_outputs.json').toString());
@@ -17,6 +18,7 @@ if (inputType === 'sandbox-output') {
   cognitoDomain = outputsFileContent.cognito_domain.value;
   redirectDomain = outputsFileContent.redirect_domain.value;
   cis2ProviderName = outputsFileContent.cis2_provider_name.value;
+  enableCognitoIdp = 'true' // always enable cognito idp if we're using a sandbox backend
 } else if (inputType === 'env') {
   // do nothing
 } else {
@@ -30,6 +32,7 @@ NEXT_PUBLIC_USER_POOL_CLIENT_ID=${userPoolClientId}
 NEXT_PUBLIC_COGNITO_DOMAIN=${cognitoDomain}
 NEXT_PUBLIC_REDIRECT_DOMAIN=${redirectDomain}
 NEXT_PUBLIC_CIS2_PROVIDER_NAME=${cis2ProviderName}
+NEXT_PUBLIC_ENABLE_COGNITO_IDP=${enableCognitoIdp}
 `);
 
 const amplifyOutputs = {

diff --git a/src/__tests__/app/__snapshots__/page.test.tsx.snap b/src/__tests__/app/__snapshots__/page.test.tsx.snap
@@ -32,3 +32,39 @@ exports[`SignInPage renders 1`] = `
   </div>
 </DocumentFragment>
 `;
+
+exports[`SignInPage renders with cognito login form if env var switch is enabled 1`] = `
+<DocumentFragment>
+  <div
+    class="nhsuk-grid-row"
+  >
+    <div
+      class="nhsuk-grid-column-two-thirds"
+    >
+      <h1
+        class="nhsuk-heading-xl"
+      >
+        Sign in
+      </h1>
+      <div
+        class="nhsuk-u-padding-6 notify-content"
+      >
+        <h2
+          class="nhsuk-heading-m"
+        >
+          Sign in using an NHS account
+        </h2>
+        <button
+          data-testid="mock-cis2-button"
+          type="button"
+        >
+          Mock CIS2 Login Button
+        </button>
+      </div>
+    </div>
+  </div>
+  <div>
+    Placeholder Sign-in form
+  </div>
+</DocumentFragment>
+`;
diff --git a/src/__tests__/app/page.test.tsx b/src/__tests__/app/page.test.tsx
@@ -21,6 +21,10 @@ jest.mock('next/navigation', () => ({
   }),
 }));
 
+jest.mock('@aws-amplify/ui-react', () => ({
+  Authenticator: () => <div>Placeholder Sign-in form</div>,
+}));
+
 jest.mock('@/src/components/CIS2LoginButton/CIS2LoginButton', () => ({
   CIS2LoginButton: ({ onClick }: { onClick: () => void }) => (
     <button type='button' data-testid='mock-cis2-button' onClick={onClick}>
@@ -47,10 +51,26 @@ function getEventListener() {
 }
 
 describe('SignInPage', () => {
+  const originalCognitoIdpSetting = process.env.NEXT_PUBLIC_ENABLE_COGNITO_IDP;
+
   it('renders', async () => {
+    process.env.NEXT_PUBLIC_ENABLE_COGNITO_IDP = 'false';
+
+    const container = render(<SignInPage />);
+
+    expect(container.asFragment()).toMatchSnapshot();
+
+    process.env.NEXT_PUBLIC_ENABLE_COGNITO_IDP = originalCognitoIdpSetting;
+  });
+
+  it('renders with cognito login form if env var switch is enabled', () => {
+    process.env.NEXT_PUBLIC_ENABLE_COGNITO_IDP = 'true';
+
     const container = render(<SignInPage />);
 
     expect(container.asFragment()).toMatchSnapshot();
+
+    process.env.NEXT_PUBLIC_ENABLE_COGNITO_IDP = originalCognitoIdpSetting;
   });
 
   it('does federated sign in when clicking cis2 button', async () => {

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -5,8 +5,10 @@ import { redirect, RedirectType, useSearchParams } from 'next/navigation';
 import { Hub } from 'aws-amplify/utils';
 import { federatedSignIn, State } from '@/src/utils/federated-sign-in';
 import { CIS2LoginButton } from '@/src/components/CIS2LoginButton/CIS2LoginButton';
+import { Authenticator } from '@aws-amplify/ui-react';
+import { Redirect } from '../components/molecules/Redirect/Redirect';
 
-export default function Page() {
+function LoginPage() {
   const [customState, setCustomState] = useState<State>();
   const searchParams = useSearchParams();
 
@@ -28,7 +30,7 @@ export default function Page() {
   }, []);
 
   return (
-    <Suspense>
+    <>
       <div className='nhsuk-grid-row'>
         <div className='nhsuk-grid-column-two-thirds'>
           <h1 className='nhsuk-heading-xl'>Sign in</h1>
@@ -40,6 +42,19 @@ export default function Page() {
           </div>
         </div>
       </div>
+      {process.env.NEXT_PUBLIC_ENABLE_COGNITO_IDP === 'true' && (
+        <Authenticator variation='default' hideSignUp>
+          <Redirect />
+        </Authenticator>
+      )}
+    </>
+  );
+}
+
+export default function Page() {
+  return (
+    <Suspense>
+      <LoginPage />
     </Suspense>
   );
 }