Merge pull request 'Make mobile New a capture-first flow' (#614) from timmy/613-mobile-capture-first into main

frontend/dashboard.css

@@ -449,8 +449,12 @@ textarea { resize: vertical; min-height: 120px; }
 .create-issue-sheet.open { display:flex; }
 .create-issue-panel { width:min(560px,100%); height:100dvh; overflow:auto; overflow-x:hidden; display:grid; align-content:start; gap:12px; padding:18px; padding-bottom:calc(18px + env(safe-area-inset-bottom)); background:#0b1526; border-left:1px solid #2a496e; }
 .create-issue-header { display:flex; align-items:center; justify-content:space-between; gap:10px; }
-.create-issue-header button, .create-issue-actions button { min-height:44px; }
+.create-issue-header button, .create-issue-actions button, .create-issue-capture-actions button { min-height:44px; }
 .create-issue-form { display:grid; gap:12px; }
+.create-issue-capture-actions { position:sticky; bottom:0; display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:10px 0; padding-bottom:calc(10px + env(safe-area-inset-bottom)); background:#0b1526; }
+.create-issue-capture-actions[hidden] { display:none; }
+.create-issue-filing { display:grid; gap:12px; min-width:0; }
+.create-issue-filing[hidden] { display:none; }
 .create-issue-attachment { display:grid; gap:8px; min-width:0; }
 .create-issue-repository-more { min-height:44px; width:100%; }
 .create-issue-repository-picker { min-width:0; display:grid; gap:8px; }

frontend/dashboard.js

@@ -3217,6 +3217,8 @@
     qs('#create-issue-repository-results').hidden = true;
     qs('#create-issue-title').value = captureDraft.title;
     qs('#create-issue-body').value = captureDraft.body;
+    setIssueFilingMode(Boolean(captureDraft.repository));
+    qs('#create-issue-capture-status').textContent = '';
     qs('#create-issue-due-date').value = captureDraft.dueDate || '';
     loadIssueLabels(qs('#create-issue-repository').value, captureDraft.labelIds);
     loadIssueMilestones(qs('#create-issue-repository').value, captureDraft.milestoneId);
@@ -3225,7 +3227,13 @@
     updateIssueCreateActions();
     qs('#create-issue-sheet').classList.add('open');
     creatingIssue = true;
-    (captureDraft.repository ? qs('#create-issue-title') : qs('#create-issue-repository-search')).focus();
+    qs('#create-issue-title').focus();
+  }
+
+  function setIssueFilingMode(enabled) {
+    qs('#create-issue-filing').hidden = !enabled;
+    qs('.create-issue-capture-actions').hidden = enabled;
+    qs('#create-issue-heading').textContent = enabled ? 'File issue' : 'Capture work';
   }
 
   let suppressCreateDraftOnHistoryClose = false;
@@ -4038,6 +4046,17 @@
     }
   });
   qs('#new-issue').addEventListener('click', openCreateIssueSheet);
+  qs('#file-new-issue').addEventListener('click', () => {
+    if (!qs('#create-issue-title').value.trim()) {
+      qs('#create-issue-capture-status').textContent = 'Add a title before filing.';
+      qs('#create-issue-title').focus();
+      return;
+    }
+    saveIssueCaptureDraft();
+    setIssueFilingMode(true);
+    qs('#create-issue-capture-status').textContent = '';
+    qs('#create-issue-repository-search').focus();
+  });
   qs('#save-unfiled-issue').addEventListener('click', () => {
     const captureDraft = {
       title: qs('#create-issue-title').value.trim(),
@@ -4052,7 +4071,7 @@
       refreshMyWorkView();
       qs('#my-work-action-status').textContent = 'Saved in Drafts · choose a repository after reconnecting.';
     } catch (error) {
-      qs('#create-issue-status').textContent = error.message;
+      qs('#create-issue-capture-status').textContent = error.message;
       qs('#create-issue-title').focus();
     }
   });

frontend/index.html

@@ -514,7 +514,7 @@
 <div class="create-issue-sheet" id="create-issue-sheet" role="dialog" aria-modal="true" aria-labelledby="create-issue-heading">
   <section class="create-issue-panel">
     <div class="create-issue-header">
-      <h3 id="create-issue-heading">New issue</h3>
+      <h3 id="create-issue-heading">Capture work</h3>
       <button id="cancel-new-issue" type="button">Cancel</button>
     </div>
     <aside class="shared-content-conflict" id="shared-content-conflict" aria-live="assertive" hidden>
@@ -526,6 +526,17 @@
       </div>
     </aside>
     <form class="create-issue-form" id="create-issue-form">
+      <label for="create-issue-title">Title
+        <input id="create-issue-title" type="text" maxlength="255" required autocomplete="off" />
+      </label>
+      <label for="create-issue-body">Note <span class="small">Optional</span>
+        <textarea id="create-issue-body" maxlength="10000"></textarea>
+      </label>
+      <div class="create-issue-capture-actions">
+        <button id="save-unfiled-issue" type="button">Save to Drafts</button>
+        <button id="file-new-issue" type="button">File now</button>
+      </div>
+      <section class="create-issue-filing" id="create-issue-filing" hidden>
       <div class="create-issue-repository-picker">
         <label for="create-issue-repository-search">Repository search
           <input id="create-issue-repository-search" type="search" maxlength="80" placeholder="Search accessible repositories" autocomplete="off" />
@@ -537,12 +548,6 @@
       </div>
       <button class="create-issue-repository-more" id="load-more-issue-repositories" type="button" hidden>Load more repositories</button>
       <div id="create-issue-repository-status" class="small" aria-live="polite"></div>
-      <label for="create-issue-title">Title
-        <input id="create-issue-title" type="text" maxlength="255" required autocomplete="off" />
-      </label>
-      <label for="create-issue-body">Description <span class="small">Optional</span>
-        <textarea id="create-issue-body" maxlength="10000"></textarea>
-      </label>
       <section class="create-issue-attachment" aria-labelledby="create-issue-attachment-label">
         <strong id="create-issue-attachment-label">Screenshot <span class="small">Optional · PNG, JPEG, or WebP · 2 MB max</span></strong>
         <div class="issue-attachment-controls">
@@ -578,11 +583,12 @@
       </section>
       <div class="small">The issue will be assigned to you.</div>
       <div class="create-issue-actions">
-        <button id="save-unfiled-issue" type="button">Save for filing</button>
         <button id="submit-new-issue" type="submit">Create &amp; assign to me</button>
         <button id="create-and-start-issue" type="submit">Create &amp; start</button>
         <div id="create-issue-status" class="small" aria-live="assertive"></div>
       </div>
+      </section>
+      <div id="create-issue-capture-status" class="small" aria-live="assertive"></div>
     </form>
   </section>
 </div>

tests/test_unfiled_captures.py

@@ -100,7 +100,7 @@ async def test_mobile_composer_exposes_cold_offline_save_and_account_safe_resume
 
     assert '<script src="static/unfiled-captures.js"></script>' in html
     assert 'id="save-unfiled-issue"' in html
-    assert 'Save for filing' in html
+    assert 'Save to Drafts' in html
     assert "createUnfiledCaptures({" in html
     assert "getCaptureLogin: () => String(lastContextSnapshot?.user?.login || '').trim()" in html
     assert "unfiledCaptures.save(captureDraft)" in html
@@ -109,3 +109,19 @@ async def test_mobile_composer_exposes_cold_offline_save_and_account_safe_resume
     assert "item.kind === 'unfiled-issue'" in html
     assert '.create-issue-actions button { min-height:44px;' in html
     assert '@media(max-width:320px)' in html
+
+
+@pytest.mark.anyio
+async def test_mobile_new_opens_capture_first_and_progressively_reveals_filing_fields():
+    html = await dashboard()
+
+    assert 'id="create-issue-heading">Capture work' in html
+    assert 'class="create-issue-filing" id="create-issue-filing" hidden' in html
+    assert 'id="save-unfiled-issue" type="button">Save to Drafts' in html
+    assert 'id="file-new-issue" type="button">File now' in html
+    assert "function setIssueFilingMode(enabled)" in html
+    assert "setIssueFilingMode(Boolean(captureDraft.repository))" in html
+    assert "qs('#create-issue-title').focus();" in html
+    assert "qs('#file-new-issue').addEventListener('click'" in html
+    assert '.create-issue-capture-actions button { min-height:44px;' in html
+    assert '.create-issue-capture-actions[hidden] { display:none;' in html