From 155a6ea30f7d5c744a87c0de6f202ba640eaaefd Mon Sep 17 00:00:00 2001
From: Faton Ramadani <faton.ramadani14@gmail.com>
Date: Tue, 23 Aug 2022 22:21:26 +0200
Subject: [PATCH] fix(front): Display all the logs (#479)

---
 .../src/lib/components/FlowPreview.svelte     |  1 -
 .../lib/components/FlowPreviewContent.svelte  | 36 +++----------------
 .../lib/components/FlowStatusViewer.svelte    |  2 ++
 3 files changed, 6 insertions(+), 33 deletions(-)

diff --git a/frontend/src/lib/components/FlowPreview.svelte b/frontend/src/lib/components/FlowPreview.svelte
index 0cc5cb5678..fe55d1eff8 100644
--- a/frontend/src/lib/components/FlowPreview.svelte
+++ b/frontend/src/lib/components/FlowPreview.svelte
@@ -26,7 +26,6 @@
 
 	let uptoText =
 		i >= flow.value.modules.length - 1 ? 'Preview whole flow' : 'Preview up to this step'
-	let job: Job | undefined
 	let jobId: string
 
 	export async function runPreview(args: any) {
diff --git a/frontend/src/lib/components/FlowPreviewContent.svelte b/frontend/src/lib/components/FlowPreviewContent.svelte
index 31ab1e79cd..a09ed81bff 100644
--- a/frontend/src/lib/components/FlowPreviewContent.svelte
+++ b/frontend/src/lib/components/FlowPreviewContent.svelte
@@ -1,7 +1,4 @@
 <script lang="ts">
-	import { Job, JobService } from '$lib/gen'
-	import { workspaceStore } from '$lib/stores'
-	import { sendUserToast, truncateRev } from '$lib/utils'
 	import { faClose, faPlay } from '@fortawesome/free-solid-svg-icons'
 	import { Button } from 'flowbite-svelte'
 	import { createEventDispatcher, onDestroy } from 'svelte'
@@ -15,9 +12,7 @@
 
 	export let args: Record<string, any> = {}
 
-	let intervalId: NodeJS.Timer
-	let job: Job | undefined
-	let jobId: string
+	let jobId: string | undefined = undefined
 	let isValid: boolean = false
 	let intervalState: 'idle' | 'canceled' | 'done' | 'running' = 'idle'
 
@@ -27,33 +22,11 @@
 	const dispatch = createEventDispatcher()
 
 	export async function runPreview(args: Record<string, any>) {
-		job?.type == 'QueuedJob' &&
-			(await JobService.cancelQueuedJob({
-				workspace: $workspaceStore!,
-				id: job.id,
-				requestBody: {}
-			}))
-		intervalId && clearInterval(intervalId)
-
 		jobId = await runFlowPreview(args, newFlow)
-		intervalId = setInterval(loadJob, 1000)
 		intervalState = 'running'
-		sendUserToast(`started preview ${truncateRev(jobId, 10)}`)
-	}
-	async function loadJob() {
-		try {
-			job = await JobService.getJob({ workspace: $workspaceStore!, id: jobId })
-			if (job?.type == 'CompletedJob') {
-				clearInterval(intervalId)
-				intervalState = 'done'
-			}
-		} catch (err) {
-			sendUserToast(err, true)
-		}
 	}
 
 	onDestroy(() => {
-		intervalId && clearInterval(intervalId)
 		intervalState = 'done'
 	})
 </script>
@@ -79,9 +52,8 @@
 			disabled={!isValid}
 			color="red"
 			on:click={() => {
-				clearInterval(intervalId)
 				intervalState = 'canceled'
-				job = undefined
+				jobId = undefined
 			}}
 			size="md"
 		>
@@ -94,9 +66,9 @@
 	{/if}
 
 	<div class="h-full overflow-y-auto mb-16 grow">
-		{#if job?.id}
+		{#if jobId}
 			<FlowStatusViewer
-				jobId={job.id}
+				{jobId}
 				on:jobsLoaded={(e) => mapJobResultsToFlowState(e.detail, 'upto', steps - 1)}
 				root={true}
 			/>
diff --git a/frontend/src/lib/components/FlowStatusViewer.svelte b/frontend/src/lib/components/FlowStatusViewer.svelte
index b3d14e58bb..bbc30b2785 100644
--- a/frontend/src/lib/components/FlowStatusViewer.svelte
+++ b/frontend/src/lib/components/FlowStatusViewer.svelte
@@ -85,6 +85,8 @@
 		<FlowPreviewStatus {job} />
 		{#if `result` in job}
 			<FlowJobResult {job} />
+		{:else}
+			<pre>{job.logs}</pre>
 		{/if}
 
 		{#if Array.isArray(forloopJobIds) && forloopJobIds?.length > 0 && Array.isArray(loopJobs)}