Update Angular Dependencies

client/package.json

@@ -12,32 +12,32 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^18.2.4",
-    "@angular/cdk": "^18.2.4",
-    "@angular/common": "^18.2.4",
-    "@angular/compiler": "^18.2.4",
-    "@angular/core": "^18.2.4",
-    "@angular/forms": "^18.2.4",
-    "@angular/material": "^18.2.4",
-    "@angular/platform-browser": "^18.2.4",
-    "@angular/platform-browser-dynamic": "^18.2.4",
-    "@angular/router": "^18.2.4",
-    "ngxtension": "^4.0.0",
+    "@angular/animations": "^19.2.0",
+    "@angular/cdk": "^19.2.1",
+    "@angular/common": "^19.2.0",
+    "@angular/compiler": "^19.2.0",
+    "@angular/core": "^19.2.0",
+    "@angular/forms": "^19.2.0",
+    "@angular/material": "^19.2.1",
+    "@angular/platform-browser": "^19.2.0",
+    "@angular/platform-browser-dynamic": "^19.2.0",
+    "@angular/router": "^19.2.0",
+    "ngxtension": "^4.3.2",
     "rxjs": "~7.8.1",
     "tslib": "^2.7.0",
-    "zone.js": "^0.14.10"
+    "zone.js": "^0.15.0"
   },
   "devDependencies": {
-    "@angular-devkit/architect": "^0.1802.4",
-    "@angular-devkit/build-angular": "^18.2.4",
-    "@angular-eslint/builder": "~18.3.1",
-    "@angular-eslint/eslint-plugin": "~18.3.1",
-    "@angular-eslint/eslint-plugin-template": "~18.3.1",
-    "@angular-eslint/schematics": "~18.3.1",
-    "@angular-eslint/template-parser": "~18.3.1",
-    "@angular/cli": "^18.2.4",
-    "@angular/compiler-cli": "^18.2.4",
-    "@angular/language-service": "^18.2.4",
+    "@angular-devkit/architect": "^0.1902.0",
+    "@angular-devkit/build-angular": "^19.2.0",
+    "@angular-eslint/builder": "~19.1.0",
+    "@angular-eslint/eslint-plugin": "~19.1.0",
+    "@angular-eslint/eslint-plugin-template": "~19.1.0",
+    "@angular-eslint/schematics": "~19.1.0",
+    "@angular-eslint/template-parser": "~19.1.0",
+    "@angular/cli": "^19.2.0",
+    "@angular/compiler-cli": "^19.2.0",
+    "@angular/language-service": "^19.2.0",
     "@cypress/schematic": "^2.5.2",
     "@floogulinc/cypress-mongo-seeder": "^1.1.1",
     "@types/jasmine": "^5.1.4",

client/src/app/app.component.ts

@@ -7,23 +7,22 @@ import { MatToolbar } from '@angular/material/toolbar';
 import { MatSidenavContainer, MatSidenav, MatSidenavContent } from '@angular/material/sidenav';
 
 @Component({
-  selector: 'app-root',
-  templateUrl: './app.component.html',
-  styleUrls: ['./app.component.scss'],
-  standalone: true,
-  imports: [
-    MatSidenavContainer,
-    MatSidenav,
-    MatToolbar,
-    MatNavList,
-    MatListItem,
-    RouterLink,
-    RouterLinkActive,
-    MatIcon,
-    MatSidenavContent,
-    MatIconButton,
-    RouterOutlet,
-  ],
+    selector: 'app-root',
+    templateUrl: './app.component.html',
+    styleUrls: ['./app.component.scss'],
+    imports: [
+        MatSidenavContainer,
+        MatSidenav,
+        MatToolbar,
+        MatNavList,
+        MatListItem,
+        RouterLink,
+        RouterLinkActive,
+        MatIcon,
+        MatSidenavContent,
+        MatIconButton,
+        RouterOutlet,
+    ]
 })
 export class AppComponent {
   title = 'CSCI 3601 Lab 3';

client/src/app/home/home.component.ts

@@ -2,11 +2,10 @@ import { Component } from '@angular/core';
 import { MatCard } from '@angular/material/card';
 
 @Component({
-  selector: 'app-home-component',
-  templateUrl: 'home.component.html',
-  styleUrls: ['./home.component.scss'],
-  providers: [],
-  standalone: true,
-  imports: [MatCard],
+    selector: 'app-home-component',
+    templateUrl: 'home.component.html',
+    styleUrls: ['./home.component.scss'],
+    providers: [],
+    imports: [MatCard]
 })
 export class HomeComponent {}

client/src/app/users/user-card.component.ts

@@ -13,21 +13,20 @@ import { RouterLink } from '@angular/router';
 import { User } from './user';
 
 @Component({
-  selector: 'app-user-card',
-  templateUrl: './user-card.component.html',
-  styleUrls: ['./user-card.component.scss'],
-  standalone: true,
-  imports: [
-    MatCard,
-    MatCardHeader,
-    MatCardAvatar,
-    MatCardTitle,
-    MatCardSubtitle,
-    MatCardContent,
-    MatCardActions,
-    MatButton,
-    RouterLink,
-  ],
+    selector: 'app-user-card',
+    templateUrl: './user-card.component.html',
+    styleUrls: ['./user-card.component.scss'],
+    imports: [
+        MatCard,
+        MatCardHeader,
+        MatCardAvatar,
+        MatCardTitle,
+        MatCardSubtitle,
+        MatCardContent,
+        MatCardActions,
+        MatButton,
+        RouterLink,
+    ]
 })
 export class UserCardComponent {
   user = input.required<User>();

client/src/app/users/user-list.component.ts

@@ -33,34 +33,33 @@ import { MatCard, MatCardTitle, MatCardContent } from '@angular/material/card';
  * makes the most sense to do the filtering.
  */
 @Component({
-  selector: 'app-user-list-component',
-  templateUrl: 'user-list.component.html',
-  styleUrls: ['./user-list.component.scss'],
-  providers: [],
-  standalone: true,
-  imports: [
-    MatCard,
-    MatCardTitle,
-    MatCardContent,
-    MatFormField,
-    MatLabel,
-    MatInput,
-    FormsModule,
-    MatHint,
-    MatSelect,
-    MatOption,
-    MatRadioGroup,
-    MatRadioButton,
-    UserCardComponent,
-    MatNavList,
-    MatListSubheaderCssMatStyler,
-    MatListItem,
-    RouterLink,
-    MatListItemAvatar,
-    MatListItemTitle,
-    MatListItemLine,
-    MatError,
-  ],
+    selector: 'app-user-list-component',
+    templateUrl: 'user-list.component.html',
+    styleUrls: ['./user-list.component.scss'],
+    providers: [],
+    imports: [
+        MatCard,
+        MatCardTitle,
+        MatCardContent,
+        MatFormField,
+        MatLabel,
+        MatInput,
+        FormsModule,
+        MatHint,
+        MatSelect,
+        MatOption,
+        MatRadioGroup,
+        MatRadioButton,
+        UserCardComponent,
+        MatNavList,
+        MatListSubheaderCssMatStyler,
+        MatListItem,
+        RouterLink,
+        MatListItemAvatar,
+        MatListItemTitle,
+        MatListItemLine,
+        MatError,
+    ]
 })
 export class UserListComponent implements OnInit, OnDestroy {
   // These are public so that tests can reference them (.spec.ts)

client/src/app/users/user-profile.component.ts

@@ -8,11 +8,10 @@ import { UserService } from './user.service';
 import { UserCardComponent } from './user-card.component';
 
 @Component({
-  selector: 'app-user-profile',
-  templateUrl: './user-profile.component.html',
-  styleUrls: ['./user-profile.component.scss'],
-  standalone: true,
-  imports: [NgIf, UserCardComponent, MatCardModule],
+    selector: 'app-user-profile',
+    templateUrl: './user-profile.component.html',
+    styleUrls: ['./user-profile.component.scss'],
+    imports: [NgIf, UserCardComponent, MatCardModule]
 })
 export class UserProfileComponent implements OnInit, OnDestroy {
   user: User;

client/src/styles.scss

@@ -6,7 +6,8 @@
 // Include the common styles for Angular Material. We include this here so that you only
 // have to load a single css file for Angular Material in your app.
 // Be sure that you only ever include this mixin once!
-@include mat.core();
+@include mat.elevation-classes();
+@include mat.app-background();
 
 // TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
 //  The following line adds: