perf: lazy-load script editor history and hit partial index (#9107)

frontend/src/lib/components/ScriptEditor.svelte

@@ -561,6 +561,8 @@
 	let testIsLoading = $state(false)
 	let testJob: Job | undefined = $state()
 	let pastPreviews: CompletedJob[] = $state([])
+	let historyTabActive = false
+	let pastPreviewsRequest: ReturnType<typeof JobService.listCompletedJobs> | undefined
 	let validCode = $state(true)
 
 	// Recording
@@ -691,7 +693,9 @@
 						lastRecording = scriptRecording.stop()
 						setActiveRecording(undefined)
 					}
-					loadPastTests()
+					if (historyTabActive) {
+						loadPastTests()
+					}
 				},
 				doneError({ error }) {
 					if (scriptRecording.active) {
@@ -722,12 +726,29 @@
 	}
 
 	async function loadPastTests(): Promise<void> {
-		pastPreviews = await JobService.listCompletedJobs({
+		pastPreviewsRequest?.cancel()
+		const req = JobService.listCompletedJobs({
 			workspace: $workspaceStore!,
 			jobKinds: 'preview',
 			createdBy: $userStore?.username,
-			scriptPathExact: path
+			scriptPathExact: path,
+			hasNullParent: true
 		})
+		pastPreviewsRequest = req
+		try {
+			const result = await req
+			if (pastPreviewsRequest === req) {
+				pastPreviews = result
+			}
+		} catch (err) {
+			if (!(err instanceof Error) || err.name !== 'CancelError') {
+				throw err
+			}
+		} finally {
+			if (pastPreviewsRequest === req) {
+				pastPreviewsRequest = undefined
+			}
+		}
 	}
 
 	export async function inferSchema(
@@ -1128,7 +1149,6 @@
 		if (!validCode && code && lang) {
 			await inferSchema(code, { applyInitialArgs: true })
 		}
-		loadPastTests()
 		aiChatManager.saveAndClear()
 		aiChatManager.changeMode(AIMode.SCRIPT)
 	})
@@ -1209,6 +1229,8 @@
 	}
 
 	onDestroy(() => {
+		pastPreviewsRequest?.cancel()
+		pastPreviewsRequest = undefined
 		disableCollaboration()
 		aiChatManager.scriptEditorApplyCode = undefined
 		aiChatManager.scriptEditorShowDiffMode = undefined
@@ -1676,6 +1698,12 @@
 										} as any)
 									: testJob}
 								{pastPreviews}
+								onTabChange={(tab) => {
+									historyTabActive = tab === 'history'
+									if (historyTabActive) {
+										loadPastTests()
+									}
+								}}
 								previewIsLoading={debugMode
 									? $debugState.running && !$debugState.stopped
 									: testIsLoading}

frontend/src/lib/components/scriptEditor/LogPanel.svelte

@@ -49,6 +49,7 @@
 		capturesTab?: import('svelte').Snippet
 		customResultPanel?: import('svelte').Snippet
 		showCustomResultPanel?: boolean
+		onTabChange?: (tab: string) => void
 	}
 
 	let {
@@ -65,7 +66,8 @@
 		children,
 		capturesTab,
 		customResultPanel,
-		showCustomResultPanel = false
+		showCustomResultPanel = false,
+		onTabChange
 	}: Props = $props()
 
 	type DContent = {
@@ -78,6 +80,10 @@
 	let drawerOpen: boolean = $state(false)
 	let drawerContent: DContent | undefined = $state(undefined)
 
+	$effect(() => {
+		onTabChange?.(selectedTab)
+	})
+
 	export function setFocusToLogs() {
 		selectedTab = 'logs'
 	}