feat: plan mobile work by milestone (#203)
CI / lint (pull_request) Successful in 16s
CI / build-frontend (pull_request) Successful in 4s

This commit is contained in:
timmy committed 2026-08-07 15:01:02 +00:00
1 parent 09b2898d1c
commit 2be29b684a
9 files changed
+514 -10

No files matched your search

+102 -1
View File
@@ -62,6 +62,8 @@ textarea { resize: vertical; min-height: 120px; }
.work-filters { display:flex; gap:8px; flex-wrap:wrap; }
.work-filter { min-height: 44px; }
.work-filter[aria-pressed="true"] { border-color:var(--accent); background:#1d4f7a; }
.milestone-lane { display:flex; align-items:center; gap:8px; min-width:min(100%,260px); }
.work-milestone-filter { min-width:180px; flex:1; padding:8px; border-radius:8px; border:1px solid #1f3a5f; background:#0b1526; color:var(--text); }
.my-work-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:10px; }
.my-work-card { min-height: 44px; display:grid; gap:8px; padding:12px; border:1px solid #1f3a5f; border-radius:12px; background:#0f1d33; color:var(--text); }
.my-work-card-main { display:block; width:100%; color:var(--text); text-align:left; font:inherit; background:transparent; border:0; padding:0; }
@@ -153,6 +155,9 @@ textarea { resize: vertical; min-height: 120px; }
.issue-due-editor input { box-sizing:border-box; width:100%; max-width:100%; }
.issue-due-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.issue-due-editor input, .issue-due-editor button { min-height:44px; }
.issue-milestone-editor { display:grid; gap:8px; max-width:100%; margin:14px 0; padding:12px; border:1px solid #2a496e; border-radius:12px; }
.issue-milestone-editor select { width:100%; padding:8px; border-radius:8px; border:1px solid #1f3a5f; background:#0b1526; color:var(--text); }
.work-milestone-filter, .issue-milestone-editor select, .issue-milestone-editor button { min-height:44px; }
.issue-sheet-actions { position:sticky; bottom:0; z-index:3; display:grid; gap:8px; margin-top:14px; padding:10px 4px; padding-bottom:calc(10px + env(safe-area-inset-bottom)); background:rgba(11,21,38,.98); border-top:1px solid #2a496e; }
.issue-sheet-actions button, .issue-sheet-actions a { min-height:44px; display:flex; align-items:center; justify-content:center; }
.issue-sheet-actions a { border:1px solid #60a5fa; border-radius:10px; font-weight:700; }
@@ -269,6 +274,12 @@ textarea { resize: vertical; min-height: 120px; }
<button class="work-filter" data-work-filter="review" aria-pressed="false">Reviews <span data-work-count="review">0</span></button>
<button class="work-filter" data-work-filter="update" aria-pressed="false">Updates <span data-work-count="update">0</span></button>
</div>
<label class="milestone-lane" for="work-milestone-filter"><span class="small">Release lane</span>
<select class="work-milestone-filter" id="work-milestone-filter">
<option value="all">All milestones</option>
<option value="unplanned">Unplanned</option>
</select>
</label>
</div>
<div class="my-work-list" id="my-work-list"></div>
<div class="small" id="work-page-status" aria-live="polite"></div>
@@ -412,6 +423,13 @@ textarea { resize: vertical; min-height: 120px; }
</div>
<div id="issue-due-status" class="small" aria-live="assertive">Load an issue to schedule it.</div>
</fieldset>
<fieldset class="issue-milestone-editor" aria-describedby="issue-milestone-status">
<legend>Milestone</legend>
<label for="issue-milestone" class="small">Plan this issue into a release</label>
<select id="issue-milestone" disabled><option value="">No milestone</option></select>
<button id="save-issue-milestone" type="button" disabled>Save milestone</button>
<div id="issue-milestone-status" class="small" aria-live="assertive">Load an issue to plan it.</div>
</fieldset>
<p class="issue-sheet-content" id="issue-sheet-body"></p>
<button id="edit-issue-content" type="button" disabled>Edit issue</button>
<form class="issue-edit-form" id="issue-edit-form" hidden>
@@ -664,10 +682,14 @@ textarea { resize: vertical; min-height: 120px; }
});
let liveMode = true;
const WORK_FILTER_KEY = 'stackchain.my-work-filter.v1';
const WORK_MILESTONE_KEY = 'stackchain.my-work-milestone.v1';
let selectedWorkFilter = 'all';
let selectedWorkMilestone = 'all';
try {
const savedFilter = sessionStorage.getItem(WORK_FILTER_KEY);
if (['all', 'issue', 'pull', 'review', 'update'].includes(savedFilter)) selectedWorkFilter = savedFilter;
const savedMilestone = sessionStorage.getItem(WORK_MILESTONE_KEY);
if (savedMilestone) selectedWorkMilestone = savedMilestone;
} catch (e) {
console.warn('Could not restore My Work filter', e);
}
@@ -927,6 +949,7 @@ textarea { resize: vertical; min-height: 120px; }
const workSession = createWorkSession({
getItems: () => lastMyWork,
getFilter: () => selectedWorkFilter,
getMilestone: () => selectedWorkMilestone,
onOpen: openWorkSessionItem,
onProgress: state => {
document.querySelectorAll('.work-session-nav').forEach(nav => { nav.hidden = false; });
@@ -1020,6 +1043,20 @@ textarea { resize: vertical; min-height: 120px; }
const element = qs('[data-work-count="' + filter + '"]');
if (element) element.textContent = count;
});
const milestoneSelect = qs('#work-milestone-filter');
const lanes = milestoneLanes(lastMyWork);
milestoneSelect.innerHTML = '<option value="all">All milestones</option>' +
'<option value="unplanned">Unplanned</option>' + lanes.map(lane =>
'<option value="' + Number(lane.id) + '">' + escapeHtml(lane.title) + '</option>'
).join('');
milestoneSelect.value = selectedWorkMilestone;
if (milestoneSelect.value !== selectedWorkMilestone) {
const retained = document.createElement('option');
retained.value = selectedWorkMilestone;
retained.textContent = 'Selected milestone';
milestoneSelect.append(retained);
milestoneSelect.value = selectedWorkMilestone;
}
qs('#my-work').removeAttribute('data-stale');
qs('#my-work-status').textContent = lastMyWork.length ?
summarizeMyWork(lastMyWork) : 'No assigned work, review requests, or unread updates.';
@@ -1052,7 +1089,7 @@ textarea { resize: vertical; min-height: 120px; }
}
function renderMyWork() {
const visible = filterMyWork(lastMyWork, selectedWorkFilter);
const visible = filterMyWork(lastMyWork, selectedWorkFilter, selectedWorkMilestone);
const incomplete = activeWorkStreams().some(stream => workPagination[stream]?.has_more);
qs('#my-work-list').innerHTML = visible.length ? visible.map(item => {
const index = lastMyWork.findIndex(candidate => candidate.key === item.key && candidate.kind === item.kind);
@@ -1060,6 +1097,7 @@ textarea { resize: vertical; min-height: 120px; }
'<span class="small">' + escapeHtml(item.key) + ' · ' + escapeHtml(item.kind === 'pull' ? 'PR' : (item.kind === 'update' ? 'Update' : 'Issue')) + '</span>' +
'<span class="my-work-card-title">' + escapeHtml(item.title) + '</span>' +
'<span class="pill">' + escapeHtml(item.reason) + '</span>' +
(item.milestone?.title ? ' <span class="pill milestone-badge">' + escapeHtml(item.milestone.title) + '</span>' : '') +
(item.due_label ? ' <span class="pill due-badge">' + escapeHtml(item.due_label) + '</span>' : '') +
(item.has_update ? ' <span class="pill">Unread update</span>' : '') +
(item.updated_at ? '<span class="small"> · Updated ' + escapeHtml(fmt(item.updated_at)) + '</span>' : '');
@@ -1197,6 +1235,30 @@ textarea { resize: vertical; min-height: 120px; }
.map(input => Number(input.value)).filter(Number.isInteger);
}
async function loadIssueMilestoneEditor(item, confirmedMilestone) {
const select = qs('#issue-milestone');
const status = qs('#issue-milestone-status');
select.innerHTML = '<option value="">No milestone</option>';
select.disabled = true;
qs('#save-issue-milestone').disabled = true;
status.textContent = 'Loading milestones…';
try {
const milestones = await issueController.loadMilestones(item);
if (selectedIssue !== item) return;
select.innerHTML += milestones.map(milestone =>
'<option value="' + Number(milestone.id) + '">' + escapeHtml(milestone.title) + '</option>'
).join('');
const draft = issueController.loadMilestoneDraft(item);
select.value = String(draft ?? confirmedMilestone?.id ?? '');
select.disabled = false;
qs('#save-issue-milestone').disabled = false;
status.textContent = confirmedMilestone ?
'Planned for ' + confirmedMilestone.title + '.' : 'No milestone set.';
} catch (_error) {
status.textContent = 'Milestones could not be loaded. Retry by reopening this issue.';
}
}
async function openIssueSheet(item, trigger) {
if (!item) return;
selectedIssue = item;
@@ -1220,6 +1282,10 @@ textarea { resize: vertical; min-height: 120px; }
qs('#save-issue-due-date').disabled = true;
qs('#clear-issue-due-date').disabled = true;
qs('#issue-due-status').textContent = 'Loading due date…';
qs('#issue-milestone').innerHTML = '<option value="">No milestone</option>';
qs('#issue-milestone').disabled = true;
qs('#save-issue-milestone').disabled = true;
qs('#issue-milestone-status').textContent = 'Loading milestones…';
qs('#retry-issue-load').hidden = true;
qs('#open-issue-gitea').href = item.url || '#';
qs('#send-issue-comment').disabled = false;
@@ -1238,6 +1304,7 @@ textarea { resize: vertical; min-height: 120px; }
'<span class="pill">' + escapeHtml(label) + '</span>'
).join(' ');
loadIssueLabelEditor(item, detail.labels || []);
loadIssueMilestoneEditor(item, detail.milestone);
qs('#issue-assignees').textContent = (detail.assignees || []).length ?
'Assigned to ' + detail.assignees.join(', ') : 'No assignee reported';
qs('#issue-comments').innerHTML = (detail.comments || []).length ?
@@ -2211,6 +2278,33 @@ textarea { resize: vertical; min-height: 120px; }
saveSelectedIssueDueDate(value + 'T23:59:59Z');
});
qs('#clear-issue-due-date').addEventListener('click', () => saveSelectedIssueDueDate(null));
qs('#save-issue-milestone').addEventListener('click', async () => {
if (!selectedIssue || !lastContextSnapshot) return;
const editing = selectedIssue;
const button = qs('#save-issue-milestone');
const raw = qs('#issue-milestone').value;
const milestoneId = raw ? Number(raw) : null;
button.disabled = true;
qs('#issue-milestone').disabled = true;
qs('#issue-milestone-status').textContent = milestoneId ? 'Saving milestone…' : 'Clearing milestone…';
try {
const confirmed = await issueController.updateMilestone(editing, milestoneId);
lastContextSnapshot = buildMyWork.replaceIssueMilestone(
lastContextSnapshot, editing.repository, editing.number, confirmed.milestone
);
selectedIssue = { ...editing, milestone: confirmed.milestone };
selectedIssueDetail = { ...selectedIssueDetail, milestone: confirmed.milestone };
paintMyWork(lastContextSnapshot);
qs('#issue-milestone-status').textContent = confirmed.milestone ?
'Planned for ' + confirmed.milestone.title + '. Release lane updated.' : 'Milestone cleared.';
} catch (error) {
qs('#issue-milestone-status').textContent = error.message + ' Your selection is safe; retry.';
qs('#issue-milestone').focus();
} finally {
button.disabled = false;
qs('#issue-milestone').disabled = false;
}
});
qs('#send-issue-comment').addEventListener('click', async () => {
if (!selectedIssue) return;
const body = qs('#issue-comment').value.trim();
@@ -2552,6 +2646,13 @@ textarea { resize: vertical; min-height: 120px; }
updateWorkPaginationControls();
});
});
qs('#work-milestone-filter').addEventListener('change', event => {
selectedWorkMilestone = event.target.value;
try { sessionStorage.setItem(WORK_MILESTONE_KEY, selectedWorkMilestone); }
catch (e) { console.warn('Could not persist My Work milestone lane', e); }
renderMyWork();
if (workSession.active()) workSession.reconcile();
});
contextPoller.start();
document.addEventListener('visibilitychange', () => {
contextPoller.setVisible(!document.hidden);