windmill-components 1.522.0 → 1.531.1

package/package/components/FlowLogViewerWrapper.svelte

@@ -0,0 +1,52 @@
+<script lang="ts">import FlowLogViewer from './FlowLogViewer.svelte';
+import { untrack } from 'svelte';
+import { ChangeTracker } from '../svelte5Utils.svelte';
+import { readFieldsRecursively } from '../utils';
+let { job, localModuleStates, workspaceId, render, onSelectedIteration, mode = 'flow' } = $props();
+// State for tracking expanded rows - using Record to allow explicit control
+let expandedRows = $state({});
+let allExpanded = $state(false);
+let showResultsInputs = $state(true);
+let moduleTracker = new ChangeTracker($state.snapshot(job.raw_flow?.modules ?? []));
+$effect(() => {
+    readFieldsRecursively(job.raw_flow?.modules ?? []);
+    untrack(() => moduleTracker.track($state.snapshot(job.raw_flow?.modules ?? [])));
+});
+let modules = $derived.by(() => {
+    moduleTracker.counter;
+    return untrack(() => job.raw_flow?.modules ?? []);
+});
+function toggleExpanded(id) {
+    // If not in record, use opposite of allExpanded as new state
+    // If in record, toggle the current state
+    const currentState = expandedRows[id] ?? allExpanded;
+    expandedRows[id] = !currentState;
+}
+function getSelectedIteration(stepId) {
+    return localModuleStates[stepId]?.selectedForloopIndex ?? 0;
+}
+function toggleExpandAll() {
+    allExpanded = !allExpanded;
+    expandedRows = {};
+}
+</script>
+
+<div class="w-full rounded-md overflow-hidden border">
+	<FlowLogViewer
+		{modules}
+		{localModuleStates}
+		rootJob={job}
+		{expandedRows}
+		{allExpanded}
+		{showResultsInputs}
+		{toggleExpanded}
+		{toggleExpandAll}
+		{onSelectedIteration}
+		{workspaceId}
+		{render}
+		{getSelectedIteration}
+		flowId="root"
+		flowStatus={undefined}
+		{mode}
+	/>
+</div>

package/package/components/FlowLogViewerWrapper.svelte.d.ts

@@ -0,0 +1,21 @@
+import type { Job } from '../gen';
+import type { GraphModuleState } from './graph';
+interface Props {
+    job: Partial<Job>;
+    localModuleStates: Record<string, GraphModuleState>;
+    workspaceId: string | undefined;
+    render: boolean;
+    onSelectedIteration: (detail: {
+        id: string;
+        index: number;
+        manuallySet: true;
+        moduleId: string;
+    } | {
+        manuallySet: false;
+        moduleId: string;
+    }) => Promise<void>;
+    mode?: 'flow' | 'aiagent';
+}
+declare const FlowLogViewerWrapper: import("svelte").Component<Props, {}, "">;
+type FlowLogViewerWrapper = ReturnType<typeof FlowLogViewerWrapper>;
+export default FlowLogViewerWrapper;

package/package/components/FlowLoopIterationPreview.svelte

@@ -144,10 +144,10 @@ $effect(() => {
 		<div class="pt-4 grow">
 			{#if jobId}
 				<FlowStatusViewer
-					{flowStateStore}
+					bind:flowStateStore={flowStateStore.val}
 					{jobId}
-					on:jobsLoaded={({ detail }) => {
-						job = detail
+					onJobsLoaded={({ job: newJob }) => {
+						job = newJob
 					}}
 					bind:selectedJobStep
 				/>

package/package/components/FlowPreviewContent.svelte

@@ -17,18 +17,17 @@ import InputSelectedBadge from './schema/InputSelectedBadge.svelte';
 import Toggle from './Toggle.svelte';
 import JsonInputs from './JsonInputs.svelte';
 import FlowHistoryJobPicker from './FlowHistoryJobPicker.svelte';
-import { writable } from 'svelte/store';
 import { getStepHistoryLoaderContext } from './stepHistoryLoader.svelte';
 import { aiChatManager } from './copilot/chat/AIChatManager.svelte';
 import { stateSnapshot } from '../svelte5Utils.svelte';
-let { previewMode = $bindable(), open, preventEscape = $bindable(false), jobId = $bindable(undefined), job = $bindable(undefined), initial = $bindable(false), selectedJobStep = $bindable(undefined), selectedJobStepIsTopLevel = $bindable(undefined), selectedJobStepType = $bindable('single'), rightColumnSelect = $bindable('timeline'), branchOrIterationN = $bindable(0), scrollTop = $bindable(0), localModuleStates = $bindable(writable({})), localDurationStatuses = $bindable(writable({})), onRunPreview, render = false, onJobDone, upToId = undefined } = $props();
+let { previewMode = $bindable(), open, preventEscape = $bindable(false), jobId = $bindable(undefined), job = $bindable(undefined), initial = $bindable(false), selectedJobStep = $bindable(undefined), selectedJobStepIsTopLevel = $bindable(undefined), selectedJobStepType = $bindable('single'), rightColumnSelect = $bindable('timeline'), branchOrIterationN = $bindable(0), scrollTop = $bindable(0), localModuleStates = $bindable({}), localDurationStatuses = $bindable({}), onRunPreview, render = false, onJobDone, upToId = undefined } = $props();
 let restartBranchNames = [];
 let isRunning = $state(false);
 let jsonView = $state(false);
 let jsonEditor = $state(undefined);
 let schemaHeight = $state(0);
 let isValid = $state(true);
-let suspendStatus = $state(writable({}));
+let suspendStatus = $state({ val: {} });
 let isOwner = $state(false);
 export function test() {
     renderCount++;
@@ -491,9 +490,9 @@ export function flowHasChanged() {
 					bind:suspendStatus
 					hideDownloadInGraph={customUi?.downloadLogs === false}
 					wideResults
-					{flowStateStore}
+					bind:flowStateStore={flowStateStore.val}
 					{jobId}
-					on:done={(x) => {
+					onDone={() => {
 						isRunning = false
 						$executionCount = $executionCount + 1
 						onJobDone?.()

package/package/components/FlowPreviewContent.svelte.d.ts

@@ -1,5 +1,5 @@
 import { type Job, type RestartedFrom } from '../gen';
-import { type Writable } from 'svelte/store';
+import { type StateStore } from '../utils';
 import type { DurationStatus, GraphModuleState } from './graph';
 interface Props {
     previewMode: 'upTo' | 'whole';
@@ -14,8 +14,8 @@ interface Props {
     rightColumnSelect?: 'timeline' | 'node_status' | 'node_definition' | 'user_states';
     branchOrIterationN?: number;
     scrollTop?: number;
-    localModuleStates?: Writable<Record<string, GraphModuleState>>;
-    localDurationStatuses?: Writable<Record<string, DurationStatus>>;
+    localModuleStates?: Record<string, GraphModuleState>;
+    localDurationStatuses?: Record<string, DurationStatus>;
     onRunPreview?: () => void;
     render?: boolean;
     onJobDone?: () => void;
@@ -47,9 +47,9 @@ declare const FlowPreviewContent: $$__sveltets_2_IsomorphicComponent<Props, {
     runPreview: (args: Record<string, any>, restartedFrom: RestartedFrom | undefined) => Promise<void>;
     refresh: () => void;
     cancelTest: () => Promise<void>;
-    getLocalModuleStates: () => Writable<Record<string, GraphModuleState>>;
-    getLocalDurationStatuses: () => Writable<Record<string, DurationStatus>>;
-    getSuspendStatus: () => Writable<Record<string, {
+    getLocalModuleStates: () => Record<string, GraphModuleState>;
+    getLocalDurationStatuses: () => Record<string, DurationStatus>;
+    getSuspendStatus: () => StateStore<Record<string, {
         job: Job;
         nb: number;
     }>>;
@@ -57,6 +57,6 @@ declare const FlowPreviewContent: $$__sveltets_2_IsomorphicComponent<Props, {
     getIsOwner: () => boolean;
     getJob: () => Job | undefined;
     flowHasChanged: () => boolean;
-}, "initial" | "preventEscape" | "job" | "jobId" | "scrollTop" | "localDurationStatuses" | "rightColumnSelect" | "localModuleStates" | "selectedJobStep" | "previewMode" | "selectedJobStepIsTopLevel" | "selectedJobStepType" | "branchOrIterationN">;
+}, "initial" | "preventEscape" | "job" | "jobId" | "scrollTop" | "localModuleStates" | "rightColumnSelect" | "localDurationStatuses" | "selectedJobStep" | "previewMode" | "selectedJobStepIsTopLevel" | "selectedJobStepType" | "branchOrIterationN">;
 type FlowPreviewContent = InstanceType<typeof FlowPreviewContent>;
 export default FlowPreviewContent;

package/package/components/FlowPreviewResult.svelte

@@ -4,7 +4,7 @@ import FlowPreviewStatus from './preview/FlowPreviewStatus.svelte';
 import FlowStatusWaitingForEvents from './FlowStatusWaitingForEvents.svelte';
 import { emptyString } from '../utils';
 import Badge from './common/badge/Badge.svelte';
-let { job, workspaceId, isOwner, hideFlowResult, hideDownloadLogs, localDurationStatuses, innerModules, suspendStatus, hideJobId, extra, result_streams } = $props();
+let { job, workspaceId, isOwner, hideFlowResult, hideDownloadLogs, innerModules, suspendStatus, hideJobId, extra, result_streams } = $props();
 </script>
 
 <FlowPreviewStatus {job} {hideJobId} {extra} />
@@ -23,16 +23,15 @@ let { job, workspaceId, isOwner, hideFlowResult, hideDownloadLogs, localDuration
 				loading={job['running'] == true}
 				result={job.result}
 				logs={job.logs}
-				durationStates={localDurationStatuses}
 				downloadLogs={!hideDownloadLogs}
 			/>
 		</div>
 	{/if}
 {:else if job.flow_status?.modules?.[job?.flow_status?.step]?.type === 'WaitingForEvents'}
 	<FlowStatusWaitingForEvents {workspaceId} {job} {isOwner} />
-{:else if $suspendStatus && Object.keys($suspendStatus).length > 0}
+{:else if suspendStatus.val && Object.keys(suspendStatus.val).length > 0}
 	<div class="flex gap-2 flex-col">
-		{#each Object.values($suspendStatus) as suspendCount (suspendCount.job.id)}
+		{#each Object.values(suspendStatus.val) as suspendCount (suspendCount.job.id)}
 			<div>
 				<div class="text-sm">
 					Flow suspended, waiting for {suspendCount.nb} events
@@ -47,7 +46,7 @@ let { job, workspaceId, isOwner, hideFlowResult, hideDownloadLogs, localDuration
 	>
 		<pre class="w-full">{job.logs}</pre>
 	</div>
-{:else if innerModules?.length > 0}
+{:else if innerModules && innerModules?.length > 0}
 	<div class="flex flex-col gap-1">
 		{#each innerModules as mod, i (mod.id)}
 			{#if mod.type == 'InProgress'}

package/package/components/FlowPreviewResult.svelte.d.ts

@@ -1,15 +1,13 @@
 import type { FlowStatusModule, Job } from '../gen';
-import type { DurationStatus } from './graph';
-import type { Writable } from 'svelte/store';
+import { type StateStore } from '../utils';
 interface Props {
     job: Job;
     workspaceId: string | undefined;
     isOwner: boolean;
     hideFlowResult: boolean;
     hideDownloadLogs: boolean;
-    localDurationStatuses: Writable<Record<string, DurationStatus>>;
-    innerModules: FlowStatusModule[];
-    suspendStatus: Writable<Record<string, {
+    innerModules: FlowStatusModule[] | undefined;
+    suspendStatus: StateStore<Record<string, {
         job: Job;
         nb: number;
     }>>;

package/package/components/FlowStatusViewer.svelte

@@ -1,11 +1,12 @@
-<script lang="ts">import { writable } from 'svelte/store';
-import FlowStatusViewerInner from './FlowStatusViewerInner.svelte';
-import { createEventDispatcher, setContext, untrack } from 'svelte';
+<script lang="ts">import FlowStatusViewerInner from './FlowStatusViewerInner.svelte';
+import { setContext, untrack } from 'svelte';
 import { isOwner as loadIsOwner } from '../utils';
 import { userStore, workspaceStore } from '../stores';
-let { jobId, initialJob = undefined, workspaceId = undefined, flowStateStore = writable({}), selectedJobStep = $bindable(undefined), hideFlowResult = false, hideTimeline = false, hideDownloadInGraph = false, hideNodeDefinition = false, hideJobId = false, hideDownloadLogs = false, rightColumnSelect = $bindable('timeline'), isOwner = $bindable(false), wideResults = false, localModuleStates = $bindable(writable({})), localDurationStatuses = $bindable(writable({})), job = $bindable(undefined), render = true, suspendStatus = $bindable(writable({})), customUi } = $props();
+let { jobId, initialJob = undefined, workspaceId = undefined, flowStateStore = $bindable({}), selectedJobStep = $bindable(undefined), hideFlowResult = false, hideTimeline = false, hideDownloadInGraph = false, hideNodeDefinition = false, hideJobId = false, hideDownloadLogs = false, rightColumnSelect = $bindable('timeline'), isOwner = $bindable(false), wideResults = false, localModuleStates = $bindable({}), localDurationStatuses = $bindable({}), job = $bindable(undefined), render = true, suspendStatus = $bindable({ val: {} }), customUi, onStart, onJobsLoaded, onDone } = $props();
 let lastJobId = jobId;
-let retryStatus = writable({});
+let retryStatus = $state({ val: {} });
+let globalRefreshes = $state({});
+let globalIterationBounds = $state({});
 setContext('FlowStatusViewer', {
     flowStateStore,
     suspendStatus,
@@ -22,11 +23,12 @@ function loadOwner(path) {
 async function updateJobId() {
     if (jobId !== lastJobId) {
         lastJobId = jobId;
-        $retryStatus = {};
-        $suspendStatus = {};
+        retryStatus.val = {};
+        suspendStatus.val = {};
+        globalRefreshes = {};
+        globalIterationBounds = {};
     }
 }
-const dispatch = createEventDispatcher();
 let lastScriptPath = $state(undefined);
 $effect.pre(() => {
     jobId;
@@ -34,25 +36,31 @@ $effect.pre(() => {
         jobId && updateJobId();
     });
 });
+let refreshGlobal = async (moduleId, clear, root) => {
+    let allFns = globalRefreshes?.[moduleId]?.map((x) => x(clear, root)) ?? [];
+    await Promise.all(allFns);
+};
+let updateGlobalRefresh = (moduleId, updateFn) => {
+    globalRefreshes[moduleId] = [...(globalRefreshes[moduleId] ?? []), updateFn];
+};
 </script>
 
 <FlowStatusViewerInner
 	{hideFlowResult}
-	on:jobsLoaded={({ detail }) => {
-		let { job } = detail
+	onJobsLoaded={({ job, force }) => {
 		if (job.script_path != lastScriptPath && job.script_path) {
 			lastScriptPath = job.script_path
 			loadOwner(lastScriptPath ?? '')
 		}
-		dispatch('jobsLoaded', job)
+		onJobsLoaded?.({ job, force })
 	}}
 	globalModuleStates={[]}
-	globalDurationStatuses={[]}
-	{localModuleStates}
-	{localDurationStatuses}
+	{globalIterationBounds}
+	bind:localModuleStates
 	bind:selectedNode={selectedJobStep}
-	on:start
-	on:done
+	bind:localDurationStatuses
+	{onStart}
+	{onDone}
 	bind:job
 	{initialJob}
 	{jobId}
@@ -62,4 +70,8 @@ $effect.pre(() => {
 	bind:rightColumnSelect
 	{render}
 	{customUi}
+	graphTabOpen={true}
+	isNodeSelected={true}
+	{refreshGlobal}
+	{updateGlobalRefresh}
 />

package/package/components/FlowStatusViewer.svelte.d.ts

@@ -1,12 +1,12 @@
-import { type Writable } from 'svelte/store';
 import type { FlowState } from './flows/flowState';
 import type { DurationStatus, GraphModuleState } from './graph';
-import type { Job } from '../gen';
+import { type StateStore } from '../utils';
+import type { CompletedJob, Job } from '../gen';
 interface Props {
     jobId: string;
     initialJob?: Job | undefined;
     workspaceId?: string | undefined;
-    flowStateStore?: Writable<FlowState>;
+    flowStateStore?: FlowState;
     selectedJobStep?: string | undefined;
     hideFlowResult?: boolean;
     hideTimeline?: boolean;
@@ -17,34 +17,26 @@ interface Props {
     rightColumnSelect?: 'timeline' | 'node_status' | 'node_definition' | 'user_states';
     isOwner?: boolean;
     wideResults?: boolean;
-    localModuleStates?: Writable<Record<string, GraphModuleState>>;
-    localDurationStatuses?: Writable<Record<string, DurationStatus>>;
+    localModuleStates?: Record<string, GraphModuleState>;
+    localDurationStatuses?: Record<string, DurationStatus>;
     job?: Job | undefined;
     render?: boolean;
-    suspendStatus?: any;
+    suspendStatus?: StateStore<Record<string, {
+        job: Job;
+        nb: number;
+    }>>;
     customUi?: {
         tagLabel?: string | undefined;
     };
+    onStart?: () => void;
+    onJobsLoaded?: ({ job, force }: {
+        job: Job;
+        force: boolean;
+    }) => void;
+    onDone?: ({ job }: {
+        job: CompletedJob;
+    }) => void;
 }
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const FlowStatusViewer: $$__sveltets_2_IsomorphicComponent<Props, {
-    start: CustomEvent<any>;
-    done: CustomEvent<any>;
-    jobsLoaded: CustomEvent<any>;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "job" | "isOwner" | "suspendStatus" | "localDurationStatuses" | "rightColumnSelect" | "localModuleStates" | "selectedJobStep">;
-type FlowStatusViewer = InstanceType<typeof FlowStatusViewer>;
+declare const FlowStatusViewer: import("svelte").Component<Props, {}, "job" | "isOwner" | "suspendStatus" | "localModuleStates" | "flowStateStore" | "rightColumnSelect" | "localDurationStatuses" | "selectedJobStep">;
+type FlowStatusViewer = ReturnType<typeof FlowStatusViewer>;
 export default FlowStatusViewer;