feat(frontend): handle file default value (#3095)

frontend/src/lib/components/ArgInput.svelte

@@ -489,7 +489,7 @@
 							on:focus={(e) => {
 								dispatch('focus')
 							}}
-							code={JSON.stringify({ s3: '' }, null, 2)}
+							code={JSON.stringify(value ?? defaultValue ?? { s3: '' }, null, 2)}
 							bind:value
 						/>
 						<Button
@@ -518,6 +518,7 @@
 									s3: ''
 								}
 							}}
+							defaultValue={defaultValue?.s3}
 						/>
 					{/if}
 				</div>

frontend/src/lib/components/S3ObjectPicker.svelte

@@ -60,7 +60,7 @@
 			on:focus={(e) => {
 				dispatch('focus')
 			}}
-			code={JSON.stringify({ s3: '' }, null, 2)}
+			code={JSON.stringify(value ?? { s3: '' }, null, 2)}
 			bind:value
 		/>
 		<Button
@@ -89,6 +89,7 @@
 					s3: ''
 				}
 			}}
+			defaultValue={value?.s3}
 		/>
 	{/if}
 </div>

frontend/src/lib/components/common/fileInput/FileInput.svelte

@@ -17,6 +17,8 @@
 	export let iconSize = 36
 	export let returnFileNames = false
 	export let submittedText: string | undefined = undefined
+	export let defaultFile: string | undefined = undefined
+
 	const dispatch = createEventDispatcher()
 	let input: HTMLInputElement
 	let files: File[] | undefined = undefined
@@ -156,4 +158,10 @@
 		{multiple}
 		{...$$restProps}
 	/>
+
+	{#if defaultFile}
+		<div class="w-full border-dashed border-t-2 text-2xs pt-1 text-tertiary mt-2">
+			Default file: <span class="text-blue-500">{defaultFile}</span>
+		</div>
+	{/if}
 </button>

frontend/src/lib/components/common/fileUpload/FileUpload.svelte

@@ -21,6 +21,7 @@
 	export let randomFileKey: boolean = false
 	export let pathTransformer: any = undefined // function taking as input {file: File} and returning a string
 	export let forceDisplayUploads: boolean = false
+	export let defaultValue: string | undefined = undefined
 
 	const dispatch = createEventDispatcher()
 
@@ -174,7 +175,7 @@
 	}
 </script>
 
-<div class="w-full h-full p-2 flex">
+<div class="w-full h-full p-2 flex flex-col">
 	{#if $fileUploads.length > 0 && !forceDisplayUploads}
 		<div class="border rounded-md flex flex-col gap-1 divide-y h-full w-full p-1">
 			<div class="flex h-full overflow-y-auto flex-col">
@@ -362,6 +363,7 @@
 			}}
 			class={twMerge('w-full h-full', customClass, 'wm-file-input')}
 			style={customStyle}
+			defaultFile={defaultValue}
 		>
 			{containerText}
 		</FileInput>