CalvinBackup/gstack
1
0
Fork 0
mirror of https://github.com/garrytan/gstack.git synced 2026-05-08 06:26:45 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: cleanup + screenshot buttons in chat toolbar (not just inspector)

Browse Source 
Quick actions toolbar (🧹 Cleanup, 📸 Screenshot) now appears above the chat
input, always visible. Both inspector and chat buttons share runCleanup() and
runScreenshot() helper functions. Clicking either set shows loading state on
both simultaneously.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Garry Tan
2026-03-29 23:27:42 -07:00
parent fc606515b6
commit 92adc71bbc
3 changed files with 124 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
extension/sidepanel.js
+65 -64
View File
@@ -1149,73 +1149,74 @@ inspectorSendBtn.addEventListener('click', () => {
chrome.runtime.sendMessage({ type: 'sidebar-command', message });
});
// ─── Cleanup Button ─────────────────────────────────────────────
// ─── Quick Action Helpers (shared between chat toolbar + inspector) ──
async function runCleanup(...buttons) {
if (!serverUrl || !serverToken) {
addChatEntry({ type: 'notification', message: 'Not connected to browse server' });
return;
}
buttons.forEach(b => b?.classList.add('loading'));
try {
const resp = await fetch(`${serverUrl}/command`, {
method: 'POST',
headers: { ...authHeaders(), 'Content-Type': 'application/json' },
body: JSON.stringify({ command: 'cleanup', args: ['--all'] }),
signal: AbortSignal.timeout(15000),
});
const text = await resp.text();
if (resp.ok) {
addChatEntry({ type: 'notification', message: text || 'Page cleaned up' });
if (typeof inspectorShowEmpty === 'function') inspectorShowEmpty();
} else {
const err = JSON.parse(text).error || 'Cleanup failed';
addChatEntry({ type: 'notification', message: 'Error: ' + err });
}
} catch (err) {
addChatEntry({ type: 'notification', message: 'Cleanup failed: ' + err.message });
} finally {
buttons.forEach(b => b?.classList.remove('loading'));
}
}
async function runScreenshot(...buttons) {
if (!serverUrl || !serverToken) {
addChatEntry({ type: 'notification', message: 'Not connected to browse server' });
return;
}
buttons.forEach(b => b?.classList.add('loading'));
try {
const resp = await fetch(`${serverUrl}/command`, {
method: 'POST',
headers: { ...authHeaders(), 'Content-Type': 'application/json' },
body: JSON.stringify({ command: 'screenshot', args: [] }),
signal: AbortSignal.timeout(15000),
});
const text = await resp.text();
if (resp.ok) {
addChatEntry({ type: 'notification', message: text || 'Screenshot saved' });
} else {
const err = JSON.parse(text).error || 'Screenshot failed';
addChatEntry({ type: 'notification', message: 'Error: ' + err });
}
} catch (err) {
addChatEntry({ type: 'notification', message: 'Screenshot failed: ' + err.message });
} finally {
buttons.forEach(b => b?.classList.remove('loading'));
}
}
// ─── Wire up all cleanup/screenshot buttons (inspector + chat toolbar) ──
const inspectorCleanupBtn = document.getElementById('inspector-cleanup-btn');
if (inspectorCleanupBtn) {
inspectorCleanupBtn.addEventListener('click', async () => {
if (inspectorCleanupBtn.classList.contains('loading')) return;
if (!serverUrl || !serverToken) {
addChatEntry({ type: 'notification', message: 'Not connected to browse server' });
return;
}
inspectorCleanupBtn.classList.add('loading');
try {
const resp = await fetch(`${serverUrl}/command`, {
method: 'POST',
headers: { ...authHeaders(), 'Content-Type': 'application/json' },
body: JSON.stringify({ command: 'cleanup', args: ['--all'] }),
signal: AbortSignal.timeout(15000),
});
const text = await resp.text();
if (resp.ok) {
addChatEntry({ type: 'notification', message: text || 'Page cleaned up' });
// Reset inspector — selected element may have been removed
inspectorShowEmpty();
} else {
const err = JSON.parse(text).error || 'Cleanup failed';
addChatEntry({ type: 'notification', message: 'Error: ' + err });
}
} catch (err) {
addChatEntry({ type: 'notification', message: 'Cleanup failed: ' + err.message });
} finally {
inspectorCleanupBtn.classList.remove('loading');
}
});
}
// ─── Screenshot Button ──────────────────────────────────────────
const inspectorScreenshotBtn = document.getElementById('inspector-screenshot-btn');
if (inspectorScreenshotBtn) {
inspectorScreenshotBtn.addEventListener('click', async () => {
if (inspectorScreenshotBtn.classList.contains('loading')) return;
if (!serverUrl || !serverToken) {
addChatEntry({ type: 'notification', message: 'Not connected to browse server' });
return;
}
inspectorScreenshotBtn.classList.add('loading');
try {
const resp = await fetch(`${serverUrl}/command`, {
method: 'POST',
headers: { ...authHeaders(), 'Content-Type': 'application/json' },
body: JSON.stringify({ command: 'screenshot', args: [] }),
signal: AbortSignal.timeout(15000),
});
const text = await resp.text();
if (resp.ok) {
addChatEntry({ type: 'notification', message: text || 'Screenshot saved' });
} else {
const err = JSON.parse(text).error || 'Screenshot failed';
addChatEntry({ type: 'notification', message: 'Error: ' + err });
}
} catch (err) {
addChatEntry({ type: 'notification', message: 'Screenshot failed: ' + err.message });
} finally {
inspectorScreenshotBtn.classList.remove('loading');
}
});
}
const chatCleanupBtn = document.getElementById('chat-cleanup-btn');
const chatScreenshotBtn = document.getElementById('chat-screenshot-btn');
if (inspectorCleanupBtn) inspectorCleanupBtn.addEventListener('click', () => runCleanup(inspectorCleanupBtn, chatCleanupBtn));
if (inspectorScreenshotBtn) inspectorScreenshotBtn.addEventListener('click', () => runScreenshot(inspectorScreenshotBtn, chatScreenshotBtn));
if (chatCleanupBtn) chatCleanupBtn.addEventListener('click', () => runCleanup(chatCleanupBtn, inspectorCleanupBtn));
if (chatScreenshotBtn) chatScreenshotBtn.addEventListener('click', () => runScreenshot(chatScreenshotBtn, inspectorScreenshotBtn));
// ─── Section Toggles ────────────────────────────────────────────