Result
diff --git a/frontend/src/lib/components/FlowPreviewContent.svelte b/frontend/src/lib/components/FlowPreviewContent.svelte
index f7c508c37e..a183347fa3 100644
--- a/frontend/src/lib/components/FlowPreviewContent.svelte
+++ b/frontend/src/lib/components/FlowPreviewContent.svelte
@@ -161,7 +161,7 @@
/>
{#if jobId}
-
+
{:else}
Flow status will be displayed here
{/if}
diff --git a/frontend/src/lib/components/FlowStatusViewer.svelte b/frontend/src/lib/components/FlowStatusViewer.svelte
index 058881e407..9e6a3da4ee 100644
--- a/frontend/src/lib/components/FlowStatusViewer.svelte
+++ b/frontend/src/lib/components/FlowStatusViewer.svelte
@@ -8,7 +8,7 @@
import { createEventDispatcher } from 'svelte'
import { onDestroy } from 'svelte'
import type { FlowState } from './flows/flowState'
- import { Button, Tab } from './common'
+ import { Badge, Button, Tab } from './common'
import DisplayResult from './DisplayResult.svelte'
import Tabs from './common/tabs/Tabs.svelte'
import { FlowGraph } from './graph'
@@ -25,9 +25,17 @@
}
| undefined = undefined
export let job: Job | undefined = undefined
- export let flowModuleStates: Record
= {}
+ export let flowModuleStates: Record<
+ string,
+ { type: FlowStatusModule.type; logs?: string; result?: any }
+ > = {}
- let localFlowModuleStates: Record = {}
+ let localFlowModuleStates: Record<
+ string,
+ { type: FlowStatusModule.type; logs?: string; result?: any }
+ > = {}
+
+ let selectedNode: string | undefined = undefined
let jobResults: any[] = []
let jobFailures: boolean[] = []
@@ -41,7 +49,7 @@
Object.entries(localFlowModuleStates).forEach(([moduleId, state]) => {
if (
flowModuleStates[moduleId] !== state &&
- flowModuleStates[moduleId] !== FlowStatusModule.type.FAILURE
+ flowModuleStates[moduleId]?.type !== FlowStatusModule.type.FAILURE
) {
flowModuleStates[moduleId] = state
}
@@ -63,14 +71,27 @@
: []
) ?? []
+ $: innerModules.forEach((module, i) => {
+ if (
+ module.type === FlowStatusModule.type.WAITING_FOR_EVENTS &&
+ localFlowModuleStates?.[innerModules?.[i - 1]?.id ?? '']?.type ==
+ FlowStatusModule.type.SUCCESS
+ ) {
+ localFlowModuleStates[module.id ?? ''] = { type: module.type }
+ }
+ })
+
let errorCount = 0
async function loadJobInProgress() {
if (jobId != '00000000-0000-0000-0000-000000000000') {
try {
- job = await JobService.getJob({
+ const newJob = await JobService.getJob({
workspace: $workspaceStore ?? '',
id: jobId ?? ''
})
+ if (JSON.stringify(newJob) !== JSON.stringify(job)) {
+ job = newJob
+ }
errorCount = 0
} catch (e) {
errorCount += 1
@@ -186,11 +207,18 @@
jobFailures[j] = e.detail.success === false
}
if (e.detail.type == 'QueuedJob') {
- localFlowModuleStates[flowJobIds.moduleId] = FlowStatusModule.type.IN_PROGRESS
+ localFlowModuleStates[flowJobIds.moduleId] = {
+ type: FlowStatusModule.type.IN_PROGRESS,
+ logs: e.detail.logs
+ }
} else {
- localFlowModuleStates[flowJobIds.moduleId] = e.detail.success
- ? FlowStatusModule.type.SUCCESS
- : FlowStatusModule.type.FAILURE
+ localFlowModuleStates[flowJobIds.moduleId] = {
+ type: e.detail.success
+ ? FlowStatusModule.type.SUCCESS
+ : FlowStatusModule.type.FAILURE,
+ logs: e.detail.logs,
+ result: e.detail.result
+ }
}
}
}}
@@ -242,11 +270,18 @@
flowState[mod.id].previewArgs = e.detail.args
}
if (e.detail.type == 'QueuedJob') {
- localFlowModuleStates[mod.id] = FlowStatusModule.type.IN_PROGRESS
+ localFlowModuleStates[mod.id] = {
+ type: FlowStatusModule.type.IN_PROGRESS,
+ logs: e.detail.logs
+ }
} else {
- localFlowModuleStates[mod.id] = e.detail.success
- ? FlowStatusModule.type.SUCCESS
- : FlowStatusModule.type.FAILURE
+ localFlowModuleStates[mod.id] = {
+ type: e.detail.success
+ ? FlowStatusModule.type.SUCCESS
+ : FlowStatusModule.type.FAILURE,
+ logs: e.detail.logs,
+ result: e.detail.result
+ }
}
}
}}
@@ -270,14 +305,35 @@
{#if job.raw_flow && !isListJob}
-
+
-
+
+
+ {
+ if (e.detail.id) {
+ selectedNode = e.detail.id
+ }
+ }}
+ modules={job.raw_flow?.modules ?? []}
+ failureModule={job.raw_flow?.failure_module}
+ />
+
+
+ {#if selectedNode}
+ {#if localFlowModuleStates[selectedNode]}
+
{localFlowModuleStates[selectedNode].type}
+
+ {/if}
+ {:else}
Select a node to see its details here
{/if}
+
+
{/if}
{:else}
diff --git a/frontend/src/lib/components/IconedPath.svelte b/frontend/src/lib/components/IconedPath.svelte
index ff3dc6dc11..9911973ee6 100644
--- a/frontend/src/lib/components/IconedPath.svelte
+++ b/frontend/src/lib/components/IconedPath.svelte
@@ -7,10 +7,12 @@
{#if path.startsWith('hub/')}
-
-
{path}
+
+
+
+
{path}
{:else}
Workspace
-
{path}
+
{path}
{/if}
diff --git a/frontend/src/lib/components/JobStatus.svelte b/frontend/src/lib/components/JobStatus.svelte
index 3e83e86be2..cc2c6c7180 100644
--- a/frontend/src/lib/components/JobStatus.svelte
+++ b/frontend/src/lib/components/JobStatus.svelte
@@ -43,21 +43,27 @@
{:else if job && 'running' in job && job.running}
-
-
- Running {#if job.flow_status}({job.flow_status?.step ?? ''} of {job.raw_flow?.modules?.length ??
- '?'}){/if}
-
+
+
+
+ Running {#if job.flow_status}({job.flow_status?.step ?? ''} of {job.raw_flow?.modules
+ ?.length ?? '?'}){/if}
+
+
{:else if job && 'running' in job && 'scheduled_for' in job && job.scheduled_for && forLater(job.scheduled_for)}
-
-
- Scheduled for {displayDate(job.scheduled_for)}
-
+
+
+
+ Scheduled for {displayDate(job.scheduled_for)}
+
+
{:else if job && 'running' in job}
-
-
- Queued
-
+
+
+
+ Queued
+
+
{:else}
{/if}
diff --git a/frontend/src/lib/components/graph/FlowGraph.svelte b/frontend/src/lib/components/graph/FlowGraph.svelte
index 4117fcb57a..28cddee6b0 100644
--- a/frontend/src/lib/components/graph/FlowGraph.svelte
+++ b/frontend/src/lib/components/graph/FlowGraph.svelte
@@ -18,13 +18,14 @@
import { defaultIfEmptyString, truncateRev } from '$lib/utils'
import { createEventDispatcher } from 'svelte'
import { numberToChars } from '../flows/utils'
- import type { FlowState } from '../flows/flowState'
export let modules: FlowModule[] | undefined = []
export let failureModule: FlowModule | undefined = undefined
export let minHeight: number = 0
export let notSelectable = false
- export let flowModuleStates: Record
| undefined = undefined
+ export let flowModuleStates:
+ | Record
+ | undefined = undefined
let selectedNode: string | undefined = undefined
@@ -147,6 +148,8 @@
return 'rgb(248 113 113)'
case FlowStatusModule.type.IN_PROGRESS:
return 'rgb(253, 240, 176)'
+ case FlowStatusModule.type.WAITING_FOR_EVENTS:
+ return 'rgb(229, 176, 253)'
default:
return '#fff'
}
@@ -199,7 +202,7 @@
bgColor:
selectedNode == onClickDetail.id
? '#f5f5f5'
- : getStateColor(flowModuleStates?.[onClickDetail.id]),
+ : getStateColor(flowModuleStates?.[onClickDetail.id]?.type),
parentIds,
clickCallback: (node) => {
if (!notSelectable) {
@@ -391,7 +394,7 @@
}
-
+
{#if width && height}
{/if}
diff --git a/frontend/src/lib/components/preview/FlowPreviewStatus.svelte b/frontend/src/lib/components/preview/FlowPreviewStatus.svelte
index 9e18a84de1..6efc4628c4 100644
--- a/frontend/src/lib/components/preview/FlowPreviewStatus.svelte
+++ b/frontend/src/lib/components/preview/FlowPreviewStatus.svelte
@@ -5,27 +5,16 @@
export let job: QueuedJob | CompletedJob
-
-
-
-
- |
- Status
- |
- |
-
- {#if job}
-
- |
- Job Id
- |
-
-
- {job?.id}
-
- |
-
- {/if}
-
-
+