update projects component

web/src/app/app.routes.ts

@@ -1,16 +1,16 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
-import { LoginComponent } from './login/login.component';
-import { SignupComponent } from './signup/signup.component';
-import { HelloWorldComponent } from './hello-world/hello-world.component';
-import { AuthGuard } from './services/auth.guard';
-import { HomeComponent } from './home/home.component';
+import { LoginComponent } from './components/login/login.component';
+import { SignupComponent } from './components/signup/signup.component';
+import { AuthGuard } from './components/services/auth.guard';
+import { HomeComponent } from './components/home/home.component';
+import { ProjectsComponent } from './components/projects/projects.component';
 
 export const routes: Routes = [
     { path: '', component: HomeComponent },
     { path: 'login', component: LoginComponent },
     { path: 'signup', component: SignupComponent },
-    { path: 'hello-world', component: HelloWorldComponent, canActivate: [AuthGuard] },
+    { path: 'projects', component: ProjectsComponent, canActivate: [AuthGuard] },
     { path: '**', redirectTo: '' }
 ];
 

web/src/app/home/home.component.html → web/src/app/components/home/home.component.html

@@ -2,13 +2,15 @@
     <h1 class="display-5 fw-bold text-body-emphasis">Welcome to ResDEEDS</h1>
     <div class="col-lg-6 mx-auto">
       <p class="lead mb-4">The Resilience Development for Electric Energy Delivery Systems (ResDEEDS) tool walks users through the process of evaluating electric energy delivery systems (EEDS) for resiliency. It implements the steps of the INL Resilience Framework for EEDS and provides automated tracking of resilience planning and suggestions for mitigating hazards.</p>
-      <div *ngIf="!authService.isAuthenticated(); else loggedIn"class="d-grid gap-2 d-sm-flex justify-content-sm-center">
+      <div *ngIf="!authService.isAuthenticated(); else loggedIn" class="d-grid gap-2 d-sm-flex justify-content-sm-center">
           <a type="button" class="btn btn-primary btn-lg px-4 gap-3" href="/signup">Sign Up</a>
           <a type="button" class="btn btn-outline-secondary btn-lg px-4" href="/login">Login</a>
       </div>
       <ng-template #loggedIn>
-        <a type="button" class="btn btn-primary btn-lg px-4 gap-3" href="/hello-world">Dashboard</a>
-        <a type="button" class="btn btn-outline-secondary btn-lg px-4" (click)="logout()">Logout</a>
+        <div class="d-grid gap-2 d-sm-flex justify-content-sm-center">
+          <a type="button" class="btn btn-primary btn-lg px-4 gap-3" href="/projects">Dashboard</a>
+          <a type="button" class="btn btn-outline-secondary btn-lg px-4" (click)="logout()">Logout</a>
+        </div>
       </ng-template>
     </div>
   </div>

web/src/app/login/login.component.ts → web/src/app/components/login/login.component.ts

@@ -21,7 +21,7 @@ export class LoginComponent {
     const loginSuccess = await this.authService.login(this.email, this.password);
 
     if (loginSuccess) {
-      this.router.navigate(['/hello-world']);
+      this.router.navigate(['/projects']);
     } else {
       this.errorMessage = 'Login failed';
     }

web/src/app/navbar/navbar.component.html → web/src/app/components/navbar/navbar.component.html

@@ -19,7 +19,7 @@
             <a *ngIf="!authService.isAuthenticated()" class="nav-link" routerLink="/signup">Sign Up</a>
           </li>
           <li class="nav-item">
-            <a *ngIf="authService.isAuthenticated()" class="nav-link" routerLink="/hello-world">Dashboard</a>
+            <a *ngIf="authService.isAuthenticated()" class="nav-link" routerLink="/projects">Dashboard</a>
         </li>
           <li class="nav-item">
               <a *ngIf="authService.isAuthenticated()" class="nav-link" (click)="logout()">Logout</a>

web/src/app/components/projects/projects.component.html

@@ -0,0 +1,7 @@
+<div class="container">
+  <div class="row">
+    <div class="col-md-12">
+      <h1>Projects</h1>
+      <p>Here we have a list of projects!</p>
+    </div>
+  </div>

web/src/app/hello-world/hello-world.component.spec.ts → web/src/app/components/projects/projects.component.spec.ts

@@ -1,18 +1,18 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { HelloWorldComponent } from './hello-world.component';
+import { ProjectsComponent } from './projects.component';
 
-describe('HelloWorldComponent', () => {
-  let component: HelloWorldComponent;
-  let fixture: ComponentFixture<HelloWorldComponent>;
+describe('ProjectsComponent', () => {
+  let component: ProjectsComponent;
+  let fixture: ComponentFixture<ProjectsComponent>;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [HelloWorldComponent]
+      imports: [ProjectsComponent]
     })
     .compileComponents();
 
-    fixture = TestBed.createComponent(HelloWorldComponent);
+    fixture = TestBed.createComponent(ProjectsComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });

web/src/app/components/projects/projects.component.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-projects',
+  imports: [],
+  templateUrl: './projects.component.html',
+  styleUrl: './projects.component.scss'
+})
+export class ProjectsComponent {
+
+}

web/src/main.ts

@@ -1,6 +1,6 @@
 import { bootstrapApplication } from '@angular/platform-browser';
 import { appConfig } from './app/app.config';
-import { AppComponent } from './app/app.component';
+import { AppComponent } from './app/components/app.component';
 
 bootstrapApplication(AppComponent, appConfig)
   .catch((err) => console.error(err));