diff --git a/erpnext/erpnext_integrations/exotel_integration.py b/erpnext/erpnext_integrations/exotel_integration.py
index c45945fc4d..39d43b368f 100644
--- a/erpnext/erpnext_integrations/exotel_integration.py
+++ b/erpnext/erpnext_integrations/exotel_integration.py
@@ -12,9 +12,10 @@ def handle_incoming_call(*args, **kwargs):
 	employee_email = kwargs.get('AgentEmail')
 	status = kwargs.get('Status')
 
-	if status == 'free' and get_call_status(kwargs.get('CallSid')) == ['ringing', 'in-progress']:
-		# redirected to other agent number
-		frappe.publish_realtime('terminate_call_popup', user=employee_email)
+	if status == 'free':
+		# call disconnected for agent
+		# "and get_call_status(kwargs.get('CallSid')) in ['in-progress']" - additional check to ensure if the call was redirected
+		frappe.publish_realtime('call_disconnected', user=employee_email)
 		return
 
 	call_log = get_call_log(kwargs)
@@ -29,9 +30,6 @@ def handle_incoming_call(*args, **kwargs):
 	if call_log.call_status in ['ringing', 'in-progress']:
 		frappe.publish_realtime('show_call_popup', data, user=data.agent_email)
 
-def get_last_communication(phone_number, contact):
-	# frappe.get_all('Communication', filter={})
-	return {}
 
 def get_call_log(call_payload):
 	communication = frappe.get_all('Communication', {
diff --git a/erpnext/public/js/call_popup/call_popup.js b/erpnext/public/js/call_popup/call_popup.js
index 38464785db..f203c8e855 100644
--- a/erpnext/public/js/call_popup/call_popup.js
+++ b/erpnext/public/js/call_popup/call_popup.js
@@ -1,6 +1,6 @@
 class CallPopup {
 	constructor({ call_from, call_log, call_status_method }) {
-		this.number = call_from;
+		this.caller_number = call_from;
 		this.call_log = call_log;
 		this.call_status_method = call_status_method;
 		this.make();
@@ -11,17 +11,16 @@ class CallPopup {
 			'static': true,
 			'minimizable': true,
 			'fields': [{
-				'fieldname': 'customer_info',
+				'fieldname': 'caller_info',
 				'fieldtype': 'HTML'
 			}, {
-				'label': 'Last Interaction',
 				'fielname': 'last_interaction',
 				'fieldtype': 'Section Break',
-				// 'hidden': true
 			}, {
 				'fieldtype': 'Small Text',
 				'label': "Last Communication",
 				'fieldname': 'last_communication',
+				'read_only': true
 			}, {
 				'fieldname': 'last_communication_link',
 				'fieldtype': 'HTML',
@@ -29,12 +28,12 @@ class CallPopup {
 				'fieldtype': 'Small Text',
 				'label': "Last Issue",
 				'fieldname': 'last_issue',
+				'read_only': true
 			}, {
 				'fieldname': 'last_issue_link',
 				'fieldtype': 'HTML',
 			}, {
-				'label': 'Enter Call Summary',
-				'fieldtype': 'Section Break',
+				'fieldtype': 'Column Break',
 			}, {
 				'fieldtype': 'Small Text',
 				'label': 'Call Summary',
@@ -65,10 +64,13 @@ class CallPopup {
 						this.dialog.set_value('call_summary', '');
 					});
 				}
-			}]
+			}],
+			on_minimize_toggle: () => {
+				this.set_call_status();
+			}
 		});
 		this.set_call_status(this.call_log.call_status);
-		this.make_customer_contact();
+		this.make_caller_info_section();
 		this.dialog.get_close_btn().show();
 		this.setup_call_status_updater();
 		this.dialog.set_secondary_action(() => {
@@ -78,19 +80,19 @@ class CallPopup {
 		this.dialog.show();
 	}
 
-	make_customer_contact() {
-		const wrapper = this.dialog.fields_dict["customer_info"].$wrapper;
+	make_caller_info_section() {
+		const wrapper = this.dialog.fields_dict['caller_info'].$wrapper;
 		wrapper.append('<div class="text-muted"> Loading... </div>');
 		frappe.xcall('erpnext.crm.doctype.utils.get_document_with_phone_number', {
-			'number': this.number
+			'number': this.caller_number
 		}).then(contact_doc => {
 			wrapper.empty();
 			const contact = this.contact = contact_doc;
 			if (!contact) {
 				wrapper.append(`
-					<div class="customer-info">
-						<div>Unknown Number: <b>${this.number}</b></div>
-						<a class="contact-link" href="#Form/Contact/New Contact?phone=${this.number}">
+					<div class="caller-info">
+						<div>Unknown Number: <b>${this.caller_number}</b></div>
+						<a class="contact-link text-medium" href="#Form/Contact/New Contact?phone=${this.caller_number}">
 							${__('Create New Contact')}
 						</a>
 					</div>
@@ -99,7 +101,7 @@ class CallPopup {
 				const link = contact.links ? contact.links[0] : null;
 				const contact_link = link ? frappe.utils.get_form_link(link.link_doctype, link.link_name, true): '';
 				wrapper.append(`
-					<div class="customer-info flex">
+					<div class="caller-info flex">
 						<img src="${contact.image}">
 						<div class='flex-column'>
 							<span>${contact.first_name} ${contact.last_name}</span>
@@ -108,27 +110,32 @@ class CallPopup {
 						</div>
 					</div>
 				`);
+				this.set_call_status();
 				this.make_last_interaction_section();
 			}
 		});
 	}
 
-	set_indicator(color) {
-		this.dialog.header.find('.indicator').removeClass('hidden').addClass('blink').addClass(color);
+	set_indicator(color, blink=false) {
+		this.dialog.header.find('.indicator').removeClass('hidden').toggleClass('blink', blink).addClass(color);
 	}
 
 	set_call_status(call_status) {
 		let title = '';
-		call_status = this.call_log.call_status;
-		if (call_status === 'busy') {
-			title = __('Incoming call');
-			this.set_indicator('blue');
+		call_status = call_status || this.call_log.call_status;
+		if (['busy', 'completed'].includes(call_status)) {
+			title = __('Incoming call from {0}',
+				[this.contact ? `${this.contact.first_name} ${this.contact.last_name}` : this.caller_number]);
+			this.set_indicator('blue', true);
 		} else if (call_status === 'in-progress') {
 			title = __('Call Connected');
 			this.set_indicator('yellow');
 		} else if (call_status === 'missed') {
 			this.set_indicator('red');
 			title = __('Call Missed');
+		} else if (call_status === 'disconnected') {
+			this.set_indicator('red');
+			title = __('Call Disconnected');
 		} else {
 			this.set_indicator('blue');
 			title = call_status;
@@ -155,16 +162,14 @@ class CallPopup {
 		});
 	}
 
-	terminate_popup() {
+	disconnect_call() {
+		this.set_call_status('disconnected');
 		clearInterval(this.updater);
-		this.dialog.hide();
-		delete erpnext.call_popup;
-		frappe.msgprint('Call Forwarded');
 	}
 
 	make_last_interaction_section() {
 		frappe.xcall('erpnext.crm.doctype.utils.get_last_interaction', {
-			'number': this.number,
+			'number': this.caller_number,
 			'reference_doc': this.contact
 		}).then(data => {
 			if (data.last_communication) {
@@ -180,7 +185,8 @@ class CallPopup {
 				// this.dialog.set_df_property('last_interaction', 'hidden', false);
 				const issue_field = this.dialog.fields_dict["last_issue"];
 				issue_field.set_value(issue.subject);
-				issue_field.$wrapper.append(frappe.utils.get_form_link('Issue', issue.name, true));
+				issue_field.$wrapper
+					.append(`<a class="text-medium" href="#Form/Issue/${issue.name}">View ${issue.name}</a>`);
 			}
 		});
 	}
@@ -191,15 +197,14 @@ $(document).on('app_ready', function () {
 		if (!erpnext.call_popup) {
 			erpnext.call_popup = new CallPopup(data);
 		} else {
-			console.log(data);
 			erpnext.call_popup.update(data);
 			erpnext.call_popup.dialog.show();
 		}
 	});
 
-	frappe.realtime.on('terminate_call_popup', () => {
+	frappe.realtime.on('call_disconnected', () => {
 		if (erpnext.call_popup) {
-			erpnext.call_popup.terminate_popup();
+			erpnext.call_popup.disconnect_call();
 		}
 	});
 });
diff --git a/erpnext/public/less/call_popup.less b/erpnext/public/less/call_popup.less
index 6ec2db9cd8..3f4ffef3c0 100644
--- a/erpnext/public/less/call_popup.less
+++ b/erpnext/public/less/call_popup.less
@@ -1,4 +1,7 @@
-.customer-info {
+.call-popup {
+	.caller-info {
+		padding: 0 15px;
+	}
 	img {
 		width: auto;
 		height: 100px;