diff --git a/packages/dashboard/app/components/ListView.css b/packages/dashboard/app/components/ListView.css index f9aedbfa4..9958060d4 100644 --- a/packages/dashboard/app/components/ListView.css +++ b/packages/dashboard/app/components/ListView.css @@ -31,6 +31,14 @@ gap: var(--space-sm); } +.list-sidebar-controls__actions .list-new-task-action { + margin-left: auto; +} + +.list-toolbar .list-new-task-action { + margin-left: auto; +} + .list-sidebar-summary-chips { display: flex; flex-wrap: wrap; diff --git a/packages/dashboard/app/components/ListView.tsx b/packages/dashboard/app/components/ListView.tsx index 7f26bae1e..24a9b3122 100644 --- a/packages/dashboard/app/components/ListView.tsx +++ b/packages/dashboard/app/components/ListView.tsx @@ -1007,11 +1007,6 @@ export function ListView({ - {onNewTask ? ( - - ) : null} + {onNewTask ? ( + + ) : null}
{selectedColumn ? `${filteredCount} of ${tasks.length} tasks in ${COLUMN_LABELS[selectedColumn]}` @@ -1053,14 +1053,14 @@ export function ListView({ )}

- {onNewTask ? ( - - ) : null} + {onNewTask ? ( + + ) : null}
{selectedColumn ? ( diff --git a/packages/dashboard/app/components/__tests__/ListView.test.tsx b/packages/dashboard/app/components/__tests__/ListView.test.tsx index f1b4c6acf..f8d38878c 100644 --- a/packages/dashboard/app/components/__tests__/ListView.test.tsx +++ b/packages/dashboard/app/components/__tests__/ListView.test.tsx @@ -881,6 +881,25 @@ describe("ListView", () => { expect(mockOnNewTask).toHaveBeenCalled(); }); + it("renders + New Task as the trailing desktop sidebar control", () => { + renderListView({}, { openViewOptions: false }); + + const actions = document.querySelector(".list-sidebar-controls__actions"); + const actionButtons = Array.from(actions?.querySelectorAll("button") ?? []); + expect(actionButtons.at(-1)?.textContent).toContain("+ New Task"); + }); + + it("renders + New Task as the trailing mobile toolbar control", () => { + const viewportSpy = mockMobileViewport(); + renderListView({}, { openViewOptions: false }); + + const toolbar = document.querySelector(".list-toolbar"); + const toolbarButtons = Array.from(toolbar?.querySelectorAll("button") ?? []); + expect(toolbarButtons.at(-1)?.textContent).toContain("+ New Task"); + + viewportSpy.mockRestore(); + }); + it("+ New Task button uses theme-driven btn-task-create class", () => { const mockOnNewTask = vi.fn(); renderListView({ onNewTask: mockOnNewTask });