fix(ui): keep dashboard configuration exit available and align heading help

Verified with the coordinated workspace changes by devkit full run
2026-09-08T225814-186389-0000-3e3ed7cd (all seven phases passed).
This shared UI pass does not mark the individual module reviews complete.
This commit is contained in:
2026-09-09 02:03:36 +02:00
parent ec240ed219
commit 944401d53b
6 changed files with 54 additions and 13 deletions
@@ -15,6 +15,7 @@ import {
} from "lucide-react";
import {
Card,
DocumentationHelpLink,
IconButton,
type ApiSettings,
type AuthInfo,
@@ -154,7 +155,7 @@ export default function DashboardGrid({
onDragOver={(event) => event.preventDefault()}
onDrop={onDropPreview}
>
<Card title={widget.title}>
<Card title={widget.title} titleHelp={widget.documentation && <DocumentationHelpLink reference={widget.documentation} />}>
<DashboardWidgetContent
widget={widget}
placement={placement}
@@ -186,6 +187,7 @@ export default function DashboardGrid({
>
<Card
title={widget.title}
titleHelp={widget.documentation && <DocumentationHelpLink reference={widget.documentation} />}
collapsible={!configuring}
collapseKey={`dashboard-widget:${placement.instanceId}`}
actions={
+13 -4
View File
@@ -6,7 +6,6 @@ import {
type DragEvent as ReactDragEvent
} from "react";
import {
RefreshCw,
Save,
SlidersHorizontal,
X
@@ -24,6 +23,7 @@ import {
isApiError,
useEffectiveView,
usePlatformModules,
useUnsavedChanges,
useUnsavedDraftGuard,
type ApiSettings,
type AuthInfo,
@@ -185,6 +185,7 @@ export default function DashboardPage({
]);
const dirty = configuring && !layoutsEqual(savedLayout, draftLayout);
const { requestDiscard } = useUnsavedChanges();
useUnsavedDraftGuard({
dirty,
onSave: persistLayout,
@@ -253,12 +254,21 @@ export default function DashboardPage({
function discardChanges() {
setDraftLayout(savedLayout);
exitConfiguration();
}
function exitConfiguration() {
setConfiguring(false);
setEditingInstanceId(null);
setDragItem(null);
setDropTarget(null);
}
function cancelConfiguration() {
if (dirty) requestDiscard(exitConfiguration);
else exitConfiguration();
}
function beginConfiguration() {
setDraftLayout(savedLayout);
setConfiguring(true);
@@ -447,6 +457,7 @@ export default function DashboardPage({
archetype={configuring ? "editor" : "overview"}
className="dashboard-page"
title="i18n:govoplan-dashboard.dashboard.3f8b4df2"
titleHelp={<DocumentationHelpLink reference={DASHBOARD_DOCUMENTATION} />}
description="Personal workspace assembled from installed module widgets."
error={error}
success={error ? "" : notice}
@@ -454,8 +465,7 @@ export default function DashboardPage({
<PageActionBar
variant="editor"
state={saving ? "saving" : dirty ? "dirty" : "clean"}
helpAction={<DocumentationHelpLink reference={DASHBOARD_DOCUMENTATION} />}
discardAction={{ label: <><X size={16} /> Cancel</>, onClick: discardChanges }}
discardAction={{ label: <><X size={16} /> Cancel</>, behavior: "exit", onClick: cancelConfiguration }}
saveAction={{ label: <><Save size={16} /> Save layout</>, onClick: () => void persistLayout() }}
/>
) : (
@@ -467,7 +477,6 @@ export default function DashboardPage({
loading,
disabledReason: loading ? DASHBOARD_I18N.loading : undefined
}}
helpAction={<DocumentationHelpLink reference={DASHBOARD_DOCUMENTATION} />}
primaryActions={(
<Button
onClick={beginConfiguration}
@@ -118,6 +118,7 @@ export default function WidgetConfigurationDialog({
}
function reset() {
if (!widget) return;
setSize(defaultWidgetSize(widget));
setConfiguration({ ...(widget.defaultConfiguration ?? {}) });
}
@@ -126,6 +127,7 @@ export default function WidgetConfigurationDialog({
<Dialog
open={open}
title={`Configure ${widget.title}`}
titleHelp={<DocumentationHelpLink reference={DASHBOARD_LAYOUT_DOCUMENTATION} />}
onClose={close}
className="dashboard-widget-config-dialog"
footer={
@@ -145,7 +147,6 @@ export default function WidgetConfigurationDialog({
</>
}
>
<DocumentationHelpLink reference={DASHBOARD_LAYOUT_DOCUMENTATION} />
{supportedSizes.length > 1 && (
<FormField label="Widget size" documentation={DASHBOARD_LAYOUT_DOCUMENTATION}>
<SegmentedControl