FR (Angular Authenticator): Ability to override confirm signin to use recaptcha

Before creating a new issue, please confirm:

[X] I have searched for duplicate or closed issues and discussions.
[X] I have tried disabling all browser extensions or using a different browser
[X] I have tried deleting the node_modules folder and reinstalling my dependencies
[X] I have read the guide for submitting bug reports.

On which framework/platform are you having an issue?

Angular

Which UI component?

Authenticator

How is your app built?

"@aws-amplify/ui-angular": "^3.2.11",

What browsers are you seeing the problem on?

Chrome

Please describe your bug.

The documentation for angular in the angular chapter custom-auth-challenge-with-google-recaptcha is only working with the obsolete version of aws-amplify-angular, and I cannot find a working solution with @aws-amplify/ui-angular. Also the frontend documentation (ui.docs.amplify.aws/angular) is not handling the setup for google recpatcha.

The VerifyAuthChallenge is configured with the secret key of Recaptcha, but I don't know how to include the site key/recaptcha compenent in the existing amplify-authenticator.

What's the expected behaviour?

Working Solution for using Google Recaptcha within the Amplify Authenticator module in Angular.

Help us reproduce the bug!

It's a documentation issue.

Code Snippet

Following solution is not working, as auth.confirmSignIn cannot be filled and auth.submitSignIn is also missing from angular chapter custom-auth-challenge-with-google-recaptcha MAybe the correct amplifySlot can help here.

<amplify-authenticator class="center">
    <ng-template
      amplifySlot="authenticated"
    >
      <router-outlet></router-outlet>
    </ng-template>
</amplify-authenticator>
<div *ngIf="auth.confirmSignIn">
  <re-captcha
    (resolved)="auth.submitSignIn($event)"
    siteKey="your recpaatcha site key"
  ></re-captcha>
</div>

Additional information and screenshots

No response

aws-amplify / amplify-ui