Angular MSAL B2C not getting payload

After a successful login with B2C, method below is not getting invoked to get payload. Can someone help?

this.msalBroadcastService.msalSubject$
  .pipe(
    filter((msg: EventMessage) => msg.eventType === EventType.LOGIN_SUCCESS || msg.eventType === EventType.ACQUIRE_TOKEN_SUCCESS),
    takeUntil(this._destroying$)
  )
  .subscribe((result: EventMessage) => {
  
    let payload: IdTokenClaims = <AuthenticationResult>result.payload;

    // We need to reject id tokens that were not issued with the default sign-in policy.
    // "acr" claim in the token tells us what policy is used (NOTE: for new policies (v2.0), use "tfp" instead of "acr")
    // To learn more about b2c tokens, visit https://docs.microsoft.com/en-us/azure/active-directory-b2c/tokens-overview

    if (payload.idTokenClaims?.acr === b2cPolicies.names.forgotPassword) {
      window.alert('Password has been reset successfully. \nPlease sign-in with your new password.');
      return this.authService.logout();
    } else if (payload.idTokenClaims['acr'] === b2cPolicies.names.editProfile) {
      window.alert('Profile has been updated successfully. \nPlease sign-in again.');
      return this.authService.logout();
    }

    return result;
  });