Making the disconnect message editable by the endpoint configuration

[ymanav]

The overlay that is presented when the user is disconnected during the conversation is coded in a static manner, so it is always in English. When we are serving customers that does not understand English, it distracts customer from the conversation. Is it possible to make it variable based so that it can be edited from the endpoint transformers.

Webchat/src/webchat-ui/components/presentational/DisconnectOverlay.tsx

Lines 63 to 95 in 6207a41

	const DisconnectOverlay = ({ isPermanent, onClose, onConnect }) => {
	return (
	<Wrapper>
	<Dialog>
	{isPermanent ? (
	<>
	<DialogHeader>Connection lost</DialogHeader>
	{navigator.onLine ? (
	<Button onClick={onConnect} color="primary" style={{ margin: "auto" }}>
	Reconnect
	</Button>
	) : (
	<div>No network connection</div>
	)}
	</>
	) : (
	<div>
	<DialogHeader>Connection lost</DialogHeader>
	<div>Reconnecting...</div>
	</div>
	)}
	</Dialog>
	<HeaderIconButton
	data-disconnect-overlay-close-button
	onClick={onClose}
	className="webchat-header-close-button"
	aria-label="Close Warning"
	>
	<CloseIcon />
	</HeaderIconButton>
	</Wrapper>
	);
	};