feat: Online users via gRPC endpoint

Author: autowp

src/app/users/online/online.component.html

@@ -4,7 +4,7 @@ <h3 class="modal-title" i18n>Online</h3>
     <a class="close" (click)="activeModal.dismiss()">×</a>
   </div>
   <div class="modal-body">
-    <app-user [user]="user" *ngFor="let user of users$ | async"></app-user>
+    <app-user2 [user]="user" *ngFor="let user of users$ | async"></app-user2>
   </div>
   <div class="modal-footer">
     <button type="button" (click)="load()" class="btn btn-secondary" i18n>Refresh</button>

src/app/users/online/online.component.ts

@@ -1,26 +1,22 @@
 import {Component} from '@angular/core';
 import {NgbActiveModal} from '@ng-bootstrap/ng-bootstrap';
-import {APIUser} from '../../services/user';
-import {APIService} from '../../services/api.service';
 import {map, switchMap} from 'rxjs/operators';
-import {BehaviorSubject} from 'rxjs';
-
-interface Response {
-  items: APIUser[];
-}
+import {BehaviorSubject, Observable} from 'rxjs';
+import {UsersClient} from '@grpc/spec.pbsc';
+import {APIUser, APIUsersRequest} from '@grpc/spec.pb';
 
 @Component({
   selector: 'app-users-online',
   templateUrl: './online.component.html',
 })
 export class UsersOnlineComponent {
   private reload$ = new BehaviorSubject<boolean>(true);
-  public users$ = this.reload$.pipe(
-    switchMap(() => this.api.request<Response>('GET', 'user/online')),
+  public users$: Observable<APIUser[]> = this.reload$.pipe(
+    switchMap(() => this.usersClient.getUsers(new APIUsersRequest({isOnline: true}))),
     map((response) => response.items)
   );
 
-  constructor(public activeModal: NgbActiveModal, private api: APIService) {}
+  constructor(public readonly activeModal: NgbActiveModal, private readonly usersClient: UsersClient) {}
 
   public load() {
     this.reload$.next(true);