vynte-infra/plunk
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use alert instead of custom component

Browse Source
This commit is contained in:
Dries Augustyns
2025-12-07 16:29:38 +01:00
parent 16572b8f49
commit 4d7c68db3a
1 changed files with 36 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/pages/workflows/[id].tsx
+36 -59
View File
@@ -32,6 +32,7 @@ import type {Template, Workflow, WorkflowExecution, WorkflowStep, WorkflowTransi
import {DashboardLayout} from '../../components/DashboardLayout';
import {network} from '../../lib/network';
import {
AlertTriangle,
ArrowLeft,
ChevronDown,
Clock,
@@ -446,41 +447,29 @@ export default function WorkflowEditorPage() {
{/* Active Executions Warning Banner */}
{activeExecutionsCount > 0 && (
<div className="bg-blue-50 border-l-4 border-blue-400 p-4 rounded-r-lg">
<div className="flex items-start">
<div className="flex-shrink-0">
<svg className="h-5 w-5 text-blue-400" viewBox="0 0 20 20" fill="currentColor">
<path
fillRule="evenodd"
d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z"
clipRule="evenodd"
/>
</svg>
</div>
<div className="ml-3 flex-1">
<h3 className="text-sm font-medium text-blue-800">
{workflow.enabled ? 'Workflow is active with running executions' : 'Workflow has active executions'}
</h3>
<div className="mt-2 text-sm text-blue-700">
<p>
This workflow has <strong>{activeExecutionsCount}</strong> active execution
{activeExecutionsCount !== 1 ? 's' : ''}.{' '}
{!workflow.enabled && 'Even though the workflow is disabled, existing executions will continue. '}
To protect running workflows, you cannot:
</p>
<ul className="list-disc list-inside space-y-1 mt-2">
<li>Delete steps or transitions</li>
<li>Modify step configurations (email templates, conditions, etc.)</li>
<li>Change the workflow trigger</li>
</ul>
<p className="mt-2">
You can still rename steps and adjust their position. To make configuration changes, wait for
executions to complete or cancel them from the Executions tab.
</p>
</div>
</div>
</div>
</div>
<Alert>
<Info className="h-4 w-4" />
<AlertTitle>
{workflow.enabled ? 'Workflow is active with running executions' : 'Workflow has active executions'}
</AlertTitle>
<AlertDescription>
<p>
This workflow has <strong>{activeExecutionsCount}</strong> active execution
{activeExecutionsCount !== 1 ? 's' : ''}.{' '}
{!workflow.enabled && 'Even though the workflow is disabled, existing executions will continue. '}
To protect running workflows, you cannot:
</p>
<ul className="list-disc list-inside space-y-1 mt-2">
<li>Delete steps or transitions</li>
<li>Modify step configurations (email templates, conditions, etc.)</li>
<li>Change the workflow trigger</li>
</ul>
<p className="mt-2">
You can still rename steps and adjust their position. To make configuration changes, wait for executions
to complete or cancel them from the Executions tab.
</p>
</AlertDescription>
</Alert>
)}
{/* Validation Warning Banner */}
@@ -489,30 +478,18 @@ export default function WorkflowEditorPage() {
const validation = validateWorkflow(workflow);
if (!validation.valid) {
return (
<div className="bg-amber-50 border-l-4 border-amber-400 p-4 rounded-r-lg">
<div className="flex items-start">
<div className="flex-shrink-0">
<svg className="h-5 w-5 text-amber-400" viewBox="0 0 20 20" fill="currentColor">
<path
fillRule="evenodd"
d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z"
clipRule="evenodd"
/>
</svg>
</div>
<div className="ml-3 flex-1">
<h3 className="text-sm font-medium text-amber-800">Workflow has validation errors</h3>
<div className="mt-2 text-sm text-amber-700">
<p className="mb-2">Fix the following issues before enabling this workflow:</p>
<ul className="list-disc list-inside space-y-1">
{validation.errors.map((error, i) => (
<li key={i}>{error}</li>
))}
</ul>
</div>
</div>
</div>
</div>
<Alert variant="warning">
<AlertTriangle className="h-4 w-4" />
<AlertTitle>Workflow has validation errors</AlertTitle>
<AlertDescription>
<p className="mb-2">Fix the following issues before enabling this workflow:</p>
<ul className="list-disc list-inside space-y-1">
{validation.errors.map((error, i) => (
<li key={i}>{error}</li>
))}
</ul>
</AlertDescription>
</Alert>
);
}
return null;