diff --git a/src/web-live-chat/.env b/src/web-live-chat/.env
new file mode 100644
index 00000000..0118f2e8
--- /dev/null
+++ b/src/web-live-chat/.env
@@ -0,0 +1,2 @@
+# Public
+PUBLIC_API_HOST=http://localhost:5500
\ No newline at end of file
diff --git a/src/web-live-chat/.gitignore b/src/web-live-chat/.gitignore
index 6635cf55..9d54a5d7 100644
--- a/src/web-live-chat/.gitignore
+++ b/src/web-live-chat/.gitignore
@@ -3,7 +3,6 @@ node_modules
 /build
 /.svelte-kit
 /package
-.env
 .env.*
 !.env.example
 vite.config.js.timestamp-*
diff --git a/src/web-live-chat/package-lock.json b/src/web-live-chat/package-lock.json
index ccb11a8c..7f3c83ea 100644
--- a/src/web-live-chat/package-lock.json
+++ b/src/web-live-chat/package-lock.json
@@ -407,9 +407,9 @@
 			}
 		},
 		"node_modules/@eslint/eslintrc": {
-			"version": "2.1.3",
-			"resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.3.tgz",
-			"integrity": "sha512-yZzuIG+jnVu6hNSzFEN07e8BxF3uAzYtQb6uDkaYZLo6oYZDCq454c5kB8zxnzfCYyP4MIuyBn10L0DqwujTmA==",
+			"version": "2.1.4",
+			"resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.4.tgz",
+			"integrity": "sha512-269Z39MS6wVJtsoUl10L60WdkhJVdPG24Q4eZTH3nnF6lpvSShEK3wQjDX9JRWAUPvPh7COouPpU9IrqaZFvtQ==",
 			"dev": true,
 			"dependencies": {
 				"ajv": "^6.12.4",
@@ -430,9 +430,9 @@
 			}
 		},
 		"node_modules/@eslint/js": {
-			"version": "8.54.0",
-			"resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.54.0.tgz",
-			"integrity": "sha512-ut5V+D+fOoWPgGGNj83GGjnntO39xDy6DWxO0wb7Jp3DcMX0TfIqdzHF85VTQkerdyGmuuMD9AKAo5KiNlf/AQ==",
+			"version": "8.55.0",
+			"resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.55.0.tgz",
+			"integrity": "sha512-qQfo2mxH5yVom1kacMtZZJFVdW+E70mqHMJvVg6WTLo+VBuQJ4TojZlfWBjK0ve5BdEeNAVxOsl/nvNMpJOaJA==",
 			"dev": true,
 			"engines": {
 				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
@@ -570,9 +570,9 @@
 			}
 		},
 		"node_modules/@polka/url": {
-			"version": "1.0.0-next.23",
-			"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.23.tgz",
-			"integrity": "sha512-C16M+IYz0rgRhWZdCmK+h58JMv8vijAA61gmz2rspCSwKwzBebpdcsiUmwrtJRdphuY30i6BSLEOP8ppbNLyLg=="
+			"version": "1.0.0-next.24",
+			"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.24.tgz",
+			"integrity": "sha512-2LuNTFBIO0m7kKIQvvPHN6UE63VjpmL9rnEEaOOaiSPbZK+zUOYIzBAWcED+3XYzhYsd/0mD57VdxAEqqV52CQ=="
 		},
 		"node_modules/@popperjs/core": {
 			"version": "2.11.8",
@@ -604,9 +604,9 @@
 			}
 		},
 		"node_modules/@sveltejs/kit": {
-			"version": "1.27.6",
-			"resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-1.27.6.tgz",
-			"integrity": "sha512-GsjTkMbKzXdbeRg0tk8S7HNShQ4879ftRr0ZHaZfjbig1xQwG57Bvcm9U9/mpLJtCapLbLWUnygKrgcLISLC8A==",
+			"version": "1.27.7",
+			"resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-1.27.7.tgz",
+			"integrity": "sha512-AzXYDoYt42clCBwLF9GTHsXyg2DFR31Ncyt8yxu8Aw4tgB433V+w+hcr1RTfAN9zKW2J2PY9FMQ8FoX/4Vw8CA==",
 			"hasInstallScript": true,
 			"dependencies": {
 				"@sveltejs/vite-plugin-svelte": "^2.5.0",
@@ -635,9 +635,9 @@
 			}
 		},
 		"node_modules/@sveltejs/vite-plugin-svelte": {
-			"version": "2.5.2",
-			"resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-2.5.2.tgz",
-			"integrity": "sha512-Dfy0Rbl+IctOVfJvWGxrX/3m6vxPLH8o0x+8FA5QEyMUQMo4kGOVIojjryU7YomBAexOTAuYf1RT7809yDziaA==",
+			"version": "2.5.3",
+			"resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-2.5.3.tgz",
+			"integrity": "sha512-erhNtXxE5/6xGZz/M9eXsmI7Pxa6MS7jyTy06zN3Ck++ldrppOnOlJwHHTsMC7DHDQdgUp4NAc4cDNQ9eGdB/w==",
 			"dependencies": {
 				"@sveltejs/vite-plugin-svelte-inspector": "^1.0.4",
 				"debug": "^4.3.4",
@@ -1162,15 +1162,15 @@
 			}
 		},
 		"node_modules/eslint": {
-			"version": "8.54.0",
-			"resolved": "https://registry.npmjs.org/eslint/-/eslint-8.54.0.tgz",
-			"integrity": "sha512-NY0DfAkM8BIZDVl6PgSa1ttZbx3xHgJzSNJKYcQglem6CppHyMhRIQkBVSSMaSRnLhig3jsDbEzOjwCVt4AmmA==",
+			"version": "8.55.0",
+			"resolved": "https://registry.npmjs.org/eslint/-/eslint-8.55.0.tgz",
+			"integrity": "sha512-iyUUAM0PCKj5QpwGfmCAG9XXbZCWsqP/eWAWrG/W0umvjuLRBECwSFdt+rCntju0xEH7teIABPwXpahftIaTdA==",
 			"dev": true,
 			"dependencies": {
 				"@eslint-community/eslint-utils": "^4.2.0",
 				"@eslint-community/regexpp": "^4.6.1",
-				"@eslint/eslintrc": "^2.1.3",
-				"@eslint/js": "8.54.0",
+				"@eslint/eslintrc": "^2.1.4",
+				"@eslint/js": "8.55.0",
 				"@humanwhocodes/config-array": "^0.11.13",
 				"@humanwhocodes/module-importer": "^1.0.1",
 				"@nodelib/fs.walk": "^1.2.8",
@@ -1229,9 +1229,9 @@
 			}
 		},
 		"node_modules/eslint-config-prettier": {
-			"version": "9.0.0",
-			"resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.0.0.tgz",
-			"integrity": "sha512-IcJsTkJae2S35pRsRAwoCE+925rJJStOdkKnLVgtE+tEpqU0EVVM7OqrwxqgptKdX29NUwC82I5pXsGFIgSevw==",
+			"version": "9.1.0",
+			"resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz",
+			"integrity": "sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==",
 			"dev": true,
 			"bin": {
 				"eslint-config-prettier": "bin/cli.js"
@@ -2086,9 +2086,9 @@
 			}
 		},
 		"node_modules/overlayscrollbars": {
-			"version": "2.4.4",
-			"resolved": "https://registry.npmjs.org/overlayscrollbars/-/overlayscrollbars-2.4.4.tgz",
-			"integrity": "sha512-792lwASLr3FlZER+/P7NseFQjffDEcQOg6HtyBSLrnb3crH+Ybk0tzaljQVQZs0pjGF/xFjyvMKin6whkL0RnQ=="
+			"version": "2.4.5",
+			"resolved": "https://registry.npmjs.org/overlayscrollbars/-/overlayscrollbars-2.4.5.tgz",
+			"integrity": "sha512-4OLCPuZPVdd1HnDLYS4o+kAsOCZwVz6dDA212m8ki/u3isltKyWGVjIv2aqpVHkDRf/P2K98m9Su8pdhihtAIQ=="
 		},
 		"node_modules/p-limit": {
 			"version": "3.1.0",
@@ -2187,9 +2187,9 @@
 			}
 		},
 		"node_modules/postcss": {
-			"version": "8.4.31",
-			"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz",
-			"integrity": "sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==",
+			"version": "8.4.32",
+			"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.32.tgz",
+			"integrity": "sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==",
 			"funding": [
 				{
 					"type": "opencollective",
@@ -2205,7 +2205,7 @@
 				}
 			],
 			"dependencies": {
-				"nanoid": "^3.3.6",
+				"nanoid": "^3.3.7",
 				"picocolors": "^1.0.0",
 				"source-map-js": "^1.0.2"
 			},
@@ -2322,9 +2322,9 @@
 			}
 		},
 		"node_modules/prettier-plugin-svelte": {
-			"version": "3.1.1",
-			"resolved": "https://registry.npmjs.org/prettier-plugin-svelte/-/prettier-plugin-svelte-3.1.1.tgz",
-			"integrity": "sha512-jLzaHfToav527/I5h2BMQfN3G5gylrJm54zFFyoXvUtfscI47877ftacUb+Eyse/3bXrhY+MtkyiuvruiHc+kg==",
+			"version": "3.1.2",
+			"resolved": "https://registry.npmjs.org/prettier-plugin-svelte/-/prettier-plugin-svelte-3.1.2.tgz",
+			"integrity": "sha512-7xfMZtwgAWHMT0iZc8jN4o65zgbAQ3+O32V6W7pXrqNvKnHnkoyQCGCbKeUyXKZLbYE0YhFRnamfxfkEGxm8qA==",
 			"dev": true,
 			"peerDependencies": {
 				"prettier": "^3.0.0",
@@ -2664,9 +2664,9 @@
 			}
 		},
 		"node_modules/svelte-check": {
-			"version": "3.6.0",
-			"resolved": "https://registry.npmjs.org/svelte-check/-/svelte-check-3.6.0.tgz",
-			"integrity": "sha512-8VfqhfuRJ1sKW+o8isH2kPi0RhjXH1nNsIbCFGyoUHG+ZxVxHYRKcb+S8eaL/1tyj3VGvWYx3Y5+oCUsJgnzcw==",
+			"version": "3.6.2",
+			"resolved": "https://registry.npmjs.org/svelte-check/-/svelte-check-3.6.2.tgz",
+			"integrity": "sha512-E6iFh4aUCGJLRz6QZXH3gcN/VFfkzwtruWSRmlKrLWQTiO6VzLsivR6q02WYLGNAGecV3EocqZuCDrC2uttZ0g==",
 			"dev": true,
 			"dependencies": {
 				"@jridgewell/trace-mapping": "^0.3.17",
@@ -2892,9 +2892,9 @@
 			}
 		},
 		"node_modules/typescript": {
-			"version": "5.3.2",
-			"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.2.tgz",
-			"integrity": "sha512-6l+RyNy7oAHDfxC4FzSJcz9vnjTKxrLpDG5M2Vu4SHRVNg6xzqZp6LYSR9zjqQTu8DU/f5xwxUdADOkbrIX2gQ==",
+			"version": "5.3.3",
+			"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.3.tgz",
+			"integrity": "sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==",
 			"dev": true,
 			"bin": {
 				"tsc": "bin/tsc",
diff --git a/src/web-live-chat/src/lib/services/api-endpoints.js b/src/web-live-chat/src/lib/services/api-endpoints.js
index 4665b36e..f89c99dd 100644
--- a/src/web-live-chat/src/lib/services/api-endpoints.js
+++ b/src/web-live-chat/src/lib/services/api-endpoints.js
@@ -1,4 +1,5 @@
-const host = 'http://localhost:5500';
+import { PUBLIC_API_HOST } from '$env/static/public';
+const host = PUBLIC_API_HOST;
 
 // user
 export const tokenUrl = `${host}/token`;
diff --git a/src/web-live-chat/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte b/src/web-live-chat/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte
index d9af18a9..85288245 100644
--- a/src/web-live-chat/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte
+++ b/src/web-live-chat/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte
@@ -5,7 +5,8 @@
 		DropdownMenu,
 		DropdownItem,
 		Form,
-		Input
+		Input,
+		Button
 	} from 'sveltestrap';
 
 	import 'overlayscrollbars/overlayscrollbars.css';
@@ -90,62 +91,26 @@
 		viewport.scrollTo({ top: viewport.scrollHeight, behavior: 'smooth' }); // set scroll offset
 	  }, 200);
     }
+
+	function close() {
+		window.parent.postMessage({ action: "close" }, "*");
+	}
 </script>
 
 <div class="d-lg-flex">
 	<div class="w-100 user-chat">
 		<div class="card">
-			<div class="p-4 border-bottom" style="height: 10vh">
+			<div class="p-4 border-bottom" style="height: 12vh">
 				<div class="row">
-					<div class="col-md-4 col-9">
+					<div class="col-md-4 col-7">
 						<h5 class="font-size-15 mb-1">Guest</h5>
 						<p class="text-muted mb-0">
 							<i class="mdi mdi-circle text-success align-middle me-1" /> Active now
 						</p>
 					</div>
 
-					<div class="col-md-8 col-3">
+					<div class="col-md-8 col-5">
 						<ul class="list-inline user-chat-nav text-end mb-0">
-							<li class="list-inline-item d-none d-sm-inline-block">
-								<Dropdown>
-									<DropdownToggle class="nav-btn dropdown-toggle" tag="button" color="">
-										<i class="bx bx-search-alt-2" />
-									</DropdownToggle>
-
-									<DropdownMenu class="dropdown-menu dropdown-menu-end dropdown-menu-md">
-										<Form class="p-3">
-											<div class="form-group m-0">
-												<div class="input-group">
-													<Input
-														type="text"
-														class="form-control"
-														placeholder="Search ..."
-														aria-label="Recipient's username"
-													/>
-
-													<button class="btn btn-primary" type="submit"
-														><i class="mdi mdi-magnify" /></button
-													>
-												</div>
-											</div>
-										</Form>
-									</DropdownMenu>
-								</Dropdown>
-							</li>
-
-							<li class="list-inline-item d-none d-sm-inline-block">
-								<Dropdown>
-									<DropdownToggle tag="button" class="nav-btn dropdown-toggle" color="">
-										<i class="bx bx-cog" />
-									</DropdownToggle>
-									<DropdownMenu class="dropdown-menu-end">
-										<DropdownItem>View Profile</DropdownItem>
-										<DropdownItem>Clear chat</DropdownItem>
-										<DropdownItem>Muted</DropdownItem>
-										<DropdownItem>Delete</DropdownItem>
-									</DropdownMenu>
-								</Dropdown>
-							</li>
 							<li class="list-inline-item">
 								<Dropdown>
 									<DropdownToggle tag="button" class="nav-btn dropdown-toggle" color="">
@@ -158,12 +123,19 @@
 									</DropdownMenu>
 								</Dropdown>
 							</li>
+							<li class="list-inline-item d-sm-inline-block">
+								<button type="submit" class="btn btn-secondary btn-rounded chat-send w-md waves-effect waves-light"
+									on:click={close}
+								>
+									<span class="d-none d-sm-inline-block me-2" >Close</span> <i class="mdi mdi-window-close"></i>
+								</button>
+							</li>
 						</ul>
 					</div>
 				</div>
 			</div>
 
-			<div class="scrollbar" style="height: 80vh">
+			<div class="scrollbar" style="height: 78vh">
 				<div class="chat-conversation p-3">
 					<ul class="list-unstyled mb-0">
 						<li>