<form [formGroup]="form">
    <form ngNoForm action="{{apiUrl}}/auth/formlogin/totp" method="POST">
        <mat-card>
            <mat-card-content>
                <h2>{{'security.2fa.totp.external' | i18n}}<mat-icon style="font-size: 1em;">open_in_new
                </mat-icon></h2>
                <mat-error *ngIf="loginInvalid">
                    {{'security.2fa.totp.invalid' | i18n}}
                </mat-error>
                <mat-form-field>
                    <input id="code" name="code" matInput placeholder="{{'security.2fa.totp.code' | i18n}}"
                        formControlName="code" required>
                    <mat-error>
                        {{'security.2fa.totp.missing' | i18n}}
                    </mat-error>
                </mat-form-field>
                <mat-slide-toggle id="keep" name="keep" formControlName="keep">
                    {{'security.2fa.totp.keepSession' | i18n}}
                </mat-slide-toggle>
            </mat-card-content>
            <mat-card-actions>
                <button type="submit" mat-raised-button color="primary"
                    [disabled]="form.invalid">{{'security.2fa.totp.login' | i18n}}<mat-icon style="font-size: 1em;">open_in_new
                    </mat-icon></button>
            </mat-card-actions>
        </mat-card>
    </form>
</form>