Default the right-dock task sidebar to active work and make task-detail navigation reversible. - Filter the dock Tasks list to hide done tasks by default while keeping archived tasks out of the compact sidebar. - Add a Show Done toggle, updated empty states, and styling for the compact controls. - Convert the task-detail header arrow into an accessible back button that uses the existing close-detail path. - Document the sidebar behavior, add a patch changeset, and cover the active/default/back-button flows in tests. Files changed: .changeset/fn-7218-task-sidebar-active-list.md | 7 ++ docs/dashboard-guide.md | 5 +- packages/dashboard/app/components/DockTaskList.css | 37 +++++++++ packages/dashboard/app/components/DockTaskList.tsx | 53 ++++++++++--- packages/dashboard/app/components/RightDock.tsx | 17 ++++- .../app/components/__tests__/DockTaskList.test.tsx | 89 ++++++++++++++++++++-- .../app/components/__tests__/RightDock.test.tsx | 69 ++++++++++++----- 7 files changed, 239 insertions(+), 38 deletions(-) Fusion-Task-Id: FN-7218 Fusion-Task-Lineage: ce8fe55e-a89e-4ca6-940e-2ca06c3c26df Co-authored-by: Fusion (runfusion.ai) <noreply@runfusion.ai>
74 lines
1.2 KiB
CSS
74 lines
1.2 KiB
CSS
.dock-task-list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--space-sm);
|
|
min-height: 0;
|
|
height: 100%;
|
|
overflow-y: auto;
|
|
padding: var(--space-sm);
|
|
}
|
|
|
|
.dock-task-list__controls {
|
|
display: flex;
|
|
flex-shrink: 0;
|
|
justify-content: flex-end;
|
|
min-width: 0;
|
|
}
|
|
|
|
.dock-task-list__toggle-done {
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.dock-task-list__row {
|
|
min-width: 0;
|
|
}
|
|
|
|
.dock-task-list--empty {
|
|
align-items: center;
|
|
justify-content: center;
|
|
text-align: center;
|
|
color: var(--text-muted);
|
|
padding: var(--space-lg);
|
|
}
|
|
|
|
.dock-task-list--empty .dock-task-list__controls {
|
|
justify-content: center;
|
|
width: 100%;
|
|
}
|
|
|
|
.dock-task-list__empty {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: var(--space-xs);
|
|
}
|
|
|
|
.dock-task-list__empty-title,
|
|
.dock-task-list__empty-copy {
|
|
margin: 0;
|
|
}
|
|
|
|
.dock-task-list__empty-title {
|
|
color: var(--text-primary);
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
|
|
.dock-task-list__empty-copy {
|
|
max-width: calc(var(--space-xl) * 12);
|
|
font-size: var(--font-size-sm);
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.dock-task-list {
|
|
padding: var(--space-sm);
|
|
}
|
|
|
|
.dock-task-list__controls {
|
|
justify-content: stretch;
|
|
}
|
|
|
|
.dock-task-list__toggle-done {
|
|
width: 100%;
|
|
}
|
|
}
|