-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/crates/g3-console/web/js/api.js b/crates/g3-console/web/js/api.js
deleted file mode 100644
index 6183fff..0000000
--- a/crates/g3-console/web/js/api.js
+++ /dev/null
@@ -1,103 +0,0 @@
-// API client for G3 Console
-const API_BASE = '/api';
-
-const api = {
- // Get all instances
- async getInstances() {
- const response = await fetch(`${API_BASE}/instances`);
- if (!response.ok) throw new Error('Failed to fetch instances');
- return response.json();
- },
-
- // Get single instance details
- async getInstance(id) {
- const response = await fetch(`${API_BASE}/instances/${id}`);
- if (!response.ok) throw new Error('Failed to fetch instance');
- return response.json();
- },
-
- // Get instance logs
- async getInstanceLogs(id) {
- const response = await fetch(`${API_BASE}/instances/${id}/logs`);
- if (!response.ok) throw new Error('Failed to fetch logs');
- return response.json();
- },
-
- // Launch new instance
- async launchInstance(data) {
- const response = await fetch(`${API_BASE}/instances/launch`, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify(data)
- });
- if (!response.ok) {
- // Try to extract error message from response
- let errorMessage = `Failed to launch instance (${response.status})`;
- try {
- const errorData = await response.json();
- errorMessage = errorData.message || errorData.error || errorMessage;
- } catch (e) {
- // JSON parsing failed, use default message
- }
- throw new Error(errorMessage);
- }
- return response.json();
- },
-
- // Kill instance
- async killInstance(id) {
- const response = await fetch(`${API_BASE}/instances/${id}/kill`, {
- method: 'POST'
- });
- if (!response.ok) throw new Error('Failed to kill instance');
- return response.json();
- },
-
- // Restart instance
- async restartInstance(id) {
- const response = await fetch(`${API_BASE}/instances/${id}/restart`, {
- method: 'POST'
- });
- if (!response.ok) throw new Error('Failed to restart instance');
- return response.json();
- },
-
- // Get console state
- async getState() {
- const response = await fetch(`${API_BASE}/state`);
- if (!response.ok) throw new Error('Failed to fetch state');
- return response.json();
- },
-
- // Save console state
- async saveState(state) {
- const response = await fetch(`${API_BASE}/state`, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify(state)
- });
- if (!response.ok) throw new Error('Failed to save state');
- return response.json();
- },
-
- // Browse filesystem
- async browseFilesystem(path, browseType = 'directory') {
- const response = await fetch(`${API_BASE}/browse`, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({ path: path, browse_type: browseType })
- });
- if (!response.ok) throw new Error('Failed to browse filesystem');
- return response.json();
- },
-
- // Get full file content
- async getFileContent(instanceId, fileName) {
- const response = await fetch(`${API_BASE}/instances/${instanceId}/file?name=${encodeURIComponent(fileName)}`);
- if (!response.ok) throw new Error('Failed to fetch file content');
- return response.json();
- }
-};
-
-// Expose to window for global access
-window.api = api;
diff --git a/crates/g3-console/web/js/app.js b/crates/g3-console/web/js/app.js
deleted file mode 100644
index a486d9f..0000000
--- a/crates/g3-console/web/js/app.js
+++ /dev/null
@@ -1,304 +0,0 @@
-// Main application logic
-
-// Global action handlers
-window.handleKill = async function(id) {
- if (!confirm('Are you sure you want to kill this instance?')) return;
-
- // Find the button and show loading state
- const button = event.target;
- const originalText = button.textContent;
- button.disabled = true;
- button.innerHTML = ' Terminating...';
-
- try {
- await api.killInstance(id);
-
- // Show success state
- button.innerHTML = '✓ Terminated';
- button.classList.remove('btn-danger');
- button.classList.add('btn-secondary');
-
- // Refresh after a short delay
- setTimeout(() => {
- router.handleRoute(router.currentRoute);
- }, 1000);
- } catch (error) {
- // Restore button state on error
- button.disabled = false;
- button.textContent = originalText;
- alert('Failed to kill instance: ' + error.message);
- }
-};
-
-window.handleRestart = async function(id) {
- // Find the button and show loading state
- const button = event.target;
- const originalText = button.textContent;
- button.disabled = true;
- button.innerHTML = ' Restarting...';
-
- try {
- await api.restartInstance(id);
-
- // Show intermediate states
- button.innerHTML = ' Starting...';
-
- // Wait a bit then show success
- setTimeout(() => {
- button.innerHTML = '✓ Running';
- button.classList.remove('btn-primary');
- button.classList.add('btn-success');
- }, 1500);
-
- // Refresh current view
- setTimeout(() => {
- router.handleRoute(router.currentRoute);
- }, 2500);
- } catch (error) {
- // Restore button state on error
- button.disabled = false;
- button.textContent = originalText;
- alert('Failed to kill instance: ' + error.message);
- }
-};
-
-// Modal management
-const modal = {
- element: null,
-
- init() {
- this.element = document.getElementById('new-run-modal');
-
- // Close button
- document.getElementById('modal-close').addEventListener('click', () => this.close());
- document.getElementById('cancel-launch').addEventListener('click', () => this.close());
-
- // Close on overlay click
- this.element.querySelector('.modal-overlay').addEventListener('click', () => this.close());
-
- // Form submission
- document.getElementById('launch-form').addEventListener('submit', (e) => {
- e.preventDefault();
- this.handleLaunch();
- });
-
- // File browser buttons - use HTML5 file input
- document.getElementById('browse-workspace').addEventListener('click', () => {
- this.browseDirectory('workspace');
- });
-
- document.getElementById('browse-binary').addEventListener('click', () => {
- this.browseFile('g3-binary-path');
- });
-
- // Provider change updates model options
- document.getElementById('provider').addEventListener('change', (e) => {
- this.updateModelOptions(e.target.value);
- });
- },
-
- browseDirectory(inputId) {
- // Use custom file browser
- fileBrowser.open({
- mode: 'directory',
- initialPath: document.getElementById(inputId).value || '/Users',
- callback: (path) => {
- document.getElementById(inputId).value = path;
- }
- });
- },
-
- browseFile(inputId) {
- // Use custom file browser
- fileBrowser.open({
- mode: 'file',
- initialPath: document.getElementById(inputId).value || '/Users',
- callback: (path) => {
- document.getElementById(inputId).value = path;
- }
- });
- },
-
- open() {
- // Load saved state
- const form = document.getElementById('launch-form');
- if (state.lastWorkspace) {
- form.workspace.value = state.lastWorkspace;
- }
- if (state.g3BinaryPath) {
- form.g3_binary_path.value = state.g3BinaryPath;
- }
- form.provider.value = state.lastProvider || 'databricks';
- this.updateModelOptions(state.lastProvider || 'databricks');
- form.model.value = state.lastModel || 'databricks-claude-sonnet-4-5';
-
- this.element.classList.remove('hidden');
- },
-
- close() {
- this.element.classList.add('hidden');
- },
-
- updateModelOptions(provider) {
- const modelSelect = document.getElementById('model');
- const models = {
- databricks: [
- { value: 'databricks-claude-sonnet-4-5', label: 'databricks-claude-sonnet-4-5' },
- { value: 'databricks-meta-llama-3-1-405b-instruct', label: 'databricks-meta-llama-3-1-405b-instruct' }
- ],
- anthropic: [
- { value: 'claude-3-5-sonnet-20241022', label: 'claude-3-5-sonnet-20241022' },
- { value: 'claude-3-opus-20240229', label: 'claude-3-opus-20240229' }
- ],
- local: [
- { value: 'local-model', label: 'Local Model' }
- ]
- };
-
- modelSelect.innerHTML = '';
- for (const model of models[provider] || []) {
- const option = document.createElement('option');
- option.value = model.value;
- option.textContent = model.label;
- modelSelect.appendChild(option);
- }
- },
-
- async handleLaunch() {
- const form = document.getElementById('launch-form');
- const formData = new FormData(form);
-
- const data = {
- prompt: formData.get('prompt'),
- workspace: formData.get('workspace'),
- provider: formData.get('provider'),
- model: formData.get('model'),
- mode: formData.get('mode'),
- g3_binary_path: formData.get('g3_binary_path') || null
- };
-
- const submitBtn = form.querySelector('button[type="submit"]');
- const modalBody = this.element.querySelector('.modal-body');
-
- try {
- // Show loading state
- submitBtn.disabled = true;
- submitBtn.innerHTML = ' Starting g3 instance...';
-
- const response = await api.launchInstance(data);
-
- // Show intermediate state
- submitBtn.innerHTML = ' Waiting for process...';
-
- // Wait a bit to let the process start
- await new Promise(resolve => setTimeout(resolve, 1500));
- submitBtn.innerHTML = '✓ Instance started!';
-
- // Save state
- state.updateLaunchDefaults(
- data.workspace,
- data.provider,
- data.model,
- data.g3_binary_path
- );
-
- // Close modal and navigate home
- this.close();
- router.navigate('/');
-
- // Reset form
- form.reset();
- submitBtn.disabled = false;
- submitBtn.textContent = 'Start Instance';
- } catch (error) {
- // Display detailed error message in modal
- const errorDiv = document.createElement('div');
- errorDiv.className = 'error-message';
- errorDiv.style.cssText = 'background: #fee; border: 1px solid #fcc; color: #c33; padding: 1rem; margin: 1rem 0; border-radius: 0.5rem;';
-
- let errorMessage = 'Failed to launch instance';
- if (error.message) {
- errorMessage += ': ' + error.message;
- }
-
- // Check for specific error types
- if (error.message && error.message.includes('400')) {
- errorMessage = 'Invalid configuration. Please check that the g3 binary path exists and is executable, and that the workspace directory is valid.';
- } else if (error.message && error.message.includes('500')) {
- errorMessage = 'Server error while launching instance. Check console logs for details.';
- }
-
- errorDiv.textContent = errorMessage;
-
- // Remove any existing error messages
- const existingError = modalBody.querySelector('.error-message');
- if (existingError) existingError.remove();
-
- // Insert error message at the top of modal body
- modalBody.insertBefore(errorDiv, modalBody.firstChild);
-
- submitBtn.disabled = false;
- submitBtn.textContent = 'Start Instance';
- }
- }
-};
-
-// Theme toggle
-function initTheme() {
- const themeToggle = document.getElementById('theme-toggle');
-
- themeToggle.addEventListener('click', () => {
- const newTheme = state.theme === 'dark' ? 'light' : 'dark';
- state.setTheme(newTheme);
- themeToggle.textContent = newTheme === 'dark' ? '🌙' : '☀️';
- });
-
- // Set initial theme
- document.body.className = state.theme;
- themeToggle.textContent = state.theme === 'dark' ? '🌙' : '☀️';
-}
-
-// Initialize app
-async function init() {
- // Prevent double initialization
- if (window.g3Initialized) {
- console.log('[App] init() called but already initialized, returning');
- return;
- }
- window.g3Initialized = true;
- console.log('[App] init() starting...');
-
- // Load state
- await state.load();
-
- // Initialize theme
- initTheme();
-
- // Initialize modal
- modal.init();
-
- // Initialize file browser
- fileBrowser.init();
-
- // Expose modal to window for button access
- window.modal = modal;
-
- // New Run button
- document.getElementById('new-run-btn').addEventListener('click', () => {
- modal.open();
- });
-
- // Initialize router
- console.log('[App] About to call router.init()');
- router.init();
- console.log('[App] init() complete');
-}
-
-// Simplified initialization - call exactly once when DOM is ready
-if (document.readyState === 'loading') {
- // DOM still loading, wait for DOMContentLoaded
- document.addEventListener('DOMContentLoaded', init, { once: true });
-} else {
- // DOM already loaded (interactive or complete), init immediately
- init();
-}
diff --git a/crates/g3-console/web/js/components.js b/crates/g3-console/web/js/components.js
deleted file mode 100644
index 6fe7536..0000000
--- a/crates/g3-console/web/js/components.js
+++ /dev/null
@@ -1,367 +0,0 @@
-// UI Components for G3 Console
-
-const components = {
- // Render status badge
- statusBadge(status) {
- const colors = {
- running: 'badge-success',
- completed: 'badge-success',
- failed: 'badge-error',
- idle: 'badge-warning',
- terminated: 'badge-neutral'
- };
- return `${status}`;
- },
-
- // Render progress bar
- progressBar(instance, stats) {
- const duration = stats.duration_secs;
-
- // Handle zero duration to avoid NaN
- if (duration === 0) {
- return this.singleProgressBar(0);
- }
-
- const estimated = duration * 1.5; // Simple estimation
- const progress = Math.min((duration / estimated) * 100, 100);
-
- // Check if this is ensemble mode with turn data
- if (instance.instance_type === 'ensemble' && stats.turns && stats.turns.length > 0) {
- return this.ensembleProgressBar(stats.turns, duration);
- }
-
- return `
-
- `;
- },
-
- // Render multi-segment progress bar for ensemble mode
- ensembleProgressBar(turns, totalDuration) {
- const colors = {
- coach: '#3b82f6',
- player: '#6b7280',
- completed: '#10b981',
- error: '#ef4444'
- };
-
- if (turns.length === 0) {
- // Fallback to single progress bar if no turn data
- return this.singleProgressBar(totalDuration);
- }
-
- let segments = '';
- for (const turn of turns) {
- // Handle zero total duration to avoid NaN
- if (totalDuration === 0) {
- continue;
- }
-
- // Ensure percentage never exceeds 100%
- const rawPercentage = (turn.duration_secs / totalDuration) * 100;
- const percentage = Math.min(rawPercentage, 100);
- const color = colors[turn.agent] || colors.player;
- const statusColor = turn.status === 'error' ? colors.error : color;
- const agentLabel = turn.agent.charAt(0).toUpperCase() + turn.agent.slice(1);
- const durationMin = Math.round(turn.duration_secs / 60);
- const tooltip = `${agentLabel}: ${durationMin}m ${Math.round(turn.duration_secs % 60)}s - ${turn.status}`;
-
- segments += `
-
-
- G3 Console ● LIVE
-
-
-
-
-
-
- `;
- }
-
- return `
-
- `;
- },
-
- // Single progress bar (fallback)
- singleProgressBar(duration) {
- // Handle zero duration
- if (duration === 0) {
- return ``;
- }
-
- const estimated = duration * 1.5;
- const progress = Math.min((duration / estimated) * 100, 100);
- return `
-
- `;
- },
-
- // Render instance panel
- instancePanel(instance, stats, latestMessage) {
- return `
-
-
- `;
- },
-
- // Render loading spinner
- spinner(message = 'Loading...') {
- return `
-
-
-
- ${this.progressBar(instance, stats)}
-
-
-
-
- ${instance.workspace}
- ${this.statusBadge(instance.status)} -
-
-
- ${latestMessage ? `
-
- ` : ''}
-
-
- Tokens
- ${stats.total_tokens.toLocaleString()}
-
-
- Tool Calls
- ${stats.tool_calls}
-
-
- Errors
- ${stats.errors}
-
-
- Duration
- ${Math.round(stats.duration_secs / 60)}m
-
-
- ${instance.status === 'running' ? `
-
- ` : ''}
- ${instance.status === 'terminated' ? `
-
- ` : ''}
-
-
-
-
-
- `;
- },
-
- // Render error message
- error(message) {
- return `
-
- `;
- },
-
- // Render empty state
- emptyState(message) {
- return `
- ${message}
-
-
- `;
- },
-
- // Truncate text
- truncate(text, length) {
- if (text.length <= length) return text;
- return text.substring(0, length) + '...';
- },
-
- // Render chat message
- chatMessage(message, agent = null) {
- // Handle agent as string or object
- let agentStr = null;
- if (typeof agent === 'string') {
- agentStr = agent.toLowerCase();
- } else if (agent && typeof agent === 'object') {
- agentStr = String(agent).toLowerCase();
- }
-
- const agentClass = agentStr === 'coach' ? 'message-coach' : agentStr === 'player' ? 'message-player' : '';
-
- return `
-
- `;
- },
-
- // Render tool call
- toolCall(toolCall) {
- const statusIcon = toolCall.success ? '✓' : '✗';
- const statusClass = toolCall.success ? 'success' : 'error';
-
- return `
- ${message}
-
-
- `;
- },
-
- // Render git status section
- gitStatus(gitStatus) {
- if (!gitStatus) {
- return '
- 🔧 ${toolCall.tool_name}
-
-
- ${toolCall.execution_time_ms ? `${toolCall.execution_time_ms}ms` : ''}
- ${statusIcon}
-
-
-
-
- Parameters:
-
- ${toolCall.result ? `
- ${JSON.stringify(toolCall.parameters, null, 2)}
- Result:
-
- ` : ''}
- ${toolCall.error ? `
- ${JSON.stringify(toolCall.result, null, 2)}
- Error:
-
- ` : ''}
-
- ${this.escapeHtml(toolCall.error)}No git repository detected
'; - } - - return ` -
-
- `;
- },
-
- // Render project files section
- projectFiles(projectFiles) {
- if (!projectFiles || (!projectFiles.requirements && !projectFiles.readme && !projectFiles.agents)) {
- return '
- 📍 ${gitStatus.branch}
- ${gitStatus.uncommitted_changes} uncommitted changes
-
- ${gitStatus.uncommitted_changes > 0 ? `
-
- ${gitStatus.modified_files.length > 0 ? `
-
- ` : ''}
-
- Modified:
-
- ` : ''}
- ${gitStatus.added_files.length > 0 ? `
- -
- ${gitStatus.modified_files.map(f => `
- ${f} `).join('')} -
- Added:
-
- ` : ''}
- ${gitStatus.deleted_files.length > 0 ? `
- -
- ${gitStatus.added_files.map(f => `
- ${f} `).join('')} -
- Deleted:
-
- ` : ''}
- -
- ${gitStatus.deleted_files.map(f => `
- ${f} `).join('')} -
No project files found
'; - } - - let html = '';
-
- if (projectFiles.requirements) {
- html += `
-
';
- return html;
- },
-
- escapeHtml(text) {
- const div = document.createElement('div');
- div.textContent = text;
- return div.innerHTML;
- }
-};
-
-// Expose to window for global access
-window.components = components;
diff --git a/crates/g3-console/web/js/file-browser.js b/crates/g3-console/web/js/file-browser.js
deleted file mode 100644
index 1a87a51..0000000
--- a/crates/g3-console/web/js/file-browser.js
+++ /dev/null
@@ -1,164 +0,0 @@
-// File Browser Component
-const fileBrowser = {
- currentPath: '',
- selectedPath: '',
- mode: 'directory', // 'directory' or 'file'
- callback: null,
-
- init() {
- const modal = document.getElementById('file-browser-modal');
- const closeBtn = document.getElementById('file-browser-close');
- const cancelBtn = document.getElementById('file-browser-cancel');
- const selectBtn = document.getElementById('file-browser-select');
- const parentBtn = document.getElementById('file-browser-parent');
-
- closeBtn.addEventListener('click', () => this.close());
- cancelBtn.addEventListener('click', () => this.close());
- selectBtn.addEventListener('click', () => this.select());
- parentBtn.addEventListener('click', () => this.goToParent());
-
- // Close on overlay click
- modal.querySelector('.modal-overlay').addEventListener('click', () => this.close());
- },
-
- async open(options = {}) {
- this.mode = options.mode || 'directory';
- this.callback = options.callback;
- this.currentPath = options.initialPath || '/Users';
- this.selectedPath = '';
-
- // Update title
- const title = this.mode === 'directory' ? 'Select Directory' : 'Select File';
- document.getElementById('file-browser-title').textContent = title;
-
- // Show modal
- document.getElementById('file-browser-modal').classList.remove('hidden');
-
- // Load initial directory
- await this.loadDirectory(this.currentPath);
- },
-
- close() {
- document.getElementById('file-browser-modal').classList.add('hidden');
- this.callback = null;
- },
-
- select() {
- if (this.selectedPath && this.callback) {
- this.callback(this.selectedPath);
- }
- this.close();
- },
-
- async goToParent() {
- const parts = this.currentPath.split('/').filter(p => p);
- if (parts.length > 0) {
- parts.pop();
- const parentPath = '/' + parts.join('/');
- await this.loadDirectory(parentPath);
- }
- },
-
- async loadDirectory(path) {
- const listContainer = document.getElementById('file-browser-list');
- listContainer.innerHTML = '
-
- `;
- }
-
- if (projectFiles.readme) {
- html += `
-
- 📄 requirements.md
-
- ▼
-
-
-
- ${this.escapeHtml(projectFiles.requirements)}Showing first 10 lines...
-
-
- `;
- }
-
- if (projectFiles.agents) {
- html += `
-
- 📄 README.md
-
- ▼
-
-
-
- ${this.escapeHtml(projectFiles.readme)}Showing first 10 lines...
-
-
- `;
- }
-
- html += '
- 📄 AGENTS.md
-
- ▼
-
-
-
- ${this.escapeHtml(projectFiles.agents)}Showing first 10 lines...
-Loading...
Empty directory
';
- return;
- }
-
- // Sort: directories first, then files, alphabetically
- entries.sort((a, b) => {
- if (a.is_dir !== b.is_dir) {
- return a.is_dir ? -1 : 1;
- }
- return a.name.localeCompare(b.name);
- });
-
- let html = '';
- for (const entry of entries) {
- const icon = entry.is_dir ? '📁' : '📄';
- const className = entry.is_dir ? 'directory' : 'file';
- const isSelected = entry.path === this.selectedPath;
-
- // Only show files if in file mode, always show directories
- if (this.mode === 'file' && !entry.is_dir) {
- html += `
-
-
- ${entry.name}
-
- `;
- } else if (entry.is_dir) {
- html += `
-
-
- ${entry.name}
-
- `;
- }
- }
-
- listContainer.innerHTML = html;
-
- // Add click handlers
- listContainer.querySelectorAll('.file-browser-item').forEach(item => {
- item.addEventListener('click', () => this.handleItemClick(item));
- });
- },
-
- async handleItemClick(item) {
- const path = item.dataset.path;
- const isDir = item.dataset.isDir === 'true';
-
- if (isDir) {
- // Double-click to navigate into directory
- if (this.selectedPath === path) {
- await this.loadDirectory(path);
- } else {
- // Single click to select directory
- this.selectedPath = path;
- // Update UI
- document.querySelectorAll('.file-browser-item').forEach(i => {
- i.classList.remove('selected');
- });
- item.classList.add('selected');
- }
- } else {
- // Select file
- this.selectedPath = path;
- // Update UI
- document.querySelectorAll('.file-browser-item').forEach(i => {
- i.classList.remove('selected');
- });
- item.classList.add('selected');
- }
- }
-};
-
-// Expose to window
-window.fileBrowser = fileBrowser;
diff --git a/crates/g3-console/web/js/highlight.min.js b/crates/g3-console/web/js/highlight.min.js
deleted file mode 100644
index 5d699ae..0000000
--- a/crates/g3-console/web/js/highlight.min.js
+++ /dev/null
@@ -1,1213 +0,0 @@
-/*!
- Highlight.js v11.9.0 (git: f47103d4f1)
- (c) 2006-2023 undefined and other contributors
- License: BSD-3-Clause
- */
-var hljs=function(){"use strict";function e(n){
-return n instanceof Map?n.clear=n.delete=n.set=()=>{
-throw Error("map is read-only")}:n instanceof Set&&(n.add=n.clear=n.delete=()=>{
-throw Error("set is read-only")
-}),Object.freeze(n),Object.getOwnPropertyNames(n).forEach((t=>{
-const a=n[t],i=typeof a;"object"!==i&&"function"!==i||Object.isFrozen(a)||e(a)
-})),n}class n{constructor(e){
-void 0===e.data&&(e.data={}),this.data=e.data,this.isMatchIgnored=!1}
-ignoreMatch(){this.isMatchIgnored=!0}}function t(e){
-return e.replace(/&/g,"&").replace(//g,">").replace(/"/g,""").replace(/'/g,"'")
-}function a(e,...n){const t=Object.create(null);for(const n in e)t[n]=e[n]
-;return n.forEach((e=>{for(const n in e)t[n]=e[n]})),t}const i=e=>!!e.scope
-;class r{constructor(e,n){
-this.buffer="",this.classPrefix=n.classPrefix,e.walk(this)}addText(e){
-this.buffer+=t(e)}openNode(e){if(!i(e))return;const n=((e,{prefix:n})=>{
-if(e.startsWith("language:"))return e.replace("language:","language-")
-;if(e.includes(".")){const t=e.split(".")
-;return[`${n}${t.shift()}`,...t.map(((e,n)=>`${e}${"_".repeat(n+1)}`))].join(" ")
-}return`${n}${e}`})(e.scope,{prefix:this.classPrefix});this.span(n)}
-closeNode(e){i(e)&&(this.buffer+="")}value(){return this.buffer}span(e){
-this.buffer+=``}}const s=(e={})=>{const n={children:[]}
-;return Object.assign(n,e),n};class o{constructor(){
-this.rootNode=s(),this.stack=[this.rootNode]}get top(){
-return this.stack[this.stack.length-1]}get root(){return this.rootNode}add(e){
-this.top.children.push(e)}openNode(e){const n=s({scope:e})
-;this.add(n),this.stack.push(n)}closeNode(){
-if(this.stack.length>1)return this.stack.pop()}closeAllNodes(){
-for(;this.closeNode(););}toJSON(){return JSON.stringify(this.rootNode,null,4)}
-walk(e){return this.constructor._walk(e,this.rootNode)}static _walk(e,n){
-return"string"==typeof n?e.addText(n):n.children&&(e.openNode(n),
-n.children.forEach((n=>this._walk(e,n))),e.closeNode(n)),e}static _collapse(e){
-"string"!=typeof e&&e.children&&(e.children.every((e=>"string"==typeof e))?e.children=[e.children.join("")]:e.children.forEach((e=>{
-o._collapse(e)})))}}class l extends o{constructor(e){super(),this.options=e}
-addText(e){""!==e&&this.add(e)}startScope(e){this.openNode(e)}endScope(){
-this.closeNode()}__addSublanguage(e,n){const t=e.root
-;n&&(t.scope="language:"+n),this.add(t)}toHTML(){
-return new r(this,this.options).value()}finalize(){
-return this.closeAllNodes(),!0}}function c(e){
-return e?"string"==typeof e?e:e.source:null}function d(e){return b("(?=",e,")")}
-function g(e){return b("(?:",e,")*")}function u(e){return b("(?:",e,")?")}
-function b(...e){return e.map((e=>c(e))).join("")}function m(...e){const n=(e=>{
-const n=e[e.length-1]
-;return"object"==typeof n&&n.constructor===Object?(e.splice(e.length-1,1),n):{}
-})(e);return"("+(n.capture?"":"?:")+e.map((e=>c(e))).join("|")+")"}
-function p(e){return RegExp(e.toString()+"|").exec("").length-1}
-const _=/\[(?:[^\\\]]|\\.)*\]|\(\??|\\([1-9][0-9]*)|\\./
-;function h(e,{joinWith:n}){let t=0;return e.map((e=>{t+=1;const n=t
-;let a=c(e),i="";for(;a.length>0;){const e=_.exec(a);if(!e){i+=a;break}
-i+=a.substring(0,e.index),
-a=a.substring(e.index+e[0].length),"\\"===e[0][0]&&e[1]?i+="\\"+(Number(e[1])+n):(i+=e[0],
-"("===e[0]&&t++)}return i})).map((e=>`(${e})`)).join(n)}
-const f="[a-zA-Z]\\w*",E="[a-zA-Z_]\\w*",y="\\b\\d+(\\.\\d+)?",N="(-?)(\\b0[xX][a-fA-F0-9]+|(\\b\\d+(\\.\\d*)?|\\.\\d+)([eE][-+]?\\d+)?)",w="\\b(0b[01]+)",v={
-begin:"\\\\[\\s\\S]",relevance:0},O={scope:"string",begin:"'",end:"'",
-illegal:"\\n",contains:[v]},k={scope:"string",begin:'"',end:'"',illegal:"\\n",
-contains:[v]},x=(e,n,t={})=>{const i=a({scope:"comment",begin:e,end:n,
-contains:[]},t);i.contains.push({scope:"doctag",
-begin:"[ ]*(?=(TODO|FIXME|NOTE|BUG|OPTIMIZE|HACK|XXX):)",
-end:/(TODO|FIXME|NOTE|BUG|OPTIMIZE|HACK|XXX):/,excludeBegin:!0,relevance:0})
-;const r=m("I","a","is","so","us","to","at","if","in","it","on",/[A-Za-z]+['](d|ve|re|ll|t|s|n)/,/[A-Za-z]+[-][a-z]+/,/[A-Za-z][a-z]{2,}/)
-;return i.contains.push({begin:b(/[ ]+/,"(",r,/[.]?[:]?([.][ ]|[ ])/,"){3}")}),i
-},M=x("//","$"),S=x("/\\*","\\*/"),A=x("#","$");var C=Object.freeze({
-__proto__:null,APOS_STRING_MODE:O,BACKSLASH_ESCAPE:v,BINARY_NUMBER_MODE:{
-scope:"number",begin:w,relevance:0},BINARY_NUMBER_RE:w,COMMENT:x,
-C_BLOCK_COMMENT_MODE:S,C_LINE_COMMENT_MODE:M,C_NUMBER_MODE:{scope:"number",
-begin:N,relevance:0},C_NUMBER_RE:N,END_SAME_AS_BEGIN:e=>Object.assign(e,{
-"on:begin":(e,n)=>{n.data._beginMatch=e[1]},"on:end":(e,n)=>{
-n.data._beginMatch!==e[1]&&n.ignoreMatch()}}),HASH_COMMENT_MODE:A,IDENT_RE:f,
-MATCH_NOTHING_RE:/\b\B/,METHOD_GUARD:{begin:"\\.\\s*"+E,relevance:0},
-NUMBER_MODE:{scope:"number",begin:y,relevance:0},NUMBER_RE:y,
-PHRASAL_WORDS_MODE:{
-begin:/\b(a|an|the|are|I'm|isn't|don't|doesn't|won't|but|just|should|pretty|simply|enough|gonna|going|wtf|so|such|will|you|your|they|like|more)\b/
-},QUOTE_STRING_MODE:k,REGEXP_MODE:{scope:"regexp",begin:/\/(?=[^/\n]*\/)/,
-end:/\/[gimuy]*/,contains:[v,{begin:/\[/,end:/\]/,relevance:0,contains:[v]}]},
-RE_STARTERS_RE:"!|!=|!==|%|%=|&|&&|&=|\\*|\\*=|\\+|\\+=|,|-|-=|/=|/|:|;|<<|<<=|<=|<|===|==|=|>>>=|>>=|>=|>>>|>>|>|\\?|\\[|\\{|\\(|\\^|\\^=|\\||\\|=|\\|\\||~",
-SHEBANG:(e={})=>{const n=/^#![ ]*\//
-;return e.binary&&(e.begin=b(n,/.*\b/,e.binary,/\b.*/)),a({scope:"meta",begin:n,
-end:/$/,relevance:0,"on:begin":(e,n)=>{0!==e.index&&n.ignoreMatch()}},e)},
-TITLE_MODE:{scope:"title",begin:f,relevance:0},UNDERSCORE_IDENT_RE:E,
-UNDERSCORE_TITLE_MODE:{scope:"title",begin:E,relevance:0}});function T(e,n){
-"."===e.input[e.index-1]&&n.ignoreMatch()}function R(e,n){
-void 0!==e.className&&(e.scope=e.className,delete e.className)}function D(e,n){
-n&&e.beginKeywords&&(e.begin="\\b("+e.beginKeywords.split(" ").join("|")+")(?!\\.)(?=\\b|\\s)",
-e.__beforeBegin=T,e.keywords=e.keywords||e.beginKeywords,delete e.beginKeywords,
-void 0===e.relevance&&(e.relevance=0))}function I(e,n){
-Array.isArray(e.illegal)&&(e.illegal=m(...e.illegal))}function L(e,n){
-if(e.match){
-if(e.begin||e.end)throw Error("begin & end are not supported with match")
-;e.begin=e.match,delete e.match}}function B(e,n){
-void 0===e.relevance&&(e.relevance=1)}const $=(e,n)=>{if(!e.beforeMatch)return
-;if(e.starts)throw Error("beforeMatch cannot be used with starts")
-;const t=Object.assign({},e);Object.keys(e).forEach((n=>{delete e[n]
-})),e.keywords=t.keywords,e.begin=b(t.beforeMatch,d(t.begin)),e.starts={
-relevance:0,contains:[Object.assign(t,{endsParent:!0})]
-},e.relevance=0,delete t.beforeMatch
-},z=["of","and","for","in","not","or","if","then","parent","list","value"],F="keyword"
-;function U(e,n,t=F){const a=Object.create(null)
-;return"string"==typeof e?i(t,e.split(" ")):Array.isArray(e)?i(t,e):Object.keys(e).forEach((t=>{
-Object.assign(a,U(e[t],n,t))})),a;function i(e,t){
-n&&(t=t.map((e=>e.toLowerCase()))),t.forEach((n=>{const t=n.split("|")
-;a[t[0]]=[e,j(t[0],t[1])]}))}}function j(e,n){
-return n?Number(n):(e=>z.includes(e.toLowerCase()))(e)?0:1}const P={},K=e=>{
-console.error(e)},H=(e,...n)=>{console.log("WARN: "+e,...n)},q=(e,n)=>{
-P[`${e}/${n}`]||(console.log(`Deprecated as of ${e}. ${n}`),P[`${e}/${n}`]=!0)
-},G=Error();function Z(e,n,{key:t}){let a=0;const i=e[t],r={},s={}
-;for(let e=1;e<=n.length;e++)s[e+a]=i[e],r[e+a]=!0,a+=p(n[e-1])
-;e[t]=s,e[t]._emit=r,e[t]._multi=!0}function W(e){(e=>{
-e.scope&&"object"==typeof e.scope&&null!==e.scope&&(e.beginScope=e.scope,
-delete e.scope)})(e),"string"==typeof e.beginScope&&(e.beginScope={
-_wrap:e.beginScope}),"string"==typeof e.endScope&&(e.endScope={_wrap:e.endScope
-}),(e=>{if(Array.isArray(e.begin)){
-if(e.skip||e.excludeBegin||e.returnBegin)throw K("skip, excludeBegin, returnBegin not compatible with beginScope: {}"),
-G
-;if("object"!=typeof e.beginScope||null===e.beginScope)throw K("beginScope must be object"),
-G;Z(e,e.begin,{key:"beginScope"}),e.begin=h(e.begin,{joinWith:""})}})(e),(e=>{
-if(Array.isArray(e.end)){
-if(e.skip||e.excludeEnd||e.returnEnd)throw K("skip, excludeEnd, returnEnd not compatible with endScope: {}"),
-G
-;if("object"!=typeof e.endScope||null===e.endScope)throw K("endScope must be object"),
-G;Z(e,e.end,{key:"endScope"}),e.end=h(e.end,{joinWith:""})}})(e)}function Q(e){
-function n(n,t){
-return RegExp(c(n),"m"+(e.case_insensitive?"i":"")+(e.unicodeRegex?"u":"")+(t?"g":""))
-}class t{constructor(){
-this.matchIndexes={},this.regexes=[],this.matchAt=1,this.position=0}
-addRule(e,n){
-n.position=this.position++,this.matchIndexes[this.matchAt]=n,this.regexes.push([n,e]),
-this.matchAt+=p(e)+1}compile(){0===this.regexes.length&&(this.exec=()=>null)
-;const e=this.regexes.map((e=>e[1]));this.matcherRe=n(h(e,{joinWith:"|"
-}),!0),this.lastIndex=0}exec(e){this.matcherRe.lastIndex=this.lastIndex
-;const n=this.matcherRe.exec(e);if(!n)return null
-;const t=n.findIndex(((e,n)=>n>0&&void 0!==e)),a=this.matchIndexes[t]
-;return n.splice(0,t),Object.assign(n,a)}}class i{constructor(){
-this.rules=[],this.multiRegexes=[],
-this.count=0,this.lastIndex=0,this.regexIndex=0}getMatcher(e){
-if(this.multiRegexes[e])return this.multiRegexes[e];const n=new t
-;return this.rules.slice(e).forEach((([e,t])=>n.addRule(e,t))),
-n.compile(),this.multiRegexes[e]=n,n}resumingScanAtSamePosition(){
-return 0!==this.regexIndex}considerAll(){this.regexIndex=0}addRule(e,n){
-this.rules.push([e,n]),"begin"===n.type&&this.count++}exec(e){
-const n=this.getMatcher(this.regexIndex);n.lastIndex=this.lastIndex
-;let t=n.exec(e)
-;if(this.resumingScanAtSamePosition())if(t&&t.index===this.lastIndex);else{
-const n=this.getMatcher(0);n.lastIndex=this.lastIndex+1,t=n.exec(e)}
-return t&&(this.regexIndex+=t.position+1,
-this.regexIndex===this.count&&this.considerAll()),t}}
-if(e.compilerExtensions||(e.compilerExtensions=[]),
-e.contains&&e.contains.includes("self"))throw Error("ERR: contains `self` is not supported at the top-level of a language. See documentation.")
-;return e.classNameAliases=a(e.classNameAliases||{}),function t(r,s){const o=r
-;if(r.isCompiled)return o
-;[R,L,W,$].forEach((e=>e(r,s))),e.compilerExtensions.forEach((e=>e(r,s))),
-r.__beforeBegin=null,[D,I,B].forEach((e=>e(r,s))),r.isCompiled=!0;let l=null
-;return"object"==typeof r.keywords&&r.keywords.$pattern&&(r.keywords=Object.assign({},r.keywords),
-l=r.keywords.$pattern,
-delete r.keywords.$pattern),l=l||/\w+/,r.keywords&&(r.keywords=U(r.keywords,e.case_insensitive)),
-o.keywordPatternRe=n(l,!0),
-s&&(r.begin||(r.begin=/\B|\b/),o.beginRe=n(o.begin),r.end||r.endsWithParent||(r.end=/\B|\b/),
-r.end&&(o.endRe=n(o.end)),
-o.terminatorEnd=c(o.end)||"",r.endsWithParent&&s.terminatorEnd&&(o.terminatorEnd+=(r.end?"|":"")+s.terminatorEnd)),
-r.illegal&&(o.illegalRe=n(r.illegal)),
-r.contains||(r.contains=[]),r.contains=[].concat(...r.contains.map((e=>(e=>(e.variants&&!e.cachedVariants&&(e.cachedVariants=e.variants.map((n=>a(e,{
-variants:null},n)))),e.cachedVariants?e.cachedVariants:X(e)?a(e,{
-starts:e.starts?a(e.starts):null
-}):Object.isFrozen(e)?a(e):e))("self"===e?r:e)))),r.contains.forEach((e=>{t(e,o)
-})),r.starts&&t(r.starts,s),o.matcher=(e=>{const n=new i
-;return e.contains.forEach((e=>n.addRule(e.begin,{rule:e,type:"begin"
-}))),e.terminatorEnd&&n.addRule(e.terminatorEnd,{type:"end"
-}),e.illegal&&n.addRule(e.illegal,{type:"illegal"}),n})(o),o}(e)}function X(e){
-return!!e&&(e.endsWithParent||X(e.starts))}class V extends Error{
-constructor(e,n){super(e),this.name="HTMLInjectionError",this.html=n}}
-const J=t,Y=a,ee=Symbol("nomatch"),ne=t=>{
-const a=Object.create(null),i=Object.create(null),r=[];let s=!0
-;const o="Could not find the language '{}', did you forget to load/include a language module?",c={
-disableAutodetect:!0,name:"Plain text",contains:[]};let p={
-ignoreUnescapedHTML:!1,throwUnescapedHTML:!1,noHighlightRe:/^(no-?highlight)$/i,
-languageDetectRe:/\blang(?:uage)?-([\w-]+)\b/i,classPrefix:"hljs-",
-cssSelector:"pre code",languages:null,__emitter:l};function _(e){
-return p.noHighlightRe.test(e)}function h(e,n,t){let a="",i=""
-;"object"==typeof n?(a=e,
-t=n.ignoreIllegals,i=n.language):(q("10.7.0","highlight(lang, code, ...args) has been deprecated."),
-q("10.7.0","Please use highlight(code, options) instead.\nhttps://github.com/highlightjs/highlight.js/issues/2277"),
-i=e,a=n),void 0===t&&(t=!0);const r={code:a,language:i};x("before:highlight",r)
-;const s=r.result?r.result:f(r.language,r.code,t)
-;return s.code=r.code,x("after:highlight",s),s}function f(e,t,i,r){
-const l=Object.create(null);function c(){if(!x.keywords)return void S.addText(A)
-;let e=0;x.keywordPatternRe.lastIndex=0;let n=x.keywordPatternRe.exec(A),t=""
-;for(;n;){t+=A.substring(e,n.index)
-;const i=w.case_insensitive?n[0].toLowerCase():n[0],r=(a=i,x.keywords[a]);if(r){
-const[e,a]=r
-;if(S.addText(t),t="",l[i]=(l[i]||0)+1,l[i]<=7&&(C+=a),e.startsWith("_"))t+=n[0];else{
-const t=w.classNameAliases[e]||e;g(n[0],t)}}else t+=n[0]
-;e=x.keywordPatternRe.lastIndex,n=x.keywordPatternRe.exec(A)}var a
-;t+=A.substring(e),S.addText(t)}function d(){null!=x.subLanguage?(()=>{
-if(""===A)return;let e=null;if("string"==typeof x.subLanguage){
-if(!a[x.subLanguage])return void S.addText(A)
-;e=f(x.subLanguage,A,!0,M[x.subLanguage]),M[x.subLanguage]=e._top
-}else e=E(A,x.subLanguage.length?x.subLanguage:null)
-;x.relevance>0&&(C+=e.relevance),S.__addSublanguage(e._emitter,e.language)
-})():c(),A=""}function g(e,n){
-""!==e&&(S.startScope(n),S.addText(e),S.endScope())}function u(e,n){let t=1
-;const a=n.length-1;for(;t<=a;){if(!e._emit[t]){t++;continue}
-const a=w.classNameAliases[e[t]]||e[t],i=n[t];a?g(i,a):(A=i,c(),A=""),t++}}
-function b(e,n){
-return e.scope&&"string"==typeof e.scope&&S.openNode(w.classNameAliases[e.scope]||e.scope),
-e.beginScope&&(e.beginScope._wrap?(g(A,w.classNameAliases[e.beginScope._wrap]||e.beginScope._wrap),
-A=""):e.beginScope._multi&&(u(e.beginScope,n),A="")),x=Object.create(e,{parent:{
-value:x}}),x}function m(e,t,a){let i=((e,n)=>{const t=e&&e.exec(n)
-;return t&&0===t.index})(e.endRe,a);if(i){if(e["on:end"]){const a=new n(e)
-;e["on:end"](t,a),a.isMatchIgnored&&(i=!1)}if(i){
-for(;e.endsParent&&e.parent;)e=e.parent;return e}}
-if(e.endsWithParent)return m(e.parent,t,a)}function _(e){
-return 0===x.matcher.regexIndex?(A+=e[0],1):(D=!0,0)}function h(e){
-const n=e[0],a=t.substring(e.index),i=m(x,e,a);if(!i)return ee;const r=x
-;x.endScope&&x.endScope._wrap?(d(),
-g(n,x.endScope._wrap)):x.endScope&&x.endScope._multi?(d(),
-u(x.endScope,e)):r.skip?A+=n:(r.returnEnd||r.excludeEnd||(A+=n),
-d(),r.excludeEnd&&(A=n));do{
-x.scope&&S.closeNode(),x.skip||x.subLanguage||(C+=x.relevance),x=x.parent
-}while(x!==i.parent);return i.starts&&b(i.starts,e),r.returnEnd?0:n.length}
-let y={};function N(a,r){const o=r&&r[0];if(A+=a,null==o)return d(),0
-;if("begin"===y.type&&"end"===r.type&&y.index===r.index&&""===o){
-if(A+=t.slice(r.index,r.index+1),!s){const n=Error(`0 width match regex (${e})`)
-;throw n.languageName=e,n.badRule=y.rule,n}return 1}
-if(y=r,"begin"===r.type)return(e=>{
-const t=e[0],a=e.rule,i=new n(a),r=[a.__beforeBegin,a["on:begin"]]
-;for(const n of r)if(n&&(n(e,i),i.isMatchIgnored))return _(t)
-;return a.skip?A+=t:(a.excludeBegin&&(A+=t),
-d(),a.returnBegin||a.excludeBegin||(A=t)),b(a,e),a.returnBegin?0:t.length})(r)
-;if("illegal"===r.type&&!i){
-const e=Error('Illegal lexeme "'+o+'" for mode "'+(x.scope||"'+(n?e:c(e,!0))+""+(n?e:c(e,!0))+"\n${e}\n`}html(e,t){return e}heading(e,t,n){return`
\n"}list(e,t,n){const s=t?"ol":"ul";return"<"+s+(t&&1!==n?' start="'+n+'"':"")+">\n"+e+"\n"}listitem(e,t,n){return`
${e}
\n`}table(e,t){return t&&(t=`${t}`),"${e}`}br(){return""}del(e){return`
An error occurred:
"+c(n.message+"",!0)+"";return t?Promise.resolve(e):e}if(t)return Promise.reject(n);throw n}}}const ae=new oe;function ce(e,t){return ae.parse(e,t)}ce.options=ce.setOptions=function(e){return ae.setOptions(e),ce.defaults=ae.defaults,n(ce.defaults),ce},ce.getDefaults=t,ce.defaults=e.defaults,ce.use=function(...e){return ae.use(...e),ce.defaults=ae.defaults,n(ce.defaults),ce},ce.walkTokens=function(e,t){return ae.walkTokens(e,t)},ce.parseInline=ae.parseInline,ce.Parser=ie,ce.parser=ie.parse,ce.Renderer=se,ce.TextRenderer=re,ce.Lexer=ne,ce.lexer=ne.lex,ce.Tokenizer=w,ce.Hooks=le,ce.parse=ce;const he=ce.options,pe=ce.setOptions,ue=ce.use,ke=ce.walkTokens,ge=ce.parseInline,fe=ce,de=ie.parse,xe=ne.lex;e.Hooks=le,e.Lexer=ne,e.Marked=oe,e.Parser=ie,e.Renderer=se,e.TextRenderer=re,e.Tokenizer=w,e.getDefaults=t,e.lexer=xe,e.marked=ce,e.options=he,e.parse=fe,e.parseInline=ge,e.parser=de,e.setOptions=pe,e.use=ue,e.walkTokens=ke})); diff --git a/crates/g3-console/web/js/router.js b/crates/g3-console/web/js/router.js deleted file mode 100644 index cfe77a5..0000000 --- a/crates/g3-console/web/js/router.js +++ /dev/null @@ -1,480 +0,0 @@ -// Simple client-side router with proper state management -const router = { - currentRoute: '/', - refreshTimeout: null, - detailRefreshTimeout: null, - currentInstanceId: null, - initialized: false, - renderInProgress: false, - REFRESH_INTERVAL_MS: 3000, // Refresh every 3 seconds for live updates - - init() { - console.log('[Router] init() called'); - if (this.initialized) { - console.log('[Router] Already initialized, skipping'); - return; - } - this.initialized = true; - - // Handle browser back/forward - window.addEventListener('popstate', () => { - console.log('[Router] popstate event'); - this.handleRoute(window.location.pathname); - }); - - // Handle initial route - call once after a short delay to ensure DOM is ready - setTimeout(() => { - console.log('[Router] Initial route handling'); - this.handleRoute(window.location.pathname); - }, 100); - }, - - navigate(path) { - console.log('[Router] navigate:', path); - // Cancel any pending refreshes - this.cancelRefreshes(); - window.history.pushState({}, '', path); - this.handleRoute(path); - }, - - cancelRefreshes() { - if (this.refreshTimeout) { - console.log('[Router] Cancelling home refresh timeout'); - clearTimeout(this.refreshTimeout); - this.refreshTimeout = null; - } - if (this.detailRefreshTimeout) { - console.log('[Router] Cancelling detail refresh timeout'); - clearTimeout(this.detailRefreshTimeout); - this.detailRefreshTimeout = null; - } - }, - - async handleRoute(path) { - this.currentRoute = path; - console.log('[Router] handleRoute:', path); - const container = document.getElementById('page-container'); - - if (!container) { - console.error('[Router] page-container not found!'); - return; - } - - // Cancel any pending refreshes when route changes - this.cancelRefreshes(); - - if (path === '/' || path === '') { - await this.renderHome(container); - } else if (path.startsWith('/instance/')) { - const id = path.split('/')[2]; - await this.renderDetail(container, id); - } else { - container.innerHTML = components.error('Page not found'); - } - }, - - async renderHome(container) { - console.log('[Router] renderHome called, renderInProgress:', this.renderInProgress); - - // Prevent concurrent renders - if (this.renderInProgress) { - console.log('[Router] Render already in progress, skipping'); - return; - } - - this.renderInProgress = true; - - try { - // Flash live indicator - this.flashLiveIndicator(); - - // Check if we already have a container for instances - let instancesList = container.querySelector('.instances-list'); - const isInitialLoad = !instancesList; - - console.log('[Router] Fetching instances from API'); - const instances = await api.getInstances(); - console.log('[Router] Received', instances.length, 'instances'); - - // Check if we're still on the home route (user might have navigated away) - if (this.currentRoute !== '/' && this.currentRoute !== '') { - console.log('[Router] Route changed during fetch, aborting render'); - return; - } - - - if (instances.length === 0) { - console.log('[Router] No instances, showing empty state'); - // Check if we already have empty state - if (!container.querySelector('.empty-state')) { - container.innerHTML = components.emptyState( - 'No running instances. Click "+ New Run" to start one.' - ); - } - } else { - console.log('[Router] Building HTML for', instances.length, 'instances'); - - if (isInitialLoad) { - instancesList = document.createElement('div'); - instancesList.className = 'instances-list'; - } - - // Build a map of existing panels for efficient lookup - const existingPanels = new Map(); - if (!isInitialLoad) { - instancesList.querySelectorAll('.instance-panel').forEach(panel => { - const id = panel.getAttribute('data-id'); - if (id) existingPanels.set(id, panel); - }); - } - - // Track which IDs we've seen - const currentIds = new Set(); - - for (const instance of instances) { - currentIds.add(instance.id); - const stats = instance.stats || { total_tokens: 0, tool_calls: 0, errors: 0, duration_secs: 0 }; - const newHtml = components.instancePanel(instance, stats, instance.latest_message); - - const existingPanel = existingPanels.get(instance.id); - if (existingPanel) { - // Update existing panel in-place by replacing inner content - const tempDiv = document.createElement('div'); - tempDiv.innerHTML = newHtml; - const newPanel = tempDiv.firstElementChild; - existingPanel.replaceWith(newPanel); - } else { - // Add new panel - const tempDiv = document.createElement('div'); - tempDiv.innerHTML = newHtml; - instancesList.appendChild(tempDiv.firstElementChild); - } - } - - // Remove panels for instances that no longer exist - existingPanels.forEach((panel, id) => { - if (!currentIds.has(id)) { - panel.remove(); - } - }); - - if (isInitialLoad) { - // Only clear if container doesn't already have instances-list - if (container.firstChild && container.firstChild !== instancesList) { - container.innerHTML = ''; - } - container.appendChild(instancesList); - } - - console.log('[Router] HTML set successfully'); - } - - // Schedule next refresh only if still on home route - if (this.currentRoute === '/' || this.currentRoute === '') { - console.log(`[Router] Scheduling auto-refresh in ${this.REFRESH_INTERVAL_MS}ms`); - this.refreshTimeout = setTimeout(() => { - console.log('[Router] Auto-refresh triggered'); - this.renderHome(container); - }, this.REFRESH_INTERVAL_MS); - } - } catch (error) { - console.error('[Router] Error in renderHome:', error); - // Don't clear container on error, just show error message - if (!container.querySelector('.error-message')) { - const errorDiv = document.createElement('div'); - errorDiv.innerHTML = components.error('Failed to load instances: ' + error.message); - container.appendChild(errorDiv.firstElementChild); - } - } finally { - this.renderInProgress = false; - console.log('[Router] renderHome complete, renderInProgress reset to false'); - } - }, - - flashLiveIndicator() { - const indicator = document.getElementById('live-indicator'); - if (indicator) { - indicator.style.animation = 'none'; - // Force reflow - void indicator.offsetWidth; - indicator.style.animation = null; - indicator.style.opacity = '1'; - } - }, - - async renderDetail(container, id) { - console.log('[Router] renderDetail called for', id); - - this.currentInstanceId = id; - - try { - // Flash live indicator - this.flashLiveIndicator(); - - // Check if we already have a detail view for this instance - let detailView = container.querySelector('.detail-view'); - const isInitialLoad = !detailView || detailView.getAttribute('data-instance-id') !== id; - - const instance = await api.getInstance(id); - const logs = await api.getInstanceLogs(id); - - // Check if we're still on this detail route - if (this.currentRoute !== `/instance/${id}`) { - console.log('[Router] Route changed during fetch, aborting render'); - return; - } - - // If not initial load, update in place - if (!isInitialLoad) { - detailView = container.querySelector('.detail-view'); - if (detailView) { - this.updateDetailView(detailView, instance, logs); - // Schedule next refresh - if (this.currentRoute === `/instance/${id}`) { - this.detailRefreshTimeout = setTimeout(() => { - this.renderDetail(container, id); - }, 3000); - } - return; - } - } - - // Build detail view HTML - let html = ` -
-
-
- `;
-
- container.innerHTML = html;
-
- // Apply syntax highlighting
- document.querySelectorAll('pre code').forEach((block) => {
- hljs.highlightElement(block);
- });
-
- // Schedule next refresh only if still on this detail route
- if (this.currentRoute === `/instance/${id}`) {
- this.detailRefreshTimeout = setTimeout(() => {
- this.renderDetail(container, id);
- }, 3000);
- }
- } catch (error) {
- console.error('[Router] Error in renderDetail:', error);
- // Don't clear container on error, just show error message
- if (!container.querySelector('.error-message')) {
- const errorDiv = document.createElement('div');
- errorDiv.innerHTML = components.error('Failed to load instance: ' + error.message);
- container.appendChild(errorDiv.firstElementChild);
- }
- }
- },
-
- updateDetailView(detailView, instance, logs) {
- // Update status badge
- const statusBadge = detailView.querySelector('.detail-header .badge');
- if (statusBadge) {
- const tempDiv = document.createElement('div');
- tempDiv.innerHTML = components.statusBadge(instance.status);
- statusBadge.replaceWith(tempDiv.firstElementChild);
- }
-
- // Update stats
- const tokensStat = detailView.querySelector('[data-stat="tokens"] .stat-value');
- if (tokensStat) {
- tokensStat.textContent = (instance.stats?.total_tokens || 0).toLocaleString();
- }
-
- const toolCallsStat = detailView.querySelector('[data-stat="tool_calls"] .stat-value');
- if (toolCallsStat) {
- toolCallsStat.textContent = instance.stats?.tool_calls || 0;
- }
-
- const errorsStat = detailView.querySelector('[data-stat="errors"] .stat-value');
- if (errorsStat) {
- errorsStat.textContent = instance.stats?.errors || 0;
- }
-
- const durationStat = detailView.querySelector('[data-stat="duration"] .stat-value');
- if (durationStat) {
- durationStat.textContent = Math.round((instance.stats?.duration_secs || 0) / 60) + 'm';
- }
-
- // Update git status
- const gitStatusContainer = detailView.querySelector('.git-status-container');
- if (gitStatusContainer) {
- gitStatusContainer.innerHTML = components.gitStatus(instance.git_status);
- }
-
- // Update project files
- const projectFilesContainer = detailView.querySelector('.project-files-container');
- if (projectFilesContainer) {
- projectFilesContainer.innerHTML = components.projectFiles(instance.project_files);
- }
-
- // Update tool calls
- const toolCallsSection = detailView.querySelector('[data-section="tool-calls"]');
- if (toolCallsSection && logs && logs.tool_calls) {
- // Build a map of existing tool calls
- const existingToolCalls = new Map();
- toolCallsSection.querySelectorAll('.tool-call').forEach(tc => {
- const id = tc.getAttribute('data-tool-id');
- if (id) existingToolCalls.set(id, tc);
- });
-
- // Track which IDs we've seen
- const currentIds = new Set();
-
- if (logs.tool_calls.length > 0) {
- for (const toolCall of logs.tool_calls) {
- currentIds.add(toolCall.id);
- const newHtml = components.toolCall(toolCall);
-
- const existingToolCall = existingToolCalls.get(toolCall.id);
- if (existingToolCall) {
- // Update existing tool call in-place
- const tempDiv = document.createElement('div');
- tempDiv.innerHTML = newHtml;
- existingToolCall.replaceWith(tempDiv.firstElementChild);
- } else {
- // Add new tool call
- const tempDiv = document.createElement('div');
- tempDiv.innerHTML = newHtml;
- toolCallsSection.appendChild(tempDiv.firstElementChild);
- }
- }
-
- // Remove tool calls that no longer exist
- existingToolCalls.forEach((tc, id) => {
- if (!currentIds.has(id)) {
- tc.remove();
- }
- });
- }
- }
-
- // Update chat messages
- const chatMessages = detailView.querySelector('.chat-messages');
- if (chatMessages && logs && logs.messages && logs.messages.length > 0) {
- let html = '';
- for (const msg of logs.messages) {
- html += components.chatMessage(msg.content, msg.agent);
- }
- chatMessages.innerHTML = html;
- }
-
- // Re-apply syntax highlighting to any new code blocks
- detailView.querySelectorAll('pre code:not(.hljs)').forEach((block) => {
- hljs.highlightElement(block);
- });
- }
-};
-
-// Global function to view full file content
-window.viewFullFile = async function(fileName) {
- const modal = document.getElementById('full-file-modal');
- const title = document.getElementById('full-file-title');
- const content = document.getElementById('full-file-content');
-
- // Show modal
- modal.classList.remove('hidden');
- title.textContent = fileName;
- content.innerHTML = '
-
-
-
- ${instance.workspace}
- ${components.statusBadge(instance.status)} -
-
-
-
-
- Tokens
- ${(instance.stats?.total_tokens || 0).toLocaleString()}
-
-
- Tool Calls
- ${instance.stats?.tool_calls || 0}
-
-
- Errors
- ${instance.stats?.errors || 0}
-
-
- Duration
- ${Math.round((instance.stats?.duration_secs || 0) / 60)}m
-
-
-
- Git Status
-${components.gitStatus(instance.git_status)}
-
-
-
- Project Files
-${components.projectFiles(instance.project_files)}
-
-
- Tool Calls
-
- `;
-
- // Render tool calls
- if (logs && logs.tool_calls && logs.tool_calls.length > 0) {
- for (const toolCall of logs.tool_calls) {
- html += components.toolCall(toolCall);
- }
- } else {
- html += '
-
- No tool calls yet
'; - } - - html += ` -Chat History
- -Loading...
${components.escapeHtml(data.content)}
-
-
-
-
-
-
-
-
-
- G3 Console
- -
-
- )
- }
-
- React.useEffect(() => {
- // Highlight code blocks after render
- document.querySelectorAll('pre code').forEach((block) => {
- hljs.highlightElement(block)
- })
- }, [messages])
-
- if (messages.length === 0 && toolCalls.length === 0) {
- return (
-
-
- {message.agent.toUpperCase()}
-
-
- {new Date(message.timestamp).toLocaleTimeString()}
-
-
-
-
- No messages yet
-
- )
- }
-
- return (
-
- {messages.map(renderMessage)}
-
- {toolCalls.length > 0 && (
-
- )
-}
-
-export default ChatView
diff --git a/crates/g3-console/web/src/components/GitStatus.jsx b/crates/g3-console/web/src/components/GitStatus.jsx
deleted file mode 100644
index 9f756f1..0000000
--- a/crates/g3-console/web/src/components/GitStatus.jsx
+++ /dev/null
@@ -1,62 +0,0 @@
-import React from 'react'
-
-function GitStatus({ status }) {
- return (
-
-
- )}
- - Tool Calls -
- {toolCalls.map((toolCall) => ( -
-
- )
-}
-
-export default GitStatus
diff --git a/crates/g3-console/web/src/components/InstancePanel.jsx b/crates/g3-console/web/src/components/InstancePanel.jsx
deleted file mode 100644
index 597bd48..0000000
--- a/crates/g3-console/web/src/components/InstancePanel.jsx
+++ /dev/null
@@ -1,99 +0,0 @@
-import React from 'react'
-import StatusBadge from './StatusBadge'
-import ProgressBar from './ProgressBar'
-
-function InstancePanel({ instance, onClick, onKill, onRestart }) {
- const { instance: inst, stats, latest_message } = instance
-
- const handleKill = (e) => {
- e.stopPropagation()
- if (window.confirm('Are you sure you want to kill this instance?')) {
- onKill()
- }
- }
-
- const handleRestart = (e) => {
- e.stopPropagation()
- onRestart()
- }
-
- return (
- Git Status
-
-
-
- Branch:
- {status.branch}
-
-
- Uncommitted changes:
-
- {status.uncommitted_changes}
-
-
-
- {status.modified_files.length > 0 && (
-
-
- )}
-
- {status.added_files.length > 0 && (
-
- Modified ({status.modified_files.length})
-
- -
- {status.modified_files.map((file, i) => (
-
- • {file} - ))} -
-
- )}
-
- {status.deleted_files.length > 0 && (
-
- Added ({status.added_files.length})
-
- -
- {status.added_files.map((file, i) => (
-
- • {file} - ))} -
-
- )}
-
- Deleted ({status.deleted_files.length})
-
- -
- {status.deleted_files.map((file, i) => (
-
- • {file} - ))} -
-
- )
-}
-
-export default InstancePanel
diff --git a/crates/g3-console/web/src/components/NewRunModal.jsx b/crates/g3-console/web/src/components/NewRunModal.jsx
deleted file mode 100644
index 0546281..0000000
--- a/crates/g3-console/web/src/components/NewRunModal.jsx
+++ /dev/null
@@ -1,179 +0,0 @@
-import React, { useState } from 'react'
-
-function NewRunModal({ onClose, onLaunch }) {
- const [prompt, setPrompt] = useState('')
- const [workspace, setWorkspace] = useState('')
- const [provider, setProvider] = useState('databricks')
- const [model, setModel] = useState('databricks-claude-sonnet-4-5')
- const [mode, setMode] = useState('single')
- const [g3BinaryPath, setG3BinaryPath] = useState('')
- const [loading, setLoading] = useState(false)
-
- const handleSubmit = async (e) => {
- e.preventDefault()
- setLoading(true)
-
- const request = {
- prompt,
- workspace,
- provider,
- model,
- mode,
- g3_binary_path: g3BinaryPath || null,
- }
-
- await onLaunch(request)
- setLoading(false)
- }
-
- const isValid = prompt.trim() && workspace.trim()
-
- return (
-
-
-
-
-
-
-
- - {inst.workspace.split('/').pop() || 'Unknown'} -
-
- PID: {inst.pid} | Started: {new Date(inst.start_time).toLocaleTimeString()}
-
-
- {inst.status === 'running' && (
-
- )}
- {inst.status === 'terminated' && (
-
- )}
-
-
-
-
- {latest_message && (
-
-
- Tokens
-
- {stats.total_tokens.toLocaleString()}
-
-
-
- Tool Calls
-
- {stats.tool_calls}
-
-
-
- Errors
-
- {stats.errors}
-
-
- Latest: {latest_message}
-
- )}
-
-
- {inst.workspace}
-
-
-
-