Files
wehub-resource-sync ec2b666284
Continuous Integration / Pre-commit Linter (push) Has been cancelled
Continuous Integration / Mypy Check (Python 3.10) (push) Has been cancelled
Continuous Integration / Mypy Check (Python 3.11) (push) Has been cancelled
Continuous Integration / Mypy Check (Python 3.12) (push) Has been cancelled
Continuous Integration / Mypy Check (Python 3.13) (push) Has been cancelled
Continuous Integration / Unit Tests (Python 3.10) (push) Has been cancelled
Continuous Integration / Unit Tests (Python 3.11) (push) Has been cancelled
Continuous Integration / Unit Tests (Python 3.12) (push) Has been cancelled
Continuous Integration / Unit Tests (Python 3.13) (push) Has been cancelled
Continuous Integration / Unit Tests (Python 3.14) (push) Has been cancelled
Continuous Integration / A2A v0.3 Tests (Python 3.10) (push) Has been cancelled
Continuous Integration / A2A v0.3 Tests (Python 3.11) (push) Has been cancelled
Continuous Integration / A2A v0.3 Tests (Python 3.12) (push) Has been cancelled
Copybara PR Handler / close-imported-pr (push) Has been cancelled
Continuous Integration / A2A v0.3 Tests (Python 3.13) (push) Has been cancelled
Continuous Integration / A2A v0.3 Tests (Python 3.14) (push) Has been cancelled
chore: import upstream snapshot with attribution
2026-07-13 13:25:13 +08:00

136 lines
4.8 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Agent Assistant</title>
<!-- Include custom styles -->
<link rel="stylesheet" href="/static/style.css" />
<!-- Google Material Fonts -->
<link
href="https://fonts.googleapis.com/css2?family=Outfit&family=Material+Symbols+Outlined"
rel="stylesheet"
/>
<!-- Import Google Material 3 Web Components -->
<!-- See https://m3.material.io/develop/web -->
<script type="module" src="https://esm.run/@material/web/all.js"></script>
</head>
<body>
<div class="app-container">
<!-- Sidebar for Settings (Material 3 styled form) -->
<div id="settings-sidebar" class="sidebar">
<div class="sidebar-header">
<h2>Configuration Settings</h2>
</div>
<div class="settings-form">
<!-- Remote Agent Settings -->
<div id="remote-settings">
<md-outlined-text-field
id="project-id"
label="Project ID"
placeholder="e.g. my-gcp-project"
required
></md-outlined-text-field>
<md-outlined-text-field
id="location"
label="Location"
placeholder="e.g. us-west1"
required
></md-outlined-text-field>
<md-filled-button id="load-agents-btn" class="btn-full">
<span class="material-symbols-outlined" slot="icon">sync</span>
Load Remote Agents
</md-filled-button>
<md-outlined-select id="agent-select" label="Select Engine">
<md-select-option value="">
<div slot="headline">Select an engine...</div>
</md-select-option>
</md-outlined-select>
<!-- Hidden hold for current target ID -->
<input type="hidden" id="agent-id" />
</div>
<!-- User ID for authentication tracking -->
<md-outlined-text-field
id="user-id"
label="User ID"
value="default_user_id"
required
></md-outlined-text-field>
<md-filled-button id="save-settings" class="btn-full">
<span class="material-symbols-outlined" slot="icon">save</span>
Save & Apply Settings
</md-filled-button>
<!-- Active Agent & Session Profile Pane -->
<div id="agent-info-pane" class="agent-info-pane">
<h4>Active Agent Profile</h4>
<div class="info-grid">
<div class="info-row">
<span class="info-label">Mode:</span>
<span class="info-value" id="info-agent-mode">Remote Vertex AI</span>
</div>
<div class="info-row">
<span class="info-label">Project ID:</span>
<span class="info-value" id="info-project-id">-</span>
</div>
<div class="info-row">
<span class="info-label">Location:</span>
<span class="info-value" id="info-location">-</span>
</div>
<div class="info-row">
<span class="info-label">Target ID:</span>
<span class="info-value" id="info-agent-id">-</span>
</div>
<div class="info-row">
<span class="info-label">Session ID:</span>
<span class="info-value" id="info-session-id">No active session</span>
</div>
<div class="info-row">
<span class="info-label">User ID:</span>
<span class="info-value" id="info-user-id">default_user_id</span>
</div>
</div>
</div>
</div>
</div>
<!-- Main Chat Area -->
<div class="chat-container">
<!-- Header with title and clear chat button -->
<header class="chat-header">
<div class="header-left">
<div class="agent-info">
<h1>Agent Playground</h1>
</div>
</div>
<div class="header-right"></div>
</header>
<!-- Message History Container -->
<div id="messages-container" class="messages-container"></div>
<!-- Input Area -->
<footer class="input-container">
<input
type="text"
id="user-input"
placeholder="Type a message to your agent..."
autofocus
autocomplete="off"
/>
<md-filled-icon-button id="send-btn" disabled>
<span class="material-symbols-outlined">send</span>
</md-filled-icon-button>
</footer>
</div>
</div>
<!-- jQuery Library -->
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<!-- Local JavaScript Hook -->
<script src="/static/script.js"></script>
</body>
</html>