feat(KB-022): add GitHub issue status badges to task cards

- Extend core types with GitHub issue tracking fields (issueNumber, issueStatus, lastIssueSync)
- Add TaskStore.getTaskGitHubIssueInfo() to fetch issue details from GitHub API
- Create server-side API endpoint for issue status lookup with caching
- Build GitHubBadge component with color-coded status indicators (open/closed)
- Integrate badges into TaskCard with hover state linking to GitHub issues
- Add CSS styles for badge positioning and visual polish
- Include comprehensive tests for GitHubBadge and TaskCard badge rendering
This commit is contained in:
gsxdsm
2026-03-29 20:12:13 -07:00
parent 37afb24d60
commit b935f310ce
12 changed files with 930 additions and 30 deletions

View File

@@ -1705,6 +1705,44 @@ body {
color: var(--text-muted);
}
/* === GitHub Badges === */
.card-github-badge {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 11px;
padding: 2px 6px;
border-radius: 10px;
cursor: pointer;
transition: filter 0.15s ease, transform 0.1s ease;
user-select: none;
}
.card-github-badge:hover {
filter: brightness(1.15);
}
.card-github-badge:active {
transform: scale(0.95);
}
/* Modifier classes for state-based styling */
.card-github-badge--open {
/* Green styling applied via inline styles */
}
.card-github-badge--closed {
/* Red styling applied via inline styles */
}
.card-github-badge--merged {
/* Purple styling applied via inline styles */
}
.card-github-badge--completed {
/* Purple styling applied via inline styles */
}
/* Card saving state */
.card.card-saving {
opacity: 0.7;