How do I make 'forgot password' working in react-aad-msal with Azure AD B2C?

Question

I am using react-aad-msal with Azure AD B2C. I have sign-in and sign-out working. However, when I click 'Forgot your password?', the auth window disappears and nothing happens.

It seems I need to specify name of my 'forgot password' policy, but I do not know where to put it.

Based on Tony's answer added this code to my App's render:

if (window.location.href.indexOf("error_description=AADB2C90118") >= 0)
    {
      return <AzureAD
      provider={
        new MsalAuthProviderFactory({
          authority: 'https://login.microsoftonline.com/tfp/x5aaas.onmicrosoft.com/B2C_1_PwdReset', 
          clientID: 'a1568977-3095-4bf6-a6d6-c10c87658488',
          scopes: ['https://x5aaas.onmicrosoft.com/ui/use'],
          type: LoginType.Redirect,
          postLogoutRedirectUri: window.origin,
        })
      }
      unauthenticatedFunction={this.unauthenticatedFunction}
      userInfoCallback={this.userJustLoggedIn}
      authenticatedFunction={this.authenticatedFunction}
    />;
    }

I see that after I click "Forgot password?", the condition is true, and return happens. However, the window for password reset does not show up and I get redirected back to my app URL.

Any suggestions?

Answer 1

What I did was create a Route in my App.js:

          <Route
            path="/forgot"
            component={() => {
              window.location.href = forgotPasswordUrl;
              return null;
            }}
          />

Then, in the constructor

if (window.location.hash.indexOf('AADB2C90118') >= 0) {
  history.push('/forgot');
}

And that works.

Answer 2

When using a combined sign-up/sign-in policy in Azure B2C, users have to handle the forgot password scenario themselves. You can find more detailed comments here.

A sign-up or sign-in user flow with local accounts includes a "Forgot password?" link on the first page of the experience. Clicking this link doesn't automatically trigger a password reset user flow.

Instead, the error code AADB2C90118 is returned to your application. Your application needs to handle this error code by running a specific user flow that resets the password. To see an example, take a look at a simple ASP.NET sample that demonstrates the linking of user flows.