@longshot/cli 0.0.1

package/dist/views/agent-progress.js

@@ -0,0 +1,242 @@
+import { layout } from "./layout.js";
+function escapeHtml(str) {
+    return str
+        .replace(/&/g, "&")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;")
+        .replace(/"/g, "&quot;");
+}
+function truncate(str, max) {
+    if (str.length <= max)
+        return str;
+    return str.slice(0, max) + "\u2026";
+}
+function renderEvent(event) {
+    const time = new Date(event.ts).toLocaleTimeString();
+    switch (event.type) {
+        case "user_message":
+            return `<div class="run-event run-event-user">
+        <div class="run-event-marker">U</div>
+        <div class="run-event-body">
+          <div class="run-event-label">Prompt <span class="run-event-time">${time}</span></div>
+          <div class="run-event-content">${escapeHtml(truncate(event.content || "", 300))}</div>
+        </div>
+      </div>`;
+        case "text":
+            return `<div class="run-event run-event-text">
+        <div class="run-event-marker">T</div>
+        <div class="run-event-body">
+          <div class="run-event-label">Text <span class="run-event-time">${time}</span></div>
+          <div class="run-event-content">${escapeHtml(truncate(event.content || "", 300))}</div>
+        </div>
+      </div>`;
+        case "tool_use": {
+            const name = event.name || "unknown";
+            let summary = name;
+            if (event.input) {
+                const inp = event.input;
+                if (name === "Read" && inp.file_path)
+                    summary = `Read ${inp.file_path.split("/").pop()}`;
+                else if (name === "Write" && inp.file_path)
+                    summary = `Write ${inp.file_path.split("/").pop()}`;
+                else if (name === "Edit" && inp.file_path)
+                    summary = `Edit ${inp.file_path.split("/").pop()}`;
+                else if (name === "Bash" && inp.command)
+                    summary = `Bash: ${truncate(inp.command, 60)}`;
+                else if (name === "Glob" && inp.pattern)
+                    summary = `Glob ${inp.pattern}`;
+                else if (name === "Grep" && inp.pattern)
+                    summary = `Grep ${inp.pattern}`;
+            }
+            return `<div class="run-event run-event-tool-use">
+        <div class="run-event-marker">&#x2699;</div>
+        <div class="run-event-body">
+          <div class="run-event-label">${escapeHtml(summary)} <span class="run-event-time">${time}</span></div>
+        </div>
+      </div>`;
+        }
+        case "tool_result":
+            return `<div class="run-event run-event-tool-result">
+        <div class="run-event-marker">&#x2713;</div>
+        <div class="run-event-body">
+          <div class="run-event-label">Result <span class="run-event-time">${time}</span></div>
+        </div>
+      </div>`;
+        case "error":
+            return `<div class="run-event run-event-error">
+        <div class="run-event-marker">!</div>
+        <div class="run-event-body">
+          <div class="run-event-label">Error <span class="run-event-time">${time}</span></div>
+          <div class="run-event-content">${escapeHtml(truncate(event.message || "", 300))}</div>
+        </div>
+      </div>`;
+        case "done":
+            return `<div class="run-event run-event-done">
+        <div class="run-event-marker">&#x25CF;</div>
+        <div class="run-event-body">
+          <div class="run-event-label">Agent finished <span class="run-event-time">${time}</span></div>
+        </div>
+      </div>`;
+        case "diff_ready":
+            return `<div class="run-event run-event-done">
+        <div class="run-event-marker">&#x25CF;</div>
+        <div class="run-event-body">
+          <div class="run-event-label">Diff ready <span class="run-event-time">${time}</span></div>
+          <div class="run-event-content">${escapeHtml(event.summary || "")}</div>
+        </div>
+      </div>`;
+        case "agent_done_no_changes":
+            return `<div class="run-event run-event-done">
+        <div class="run-event-marker">&#x25CF;</div>
+        <div class="run-event-body">
+          <div class="run-event-label">Done &mdash; no file changes <span class="run-event-time">${time}</span></div>
+        </div>
+      </div>`;
+        case "auto_committed":
+            return `<div class="run-event run-event-done">
+        <div class="run-event-marker">&#x2713;</div>
+        <div class="run-event-body">
+          <div class="run-event-label">Auto-committed <span class="run-event-time">${time}</span></div>
+          <div class="run-event-content">${escapeHtml(event.summary || "")}</div>
+        </div>
+      </div>`;
+        default:
+            return "";
+    }
+}
+export function agentProgressPage(runId, events, isRunning) {
+    const eventsHtml = events.map(renderEvent).filter(Boolean).join("\n");
+    // Check for terminal states from server-rendered events
+    let diffId = null;
+    let noChanges = false;
+    let autoCommitted = false;
+    for (const ev of events) {
+        if (ev.type === "diff_ready")
+            diffId = ev.diffId;
+        if (ev.type === "agent_done_no_changes")
+            noChanges = true;
+        if (ev.type === "auto_committed")
+            autoCommitted = true;
+    }
+    const doneSection = diffId
+        ? `<div class="agent-progress-done">
+        <a href="/diff/${diffId}" class="btn btn-review">Review Diff</a>
+      </div>`
+        : autoCommitted
+            ? `<div class="agent-progress-done">
+          <div class="agent-done">Done &mdash; changes committed</div>
+          <a href="/tasks" class="btn btn-small" style="margin-top:12px">Back to Tasks</a>
+        </div>`
+            : noChanges
+                ? `<div class="agent-progress-done">
+            <div class="agent-done">Done &mdash; no file changes</div>
+            <a href="/chat" class="btn btn-small" style="margin-top:12px">Back to Chat</a>
+          </div>`
+                : "";
+    const body = `
+    <div class="run-container">
+      <div class="run-header">
+        <a href="/chat" class="back-link">Chat</a>
+        <h1>Agent Progress</h1>
+        ${isRunning ? '<div class="agent-status-indicator">Agent working...</div>' : ""}
+      </div>
+      <div class="run-timeline" id="events-container">
+        ${eventsHtml}
+      </div>
+      <div id="done-section">${doneSection}</div>
+    </div>
+    <script>
+      const runId = ${JSON.stringify(runId)};
+      let eventCount = ${events.length};
+      let done = ${!isRunning && (!!diffId || noChanges || autoCommitted)};
+      const container = document.getElementById('events-container');
+      const doneSection = document.getElementById('done-section');
+
+      function escapeHtml(str) {
+        const div = document.createElement('div');
+        div.textContent = str;
+        return div.innerHTML;
+      }
+
+      function truncate(str, max) {
+        if (str.length <= max) return str;
+        return str.slice(0, max) + '\\u2026';
+      }
+
+      function toolSummary(name, input) {
+        if (!input) return name;
+        if (name === 'Read' && input.file_path) return 'Read ' + input.file_path.split('/').pop();
+        if (name === 'Write' && input.file_path) return 'Write ' + input.file_path.split('/').pop();
+        if (name === 'Edit' && input.file_path) return 'Edit ' + input.file_path.split('/').pop();
+        if (name === 'Bash' && input.command) return 'Bash: ' + truncate(input.command, 60);
+        if (name === 'Glob' && input.pattern) return 'Glob ' + input.pattern;
+        if (name === 'Grep' && input.pattern) return 'Grep ' + input.pattern;
+        return name;
+      }
+
+      function renderEventClient(ev) {
+        const time = new Date(ev.ts).toLocaleTimeString();
+        switch (ev.type) {
+          case 'user_message':
+            return '<div class="run-event run-event-user"><div class="run-event-marker">U</div><div class="run-event-body"><div class="run-event-label">Prompt <span class="run-event-time">' + time + '</span></div><div class="run-event-content">' + escapeHtml(truncate(ev.content || '', 300)) + '</div></div></div>';
+          case 'text':
+            return '<div class="run-event run-event-text"><div class="run-event-marker">T</div><div class="run-event-body"><div class="run-event-label">Text <span class="run-event-time">' + time + '</span></div><div class="run-event-content">' + escapeHtml(truncate(ev.content || '', 300)) + '</div></div></div>';
+          case 'tool_use':
+            return '<div class="run-event run-event-tool-use"><div class="run-event-marker">\\u2699</div><div class="run-event-body"><div class="run-event-label">' + escapeHtml(toolSummary(ev.name || 'unknown', ev.input)) + ' <span class="run-event-time">' + time + '</span></div></div></div>';
+          case 'tool_result':
+            return '<div class="run-event run-event-tool-result"><div class="run-event-marker">\\u2713</div><div class="run-event-body"><div class="run-event-label">Result <span class="run-event-time">' + time + '</span></div></div></div>';
+          case 'error':
+            return '<div class="run-event run-event-error"><div class="run-event-marker">!</div><div class="run-event-body"><div class="run-event-label">Error <span class="run-event-time">' + time + '</span></div><div class="run-event-content">' + escapeHtml(truncate(ev.message || '', 300)) + '</div></div></div>';
+          case 'done':
+            return '<div class="run-event run-event-done"><div class="run-event-marker">\\u25CF</div><div class="run-event-body"><div class="run-event-label">Agent finished <span class="run-event-time">' + time + '</span></div></div></div>';
+          case 'diff_ready':
+            return '<div class="run-event run-event-done"><div class="run-event-marker">\\u25CF</div><div class="run-event-body"><div class="run-event-label">Diff ready <span class="run-event-time">' + time + '</span></div><div class="run-event-content">' + escapeHtml(ev.summary || '') + '</div></div></div>';
+          case 'agent_done_no_changes':
+            return '<div class="run-event run-event-done"><div class="run-event-marker">\\u25CF</div><div class="run-event-body"><div class="run-event-label">Done \\u2014 no file changes <span class="run-event-time">' + time + '</span></div></div></div>';
+          case 'auto_committed':
+            return '<div class="run-event run-event-done"><div class="run-event-marker">\\u2713</div><div class="run-event-body"><div class="run-event-label">Auto-committed <span class="run-event-time">' + time + '</span></div><div class="run-event-content">' + escapeHtml(ev.summary || '') + '</div></div></div>';
+          default:
+            return '';
+        }
+      }
+
+      async function poll() {
+        if (done) return;
+        try {
+          const resp = await fetch('/api/agent/' + runId + '/events?after=' + eventCount);
+          const data = await resp.json();
+
+          for (const ev of data.events) {
+            const html = renderEventClient(ev);
+            if (html) container.insertAdjacentHTML('beforeend', html);
+          }
+          eventCount = data.total;
+
+          if (data.done) {
+            done = true;
+            // Remove the working indicator
+            const indicator = document.querySelector('.agent-status-indicator');
+            if (indicator) indicator.remove();
+
+            if (data.diffId) {
+              doneSection.innerHTML = '<div class="agent-progress-done"><a href="/diff/' + data.diffId + '" class="btn btn-review">Review Diff</a></div>';
+            } else if (data.autoCommitted) {
+              doneSection.innerHTML = '<div class="agent-progress-done"><div class="agent-done">Done \\u2014 changes committed</div><a href="/tasks" class="btn btn-small" style="margin-top:12px">Back to Tasks</a></div>';
+            } else {
+              doneSection.innerHTML = '<div class="agent-progress-done"><div class="agent-done">Done \\u2014 no file changes</div><a href="/chat" class="btn btn-small" style="margin-top:12px">Back to Chat</a></div>';
+            }
+          }
+
+          // Auto-scroll to bottom
+          container.scrollTop = container.scrollHeight;
+        } catch {}
+      }
+
+      if (!done) {
+        setInterval(poll, 2000);
+        // Also scroll to bottom on load
+        container.scrollTop = container.scrollHeight;
+      }
+    </script>`;
+    return layout("Agent", "chat", body);
+}

package/dist/views/branches.js

@@ -0,0 +1,191 @@
+import { layout } from "./layout.js";
+function escapeHtml(str) {
+    return str
+        .replace(/&/g, "&")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;")
+        .replace(/"/g, "&quot;");
+}
+function escapeAttr(str) {
+    return str.replace(/'/g, "\\'").replace(/"/g, "&quot;");
+}
+export function branchesPage(branches, currentBranch, hasPendingDiffs) {
+    const branchCards = branches.map((b) => {
+        const currentClass = b.isCurrent ? " branch-current" : "";
+        const currentLabel = b.isCurrent
+            ? `<span class="branch-current-label">current</span>`
+            : "";
+        const createdFrom = b.info?.createdFrom
+            ? `<div class="branch-meta">from ${escapeHtml(b.info.createdFrom)}</div>`
+            : "";
+        const taskCount = b.info?.taskIds && b.info.taskIds.length > 0
+            ? `<div class="branch-meta">${b.info.taskIds.length} task${b.info.taskIds.length === 1 ? "" : "s"} completed</div>`
+            : "";
+        const isMasterOrMain = b.name === "master" || b.name === "main";
+        let actions = "";
+        if (!b.isCurrent) {
+            actions += `<button class="btn btn-small btn-branch-switch" onclick="switchBranch('${escapeAttr(b.name)}')"${hasPendingDiffs ? " disabled title=\"Resolve pending diffs first\"" : ""}>Switch</button>`;
+        }
+        if (!isMasterOrMain) {
+            actions += `<button class="btn btn-small btn-branch-push" onclick="pushBranch('${escapeAttr(b.name)}')">Push</button>`;
+            if (!b.isCurrent) {
+                actions += `<button class="btn btn-small btn-branch-merge" onclick="mergeBranch('${escapeAttr(b.name)}')">Merge to ${escapeHtml(b.info?.createdFrom || "master")}</button>`;
+                actions += `<button class="btn btn-small btn-branch-delete" onclick="deleteBranch('${escapeAttr(b.name)}')">Delete</button>`;
+            }
+            else {
+                // Can merge current branch into its parent (will switch to parent first)
+                actions += `<button class="btn btn-small btn-branch-merge" onclick="mergeBranch('${escapeAttr(b.name)}')">Merge to ${escapeHtml(b.info?.createdFrom || "master")}</button>`;
+            }
+        }
+        return `
+      <div class="branch-card${currentClass}">
+        <div class="branch-card-top">
+          <span class="branch-name">${escapeHtml(b.name)}</span>
+          ${currentLabel}
+        </div>
+        ${createdFrom}
+        ${taskCount}
+        ${actions ? `<div class="branch-actions">${actions}</div>` : ""}
+      </div>
+    `;
+    }).join("");
+    const body = `
+    <div class="branches-container">
+      <div class="branches-header">
+        <h1>Branches</h1>
+      </div>
+
+      <div class="branch-create-form" id="branch-create-form">
+        <input type="text" id="new-branch-name" class="branch-input" placeholder="feature/my-branch" />
+        <button class="btn btn-primary" onclick="createBranch()" id="create-branch-btn">New Branch</button>
+      </div>
+
+      ${hasPendingDiffs ? `<div class="branch-warning">Pending diffs exist — switch is blocked until you approve or reject them.</div>` : ""}
+
+      <div id="branch-message" class="branch-message" style="display:none"></div>
+
+      <div class="branch-list" id="branch-list">
+        ${branchCards || `<div class="empty-state">No branches found</div>`}
+      </div>
+    </div>
+
+    <script>
+      async function createBranch() {
+        const input = document.getElementById('new-branch-name');
+        const name = input.value.trim();
+        if (!name) return;
+        const btn = document.getElementById('create-branch-btn');
+        btn.disabled = true;
+        btn.textContent = 'Creating...';
+        try {
+          const res = await fetch('/api/branches', {
+            method: 'POST',
+            headers: {'Content-Type': 'application/json'},
+            body: JSON.stringify({ name })
+          });
+          const data = await res.json();
+          if (res.ok) {
+            location.reload();
+          } else {
+            showMessage(data.error || 'Failed to create branch', true);
+            btn.disabled = false;
+            btn.textContent = 'New Branch';
+          }
+        } catch (err) {
+          showMessage('Network error', true);
+          btn.disabled = false;
+          btn.textContent = 'New Branch';
+        }
+      }
+
+      async function switchBranch(name) {
+        if (!confirm('Switch to branch "' + name + '"?')) return;
+        showMessage('Switching...', false);
+        try {
+          const res = await fetch('/api/branches/switch', {
+            method: 'POST',
+            headers: {'Content-Type': 'application/json'},
+            body: JSON.stringify({ name })
+          });
+          const data = await res.json();
+          if (res.ok) {
+            location.reload();
+          } else {
+            showMessage(data.error || 'Failed to switch branch', true);
+          }
+        } catch (err) {
+          showMessage('Network error', true);
+        }
+      }
+
+      async function pushBranch(name) {
+        showMessage('Pushing...', false);
+        try {
+          const res = await fetch('/api/branches/' + encodeURIComponent(name) + '/push', {
+            method: 'POST'
+          });
+          const data = await res.json();
+          if (res.ok && data.success) {
+            showMessage('Pushed ' + name + ' to remote', false);
+          } else {
+            showMessage(data.error || 'Failed to push', true);
+          }
+        } catch (err) {
+          showMessage('Network error', true);
+        }
+      }
+
+      async function mergeBranch(name) {
+        if (!confirm('Merge branch "' + name + '" into its parent?')) return;
+        showMessage('Merging...', false);
+        try {
+          const res = await fetch('/api/branches/' + encodeURIComponent(name) + '/merge', {
+            method: 'POST'
+          });
+          const data = await res.json();
+          if (res.ok && data.success) {
+            location.reload();
+          } else {
+            const msg = data.conflicts
+              ? 'Merge conflicts in: ' + data.conflicts.join(', ')
+              : (data.error || 'Failed to merge');
+            showMessage(msg, true);
+          }
+        } catch (err) {
+          showMessage('Network error', true);
+        }
+      }
+
+      async function deleteBranch(name) {
+        if (!confirm('Delete branch "' + name + '"? (Must be fully merged)')) return;
+        showMessage('Deleting...', false);
+        try {
+          const res = await fetch('/api/branches/' + encodeURIComponent(name), {
+            method: 'DELETE'
+          });
+          const data = await res.json();
+          if (res.ok) {
+            location.reload();
+          } else {
+            showMessage(data.error || 'Failed to delete branch', true);
+          }
+        } catch (err) {
+          showMessage('Network error', true);
+        }
+      }
+
+      function showMessage(text, isError) {
+        const el = document.getElementById('branch-message');
+        el.textContent = text;
+        el.style.display = 'block';
+        el.className = 'branch-message' + (isError ? ' branch-message-error' : ' branch-message-success');
+      }
+
+      // Enter key creates branch
+      document.getElementById('new-branch-name').addEventListener('keydown', function(e) {
+        if (e.key === 'Enter') createBranch();
+      });
+    </script>
+  `;
+    return layout("Branches", "tasks", body);
+}