Skip to content

Commit

Permalink
remove use of ngTemplateOutlet
Browse files Browse the repository at this point in the history
  • Loading branch information
@Paahn
Paahn committed Jul 15, 2024
1 parent b725af6 commit 3a2271c
Show file tree
Hide file tree
Showing 3 changed files with 104 additions and 111 deletions.
100 changes: 49 additions & 51 deletions ...p/src/app/features/access/pages/bc-provider-application/bc-provider-application.page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -184,7 +184,55 @@ <h3>You get more out of OneHealthID when you sign in with BC Provider.</h3>
</ng-container>
<section class="form-card">
<div class="password-form">
<ng-container *ngTemplateOutlet="passwordForm"></ng-container>
<form novalidate [formGroup]="formState.form" (ngSubmit)="onSubmit()">
<div class="mobile-image">
<img
ngSrc="/assets/images/bcprovider-account-1000x1103.webp"
fill
priority />
</div>
<h2>Create an account</h2>
<div class="form-content">
<div class="field">
<label id="bc-provider-application-password"
>Choose a password</label
>
<mat-form-field>
<input
matInput
formControlName="password"
type="password"
aria-labelledby="bc-provider-application-password" />
<mat-error>{{ formState.getErrorMessage() }}</mat-error>
</mat-form-field>
</div>
<div class="field">
<label id="bc-provider-application-confirm-password"
>Confirm password</label
>
<mat-form-field>
<input
matInput
formControlName="confirmPassword"
type="password"
aria-labelledby="bc-provider-application-confirm-password"
[errorStateMatcher]="errorMatcher" />
<mat-error *ngIf="formState.form.hasError('nomatch')">
Must match the password entered above
</mat-error>
</mat-form-field>
</div>
<div class="form-button-box">
<button
mat-flat-button
type="submit"
color="primary"
[disabled]="!isEnrolButtonEnabled">
Enrol now
</button>
</div>
</div>
</form>
</div>
<div class="password-splash">
<div class="password-splash-content">
Expand Down Expand Up @@ -230,56 +278,6 @@ <h3>You get more out of OneHealthID when you sign in with BC Provider.</h3>
</div>
</ng-template>

<ng-template #passwordForm>
<form novalidate [formGroup]="formState.form" (ngSubmit)="onSubmit()">
<div class="mobile-image">
<img
ngSrc="/assets/images/bcprovider-account-1000x1103.webp"
fill
priority />
</div>
<h2>Create an account</h2>
<div class="form-content">
<div class="field">
<label id="bc-provider-application-password">Choose a password</label>
<mat-form-field>
<input
matInput
formControlName="password"
type="password"
aria-labelledby="bc-provider-application-password" />
<mat-error>{{ formState.getErrorMessage() }}</mat-error>
</mat-form-field>
</div>
<div class="field">
<label id="bc-provider-application-confirm-password"
>Confirm password</label
>
<mat-form-field>
<input
matInput
formControlName="confirmPassword"
type="password"
aria-labelledby="bc-provider-application-confirm-password"
[errorStateMatcher]="errorMatcher" />
<mat-error *ngIf="formState.form.hasError('nomatch')">
Must match the password entered above
</mat-error>
</mat-form-field>
</div>
<div class="form-button-box">
<button
mat-flat-button
type="submit"
color="primary"
[disabled]="!isEnrolButtonEnabled">
Enrol now
</button>
</div>
</div>
</form>
</ng-template>

<ng-template #default></ng-template>

<ng-template #successDialog>
Expand Down
112 changes: 54 additions & 58 deletions ...space/apps/pidp/src/app/features/access/pages/bc-provider-edit/bc-provider-edit.page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,60 @@ <h1>BC Provider Account Information</h1>
</ng-container>
<section class="form-card">
<div class="password-form">
<ng-container *ngTemplateOutlet="passwordForm"></ng-container>
<form novalidate [formGroup]="formState.form" (ngSubmit)="onSubmit()">
<div class="mobile-image">
<img
ngSrc="/assets/images/bcprovider-account-1000x1103.webp"
fill
priority />
</div>
<h2>Password reset</h2>
<div class="username">
<h4><strong>Provided username</strong></h4>
<h5 class="username-overflow">{{ username }}</h5>
</div>
<div class="form-content">
<div class="field">
<label id="bc-provider-application-new-password"
>Choose new password</label
>
<mat-form-field>
<input
matInput
formControlName="newPassword"
type="password"
aria-labelledby="bc-provider-application-new-password" />
<mat-error>{{ formState.getErrorMessage() }}</mat-error>
</mat-form-field>
</div>
<div class="field">
<label id="bc-provider-application-confirm-password"
>Confirm new password</label
>
<mat-form-field>
<input
matInput
formControlName="confirmPassword"
type="password"
aria-labelledby="bc-provider-application-confirm-password"
[errorStateMatcher]="errorMatcher" />
<mat-error *ngIf="formState.form.hasError('nomatch')"
>Must match the new password entered above</mat-error
>
</mat-form-field>
</div>
<div class="form-button-box">
<button
mat-flat-button
type="submit"
color="primary"
[disabled]="!isResetButtonEnabled">
Reset password
</button>
</div>
<app-need-help></app-need-help>
</div>
</form>
</div>
<div class="password-splash">
<div class="password-splash-content">
Expand Down Expand Up @@ -58,63 +111,6 @@ <h1>BC Provider Account Information</h1>
</div>
</div>

<ng-template #passwordForm>
<form novalidate [formGroup]="formState.form" (ngSubmit)="onSubmit()">
<div class="mobile-image">
<img
ngSrc="/assets/images/bcprovider-account-1000x1103.webp"
fill
priority />
</div>
<h2>Password reset</h2>
<div class="username">
<h4><strong>Provided username</strong></h4>
<h5 class="username-overflow">{{ username }}</h5>
</div>
<div class="form-content">
<div class="field">
<label id="bc-provider-application-new-password"
>Choose new password</label
>
<mat-form-field>
<input
matInput
formControlName="newPassword"
type="password"
aria-labelledby="bc-provider-application-new-password" />
<mat-error>{{ formState.getErrorMessage() }}</mat-error>
</mat-form-field>
</div>
<div class="field">
<label id="bc-provider-application-confirm-password"
>Confirm new password</label
>
<mat-form-field>
<input
matInput
formControlName="confirmPassword"
type="password"
aria-labelledby="bc-provider-application-confirm-password"
[errorStateMatcher]="errorMatcher" />
<mat-error *ngIf="formState.form.hasError('nomatch')"
>Must match the new password entered above</mat-error
>
</mat-form-field>
</div>
<div class="form-button-box">
<button
mat-flat-button
type="submit"
color="primary"
[disabled]="!isResetButtonEnabled">
Reset password
</button>
</div>
<app-need-help></app-need-help>
</div>
</form>
</ng-template>

<ng-template #successDialog>
<app-success-dialog
title="Password reset completed"
Expand Down
3 changes: 1 addition & 2 deletions workspace/apps/pidp/src/app/features/access/pages/bc-provider-edit/bc-provider-edit.page.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { NgIf, NgOptimizedImage, NgTemplateOutlet } from '@angular/common';
import { NgIf, NgOptimizedImage } from '@angular/common';
import { Component, OnInit, TemplateRef, ViewChild } from '@angular/core';
import { FormBuilder, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
Expand Down Expand Up @@ -48,7 +48,6 @@ export interface BcProviderEditInitialStateModel {
MatInputModule,
NeedHelpComponent,
NgIf,
NgTemplateOutlet,
ReactiveFormsModule,
SuccessDialogComponent,
NgOptimizedImage,
Expand Down

0 comments on commit 3a2271c

Please sign in to comment.