All datasources done. Now to wire them up in the components.

Plus ElementRefs are now optional as they cannot be initialized

overlord/src/app/user/user-list/user-list.component.ts

@@ -13,8 +13,8 @@ import { UserListDataSource } from './user-list-datasource';
   styleUrls: ['./user-list.component.css'],
 })
 export class UserListComponent implements OnInit {
-  @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
-  @ViewChild(MatSort, { static: true }) sort: MatSort;
+  @ViewChild(MatPaginator, { static: true }) paginator?: MatPaginator = undefined;
+  @ViewChild(MatSort, { static: true }) sort?: MatSort = undefined;
   dataSource: UserListDataSource;
   list: User[];
   /** Columns displayed in the table. Columns IDs can be added, removed, or reordered. */
@@ -23,7 +23,8 @@ export class UserListComponent implements OnInit {
   constructor(private route: ActivatedRoute) {}
 
   ngOnInit() {
-    this.route.data.subscribe((data: { list: User[] }) => {
+    this.route.data.subscribe((value) => {
+      const data = value as { list: User[] };
       this.list = data.list;
     });
     this.dataSource = new UserListDataSource(this.paginator, this.sort, this.list);