refactor(audio): pause producers instead of stopping them

Earlier we were stopping/killing them due to f16bdab. But audio should've been paused instead of stopped.

Author: BreadGenie

frontend/src/composables/useMeetingLogic.js

@@ -576,40 +576,34 @@ export function useMeetingLogic(meetingState, meetingId, options = {}) {
 				// Apply noise cancellation if enabled
 				const track = await getProcessedAudioTrack(stream);
 				if (mh?.audioProducer) {
-					if (meetingState.isScreenSharing.value) {
-						const currentTrack = mh.audioProducer.track;
-						if (currentTrack && currentTrack.readyState === "ended") {
-							await mh.audioProducer.replaceTrack({ track });
-						} else {
-							mh.audioProducer.resume?.();
-							if (track) track.enabled = true;
-						}
-					} else {
-						const producer =
-							await sfuManager.value.transportManager.createProducer(track, {
-								type: "microphone",
-							});
-						mh?.setProducers({ audioProducer: producer });
+					// if we have an existing paused producer resume it
+					const currentTrack = mh.audioProducer.track;
+					if (currentTrack && currentTrack.readyState === "ended") {
+						// if track died unexpectedly, replace it
+						await mh.audioProducer.replaceTrack({ track });
+					} else if (track) {
+						track.enabled = true;
+					}
+					mh.audioProducer.resume?.();
+
+					const sfuClient = getSFUClient();
+					if (sfuClient.isConnected()) {
+						sfuClient.resumeProducer(mh.audioProducer.id).catch(() => {});
 					}
 				} else if (track && sfuManager.value?.transportManager) {
+					// if no existing producer create one
 					const producer =
 						await sfuManager.value.transportManager.createProducer(track, {
 							type: "microphone",
 						});
 					mh?.setProducers({ audioProducer: producer });
 				}
 			} else {
-				// Turning mic OFF
+				// disable the track and pause the producer
 				if (stream) {
 					const at = stream.getAudioTracks()[0];
 					if (at) {
-						if (meetingState.isScreenSharing.value) {
-							// Keep track alive for resuming, else user can't unmute after screen share
-							at.enabled = false;
-						} else {
-							at.stop();
-							stream.removeTrack(at);
-						}
+						at.enabled = false;
 					}
 				}
 
@@ -619,14 +613,12 @@ export function useMeetingLogic(meetingState, meetingId, options = {}) {
 				}
 
 				if (mh?.audioProducer) {
-					mh.audioProducer.close?.();
+					mh.audioProducer.pause?.();
 
 					const sfuClient = getSFUClient();
 					if (sfuClient.isConnected()) {
-						sfuClient.closeProducer(mh.audioProducer.id).catch(() => {});
+						sfuClient.pauseProducer(mh.audioProducer.id);
 					}
-
-					mh.audioProducer = null;
 				}
 			}
 

frontend/src/utils/sfu-client.js

@@ -490,6 +490,14 @@ class SFUClient {
 		return this.sendRequest("close_producer", { producerId });
 	}
 
+	async pauseProducer(producerId) {
+		return this.sendRequest("pause_producer", { producerId });
+	}
+
+	async resumeProducer(producerId) {
+		return this.sendRequest("resume_producer", { producerId });
+	}
+
 	async closeConsumer(consumerId) {
 		return this.sendRequest("close_consumer", { consumerId });
 	}

sfu-server/src/mediasoup/MediasoupManager.ts

@@ -409,6 +409,14 @@ export class MediasoupManager {
 		this.consumerManager.closeConsumer(consumerId);
 	}
 
+	async pauseProducer(producerId: string): Promise<boolean> {
+		return this.producerManager.pauseProducer(producerId);
+	}
+
+	async resumeProducer(producerId: string): Promise<boolean> {
+		return this.producerManager.resumeProducer(producerId);
+	}
+
 	async updateConsumerPreferences(options: {
 		consumerId: string;
 		visible: boolean;

sfu-server/src/mediasoup/ProducerManager.ts

@@ -93,6 +93,56 @@ export class ProducerManager extends EventEmitter {
 		return { isScreen, removedConsumers: [] };
 	}
 
+	async pauseProducer(producerId: string): Promise<boolean> {
+		const producerData = this.producers.get(producerId);
+		if (!producerData) {
+			return false;
+		}
+
+		const { producer } = producerData;
+		if (producer.paused) {
+			return false;
+		}
+
+		try {
+			await producer.pause();
+			loggers.producerManager.info('Producer paused: %s', producerId);
+			return true;
+		} catch (error) {
+			loggers.producerManager.warn(
+				'Failed to pause producer %s: %s',
+				producerId,
+				(error as Error).message,
+			);
+			return false;
+		}
+	}
+
+	async resumeProducer(producerId: string): Promise<boolean> {
+		const producerData = this.producers.get(producerId);
+		if (!producerData) {
+			return false;
+		}
+
+		const { producer } = producerData;
+		if (!producer.paused) {
+			return false;
+		}
+
+		try {
+			await producer.resume();
+			loggers.producerManager.info('Producer resumed: %s', producerId);
+			return true;
+		} catch (error) {
+			loggers.producerManager.warn(
+				'Failed to resume producer %s: %s',
+				producerId,
+				(error as Error).message,
+			);
+			return false;
+		}
+	}
+
 	getProducer(producerId: string): mediasoup.types.Producer | undefined {
 		return this.producers.get(producerId)?.producer;
 	}

sfu-server/src/server/SocketHandlerManager.ts

@@ -766,6 +766,38 @@ export class SocketHandlerManager {
 				callback({ success: false, error: (error as Error).message });
 			}
 		});
+
+		socket.on('pause_producer', async (data, callback) => {
+			try {
+				this.authManager.ensureFullAccess(socket);
+				const { producerId } = data;
+				const paused = await this.mediasoup.pauseProducer(producerId);
+
+				callback({ success: true, paused });
+			} catch (error) {
+				loggers.socketHandler.error(
+					'Error pausing producer: %s',
+					(error as Error).message,
+				);
+				callback({ success: false, error: (error as Error).message });
+			}
+		});
+
+		socket.on('resume_producer', async (data, callback) => {
+			try {
+				this.authManager.ensureFullAccess(socket);
+				const { producerId } = data;
+				const resumed = await this.mediasoup.resumeProducer(producerId);
+
+				callback({ success: true, resumed });
+			} catch (error) {
+				loggers.socketHandler.error(
+					'Error resuming producer: %s',
+					(error as Error).message,
+				);
+				callback({ success: false, error: (error as Error).message });
+			}
+		});
 	}
 
 	private setupMediaControlHandlers(socket: Socket): void {

sfu-server/src/types/index.ts

@@ -181,6 +181,14 @@ export interface ClientToServerEvents {
 		data: { producerId: string },
 		callback: (response: CloseProducerResponse) => void,
 	) => void;
+	pause_producer: (
+		data: { producerId: string },
+		callback: (response: SFUResponse & { paused?: boolean }) => void,
+	) => void;
+	resume_producer: (
+		data: { producerId: string },
+		callback: (response: SFUResponse & { resumed?: boolean }) => void,
+	) => void;
 	close_consumer: (
 		data: { consumerId: string },
 		callback: (response: SFUResponse) => void,