From ddfde994ee96cbb806274ea644d9e70333f42229 Mon Sep 17 00:00:00 2001
From: Faton Ramadani <faton.ramadani14@gmail.com>
Date: Wed, 24 Jan 2024 11:03:37 +0100
Subject: [PATCH] =?UTF-8?q?feat(frontend):=20display=20a=20warning=20with?=
 =?UTF-8?q?=20a=20documentation=20link=20on=20how=20to=E2=80=A6=20(#3012)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat(frontend): display a warning with a documentation link on how to use persistent storage for large files

* feat(frontend): display a warning with a documentation link on how to use persistent storage for large files

* feat(frontend): display alert linked to persistent storage

* feat(frontend): display alert linked to persistent storage

* feat(frontend): change wording

* feat(frontend): change wording
---
 .../src/lib/components/DisplayResult.svelte   | 25 ++++++++++++++++---
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/frontend/src/lib/components/DisplayResult.svelte b/frontend/src/lib/components/DisplayResult.svelte
index d0844b2ac0..39c68c05a1 100644
--- a/frontend/src/lib/components/DisplayResult.svelte
+++ b/frontend/src/lib/components/DisplayResult.svelte
@@ -8,6 +8,7 @@
 	import Portal from 'svelte-portal'
 	import ObjectViewer from './propertyPicker/ObjectViewer.svelte'
 	import S3FilePicker from './S3FilePicker.svelte'
+	import Alert from './common/alert/Alert.svelte'
 	import AutoDataTable from './table/AutoDataTable.svelte'
 	import Markdown from 'svelte-exmarkdown'
 	import { HelpersService } from '$lib/gen'
@@ -324,8 +325,8 @@
 				<pre>{result?.['result']}</pre>
 			</div>
 		{:else if !forceJson && resultKind == 'file'}
-			<div
-				><a
+			<div>
+				<a
 					download={result.filename ?? result.file?.filename ?? 'windmill.file'}
 					href="data:application/octet-stream;base64,{contentOrRootString(result.file)}">Download</a
 				>
@@ -417,11 +418,27 @@
 						download="{filename ?? 'result'}.json"
 						href={workspaceId && jobId
 							? `/api/w/${workspaceId}/jobs_u/completed/get_result/${jobId}`
-							: `data:text/json;charset=utf-8,${encodeURIComponent(toJsonStr(result))}`}>Download</a
+							: `data:text/json;charset=utf-8,${encodeURIComponent(toJsonStr(result))}`}
 					>
+						Download {filename ? '' : 'as JSON'}
+					</a>
+				</div>
+
+				<div class="my-4">
+					<Alert size="xs" title="Large file detected" type="warning">
+						We recommend using persistent storage for large data files.
+						<a
+							href="https://www.windmill.dev/docs/core_concepts/persistent_storage#large-data-files-s3-r2-minio"
+							target="_blank"
+							rel="noreferrer"
+							class="hover:underline"
+						>
+							See docs for setting up an object storage service integration using s3 or any other s3
+							compatible services
+						</a>
+					</Alert>
 				</div>
 			{/if}
-			<div class="mb-21">JSON is too large to be displayed in full</div>
 			{#if result && result != 'WINDMILL_TOO_BIG'}
 				<ObjectViewer json={result} />
 			{/if}