Commit 0f73f2cc authored by Emily Jensen's avatar Emily Jensen

Download PDF added

parent cb10510a
<div class="account l-container-narrow u-margin-tb-50">
<a class="text-link text-link--left-caret heading-back-link" [routerLink]="['/account']">
Account Management
</a>
<a class="text-link text-link--left-caret heading-back-link" [routerLink]=" ['/account'] ">Account Management</a>
<h2 class="heading-main heading-main--pad-bottom">
Manage Backup Code
</h2>
<h2 class="heading-main heading-main--pad-bottom">Manage Backup Code</h2>
<form novalidate [ngrxFormState]="form" (submit)="onSubmit()">
<app-non-field-messages [messages]="nonFieldErrors"></app-non-field-messages>
<div class="form-field form-field--large">
<label for="oldPassword" class="form-field__label">Current Password</label>
<input type="password" [ngrxFormControlState]="form.controls.oldPassword" class="form-field__input form-field__input--one-action"
[class.form-field__input--invalid]="form.errors._oldPassword && form.isSubmitted" name="oldPassword"
autocomplete="off" />
<input
type="password"
[ngrxFormControlState]="form.controls.oldPassword"
class="form-field__input form-field__input--one-action"
[class.form-field__input--invalid]="form.errors._oldPassword && form.isSubmitted"
name="oldPassword"
autocomplete="off"
/>
</div>
<ul *ngIf="form.errors._oldPassword && form.isSubmitted" class="form-field__error-list">
......@@ -21,22 +25,19 @@
You must enter your current password
</li>
<li *ngIf="form.errors._oldPassword.minLength" class="form-field__error">
Password must be at least {{ form.errors._oldPassword.minLength.minLength }} characters long.
Password must be at least
{{ form.errors._oldPassword.minLength.minLength }} characters long.
</li>
</ul>
<div class="change-password__actions">
<button type="submit" class="button button--primary">
Download New Backup Code
</button>
<button type="submit" class="button button--primary">Submit</button>
<progress-indicator [inProgress]="hasStarted" inProgressText="Saving" [completed]="hasFinished" completedText="Saved"></progress-indicator>
</div>
<!-- <div class="change-password__note" [@flyInOut]="true" *ngIf="hasStarted">
We’re currently changing your password. This takes a little while, so don’t navigate away.
</div> -->
</form>
</div>
\ No newline at end of file
<button (click)="downloadPDF()" class="button button--primary">
Download PDF
</button>
</div>
......@@ -30,12 +30,19 @@ export class ManageBackupCodeComponent {
@Output()
newBackupCode = new EventEmitter();
@Output()
getBackupPDF = new EventEmitter();
onSubmit() {
if (this.form.isValid) {
this.newBackupCode.emit();
}
}
downloadPDF() {
if (this.form.isValid) {
this.getBackupPDF.emit();
} }
constructor() {}
}
import { Component, ChangeDetectionStrategy } from "@angular/core";
import * as fromAccount from "../account.reducer";
import { Store } from "@ngrx/store";
import { SubmitFormSuccess, SubmitForm } from "./manage-backup-code.actions";
import { SubmitForm } from "./manage-backup-code.actions";
import { manageBackupCodeNewBackupCode } from "../account.reducer";
import { BackupCodePdfService } from "../backup-code-pdf.service";
@Component({
template: `
......@@ -10,8 +12,9 @@ import { SubmitFormSuccess, SubmitForm } from "./manage-backup-code.actions";
[hasStarted]="hasStarted$ | async"
[hasFinished]="hasFinished$ | async"
[errorMessage]="errorMessage$ | async"
[backupCode]="backupCode$ | async"
[backupCode]="backupCode"
(newBackupCode)="newBackupCode()"
(getBackupPDF)="getBackupPDF()"
></app-manage-backup-code>
`,
changeDetection: ChangeDetectionStrategy.OnPush
......@@ -21,12 +24,16 @@ export class ManageBackupCodeContainer {
hasStarted$ = this.store.select(fromAccount.manageBackupCode);
hasFinished$ = this.store.select(fromAccount.manageBackupCode);
errorMessage$ = this.store.select(fromAccount.manageBackupCodeErrorMessage);
// backupCode$ = this.store.select(fromAccount.manageBackupCodeNewBackupCode);
backupCode: string | null;
constructor(private store: Store<fromAccount.IAuthState>) {}
constructor(private store: Store<any>, private backupCodeToPdf: BackupCodePdfService) {
this.store.select(manageBackupCodeNewBackupCode).subscribe((backupCode) => this.backupCode = backupCode);
}
getBackupPDF() {
this.backupCodeToPdf.download(this.backupCode);
}
newBackupCode() {
this.store.dispatch(new SubmitForm());
this.store.dispatch(new SubmitFormSuccess("This is not your backup code"));
}
}
......@@ -25,6 +25,8 @@ const validateAndUpdateFormState = updateGroup<IForm>({
oldPassword: validate(oldPasswordValidators),
});
export const newBackupCode = (state: IState) => state.newBackupCode;
export const initialFormState = validateAndUpdateFormState(
createFormGroupState<IForm>(FORM_ID, {
oldPassword: "",
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment