remove the useless stuff from ui

Author: bajrangCoder

src/pages/acp/acp.js

@@ -235,13 +235,6 @@ export default function AcpPageInclude() {
 			<div className="acp-chat-view">
 				<div className="acp-chat-header">
 					<div className="acp-header-left">
-						<div className="acp-agent-avatar">
-							<span className="acp-avatar-icon">⚡</span>
-							<span className="acp-status-indicator">
-								<span className="acp-status-ping"></span>
-								<span className="acp-status-dot"></span>
-							</span>
-						</div>
 						<div className="acp-header-info">
 							<span className="acp-agent-name">Agent</span>
 							<span className="acp-status-label">Connected</span>
@@ -452,23 +445,25 @@ export default function AcpPageInclude() {
 		const $dot = $chatView.querySelector(".acp-status-dot");
 		const $ping = $chatView.querySelector(".acp-status-ping");
 		const $label = $chatView.querySelector(".acp-status-label");
-		if (!$dot) return;
-
-		$dot.className = "acp-status-dot";
-		if ($ping) $ping.className = "acp-status-ping";
+		if ($dot) {
+			$dot.className = "acp-status-dot";
+		}
+		if ($ping) {
+			$ping.className = "acp-status-ping";
+		}
 
 		if (state === "connected") {
-			$dot.classList.add("connected");
+			if ($dot) $dot.classList.add("connected");
 			if ($ping) $ping.classList.add("connected");
 			if ($label) $label.textContent = "Connected";
 		} else if (state === "connecting") {
-			$dot.classList.add("working");
+			if ($dot) $dot.classList.add("working");
 			if ($ping) {
 				$ping.classList.add("active", "working");
 			}
 			if ($label) $label.textContent = "Working…";
 		} else if (state === "error") {
-			$dot.classList.add("error");
+			if ($dot) $dot.classList.add("error");
 			if ($label) $label.textContent = "Error";
 		}
 	}

src/pages/acp/acp.scss

@@ -182,81 +182,6 @@
 			.acp-header-left {
 				display: flex;
 				align-items: center;
-				gap: 10px;
-			}
-
-			.acp-agent-avatar {
-				position: relative;
-				width: 38px;
-				height: 38px;
-				border-radius: 10px;
-				background: linear-gradient(
-					135deg,
-					var(--active-color),
-					var(--primary-color)
-				);
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				box-shadow: 0 2px 12px
-					color-mix(in srgb, var(--active-color), transparent 70%);
-
-				.acp-avatar-icon {
-					font-size: 1.1rem;
-					line-height: 1;
-				}
-
-				.acp-status-indicator {
-					position: absolute;
-					bottom: -2px;
-					right: -2px;
-					width: 12px;
-					height: 12px;
-
-					.acp-status-ping {
-						position: absolute;
-						inset: 0;
-						border-radius: 50%;
-						opacity: 0;
-
-						&.active {
-							animation: acp-ping 1.2s cubic-bezier(0, 0, 0.2, 1) infinite;
-							opacity: 0.6;
-						}
-
-						&.connected {
-							background: #4caf50;
-						}
-						&.working {
-							background: var(--active-color);
-						}
-					}
-
-					.acp-status-dot {
-						position: relative;
-						display: block;
-						width: 12px;
-						height: 12px;
-						border-radius: 50%;
-						border: 2px solid var(--secondary-color);
-						background: color-mix(
-							in srgb,
-							var(--secondary-text-color),
-							transparent 60%
-						);
-						transition: background 0.3s;
-
-						&.connected {
-							background: #4caf50;
-						}
-						&.working {
-							background: var(--active-color);
-						}
-						&.error {
-							background: var(--danger-color);
-						}
-					}
-				}
 			}
 
 			.acp-header-info {