ov-components: add onParticipantLeft event and disconnect callback to notify when local participant leaves

openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/session/session.component.ts

@@ -46,7 +46,7 @@ import {
 	RoomEvent,
 	Track
 } from 'livekit-client';
-import { ParticipantModel } from '../../models/participant.model';
+import { ParticipantLeftEvent, ParticipantModel } from '../../models/participant.model';
 import { ServiceConfigService } from '../../services/config/service-config.service';
 
 /**
@@ -89,6 +89,11 @@ export class SessionComponent implements OnInit, OnDestroy {
 	 */
 	@Output() onParticipantConnected: EventEmitter<ParticipantModel> = new EventEmitter<ParticipantModel>();
 
+	/**
+	 * This event is emitted when the local participant leaves the room.
+	 */
+	@Output() onParticipantLeft: EventEmitter<ParticipantLeftEvent> = new EventEmitter<ParticipantLeftEvent>();
+
 	room: Room;
 	sideMenu: MatSidenav;
 	sidenavMode: SidenavMode = SidenavMode.SIDE;
@@ -206,6 +211,13 @@ export class SessionComponent implements OnInit, OnDestroy {
 		}
 		try {
 			await this.participantService.connect();
+			this.openviduService.setDisconnectCallback(() => {
+				const event: ParticipantLeftEvent = {
+					roomName: this.openviduService.getRoomName(),
+					participantName: this.participantService.getLocalParticipant()?.identity || ''
+				};
+				this.onParticipantLeft.emit(event);
+			});
 			// Send room created after participant connect for avoiding to send incomplete room payload
 			this.onRoomCreated.emit(this.room);
 			this.cd.markForCheck();

openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/videoconference/videoconference.component.html

@@ -29,6 +29,7 @@
 			(onRoomReconnected)="onRoomReconnected.emit()"
 			(onParticipantConnected)="onParticipantCreated.emit($event)"
 			(onParticipantConnected)="onParticipantConnected.emit($event)"
+			(onParticipantLeft)="_onParticipantLeft($event)"
 		>
 			<ng-template #toolbar>
 				<ng-container *ngIf="openviduAngularToolbarTemplate">

openvidu-components-angular/projects/openvidu-components-angular/src/lib/services/openvidu/openvidu.service.ts

@@ -38,6 +38,7 @@ export class OpenViduService {
 	private localTracks: LocalTrack[] = [];
 	private livekitToken = '';
 	private livekitUrl = '';
+	private disconnectCallback: () => void;
 	private log: ILogger;
 
 	/**
@@ -107,8 +108,26 @@ export class OpenViduService {
 		if (this.isRoomConnected()) {
 			this.log.d('Disconnecting room');
 			await this.room.disconnect();
+			if (this.disconnectCallback) {
+				this.disconnectCallback();
 			}
 		}
+	}
+
+	/**
+	 * Sets a callback function that triggers when a participant is disconnected
+	 * from the session using the OpenViduService.disconnectRoom() method.
+	 *
+	 * This is particularly useful in cases where the disconnection occurs externally,
+	 * outside of this component, ensuring that the parent component is notified
+	 * even when the service is used directly.
+	 *
+	 * @param callback - The function to be executed upon disconnection.
+	 * @internal
+	 */
+	setDisconnectCallback(callback: () => void): void {
+		this.disconnectCallback = callback;
+	}
 
 	/**
 	 * @returns Room instance
@@ -128,7 +147,6 @@ export class OpenViduService {
 		return this.room?.name;
 	}
 
-
 	/**
 	 * Returns if local participant is connected to the room
 	 * @returns