Adopt shared WebUI layout primitives
This commit is contained in:
@@ -23,7 +23,7 @@ import {
|
|||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import { ReactFlowProvider } from "@xyflow/react";
|
import { ReactFlowProvider } from "@xyflow/react";
|
||||||
import { useSearchParams } from "react-router";
|
import { useSearchParams } from "react-router";
|
||||||
import {
|
import { ToolbarGroup, ActionToolbar,
|
||||||
Button,
|
Button,
|
||||||
ConfirmDialog,
|
ConfirmDialog,
|
||||||
Dialog,
|
Dialog,
|
||||||
@@ -585,9 +585,9 @@ export default function WorkflowPage({
|
|||||||
<main className="workflow-page">
|
<main className="workflow-page">
|
||||||
<div className="workflow-shell">
|
<div className="workflow-shell">
|
||||||
<aside className="workflow-definition-panel">
|
<aside className="workflow-definition-panel">
|
||||||
<div className="workflow-panel-toolbar">
|
<ActionToolbar className="workflow-panel-toolbar">
|
||||||
<strong>Workflows</strong>
|
<strong>Workflows</strong>
|
||||||
<span className="workflow-toolbar-actions">
|
<ToolbarGroup align="end" className="workflow-toolbar-actions">
|
||||||
<DocumentationHelpLink
|
<DocumentationHelpLink
|
||||||
reference={{ topicId: "workflow.editor", documentationType: "user" }}
|
reference={{ topicId: "workflow.editor", documentationType: "user" }}
|
||||||
label="Open Workflow documentation"
|
label="Open Workflow documentation"
|
||||||
@@ -616,8 +616,8 @@ export default function WorkflowPage({
|
|||||||
disabled={!canWrite}
|
disabled={!canWrite}
|
||||||
disabledReason={!canWrite ? "Workflow definition write permission is required." : undefined}
|
disabledReason={!canWrite ? "Workflow definition write permission is required." : undefined}
|
||||||
/>
|
/>
|
||||||
</span>
|
</ToolbarGroup>
|
||||||
</div>
|
</ActionToolbar>
|
||||||
<div className="workflow-definition-search">
|
<div className="workflow-definition-search">
|
||||||
<input
|
<input
|
||||||
type="search"
|
type="search"
|
||||||
@@ -671,7 +671,7 @@ export default function WorkflowPage({
|
|||||||
<section className="workflow-workspace">
|
<section className="workflow-workspace">
|
||||||
{draft && displayedGraph ? (
|
{draft && displayedGraph ? (
|
||||||
<>
|
<>
|
||||||
<div className="workflow-workspace-toolbar">
|
<ActionToolbar className="workflow-workspace-toolbar">
|
||||||
<span className="workflow-identity-fields">
|
<span className="workflow-identity-fields">
|
||||||
<input
|
<input
|
||||||
className="workflow-name-input"
|
className="workflow-name-input"
|
||||||
@@ -858,7 +858,7 @@ export default function WorkflowPage({
|
|||||||
/>
|
/>
|
||||||
) : null}
|
) : null}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</ActionToolbar>
|
||||||
<div className="workflow-alerts">
|
<div className="workflow-alerts">
|
||||||
{error ? (
|
{error ? (
|
||||||
<DismissibleAlert tone="danger" resetKey={error}>
|
<DismissibleAlert tone="danger" resetKey={error}>
|
||||||
|
|||||||
@@ -15,7 +15,7 @@ import {
|
|||||||
RotateCcw,
|
RotateCcw,
|
||||||
XCircle
|
XCircle
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import {
|
import { ActionToolbar,
|
||||||
Button,
|
Button,
|
||||||
ConfirmDialog,
|
ConfirmDialog,
|
||||||
Dialog,
|
Dialog,
|
||||||
@@ -299,7 +299,7 @@ export default function WorkflowRunsDialog({
|
|||||||
onClose={close}
|
onClose={close}
|
||||||
footer={<Button onClick={close}>Close</Button>}
|
footer={<Button onClick={close}>Close</Button>}
|
||||||
>
|
>
|
||||||
<div className="workflow-runs-toolbar">
|
<ActionToolbar className="workflow-runs-toolbar">
|
||||||
<span>
|
<span>
|
||||||
<strong>Workflow instances</strong>
|
<strong>Workflow instances</strong>
|
||||||
<small>Revision-pinned runs and human handoffs</small>
|
<small>Revision-pinned runs and human handoffs</small>
|
||||||
@@ -325,7 +325,7 @@ export default function WorkflowRunsDialog({
|
|||||||
<Play size={16} /> Start
|
<Play size={16} /> Start
|
||||||
</Button>
|
</Button>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</ActionToolbar>
|
||||||
{error ? (
|
{error ? (
|
||||||
<DismissibleAlert tone="danger" resetKey={error}>
|
<DismissibleAlert tone="danger" resetKey={error}>
|
||||||
{error}
|
{error}
|
||||||
|
|||||||
Reference in New Issue
Block a user