From 406bca86aebb427b2feefc0dafb7b847f6f8ecec Mon Sep 17 00:00:00 2001
From: Kevin Aleman <kevin.aleman@rocket.chat>
Date: Mon, 28 Feb 2022 09:38:55 -0600
Subject: [PATCH] Prevent button from losing state when rerendering

---
 client/lib/voip/VoIPUser.ts                   |  4 ++++
 .../components/OmnichannelCallToggleReady.tsx | 19 +++++++++++++------
 2 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/client/lib/voip/VoIPUser.ts b/client/lib/voip/VoIPUser.ts
index d9beca454127..9b6af9bfe438 100644
--- a/client/lib/voip/VoIPUser.ts
+++ b/client/lib/voip/VoIPUser.ts
@@ -652,4 +652,8 @@ export class VoIPUser extends Emitter<VoipEvents> implements OutgoingRequestDele
 	getAggregator(): QueueAggregator | undefined {
 		return this.queueInfo;
 	}
+
+	getRegistrarState(): string | undefined {
+		return this.registerer?.state.toString().toLocaleLowerCase();
+	}
 }
diff --git a/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx b/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx
index ac9bfd5e985e..e48899f79569 100644
--- a/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx
+++ b/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx
@@ -17,6 +17,15 @@ export const OmnichannelCallToggleReady = (): ReactElement => {
 	} as const;
 	const voipClient = useCallClient();
 
+	useEffect(() => {
+		let agentEnabled = false;
+		const state = voipClient.getRegistrarState();
+		if (state === 'registered') {
+			agentEnabled = true;
+		}
+		setAgentEnabled(agentEnabled);
+		setRegistered(agentEnabled);
+	}, [voipClient]);
 	// TODO: move registration flow to context provider
 	const handleVoipCallStatusChange = useMutableCallback((): void => {
 		// TODO: backend set voip call status
@@ -31,23 +40,21 @@ export const OmnichannelCallToggleReady = (): ReactElement => {
 	});
 
 	const onUnregistrationError = useMutableCallback((): void => {
-		voipClient.off('unregistrationerror', onUnregistrationError);
+		setRegistered(false);
+		setAgentEnabled(false);
 	});
 
 	const onUnregistered = useMutableCallback((): void => {
 		setRegistered(!registered);
-		voipClient.off('unregistered', onUnregistered);
-		voipClient.off('registrationerror', onUnregistrationError);
 	});
 
 	const onRegistrationError = useMutableCallback((): void => {
-		voipClient.off('registrationerror', onRegistrationError);
+		setRegistered(false);
+		setAgentEnabled(false);
 	});
 
 	const onRegistered = useMutableCallback((): void => {
 		setRegistered(!registered);
-		voipClient.off('registered', onRegistered);
-		voipClient.off('registrationerror', onRegistrationError);
 	});
 
 	useEffect(() => {