From 53311438aef3379c640714a5f642f4bac32b76d3 Mon Sep 17 00:00:00 2001 From: Igor Propisnov Date: Mon, 9 Sep 2024 16:56:12 +0200 Subject: [PATCH] improve login --- .../src/cron/clear-expired-sesstions.cron.ts | 2 +- .../auth-module/strategies/local.strategy.ts | 5 +++ .../services/email-verification.service.ts | 17 +++++--- .../welcome-root/welcome-root.component.html | 41 +++++++++++++------ .../welcome-root/welcome-root.component.ts | 4 ++ .../src/app/shared/service/theme.service.ts | 2 +- frontend/tailwind.config.js | 4 +- 7 files changed, 52 insertions(+), 23 deletions(-) diff --git a/backend/src/cron/clear-expired-sesstions.cron.ts b/backend/src/cron/clear-expired-sesstions.cron.ts index 6cc0e4a..5c4b4e1 100644 --- a/backend/src/cron/clear-expired-sesstions.cron.ts +++ b/backend/src/cron/clear-expired-sesstions.cron.ts @@ -22,7 +22,7 @@ export class ClearExpiredSessionsCron { this.logger.log('-------------------------------------------'); } - @Cron(CronExpression.EVERY_10_MINUTES, { + @Cron(CronExpression.EVERY_5_MINUTES, { name: 'Clear-Expired-Tokens', timeZone: 'Europe/Berlin', }) diff --git a/backend/src/modules/auth-module/strategies/local.strategy.ts b/backend/src/modules/auth-module/strategies/local.strategy.ts index fac77af..66bc285 100644 --- a/backend/src/modules/auth-module/strategies/local.strategy.ts +++ b/backend/src/modules/auth-module/strategies/local.strategy.ts @@ -34,6 +34,11 @@ export class LocalStrategy extends PassportStrategy(Strategy) { request.headers['user-agent'] ); + this.emailVerificationService.removeEmailVerificationByTokenAndEmail( + token as string, + email as string + ); + if (!verificationResult.success) { throw new UnauthorizedException('Invalid or expired token'); } diff --git a/backend/src/modules/verify-module/services/email-verification.service.ts b/backend/src/modules/verify-module/services/email-verification.service.ts index cd15c73..3fbf474 100644 --- a/backend/src/modules/verify-module/services/email-verification.service.ts +++ b/backend/src/modules/verify-module/services/email-verification.service.ts @@ -23,7 +23,7 @@ export class EmailVerificationService { ): Promise { try { const verificationToken = await this.createVerificationToken(); - const expiresAt = new Date(Date.now() + 10 * 60 * 1000); + const expiresAt = new Date(Date.now() + 5 * 60 * 1000); await this.emailVerifyRepository.createEmailVerification( verificationToken, @@ -73,11 +73,6 @@ export class EmailVerificationService { throw new TokenExpiredException(); } - await this.emailVerifyRepository.removeEmailVerificationByTokenAndEmail( - tokenToVerify, - emailToVerify - ); - return { success: true }; } catch (error) { if (error instanceof TokenExpiredException) { @@ -92,6 +87,16 @@ export class EmailVerificationService { } } + public async removeEmailVerificationByTokenAndEmail( + token: string, + email: string + ): Promise { + await this.emailVerifyRepository.removeEmailVerificationByTokenAndEmail( + token, + email + ); + } + public async deleteAllExpiredTokens(): Promise { await this.emailVerifyRepository.deleteAllExpiredTokens(); } diff --git a/frontend/src/app/pages/welcome-root/welcome-root.component.html b/frontend/src/app/pages/welcome-root/welcome-root.component.html index 8dd92a7..eca24b6 100644 --- a/frontend/src/app/pages/welcome-root/welcome-root.component.html +++ b/frontend/src/app/pages/welcome-root/welcome-root.component.html @@ -457,7 +457,12 @@
+ [class.opacity-100]="isVerifying() || isAutoLoginInProgress()" + [class.opacity-0]="!isVerifying() && !isAutoLoginInProgress()">
+ [class.opacity-0]=" + !isTokenVerified() || verificationError() || isAutoLoginInProgress() + " + [class.opacity-100]=" + isTokenVerified() && + !verificationError() && + !isAutoLoginInProgress() + ">

{{ - isTokenVerified() && !verificationError() + isTokenVerified() && !verificationError() && !isAutoLoginInProgress() ? 'Verification Complete' - : verificationError() - ? 'Verification Failed' - : 'Verifying Your Account' + : isAutoLoginInProgress() + ? 'Logging You In' + : verificationError() + ? 'Verification Failed' + : 'Verifying Your Account' }}

{{ - isTokenVerified() && !verificationError() + isTokenVerified() && !verificationError() && !isAutoLoginInProgress() ? 'Your email has been successfully verified.' - : verificationError() - ? verificationError() - : 'Please wait while we verify your email and token.' + : isAutoLoginInProgress() + ? 'Please wait while we automatically log you in.' + : verificationError() + ? verificationError() + : 'Please wait while we verify your email and token.' }}

@if (errorReasons().length > 0) { diff --git a/frontend/src/app/pages/welcome-root/welcome-root.component.ts b/frontend/src/app/pages/welcome-root/welcome-root.component.ts index c435ae8..94d5d83 100644 --- a/frontend/src/app/pages/welcome-root/welcome-root.component.ts +++ b/frontend/src/app/pages/welcome-root/welcome-root.component.ts @@ -333,12 +333,16 @@ export class WelcomeRootComponent implements OnInit { this.displaySkeleton.set(false); this.isTokenVerified.set(true); if (!isSignup) { + this.isAutoLoginInProgress.set(true); timer(2000).subscribe(() => { this.authService .signinMagicLink({ email, token }) .subscribe((response: SigninResponseDtoApiModel) => { if (response) { this.router.navigate(['/dashboard']); + } else { + this.isAutoLoginInProgress.set(false); + // Handle login failure } }); }); diff --git a/frontend/src/app/shared/service/theme.service.ts b/frontend/src/app/shared/service/theme.service.ts index 50a7cb5..f3bfd79 100644 --- a/frontend/src/app/shared/service/theme.service.ts +++ b/frontend/src/app/shared/service/theme.service.ts @@ -23,7 +23,7 @@ export class ThemeService { } public toggleTheme(): void { - this.currentTheme = this.currentTheme === 'light' ? 'dark' : 'light'; + this.currentTheme = this.currentTheme === 'light' ? 'sunset' : 'light'; this.setTheme(this.currentTheme); } diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js index 272b1e9..80f27e3 100644 --- a/frontend/tailwind.config.js +++ b/frontend/tailwind.config.js @@ -8,8 +8,8 @@ module.exports = { }, plugins: [require('daisyui'), require('tailwindcss-animated')], daisyui: { - themes: ["light", "dark"], - darkMode: ['class', '[data-theme="dark"]'] + themes: ["light", "sunset"], + darkMode: ['class', '[data-theme="sunset"]'], } }