From f3807fc0605bc371c7f70dfad1a6d29dad72be0c Mon Sep 17 00:00:00 2001
From: Kevin Aleman <kaleman960@gmail.com>
Date: Thu, 17 Mar 2022 15:11:44 -0600
Subject: [PATCH] [FIX] Disable voip button when call is in progress (#24864)

---
 client/lib/voip/VoIPUser.ts                   |  3 ++
 .../components/OmnichannelCallToggleReady.tsx | 34 ++++++++++++++-----
 packages/rocketchat-i18n/i18n/en.i18n.json    |  1 +
 3 files changed, 29 insertions(+), 9 deletions(-)

diff --git a/client/lib/voip/VoIPUser.ts b/client/lib/voip/VoIPUser.ts
index dcc2c9b41baa..c823e7a0bd41 100644
--- a/client/lib/voip/VoIPUser.ts
+++ b/client/lib/voip/VoIPUser.ts
@@ -567,6 +567,9 @@ export class VoIPUser extends Emitter<VoipEvents> implements OutgoingRequestDele
 		if (this._callState !== 'ANSWER_SENT' && this._callState !== 'IN_CALL' && this._callState !== 'ON_HOLD') {
 			throw new Error(`Incorrect call State = ${this.callState}`);
 		}
+
+		// When call ends, force state to be revisited
+		this.emit('stateChanged');
 		switch (this.session.state) {
 			case SessionState.Initial:
 				if (this.session instanceof Invitation) {
diff --git a/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx b/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx
index 2a17b39c7954..04bde69f30e4 100644
--- a/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx
+++ b/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx
@@ -2,20 +2,39 @@ import { Sidebar } from '@rocket.chat/fuselage';
 import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
 import React, { ReactElement, useEffect, useState } from 'react';
 
-import { useCallClient } from '../../../contexts/CallContext';
+import { useCallClient, useCallerInfo } from '../../../contexts/CallContext';
 import { useTranslation } from '../../../contexts/TranslationContext';
 
 export const OmnichannelCallToggleReady = (): ReactElement => {
 	const [agentEnabled, setAgentEnabled] = useState(false); // TODO: get from AgentInfo
 	const t = useTranslation();
 	const [registered, setRegistered] = useState(false);
+	const voipClient = useCallClient();
+	const [onCall, setOnCall] = useState(false);
+	const callerInfo = useCallerInfo();
+
+	const getTooltip = (): string => {
+		if (!registered) {
+			return t('Enable');
+		}
+		if (!onCall) {
+			// Color for this state still not defined
+			return t('Disable');
+		}
+
+		return t('Cannot_disable_while_on_call');
+	};
 
 	const voipCallIcon = {
-		title: !registered ? t('Enable') : t('Disable'),
+		title: getTooltip(),
 		color: registered ? 'success' : undefined,
 		icon: registered ? 'phone' : 'phone-disabled',
 	} as const;
-	const voipClient = useCallClient();
+
+	useEffect(() => {
+		// Any of the 2 states means the user is already talking
+		setOnCall(['IN_CALL', 'ON_HOLD'].includes(callerInfo.state));
+	}, [callerInfo]);
 
 	useEffect(() => {
 		let agentEnabled = false;
@@ -26,13 +45,10 @@ export const OmnichannelCallToggleReady = (): ReactElement => {
 		setAgentEnabled(agentEnabled);
 		setRegistered(agentEnabled);
 	}, [voipClient]);
+
 	// TODO: move registration flow to context provider
 	const handleVoipCallStatusChange = useMutableCallback((): void => {
-		const { state } = voipClient.callerInfo;
-
-		if (['IN_CALL', 'ON_HOLD'].includes(state)) {
-			// Any of the 2 states means the user is already talking
-			// So if the caller info is any of those, we will prevent status change
+		if (onCall) {
 			return;
 		}
 		// TODO: backend set voip call status
@@ -81,5 +97,5 @@ export const OmnichannelCallToggleReady = (): ReactElement => {
 		};
 	}, [onRegistered, onRegistrationError, onUnregistered, onUnregistrationError, voipClient]);
 
-	return <Sidebar.TopBar.Action {...voipCallIcon} onClick={handleVoipCallStatusChange} />;
+	return <Sidebar.TopBar.Action {...voipCallIcon} onClick={handleVoipCallStatusChange} disabled={onCall} />;
 };
diff --git a/packages/rocketchat-i18n/i18n/en.i18n.json b/packages/rocketchat-i18n/i18n/en.i18n.json
index 29a885baf586..cc5f93032e9b 100644
--- a/packages/rocketchat-i18n/i18n/en.i18n.json
+++ b/packages/rocketchat-i18n/i18n/en.i18n.json
@@ -741,6 +741,7 @@
   "Cannot_invite_users_to_direct_rooms": "Cannot invite users to direct rooms",
   "Cannot_open_conversation_with_yourself": "Cannot Direct Message with yourself",
   "Cannot_share_your_location": "Cannot share your location...",
+  "Cannot_disable_while_on_call": "Can't change status during calls ",
   "CAS_autoclose": "Autoclose Login Popup",
   "CAS_base_url": "SSO Base URL",
   "CAS_base_url_Description": "The base URL of your external SSO service e.g: https://sso.example.undef/sso/",