allow updating to latest hash from within flow directly if module hash locked

frontend/src/lib/components/ModulePreview.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import type { Schema } from '$lib/common'
-	import type { FlowModule, Job } from '$lib/gen'
+	import { ScriptService, type FlowModule, type Job } from '$lib/gen'
 	import { getScriptByPath, sendUserToast, truncateRev } from '$lib/utils'
 	import { Pane, Splitpanes } from 'svelte-splitpanes'
 	import RunForm from './RunForm.svelte'
@@ -12,6 +12,7 @@
 	import { flowStateStore } from './flows/flowState'
 	import { flowStore } from './flows/flowStore'
 	import { Alert } from './common'
+	import { workspaceStore } from '$lib/stores'
 
 	let testJobLoader: TestJobLoader
 
@@ -33,7 +34,9 @@
 		if (val.type == 'rawscript') {
 			await testJobLoader?.runPreview(val.path, val.content, val.language, args)
 		} else if (val.type == 'script') {
-			const script = await getScriptByPath(val.path)
+			const script = val.hash
+				? await ScriptService.getScriptByHash({ workspace: $workspaceStore!, hash: val.hash })
+				: await getScriptByPath(val.path)
 			await testJobLoader?.runPreview(val.path, script.content, script.language, args)
 		} else {
 			throw Error('not testable module type')

frontend/src/lib/components/TemplateEditor.svelte

@@ -432,7 +432,7 @@
 			lineNumbers: 'off',
 			fontSize: 16,
 			suggestOnTriggerCharacters: true,
-			lineDecorationsWidth: 0
+			lineDecorationsWidth: 20
 		})
 
 		const stdLib = { content: libStdContent, filePath: 'es5.d.ts' }

frontend/src/lib/components/flows/common/FlowCardHeader.svelte

@@ -1,9 +1,10 @@
 <script lang="ts">
 	import type { BadgeColor } from '$lib/components/common'
 	import Badge from '$lib/components/common/badge/Badge.svelte'
+	import Button from '$lib/components/common/button/Button.svelte'
 	import IconedPath from '$lib/components/IconedPath.svelte'
-	import { RawScript, type FlowModule } from '$lib/gen'
-	import { truncateHash } from '$lib/utils'
+	import { RawScript, ScriptService, type FlowModule, type PathScript } from '$lib/gen'
+	import { workspaceStore } from '$lib/stores'
 
 	export let flowModule: FlowModule | undefined = undefined
 	export let title: string | undefined = undefined
@@ -14,6 +15,22 @@
 		[RawScript.language.PYTHON3]: 'dark-green',
 		[RawScript.language.BASH]: 'dark-yellow'
 	}
+
+	let newHash: string | undefined = undefined
+	async function loadLatestHash(value: PathScript) {
+		let script = await ScriptService.getScriptByPath({
+			workspace: $workspaceStore!,
+			path: value.path
+		})
+		if (script.hash != value.hash) {
+			newHash = script.hash
+		}
+	}
+
+	$: $workspaceStore &&
+		flowModule?.value.type === 'script' &&
+		flowModule.value.hash &&
+		loadLatestHash(flowModule.value)
 </script>
 
 <div
@@ -31,6 +48,18 @@
 					<input bind:value={flowModule.summary} placeholder={'Summary'} class="w-full grow" />
 				{:else if flowModule?.value.type === 'script' && 'path' in flowModule.value && flowModule.value.path}
 					<IconedPath path={flowModule.value.path} hash={flowModule.value.hash} class="grow" />
+					{#if newHash}
+						<Button
+							size="xs"
+							variant="border"
+							on:click={() => {
+								if (flowModule?.value.type == 'script') {
+									flowModule.value.hash = newHash
+									newHash = undefined
+								}
+							}}>Update to latest hash</Button
+						>
+					{/if}
 					<input bind:value={flowModule.summary} placeholder="Summary" class="w-full grow" />
 				{/if}
 			</div>

frontend/src/lib/components/flows/content/FlowModuleComponent.svelte

@@ -187,7 +187,7 @@
 								/>
 							</div>
 						{:else if value.type === 'script'}
-							<FlowModuleScript path={value.path} />
+							<FlowModuleScript path={value.path} hash={value.hash} />
 						{:else if value.type === 'flow'}
 							<FlowPathViewer path={value.path} />
 						{/if}

frontend/src/lib/components/flows/content/FlowModuleScript.svelte

@@ -1,20 +1,24 @@
 <script lang="ts">
 	import HighlightCode from '$lib/components/HighlightCode.svelte'
+	import { ScriptService } from '$lib/gen'
+	import { workspaceStore } from '$lib/stores'
 	import { getScriptByPath } from '$lib/utils'
 
 	export let path: string
+	export let hash: string | undefined
 
 	let code: string
 	let language: 'deno' | 'python3' | 'go' | 'bash'
-	let description: string
 
-	async function loadCode(path: string) {
-		const script = await getScriptByPath(path!)
+	async function loadCode(path: string, hash: string | undefined) {
+		const script = hash
+			? await ScriptService.getScriptByHash({ workspace: $workspaceStore!, hash })
+			: await getScriptByPath(path!)
 		code = script.content
 		language = script.language
 	}
 
-	$: path && loadCode(path)
+	$: path && loadCode(path, hash)
 </script>
 
 <div class="flex flex-col flex-1 h-full overflow-auto p-2">

frontend/src/lib/components/flows/pickers/WorkspaceScriptPicker.svelte

@@ -43,7 +43,7 @@
 	).sort()
 
 	const dispatch = createEventDispatcher()
-	let lockHash = displayLock
+	let lockHash = false
 </script>
 
 <SearchItems