feat: routerlinks

client/src/app/home/home.html

@@ -13,8 +13,8 @@
   <li id="six">Answering your specific questions with a chat assistant</li>
 </ul>
 <div id="fade">
-  <a href="/products" class="btn">Browse Products</a>
+  <a routerLink="/products" class="btn">Browse Products</a>
-  <a href="/account" class="btn">Manage Account</a>
+  <a routerLink="/account" class="btn">Manage Account</a>
-  <a href="/settings" class="btn">Modify Settings</a>
+  <a routerLink="/settings" class="btn">Modify Settings</a>
-  <a href="/chat" class="btn">Chat with Hikari</a>
+  <a routerLink="/chat" class="btn">Chat with Hikari</a>
 </div>

client/src/app/home/home.ts

@@ -5,9 +5,10 @@
  */
 
 import { Component } from "@angular/core";
+import { RouterModule } from "@angular/router";
 
 @Component({
-  imports:     [],
+  imports:     [ RouterModule ],
   selector:    "app-home",
   styleUrl:    "./home.css",
   templateUrl: "./home.html",

client/src/app/nav/nav.html

@@ -5,13 +5,13 @@
     ></a
   >
   <div [class]="dropdownClass">
-    <a href="/products" class="nav-link">Products</a>
+    <a routerLink="/products" class="nav-link">Products</a>
     <hr />
-    <a href="/account" class="nav-link">Account</a>
+    <a routerLink="/account" class="nav-link">Account</a>
     <hr />
-    <a href="/settings" class="nav-link">Settings</a>
+    <a routerLink="/settings" class="nav-link">Settings</a>
     <hr />
-    <a href="/chat" class="nav-link">Chat</a>
+    <a routerLink="/chat" class="nav-link">Chat</a>
     <hr />
   </div>
   <i class="fa-solid fa-bars" *ngIf="!navOpen" (click)="toggleNav()"></i>

client/src/app/nav/nav.ts

@@ -6,9 +6,10 @@
 
 import { CommonModule } from "@angular/common";
 import { Component } from "@angular/core";
+import { RouterModule } from "@angular/router";
 
 @Component({
-  imports:     [ CommonModule ],
+  imports:     [ CommonModule, RouterModule ],
   selector:    "app-nav",
   styleUrl:    "./nav.css",
   templateUrl: "./nav.html",