Deploy nginx

AngularNoSTD/src/app/app-routing.module.ts

@@ -44,7 +44,7 @@ const routes: Routes = [
 ];
 
 @NgModule({
-  imports: [RouterModule.forRoot(routes)],
+  imports: [RouterModule.forRoot(routes, { scrollPositionRestoration: 'top' })],
   exports: [RouterModule]
 })
 export class AppRoutingModule { }

AngularNoSTD/src/app/components/loan/loan.component.html

@@ -6,11 +6,11 @@
 </head>
 
 <div class="container mx-auto ">
-  <h2 class="text-2xl font-bold mb-4 text-gray-800  ">
+  <h2 class="text-2xl font-bold mb-4    ">
     Loan Management
   </h2>
 
-  <div class="card bg-white shadow-xl mb-6">
+  <div class="card bg-base-100  shadow-xl mb-6">
     <div class="card-body">
       <div *ngIf="showAlert" class="alert" [class.alert-success]="alertType === 'success'"
            [class.alert-error]="alertType === 'error'" [class.alert-info]="alertType === 'info'">
@@ -22,62 +22,62 @@ <h2 class="text-2xl font-bold mb-4 text-gray-800  ">
                     </span>
         </div>
       </div>
-      <h3 class="card-title text-xl font-semibold text-gray-700 flex items-center mb-4">
+      <h3 class="card-title text-xl font-semibold   flex items-center mb-4">
         <i class="fas fa-hand-holding-dollar mr-2"></i>
         Create Loan
       </h3>
       <div class="grid grid-cols-2 gap-6">
         <div class="form-control">
           <label class="label">
-            <span class="label-text text-gray-600"><i class="fas fa-user mr-1"></i> User ID</span>
+            <span class="label-text  "><i class="fas fa-user mr-1"></i> User ID</span>
           </label>
-          <input type="number" placeholder="User Id" class="input input-bordered w-full" [(ngModel)]="loanRequest.userId" />
+          <input disabled type="number" placeholder="User Id" class="input input-bordered w-full" [(ngModel)]="loanRequest.userId" />
         </div>
         <div class="form-control">
           <label class="label">
-            <span class="label-text text-gray-600"><i class="fas fa-file-lines mr-1"></i> Loan Intent</span>
+            <span class="label-text  "><i class="fas fa-file-lines mr-1"></i> Loan Intent</span>
           </label>
           <select class="select select-bordered w-full" [(ngModel)]="loanRequest.loanIntent">
             <option *ngFor="let intent of loanIntentOptions" [value]="intent">{{intent}}</option>
           </select>
         </div>
         <div class="form-control">
           <label class="label">
-            <span class="label-text text-gray-600"><i class="fas fa-scale-balanced mr-1"></i> Loan Grade</span>
+            <span class="label-text  "><i class="fas fa-scale-balanced mr-1"></i> Loan Grade</span>
           </label>
           <select class="select select-bordered w-full" [(ngModel)]="loanRequest.loanGrade">
             <option *ngFor="let grade of loanGradeOptions" [value]="grade">{{grade}}</option>
           </select>
         </div>
         <div class="form-control">
           <label class="label">
-            <span class="label-text text-gray-600"><i class="fas fa-hand-holding-dollar mr-1"></i> Loan Amount</span>
+            <span class="label-text  "><i class="fas fa-hand-holding-dollar mr-1"></i> Loan Amount</span>
           </label>
           <input type="number" placeholder="Loan Amount" class="input input-bordered w-full" [(ngModel)]="loanRequest.loanAmount" />
         </div>
         <div class="form-control">
           <label class="label">
-            <span class="label-text text-gray-600"><i class="fas fa-percent mr-1"></i> Loan Interest Rate</span>
+            <span class="label-text  "><i class="fas fa-percent mr-1"></i> Loan Interest Rate</span>
           </label>
           <input type="number" placeholder="Loan Interest Rate" class="input input-bordered w-full" [(ngModel)]="loanRequest.loanInterestRate" />
         </div>
         <div class="form-control">
           <label class="label">
-            <span class="label-text text-gray-600"><i class="fas fa-percent mr-1"></i> Loan Percent Income</span>
+            <span class="label-text  "><i class="fas fa-percent mr-1"></i> Loan Percent Income</span>
           </label>
           <input type="number" placeholder="Loan Percent Income" class="input input-bordered w-full" [(ngModel)]="loanRequest.loanPercentIncome" />
         </div>
         <div class="form-control">
           <label class="label">
-            <span class="label-text text-gray-600"><i class="fas fa-file-lines mr-1"></i> CB Person Default On File</span>
+            <span class="label-text  "><i class="fas fa-file-lines mr-1"></i> CB Person Default On File</span>
           </label>
           <select class="select select-bordered w-full" [(ngModel)]="loanRequest.cbPersonDefaultOnFile">
             <option *ngFor="let option of cbPersonDefaultOnFileOptions" [value]="option">{{option}}</option>
           </select>
         </div>
         <div class="form-control">
           <label class="label">
-            <span class="label-text text-gray-600"><i class="fas fa-calendar-check mr-1"></i> CB Person Credit History Length</span>
+            <span class="label-text  "><i class="fas fa-calendar-check mr-1"></i> CB Person Credit History Length</span>
           </label>
           <input type="number" placeholder="CB Person Credit History Length" class="input input-bordered w-full" [(ngModel)]="loanRequest.cbPersonCredHistLength" />
         </div>
@@ -92,7 +92,7 @@ <h3 class="card-title text-xl font-semibold text-gray-700 flex items-center mb-4
 
   <div *ngIf="userLoans && userLoans.length > 0" class="card bg-white shadow-xl mt-6">
     <div class="card-body">
-      <h3 class="card-title text-xl font-semibold text-gray-700 flex items-center mb-4">
+      <h3 class="card-title text-xl font-semibold   flex items-center mb-4">
         <i class="fas fa-chart-line mr-2"></i>
         Loan Details
       </h3>

AngularNoSTD/src/app/components/loan/loan.component.ts

@@ -1,5 +1,6 @@
 import { Component } from '@angular/core';
 import { LoanService } from '../../services/loan/loan.service';
+import { UserService } from '../../services/user/user.service'; // Import UserService
 
 interface LoanRequest {
   userId: number;
@@ -40,11 +41,11 @@ export class LoanComponent {
     userId: 1,
     loanIntent: "PERSONAL",
     loanGrade: "D",
-    loanAmount: 35000.00,
-    loanInterestRate: 16.02,
-    loanPercentIncome: 0.59,
+    loanAmount: 0.00,
+    loanInterestRate: 0.00,
+    loanPercentIncome: 0.00,
     cbPersonDefaultOnFile: "Y",
-    cbPersonCredHistLength: 3,
+    cbPersonCredHistLength: 0,
   };
   loanId: number | null = null;
   loanStatus: number | null = null;
@@ -61,9 +62,20 @@ export class LoanComponent {
   loanGradeOptions: string[] = ["A", "B", "C", "D", "E", "F", "G"];
   personHomeOwnershipOptions: string[] = ["RENT", "OWN", "MORTGAGE", "OTHER"];
   cbPersonDefaultOnFileOptions: string[] = ["Y", "N"];
-  constructor(private loanService: LoanService) { }
+
+  userId: number | null = null; // Add userId property
+  loading: boolean = false;
+  error: string | null = null;
+
+
+  constructor(private loanService: LoanService, private userService: UserService) { } // Inject UserService
 
   createLoan() {
+    if(this.userId == null){
+      this.showAlertMessage('User ID not available. Please login', 'error');
+      return
+    }
+    this.loanRequest.userId = this.userId;
     this.loanService.createLoan(this.loanRequest).subscribe({
       next: (response) => {
         this.loanResponse = response;
@@ -79,12 +91,17 @@ export class LoanComponent {
     });
   }
   fetchUserLoans() {
-    this.loanService.getLoansByUserId(1).subscribe({
+    if (this.userId == null){
+      this.showAlertMessage('User ID not available. Please login', 'error');
+      return
+    }
+    this.loanService.getLoansByUserId(this.userId).subscribe({
       next: (response) => {
         this.userLoans = response;
       },
       error: (err) =>{
-        console.log("Error fetching loans for user 1");
+        console.log("Error fetching loans for user ", this.userId);
+        this.showAlertMessage('Error fetching loan!', 'error');
       }
     });
   }
@@ -117,6 +134,38 @@ export class LoanComponent {
     }, 3000);
   }
   ngOnInit(){
-    this.fetchUserLoans();
+    this.validateAndLoadProfile();
+    //this.fetchUserLoans(); // removed fetch here , since the profile loading takes time,
+    // we have to get the user Id before the fetching user loans.
+
   }
+
+
+  validateAndLoadProfile(): void {
+    if (typeof window !== 'undefined' && typeof localStorage !== 'undefined') {
+      const token = localStorage.getItem('token');
+      if (!token) {
+        this.error = 'No token found. Please log in.';
+        return;
+      }
+
+      this.loading = true;
+      this.userService.validateToken(token).subscribe({
+        next: (response) => {
+          const { user } = response; // Only get the user object
+          this.userId = user.id; // Extract user ID and assign it
+          this.loading = false;
+          this.fetchUserLoans();
+        },
+        error: (err) => {
+          this.error = 'Failed to validate token or load profile data.';
+          console.error(err);
+          this.loading = false;
+        },
+      });
+    } else {
+      this.error = 'Local storage is not available.';
+    }
+  }
+
 }

AngularNoSTD/src/app/services/auth/auth.service.ts

@@ -6,7 +6,7 @@ import { Observable } from 'rxjs';
   providedIn: 'root',
 })
 export class AuthService {
-  private apiUrl = 'http://localhost:8222/api/auth'; // Adjust the URL if needed
+  private apiUrl = 'http://a9761a9b3f8034259b6153cee04be721-959097204.us-east-1.elb.amazonaws.com:8222/api/auth'; // Adjust the URL if needed
 
   constructor(private http: HttpClient) {}
 
@@ -40,19 +40,19 @@ export class AuthService {
       Authorization: `Bearer ${token}`,
       'Content-Type': 'application/json',
     });
-  
+
     // Get email from the token or user data
     const email = this.getEmailFromToken(token);
-  
+
     return this.http.get<any>(`${this.apiUrl}/users/email/${email}`, { headers });
   }
 
   getEmailFromToken(token: string | null): string {
     if (!token) return '';
-  
+
     const payload = JSON.parse(atob(token.split('.')[1]));  // Decode JWT payload
     return payload?.email || '';
   }
-  
-  
+
+
 }

AngularNoSTD/src/app/services/currency/currency.service.ts

@@ -7,7 +7,7 @@ import { CurrencyResponse } from '../../models/currency-response.model';
   providedIn: 'root'
 })
 export class CurrencyService {
-  private apiUrl = 'http://localhost:8222/api/currencies';
+  private apiUrl = 'http://a9761a9b3f8034259b6153cee04be721-959097204.us-east-1.elb.amazonaws.com:8222/api/currencies';
 
   constructor(private http: HttpClient) { }
 

AngularNoSTD/src/app/services/favorite-currency/favorite-currency.service.ts

@@ -9,7 +9,7 @@ import { UserService } from '../user/user.service';
   providedIn: 'root'
 })
 export class FavoriteCurrencyService {
-  private apiUrl = 'http://localhost:8222/api/users';
+  private apiUrl = 'http://a9761a9b3f8034259b6153cee04be721-959097204.us-east-1.elb.amazonaws.com:8222/api/users';
 
   constructor(private http: HttpClient, private userService: UserService) { }
 

AngularNoSTD/src/app/services/loan/loan.service.ts

@@ -41,7 +41,7 @@ interface PredictionResponse {
   providedIn: 'root'
 })
 export class LoanService {
-  private apiUrl = 'http://localhost:8676/api/loans';
+  private apiUrl = 'http://a9761a9b3f8034259b6153cee04be721-959097204.us-east-1.elb.amazonaws.com:8222/api/loans';
   private predictionUrl = 'http://127.0.0.1:5000/predict'
 
   constructor(private http: HttpClient) { }

AngularNoSTD/src/app/services/user/user.service.ts

@@ -6,9 +6,9 @@ import { Observable } from 'rxjs';
   providedIn: 'root',
 })
 export class UserService {
-  private authUrl = 'http://localhost:8222/api/auth';
-  private userUrl = 'http://localhost:8222/api/users';
-  private imgUrl = 'http://localhost:8222/users/public/images';
+  private authUrl = 'http://a9761a9b3f8034259b6153cee04be721-959097204.us-east-1.elb.amazonaws.com:8222/api/auth';
+  private userUrl = 'http://a9761a9b3f8034259b6153cee04be721-959097204.us-east-1.elb.amazonaws.com:8222/api/users';
+  private imgUrl = 'http://a9761a9b3f8034259b6153cee04be721-959097204.us-east-1.elb.amazonaws.com:8222/users/public/images';
 
   constructor(private http: HttpClient) {}
 

AngularNoSTD/src/app/services/wallet/wallet.service.ts

@@ -12,7 +12,7 @@ import { UserService } from '../user/user.service';
   providedIn: 'root'
 })
 export class WalletService {
-  private apiUrl = 'http://localhost:8222/api/wallets';
+  private apiUrl = 'http://a9761a9b3f8034259b6153cee04be721-959097204.us-east-1.elb.amazonaws.com:8222/api/wallets';
 
   constructor(private http: HttpClient, private userService: UserService) { }
 
@@ -77,4 +77,4 @@ export class WalletService {
       return throwError(() => new Error('Invalid transaction type'));
   }
 
-}
+}

AngularNoSTD/src/styles.scss

@@ -7,3 +7,27 @@
 * {
   scroll-behavior: smooth;
 }
+
+.input-bordered:focus {
+  outline: 2px solid #3498db !important;
+  box-shadow: none !important;
+}
+
+.select-bordered:focus{
+  outline: 2px solid #3498db !important;
+  box-shadow: none !important;
+}
+
+.btn-error, .btn-error:hover{
+  background-color: #ff0000;
+  color: white;
+  border: 0;
+}
+
+
+.btn-primary, .btn-primary:hover{
+  background-color: #008cff;
+  color: white;
+  border: 0;
+}
+