GovOPlaN/govoplan-tasks
2
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(webui): adopt semantic workspace actions

Browse Source
This commit is contained in:
zemion
2026-08-19 18:47:46 +02:00
parent e8076700b0
commit a8646e76a8
1 changed files with 35 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webui/src/features/tasks/TasksPage.tsx
+35 -33
View File
@@ -6,15 +6,12 @@ import {
ExternalLink,
ListChecks,
Plus,
RefreshCw,
RotateCcw,
Search,
XCircle
} from "lucide-react";
import { Link } from "react-router";
import { FormGrid, ToolbarGroup,
ActionToolbar,
AdminIconButton,
import { FormGrid,
Button,
DateTimeField,
Dialog,
@@ -27,6 +24,7 @@ import { FormGrid, ToolbarGroup,
SelectionListItem,
StatePanel,
StatusBadge,
WorkspaceActionBar,
WorkspaceFrame,
WorkspaceLayout,
hasScope,
@@ -140,26 +138,24 @@ export default function TasksPage({ settings, auth }: { settings: ApiSettings; a
helpContextId="tasks.page.inbox"
helpModuleId="tasks"
primary={<>
<ActionToolbar surface="panel-header" className="tasks-sidebar-bar">
<span className="tasks-title"><ListChecks size={18} /><strong>i18n:govoplan-tasks.work</strong></span>
<ToolbarGroup align="end" className="tasks-toolbar-actions">
<AdminIconButton
label="i18n:govoplan-tasks.refresh"
icon={<RefreshCw size={16} aria-hidden="true" />}
onClick={() => void load()}
disabled={loading || busy}
/>
{canWrite ? (
<AdminIconButton
label="i18n:govoplan-tasks.create_task"
icon={<Plus size={16} aria-hidden="true" />}
onClick={() => setCreateOpen(true)}
disabled={busy}
helpContextId="tasks.action.create"
/>
) : null}
</ToolbarGroup>
</ActionToolbar>
<WorkspaceActionBar
scope="collection-pane"
variant="collection"
refreshable
reloadAction={{ onReload: () => void load(), loading: loading || busy, label: "i18n:govoplan-tasks.refresh" }}
className="tasks-sidebar-bar"
contextActions={<span className="tasks-title"><ListChecks size={18} /><strong>i18n:govoplan-tasks.work</strong></span>}
createAction={canWrite ? (
<Button
variant="primary"
onClick={() => setCreateOpen(true)}
disabled={busy}
helpContextId="tasks.action.create"
>
<Plus size={16} aria-hidden="true" /> i18n:govoplan-tasks.create_task
</Button>
) : undefined}
/>
<FilterBar as="form" surface="control" wrap="never" className="tasks-search" onSubmit={submitSearch} role="search">
<Search size={15} aria-hidden="true" />
<input
@@ -203,13 +199,20 @@ export default function TasksPage({ settings, auth }: { settings: ApiSettings; a
</>}
>
<ActionToolbar surface="panel-header" className="tasks-topbar" data-help-context-id="tasks.page.detail">
<span className="tasks-detail-title"><ListChecks size={18} /><strong>{selected?.title ?? "i18n:govoplan-tasks.work_details"}</strong></span>
<ToolbarGroup align="end" className="tasks-toolbar-actions">
<DocumentationHelpLink reference={DOCUMENTATION} />
{selected?.provider_id === "tasks.explicit" && canWrite ? <TaskActions item={selected} busy={busy} onAction={(action) => action === "defer" ? setDeferOpen(true) : void runAction(action)} /> : null}
</ToolbarGroup>
</ActionToolbar>
<WorkspaceActionBar
scope="detail-pane"
variant="detail"
className="tasks-topbar"
data-help-context-id="tasks.page.detail"
contextActions={<span className="tasks-detail-title"><ListChecks size={18} /><strong>{selected?.title ?? "i18n:govoplan-tasks.work_details"}</strong></span>}
helpAction={<DocumentationHelpLink reference={DOCUMENTATION} />}
primaryActions={selected?.provider_id === "tasks.explicit" && canWrite ? (
<TaskPrimaryActions item={selected} busy={busy} onAction={(action) => action === "defer" ? setDeferOpen(true) : void runAction(action)} />
) : undefined}
destructiveActions={selected?.provider_id === "tasks.explicit" && canWrite && !["completed", "cancelled"].includes(selected.status) ? (
<Button variant="danger" onClick={() => void runAction("cancel")} disabled={busy}><XCircle size={15} /> i18n:govoplan-tasks.cancel_task</Button>
) : undefined}
/>
{error ? <DismissibleAlert tone="danger" compact resetKey={error}>{error}</DismissibleAlert> : null}
{diagnostics.map((message) => <DismissibleAlert key={message} tone="warning" compact resetKey={message}>{message}</DismissibleAlert>)}
@@ -250,7 +253,7 @@ export default function TasksPage({ settings, auth }: { settings: ApiSettings; a
);
}
function TaskActions({ item, busy, onAction }: { item: WorkItem; busy: boolean; onAction: (action: "start" | "complete" | "defer" | "reopen" | "cancel") => void }) {
function TaskPrimaryActions({ item, busy, onAction }: { item: WorkItem; busy: boolean; onAction: (action: "start" | "complete" | "defer" | "reopen") => void }) {
if (["completed", "cancelled"].includes(item.status)) {
return <Button onClick={() => onAction("reopen")} disabled={busy}><RotateCcw size={15} /> i18n:govoplan-tasks.reopen</Button>;
}
@@ -259,7 +262,6 @@ function TaskActions({ item, busy, onAction }: { item: WorkItem; busy: boolean;
{["open", "deferred"].includes(item.status) ? <Button onClick={() => onAction("start")} disabled={busy}><CirclePlay size={15} /> i18n:govoplan-tasks.start</Button> : null}
<Button variant="primary" onClick={() => onAction("complete")} disabled={busy}><Check size={15} /> i18n:govoplan-tasks.complete</Button>
<Button onClick={() => onAction("defer")} disabled={busy}><CalendarClock size={15} /> i18n:govoplan-tasks.defer</Button>
<Button variant="danger" onClick={() => onAction("cancel")} disabled={busy}><XCircle size={15} /> i18n:govoplan-tasks.cancel_task</Button>
</>
);
}