Clickup Tasks: https://app.clickup.com/t/25jwe53 and https://app.clic…

…kup.com/t/22xdyn5

Description :
Though this workspace was fix the first issue, it was realised that there are few other issues
which are dependent on this(Not all may have a clickup task associated).
This commit also fixes following :
1. Voip button does not get disabled when the user state changes. This happens because the user gets updated whenever the state change happens, this causes useVoipClient to reload
this reload causes the reinitialsation of voipUser which initialises the connection again.
2. PR #24752 : This PR fixes the icon display only when the extension associated with the user. This is also fixed as this was broken due to fix for #1. (THis was using user object, and we are now not using the user object directly in the useEffect for voipClient initialisation.
3. This fix broke the fact that whenever user gets associated with the agent, voip button gets active. But because we removed the use of user, This was broken too. This got fixed by the virtue of fixing #2, i.e using extension as a state.
4. Even though the association is deleted, agent was still receiving the call. This was because the SIP user was never unregistered and cleared when the association gets deleted. Fixed this issue by calling voipClient.stop() method. This would take care of unregistering if the UA is registered and then closing the webSocket.

client/lib/voip/VoIPUser.ts

@@ -656,4 +656,8 @@ export class VoIPUser extends Emitter<VoipEvents> implements OutgoingRequestDele
 	getRegistrarState(): string | undefined {
 		return this.registerer?.state.toString().toLocaleLowerCase();
 	}
+
+	clear(): void {
+		this.userAgent?.stop();
+	}
 }

client/providers/CallProvider/hooks/useVoipClient.ts

@@ -6,7 +6,7 @@ import { IRegistrationInfo } from '../../../../definition/voip/IRegistrationInfo
 import { WorkflowTypes } from '../../../../definition/voip/WorkflowTypes';
 import { useEndpoint } from '../../../contexts/ServerContext';
 import { useSetting } from '../../../contexts/SettingsContext';
-import { useUser } from '../../../contexts/UserContext';
+import { useUser, useUserId } from '../../../contexts/UserContext';
 import { SimpleVoipUser } from '../../../lib/voip/SimpleVoipUser';
 import { VoIPUser } from '../../../lib/voip/VoIPUser';
 import { useWebRtcServers } from './useWebRtcServers';
@@ -33,15 +33,18 @@ export const useVoipClient = (): UseVoipClientResult => {
 	const registrationInfo = useEndpoint('GET', 'connector.extension.getRegistrationInfoByUserId');
 	const membership = useEndpoint('GET', 'voip/queues.getMembershipSubscription');
 	const user = useUser();
+	const userId = useUserId();
+	const [extension, setExtension] = useSafely(useState<string | null>(null));
+
 	const iceServers = useWebRtcServers();
 	const [result, setResult] = useSafely(useState<UseVoipClientResult>({}));
 	useEffect(() => {
-		if (!user || !user?._id || !user?.extension || !voipEnabled) {
+		if (!userId || !extension || !voipEnabled) {
 			setResult({});
 			return;
 		}
-
-		registrationInfo({ id: user._id }).then(
+		let client: VoIPUser;
+		registrationInfo({ id: userId }).then(
 			(data) => {
 				let parsedData: IRegistrationInfo;
 				if (isSignedResponse(data)) {
@@ -57,7 +60,7 @@ export const useVoipClient = (): UseVoipClientResult => {
 					callServerConfig: { websocketPath },
 				} = parsedData;
 
-				let client: VoIPUser;
+				// let client: VoIPUser;
 				(async (): Promise<void> => {
 					try {
 						const subscription = await membership({ extension });
@@ -79,7 +82,26 @@ export const useVoipClient = (): UseVoipClientResult => {
 		return (): void => {
 			// client?.disconnect();
 			// TODO how to close the client? before creating a new one?
+			if (client) {
+				client.clear();
+			}
 		};
-	}, [user, iceServers, registrationInfo, setResult, membership, voipEnabled]);
+	}, [userId, iceServers, registrationInfo, setResult, membership, voipEnabled, extension]);
+
+	useEffect(() => {
+		if (!user) {
+			setResult({});
+			return;
+		}
+		if (user.extension) {
+			setExtension(user.extension);
+		} else {
+			setExtension(null);
+			if (!isUseVoipClientResultError(result) && !isUseVoipClientResultLoading(result)) {
+				const { voipClient } = result as UseVoipClientResultResolved;
+				voipClient.clear();
+			}
+		}
+	}, [result, setExtension, setResult, user]);
 	return result;
 };