diff --git "a/index.html" "b/index.html" --- "a/index.html" +++ "b/index.html" @@ -3,3826 +3,626 @@ -SoniCoder - - - - - - - -
- - - -
- Powered by running locally — no external APIs. Generate fullstack apps in any language and deploy to HuggingFace. -
- - -
- -
-
Terminal
-
-
-
-
- Lang: - -
-
- Framework: - -
- -
-
- ❯ - - - - -
-
-
-
- - -
-
- - - - - - -
-
- -
-
-
- ┌─────────────────────┐ - │ ╱━━━╲ │ - │ │ ▶ │ OUTPUT │ - │ ╵━━━╴ │ - └─────────────────────┘
-
Generate code to see output here
-
- Generated output - - -
- - -
-
-
stdout:
-
No output yet.
-
-
-
stderr:
-
No errors.
-
-
- - -
-
- — -
- - -
-
-
-
No code generated yet.
-
-
- - - - - -
-
-
🤖 Agent Mode (Claude Code-style)
- - -
- -
- -
-
When ON, the model can manipulate files in the sandboxed workspace and run shell commands.
-
- - -
- -
-
Type the command in chat (e.g. /commit, /review)
-
- - -
- -
-
Click a skill to activate it for the next prompt
-
- - - - - -
- -
-
- Click an agent to activate it. Built-in agents: code-reviewer, test-writer. - Or describe a new one in natural language and let the AI generate it: -
- -
-
✨ AI-Generate a Custom Agent
- -
- - -
-
- - -
- - -
- -
-
Rules fire on bash/file/prompt events. Add custom rules in workspace/.sonicoder/hooks/
-
- - -
- -
-
No todos yet. Use the agent to create some.
-
- -
- - -
- -
-
Empty. The agent will create files here.
-
-
- - -
-
Files live in ./workspace/ — sandboxed, path-escape protected
-
-
-
- - -
- -
-
📢 Import Project from GitHub
-
- Pull a remote repo into the current workspace. Accepts - https://github.com/owner/repo, - /tree/branch/subdir URLs, and SSH form. - The repo is shallow-cloned and copied into the workspace with - .git, node_modules, __pycache__, - .venv stripped. Or type /github <url> in chat for the AI to do it. -
-
- -
- - -
-
- - - -
-
-
-
- - -
-
🚀 Deploy to HuggingFace
- - -
- -
- - -
-
Sign in with OAuth — no token paste needed
-
- - -
- - -
Select your account or an organization
-
- -
- - -
The repo will be created at owner/repo-name
-
- -
- - -
Only needed if OAuth is unavailable. Get token
-
- -
- - -
JS frameworks auto-use Docker with Dockerfile build
-
- -
-
-
- - -
-
📦 Push Update to GitHub
-
- Snapshots the current workspace and pushes it as a commit to a - GitHub repo. Uses --force-with-lease so the latest - workspace contents overwrite the remote tip. -
- - -
- - -
If you omit the owner prefix, your username is used.
-
- -
- - -
- Needs repo scope. - Create a token ↗ -
-
- -
- - -
The GitHub user (or org) that owns the repo and matches the token.
-
- - -
- Advanced (optional) -
- - -
-
- - -
If empty, a timestamped message is used.
-
-
- - -
-
-
-
-
-
- - -
-
- ● - LOADING MODEL... -
-
-
- - -
-
- WEB PREVIEW - -
- -
- - + + + -function renderHooksList() { - const container = document.getElementById('hooks-list'); - if (!container) return; - const hooks = (CONFIG.hooks || []); - if (hooks.length === 0) { - container.innerHTML = '
No hooks configured.
'; - return; - } - container.innerHTML = hooks.map(h => { - const enabledColor = h.enabled ? 'var(--green)' : 'var(--gray-dim)'; - const actionColor = h.action === 'block' ? 'var(--red)' : 'var(--amber)'; - return `
-
- ${h.enabled ? 'ON' : 'OFF'} ${h.name} - [${h.action}] ${h.event} -
-
${(h.pattern || '').slice(0, 80)}
-
`; - }).join(''); -} + +
+ +
-// ═══════════════════════════════════════════════════════ -// CUSTOM AGENTS (AI-generated personas) -// ═══════════════════════════════════════════════════════ - -function renderAgentsList() { - const container = document.getElementById('agents-list'); - if (!container) return; - const agents = (state.agentsList || CONFIG.agents || []); - if (agents.length === 0) { - container.innerHTML = '
No agents yet. Describe one above to have the AI generate it, or use /agent create in chat.
'; - return; - } - container.innerHTML = agents.map(a => { - const isActive = state.activeAgent === a.name; - const bg = isActive ? 'var(--purple-dim, #2d1b4e)' : 'var(--bg-code)'; - const color = isActive ? 'var(--purple, #a855f7)' : 'var(--gray-light)'; - const border = isActive ? 'var(--purple, #a855f7)' : 'var(--border)'; - const tools = (a.tools || []).slice(0, 4).join(', ') + ((a.tools || []).length > 4 ? '...' : ''); - const isBuiltin = (a.author === 'builtin'); - const delBtn = isBuiltin ? '' : - `x`; - return `
-
- ${isActive ? '★ ' : ''}${a.name} [${a.author || 'user'}] - ${delBtn} -
-
${(a.description || '').slice(0, 100)}
- ${tools ? `
tools: ${tools}
` : ''} -
`; - }).join(''); -} +
+ + + + +
+
+

Chat

+
+ + +
+
-function showManualAgentEditor() { - document.getElementById('manual-agent-editor').style.display = 'block'; -} -function hideManualAgentEditor() { - document.getElementById('manual-agent-editor').style.display = 'none'; -} +
+
+
SoniCoder v2
+
+ AI-powered code agent that writes, runs, and debugs code. Built with patterns from Gemini CLI and Claude Code. Supports MCP tools and multiple 1B models. +
+
+
-async function saveManualAgent() { - const name = document.getElementById('agent-name-input').value.trim(); - const desc = document.getElementById('agent-desc-input').value.trim(); - const body = document.getElementById('agent-body-input').value.trim(); - const tools = document.getElementById('agent-tools-input').value.trim(); - const skills = document.getElementById('agent-skills-input').value.trim(); - const temp = document.getElementById('agent-temp-input').value.trim(); - const iter = document.getElementById('agent-iter-input').value.trim(); - if (!name || !body) { - addSystemMessage('Name and body are required to save an agent.'); - return; - } - try { - const es = await callAgentApi('save_agent', [name, desc, body, tools, skills, temp, iter, '', 'user']); - es.addEventListener('complete', (e) => { - try { - const data = JSON.parse(e.data); - const result = JSON.parse(data[0]); - if (result.success) { - addSystemMessage(`Agent '${name}' saved. Click it in the list (or /agent use ${name}) to activate.`); - hideManualAgentEditor(); - ['agent-name-input','agent-desc-input','agent-body-input','agent-tools-input','agent-skills-input','agent-temp-input','agent-iter-input'] - .forEach(id => { const el = document.getElementById(id); if (el) el.value = ''; }); - refreshAgents(); - } else { - addSystemMessage(`Failed to save agent: ${result.error || 'unknown'}`); - } - } catch (err) { console.error('Agent save error:', err); } - es.close(); - }); - es.addEventListener('error', () => es.close()); - } catch (err) { console.error('saveManualAgent failed:', err); } -} +
+
+ + +
+
Press Enter to send, Shift+Enter for new line
+
+
-function createAgentViaAI() { - const desc = document.getElementById('agent-create-input').value.trim(); - if (!desc) { - addSystemMessage('Describe the agent you want first.'); - return; - } - // Send `/agent create ` as a chat prompt — the agent_run - // handler routes it through the slash-command expansion + AI generation. - const input = document.getElementById('chat-input'); - if (input) { - input.value = `/agent create ${desc}`; - // Trigger send via the global handleSend() (defined elsewhere in this file) - if (typeof handleSend === 'function') { - handleSend(); - } else { - const sendBtn = document.getElementById('btn-send'); - if (sendBtn) sendBtn.click(); - } - } else { - // Fallback: tell user - addSystemMessage(`Type this in chat: /agent create ${desc}`); - } - document.getElementById('agent-create-input').value = ''; -} + +
+
+

Workspace

+
+
Loading...
+
+
-// ═══════════════════════════════════════════════════════ -// GITHUB IMPORT -// ═══════════════════════════════════════════════════════ - -async function importGithub() { - const urlEl = document.getElementById('github-url-input'); - const branchEl = document.getElementById('github-branch-input'); - const subdirEl = document.getElementById('github-subdir-input'); - const intoEl = document.getElementById('github-into-input'); - const statusEl = document.getElementById('github-import-status'); - const btn = document.getElementById('btn-import-github'); - - if (!urlEl) return; - const url = urlEl.value.trim(); - if (!url) { - if (statusEl) { - statusEl.style.color = 'var(--red)'; - statusEl.textContent = 'Please paste a GitHub URL first.'; - } - return; - } + - + \ No newline at end of file