User and Client lists show the last logins.

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

@@ -22,16 +22,25 @@
         <mat-cell *matCellDef="let row">{{ row.lockedOut }}</mat-cell>
       </ng-container>
 
-      <!-- Groups Column -->
-      <ng-container matColumnDef="groups">
-        <mat-header-cell *matHeaderCellDef mat-sort-header>Groups</mat-header-cell>
+      <!-- Roles Column -->
+      <ng-container matColumnDef="roles">
+        <mat-header-cell *matHeaderCellDef>Roles</mat-header-cell>
         <mat-cell *matCellDef="let row">
           <ul>
-            <li *ngFor="let group of row.groups">{{ group }}</li>
+            <li *ngFor="let role of row.roles">{{ role }}</li>
           </ul>
         </mat-cell>
       </ng-container>
 
+      <!-- Last Login Column -->
+      <ng-container matColumnDef="last">
+        <mat-header-cell *matHeaderCellDef>Last Login</mat-header-cell>
+        <mat-cell *matCellDef="let row"
+          >{{ row.lastDevice }} @
+          {{ row.lastDate ? (row.lastDate | localTime) : 'Never' }}</mat-cell
+        >
+      </ng-container>
+
       <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
       <mat-row *matRowDef="let row; columns: displayedColumns"></mat-row>
     </mat-table>

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

@@ -18,7 +18,7 @@ export class UserListComponent implements OnInit {
   list: User[] = [];
   dataSource: UserListDataSource = new UserListDataSource(this.list);
   /** Columns displayed in the table. Columns IDs can be added, removed, or reordered. */
-  displayedColumns = ['name', 'lockedOut', 'groups'];
+  displayedColumns = ['name', 'lockedOut', 'roles', 'last'];
 
   constructor(private route: ActivatedRoute) {}