fix(experience): add sso form mode context provider for identifier si…

…gn-in/register pages (#6482)
logto-io · Aug 21, 2024 · 0ec8510 · 0ec8510
1 parent b8b7752
commit 0ec8510
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 9 deletions.
diff --git a/packages/experience/src/components/IdentifierRegisterForm/index.test.tsx b/packages/experience/src/components/IdentifierRegisterForm/index.test.tsx
@@ -394,11 +394,13 @@ describe('<IdentifierRegisterForm />', () => {
  mockSsoConnectors
  );
  const emailInput = container.querySelector('input[name="id"]');
+ const termsButton = getByText('description.agree_with_terms');
 
  assert(emailInput, new Error('username input not found'));
 
  act(() => {
  fireEvent.change(emailInput, { target: { value: email } });
+ fireEvent.click(termsButton);
  });
 
  await waitFor(() => {

diff --git a/packages/experience/src/components/IdentifierRegisterForm/index.tsx b/packages/experience/src/components/IdentifierRegisterForm/index.tsx
@@ -71,19 +71,24 @@ const IdentifierRegisterForm = ({ className, autoFocus, signUpMethods }: Props)
 
  setIdentifierInputValue({ type, value });
 
- if (showSingleSignOnForm) {
- await navigateToSingleSignOn();
+ if (
+ agreeToTermsPolicy &&
+ agreeToTermsPolicy !== AgreeToTermsPolicy.Automatic &&
+ !(await termsValidation())
+ ) {
  return;
  }
 
- if (!(await termsValidation())) {
+ if (showSingleSignOnForm) {
+ await navigateToSingleSignOn();
  return;
  }
 
  await onSubmit(type, value);
  })(event);
  },
  [
+ agreeToTermsPolicy,
  clearErrorMessage,
  handleSubmit,
  navigateToSingleSignOn,

diff --git a/packages/experience/src/pages/IdentifierRegister/index.tsx b/packages/experience/src/pages/IdentifierRegister/index.tsx
@@ -3,6 +3,7 @@ import { useTranslation } from 'react-i18next';
 import { Navigate } from 'react-router-dom';
 
 import FocusedAuthPageLayout from '@/Layout/FocusedAuthPageLayout';
+import SingleSignOnFormModeContextProvider from '@/Providers/SingleSignOnFormModeContextProvider';
 import IdentifierRegisterForm from '@/components/IdentifierRegisterForm';
 import { useSieMethods } from '@/hooks/use-sie';
 import { identifierInputDescriptionMap } from '@/utils/form';
@@ -36,7 +37,9 @@ const IdentifierRegister = () => {
  text: 'description.all_account_creation_options',
  }}
  >
- <IdentifierRegisterForm signUpMethods={signUpMethods} />
+ <SingleSignOnFormModeContextProvider>
+ <IdentifierRegisterForm signUpMethods={signUpMethods} />
+ </SingleSignOnFormModeContextProvider>
  </FocusedAuthPageLayout>
  );
 };

diff --git a/packages/experience/src/pages/IdentifierSignIn/index.tsx b/packages/experience/src/pages/IdentifierSignIn/index.tsx
@@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next';
 import { Navigate } from 'react-router-dom';
 
 import FocusedAuthPageLayout from '@/Layout/FocusedAuthPageLayout';
+import SingleSignOnFormModeContextProvider from '@/Providers/SingleSignOnFormModeContextProvider';
 import IdentifierSignInForm from '@/components/IdentifierSignInForm';
 import PasswordSignInForm from '@/components/PasswordSignInForm';
 import { identifierInputDescriptionMap } from '@/utils/form';
@@ -43,11 +44,13 @@ const IdentifierSignIn = () => {
  text: 'description.all_sign_in_options',
  }}
  >
- {isPasswordOnly ? (
- <PasswordSignInForm signInMethods={signInMethods.map(({ identifier }) => identifier)} />
- ) : (
- <IdentifierSignInForm signInMethods={signInMethods} />
- )}
+ <SingleSignOnFormModeContextProvider>
+ {isPasswordOnly ? (
+ <PasswordSignInForm signInMethods={signInMethods.map(({ identifier }) => identifier)} />
+ ) : (
+ <IdentifierSignInForm signInMethods={signInMethods} />
+ )}
+ </SingleSignOnFormModeContextProvider>
  </FocusedAuthPageLayout>
  );
 };