Joshua
8da593c450
All checks were successful
Dev Build / build-test (pull_request) Successful in 1m57s
57 lines
2.1 KiB
HTML
57 lines
2.1 KiB
HTML
<!-- ========================================================================== -->
|
||
<!-- Hub Page — Responsive Agent Card Grid with Filter Chips -->
|
||
<!-- Per CUB-27 spec breakpoints: -->
|
||
<!-- Compact (0–599px): Single-column cards, horizontal-scroll filter chips -->
|
||
<!-- Medium (600–1023px): 2-column grid -->
|
||
<!-- Expanded (≥1024px): 3+ column auto-fill grid -->
|
||
<!-- CUB-26: Integrates AgentCard click/long-press with session drawer. -->
|
||
<!-- ========================================================================== -->
|
||
|
||
<div class="hub-page">
|
||
<h1 class="hub-page__title">Command Hub</h1>
|
||
|
||
<!-- Filter Chip Group — horizontal scroll on mobile -->
|
||
<div class="hub-page__filters" role="tablist" aria-label="Filter agents by status">
|
||
@for (filter of filters; track filter.value) {
|
||
<button
|
||
class="hub-page__filter-chip"
|
||
[class.hub-page__filter-chip--active]="activeFilter() === filter.value"
|
||
role="tab"
|
||
[attr.aria-selected]="activeFilter() === filter.value"
|
||
(click)="selectFilter(filter.value)"
|
||
>
|
||
{{ filter.label }}
|
||
</button>
|
||
}
|
||
</div>
|
||
|
||
<!-- Agent Card Grid -->
|
||
<div class="hub-page__grid">
|
||
@for (agent of filteredAgents(); track agent.id) {
|
||
<app-agent-card
|
||
[status]="agent.status"
|
||
[task]="agent.currentTask ?? ''"
|
||
[progress]="agent.taskProgress ?? 0"
|
||
[sessionKey]="agent.sessionKey"
|
||
[channel]="agent.channel"
|
||
[lastActivity]="agent.lastActivity"
|
||
[agentId]="agent.id"
|
||
[displayName]="agent.displayName"
|
||
[role]="agent.role"
|
||
[errorMessage]="agent.errorMessage ?? ''"
|
||
(cardClick)="onCardClick($event)"
|
||
(cardLongPress)="onCardLongPress($event)"
|
||
/>
|
||
} @empty {
|
||
<p class="hub-page__empty">No agents online</p>
|
||
}
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Agent Session Drawer (CUB-26) -->
|
||
<app-agent-session-drawer
|
||
[isMobile]="isMobile()"
|
||
(openSession)="onOpenSession($event)"
|
||
(pinToDashboard)="onPinToDashboard($event)"
|
||
(drawerClose)="onDrawerClose()"
|
||
/> |