receive user typing

src/app/module/chat/infra/socket/signal-r.service.ts

@@ -13,10 +13,11 @@ const { App } = Plugins;
 export class SignalRService {
   private connection: SignalRConnection;
   private messageSubject: BehaviorSubject<string> = new BehaviorSubject<any>(null);
+  private typingSubject: BehaviorSubject<string> = new BehaviorSubject<any>(null);
   private connectingSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(null);
 
   constructor(
-    private platform: Platform,) {
+    private platform: Platform) {
     // this.startConnection();
     // this.addMessageListener();
 
@@ -58,6 +59,9 @@ export class SignalRService {
       this.connection.getMessages().subscribe((data) => {
         this.messageSubject.next(data)
       })
+      this.connection.getTyping().subscribe((data) => {
+        this.typingSubject.next(data)
+      })
     }
 
   }
@@ -68,6 +72,10 @@ export class SignalRService {
 
   }
 
+  getTyping() {
+    return this.typingSubject.asObservable()
+  }
+
   async sendMessage(data: Object) {
     return await this.connection.sendMessage(data as any)
   }
@@ -75,4 +83,8 @@ export class SignalRService {
   newConnection() {
     this.establishConnection()
   }
+
+  async sendTyping({ChatRoomId, UserName}) {
+    return await this.connection.typing({ ChatRoomId, UserName})
+  }
 }

src/app/module/chat/infra/socket/signalR.ts

@@ -3,11 +3,12 @@ import { BehaviorSubject, Observable } from 'rxjs';
 import { ok, Result, err } from 'neverthrow';
 import { SessionStore } from 'src/app/store/session.service';
 import { filter, first } from 'rxjs/operators';
-
+import { v4 as uuidv4 } from 'uuid'
 export class SignalRConnection {
 
   private hubConnection: signalR.HubConnection;
   private messageSubject: BehaviorSubject<string> = new BehaviorSubject<any>(null);
+  private typingSubject: BehaviorSubject<string> = new BehaviorSubject<any>(null);
   private connectionStateSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
   private disconnectSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
   private reconnectSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
@@ -27,7 +28,6 @@ export class SignalRConnection {
       .build();
 
       this.hubConnection = hubConnection
-      this.join()
 
       hubConnection
       .start()
@@ -70,7 +70,9 @@ export class SignalRConnection {
   public join() {
     if(this.connectionStateSubject.value == true) {
       console.log('join=============')
-      this.hubConnection.invoke("Join", 105, "UserFirefox");
+
+      this.hubConnection.invoke("Join", SessionStore.user.UserId, SessionStore.user.FullName);
+      //this.hubConnection.invoke("Join", 105, "UserFirefox");
     } else {
       this.sendLaterSubject.next({method: 'SendMessage', args:["Join", 312, "Daniel"]})
     }
@@ -101,17 +103,55 @@ export class SignalRConnection {
     })
   }
 
+  public async typing(data: Object & { ChatRoomId, UserName}):Promise<Result<any, any>>  {
+    return new Promise((resolve, reject) => {
+
+      const requestId = uuidv4()
+      if(this.connectionStateSubject.value == true) {
+
+        try {
+          this.hubConnection.invoke("Typing", {UserName: data.UserName, ChatRoomId: data.ChatRoomId, requestId} as any)
+
+        } catch (error) {}
+
+        this.typingSubject.pipe(
+          filter((message: any) => {
+            return  requestId == message?.requestId
+          }),
+          first()
+        ).subscribe(value => {
+          resolve(ok(value));
+        });
+
+      } else {
+        this.sendLaterSubject.next({method: 'SendMessage', args: data})
+        return reject(err(false))
+      }
+
+
+    })
+  }
+
   private addMessageListener(): void {
     this.hubConnection.on('ReceiveMessage', (message) => {
       console.log('ReceiveMessage', message)
       this.messageSubject.next(message);
     });
+
+    this.hubConnection.on('Typing', (_message) => {
+      console.log('_message', _message)
+      this.typingSubject.next(_message);
+    });
   }
 
   public getMessages(): Observable<string> {
     return this.messageSubject.asObservable()
   }
 
+  public getTyping(): Observable<string> {
+    return this.typingSubject.asObservable()
+  }
+
   public getConnectionState(): Observable<boolean> {
     return this.connectionStateSubject.asObservable();
   }