windmill-components 1.394.7 → 1.405.0

package/package/components/ScriptBuilder.svelte

@@ -161,8 +161,9 @@ async function editScript(stay, deploymentMsg) {
         }
         script.schema = script.schema ?? emptySchema();
         try {
-            const noMainFunc = await inferArgs(script.language, script.content, script.schema);
-            script.no_main_func = noMainFunc || undefined;
+            const result = await inferArgs(script.language, script.content, script.schema);
+            script.no_main_func = result?.no_main_func || undefined;
+            script.has_preprocessor = result?.has_preprocessor || undefined;
         }
         catch (error) {
             sendUserToast(`Could not parse code, are you sure it is valid?`, true);
@@ -193,6 +194,7 @@ async function editScript(stay, deploymentMsg) {
                 concurrency_key: emptyString(script.concurrency_key) ? undefined : script.concurrency_key,
                 visible_to_runner_only: script.visible_to_runner_only,
                 no_main_func: script.no_main_func,
+                has_preprocessor: script.has_preprocessor,
                 deployment_message: deploymentMsg || undefined
             }
         });
@@ -278,8 +280,9 @@ async function saveDraft(forceSave = false) {
         }
         script.schema = script.schema ?? emptySchema();
         try {
-            const noMainFunc = await inferArgs(script.language, script.content, script.schema);
-            script.no_main_func = noMainFunc || undefined;
+            const result = await inferArgs(script.language, script.content, script.schema);
+            script.no_main_func = result?.no_main_func || undefined;
+            script.has_preprocessor = result?.has_preprocessor || undefined;
         }
         catch (error) {
             sendUserToast(`Could not parse code, are you sure it is valid?`, true);
@@ -318,7 +321,8 @@ async function saveDraft(forceSave = false) {
                         ? undefined
                         : script.concurrency_key,
                     visible_to_runner_only: script.visible_to_runner_only,
-                    no_main_func: script.no_main_func
+                    no_main_func: script.no_main_func,
+                    has_preprocessor: script.has_preprocessor
                 }
             });
         }
@@ -560,6 +564,9 @@ function langToLanguage(lang) {
 												>
 													<LanguageIcon {lang} />
 													<span class="ml-2 py-2 truncate">{label}</span>
+													{#if lang === 'ansible'}
+														<span class="text-tertiary !text-xs"> BETA </span>
+													{/if}
 												</Button>
 												<svelte:fragment slot="text"
 													>{label} is only available with an enterprise license</svelte:fragment

package/package/components/ScriptEditor.svelte

@@ -9,6 +9,7 @@ import SchemaForm from './SchemaForm.svelte';
 import LogPanel from './scriptEditor/LogPanel.svelte';
 import EditorBar, { EDITOR_BAR_WIDTH_THRESHOLD } from './EditorBar.svelte';
 import TestJobLoader from './TestJobLoader.svelte';
+import JobProgressBar from './jobs/JobProgressBar.svelte';
 import { createEventDispatcher, onDestroy, onMount } from 'svelte';
 import { Button } from './common';
 import SplitPanesWrapper from './splitPanes/SplitPanesWrapper.svelte';
@@ -20,6 +21,9 @@ import Modal from './common/modal/Modal.svelte';
 import DiffEditor from './DiffEditor.svelte';
 import { Clipboard, CornerDownLeft, Github, Play } from 'lucide-svelte';
 import { setLicense } from '../enterpriseUtils';
+import Tabs from './common/tabs/Tabs.svelte';
+import Tab from './common/tabs/Tab.svelte';
+import { slide } from 'svelte/transition';
 // Exported
 export let schema = emptySchema();
 export let code;
@@ -39,6 +43,7 @@ export let noHistory = false;
 export let saveToWorkspace = false;
 export let watchChanges = false;
 export let customUi = {};
+let jobProgressReset;
 let websocketAlive = {
     pyright: false,
     deno: false,
@@ -55,6 +60,7 @@ let testJobLoader;
 // Test args input
 let args = initialArgs;
 let isValid = true;
+let scriptProgress = undefined;
 // Test
 let testIsLoading = false;
 let testJob;
@@ -79,8 +85,11 @@ function onKeyDown(event) {
     }
 }
 function runTest() {
+    // Not defined if JobProgressBar not loaded
+    if (jobProgressReset)
+        jobProgressReset();
     //@ts-ignore
-    testJobLoader.runPreview(path, code, lang, args, tag);
+    testJobLoader.runPreview(path, code, lang, selectedTab === 'preprocessor' ? { _ENTRYPOINT_OVERRIDE: 'preprocessor', ...args } : args, tag);
 }
 async function loadPastTests() {
     pastPreviews = await JobService.listCompletedJobs({
@@ -90,10 +99,13 @@ async function loadPastTests() {
         scriptPathExact: path
     });
 }
+let hasPreprocessor = false;
 export async function inferSchema(code, nlang) {
     let nschema = schema ?? emptySchema();
     try {
-        await inferArgs(nlang ?? lang, code, nschema);
+        const result = await inferArgs(nlang ?? lang, code, nschema, selectedTab === 'preprocessor' ? 'preprocessor' : undefined);
+        hasPreprocessor =
+            (selectedTab === 'preprocessor' ? !result?.no_main_func : result?.has_preprocessor) ?? false;
         validCode = true;
         schema = nschema;
     }
@@ -170,10 +182,15 @@ function collabUrl() {
     url.search = '';
     return `${url}?collab=1` + (edit ? '' : `&path=${path}`);
 }
+let selectedTab = 'main';
+$: showTabs = hasPreprocessor;
+$: !hasPreprocessor && (selectedTab = 'main');
+$: selectedTab && inferSchema(code);
 </script>
 
 <TestJobLoader
 	on:done={loadPastTests}
+	bind:scriptProgress
 	bind:this={testJobLoader}
 	bind:isLoading={testIsLoading}
 	bind:job={testJob}
@@ -290,6 +307,14 @@ function collabUrl() {
 		</Pane>
 		<Pane size={40} minSize={10}>
 			<div class="flex flex-col h-full">
+				{#if showTabs}
+					<div transition:slide={{ duration: 200 }}>
+						<Tabs bind:selected={selectedTab}>
+							<Tab value="main">Main</Tab>
+							<Tab value="preprocessor">Preprocessor</Tab>
+						</Tabs>
+					</div>
+				{/if}
 				<div class="flex justify-center pt-1">
 					{#if testIsLoading}
 						<Button on:click={testJobLoader?.cancelJob} btnClasses="w-full" color="red" size="xs">
@@ -353,7 +378,12 @@ function collabUrl() {
 							{editor}
 							{diffEditor}
 							{args}
-						/>
+						>
+						{#if scriptProgress}
+							<!-- Put to the slot in logpanel -->
+							<JobProgressBar job={testJob} bind:scriptProgress bind:reset={jobProgressReset} compact={true} />
+						{/if}
+						</LogPanel>
 					</Pane>
 				</Splitpanes>
 			</div>

package/package/components/ScriptEditor.svelte.d.ts

@@ -42,7 +42,7 @@ export type ScriptEditorProps = typeof __propDef.props;
 export type ScriptEditorEvents = typeof __propDef.events;
 export type ScriptEditorSlots = typeof __propDef.slots;
 export default class ScriptEditor extends SvelteComponent<ScriptEditorProps, ScriptEditorEvents, ScriptEditorSlots> {
-    get inferSchema(): (code: string, nlang?: "python3" | "deno" | "go" | "bash" | "powershell" | "postgresql" | "mysql" | "bigquery" | "snowflake" | "mssql" | "graphql" | "nativets" | "bun" | "php" | "rust" | undefined) => Promise<void>;
+    get inferSchema(): (code: string, nlang?: "python3" | "deno" | "go" | "bash" | "powershell" | "postgresql" | "mysql" | "bigquery" | "snowflake" | "mssql" | "graphql" | "nativets" | "bun" | "php" | "rust" | "ansible" | undefined) => Promise<void>;
     get setCollaborationMode(): () => Promise<void>;
     get disableCollaboration(): () => void;
 }

package/package/components/Scrollable.svelte

@@ -0,0 +1,47 @@
+<script>import { onMount, onDestroy } from 'svelte';
+import { twMerge } from 'tailwind-merge';
+let isAtBottom = false;
+let isScrollable = false;
+export let scrollableClass = '';
+export let shiftedShadow = false;
+let mutationObserver;
+let el;
+function handleScroll(event) {
+    const scrollableElement = event.target;
+    isAtBottom =
+        scrollableElement.scrollTop + scrollableElement.offsetHeight >=
+            scrollableElement.scrollHeight - 2;
+}
+function checkIfScrollable(el) {
+    return el.scrollHeight > el.clientHeight;
+}
+function observeScrollability(el) {
+    isScrollable = checkIfScrollable(el);
+    mutationObserver = new MutationObserver(() => {
+        isScrollable = checkIfScrollable(el);
+    });
+    mutationObserver?.observe(el, { childList: true, subtree: true, characterData: true });
+}
+export function scrollIntoView(top) {
+    el.scrollTo({ top, behavior: 'smooth' });
+}
+onMount(() => {
+    observeScrollability(el);
+});
+onDestroy(() => {
+    mutationObserver?.disconnect();
+});
+</script>
+
+<div class={twMerge('relative pb-1', scrollableClass)}>
+	<div bind:this={el} on:scroll={handleScroll} class="w-full h-full overflow-y-auto">
+		<slot />
+	</div>
+	{#if !isAtBottom && isScrollable}
+		<div
+			class="pointer-events-none absolute bottom-0 {shiftedShadow
+				? 'left-2'
+				: 'right-0'} h-14 w-full bg-gradient-to-t from-surface to-transparent"
+		/>
+	{/if}
+</div>

package/package/components/Scrollable.svelte.d.ts

@@ -0,0 +1,21 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        scrollableClass?: string | undefined;
+        shiftedShadow?: boolean | undefined;
+        scrollIntoView?: ((top: number) => void) | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type ScrollableProps = typeof __propDef.props;
+export type ScrollableEvents = typeof __propDef.events;
+export type ScrollableSlots = typeof __propDef.slots;
+export default class Scrollable extends SvelteComponent<ScrollableProps, ScrollableEvents, ScrollableSlots> {
+    get scrollIntoView(): (top: number) => void;
+}
+export {};

package/package/components/ShareModal.svelte.d.ts

@@ -1,7 +1,7 @@
 import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
-        openDrawer?: ((newPath: string, kind_l: "script" | "flow" | "resource" | "schedule" | "app" | "variable" | "group_" | "raw_app") => Promise<void>) | undefined;
+        openDrawer?: ((newPath: string, kind_l: "script" | "flow" | "resource" | "schedule" | "app" | "variable" | "group_" | "raw_app" | "http_trigger") => Promise<void>) | undefined;
     };
     events: {
         change: CustomEvent<any>;
@@ -14,6 +14,6 @@ export type ShareModalProps = typeof __propDef.props;
 export type ShareModalEvents = typeof __propDef.events;
 export type ShareModalSlots = typeof __propDef.slots;
 export default class ShareModal extends SvelteComponent<ShareModalProps, ShareModalEvents, ShareModalSlots> {
-    get openDrawer(): (newPath: string, kind_l: "script" | "flow" | "resource" | "schedule" | "app" | "variable" | "group_" | "raw_app") => Promise<void>;
+    get openDrawer(): (newPath: string, kind_l: "script" | "flow" | "resource" | "schedule" | "app" | "variable" | "group_" | "raw_app" | "http_trigger") => Promise<void>;
 }
 export {};

package/package/components/SuperadminSettings.svelte

@@ -19,7 +19,6 @@ import { ExternalLink } from 'lucide-svelte';
 import { settingsKeys } from './instanceSettings';
 import ConfirmationModal from './common/confirmationModal/ConfirmationModal.svelte';
 import ChangeInstanceUsername from './ChangeInstanceUsername.svelte';
-import Tooltip from './Tooltip.svelte';
 import { isCloudHosted } from '../cloud';
 import InstanceNameEditor from './InstanceNameEditor.svelte';
 let drawer;
@@ -89,7 +88,7 @@ async function updateName(name, email) {
 />
 
 <Drawer bind:this={drawer} on:open={listUsers} size="1200px" on:close={removeHash}>
-	<DrawerContent overflow_y={true} title="Instance Settings" on:close={closeDrawer}>
+	<DrawerContent overflow_y={true} title="Instance settings" on:close={closeDrawer}>
 		<div class="flex flex-col h-full w-full">
 			<div>
 				<div class="flex justify-between">
@@ -112,7 +111,7 @@ async function updateName(name, email) {
 			</div>
 			<div class="pt-4 h-full">
 				<Tabs bind:selected={tab}>
-					<Tab value="users">Global Users</Tab>
+					<Tab value="users">Global users</Tab>
 					{#each settingsKeys as category}
 						<Tab value={category}>{category}</Tab>
 					{/each}
@@ -124,11 +123,10 @@ async function updateName(name, email) {
 									<div class="mb-4">
 										<h3 class="mb-2">
 											Automatic username creation
-											<Tooltip>
-												Automatically create a username for new users based on their email, shared
-												across workspaces.
-											</Tooltip>
 										</h3>
+										<div class="mb-2">
+											<span class="text-primary text-sm">Automatically create a username for new users based on their email, shared across workspaces. <a target="_blank" href="https://www.windmill.dev/docs/advanced/instance_settings#automatic-username-creation">Learn more</a></span>
+										</div>
 										<Button
 											btnClasses="w-auto"
 											size="sm"

package/package/components/TestJobLoader.svelte

@@ -10,6 +10,16 @@ export let notfound = false;
 export let jobUpdateLastFetch = undefined;
 export let toastError = false;
 export let lazyLogs = false;
+// Will be set to number if job is not a flow
+// If you want to find out progress of subjobs of a flow, check job.flow_status.progress
+export let scriptProgress = undefined;
+/// Last time asked for job progress
+let lastTimeCheckedProgress = undefined;
+/// Will try to poll progress every 5s and if once progress returned was not undefined, will be ignored
+/// and getProgressRate will be used instead
+const getProgressRetryRate = 5000;
+/// How often loader poll progress
+const getProgressRate = 1000;
 const dispatch = createEventDispatcher();
 $: workspace = workspaceOverride ?? $workspaceStore;
 let syncIteration = 0;
@@ -56,19 +66,20 @@ export async function runScriptByPath(path, args) {
     return abstractRun(() => JobService.runScriptByPath({
         workspace: $workspaceStore,
         path: path ?? '',
-        requestBody: args
+        requestBody: args,
+        skipPreprocessor: true
     }));
 }
 export async function runFlowByPath(path, args) {
     return abstractRun(() => JobService.runFlowByPath({
         workspace: $workspaceStore,
         path: path ?? '',
-        requestBody: args
+        requestBody: args,
+        skipPreprocessor: true
     }));
 }
 export async function getLogs() {
     if (job) {
-        console.log('getLogs');
         const getUpdate = await JobService.getJobUpdates({
             workspace: workspace,
             id: job.id,
@@ -82,6 +93,9 @@ export async function getLogs() {
     }
 }
 export async function runPreview(path, code, lang, args, tag, lock) {
+    // Reset in case we rerun job without reloading
+    scriptProgress = undefined;
+    lastTimeCheckedProgress = undefined;
     return abstractRun(() => JobService.runScriptPreview({
         workspace: $workspaceStore,
         requestBody: {
@@ -135,14 +149,41 @@ async function loadTestJob(id) {
     if (currentId === id) {
         try {
             if (job && `running` in job) {
+                let getProgress = undefined;
+                // We only pull individual job progress this way
+                // Flow's progress we are getting from FlowStatusModule of flow job
+                if (job.job_kind == 'script' || job.job_kind == 'preview') {
+                    // First time, before running job, lastTimeCheckedProgress is always undefined
+                    if (lastTimeCheckedProgress) {
+                        const lastTimeCheckedMs = Date.now() - lastTimeCheckedProgress;
+                        // Ask for progress if the last time we asked is >5s OR the progress was once not undefined
+                        if (lastTimeCheckedMs > getProgressRetryRate ||
+                            (scriptProgress != undefined && lastTimeCheckedMs > getProgressRate)) {
+                            lastTimeCheckedProgress = Date.now();
+                            getProgress = true;
+                        }
+                    }
+                    else {
+                        // Make it think we asked for progress, but in reality we didnt. First 5s we want to wait without putting extra work on db
+                        // 99.99% of the jobs won't have progress be set so we have to do a balance between having low-latency for jobs that use it and job that don't
+                        // we would usually not care to have progress the first 5s and jobs that are less than 5s
+                        lastTimeCheckedProgress = Date.now();
+                    }
+                }
                 const offset = logOffset == 0 ? (job.logs?.length ? job.logs?.length + 1 : 0) : logOffset;
-                console.log('getLogs');
                 let previewJobUpdates = await JobService.getJobUpdates({
                     workspace: workspace,
                     id,
                     running: job.running,
-                    logOffset: offset
+                    logOffset: offset,
+                    getProgress: getProgress
                 });
+                // Clamp number between two values with the following line:
+                const clamp = (num, min, max) => Math.min(Math.max(num, min), max);
+                if (previewJobUpdates.progress) {
+                    // Progress cannot go back and cannot be set to 100
+                    scriptProgress = clamp(previewJobUpdates.progress, scriptProgress ?? 0, 99);
+                }
                 if (previewJobUpdates.new_logs) {
                     if (offset == 0) {
                         job.logs = previewJobUpdates.new_logs ?? '';

package/package/components/TestJobLoader.svelte.d.ts

@@ -10,6 +10,7 @@ declare const __propDef: {
         jobUpdateLastFetch?: Date | undefined;
         toastError?: boolean | undefined;
         lazyLogs?: boolean | undefined;
+        scriptProgress?: number | undefined;
         abstractRun?: ((fn: () => Promise<string>) => Promise<string>) | undefined;
         runScriptByPath?: ((path: string | undefined, args: Record<string, any>) => Promise<string>) | undefined;
         runFlowByPath?: ((path: string | undefined, args: Record<string, any>) => Promise<string>) | undefined;
@@ -51,7 +52,7 @@ export default class TestJobLoader extends SvelteComponent<TestJobLoaderProps, T
     get runScriptByPath(): (path: string | undefined, args: Record<string, any>) => Promise<string>;
     get runFlowByPath(): (path: string | undefined, args: Record<string, any>) => Promise<string>;
     get getLogs(): () => Promise<void>;
-    get runPreview(): (path: string | undefined, code: string, lang: "python3" | "deno" | "go" | "bash" | "powershell" | "postgresql" | "mysql" | "bigquery" | "snowflake" | "mssql" | "graphql" | "nativets" | "bun" | "php" | "rust" | undefined, args: Record<string, any>, tag: string | undefined, lock?: string | undefined) => Promise<string>;
+    get runPreview(): (path: string | undefined, code: string, lang: "python3" | "deno" | "go" | "bash" | "powershell" | "postgresql" | "mysql" | "bigquery" | "snowflake" | "mssql" | "graphql" | "nativets" | "bun" | "php" | "rust" | "ansible" | undefined, args: Record<string, any>, tag: string | undefined, lock?: string | undefined) => Promise<string>;
     get cancelJob(): () => Promise<void>;
     get clearCurrentJob(): () => Promise<void>;
     get watchJob(): (testId: string) => Promise<void>;

package/package/components/ToggleHubWorkspaceQuick.svelte

@@ -0,0 +1,14 @@
+<script>import { WindmillIcon2 } from './icons';
+import ToggleButtonGroup from './common/toggleButton-v2/ToggleButtonGroup.svelte';
+import ToggleButton from './common/toggleButton-v2/ToggleButton.svelte';
+import { Building } from 'lucide-svelte';
+export let selected = 'all';
+</script>
+
+<div class="max-w-min">
+	<ToggleButtonGroup bind:selected>
+		<ToggleButton value="all" label="All" light small />
+		<ToggleButton value="hub" icon={WindmillIcon2} label="Hub" light small />
+		<ToggleButton value="workspace" icon={Building} label="Workspace" light small />
+	</ToggleButtonGroup>
+</div>

package/package/components/ToggleHubWorkspaceQuick.svelte.d.ts

@@ -0,0 +1,16 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        selected?: "workspace" | "all" | "hub" | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type ToggleHubWorkspaceQuickProps = typeof __propDef.props;
+export type ToggleHubWorkspaceQuickEvents = typeof __propDef.events;
+export type ToggleHubWorkspaceQuickSlots = typeof __propDef.slots;
+export default class ToggleHubWorkspaceQuick extends SvelteComponent<ToggleHubWorkspaceQuickProps, ToggleHubWorkspaceQuickEvents, ToggleHubWorkspaceQuickSlots> {
+}
+export {};

package/package/components/WorkspaceGroup.svelte

@@ -84,7 +84,8 @@ const defaultTags = [
     'other',
     'bun',
     'php',
-    'rust'
+    'rust',
+    'ansible'
 ];
 const nativeTags = [
     'nativets',
@@ -436,7 +437,7 @@ let createdTags = [];
 						options={{
 							right: 'Send an alert when the number of alive workers falls below a given threshold'
 						}}
-						checked={nconfig?.min_alive_workers_alert_threshold !== undefined ?? false}
+						checked={nconfig?.min_alive_workers_alert_threshold !== undefined}
 						on:change={(ev) => {
 							if (nconfig !== undefined) {
 								nconfig.min_alive_workers_alert_threshold = ev.detail ? 1 : undefined

package/package/components/apps/components/helpers/DebouncedInput.svelte

@@ -1,4 +1,5 @@
-<script>import { twMerge } from 'tailwind-merge';
+<script>import { onMount } from 'svelte';
+import { twMerge } from 'tailwind-merge';
 export let placeholder = 'Search...';
 // Using 'any' so 'type="number"' can be passed to the input
 // which should return a number
@@ -7,6 +8,7 @@ export let debounceDelay = 100;
 let parentClass = undefined;
 export { parentClass as class };
 let timer;
+let inputElement = null;
 function debounce(event) {
     clearTimeout(timer);
     timer = setTimeout(() => {
@@ -14,9 +16,15 @@ function debounce(event) {
         value = target.value;
     }, debounceDelay);
 }
+onMount(() => {
+    if (inputElement && value !== undefined) {
+        inputElement.value = value;
+    }
+});
 </script>
 
 <input
+	bind:this={inputElement}
 	{placeholder}
 	on:pointerdown|stopPropagation
 	on:keyup={debounce}

package/package/components/apps/components/inputs/AppSelect.svelte

@@ -147,7 +147,7 @@ function handleFilter(e) {
         }
     }
 }
-$: resolvedConfig.defaultValue && handleDefault();
+$: resolvedConfig.defaultValue != undefined && handleDefault();
 function handleDefault() {
     if (resolvedConfig.defaultValue != undefined) {
         const nvalue = resolvedConfig.defaultValue;