windmill-components 1.433.0 → 1.444.0

package/package/components/TemplateEditor.svelte

@@ -387,10 +387,11 @@ async function loadMonaco() {
         ...editorConfig(code, lang, automaticLayout, fixedOverflowWidgets),
         model,
         // overflowWidgetsDomNode: widgets,
-        lineNumbers: 'off',
+        // lineNumbers: 'on',
+        lineDecorationsWidth: 6,
+        lineNumbersMinChars: 2,
         fontSize,
-        suggestOnTriggerCharacters: true,
-        lineDecorationsWidth: 14
+        suggestOnTriggerCharacters: true
     });
     editor.onDidFocusEditorText(() => {
         dispatch('focus');

package/package/components/TestConnection.svelte

@@ -29,6 +29,11 @@ const scripts = {
         lang: 'snowflake',
         argName: 'database'
     },
+    snowflake_oauth: {
+        code: `select 1`,
+        lang: 'snowflake',
+        argName: 'database'
+    },
     ms_sql_server: {
         code: `SELECT 1`,
         lang: 'mssql',

package/package/components/TestJobLoader.svelte

@@ -3,6 +3,7 @@ import { workspaceStore } from '../stores';
 import { onDestroy, tick } from 'svelte';
 import { createEventDispatcher } from 'svelte';
 import { sendUserToast } from '../toast';
+import { isScriptPreview } from '../utils';
 export let isLoading = false;
 export let job = undefined;
 export let workspaceOverride = undefined;
@@ -152,7 +153,7 @@ async function loadTestJob(id) {
                 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') {
+                if (job.job_kind == 'script' || isScriptPreview(job.job_kind)) {
                     // First time, before running job, lastTimeCheckedProgress is always undefined
                     if (lastTimeCheckedProgress) {
                         const lastTimeCheckedMs = Date.now() - lastTimeCheckedProgress;

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

@@ -52,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" | "ansible" | 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" | "csharp" | 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/Toggle.svelte

@@ -20,7 +20,7 @@ export let textDisabled = false;
 
 <label
 	for={id}
-	class="{$$props.class || ''} z-auto inline-flex items-center duration-50 {disabled
+	class="{$$props.class || ''} z-auto flex flex-row items-center duration-50 {disabled
 		? 'grayscale opacity-50'
 		: 'cursor-pointer'}"
 >
@@ -93,9 +93,7 @@ export let textDisabled = false;
 	<slot name="right" />
 </label>
 {#if eeOnly && disabled}
-	<span
-		class="inline-flex text-xs text-primary items-center gap-1 !text-yellow-500 whitespace-nowrap ml-8"
-	>
+	<span class="inline-flex text-xs items-center gap-1 !text-yellow-500 whitespace-nowrap ml-8">
 		<AlertTriangle size={16} />
 		EE only <Tooltip>Enterprise Edition only feature</Tooltip>
 	</span>

package/package/components/UserSettings.svelte

@@ -284,7 +284,7 @@ loadSettings();
 								</select>
 							</div>
 							<div class="flex items-end">
-								<Button btnClasses="!mt-2" on:click={createToken}>New Token</Button>
+								<Button btnClasses="!mt-2" on:click={createToken}>New token</Button>
 							</div>
 						</div>
 					</div>

package/package/components/WorkerGroup.svelte

@@ -86,7 +86,8 @@ const defaultTags = [
     'bun',
     'php',
     'rust',
-    'ansible'
+    'ansible',
+    'csharp'
 ];
 const nativeTags = [
     'nativets',
@@ -550,7 +551,7 @@ let createdTags = [];
 								dirty = true
 							}}
 						>
-							Add Additional Python Path
+							Add additional Python path
 						</Button>
 					</div>
 				{/if}
@@ -682,7 +683,7 @@ let createdTags = [];
 								dirty = true
 							}}
 						>
-							Add Environment Variable
+							Add environment variable
 						</Button>
 					</div>
 				{/if}
@@ -780,7 +781,6 @@ let createdTags = [];
 						scriptLang={'bash'}
 						useWebsockets={false}
 						fixedOverflowWidgets={false}
-						listenEmptyChanges
 						code={config?.init_bash ?? ''}
 						on:change={(e) => {
 							if (config) {

package/package/components/WorkerTagPicker.svelte

@@ -6,6 +6,7 @@ import { WorkerService } from '../gen';
 import WorkerTagSelect from './WorkerTagSelect.svelte';
 export let tag;
 export let popupPlacement = 'bottom-end';
+export let disabled = false;
 loadWorkerGroups();
 async function loadWorkerGroups() {
     if (!$workerTags) {
@@ -18,7 +19,7 @@ async function loadWorkerGroups() {
 	<div class="max-w-sm grow">
 		{#if $workerTags}
 			{#if $workerTags?.length ?? 0 > 0}
-				<WorkerTagSelect noLabel bind:tag />
+				<WorkerTagSelect noLabel bind:tag {disabled} />
 			{:else}
 				<div class="text-sm text-secondary flex flex-row gap-2">
 					No custom worker group tag defined on this instance in "Workers {'->'} Custom tags"
@@ -47,6 +48,7 @@ async function loadWorkerGroups() {
 			loadWorkerGroups()
 		}}
 		startIcon={{ icon: RotateCw }}
+		{disabled}
 	/>
-	<AssignableTags placement={popupPlacement} color="nord" />
+	<AssignableTags placement={popupPlacement} color="nord" {disabled} />
 </div>

package/package/components/WorkerTagPicker.svelte.d.ts

@@ -3,6 +3,7 @@ declare const __propDef: {
     props: {
         tag: string | undefined;
         popupPlacement?: "top-end" | "bottom-end" | undefined;
+        disabled?: boolean | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/package/components/WorkerTagSelect.svelte

@@ -3,6 +3,7 @@ import { WorkerService } from '../gen';
 export let tag;
 export let noLabel = false;
 export let nullTag = undefined;
+export let disabled = false;
 loadWorkerGroups();
 async function loadWorkerGroups() {
     if (!$workerTags) {
@@ -24,6 +25,7 @@ async function loadWorkerGroups() {
 				tag = undefined
 			}
 		}}
+		{disabled}
 	>
 		{#if tag}
 			<option value="">reset to default</option>

package/package/components/WorkerTagSelect.svelte.d.ts

@@ -4,6 +4,7 @@ declare const __propDef: {
         tag: string | undefined;
         noLabel?: boolean | undefined;
         nullTag?: string | undefined;
+        disabled?: boolean | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/package/components/apps/components/display/AppDisplayComponent.svelte

@@ -15,7 +15,7 @@ export let customCss = undefined;
 export let render;
 export let configuration;
 const requireHtmlApproval = getContext(IS_APP_PUBLIC_CONTEXT_KEY);
-const { app, worldStore, componentControl, workspace } = getContext('AppViewerContext');
+const { app, worldStore, componentControl, workspace, appPath } = getContext('AppViewerContext');
 let result = undefined;
 const resolvedConfig = initConfig(components['displaycomponent'].initialData.configuration, configuration);
 $componentControl[id] = {
@@ -78,6 +78,7 @@ let css = initCss($app.css?.displaycomponent, customCss);
 				{result}
 				{requireHtmlApproval}
 				disableExpand={resolvedConfig?.hideDetails}
+				appPath={$appPath}
 			/>
 		</div>
 	</div>

package/package/components/apps/components/display/dbtable/utils.js

@@ -85,7 +85,7 @@ ORDER BY
 
 	`;
     }
-    else if (resourceType === 'snowflake') {
+    else if (resourceType === 'snowflake' || resourceType === 'snowflake_oauth') {
         code = `
 		select COLUMN_NAME as field,
 		DATA_TYPE as DataType,
@@ -303,6 +303,30 @@ return schema
         },
         argName: 'database'
     },
+    snowflake_oauth: {
+        code: `select TABLE_SCHEMA, TABLE_NAME, DATA_TYPE, COLUMN_NAME, COLUMN_DEFAULT, IS_NULLABLE from information_schema.columns where table_schema != 'INFORMATION_SCHEMA'`,
+        lang: 'snowflake',
+        processingFn: (rows) => {
+            const schema = {};
+            for (const row of rows) {
+                if (!(row.TABLE_SCHEMA in schema)) {
+                    schema[row.TABLE_SCHEMA] = {};
+                }
+                if (!(row.TABLE_NAME in schema[row.TABLE_SCHEMA])) {
+                    schema[row.TABLE_SCHEMA][row.TABLE_NAME] = {};
+                }
+                schema[row.TABLE_SCHEMA][row.TABLE_NAME][row.COLUMN_NAME] = {
+                    type: row.DATA_TYPE,
+                    required: row.IS_NULLABLE === 'YES'
+                };
+                if (row.COLUMN_DEFAULT !== null) {
+                    schema[row.TABLE_SCHEMA][row.TABLE_NAME][row.COLUMN_NAME]['default'] = row.COLUMN_DEFAULT;
+                }
+            }
+            return schema;
+        },
+        argName: 'database'
+    },
     ms_sql_server: {
         argName: 'database',
         code: `select TABLE_SCHEMA, TABLE_NAME, DATA_TYPE, COLUMN_NAME, COLUMN_DEFAULT from information_schema.columns where table_schema != 'sys'`,
@@ -460,6 +484,7 @@ export function getLanguageByResourceType(name) {
         mysql: 'mysql',
         ms_sql_server: 'mssql',
         snowflake: 'snowflake',
+        snowflake_oauth: 'snowflake',
         bigquery: 'bigquery'
     };
     return language[name];

package/package/components/apps/components/helpers/RunnableComponent.svelte

@@ -285,11 +285,14 @@ async function executeComponent(noToast = false, inlineScriptOverride, setRunnab
                     ? { inlineScript: inlineScriptOverride }
                     : runnable;
                 if (inlineScript) {
+                    if (inlineScript.id !== undefined) {
+                        requestBody['id'] = inlineScript.id;
+                    }
                     requestBody['raw_code'] = {
-                        content: inlineScript.content,
+                        content: inlineScript.id === undefined ? inlineScript.content : '',
                         language: inlineScript.language ?? '',
                         path: inlineScript.path,
-                        lock: inlineScript.lock,
+                        lock: inlineScript.id === undefined ? inlineScript.lock : undefined,
                         cache_ttl: inlineScript.cache_ttl
                     };
                 }
@@ -298,6 +301,9 @@ async function executeComponent(noToast = false, inlineScriptOverride, setRunnab
                 const { path, runType } = runnable;
                 requestBody['path'] = runType !== 'hubscript' ? `${runType}/${path}` : `script/${path}`;
             }
+            if ($app.version !== undefined) {
+                requestBody['version'] = $app.version;
+            }
             const uuid = await AppService.executeComponent({
                 workspace,
                 path: defaultIfEmptyString($appPath, `u/${$userStore?.username ?? 'unknown'}/newapp`),

package/package/components/apps/components/inputs/AppDateInput.svelte

@@ -19,7 +19,13 @@ let resolvedConfig = initConfig(components['dateinputcomponent'].initialData.con
 let value = undefined;
 $componentControl[id] = {
     setValue(nvalue) {
-        value = nvalue;
+        if (typeof nvalue === 'string') {
+            value = nvalue?.split('T')?.[0];
+        }
+        else {
+            console.error('Invalid value', nvalue);
+            value = undefined;
+        }
     }
 };
 let outputs = initOutput($worldStore, id, {

package/package/components/apps/components/inputs/AppS3FileInput.svelte

@@ -51,7 +51,7 @@ let css = initCss($app.css?.fileinputcomponent, customCss);
                                         size="xs2"
                                         variant="border"
                                     >
-                                        Copy Direct Link
+                                        Copy direct link
                                     </Button>
                                 {/if}
                                 */

package/package/components/apps/editor/AppEditor.svelte

@@ -19,7 +19,7 @@ import VariableEditor from '../../VariableEditor.svelte';
 import { VariableService } from '../../../gen';
 import { initHistory } from '../../../history';
 import { Component, Minus, Paintbrush, Plus, Smartphone, Scan, Hand, Grab } from 'lucide-svelte';
-import { findGridItem, findGridItemParentGrid } from './appUtils';
+import { animateTo, findGridItem, findGridItemParentGrid } from './appUtils';
 import ComponentNavigation from './component/ComponentNavigation.svelte';
 import CssSettings from './componentsPanel/CssSettings.svelte';
 import SettingsPanel from './SettingsPanel.svelte';
@@ -29,7 +29,6 @@ import { BG_PREFIX, migrateApp } from '../utils';
 import DarkModeObserver from '../../DarkModeObserver.svelte';
 import { getTheme } from './componentsPanel/themeUtils';
 import StylePanel from './settingsPanel/StylePanel.svelte';
-import RunnableJobPanel from './RunnableJobPanel.svelte';
 import HideButton from './settingsPanel/HideButton.svelte';
 import AppEditorBottomPanel from './AppEditorBottomPanel.svelte';
 import panzoom from 'panzoom';
@@ -71,6 +70,7 @@ let context = {
     email: $userStore?.email,
     groups: $userStore?.groups,
     username: $userStore?.username,
+    name: $userStore?.name,
     query: Object.fromEntries(new URL(window.location.href).searchParams.entries()),
     hash: window.location.hash.substring(1),
     workspace: $workspaceStore,
@@ -282,23 +282,6 @@ function animateCssInput(cssEditorOpen) {
         tmpGridPanelSize = -1;
     }
 }
-function animateTo(start, end, onUpdate) {
-    const duration = 400;
-    const startTime = performance.now();
-    function animate(time) {
-        const elapsed = time - startTime;
-        const progress = Math.min(elapsed / duration, 1);
-        const currentValue = start + (end - start) * easeInOut(progress);
-        onUpdate(currentValue);
-        if (progress < 1) {
-            requestAnimationFrame(animate);
-        }
-    }
-    requestAnimationFrame(animate);
-}
-function easeInOut(t) {
-    return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t;
-}
 $: $cssEditorOpen && selectCss();
 function selectCss() {
     selectedTab !== 'css' && (selectedTab = 'css');
@@ -364,7 +347,7 @@ onMount(() => {
         if ($initialized?.initialized === false) {
             sendUserToast('App is not yet initialized, please check the Troubleshoot Panel for more information', true, [
                 {
-                    label: 'Open Troubleshoot Panel',
+                    label: 'Open troubleshoot panel',
                     callback: () => {
                         appEditorHeader?.openTroubleshootPanel();
                     }
@@ -445,12 +428,10 @@ function showLeftPanel(animate = false) {
     else {
         leftPanelSize = storedLeftPanelSize;
     }
-    storedLeftPanelSize = 0;
 }
 function showRightPanel() {
     rightPanelSize = storedRightPanelSize;
     centerPanelSize = centerPanelSize - storedRightPanelSize;
-    storedRightPanelSize = 0;
 }
 function showBottomPanel(animate = false) {
     if (runnablePanelSize !== 0) {
@@ -464,7 +445,6 @@ function showBottomPanel(animate = false) {
         runnablePanelSize = storedBottomPanelSize;
         gridPanelSize = gridPanelSize - storedBottomPanelSize;
     }
-    storedBottomPanelSize = 0;
 }
 function keydown(event) {
     let classes = event.target?.['className'];
@@ -547,8 +527,6 @@ async function updatePannelInConnecting() {
     }
 }
 $: $connectingInput.opened, updatePannelInConnecting();
-let testJob = undefined;
-let jobToWatch = undefined;
 $: updateCursorStyle(!!$connectingInput.opened && !$panzoomActive);
 function updateCursorStyle(disabled) {
     if (disabled) {
@@ -956,14 +934,7 @@ $: forceDeactivatePanzoom = isModifierKeyPressed && handMode;
 										{rightPanelSize}
 										{centerPanelWidth}
 										{runnablePanelSize}
-									>
-										<RunnableJobPanel
-											float={rightPanelSize !== 0}
-											hidden={runnablePanelSize === 0}
-											bind:testJob
-											bind:jobToWatch
-										/>
-									</AppEditorBottomPanel>
+									/>
 								</Pane>
 							{/if}
 						</Splitpanes>
@@ -1095,7 +1066,7 @@ $: forceDeactivatePanzoom = isModifierKeyPressed && handMode;
 				variableEditor?.initNew?.()
 			}}
 		>
-			New Variable
+			New variable
 		</Button>
 	</div>
 </ItemPicker>

package/package/components/apps/editor/AppEditor.svelte.d.ts

@@ -17,6 +17,7 @@ declare const __propDef: {
             summary: string;
             policy: any;
             draft_only?: boolean | undefined;
+            custom_path?: string | undefined;
         } | undefined;
         version?: number | undefined;
         newApp?: boolean | undefined;

package/package/components/apps/editor/AppEditorBottomPanel.svelte

@@ -1,5 +1,4 @@
-<script>import { twMerge } from 'tailwind-merge';
-import InlineScriptsPanel from './inlineScriptsPanel/InlineScriptsPanel.svelte';
+<script>import InlineScriptsPanel from './inlineScriptsPanel/InlineScriptsPanel.svelte';
 import RunnableJobPanel from './RunnableJobPanel.svelte';
 export let rightPanelSize = 0;
 export let centerPanelWidth = 0;
@@ -8,15 +7,13 @@ export let runnablePanelSize = 0;
 
 {#if rightPanelSize !== 0}
 	<!-- svelte-ignore a11y-no-static-element-interactions -->
-	<div class={twMerge('relative h-full w-full overflow-x-visible')} on:mouseenter on:mouseleave>
+	<div class="relative h-full w-full overflow-x-visible" on:mouseenter on:mouseleave>
 		<InlineScriptsPanel on:hidePanel />
 		<RunnableJobPanel hidden={runnablePanelSize === 0} />
-		<slot />
 	</div>
 {:else}
 	<div class="flex flex-row relative w-full h-full">
-		<InlineScriptsPanel width={centerPanelWidth - 400} on:hidePanel />
-
-		<slot />
+		<InlineScriptsPanel width={centerPanelWidth * 0.66} on:hidePanel />
+		<RunnableJobPanel float={false} hidden={runnablePanelSize === 0} />
 	</div>
 {/if}

package/package/components/apps/editor/AppEditorBottomPanel.svelte.d.ts

@@ -12,9 +12,7 @@ declare const __propDef: {
     } & {
         [evt: string]: CustomEvent<any>;
     };
-    slots: {
-        default: {};
-    };
+    slots: {};
 };
 export type AppEditorBottomPanelProps = typeof __propDef.props;
 export type AppEditorBottomPanelEvents = typeof __propDef.events;