From 94850a7f66f44a182de0c28e261262cf930aa137 Mon Sep 17 00:00:00 2001
From: amolghode1981 <86001342+amolghode1981@users.noreply.github.com>
Date: Tue, 24 May 2022 00:41:11 +0530
Subject: [PATCH] [NEW] New button for network outage (#25499)

---
 .../components/OmnichannelCallToggleReady.tsx  | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/apps/meteor/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx b/apps/meteor/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx
index 0b1da0fccb50..97b75a42ccac 100644
--- a/apps/meteor/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx
+++ b/apps/meteor/client/sidebar/sections/components/OmnichannelCallToggleReady.tsx
@@ -31,10 +31,24 @@ export const OmnichannelCallToggleReady = (): ReactElement => {
 		return t('Cannot_disable_while_on_call');
 	};
 
+	const getIcon = (): 'phone-issue' | 'phone' | 'phone-disabled' => {
+		if (networkStatus === 'offline') {
+			return 'phone-issue';
+		}
+		return registered ? 'phone' : 'phone-disabled';
+	};
+
+	const getColor = (): 'warning' | 'success' | undefined => {
+		if (networkStatus === 'offline') {
+			return 'warning';
+		}
+		return registered ? 'success' : undefined;
+	};
+
 	const voipCallIcon = {
 		title: getTooltip(),
-		color: registered ? 'success' : undefined,
-		icon: registered ? 'phone' : 'phone-disabled',
+		color: getColor(),
+		icon: getIcon(),
 	} as const;
 
 	useEffect(() => {