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 {DashboardLayout} from '../../components/DashboardLayout';
import {network} from '../../lib/network'; import {network} from '../../lib/network';
import { import {
AlertTriangle,
ArrowLeft, ArrowLeft,
ChevronDown, ChevronDown,
Clock, Clock,
@@ -446,41 +447,29 @@ export default function WorkflowEditorPage() {
{/* Active Executions Warning Banner */} {/* Active Executions Warning Banner */}
{activeExecutionsCount > 0 && ( {activeExecutionsCount > 0 && (
<div className="bg-blue-50 border-l-4 border-blue-400 p-4 rounded-r-lg"> <Alert>
<div className="flex items-start"> <Info className="h-4 w-4" />
<div className="flex-shrink-0"> <AlertTitle>
<svg className="h-5 w-5 text-blue-400" viewBox="0 0 20 20" fill="currentColor"> {workflow.enabled ? 'Workflow is active with running executions' : 'Workflow has active executions'}
<path </AlertTitle>
fillRule="evenodd" <AlertDescription>
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" <p>
clipRule="evenodd" This workflow has <strong>{activeExecutionsCount}</strong> active execution
/> {activeExecutionsCount !== 1 ? 's' : ''}.{' '}
</svg> {!workflow.enabled && 'Even though the workflow is disabled, existing executions will continue. '}
</div> To protect running workflows, you cannot:
<div className="ml-3 flex-1"> </p>
<h3 className="text-sm font-medium text-blue-800"> <ul className="list-disc list-inside space-y-1 mt-2">
{workflow.enabled ? 'Workflow is active with running executions' : 'Workflow has active executions'} <li>Delete steps or transitions</li>
</h3> <li>Modify step configurations (email templates, conditions, etc.)</li>
<div className="mt-2 text-sm text-blue-700"> <li>Change the workflow trigger</li>
<p> </ul>
This workflow has <strong>{activeExecutionsCount}</strong> active execution <p className="mt-2">
{activeExecutionsCount !== 1 ? 's' : ''}.{' '} You can still rename steps and adjust their position. To make configuration changes, wait for executions
{!workflow.enabled && 'Even though the workflow is disabled, existing executions will continue. '} to complete or cancel them from the Executions tab.
To protect running workflows, you cannot: </p>
</p> </AlertDescription>
<ul className="list-disc list-inside space-y-1 mt-2"> </Alert>
<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>
)} )}
{/* Validation Warning Banner */} {/* Validation Warning Banner */}
@@ -489,30 +478,18 @@ export default function WorkflowEditorPage() {
const validation = validateWorkflow(workflow); const validation = validateWorkflow(workflow);
if (!validation.valid) { if (!validation.valid) {
return ( return (
<div className="bg-amber-50 border-l-4 border-amber-400 p-4 rounded-r-lg"> <Alert variant="warning">
<div className="flex items-start"> <AlertTriangle className="h-4 w-4" />
<div className="flex-shrink-0"> <AlertTitle>Workflow has validation errors</AlertTitle>
<svg className="h-5 w-5 text-amber-400" viewBox="0 0 20 20" fill="currentColor"> <AlertDescription>
<path <p className="mb-2">Fix the following issues before enabling this workflow:</p>
fillRule="evenodd" <ul className="list-disc list-inside space-y-1">
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" {validation.errors.map((error, i) => (
clipRule="evenodd" <li key={i}>{error}</li>
/> ))}
</svg> </ul>
</div> </AlertDescription>
<div className="ml-3 flex-1"> </Alert>
<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>
); );
} }
return null; return null;