CASH-805 - Hide chat button when sierra or salesforce chat are opened in different pages

This commit is contained in:
Minojhini Valaiyapathi 2025-05-27 14:07:08 -04:00
parent 5244ecab34
commit 4046b41c99
3 changed files with 89 additions and 13 deletions

View file

@ -34,6 +34,29 @@ export default {
script.src = "https://service.force.com/embeddedservice/5.0/esw.min.js";
script.onload = this.initializeSalesforceWebchat;
document.body.appendChild(script);
// Notify funnel-header about Salesforce chat open/close state
this._salesforceChatOpenObserver = new MutationObserver(() => {
const isOpen = !!document.querySelector(".embeddedServiceSidebar");
window.dispatchEvent(
new CustomEvent("salesforce-chat-visibility", { detail: { open: isOpen } })
);
});
this._salesforceChatOpenObserver.observe(document.body, {
childList: true,
subtree: true,
});
},
beforeUnmount() {
// Clean up event listeners and observers
window.removeEventListener(
"salesforce-chat-visibility",
this._handleSalesforceChatVisibility
);
window.removeEventListener("sierra-chat-transfer", this._handleSierraToSalesforceTransfer);
if (this._salesforceChatOpenObserver) {
this._salesforceChatOpenObserver.disconnect();
}
},
methods: {
initializeSalesforceWebchat() {

View file

@ -93,7 +93,6 @@ export default {
Email: transfer.data.email,
Subject: transfer.data.chat_summary, // for now passing in chat_summery in Subject. But this will be changed in future.
};
// Start chat immediately if required fields are present
if (
window.embedded_svc.liveAgentAPI &&
typeof window.embedded_svc.liveAgentAPI.startChat === "function"
@ -106,10 +105,25 @@ export default {
}
};
window.addEventListener("sierra-chat-transfer", this._handleSierraTransfer);
// Notify funnel-header about Sierra chat open/close state
this._sierraChatContainerObserver = new MutationObserver(() => {
const isOpen = !!document.querySelector("[data-sierra-chat-container]");
window.dispatchEvent(
new CustomEvent("sierra-chat-visibility", { detail: { open: isOpen } })
);
});
this._sierraChatContainerObserver.observe(document.body, {
childList: true,
subtree: true,
});
},
beforeUnmount() {
window.removeEventListener("launch-sierra-webchat", this.triggerSierraChat);
window.removeEventListener("sierra-chat-transfer", this._handleSierraTransfer);
if (this._sierraChatContainerObserver) {
this._sierraChatContainerObserver.disconnect();
}
},
};
</script>

View file

@ -55,6 +55,8 @@ export default {
return {
globalAlertMessages: [],
sierraChatOpen: false,
salesforceChatOpen: false,
isSalesforceTransferInProgress: false,
};
},
props: {
@ -73,16 +75,19 @@ export default {
return this.getCmsContent(this.cmsWidgetName, "LogoImage");
},
shouldShowWebchatButton() {
// Always update experiment flag before computing visibility
this.syncSierraExperimentFlag();
// Show if Sierra experiment is active and chat is not open
if (this.webchatGlobalNonpersistedState.shouldLaunchSierra) {
return !this.sierraChatOpen;
// Hide the chat icon if Sierra chat is open
if (this.sierraChatOpen) {
return false;
}
// Otherwise, use Salesforce logic
// Hide the chat icon if Salesforce chat is open or transfer is in progress
if (this.salesforceChatOpen || this.isSalesforceTransferInProgress) {
return false;
}
// Show if either Sierra is enabled or Salesforce button is available and not hidden by page
return (
!this.shouldHideWebchatButtonOnPage &&
this.webchatGlobalNonpersistedState.showWebchatButton
(this.webchatGlobalNonpersistedState.shouldLaunchSierra ||
this.webchatGlobalNonpersistedState.showWebchatButton) &&
!this.shouldHideWebchatButtonOnPage
);
},
},
@ -123,6 +128,7 @@ export default {
progressBar,
},
mounted() {
this.syncSierraExperimentFlag();
// Check if alert event is on the bus
const alertEvent = eventBus.readAndPopEventFromBus(
globalEvents.Categories.GLOBAL_ALERT,
@ -144,14 +150,47 @@ export default {
unknownAlertEvent.displayAlert = true;
this.globalAlertMessages.push(unknownAlertEvent);
}
// Listen for Sierra chat close event to re-enable the chat button if needed
this._handleSierraChatClosed = () => {
this.sierraChatOpen = false;
// Listen for Sierra chat open/close events from sierra-webchat
this._handleSierraChatVisibility = (event) => {
this.sierraChatOpen = !!(event.detail && event.detail.open);
if (this.sierraChatOpen) {
this.isSalesforceTransferInProgress = false;
}
};
window.addEventListener("sierra-chat-closed", this._handleSierraChatClosed);
window.addEventListener("sierra-chat-visibility", this._handleSierraChatVisibility);
// Listen for Salesforce chat open/close events from salesforce-webchat
this._handleSalesforceChatVisibility = (event) => {
this.salesforceChatOpen = !!(event.detail && event.detail.open === true);
};
window.addEventListener("salesforce-chat-visibility", this._handleSalesforceChatVisibility);
// Listen for transfer event to set transfer-in-progress flag
this._handleSierraToSalesforceTransfer = () => {
this.isSalesforceTransferInProgress = true;
};
window.addEventListener("sierra-chat-transfer", this._handleSierraToSalesforceTransfer);
// Reset transfer flag when Salesforce chat opens
this._handleSalesforceChatOpened = (event) => {
if (event.detail && event.detail.open === true) {
this.isSalesforceTransferInProgress = false;
this.salesforceChatOpen = true;
} else {
this.salesforceChatOpen = false;
}
};
window.addEventListener("salesforce-chat-visibility", this._handleSalesforceChatOpened);
},
beforeUnmount() {
window.removeEventListener("sierra-chat-closed", this._handleSierraChatClosed);
window.removeEventListener("sierra-chat-visibility", this._handleSierraChatVisibility);
window.removeEventListener(
"salesforce-chat-visibility",
this._handleSalesforceChatVisibility
);
window.removeEventListener("sierra-chat-transfer", this._handleSierraToSalesforceTransfer);
window.removeEventListener("salesforce-chat-visibility", this._handleSalesforceChatOpened);
},
};
</script>