added CryptoJS

package-lock.json

@@ -19,6 +19,7 @@
         "@angular/router": "^17.2.0",
         "@ngx-translate/core": "^15.0.0",
         "@ngx-translate/http-loader": "^8.0.0",
+        "crypto-js": "^4.2.0",
         "ngx-color-picker": "^16.0.0",
         "rxjs": "~7.8.0",
         "tslib": "^2.3.0",
@@ -28,6 +29,7 @@
         "@angular-devkit/build-angular": "^17.2.1",
         "@angular/cli": "^17.2.1",
         "@angular/compiler-cli": "^17.2.0",
+        "@types/crypto-js": "^4.2.2",
         "@types/jasmine": "~5.1.0",
         "jasmine-core": "~5.1.0",
         "karma": "~6.4.0",
@@ -4354,6 +4356,12 @@
         "@types/node": "*"
       }
     },
+    "node_modules/@types/crypto-js": {
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@types/crypto-js/-/crypto-js-4.2.2.tgz",
+      "integrity": "sha512-sDOLlVbHhXpAUAL0YHDUUwDZf3iN4Bwi4W6a0W0b+QcAezUbRtH4FVb+9J4h+XFPW7l/gQ9F8qC7P+Ec4k8QVQ==",
+      "dev": true
+    },
     "node_modules/@types/eslint": {
       "version": "8.56.6",
       "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.56.6.tgz",
@@ -6076,6 +6084,11 @@
         "node": ">= 8"
       }
     },
+    "node_modules/crypto-js": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.2.0.tgz",
+      "integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q=="
+    },
     "node_modules/css-loader": {
       "version": "6.10.0",
       "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-6.10.0.tgz",

package.json

@@ -21,6 +21,7 @@
     "@angular/router": "^17.2.0",
     "@ngx-translate/core": "^15.0.0",
     "@ngx-translate/http-loader": "^8.0.0",
+    "crypto-js": "^4.2.0",
     "ngx-color-picker": "^16.0.0",
     "rxjs": "~7.8.0",
     "tslib": "^2.3.0",
@@ -30,6 +31,7 @@
     "@angular-devkit/build-angular": "^17.2.1",
     "@angular/cli": "^17.2.1",
     "@angular/compiler-cli": "^17.2.0",
+    "@types/crypto-js": "^4.2.2",
     "@types/jasmine": "~5.1.0",
     "jasmine-core": "~5.1.0",
     "karma": "~6.4.0",

src/app/app.component.html

@@ -1,4 +1,4 @@
-@if (this.isLoggedIn === undefined) {
+@if (this.isLoggedIn === null) {
 <router-outlet></router-outlet>
 <app-overlay></app-overlay>
 } @else {

src/app/app.component.ts

@@ -48,7 +48,7 @@ export class AppComponent {
   }
 
   ngOnInit() {
-    if (this.isLoggedIn === undefined) {
+    if (this.isLoggedIn === null) {
       this.checkPwResetRoute();
     } else {
       this.router.navigate(['/summary']);

src/app/services/firebase.service.ts

@@ -13,12 +13,15 @@ import {
 } from '@angular/fire/firestore';
 import { Task } from '../interfaces/task.interface';
 import { User } from '../interfaces/user.interface';
+import * as CryptoJS from 'crypto-js';
+import { CryptoJSSecretKey } from './../environments/config';
 
 @Injectable({
   providedIn: 'root',
 })
 export class FirebaseService implements OnDestroy {
   firestore: Firestore = inject(Firestore);
+  private secretKey: string = CryptoJSSecretKey.secretKey;
 
   allTasks: Task[] = [];
   filteredTasks: Task[] = [];
@@ -130,10 +133,13 @@ export class FirebaseService implements OnDestroy {
   }
 
   getCurrentUserId() {
-    let currentUser = localStorage.getItem('currentUserJOIN');
+    const encryptedValue = localStorage.getItem('currentUserJOIN');
-    if (currentUser !== null) {
+    if (encryptedValue) {
-      return JSON.parse(currentUser);
+      const bytes = CryptoJS.AES.decrypt(encryptedValue, this.secretKey);
+      const decryptedValue = bytes.toString(CryptoJS.enc.Utf8);
+      return JSON.parse(decryptedValue);
     }
+    return null;
   }
 
   getUserDetails(userId: string, query: keyof User) {

src/app/services/login.service.ts

@@ -22,6 +22,9 @@ import {
 import { SharedService } from './shared.service';
 import { User } from '../interfaces/user.interface';
 import { Router } from '@angular/router';
+import * as CryptoJS from 'crypto-js';
+import { CryptoJSSecretKey } from './../environments/config';
+
 @Injectable({
   providedIn: 'root',
 })
@@ -31,6 +34,8 @@ export class LoginService {
   passwordIcon: string = './../../../assets/img/login/close-eye.svg';
   errorCode: string = '';
 
+  private secretKey: string = CryptoJSSecretKey.secretKey;
+
   constructor(
     private firebaseService: FirebaseService,
     public sharedService: SharedService,
@@ -43,7 +48,7 @@ export class LoginService {
         const user = userCredential.user;
         const userData = this.firebaseService.getUserDataFromUid(user.uid);
         if (userData.length > 0 && userData[0].id) {
-          this.getUserIdInLocalStorage(userData[0].id);
+          this.getUserIdInLocalStorage(this.secretKey, userData[0].id);
           this.updateUserOnlineStatus(userData[0].id, true);
         }
       })
@@ -156,7 +161,7 @@ export class LoginService {
   ifExistUser(user: string) {
     const userData = this.firebaseService.getUserDataFromUid(user);
     if (userData.length > 0 && userData[0].id) {
-      this.getUserIdInLocalStorage(userData[0].id);
+      this.getUserIdInLocalStorage(this.secretKey, userData[0].id);
       this.updateUserOnlineStatus(userData[0].id, true);
     }
   }
@@ -182,8 +187,12 @@ export class LoginService {
         : './../../../assets/img/login/close-eye.svg';
   }
 
-  getUserIdInLocalStorage(userId: string) {
+  getUserIdInLocalStorage(key: string, userId: string): void {
-    localStorage.setItem('currentUserJOIN', JSON.stringify(userId));
+    const encryptedValue = CryptoJS.AES.encrypt(
+      JSON.stringify(userId),
+      this.secretKey
+    ).toString();
+    localStorage.setItem('currentUserJOIN', encryptedValue);
   }
 
   // LOGOUT