Localization - First Pass (#2174)
* Started designing the backend localization service * Worked in Transloco for initial PoC * Worked in Transloco for initial PoC * Translated the login screen * translated dashboard screen * Started work on the backend * Fixed a logic bug * translated edit-user screen * Hooked up the backend for having a locale property. * Hooked up the ability to view the available locales and switch to them. * Made the localization service languages be derived from what's in langs/ directory. * Fixed up localization switching * Switched when we check for a license on UI bootstrap * Tweaked some code * Fixed the bug where dashboard wasn't loading and made it so language switching is working. * Fixed a bug on dashboard with languagePath * Converted user-scrobble-history.component.html * Converted spoiler.component.html * Converted review-series-modal.component.html * Converted review-card-modal.component.html * Updated the readme * Translated using Weblate (English) Currently translated at 100.0% (54 of 54 strings) Translation: Kavita/ui Translate-URL: https://hosted.weblate.org/projects/kavita/ui/en/ * Converted review-card.component.html * Deleted dead component * Converted want-to-read.component.html * Added translation using Weblate (Korean) * Translated using Weblate (Spanish) Currently translated at 40.7% (22 of 54 strings) Translation: Kavita/ui Translate-URL: https://hosted.weblate.org/projects/kavita/ui/es/ * Translated using Weblate (Korean) Currently translated at 62.9% (34 of 54 strings) Translation: Kavita/ui Translate-URL: https://hosted.weblate.org/projects/kavita/ui/ko/ * Converted user-preferences.component.html * Translated using Weblate (Korean) Currently translated at 92.5% (50 of 54 strings) Translation: Kavita/ui Translate-URL: https://hosted.weblate.org/projects/kavita/ui/ko/ * Converted user-holds.component.html * Converted theme-manager.component.html * Converted restriction-selector.component.html * Converted manage-devices.component.html * Converted edit-device.component.html * Converted change-password.component.html * Converted change-email.component.html * Converted change-age-restriction.component.html * Converted api-key.component.html * Converted anilist-key.component.html * Converted typeahead.component.html * Converted user-stats-info-cards.component.html * Converted user-stats.component.html * Converted top-readers.component.html * Converted some pipes and ensure translation is loaded before the app. * Finished all but one pipe for localization * Converted directory-picker.component.html * Converted library-access-modal.component.html * Converted a few components * Converted a few components * Converted a few components * Converted a few components * Converted a few components * Merged weblate in * ... -> … update * Updated the readme * Updateded all fonts to be woff2 * Cleaned up some strings to increase re-use * Removed an old flow (that doesn't exist in backend any longer) from when we introduced emails on Kavita. * Converted Series detail * Lots more converted * Lots more converted & hooked up the ability to flatten during prod build the language files. * Lots more converted * Lots more converted & fixed a bunch of broken pipes due to inject() * Lots more converted * Lots more converted * Lots more converted & fixed some bad keys * Lots more converted * Fixed some bugs with admin dasbhoard nested tabs not rendering on first load due to not using onpush change detection * Fixed up some localization errors and fixed forgot password error when the user doesn't have change password permission * Fixed a stupid build issue again * Started adding errors for interceptor and backend. * Finished off manga-reader * More translations * Few fixes * Fixed a bug where character tag badges weren't showing the name on chapter info * All components are translated * All toasts are translated * All confirm/alerts are translated * Trying something new for the backend * Migrated the localization strings for the backend into a new file. * Updated the localization service to be able to do backend localization with fallback to english. * Cleaned up some external reviews code to reduce looping * Localized AccountController.cs * 60% done with controllers * All controllers are done * All KavitaExceptions are covered * Some shakeout fixes * Prep for initial merge * Everything is done except options and basic shakeout proves response times are good. Unit tests are broken. * Fixed up the unit tests * All unit tests are now working * Removed some quantifier * I'm not sure I can support localization for some Volume/Chapter/Book strings within the codebase. --------- Co-authored-by: Robbie Davis <robbie@therobbiedavis.com> Co-authored-by: majora2007 <kavitareader@gmail.com> Co-authored-by: expertjun <jtrobin@naver.com> Co-authored-by: ThePromidius <thepromidiusyt@gmail.com>
This commit is contained in:
parent
670bf82c38
commit
3b23d63234
389 changed files with 13652 additions and 7925 deletions
|
|
@ -1,18 +1,19 @@
|
|||
|
||||
<app-splash-container>
|
||||
<ng-container title><h2>Validate Email Change</h2></ng-container>
|
||||
<ng-container *transloco="let t; read: 'confirm-email-change'">
|
||||
<app-splash-container>
|
||||
<ng-container title><h2>{{t('title')}}</h2></ng-container>
|
||||
<ng-container body>
|
||||
<p *ngIf="!confirmed; else confirmedMessage">Please wait while your email update is validated.</p>
|
||||
<p *ngIf="!confirmed; else confirmedMessage">{{t('non-confirm-description')}}</p>
|
||||
|
||||
<ng-template #confirmedMessage>
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="card-title">
|
||||
<h3><i class="fa-regular fa-circle-check me-2" style="font-size: 1.8rem" aria-hidden="true"></i>Success!</h3>
|
||||
</div>
|
||||
<p>Your email has been validated and is now changed within Kavita. You will be redirected to login.</p>
|
||||
</div>
|
||||
<ng-template #confirmedMessage>
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="card-title">
|
||||
<h3><i class="fa-regular fa-circle-check me-2" style="font-size: 1.8rem" aria-hidden="true"></i>{{t('success')}}</h3>
|
||||
</div>
|
||||
</ng-template>
|
||||
<p>{{t('confirm-description')}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
</ng-container>
|
||||
</app-splash-container>
|
||||
</app-splash-container>
|
||||
</ng-container>
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ import { NavService } from 'src/app/_services/nav.service';
|
|||
import { ThemeService } from 'src/app/_services/theme.service';
|
||||
import { NgIf } from '@angular/common';
|
||||
import { SplashContainerComponent } from '../splash-container/splash-container.component';
|
||||
import {translate, TranslocoModule} from "@ngneat/transloco";
|
||||
|
||||
/**
|
||||
* This component just validates the email via API then redirects to login
|
||||
|
|
@ -16,7 +17,7 @@ import { SplashContainerComponent } from '../splash-container/splash-container.c
|
|||
styleUrls: ['./confirm-email-change.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [SplashContainerComponent, NgIf]
|
||||
imports: [SplashContainerComponent, NgIf, TranslocoModule]
|
||||
})
|
||||
export class ConfirmEmailChangeComponent implements OnInit {
|
||||
|
||||
|
|
@ -25,8 +26,8 @@ export class ConfirmEmailChangeComponent implements OnInit {
|
|||
|
||||
confirmed: boolean = false;
|
||||
|
||||
constructor(private route: ActivatedRoute, private router: Router, private accountService: AccountService,
|
||||
private toastr: ToastrService, private themeService: ThemeService, private navService: NavService,
|
||||
constructor(private route: ActivatedRoute, private router: Router, private accountService: AccountService,
|
||||
private toastr: ToastrService, private themeService: ThemeService, private navService: NavService,
|
||||
private readonly cdRef: ChangeDetectorRef) {
|
||||
this.navService.hideSideNav();
|
||||
this.themeService.setTheme(this.themeService.defaultTheme);
|
||||
|
|
@ -35,7 +36,7 @@ export class ConfirmEmailChangeComponent implements OnInit {
|
|||
|
||||
if (this.isNullOrEmpty(token) || this.isNullOrEmpty(email)) {
|
||||
// This is not a valid url, redirect to login
|
||||
this.toastr.error('Invalid confirmation url');
|
||||
this.toastr.error(translate('errors.invalid-confirmation-url'));
|
||||
this.router.navigateByUrl('login');
|
||||
return;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,60 +1,62 @@
|
|||
|
||||
<app-splash-container>
|
||||
<ng-container title><h2>Register</h2></ng-container>
|
||||
<ng-container *transloco="let t; read: 'confirm-email'">
|
||||
<app-splash-container>
|
||||
<ng-container title><h2>{{t('title')}}</h2></ng-container>
|
||||
<ng-container body>
|
||||
<p>Complete the form to complete your registration</p>
|
||||
<div class="text-danger" *ngIf="errors.length > 0">
|
||||
<p>Errors:</p>
|
||||
<ul>
|
||||
<li *ngFor="let error of errors">{{error}}</li>
|
||||
</ul>
|
||||
<p>{{t('description')}}</p>
|
||||
<div class="text-danger" *ngIf="errors.length > 0">
|
||||
<p>{{t('error-label')}}</p>
|
||||
<ul>
|
||||
<li *ngFor="let error of errors">{{error}}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<form [formGroup]="registerForm" (ngSubmit)="submit()">
|
||||
<div class="mb-3">
|
||||
<label for="username" class="form-label">{{t('username-label')}}</label>
|
||||
<input id="username" class="form-control" formControlName="username" type="text"
|
||||
aria-describeby="inviteForm-username-validations"
|
||||
[class.is-invalid]="registerForm.get('username')?.invalid && registerForm.get('username')?.touched">
|
||||
<div id="inviteForm-username-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('username')?.errors?.required">
|
||||
{{t('required-field')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<form [formGroup]="registerForm" (ngSubmit)="submit()">
|
||||
<div class="mb-3">
|
||||
<label for="username" class="form-label">Username</label>
|
||||
<input id="username" class="form-control" formControlName="username" type="text"
|
||||
[class.is-invalid]="registerForm.get('username')?.invalid && registerForm.get('username')?.touched">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('username')?.errors?.required">
|
||||
This field is required
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3" style="width:100%">
|
||||
<label for="email" class="form-label">Email</label>
|
||||
<input class="form-control" type="email" inputmode="email" id="email" formControlName="email" required readonly
|
||||
[class.is-invalid]="registerForm.get('email')?.invalid && registerForm.get('email')?.touched">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('email')?.errors?.required">
|
||||
This field is required
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('email')?.errors?.email">
|
||||
This must be a valid email address
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3" style="width:100%">
|
||||
<label for="email" class="form-label">{{t('email-label')}}</label>
|
||||
<input class="form-control" type="email" inputmode="email" id="email" formControlName="email" required readonly
|
||||
[class.is-invalid]="registerForm.get('email')?.invalid && registerForm.get('email')?.touched">
|
||||
<div id="inviteForm-email-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('email')?.errors?.required">
|
||||
{{t('required-field')}}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label">Password</label> <i class="fa fa-info-circle" placement="right" [ngbTooltip]="passwordTooltip" role="button" tabindex="0"></i>
|
||||
<ng-template #passwordTooltip>
|
||||
Password must be between 6 and 32 characters in length
|
||||
</ng-template>
|
||||
<span class="visually-hidden" id="password-help"><ng-container [ngTemplateOutlet]="passwordTooltip"></ng-container></span>
|
||||
<input id="password" class="form-control" maxlength="32" minlength="6" pattern="^.{6,32}$" formControlName="password" type="password" aria-describedby="password-help">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('password')?.errors?.required">
|
||||
This field is required
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('password')?.errors?.minlength || registerForm.get('password')?.errors?.maxLength || registerForm.get('password')?.errors?.pattern">
|
||||
Password must be between 6 and 32 characters in length
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('email')?.errors?.email">
|
||||
{{t('valid-email')}}
|
||||
</div>
|
||||
|
||||
<div class="float-end">
|
||||
<button class="btn btn-secondary alt" type="submit">Register</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label">{{t('password-label')}}</label> <i class="fa fa-info-circle" placement="right" [ngbTooltip]="passwordTooltip" role="button" tabindex="0"></i>
|
||||
<ng-template #passwordTooltip>
|
||||
{{t('password-validation')}}
|
||||
</ng-template>
|
||||
<span class="visually-hidden" id="password-help"><ng-container [ngTemplateOutlet]="passwordTooltip"></ng-container></span>
|
||||
<input id="password" class="form-control" maxlength="32" minlength="6" pattern="^.{6,32}$" formControlName="password" type="password" aria-describedby="password-help">
|
||||
<div id="inviteForm-password-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('password')?.errors?.required">
|
||||
{{t('required-field')}}
|
||||
</div>
|
||||
</form>
|
||||
<div *ngIf="registerForm.get('password')?.errors?.minlength || registerForm.get('password')?.errors?.maxLength || registerForm.get('password')?.errors?.pattern">
|
||||
{{t('password-validation')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="float-end">
|
||||
<button class="btn btn-secondary alt" type="submit">{{t('register')}}</button>
|
||||
</div>
|
||||
</form>
|
||||
</ng-container>
|
||||
</app-splash-container>
|
||||
</app-splash-container>
|
||||
</ng-container>
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@ import { NavService } from 'src/app/_services/nav.service';
|
|||
import { NgbTooltip } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { NgIf, NgFor, NgTemplateOutlet } from '@angular/common';
|
||||
import { SplashContainerComponent } from '../splash-container/splash-container.component';
|
||||
import {translate, TranslocoModule} from "@ngneat/transloco";
|
||||
|
||||
@Component({
|
||||
selector: 'app-confirm-email',
|
||||
|
|
@ -15,7 +16,7 @@ import { SplashContainerComponent } from '../splash-container/splash-container.c
|
|||
styleUrls: ['./confirm-email.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [SplashContainerComponent, NgIf, NgFor, ReactiveFormsModule, NgbTooltip, NgTemplateOutlet]
|
||||
imports: [SplashContainerComponent, NgIf, NgFor, ReactiveFormsModule, NgbTooltip, NgTemplateOutlet, TranslocoModule]
|
||||
})
|
||||
export class ConfirmEmailComponent {
|
||||
/**
|
||||
|
|
@ -35,8 +36,8 @@ export class ConfirmEmailComponent {
|
|||
errors: Array<string> = [];
|
||||
|
||||
|
||||
constructor(private route: ActivatedRoute, private router: Router, private accountService: AccountService,
|
||||
private toastr: ToastrService, private themeService: ThemeService, private navService: NavService,
|
||||
constructor(private route: ActivatedRoute, private router: Router, private accountService: AccountService,
|
||||
private toastr: ToastrService, private themeService: ThemeService, private navService: NavService,
|
||||
private readonly cdRef: ChangeDetectorRef) {
|
||||
this.navService.hideSideNav();
|
||||
this.themeService.setTheme(this.themeService.defaultTheme);
|
||||
|
|
@ -45,7 +46,7 @@ export class ConfirmEmailComponent {
|
|||
this.cdRef.markForCheck();
|
||||
if (this.isNullOrEmpty(token) || this.isNullOrEmpty(email)) {
|
||||
// This is not a valid url, redirect to login
|
||||
this.toastr.error('Invalid confirmation url');
|
||||
this.toastr.error(translate('errors.invalid-confirmation-url'));
|
||||
this.router.navigateByUrl('login');
|
||||
return;
|
||||
}
|
||||
|
|
@ -62,7 +63,7 @@ export class ConfirmEmailComponent {
|
|||
const model = this.registerForm.getRawValue();
|
||||
model.token = this.token;
|
||||
this.accountService.confirmEmail(model).subscribe((user) => {
|
||||
this.toastr.success('Account registration complete');
|
||||
this.toastr.success(translate('toasts.account-registration-complete'));
|
||||
this.router.navigateByUrl('login');
|
||||
}, err => {
|
||||
console.error('Error from Confirming Email: ', err);
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import { ActivatedRoute, Router } from '@angular/router';
|
|||
import { ToastrService } from 'ngx-toastr';
|
||||
import { ThemeService } from 'src/app/_services/theme.service';
|
||||
import { AccountService } from 'src/app/_services/account.service';
|
||||
import {translate} from "@ngneat/transloco";
|
||||
|
||||
@Component({
|
||||
selector: 'app-confirm-migration-email',
|
||||
|
|
@ -13,8 +14,8 @@ import { AccountService } from 'src/app/_services/account.service';
|
|||
})
|
||||
export class ConfirmMigrationEmailComponent {
|
||||
|
||||
constructor(private route: ActivatedRoute, private router: Router,
|
||||
private accountService: AccountService, private toastr: ToastrService,
|
||||
constructor(private route: ActivatedRoute, private router: Router,
|
||||
private accountService: AccountService, private toastr: ToastrService,
|
||||
private themeService: ThemeService) {
|
||||
|
||||
this.themeService.setTheme(this.themeService.defaultTheme);
|
||||
|
|
@ -23,14 +24,14 @@ export class ConfirmMigrationEmailComponent {
|
|||
|
||||
if (token === undefined || token === '' || token === null || email === undefined || email === '' || email === null) {
|
||||
// This is not a valid url, redirect to login
|
||||
this.toastr.error('Invalid confirmation email');
|
||||
this.toastr.error(translate('errors.invalid-confirmation-email'));
|
||||
this.router.navigateByUrl('login');
|
||||
return;
|
||||
}
|
||||
this.accountService.confirmMigrationEmail({token: token, email}).subscribe((user) => {
|
||||
this.toastr.success('Account migration complete');
|
||||
this.toastr.success(translate('toasts.account-migration-complete'));
|
||||
this.router.navigateByUrl('login');
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,28 +1,31 @@
|
|||
<app-splash-container>
|
||||
<ng-container title><h2>Password Reset</h2></ng-container>
|
||||
<ng-container *transloco="let t; read: 'confirm-reset-password'">
|
||||
<app-splash-container>
|
||||
<ng-container title><h2>{{t('title')}}</h2></ng-container>
|
||||
<ng-container body>
|
||||
<p>Enter the new password</p>
|
||||
<form [formGroup]="registerForm" (ngSubmit)="submit()">
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label">Password</label> <i class="fa fa-info-circle" placement="right" [ngbTooltip]="passwordTooltip" role="button" tabindex="0"></i>
|
||||
<ng-template #passwordTooltip>
|
||||
Password must be between 6 and 32 characters in length
|
||||
</ng-template>
|
||||
<span class="visually-hidden" id="password-help"><ng-container [ngTemplateOutlet]="passwordTooltip"></ng-container></span>
|
||||
<input id="password" class="form-control" maxlength="32" minlength="6" formControlName="password" type="password" aria-describedby="password-help">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('password')?.errors?.required">
|
||||
This field is required
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('password')?.errors?.minlength || registerForm.get('password')?.errors?.maxLength">
|
||||
Password must be between 6 and 32 characters in length
|
||||
</div>
|
||||
</div>
|
||||
<p>{{t('description')}}</p>
|
||||
<form [formGroup]="registerForm" (ngSubmit)="submit()">
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label">{{t('password-label')}}</label> <i class="fa fa-info-circle" placement="right" [ngbTooltip]="passwordTooltip" role="button" tabindex="0"></i>
|
||||
<ng-template #passwordTooltip>
|
||||
{{t('password-validation')}}
|
||||
</ng-template>
|
||||
<span class="visually-hidden" id="password-help"><ng-container [ngTemplateOutlet]="passwordTooltip"></ng-container></span>
|
||||
<input id="password" class="form-control" maxlength="32" minlength="6" formControlName="password" type="password" aria-describedby="password-help">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('password')?.errors?.required">
|
||||
{{t('required-field')}}
|
||||
</div>
|
||||
|
||||
<div class="float-end">
|
||||
<button class="btn btn-secondary alt" type="submit">Submit</button>
|
||||
<div *ngIf="registerForm.get('password')?.errors?.minlength || registerForm.get('password')?.errors?.maxLength">
|
||||
{{t('password-validation')}}
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="float-end">
|
||||
<button class="btn btn-secondary alt" type="submit">{{t('submit')}}</button>
|
||||
</div>
|
||||
</form>
|
||||
</ng-container>
|
||||
</app-splash-container>
|
||||
</app-splash-container>
|
||||
|
||||
</ng-container>
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ import { NavService } from 'src/app/_services/nav.service';
|
|||
import { NgTemplateOutlet, NgIf } from '@angular/common';
|
||||
import { NgbTooltip } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { SplashContainerComponent } from '../splash-container/splash-container.component';
|
||||
import {translate, TranslocoModule} from "@ngneat/transloco";
|
||||
|
||||
@Component({
|
||||
selector: 'app-confirm-reset-password',
|
||||
|
|
@ -14,7 +15,7 @@ import { SplashContainerComponent } from '../splash-container/splash-container.c
|
|||
styleUrls: ['./confirm-reset-password.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [SplashContainerComponent, ReactiveFormsModule, NgbTooltip, NgTemplateOutlet, NgIf]
|
||||
imports: [SplashContainerComponent, ReactiveFormsModule, NgbTooltip, NgTemplateOutlet, NgIf, TranslocoModule]
|
||||
})
|
||||
export class ConfirmResetPasswordComponent {
|
||||
|
||||
|
|
@ -24,7 +25,7 @@ export class ConfirmResetPasswordComponent {
|
|||
password: new FormControl('', [Validators.required, Validators.maxLength(32), Validators.minLength(6)]),
|
||||
});
|
||||
|
||||
constructor(private route: ActivatedRoute, private router: Router,
|
||||
constructor(private route: ActivatedRoute, private router: Router,
|
||||
private accountService: AccountService, private toastr: ToastrService,
|
||||
private readonly cdRef: ChangeDetectorRef, private navService: NavService) {
|
||||
|
||||
|
|
@ -36,7 +37,7 @@ export class ConfirmResetPasswordComponent {
|
|||
const email = this.route.snapshot.queryParamMap.get('email');
|
||||
if (token == undefined || token === '' || token === null) {
|
||||
// This is not a valid url, redirect to login
|
||||
this.toastr.error('Invalid reset password url');
|
||||
this.toastr.error(translate('errors.invalid-password-reset-url'));
|
||||
this.router.navigateByUrl('login');
|
||||
return;
|
||||
}
|
||||
|
|
@ -51,7 +52,7 @@ export class ConfirmResetPasswordComponent {
|
|||
const model = this.registerForm.getRawValue();
|
||||
model.token = this.token;
|
||||
this.accountService.confirmResetPasswordEmail(model).subscribe((response: string) => {
|
||||
this.toastr.success("Password reset");
|
||||
this.toastr.success(translate('toasts.password-reset'));
|
||||
this.router.navigateByUrl('login');
|
||||
}, err => {
|
||||
console.error(err, 'There was an error trying to confirm reset password');
|
||||
|
|
|
|||
|
|
@ -1,59 +1,61 @@
|
|||
<app-splash-container>
|
||||
<ng-container title><h2>Register</h2></ng-container>
|
||||
<ng-container *transloco="let t; read: 'register'">
|
||||
<app-splash-container>
|
||||
<ng-container title><h2>{{t('title')}}</h2></ng-container>
|
||||
<ng-container body>
|
||||
<p>Complete the form to register an admin account</p>
|
||||
<form [formGroup]="registerForm" (ngSubmit)="submit()">
|
||||
<div class="mb-3">
|
||||
<label for="username" class="form-label">Username</label>
|
||||
<input id="username" class="form-control" formControlName="username" type="text"
|
||||
[class.is-invalid]="registerForm.get('username')?.invalid && registerForm.get('username')?.touched" aria-describedby="username-validations">
|
||||
<div id="username-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('username')?.errors?.required">
|
||||
This field is required
|
||||
</div>
|
||||
</div>
|
||||
<p>{{t('description')}}</p>
|
||||
<form [formGroup]="registerForm" (ngSubmit)="submit()">
|
||||
<div class="mb-3">
|
||||
<label for="username" class="form-label">{{t('username-label')}}</label>
|
||||
<input id="username" class="form-control" formControlName="username" type="text"
|
||||
[class.is-invalid]="registerForm.get('username')?.invalid && registerForm.get('username')?.touched" aria-describedby="username-validations">
|
||||
<div id="username-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('username')?.errors?.required">
|
||||
{{t('required-field')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3" style="width:100%">
|
||||
<label for="email" class="form-label">Email</label> <i class="fa fa-info-circle" placement="right" [ngbTooltip]="emailTooltip" role="button" tabindex="0"></i>
|
||||
<ng-template #emailTooltip>Email does not need to be a real address, but provides access to forgot password.
|
||||
It is not sent outside the server unless forgot password is used without a custom email service host. </ng-template>
|
||||
<span class="visually-hidden" id="email-help">
|
||||
<ng-container [ngTemplateOutlet]="emailTooltip"></ng-container>
|
||||
</span>
|
||||
<input class="form-control" type="email" inputmode="email" id="email" formControlName="email" required aria-describedby="email-help"
|
||||
[class.is-invalid]="registerForm.get('email')?.invalid && registerForm.get('email')?.touched">
|
||||
<div id="email-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('email')?.errors?.required">
|
||||
This field is required
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('email')?.errors?.email">
|
||||
This must be a valid email address
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3" style="width:100%">
|
||||
<label for="email" class="form-label">{{t('email-label')}}</label> <i class="fa fa-info-circle" placement="right" [ngbTooltip]="emailTooltip" role="button" tabindex="0"></i>
|
||||
<ng-template #emailTooltip>{{t('email-tooltip')}}</ng-template>
|
||||
<span class="visually-hidden" id="email-help">
|
||||
<ng-container [ngTemplateOutlet]="emailTooltip"></ng-container>
|
||||
</span>
|
||||
<input class="form-control" type="email" inputmode="email" id="email" formControlName="email" required aria-describedby="email-help"
|
||||
[class.is-invalid]="registerForm.get('email')?.invalid && registerForm.get('email')?.touched">
|
||||
<div id="email-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('email')?.errors?.required">
|
||||
{{t('required-field')}}
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('email')?.errors?.email">
|
||||
{{t('valid-email')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label">Password</label> <i class="fa fa-info-circle" placement="right" [ngbTooltip]="passwordTooltip" role="button" tabindex="0"></i>
|
||||
<ng-template #passwordTooltip>
|
||||
Password must be between 6 and 32 characters in length
|
||||
</ng-template>
|
||||
<span class="visually-hidden" id="password-help"><ng-container [ngTemplateOutlet]="passwordTooltip"></ng-container></span>
|
||||
<input id="password" class="form-control" maxlength="32" minlength="6" pattern="^.{6,32}$" formControlName="password"
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label">Password</label> <i class="fa fa-info-circle" placement="right" [ngbTooltip]="passwordTooltip" role="button" tabindex="0"></i>
|
||||
<ng-template #passwordTooltip>
|
||||
{{t('password-validation')}}
|
||||
</ng-template>
|
||||
<span class="visually-hidden" id="password-help"><ng-container [ngTemplateOutlet]="passwordTooltip"></ng-container></span>
|
||||
<input id="password" class="form-control" maxlength="32" minlength="6" pattern="^.{6,32}$" formControlName="password"
|
||||
type="password" aria-describedby="password-help" [class.is-invalid]="registerForm.get('password')?.invalid && registerForm.get('password')?.touched">
|
||||
<div id="password-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('password')?.errors?.required">
|
||||
This field is required
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('password')?.errors?.minlength || registerForm.get('password')?.errors?.maxLength || registerForm.get('password')?.errors?.pattern">
|
||||
Password must be between 6 and 32 characters in length
|
||||
</div>
|
||||
</div>
|
||||
<div id="password-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('password')?.errors?.required">
|
||||
{{t('required-field')}}
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('password')?.errors?.minlength || registerForm.get('password')?.errors?.maxLength || registerForm.get('password')?.errors?.pattern">
|
||||
{{t('password-validation')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="float-end">
|
||||
<button class="btn btn-secondary alt" type="submit" [disabled]="!registerForm.valid">Register</button>
|
||||
</div>
|
||||
</form>
|
||||
<div class="float-end">
|
||||
<button class="btn btn-secondary alt" type="submit" [disabled]="!registerForm.valid">{{t('register')}}</button>
|
||||
</div>
|
||||
</form>
|
||||
</ng-container>
|
||||
</app-splash-container>
|
||||
</app-splash-container>
|
||||
|
||||
</ng-container>
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@ import { MemberService } from 'src/app/_services/member.service';
|
|||
import { NgbTooltip } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { NgIf, NgTemplateOutlet } from '@angular/common';
|
||||
import { SplashContainerComponent } from '../splash-container/splash-container.component';
|
||||
import {translate, TranslocoModule} from "@ngneat/transloco";
|
||||
|
||||
/**
|
||||
* This is exclusively used to register the first user on the server and nothing else
|
||||
|
|
@ -18,7 +19,7 @@ import { SplashContainerComponent } from '../splash-container/splash-container.c
|
|||
styleUrls: ['./register.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [SplashContainerComponent, ReactiveFormsModule, NgIf, NgbTooltip, NgTemplateOutlet]
|
||||
imports: [SplashContainerComponent, ReactiveFormsModule, NgIf, NgbTooltip, NgTemplateOutlet, TranslocoModule]
|
||||
})
|
||||
export class RegisterComponent {
|
||||
|
||||
|
|
@ -42,7 +43,7 @@ export class RegisterComponent {
|
|||
submit() {
|
||||
const model = this.registerForm.getRawValue();
|
||||
this.accountService.register(model).subscribe((user) => {
|
||||
this.toastr.success('Account registration complete');
|
||||
this.toastr.success(translate('toasts.account-registration-complete'));
|
||||
this.router.navigateByUrl('login');
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,24 +1,27 @@
|
|||
<app-splash-container>
|
||||
<ng-container title><h2>Password Reset</h2></ng-container>
|
||||
<ng-container *transloco="let t; read:'reset-password'">
|
||||
<app-splash-container>
|
||||
<ng-container title><h2>{{t('title')}}</h2></ng-container>
|
||||
<ng-container body>
|
||||
<p>Enter the email of your account. We will send you an email </p>
|
||||
<form [formGroup]="registerForm" (ngSubmit)="submit()">
|
||||
<div class="mb-3" style="width:100%">
|
||||
<label for="email" class="form-label">Email</label>
|
||||
<input class="form-control custom-input" type="email" inputmode="email" id="email" formControlName="email" [class.is-invalid]="registerForm.get('email')?.invalid && registerForm.get('email')?.touched">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('email')?.errors?.required">
|
||||
This field is required
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('email')?.errors?.email">
|
||||
This must be a valid email address
|
||||
</div>
|
||||
</div>
|
||||
<p>{{t('description')}}</p>
|
||||
<form [formGroup]="registerForm" (ngSubmit)="submit()">
|
||||
<div class="mb-3" style="width:100%">
|
||||
<label for="email" class="form-label">Email</label>
|
||||
<input class="form-control custom-input" type="email" inputmode="email" id="email" formControlName="email" [class.is-invalid]="registerForm.get('email')?.invalid && registerForm.get('email')?.touched">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('email')?.errors?.required">
|
||||
{{t('required-field')}}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="btn btn-secondary alt" type="submit">Submit</button>
|
||||
<div *ngIf="registerForm.get('email')?.errors?.email">
|
||||
{{t('valid-email')}}
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="btn btn-secondary alt" type="submit">{{t('submit')}}</button>
|
||||
</div>
|
||||
</form>
|
||||
</ng-container>
|
||||
</app-splash-container>
|
||||
</app-splash-container>
|
||||
|
||||
</ng-container>
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ import { ToastrService } from 'ngx-toastr';
|
|||
import { AccountService } from 'src/app/_services/account.service';
|
||||
import { NgIf } from '@angular/common';
|
||||
import { SplashContainerComponent } from '../splash-container/splash-container.component';
|
||||
import {TranslocoModule} from "@ngneat/transloco";
|
||||
|
||||
@Component({
|
||||
selector: 'app-reset-password',
|
||||
|
|
@ -12,7 +13,7 @@ import { SplashContainerComponent } from '../splash-container/splash-container.c
|
|||
styleUrls: ['./reset-password.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [SplashContainerComponent, ReactiveFormsModule, NgIf]
|
||||
imports: [SplashContainerComponent, ReactiveFormsModule, NgIf, TranslocoModule]
|
||||
})
|
||||
export class ResetPasswordComponent {
|
||||
|
||||
|
|
@ -20,7 +21,7 @@ export class ResetPasswordComponent {
|
|||
email: new FormControl('', [Validators.required, Validators.email]),
|
||||
});
|
||||
|
||||
constructor(private router: Router, private accountService: AccountService,
|
||||
constructor(private router: Router, private accountService: AccountService,
|
||||
private toastr: ToastrService) {}
|
||||
|
||||
submit() {
|
||||
|
|
|
|||
|
|
@ -1,65 +0,0 @@
|
|||
<div class="modal-header">
|
||||
<h4 class="modal-title" id="modal-basic-title">Account Migration</h4>
|
||||
<button type="button" class="btn-close" aria-label="Close" (click)="close()">
|
||||
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>Your account does not have an email on file. This is a one-time migration. Please add your email to the account. A verficiation link will be sent to your email for you
|
||||
to confirm and will then be allowed to authenticate with this server. This is required.
|
||||
</p>
|
||||
|
||||
<p class="text-danger" *ngIf="error.length > 0">{{error}}</p>
|
||||
|
||||
<form [formGroup]="registerForm">
|
||||
<div class="mb-3">
|
||||
<label for="username" class="form-label">Username</label>
|
||||
<input id="username" class="form-control" formControlName="username" type="text" [class.is-invalid]="registerForm.get('username')?.invalid && registerForm.get('username')?.touched">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('username')?.errors?.required">
|
||||
This field is required
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3" style="width:100%">
|
||||
<label for="email" class="form-label">Email</label>
|
||||
<input class="form-control" type="email" inputmode="email" id="email" formControlName="email" [class.is-invalid]="registerForm.get('email')?.invalid && registerForm.get('email')?.touched">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('email')?.errors?.required">
|
||||
This field is required
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('email')?.errors?.email">
|
||||
This must be a valid email address
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label">Password</label>
|
||||
<input id="password" class="form-control" maxlength="32" minlength="6" formControlName="password" type="password"
|
||||
aria-describedby="password-help" [class.is-invalid]="registerForm.get('password')?.invalid && registerForm.get('password')?.touched">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="registerForm.dirty || registerForm.touched">
|
||||
<div *ngIf="registerForm.get('password')?.errors?.required">
|
||||
This field is required
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('password')?.errors?.minlength">
|
||||
This field must be at least {{registerForm.get('password')?.errors?.minlength.requiredLength}} characters
|
||||
</div>
|
||||
<div *ngIf="registerForm.get('password')?.errors?.maxlength">
|
||||
This field must be no more than {{registerForm.get('password')?.errors?.maxlength.requiredLength}} characters
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" (click)="close()">
|
||||
Cancel
|
||||
</button>
|
||||
<button type="button" class="btn btn-primary" (click)="save()" [disabled]="isSaving || !registerForm.valid">
|
||||
<span *ngIf="isSaving" class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
<span>Submit</span>
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -1,53 +0,0 @@
|
|||
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnInit } from '@angular/core';
|
||||
import { FormControl, FormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
|
||||
import { SafeUrl } from '@angular/platform-browser';
|
||||
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { ToastrService } from 'ngx-toastr';
|
||||
import { AccountService } from 'src/app/_services/account.service';
|
||||
import { NgIf } from '@angular/common';
|
||||
|
||||
@Component({
|
||||
selector: 'app-add-email-to-account-migration-modal',
|
||||
templateUrl: './add-email-to-account-migration-modal.component.html',
|
||||
styleUrls: ['./add-email-to-account-migration-modal.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [NgIf, ReactiveFormsModule]
|
||||
})
|
||||
export class AddEmailToAccountMigrationModalComponent implements OnInit {
|
||||
|
||||
@Input({required: true}) username!: string;
|
||||
@Input({required: true}) password!: string;
|
||||
|
||||
isSaving: boolean = false;
|
||||
registerForm: FormGroup = new FormGroup({});
|
||||
emailLink: string = '';
|
||||
emailLinkUrl: SafeUrl | undefined;
|
||||
error: string = '';
|
||||
|
||||
constructor(private accountService: AccountService, private modal: NgbActiveModal,
|
||||
private toastr: ToastrService, private readonly cdRef: ChangeDetectorRef) {
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.registerForm.addControl('username', new FormControl(this.username, [Validators.required]));
|
||||
this.registerForm.addControl('email', new FormControl('', [Validators.required, Validators.email]));
|
||||
this.registerForm.addControl('password', new FormControl(this.password, [Validators.required, Validators.minLength(6), Validators.maxLength(32)]));
|
||||
this.cdRef.markForCheck();
|
||||
}
|
||||
|
||||
close() {
|
||||
this.modal.close(false);
|
||||
}
|
||||
|
||||
save() {
|
||||
const model = this.registerForm.getRawValue();
|
||||
model.sendEmail = false;
|
||||
this.accountService.migrateUser(model).subscribe(async () => {
|
||||
this.toastr.success('Email has been validated');
|
||||
this.modal.close(true);
|
||||
}, err => {
|
||||
this.error = err;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
@ -4,7 +4,6 @@ import { ConfirmEmailComponent } from './_components/confirm-email/confirm-email
|
|||
import { RegistrationRoutingModule } from './registration.router.module';
|
||||
import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { ReactiveFormsModule } from '@angular/forms';
|
||||
import { AddEmailToAccountMigrationModalComponent } from './_modals/add-email-to-account-migration-modal/add-email-to-account-migration-modal.component';
|
||||
import { UserLoginComponent } from './user-login/user-login.component';
|
||||
import { ConfirmEmailChangeComponent } from './_components/confirm-email-change/confirm-email-change.component';
|
||||
import { ConfirmMigrationEmailComponent } from './_components/confirm-migration-email/confirm-migration-email.component';
|
||||
|
|
@ -12,6 +11,7 @@ import { ConfirmResetPasswordComponent } from './_components/confirm-reset-passw
|
|||
import { RegisterComponent } from './_components/register/register.component';
|
||||
import { ResetPasswordComponent } from './_components/reset-password/reset-password.component';
|
||||
import { SplashContainerComponent } from './_components/splash-container/splash-container.component';
|
||||
import {TRANSLOCO_SCOPE, TranslocoModule} from "@ngneat/transloco";
|
||||
|
||||
|
||||
|
||||
|
|
@ -24,15 +24,15 @@ import { SplashContainerComponent } from './_components/splash-container/splash-
|
|||
ConfirmEmailComponent,
|
||||
SplashContainerComponent,
|
||||
RegisterComponent,
|
||||
AddEmailToAccountMigrationModalComponent,
|
||||
ConfirmMigrationEmailComponent,
|
||||
ResetPasswordComponent,
|
||||
ConfirmResetPasswordComponent,
|
||||
UserLoginComponent,
|
||||
ConfirmEmailChangeComponent
|
||||
ConfirmEmailChangeComponent,
|
||||
TranslocoModule
|
||||
],
|
||||
exports: [
|
||||
SplashContainerComponent
|
||||
]
|
||||
],
|
||||
})
|
||||
export class RegistrationModule { }
|
||||
|
|
|
|||
|
|
@ -1,34 +1,37 @@
|
|||
<app-splash-container>
|
||||
<ng-container title><h2>Login</h2></ng-container>
|
||||
<ng-container *transloco="let t; read: 'login'">
|
||||
<app-splash-container>
|
||||
<ng-container title><h2>{{t('title')}}</h2></ng-container>
|
||||
<ng-container body>
|
||||
<ng-container *ngIf="isLoaded">
|
||||
<form [formGroup]="loginForm" (ngSubmit)="login()" novalidate class="needs-validation" *ngIf="!firstTimeFlow">
|
||||
<div class="card-text">
|
||||
<div class="mb-3">
|
||||
<label for="username" class="form-label visually-hidden">Username</label>
|
||||
<input class="form-control custom-input" formControlName="username" id="username" type="text" autofocus placeholder="Username">
|
||||
</div>
|
||||
<ng-container *ngIf="isLoaded">
|
||||
<form [formGroup]="loginForm" (ngSubmit)="login()" novalidate class="needs-validation" *ngIf="!firstTimeFlow">
|
||||
<div class="card-text">
|
||||
<div class="mb-3">
|
||||
<label for="username" class="form-label visually-hidden">{{t('username')}}</label>
|
||||
<input class="form-control custom-input" formControlName="username" id="username"
|
||||
type="text" autofocus [placeholder]="t('username')">
|
||||
</div>
|
||||
|
||||
<div class="mb-2">
|
||||
<label for="password" class="form-label visually-hidden">Password</label>
|
||||
<input class="form-control custom-input" formControlName="password" name="password"
|
||||
id="password" type="password" pattern="^.{6,32}$" placeholder="Password">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="loginForm.get('password')?.errors?.pattern" >
|
||||
<div class="" *ngIf="loginForm.get('password')?.errors?.pattern">
|
||||
Password must be between 6 and 32 characters in length
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<a routerLink="/registration/reset-password" style="color: white">Forgot Password?</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="btn btn-secondary alt" type="submit" [disabled]="isSubmitting">Submit</button>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label for="password" class="form-label visually-hidden">{{t('password')}}</label>
|
||||
<input class="form-control custom-input" formControlName="password" name="password"
|
||||
id="password" type="password" pattern="^.{6,32}$" [placeholder]="t('password')">
|
||||
<div id="inviteForm-validations" class="invalid-feedback" *ngIf="loginForm.get('password')?.errors?.pattern" >
|
||||
<div class="" *ngIf="loginForm.get('password')?.errors?.pattern">
|
||||
{{t('password-validation')}}
|
||||
</div>
|
||||
</form>
|
||||
</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<a routerLink="/registration/reset-password" style="color: white">{{t('forgot-password')}}</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="btn btn-secondary alt" type="submit" [disabled]="isSubmitting">{{t('submit')}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
</app-splash-container>
|
||||
</app-splash-container>
|
||||
</ng-container>
|
||||
|
|
|
|||
|
|
@ -4,13 +4,13 @@ import { Router, RouterLink } from '@angular/router';
|
|||
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { ToastrService } from 'ngx-toastr';
|
||||
import { take } from 'rxjs/operators';
|
||||
import { AddEmailToAccountMigrationModalComponent } from '../_modals/add-email-to-account-migration-modal/add-email-to-account-migration-modal.component';
|
||||
import { User } from '../../_models/user';
|
||||
import { AccountService } from '../../_services/account.service';
|
||||
import { MemberService } from '../../_services/member.service';
|
||||
import { NavService } from '../../_services/nav.service';
|
||||
import { NgIf } from '@angular/common';
|
||||
import { SplashContainerComponent } from '../_components/splash-container/splash-container.component';
|
||||
import {TRANSLOCO_SCOPE, TranslocoModule} from "@ngneat/transloco";
|
||||
|
||||
|
||||
@Component({
|
||||
|
|
@ -19,7 +19,13 @@ import { SplashContainerComponent } from '../_components/splash-container/splash
|
|||
styleUrls: ['./user-login.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [SplashContainerComponent, NgIf, ReactiveFormsModule, RouterLink]
|
||||
imports: [SplashContainerComponent, NgIf, ReactiveFormsModule, RouterLink, TranslocoModule],
|
||||
providers: [
|
||||
{
|
||||
provide: TRANSLOCO_SCOPE,
|
||||
useValue: 'login'
|
||||
}
|
||||
]
|
||||
})
|
||||
export class UserLoginComponent implements OnInit {
|
||||
|
||||
|
|
@ -73,14 +79,6 @@ export class UserLoginComponent implements OnInit {
|
|||
});
|
||||
}
|
||||
|
||||
onAdminCreated(user: User | null) {
|
||||
if (user != null) {
|
||||
this.firstTimeFlow = false;
|
||||
this.cdRef.markForCheck();
|
||||
} else {
|
||||
this.toastr.error('There was an issue creating the new user. Please refresh and try again.');
|
||||
}
|
||||
}
|
||||
|
||||
login() {
|
||||
const model = this.loginForm.getRawValue();
|
||||
|
|
@ -102,14 +100,7 @@ export class UserLoginComponent implements OnInit {
|
|||
this.isSubmitting = false;
|
||||
this.cdRef.markForCheck();
|
||||
}, err => {
|
||||
if (err.error === 'You are missing an email on your account. Please wait while we migrate your account.') {
|
||||
const modalRef = this.modalService.open(AddEmailToAccountMigrationModalComponent, { scrollable: true, size: 'md' });
|
||||
modalRef.componentInstance.username = model.username;
|
||||
modalRef.closed.pipe(take(1)).subscribe(() => {
|
||||
});
|
||||
} else {
|
||||
this.toastr.error(err.error);
|
||||
}
|
||||
this.toastr.error(err.error);
|
||||
this.isSubmitting = false;
|
||||
this.cdRef.markForCheck();
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue