windmill-components 1.677.1 → 1.687.0

package/package/components/Dev.svelte

@@ -17,6 +17,7 @@ import FlowPreviewButtons from './flows/header/FlowPreviewButtons.svelte';
 import FlowModuleSchemaMap from './flows/map/FlowModuleSchemaMap.svelte';
 import FlowEditorPanel from './flows/content/FlowEditorPanel.svelte';
 import { deepEqual } from 'fast-equals';
+import { findModuleInFlow } from './flows/flowDiff';
 import { writable } from 'svelte/store';
 import { initHistory } from '../history.svelte';
 import { SelectionManager } from './graph/selectionUtils.svelte';
@@ -67,6 +68,8 @@ async function loadUser() {
 let darkModeToggle = $state();
 let darkMode = $state(document.documentElement.classList.contains('dark'));
 let modeInitialized = $state(false);
+let paneWidth = $state(0);
+let compactPreview = $derived(paneWidth < 800);
 function initializeMode() {
     modeInitialized = true;
     darkModeToggle?.toggle();
@@ -573,6 +576,9 @@ function resetModulesStates() {
 }
 const flowHasChanged = $derived(flowPreviewContent?.flowHasChanged());
 const selectedId = $derived(selectionManager.getSelectedId());
+const selectedModule = $derived(selectedId && flowStore.val?.value
+    ? findModuleInFlow(flowStore.val.value, selectedId) ?? undefined
+    : undefined);
 </script>
 
 <svelte:window onkeydown={onKeyDown} />
@@ -724,7 +730,7 @@ const selectedId = $derived(selectionManager.getSelectedId());
 	{:else}
 		<!-- <div class="h-full w-full grid grid-cols-2"> -->
 		<div class="h-full w-full">
-			<div class="flex flex-col max-h-screen h-full relative">
+			<div class="flex flex-col max-h-screen h-full relative" bind:clientWidth={paneWidth}>
 				<div class="absolute top-0 left-2">
 					<DarkModeToggle bind:darkMode bind:this={darkModeToggle} forcedDarkMode={false} />
 					{#if $userStore}
@@ -734,7 +740,7 @@ const selectedId = $derived(selectionManager.getSelectedId());
 					{/if}
 				</div>
 
-				<div class="flex justify-center pt-1 z-50 absolute -translate-x-[100%] right-2 top-2 gap-2">
+				<div class="flex justify-center pt-1 z-50 absolute gap-2 {compactPreview ? 'left-1/2 -translate-x-1/2 top-14' : '-translate-x-[100%] right-2 top-2'}">
 					<FlowPreviewButtons
 						{suspendStatus}
 						bind:this={flowPreviewButtons}
@@ -745,7 +751,7 @@ const selectedId = $derived(selectionManager.getSelectedId());
 						}}
 					/>
 				</div>
-				<Splitpanes horizontal class="h-full max-h-screen grow">
+				<Splitpanes horizontal class="max-h-screen grow min-h-0">
 					<Pane size={67}>
 						{#if flowStore.val?.value?.modules}
 							<div id="flow-editor"></div>
@@ -800,6 +806,17 @@ const selectedId = $derived(selectionManager.getSelectedId());
 						{/key}
 					</Pane>
 				</Splitpanes>
+				{#if selectedModule}
+					<div class="flex items-center gap-2 px-3 py-1.5 border-t border-border bg-surface shrink-0">
+						<span class="text-xs text-secondary shrink-0">{selectedModule.id} summary</span>
+						<input
+							type="text"
+							class="text-xs w-full bg-transparent border border-border rounded px-2 py-1 focus:outline-none focus:border-blue-500"
+							placeholder="Summary"
+							bind:value={selectedModule.summary}
+						/>
+					</div>
+				{/if}
 			</div>
 		</div>
 	{/if}

package/package/components/Editor.svelte

@@ -1269,7 +1269,7 @@ export async function fetchPackageDeps(deps) {
 let customTsTypesData = resource([() => lang], async () => {
     if (lang !== 'typescript')
         return undefined;
-    let datatables = await WorkspaceService.listDataTables({ workspace: $workspaceStore ?? '' });
+    let datatables = (await WorkspaceService.listDataTables({ workspace: $workspaceStore ?? '' })).map((d) => d.name);
     let ducklakes = await WorkspaceService.listDucklakes({ workspace: $workspaceStore ?? '' });
     return { datatables, ducklakes };
 });

package/package/components/EditorBar.svelte

@@ -678,7 +678,7 @@ JsonNode ${windmillPathToCamelCaseName(path)} = JsonNode.Parse(await client.GetS
 		itemName="data table"
 		loadItems={async () =>
 			(await WorkspaceService.listDataTables({ workspace: $workspaceStore ?? 'NO_W' })).map(
-				(path) => ({ path })
+				(d) => ({ path: d.name })
 			)}
 	>
 		{#snippet submission()}

package/package/components/EditorBar.svelte.d.ts

@@ -15,7 +15,7 @@ interface Props {
     iconOnly?: boolean;
     validCode?: boolean;
     kind?: 'script' | 'trigger' | 'approval';
-    template?: 'pgsql' | 'mysql' | 'script' | 'docker' | 'powershell' | 'bunnative' | 'claudesandbox' | 'wac_python' | 'wac_typescript';
+    template?: 'pgsql' | 'mysql' | 'script' | 'docker' | 'powershell' | 'bunnative' | 'claudesandbox' | 'wac_python' | 'wac_typescript' | 'ci_test_bun' | 'ci_test_python';
     collabMode?: boolean;
     collabLive?: boolean;
     collabUsers?: {