task_detail.html 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <pstm-uri>/tasks/{task_id}</pstm-uri>
  5. <pstm-template>main</pstm-template>
  6. <script>
  7. // Live updates: the page subscribes to the global pulse (see the
  8. // entrypoint); whenever task or saddle state changes anywhere in
  9. // the app, the sealed refresh action rehydrates the task slot —
  10. // no fixed-interval polling. RFC bodies get the shared
  11. // text-highlight -> comment popover (see main.html). Design-task
  12. // plan reviews collect inline comments on the plan and submit them
  13. // as the block answer.
  14. if (window.statum) {
  15. (function () {
  16. 'use strict';
  17. statum.addStateListener('pulse', function () {
  18. var task = statum.read('task');
  19. if (task && task.refresh) {
  20. statum.act(task.refresh).catch(function () { });
  21. }
  22. });
  23. if (window.initQuoteComments) {
  24. window.initQuoteComments({
  25. matches: function (node) {
  26. return node.closest && node.closest('.rfc-body') != null
  27. && node.closest('[data-plan-body]') == null;
  28. },
  29. action: function () {
  30. var task = statum.read('task');
  31. return task && task.comment;
  32. }
  33. });
  34. }
  35. // Plan-review feedback: collected comments live in these maps
  36. // (keyed by block id) so statum re-renders never lose them;
  37. // the DOM list is rebuilt after every render cycle.
  38. var feedbackByBlock = {};
  39. var modeByBlock = {};
  40. var planPopover = null;
  41. statum.afterEvaluate(syncPlanFeedback);
  42. document.addEventListener('click', function (event) {
  43. if (!event.target.closest) return;
  44. var toggle = event.target.closest('[data-plan-toggle]');
  45. if (toggle) {
  46. hidePlanPopover();
  47. var review = toggle.closest('[data-plan-review]');
  48. var id = review && review.getAttribute('data-block-id');
  49. if (id) modeByBlock[id] = !modeByBlock[id];
  50. syncPlanFeedback();
  51. return;
  52. }
  53. var submit = event.target.closest('[data-plan-submit]');
  54. if (submit) {
  55. submitPlanFeedback(submit.closest('[data-plan-review]'));
  56. return;
  57. }
  58. var remove = event.target.closest('[data-plan-remove]');
  59. if (remove) {
  60. var entry = remove.closest('[data-plan-comment-id]');
  61. var blockId = remove.closest('[data-plan-review]').getAttribute('data-block-id');
  62. var list = feedbackByBlock[blockId] || [];
  63. var index = parseInt(entry.getAttribute('data-plan-comment-id'), 10);
  64. if (!isNaN(index) && list[index]) list.splice(index, 1);
  65. feedbackByBlock[blockId] = list;
  66. syncPlanFeedback();
  67. }
  68. });
  69. document.addEventListener('mouseup', function (event) {
  70. if (!event.target.closest) return;
  71. if (planPopover && planPopover.contains(event.target)) return;
  72. var body = event.target.closest('[data-plan-body]');
  73. if (!body) {
  74. hidePlanPopover();
  75. return;
  76. }
  77. var review = body.closest('[data-plan-review]');
  78. if (!review || review.getAttribute('data-plan-open') !== '1') return;
  79. var selection = window.getSelection();
  80. var text = selection ? String(selection.toString()).trim() : '';
  81. if (text.length === 0) {
  82. hidePlanPopover();
  83. return;
  84. }
  85. showPlanPopover(event.pageX, event.pageY, text, review);
  86. });
  87. document.addEventListener('mousedown', function (event) {
  88. if (planPopover && event.target.closest && event.target.closest('.plan-popover')) return;
  89. hidePlanPopover();
  90. });
  91. function showPlanPopover(x, y, quote, review) {
  92. hidePlanPopover();
  93. planPopover = document.createElement('div');
  94. planPopover.className = 'plan-popover';
  95. planPopover.style.left = Math.min(x, window.innerWidth - 140) + 'px';
  96. planPopover.style.top = y + 'px';
  97. var quoted = document.createElement('blockquote');
  98. quoted.textContent = quote;
  99. planPopover.appendChild(quoted);
  100. var body = document.createElement('textarea');
  101. body.placeholder = 'Your comment on the selected plan text';
  102. planPopover.appendChild(body);
  103. var actions = document.createElement('div');
  104. actions.className = 'actions';
  105. var add = document.createElement('button');
  106. add.type = 'button';
  107. add.className = 'primary';
  108. add.textContent = 'Add comment';
  109. add.addEventListener('click', function () {
  110. if (body.value.trim().length === 0) return;
  111. var id = review.getAttribute('data-block-id');
  112. var list = feedbackByBlock[id] || [];
  113. list.push({ quote: quote, body: body.value.trim() });
  114. feedbackByBlock[id] = list;
  115. hidePlanPopover();
  116. syncPlanFeedback();
  117. });
  118. var cancel = document.createElement('button');
  119. cancel.type = 'button';
  120. cancel.textContent = 'Cancel';
  121. cancel.addEventListener('click', hidePlanPopover);
  122. actions.appendChild(add);
  123. actions.appendChild(cancel);
  124. planPopover.appendChild(actions);
  125. document.body.appendChild(planPopover);
  126. body.focus();
  127. }
  128. function hidePlanPopover() {
  129. if (planPopover) {
  130. planPopover.remove();
  131. planPopover = null;
  132. }
  133. }
  134. function submitPlanFeedback(review) {
  135. if (!review) return;
  136. var id = review.getAttribute('data-block-id');
  137. var list = feedbackByBlock[id] || [];
  138. if (list.length === 0) {
  139. if (window.showToast) window.showToast('Highlight some plan text and add a comment first', 'error');
  140. return;
  141. }
  142. var task = statum.read('task');
  143. var block = null;
  144. (task && task.blocks || []).forEach(function (candidate) {
  145. if (String(candidate.id) === String(id)) block = candidate;
  146. });
  147. if (!block || !block.answer_action) return;
  148. var answer = list.map(function (item) {
  149. return item.quote
  150. ? '> ' + item.quote.replace(/\n/g, '\n> ') + '\n\n' + item.body
  151. : item.body;
  152. }).join('\n\n');
  153. feedbackByBlock[id] = [];
  154. modeByBlock[id] = false;
  155. statum.act(block.answer_action, { answer: answer }).catch(function () { });
  156. }
  157. function syncPlanFeedback() {
  158. document.querySelectorAll('[data-plan-review]').forEach(function (review) {
  159. var id = review.getAttribute('data-block-id');
  160. var open = modeByBlock[id] ? '1' : '0';
  161. review.setAttribute('data-plan-open', open);
  162. var feedback = review.querySelector('[data-plan-feedback]');
  163. if (feedback) {
  164. if (modeByBlock[id]) feedback.removeAttribute('hidden');
  165. else feedback.setAttribute('hidden', '');
  166. }
  167. var list = review.querySelector('[data-plan-comments]');
  168. if (!list) return;
  169. while (list.firstChild) list.removeChild(list.firstChild);
  170. (feedbackByBlock[id] || []).forEach(function (item, index) {
  171. var entry = document.createElement('li');
  172. entry.setAttribute('data-plan-comment-id', String(index));
  173. if (item.quote) {
  174. var quoted = document.createElement('blockquote');
  175. quoted.textContent = item.quote;
  176. entry.appendChild(quoted);
  177. }
  178. var body = document.createElement('div');
  179. body.textContent = item.body;
  180. entry.appendChild(body);
  181. var remove = document.createElement('button');
  182. remove.type = 'button';
  183. remove.className = 'inline';
  184. remove.setAttribute('data-plan-remove', '');
  185. remove.textContent = 'Remove';
  186. entry.appendChild(remove);
  187. list.appendChild(entry);
  188. });
  189. });
  190. }
  191. })();
  192. }
  193. </script>
  194. </head>
  195. <body>
  196. <section>
  197. <h2 stm-if="task != null && task.exists">#<span stm-text="task.id">id</span> —
  198. <span stm-text="task.title">title</span></h2>
  199. <p stm-if="task != null && !task.exists" class="muted">Task not found.</p>
  200. <div stm-if="task != null && task.exists">
  201. <p><a href="/tasks">All tasks</a> · project
  202. <a stm-attribute.href="'/projects/' + task.project_id" stm-text="task.project_name">project</a>
  203. <span stm-if="task.parent_task_id > 0"> · subtask of
  204. <a stm-attribute.href="'/tasks/' + task.parent_task_id" stm-text="'#' + task.parent_task_id">#parent</a></span></p>
  205. <div class="cards">
  206. <section class="card">
  207. <h3>Status</h3>
  208. <p><span stm-attribute.class="'badge badge-' + task.status" stm-text="task.display">status</span>
  209. · priority <strong stm-text="task.priority">5</strong>
  210. <span stm-if="task.is_design_task"> · <strong>plan review required</strong></span></p>
  211. <p class="muted">Created <span stm-text="task.created_display">when</span></p>
  212. <p class="muted" stm-if="task.started_display.length > 0">Started <span stm-text="task.started_display">when</span></p>
  213. <p class="muted" stm-if="task.completed_display.length > 0">Completed <span stm-text="task.completed_display">when</span></p>
  214. <p stm-if="task.task_branch.length > 0">Branch: <strong stm-text="task.task_branch">branch</strong>
  215. <span class="muted" stm-if="task.branch_from.length > 0"> from <span stm-text="task.branch_from">base</span></span></p>
  216. <p stm-if="task.working_branch.length > 0" class="muted">Working branch: <span stm-text="task.working_branch">branch</span></p>
  217. <p stm-if="task.status == 'suspended'" class="muted">Parked — waiting on
  218. subtasks (<span stm-text="task.subtask_open">0</span> open). The task
  219. resumes with a status report whenever one finishes.</p>
  220. <form class="inline">
  221. <input type="hidden" name="task_id" stm-attribute.value="task.id">
  222. <button type="button" stm-if="task.status == 'failed'" class="primary"
  223. stm-action="task.retry">Retry task</button>
  224. <button type="button" stm-if="task.resume_available"
  225. stm-action="task.resume"
  226. stm-confirm="Requeue this task? The daemon restores its workspace context on the next dispatch.">Requeue to resume</button>
  227. <button type="button" stm-action="task.cancel" stm-confirm="Cancel this task?">Cancel task</button>
  228. </form>
  229. </section>
  230. <section class="card">
  231. <h3>Description</h3>
  232. <div stm-if="task.description.length > 0" class="md" stm-markdown="task.description">description</div>
  233. <p class="muted" stm-if="task.description.length == 0">No description.</p>
  234. <p stm-if="task.summary.length > 0"><strong>Summary:</strong> <span stm-text="task.summary">summary</span></p>
  235. </section>
  236. <section class="card">
  237. <h3>Edit</h3>
  238. <form stm-action="task.update">
  239. <input type="hidden" name="task_id" stm-attribute.value="task.id">
  240. <div class="form-row"><label>Title</label>
  241. <input type="text" name="title" stm-attribute.value="task.title"></div>
  242. <div class="form-row"><label>Description</label>
  243. <textarea name="description" rows="4" stm-attribute.value="task.description"></textarea></div>
  244. <div class="form-row"><label>Priority (1–9)</label>
  245. <input type="number" name="priority" min="1" max="9" stm-attribute.value="task.priority"></div>
  246. <div class="form-row"><label>Task branch</label>
  247. <input type="text" name="task_branch" stm-attribute.value="task.task_branch" placeholder="task/<id>-<slug>"></div>
  248. <div class="form-row"><label>Branch from</label>
  249. <input type="text" name="branch_from" stm-attribute.value="task.branch_from"></div>
  250. <div class="form-row"><label>Status</label>
  251. <select name="status" stm-attribute.value="task.status">
  252. <option value="queued">queued</option>
  253. <option value="assigned">assigned</option>
  254. <option value="working">working</option>
  255. <option value="blocked">blocked</option>
  256. <option value="review_requested">review_requested</option>
  257. <option value="done">done</option>
  258. <option value="failed">failed</option>
  259. </select></div>
  260. <button type="submit">Save</button>
  261. </form>
  262. </section>
  263. </div>
  264. <h3>Plan</h3>
  265. <div stm-if="task.plan.length > 0" class="card md" stm-markdown="task.plan">plan</div>
  266. <details stm-if="task.plan.length > 0">
  267. <summary>Edit plan</summary>
  268. <form stm-action="task.save_plan">
  269. <input type="hidden" name="task_id" stm-attribute.value="task.id">
  270. <div class="form-row"><label for="plan-editor">Plan (markdown)</label>
  271. <textarea id="plan-editor" name="plan" rows="12" stm-attribute.value="task.plan"></textarea></div>
  272. <button type="submit" class="primary">Save plan</button>
  273. </form>
  274. </details>
  275. <details stm-if="task.plan.length == 0">
  276. <summary>Write a plan</summary>
  277. <form stm-action="task.save_plan">
  278. <input type="hidden" name="task_id" stm-attribute.value="task.id">
  279. <div class="form-row"><label for="plan-editor">Plan (markdown)</label>
  280. <textarea id="plan-editor" name="plan" rows="12" placeholder="The agent fills this in via `saddle plan` — or write it yourself."></textarea></div>
  281. <button type="submit" class="primary">Save plan</button>
  282. </form>
  283. </details>
  284. <h3>Progress</h3>
  285. <div stm-if="task.progress.length > 0">
  286. <p class="progress-latest" stm-text="task.progress[0].summary">latest</p>
  287. <p class="muted" stm-text="'reported ' + task.progress[0].when_display">when</p>
  288. <details stm-if="task.progress.length > 1">
  289. <summary>Show history (<span stm-text="task.progress.length">0</span> updates)</summary>
  290. <ul class="progress-history">
  291. <li stm-for-item-in="task.progress">
  292. <span class="muted" stm-text="item.when_display">when</span> —
  293. <span stm-text="item.summary">summary</span>
  294. </li>
  295. </ul>
  296. </details>
  297. </div>
  298. <p stm-if="task.progress.length == 0" class="muted">No progress reports yet — the agent reports via
  299. <code>saddle progress-update</code>.</p>
  300. <h3>Blocks <span class="muted" stm-if="task.blocks.length > 0">(<span stm-text="task.blocks.length">0</span>)</span></h3>
  301. <div stm-for-block-in="task.blocks" stm-key="block.id"
  302. stm-attribute.class="'block-card ' + block.block_type + (block.answered ? ' answered' : '')">
  303. <div stm-if="!block.answered && block.block_type == 'review'" class="review-banner">
  304. <h3>Review requested</h3>
  305. <div class="md" stm-markdown="block.body.length > 0 ? block.body : block.question">summary</div>
  306. <p>Branch <strong stm-text="task.task_branch">branch</strong>
  307. <a stm-if="task.review_diff_url.length > 0" stm-attribute.href="task.review_diff_url"
  308. target="_blank" rel="noopener">· compare changes</a></p>
  309. <div class="actions">
  310. <form stm-action="block.answer_action" class="inline">
  311. <input type="hidden" name="answer" value="Human approved the review">
  312. <button type="submit" class="approve">Approve</button>
  313. </form>
  314. <form stm-action="block.answer_action" class="inline">
  315. <textarea name="answer" rows="2" placeholder="What should change?"></textarea>
  316. <button type="submit" class="reject">Request changes</button>
  317. </form>
  318. </div>
  319. </div>
  320. <div stm-if="!block.answered && block.is_plan_review" class="plan-review"
  321. data-plan-review stm-attribute.data-block-id="block.id">
  322. <div class="md rfc-body" stm-markdown="task.plan" data-plan-body>plan</div>
  323. <div class="actions">
  324. <form stm-action="block.answer_action" class="inline">
  325. <input type="hidden" name="answer" value="Plan approved. Proceed with implementation.">
  326. <button type="submit" class="approve">Approve plan</button>
  327. </form>
  328. <button type="button" data-plan-toggle>Give feedback</button>
  329. </div>
  330. <div data-plan-feedback hidden>
  331. <p class="muted">Highlight plan text to attach a comment to it, then submit everything
  332. as feedback — the agent revises the plan and asks again.</p>
  333. <ul class="plan-comments" data-plan-comments></ul>
  334. <button type="button" class="primary" data-plan-submit>Submit feedback</button>
  335. </div>
  336. </div>
  337. <p><span stm-attribute.class="'badge badge-' + block.block_type" stm-text="block.block_type">type</span>
  338. <span class="muted" stm-text="block.created_display">when</span></p>
  339. <div stm-if="block.show_body && block.body.length > 0" class="md rfc-body"
  340. stm-markdown="block.body">body</div>
  341. <div stm-if="block.answered">
  342. <p>Answer: <strong stm-text="block.answer">answer</strong>
  343. <span class="muted" stm-text="block.answered_display">when</span>
  344. <span class="badge" stm-if="block.answered_by == 'auto'">auto</span></p>
  345. </div>
  346. <form stm-if="!block.answered && block.block_type == 'question'" stm-action="block.answer_action">
  347. <div class="options">
  348. <label stm-for-option-in="block.options" stm-key="option" class="option-card">
  349. <input type="radio" name="option" stm-attribute.value="option">
  350. <span stm-text="option">option</span>
  351. </label>
  352. <label>
  353. <input type="radio" name="option" value="__other__">
  354. <span>Other:</span>
  355. <textarea name="other" rows="2"></textarea>
  356. </label>
  357. </div>
  358. <button type="submit" class="primary">Answer</button>
  359. </form>
  360. <form stm-if="!block.answered && block.block_type != 'question' && block.block_type != 'review' && !block.is_plan_review"
  361. stm-action="block.answer_action" class="inline">
  362. <textarea name="answer" rows="3" placeholder="Your reply (delivered to the agent)"></textarea>
  363. <button type="submit" class="primary">Reply</button>
  364. </form>
  365. </div>
  366. <p stm-if="task.blocks.length == 0" class="muted">No blocks — the agent has no open questions.</p>
  367. <h3>Comments</h3>
  368. <div stm-for-comment-in="task.comments" stm-attribute.class="'comment' + (comment.from_bot ? ' bot' : '')">
  369. <strong stm-text="comment.author">author</strong>
  370. <span class="muted" stm-text="comment.when_display">when</span>
  371. <blockquote stm-if="comment.quote.length > 0" stm-text="comment.quote">quote</blockquote>
  372. <div stm-text="comment.body">body</div>
  373. </div>
  374. <p stm-if="task.comments.length == 0" class="muted">No comments yet.</p>
  375. <form stm-action="task.comment">
  376. <input type="hidden" name="task_id" stm-attribute.value="task.id">
  377. <div class="form-row"><label for="comment-body">Add comment</label>
  378. <textarea id="comment-body" name="body" rows="3" placeholder="A comment for the agent"></textarea></div>
  379. <button type="submit" class="primary">Comment</button>
  380. </form>
  381. <!-- The highlight-to-comment popover (main.html) fills and opens
  382. this dialog; it went missing in a template rework, which broke
  383. quoting on RFC bodies. -->
  384. <dialog id="quote-comment-dialog">
  385. <h3>Comment on selected text</h3>
  386. <blockquote id="quote-text" class="term-comment-quote"></blockquote>
  387. <form stm-action="task.comment">
  388. <input type="hidden" name="task_id" stm-attribute.value="task.id">
  389. <input type="hidden" name="quote">
  390. <input type="hidden" name="return_to">
  391. <textarea name="body" rows="4" placeholder="Your comment…" style="width:100%; margin:0.5em 0;"></textarea>
  392. <button type="submit" class="primary">Send comment</button>
  393. <button type="button" onclick="document.getElementById('quote-comment-dialog').close()">Cancel</button>
  394. </form>
  395. </dialog>
  396. <h3>Subtasks</h3>
  397. <p class="inline">Auto-approve subtask reviews:
  398. <strong stm-text="task.auto_approve ? 'on' : 'off'">off</strong>
  399. <button type="button" stm-action="task.toggle_auto_approve"
  400. stm-text="task.auto_approve ? 'Turn off' : 'Turn on'">Turn on</button>
  401. <span class="muted">— covered descendants' review blocks are answered
  402. automatically (questions and RFCs still block; this task's own review is
  403. never auto-approved).</span></p>
  404. <table>
  405. <thead><tr><th>#</th><th>Title</th><th>Status</th></tr></thead>
  406. <tbody>
  407. <tr stm-for-subtask-in="task.subtasks">
  408. <td stm-text="subtask.id">id</td>
  409. <td><a stm-attribute.href="'/tasks/' + subtask.id" stm-text="subtask.title">title</a></td>
  410. <td><span stm-attribute.class="'badge badge-' + subtask.status" stm-text="subtask.display">status</span></td>
  411. </tr>
  412. <tr stm-if="task.subtasks.length == 0"><td colspan="3" class="muted">No subtasks.</td></tr>
  413. </tbody>
  414. </table>
  415. <details>
  416. <summary><strong>New subtask</strong></summary>
  417. <form stm-action="task.subtask">
  418. <div class="form-row"><label>Title</label>
  419. <input type="text" name="title" required></div>
  420. <div class="form-row"><label>Description</label>
  421. <textarea name="description" rows="3"></textarea></div>
  422. <button type="submit">Create subtask</button>
  423. </form>
  424. </details>
  425. <h3>Dependencies</h3>
  426. <p stm-if="task.dependencies.length > 0">Depends on:
  427. <span stm-for-dep-in="task.dependencies">
  428. <a stm-attribute.href="'/tasks/' + dep.id" stm-text="'#' + dep.id + ' ' + dep.title">dep</a>
  429. <span stm-attribute.class="'badge badge-' + dep.status" stm-text="dep.status">status</span>
  430. </span>
  431. </p>
  432. <p stm-if="task.dependencies.length == 0" class="muted">No dependencies.</p>
  433. <form class="inline" stm-action="task.dependency">
  434. <label for="dep-target">Depends on</label>
  435. <select id="dep-target" name="depends_on_task_id" required>
  436. <option stm-for-candidate-in="task.candidates" stm-attribute.value="candidate.id"
  437. stm-text="'#' + candidate.id + ' ' + candidate.title">candidate</option>
  438. </select>
  439. <button type="submit">Add dependency</button>
  440. </form>
  441. <h3>Rules</h3>
  442. <p class="muted">Task rules lead the effective set dispatched with this task.</p>
  443. <div stm-for-rule-in="task.rules" stm-key="rule.link_id" class="card">
  444. <h3 stm-text="rule.name">name</h3>
  445. <div class="md" stm-markdown="rule.body">body</div>
  446. <form class="inline">
  447. <button type="button" stm-action="rule.detach" stm-confirm="Detach this rule?">Detach</button>
  448. </form>
  449. </div>
  450. <p stm-if="task.rules.length == 0" class="muted">No task-specific rules.</p>
  451. <form class="inline" stm-action="task.attach_rule" stm-if="task.rule_options.length > 0">
  452. <label for="task-rule-target">Attach rule</label>
  453. <select id="task-rule-target" name="rule_id" required>
  454. <option stm-for-option-in="task.rule_options" stm-attribute.value="option.id"
  455. stm-text="option.name">rule</option>
  456. </select>
  457. <button type="submit">Attach</button>
  458. </form>
  459. <h3>Required capabilities</h3>
  460. <p class="muted">The dispatcher only assigns this task to a saddle carrying all of these tags.</p>
  461. <p stm-if="task.capabilities.length > 0">
  462. <span stm-for-capability-in="task.capabilities" stm-key="capability.link_id">
  463. <span class="badge"><span stm-text="capability.name">tag</span>
  464. <button type="button" class="inline chip-remove"
  465. stm-action="capability.detach" stm-confirm="Remove this requirement?">×</button></span>
  466. </span>
  467. </p>
  468. <p stm-if="task.capabilities.length == 0" class="muted">No requirements — any idle saddle may run it.</p>
  469. <form class="inline" stm-action="task.attach_capability" stm-if="task.capability_options.length > 0">
  470. <label for="task-capability-target">Require capability</label>
  471. <select id="task-capability-target" name="capability_id" required>
  472. <option stm-for-option-in="task.capability_options" stm-attribute.value="option.id"
  473. stm-text="option.name">capability</option>
  474. </select>
  475. <button type="submit">Require</button>
  476. </form>
  477. <h3>Sessions</h3>
  478. <table>
  479. <thead><tr><th>#</th><th>Saddle</th><th>Started</th><th>Ended</th><th>Outcome</th><th></th></tr></thead>
  480. <tbody>
  481. <tr stm-for-session-in="task.sessions">
  482. <td stm-text="session.id">id</td>
  483. <td stm-text="session.saddle_name">saddle</td>
  484. <td stm-text="session.started_display">started</td>
  485. <td stm-text="session.ended_display">ended</td>
  486. <td stm-if="session.open"><span class="badge badge-working">open</span></td>
  487. <td stm-if="!session.open" stm-text="session.outcome">outcome</td>
  488. <td><a stm-attribute.href="'/tasks/' + task.id + '/terminal?session_id=' + session.id">Terminal</a></td>
  489. </tr>
  490. <tr stm-if="task.sessions.length == 0"><td colspan="6" class="muted">No sessions yet.</td></tr>
  491. </tbody>
  492. </table>
  493. <h3>Complete</h3>
  494. <form stm-action="task.complete" class="inline">
  495. <input type="hidden" name="task_id" stm-attribute.value="task.id">
  496. <input type="text" name="summary" placeholder="Completion summary">
  497. <input type="text" name="working_branch" placeholder="Branch (optional)">
  498. <button type="submit">Mark done</button>
  499. </form>
  500. </div>
  501. </section>
  502. </body>
  503. </html>