diff --git a/pages/login-apioauth.page.test.tsx b/pages/login-apioauth.page.test.tsx
index 454ce9f1c..553ffcf7d 100644
--- a/pages/login-apioauth.page.test.tsx
+++ b/pages/login-apioauth.page.test.tsx
@@ -70,6 +70,7 @@ describe('Login - API_OAUTH', () => {
signInButtonText: 'Sign In with Third-party oAuth',
signInAuthProviderId: 'apioauth',
immediateSignIn: false,
+ isOkta: false,
});
expect(redirect).toBeUndefined();
});
@@ -85,6 +86,7 @@ describe('Login - API_OAUTH', () => {
signInButtonText: 'Sign In with Third-party oAuth',
signInAuthProviderId: 'apioauth',
immediateSignIn: true,
+ isOkta: false,
});
expect(redirect).toBeUndefined();
expect(setHeaderMock).toHaveBeenCalledWith(
@@ -121,4 +123,19 @@ describe('Login - API_OAUTH', () => {
expect(signIn).toHaveBeenCalledWith('apioauth');
});
});
+
+ it('does not render create account help text', () => {
+ const { queryByText } = render(
+ ,
+ );
+
+ expect(queryByText(/Don't have an Okta account\?/)).not.toBeInTheDocument();
+ });
});
diff --git a/pages/login.page.test.tsx b/pages/login.page.test.tsx
index 74e25ff4b..b66a9ec1b 100644
--- a/pages/login.page.test.tsx
+++ b/pages/login.page.test.tsx
@@ -89,6 +89,7 @@ describe('Login - OKTA', () => {
signInButtonText: 'Sign In',
signInAuthProviderId: 'okta',
immediateSignIn: false,
+ isOkta: true,
});
expect(redirect).toBeUndefined();
});
@@ -108,6 +109,7 @@ describe('Login - OKTA', () => {
signInButtonText: 'Sign In',
signInAuthProviderId: 'okta',
immediateSignIn: false,
+ isOkta: true,
});
expect(redirect).toBeUndefined();
});
@@ -123,6 +125,7 @@ describe('Login - OKTA', () => {
signInButtonText: 'Sign In',
signInAuthProviderId: 'okta',
immediateSignIn: true,
+ isOkta: true,
});
expect(redirect).toBeUndefined();
expect(setHeaderMock).toHaveBeenCalledWith(
@@ -177,4 +180,19 @@ describe('Login - OKTA', () => {
});
});
});
+
+ it('renders create account help text', () => {
+ const { getByText } = render(
+ ,
+ );
+
+ expect(getByText(/Don't have an Okta account\?/)).toBeInTheDocument();
+ });
});
diff --git a/pages/login.page.tsx b/pages/login.page.tsx
index 0146d2d25..2bb3274d4 100644
--- a/pages/login.page.tsx
+++ b/pages/login.page.tsx
@@ -2,7 +2,8 @@ import { GetServerSideProps } from 'next';
import Head from 'next/head';
import React, { ReactElement, useEffect } from 'react';
import SubjectIcon from '@mui/icons-material/Subject';
-import { Button } from '@mui/material';
+import { Button, Typography } from '@mui/material';
+import { styled } from '@mui/material/styles';
import { getSession, signIn } from 'next-auth/react';
import BaseLayout from 'src/components/Layouts/Basic';
import Loading from 'src/components/Loading';
@@ -11,16 +12,22 @@ import useGetAppSettings from 'src/hooks/useGetAppSettings';
import { extractCookie } from 'src/lib/extractCookie';
import i18n from 'src/lib/i18n';
+const SignUpBox = styled('div')(({ theme }) => ({
+ marginBlock: theme.spacing(2),
+}));
+
export interface LoginProps {
signInButtonText: string;
signInAuthProviderId: string;
immediateSignIn: boolean;
+ isOkta: boolean;
}
const Login = ({
signInButtonText,
signInAuthProviderId,
immediateSignIn,
+ isOkta,
}: LoginProps): ReactElement => {
const { appName } = useGetAppSettings();
@@ -67,6 +74,16 @@ const Login = ({
>
Find help
+ {isOkta && (
+
+
+ Don't have an Okta account?
+
+ Click the Sign in button above, then{' '}
+ Sign up.
+
+
+ )}
>
);
@@ -116,6 +133,7 @@ export const getServerSideProps: GetServerSideProps = async (context) => {
signInButtonText,
signInAuthProviderId,
immediateSignIn,
+ isOkta: authProvider === 'OKTA',
},
};
};
diff --git a/src/components/Welcome/Welcome.tsx b/src/components/Welcome/Welcome.tsx
index 2872481cb..a0a7ae502 100644
--- a/src/components/Welcome/Welcome.tsx
+++ b/src/components/Welcome/Welcome.tsx
@@ -26,13 +26,13 @@ const useStyles = makeStyles()((theme: Theme) => ({
minHeight: '100vh',
minWidth: '100vw',
backgroundColor: theme.palette.mpdxBlue.main,
+ '.MuiTypography-root': {
+ color: theme.palette.common.white,
+ },
},
subtitle: {
maxWidth: '450px',
},
- whiteText: {
- color: theme.palette.common.white,
- },
}));
const variants = {
@@ -78,7 +78,6 @@ const Welcome = ({
data-testid="welcomeTitle"
variant="h4"
component="h1"
- className={classes.whiteText}
>
{title}
@@ -89,10 +88,7 @@ const Welcome = ({
{typeof subtitle === 'string' ? (
-
+
{subtitle}