windmill-components 1.408.2 → 1.430.3

package/package/ata/index.js

@@ -72,11 +72,15 @@ export const setupTypeAcquisition = (config) => {
                     ? f.raw
                     : '/' + config.scriptPath + (f.raw.startsWith('../') ? '/../' : '/.') + f.raw;
                 let url = config.root + path;
-                // console.log('FOO', config.scriptPath, path, f.raw)
-                console.log('fetching local file', url, f.raw);
+                let localPath = f.raw;
+                if (f.raw.startsWith('.') && !f.raw.endsWith('.ts')) {
+                    url += '.ts';
+                    localPath += '.ts';
+                }
+                console.log('fetching local file', url, f.raw, localPath);
                 const res = await fetch(url);
                 if (res.ok) {
-                    config.delegate.localFile?.(await res.text(), f.raw);
+                    config.delegate.localFile?.(await res.text(), localPath);
                 }
             });
         }

package/package/components/ApiConnectForm.svelte

@@ -70,8 +70,7 @@ $: resourceType == 'postgresql' && isSupabaseAvailable();
 let connectionString = '';
 let validConnectionString = true;
 function parseConnectionString(close) {
-    // parse postgres connection string
-    const regex = /postgres:\/\/(?<user>[^:@]+)(?::(?<password>[^@]+))?@(?<host>[^:\/?]+)(?::(?<port>\d+))?\/(?<dbname>[^\?]+)?(?:\?.*sslmode=(?<sslmode>[^&]+))?/;
+    const regex = /postgres(?:ql)?:\/\/(?<user>[^:@]+)(?::(?<password>[^@]+))?@(?<host>[^:\/?]+)(?::(?<port>\d+))?\/(?<dbname>[^\?]+)?(?:\?.*sslmode=(?<sslmode>[^&]+))?/;
     const match = connectionString.match(regex);
     if (match) {
         validConnectionString = true;

package/package/components/AppConnectDrawer.svelte

@@ -3,7 +3,7 @@ import { Button, Drawer } from './common';
 import DrawerContent from './common/drawer/DrawerContent.svelte';
 import AppConnectInner from './AppConnectInner.svelte';
 import DarkModeObserver from './DarkModeObserver.svelte';
-let expressOAuthSetup = false;
+export let expressOAuthSetup = false;
 let drawer;
 let resourceType = '';
 let step = 1;
@@ -12,14 +12,13 @@ let isGoogleSignin = false;
 let manual = true;
 let appConnectInner = undefined;
 let rtToLoad = '';
-export async function open(rt, express) {
-    expressOAuthSetup = express ?? false;
+export async function open(rt) {
     rtToLoad = rt;
     drawer.openDrawer?.();
 }
 $: appConnectInner && onRtToLoadChange(rtToLoad);
 function onRtToLoadChange(rtToLoad) {
-    appConnectInner?.open(rtToLoad, expressOAuthSetup);
+    appConnectInner?.open(rtToLoad);
 }
 const dispatch = createEventDispatcher();
 let darkMode = false;
@@ -50,6 +49,7 @@ let darkMode = false;
 			bind:manual
 			on:close={drawer?.closeDrawer}
 			on:refresh
+			express={expressOAuthSetup}
 		/>
 		<div slot="actions" class="flex gap-1">
 			{#if step > 1}

package/package/components/AppConnectDrawer.svelte.d.ts

@@ -1,7 +1,8 @@
 import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
-        open?: ((rt?: string, express?: boolean) => Promise<void>) | undefined;
+        expressOAuthSetup?: boolean | undefined;
+        open?: ((rt?: string) => Promise<void>) | undefined;
     };
     events: {
         refresh: CustomEvent<any>;
@@ -15,6 +16,6 @@ export type AppConnectDrawerProps = typeof __propDef.props;
 export type AppConnectDrawerEvents = typeof __propDef.events;
 export type AppConnectDrawerSlots = typeof __propDef.slots;
 export default class AppConnectDrawer extends SvelteComponent<AppConnectDrawerProps, AppConnectDrawerEvents, AppConnectDrawerSlots> {
-    get open(): (rt?: string | undefined, express?: boolean | undefined) => Promise<void>;
+    get open(): (rt?: string | undefined) => Promise<void>;
 }
 export {};

package/package/components/AppConnectInner.svelte

@@ -23,6 +23,7 @@ export let resourceType = '';
 export let isGoogleSignin = false;
 export let disabled = false;
 export let manual = true;
+export let express = false;
 let isValid = true;
 const nativeLanguagesCategory = [
     'postgresql',
@@ -57,9 +58,7 @@ let path;
 let description = '';
 let resourceTypeInfo = undefined;
 let pathError = '';
-let expressOAuthSetup = false;
-export async function open(rt, express) {
-    expressOAuthSetup = express ?? false;
+export async function open(rt) {
     if (!rt) {
         loadResourceTypes();
     }
@@ -70,12 +69,12 @@ export async function open(rt, express) {
     valueToken = undefined;
     await loadConnects();
     manual = !connects?.includes(resourceType);
-    if (manual && expressOAuthSetup) {
+    if (manual && express) {
         dispatch('error', 'Express OAuth setup is not available for non OAuth resource types');
         return;
     }
     if (rt) {
-        if (!manual && expressOAuthSetup) {
+        if (!manual && express) {
             await getScopesAndParams();
             step = 2;
         }
@@ -135,7 +134,6 @@ export async function loadResourceTypes() {
     catch (e) { }
 }
 function popupListener(event) {
-    console.log('popupListener', event.data, event.origin, window.location.origin);
     let data = event.data;
     if (event.origin == null || event.origin !== window.location.origin) {
         return;
@@ -150,7 +148,7 @@ function popupListener(event) {
         value = data.res.access_token;
         valueToken = data.res;
         step = 4;
-        if (expressOAuthSetup) {
+        if (express) {
             path = `u/${$userStore?.username}/${resourceType}_${new Date().getTime()}`;
             next();
         }
@@ -214,6 +212,12 @@ export async function next() {
         if (exists) {
             throw Error(`Resource at path ${path} already exists. Delete it or pick another path`);
         }
+        if (resourceType == 'snowflake_oauth') {
+            const account_identifier = extra_params.find(([key, _]) => key == 'account_identifier');
+            if (account_identifier) {
+                args['account_identifier'] = account_identifier[1];
+            }
+        }
         let account = undefined;
         if (valueToken?.expires_in != undefined) {
             account = Number(await OauthService.createAccount({
@@ -281,252 +285,254 @@ let filteredConnectsManual = [];
 let editScopes = false;
 </script>
 
-<SearchItems
-	{filter}
-	items={connects
-		? connects
-				.sort((a, b) => a.localeCompare(b))
-				.map((key) => ({
-					key
-				}))
-		: undefined}
-	bind:filteredItems={filteredConnects}
-	f={(x) => x.key}
-/>
-<SearchItems
-	{filter}
-	items={connectsManual?.sort((a, b) => a[0].localeCompare(b[0]))}
-	bind:filteredItems={filteredConnectsManual}
-	f={(x) => x[0]}
-/>
-{#if step == 1}
-	<div class="w-12/12 pb-2 flex flex-row my-1 gap-1">
-		<input
-			type="text"
-			placeholder="Search resource type"
-			bind:value={filter}
-			class="text-2xl grow"
-		/>
-	</div>
-
-	<h2 class="mb-4">OAuth APIs</h2>
-	<div class="grid sm:grid-cols-2 md:grid-cols-3 gap-x-2 gap-y-1 items-center mb-2">
-		{#if filteredConnects}
-			{#each filteredConnects as { key }}
-				<Button
-					size="sm"
-					variant="border"
-					color={key === resourceType ? 'blue' : 'light'}
-					btnClasses={key === resourceType ? '!border-2' : 'm-[1px]'}
-					on:click={() => {
-						manual = false
-						resourceType = key
-						next()
-					}}
-				>
-					<IconedResourceType name={key} after={true} width="20px" height="20px" />
-				</Button>
-			{/each}
-		{:else}
-			{#each new Array(3) as _}
-				<Skeleton layout={[[2]]} />
-			{/each}
-		{/if}
-	</div>
-	{#if connects && connects.length == 0}
-		<div class="text-secondary text-sm w-full"
-			>No OAuth APIs has been setup on the instance. To add oauth APIs, first sync the resource
-			types with the hub, then add oauth configuration. See <a
-				href="https://www.windmill.dev/docs/misc/setup_oauth">documentation</a
-			>
-		</div>
-	{/if}
-
-	<h2 class="mt-8 mb-4">Others</h2>
-
-	{#if connectsManual && connectsManual?.length < 10}
-		<div class="text-secondary p-2">
-			Resource Types have not been synced with the hub. Go to the admins workspace to sync them (and
-			add a schedule to do daily):
-			<p class="mt-4"
-				>1. Go to the "admins" workspaces:
-				<img src="{base}/sync_resource_types.png" alt="sync resource types" class="mt-2" />
-			</p>
-			<p class="mt-4">
-				2: Run the synchronization script:
-				<img src="{base}/sync_resource_types2.png" alt="sync resource types" class="mt-2" />
-			</p>
+{#if !express}
+	<SearchItems
+		{filter}
+		items={connects
+			? connects
+					.sort((a, b) => a.localeCompare(b))
+					.map((key) => ({
+						key
+					}))
+			: undefined}
+		bind:filteredItems={filteredConnects}
+		f={(x) => x.key}
+	/>
+	<SearchItems
+		{filter}
+		items={connectsManual?.sort((a, b) => a[0].localeCompare(b[0]))}
+		bind:filteredItems={filteredConnectsManual}
+		f={(x) => x[0]}
+	/>
+	{#if step == 1}
+		<div class="w-12/12 pb-2 flex flex-row my-1 gap-1">
+			<input
+				type="text"
+				placeholder="Search resource type"
+				bind:value={filter}
+				class="text-2xl grow"
+			/>
 		</div>
-	{/if}
 
-	<div class="grid sm:grid-cols-2 md:grid-cols-3 gap-x-2 gap-y-1 items-center mb-2">
-		{#if filteredConnectsManual}
-			{#each filteredConnectsManual as [key, _]}
-				{#if nativeLanguagesCategory.includes(key)}
+		<h2 class="mb-4">OAuth APIs</h2>
+		<div class="grid sm:grid-cols-2 md:grid-cols-3 gap-x-2 gap-y-1 items-center mb-2">
+			{#if filteredConnects}
+				{#each filteredConnects as { key }}
 					<Button
 						size="sm"
 						variant="border"
 						color={key === resourceType ? 'blue' : 'light'}
 						btnClasses={key === resourceType ? '!border-2' : 'm-[1px]'}
 						on:click={() => {
-							manual = true
+							manual = false
 							resourceType = key
 							next()
 						}}
 					>
 						<IconedResourceType name={key} after={true} width="20px" height="20px" />
 					</Button>
-				{/if}
-			{/each}
+				{/each}
+			{:else}
+				{#each new Array(3) as _}
+					<Skeleton layout={[[2]]} />
+				{/each}
+			{/if}
+		</div>
+		{#if connects && connects.length == 0}
+			<div class="text-secondary text-sm w-full"
+				>No OAuth APIs has been setup on the instance. To add oauth APIs, first sync the resource
+				types with the hub, then add oauth configuration. See <a
+					href="https://www.windmill.dev/docs/misc/setup_oauth">documentation</a
+				>
+			</div>
 		{/if}
-	</div>
 
-	<div class="mt-8 mb-4" />
-	<div class="grid sm:grid-cols-2 md:grid-cols-3 gap-x-2 gap-y-1 items-center mb-2">
-		{#if filteredConnectsManual}
-			{#each filteredConnectsManual as [key, _]}
-				{#if !nativeLanguagesCategory.includes(key)}
-					<!-- Exclude specific items -->
-					<Button
-						size="sm"
-						variant="border"
-						color={key === resourceType ? 'blue' : 'light'}
-						btnClasses={key === resourceType ? '!border-2' : 'm-[1px]'}
-						on:click={() => {
-							manual = true
-							resourceType = key
-							next()
-						}}
-					>
-						<IconedResourceType name={key} after={true} width="20px" height="20px" />
-					</Button>
-				{/if}
-			{/each}
-		{:else}
-			{#each new Array(9) as _}
-				<Skeleton layout={[[2]]} />
-			{/each}
-		{/if}
-	</div>
-{:else if step == 2 && manual}
-	<Path
-		bind:error={pathError}
-		bind:path
-		initialPath=""
-		namePlaceholder={resourceType}
-		kind="resource"
-	/>
+		<h2 class="mt-8 mb-4">Others</h2>
 
-	{#if apiTokenApps[resourceType]}
-		<h2 class="mt-4 mb-2">Instructions</h2>
-		<div class="pl-10">
-			<ol class="list-decimal">
-				{#each apiTokenApps[resourceType].instructions as step}
-					<li>
-						{@html step}
-					</li>
-				{/each}
-			</ol>
-		</div>
-		{#if apiTokenApps[resourceType].img}
-			<div class="mt-4 w-full overflow-hidden">
-				<img class="m-auto max-h-60" alt="connect" src={base + apiTokenApps[resourceType].img} />
+		{#if connectsManual && connectsManual?.length < 10}
+			<div class="text-secondary p-2">
+				Resource Types have not been synced with the hub. Go to the admins workspace to sync them
+				(and add a schedule to do daily):
+				<p class="mt-4"
+					>1. Go to the "admins" workspaces:
+					<img src="{base}/sync_resource_types.png" alt="sync resource types" class="mt-2" />
+				</p>
+				<p class="mt-4">
+					2: Run the synchronization script:
+					<img src="{base}/sync_resource_types2.png" alt="sync resource types" class="mt-2" />
+				</p>
 			</div>
 		{/if}
-	{:else if !emptyString(resourceTypeInfo?.description)}
-		<h4 class="mt-8 mb-2">{resourceTypeInfo?.name} description</h4>
-		<div class="text-sm">
-			<Markdown md={urlize(resourceTypeInfo?.description ?? '', 'md')} />
-		</div>
-	{/if}
-	{#if resourceType == 'postgresql' || resourceType == 'mysql' || resourceType == 'mongodb'}
-		<WhitelistIp />
-	{/if}
 
-	<h4 class="mt-8 inline-flex items-center gap-4"
-		>Resource description <Required required={false} />
-		<div class="flex gap-1 items-center">
-			<Toggle size="xs" bind:checked={renderDescription} />
-			<Pen size={14} />
-		</div>
-	</h4>
-	{#if renderDescription}
-		<div>
-			<div class="flex flex-row-reverse text-2xs text-tertiary -mt-1">GH Markdown</div>
-			<textarea use:autosize bind:value={description} placeholder={'Resource description'} />
+		<div class="grid sm:grid-cols-2 md:grid-cols-3 gap-x-2 gap-y-1 items-center mb-2">
+			{#if filteredConnectsManual}
+				{#each filteredConnectsManual as [key, _]}
+					{#if nativeLanguagesCategory.includes(key)}
+						<Button
+							size="sm"
+							variant="border"
+							color={key === resourceType ? 'blue' : 'light'}
+							btnClasses={key === resourceType ? '!border-2' : 'm-[1px]'}
+							on:click={() => {
+								manual = true
+								resourceType = key
+								next()
+							}}
+						>
+							<IconedResourceType name={key} after={true} width="20px" height="20px" />
+						</Button>
+					{/if}
+				{/each}
+			{/if}
 		</div>
-	{:else if description == undefined || description == ''}
-		<div class="text-sm text-tertiary">No description provided</div>
-	{:else}
-		<div class="mt-2" />
-		<GfmMarkdown md={description} />
-	{/if}
-	<div class="mt-12">
-		{#key resourceTypeInfo}
-			<ApiConnectForm
-				bind:linkedSecret
-				{linkedSecretCandidates}
-				{resourceType}
-				{resourceTypeInfo}
-				bind:args
-				bind:isValid
-			/>
-		{/key}
-	</div>
-{:else if step == 2 && !manual}
-	{#if manual == false && resourceType != ''}
-		<h1 class="mb-4">{resourceType}</h1>
-		<div class="my-4 text-secondary"
-			>Click connect to create a resource backed by an oauth connection, whose token is fetched from
-			the external services and refreshed automatically if needed before expiration (using its
-			refresh token)</div
-		>
-		<h4 class="mb-2">Description</h4>
-		<div class="text-sm mb-8">
-			<Markdown md={urlize(resourceTypeInfo?.description ?? '', 'md')} />
+
+		<div class="mt-8 mb-4" />
+		<div class="grid sm:grid-cols-2 md:grid-cols-3 gap-x-2 gap-y-1 items-center mb-2">
+			{#if filteredConnectsManual}
+				{#each filteredConnectsManual as [key, _]}
+					{#if !nativeLanguagesCategory.includes(key)}
+						<!-- Exclude specific items -->
+						<Button
+							size="sm"
+							variant="border"
+							color={key === resourceType ? 'blue' : 'light'}
+							btnClasses={key === resourceType ? '!border-2' : 'm-[1px]'}
+							on:click={() => {
+								manual = true
+								resourceType = key
+								next()
+							}}
+						>
+							<IconedResourceType name={key} after={true} width="20px" height="20px" />
+						</Button>
+					{/if}
+				{/each}
+			{:else}
+				{#each new Array(9) as _}
+					<Skeleton layout={[[2]]} />
+				{/each}
+			{/if}
 		</div>
-		<h3 class="mb-4 flex gap-4"
-			>Scopes <button
-				on:click={() => {
-					editScopes = !editScopes
-				}}><Pen size={14} /></button
-			></h3
-		>
+	{:else if step == 2 && manual}
+		<Path
+			bind:error={pathError}
+			bind:path
+			initialPath=""
+			namePlaceholder={resourceType}
+			kind="resource"
+		/>
 
-		{#if editScopes}
-			<OauthScopes bind:scopes />
+		{#if apiTokenApps[resourceType]}
+			<h2 class="mt-4 mb-2">Instructions</h2>
+			<div class="pl-10">
+				<ol class="list-decimal">
+					{#each apiTokenApps[resourceType].instructions as step}
+						<li>
+							{@html step}
+						</li>
+					{/each}
+				</ol>
+			</div>
+			{#if apiTokenApps[resourceType].img}
+				<div class="mt-4 w-full overflow-hidden">
+					<img class="m-auto max-h-60" alt="connect" src={base + apiTokenApps[resourceType].img} />
+				</div>
+			{/if}
+		{:else if !emptyString(resourceTypeInfo?.description)}
+			<h4 class="mt-8 mb-2">{resourceTypeInfo?.name} description</h4>
+			<div class="text-sm">
+				<Markdown md={urlize(resourceTypeInfo?.description ?? '', 'md')} />
+			</div>
+		{/if}
+		{#if resourceType == 'postgresql' || resourceType == 'mysql' || resourceType == 'mongodb'}
+			<WhitelistIp />
+		{/if}
+
+		<h4 class="mt-8 inline-flex items-center gap-4"
+			>Resource description <Required required={false} />
+			<div class="flex gap-1 items-center">
+				<Toggle size="xs" bind:checked={renderDescription} />
+				<Pen size={14} />
+			</div>
+		</h4>
+		{#if renderDescription}
+			<div>
+				<div class="flex flex-row-reverse text-2xs text-tertiary -mt-1">GH Markdown</div>
+				<textarea use:autosize bind:value={description} placeholder={'Resource description'} />
+			</div>
+		{:else if description == undefined || description == ''}
+			<div class="text-sm text-tertiary">No description provided</div>
 		{:else}
-			<div class="flex flex-col gap-1">
-				{#each scopes as scope}
-					<div class="py-0.5 pl-2 text-xs">- {scope}</div>
-				{/each}
+			<div class="mt-2" />
+			<GfmMarkdown md={description} />
+		{/if}
+		<div class="mt-12">
+			{#key resourceTypeInfo}
+				<ApiConnectForm
+					bind:linkedSecret
+					{linkedSecretCandidates}
+					{resourceType}
+					{resourceTypeInfo}
+					bind:args
+					bind:isValid
+				/>
+			{/key}
+		</div>
+	{:else if step == 2 && !manual}
+		{#if manual == false && resourceType != ''}
+			<h1 class="mb-4">{resourceType}</h1>
+			<div class="my-4 text-secondary"
+				>Click connect to create a resource backed by an oauth connection, whose token is fetched
+				from the external services and refreshed automatically if needed before expiration (using
+				its refresh token)</div
+			>
+			<h4 class="mb-2">Description</h4>
+			<div class="text-sm mb-8">
+				<Markdown md={urlize(resourceTypeInfo?.description ?? '', 'md')} />
 			</div>
+			<h3 class="mb-4 flex gap-4"
+				>Scopes <button
+					on:click={() => {
+						editScopes = !editScopes
+					}}><Pen size={14} /></button
+				></h3
+			>
+
+			{#if editScopes}
+				<OauthScopes bind:scopes />
+			{:else}
+				<div class="flex flex-col gap-1">
+					{#each scopes as scope}
+						<div class="py-0.5 pl-2 text-xs">- {scope}</div>
+					{/each}
+				</div>
+			{/if}
+		{/if}
+	{:else if step == 3 && !manual && !express}
+		Finish connection in popup window
+	{:else}
+		<Path
+			initialPath=""
+			namePlaceholder={resourceType}
+			bind:error={pathError}
+			bind:path
+			kind="resource"
+		/>
+		{#if apiTokenApps[resourceType] || !manual}
+			<ul class="mt-10">
+				<li>
+					1. A secret variable containing the {apiTokenApps[resourceType]?.linkedSecret ?? 'token'}
+					<span class="font-bold">{truncateRev(value, 5, '*****')}</span>
+					will be stored a
+					<span class="font-mono whitespace-nowrap">{path}</span>.
+				</li>
+				<li class="mt-4">
+					2. The resource containing that token will be stored at the same path <span
+						class="font-mono whitespace-nowrap">{path}</span
+					>. The Variable and Resource will be "linked together", they will be deleted and renamed
+					together.
+				</li></ul
+			>
 		{/if}
-	{/if}
-{:else if step == 3 && !manual}
-	Finish connection in popup window
-{:else}
-	<Path
-		initialPath=""
-		namePlaceholder={resourceType}
-		bind:error={pathError}
-		bind:path
-		kind="resource"
-	/>
-	{#if apiTokenApps[resourceType] || !manual}
-		<ul class="mt-10">
-			<li>
-				1. A secret variable containing the {apiTokenApps[resourceType]?.linkedSecret ?? 'token'}
-				<span class="font-bold">{truncateRev(value, 5, '*****')}</span>
-				will be stored a
-				<span class="font-mono whitespace-nowrap">{path}</span>.
-			</li>
-			<li class="mt-4">
-				2. The resource containing that token will be stored at the same path <span
-					class="font-mono whitespace-nowrap">{path}</span
-				>. The Variable and Resource will be "linked together", they will be deleted and renamed
-				together.
-			</li></ul
-		>
 	{/if}
 {/if}

package/package/components/AppConnectInner.svelte.d.ts

@@ -6,7 +6,8 @@ declare const __propDef: {
         isGoogleSignin?: boolean | undefined;
         disabled?: boolean | undefined;
         manual?: boolean | undefined;
-        open?: ((rt?: string, express?: boolean) => Promise<void>) | undefined;
+        express?: boolean | undefined;
+        open?: ((rt?: string) => Promise<void>) | undefined;
         loadResourceTypes?: (() => Promise<void>) | undefined;
         next?: (() => Promise<void>) | undefined;
         back?: (() => Promise<void>) | undefined;
@@ -20,7 +21,7 @@ export type AppConnectInnerProps = typeof __propDef.props;
 export type AppConnectInnerEvents = typeof __propDef.events;
 export type AppConnectInnerSlots = typeof __propDef.slots;
 export default class AppConnectInner extends SvelteComponent<AppConnectInnerProps, AppConnectInnerEvents, AppConnectInnerSlots> {
-    get open(): (rt?: string | undefined, express?: boolean | undefined) => Promise<void>;
+    get open(): (rt?: string | undefined) => Promise<void>;
     get loadResourceTypes(): () => Promise<void>;
     get next(): () => Promise<void>;
     get back(): () => Promise<void>;