windmill-components 1.472.1 → 1.472.2

package/package/components/DefaultScripts.svelte.d.ts

@@ -0,0 +1,18 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        placement?: "right" | "left" | undefined;
+        size?: "xs3" | "xs2" | undefined;
+        noText?: boolean | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type DefaultScriptsProps = typeof __propDef.props;
+export type DefaultScriptsEvents = typeof __propDef.events;
+export type DefaultScriptsSlots = typeof __propDef.slots;
+export default class DefaultScripts extends SvelteComponent<DefaultScriptsProps, DefaultScriptsEvents, DefaultScriptsSlots> {
+}
+export {};

package/package/components/DefaultScriptsInner.svelte

@@ -0,0 +1,89 @@
+<script>import { WorkspaceService } from '../gen';
+import { defaultScripts, workspaceStore } from '../stores';
+import { flip } from 'svelte/animate';
+import Toggle from './Toggle.svelte';
+import { defaultScriptLanguages } from '../scripts';
+import Alert from './common/alert/Alert.svelte';
+export let small = false;
+$: langs = computeLangs($defaultScripts);
+function computeLangs(defaultScripts) {
+    const allLangs = Object.keys(defaultScriptLanguages);
+    if (!defaultScripts || defaultScripts.order == undefined)
+        return allLangs;
+    return defaultScripts.order
+        ?.concat(allLangs.filter((l) => !defaultScripts.order?.includes(l)))
+        .filter((x) => x != 'nativets');
+}
+async function changePosition(i, up) {
+    let norder = langs;
+    if (up) {
+        ;
+        [norder[i], norder[i - 1]] = [norder[i - 1], norder[i]];
+    }
+    else {
+        ;
+        [norder[i], norder[i + 1]] = [norder[i + 1], norder[i]];
+    }
+    defaultScripts.update((s) => ({ ...s, order: norder }));
+    await WorkspaceService.editDefaultScripts({
+        workspace: $workspaceStore,
+        requestBody: $defaultScripts
+    });
+}
+</script>
+
+<Alert title="Global to workspace" type="info" class="mb-4" size={small ? 'xs' : 'sm'}>
+	This setting is only available to admins and will affect all users in the workspace.
+</Alert>
+<div class="h-full w-full flex-col {small ? 'gap-0' : 'gap-2'} flex">
+	{#each langs as lang, i (lang)}
+		<div
+			animate:flip={{ duration: 300 }}
+			class="w-full p-2 rounded {small
+				? ''
+				: 'border border-secondary'} grid grid-cols-3 items-center"
+			><h3 class={small ? 'text-xs font-medium justify-center' : ''}>{lang}</h3>
+			<div>
+				{#if i > 0}
+					<button
+						on:click={() => changePosition(i ?? 0, true)}
+						class={small ? 'mr-2 text-secondary text-sm' : 'text-lg mr-2'}
+						title="Move up"
+					>
+						&uparrow;</button
+					>
+				{/if}
+				{#if i < langs.length - 1}
+					<button
+						on:click={() => changePosition(i ?? 0, false)}
+						class={small ? 'mr-2 text-secondary text-sm' : 'text-lg mr-2'}
+						title="Move down">&downarrow;</button
+					>
+				{/if}</div
+			>
+			<!-- <Toggle options={{ right: 'custom default' }} size="xs" /> -->
+			<div class="flex justify-end">
+				<Toggle
+					options={{ right: 'hide' }}
+					size="xs"
+					color="red"
+					checked={$defaultScripts?.hidden?.includes(lang)}
+					on:change={(e) => {
+						let toggled = e.detail
+						if (toggled) {
+							defaultScripts.update((s) => ({
+								...(s ?? {}),
+								hidden: [...(s?.hidden ?? []), lang]
+							}))
+						} else {
+							defaultScripts.update((s) => ({
+								...(s ?? {}),
+								hidden: (s?.hidden ?? []).filter((h) => h != lang)
+							}))
+						}
+					}}
+				/>
+			</div>
+		</div>
+	{/each}
+</div>

package/package/components/DefaultScriptsInner.svelte.d.ts

@@ -0,0 +1,16 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        small?: boolean | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type DefaultScriptsInnerProps = typeof __propDef.props;
+export type DefaultScriptsInnerEvents = typeof __propDef.events;
+export type DefaultScriptsInnerSlots = typeof __propDef.slots;
+export default class DefaultScriptsInner extends SvelteComponent<DefaultScriptsInnerProps, DefaultScriptsInnerEvents, DefaultScriptsInnerSlots> {
+}
+export {};

package/package/components/DefaultTags.svelte

@@ -0,0 +1,25 @@
+<script>import { Button } from './common';
+import { Pen } from 'lucide-svelte';
+import Tooltip from './Tooltip.svelte';
+import Popover from './meltComponents/Popover.svelte';
+import DefaultTagsInner from './DefaultTagsInner.svelte';
+export let defaultTagPerWorkspace = undefined;
+export let defaultTagWorkspaces = undefined;
+let placement = 'bottom-end';
+</script>
+
+<Popover floatingConfig={{ strategy: 'absolute', placement: placement }} contentClasses="p-4">
+	<svelte:fragment slot="trigger">
+		<Button color="dark" size="xs" nonCaptureEvent={true}>
+			<div class="flex flex-row gap-1 items-center"
+				><Pen size={14} /> Default tags&nbsp;<Tooltip light
+					>Scripts and steps that have not been specifically assigned tags will use a default tag
+					that can be customized here</Tooltip
+				></div
+			>
+		</Button>
+	</svelte:fragment>
+	<svelte:fragment slot="content">
+		<DefaultTagsInner bind:defaultTagPerWorkspace bind:defaultTagWorkspaces />
+	</svelte:fragment>
+</Popover>

package/package/components/DefaultTags.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        defaultTagPerWorkspace?: boolean | undefined;
+        defaultTagWorkspaces?: string[] | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type DefaultTagsProps = typeof __propDef.props;
+export type DefaultTagsEvents = typeof __propDef.events;
+export type DefaultTagsSlots = typeof __propDef.slots;
+export default class DefaultTags extends SvelteComponent<DefaultTagsProps, DefaultTagsEvents, DefaultTagsSlots> {
+}
+export {};

package/package/components/DefaultTagsInner.svelte

@@ -0,0 +1,107 @@
+<script>import { Button } from './common';
+import { AlertTriangle, Loader2 } from 'lucide-svelte';
+import { SettingService, WorkerService, WorkspaceService } from '../gen';
+import Tooltip from './Tooltip.svelte';
+import { sendUserToast } from '../toast';
+import { enterpriseLicense, superadmin } from '../stores';
+import { DEFAULT_TAGS_PER_WORKSPACE_SETTING, DEFAULT_TAGS_WORKSPACES_SETTING } from '../consts';
+import Toggle from './Toggle.svelte';
+import MultiSelectWrapper from './multiselect/MultiSelectWrapper.svelte';
+let defaultTags = undefined;
+export let defaultTagPerWorkspace = undefined;
+export let defaultTagWorkspaces = undefined;
+let limitToWorkspaces = false;
+let workspaces = [];
+async function loadWorkspaces() {
+    workspaces = (await WorkspaceService.listWorkspacesAsSuperAdmin()).map((m) => m.id);
+}
+async function loadDefaultTags() {
+    try {
+        defaultTags = (await WorkerService.geDefaultTags()) ?? [];
+        defaultTagWorkspaces =
+            (await SettingService.getGlobal({
+                key: DEFAULT_TAGS_WORKSPACES_SETTING
+            })) ?? [];
+        limitToWorkspaces = defaultTagWorkspaces ? defaultTagWorkspaces.length > 0 : false;
+    }
+    catch (err) {
+        sendUserToast(`Could not load default tags: ${err}`, true);
+    }
+}
+loadDefaultTags();
+loadWorkspaces();
+</script>
+
+<div class="flex flex-col w-80 p-2 gap-2">
+	{#if !$enterpriseLicense}
+		<div class="flex text-xs items-center gap-1 text-yellow-500 whitespace-nowrap justify-end">
+			<AlertTriangle size={16} />
+			EE only <Tooltip>Enterprise Edition only feature</Tooltip>
+		</div>
+	{/if}
+	{#if defaultTagPerWorkspace == undefined || defaultTags == undefined}
+		<Loader2 class="animate-spin" />
+	{:else}
+		<div class="flex flex-col gap-y-1">
+			{#each defaultTags.sort() as tag (tag)}
+				<div class="flex gap-2 items-center"
+					><div class="p-1 text-xs px-2 rounded border text-primary w-32">{tag} </div><div
+						class="flex gap-2 items-center w-92"
+						>&rightarrow;
+						<input
+							class="text-xs w-full"
+							disabled
+							type="text"
+							value={defaultTagPerWorkspace ? `${tag}-$workspace` : tag}
+						/></div
+					>
+				</div>
+			{/each}
+		</div>
+		<div class="py-4 flex flex-col gap-2">
+			<Toggle
+				bind:checked={defaultTagPerWorkspace}
+				options={{ right: 'workspace specific default tags' }}
+			/>
+			{#if defaultTagPerWorkspace}
+				<Toggle bind:checked={limitToWorkspaces} options={{ right: 'only for some workspaces' }} />
+				{#if limitToWorkspaces}
+					<MultiSelectWrapper items={workspaces} bind:value={defaultTagWorkspaces} />
+				{/if}
+			{/if}
+		</div>
+		<Button
+			variant="contained"
+			color="blue"
+			size="sm"
+			on:click={async () => {
+				await SettingService.setGlobal({
+					key: DEFAULT_TAGS_PER_WORKSPACE_SETTING,
+					requestBody: {
+						value: defaultTagPerWorkspace
+					}
+				})
+				await SettingService.setGlobal({
+					key: DEFAULT_TAGS_WORKSPACES_SETTING,
+					requestBody: {
+						value:
+							limitToWorkspaces && defaultTagWorkspaces && defaultTagWorkspaces.length > 0
+								? defaultTagWorkspaces
+								: undefined
+					}
+				})
+				loadDefaultTags()
+				sendUserToast('Saved')
+			}}
+			disabled={!$enterpriseLicense || !$superadmin}
+		>
+			Save {#if !$superadmin} <span class="text-2xs text-tertiary">superadmin only</span> {/if}
+		</Button>
+
+		<span class="text-2xs text-tertiary"
+			>When tags use <pre class="inline">$workspace</pre>, the final tag has
+			<pre class="inline">$workspace</pre> replaced with the workspace id, allowing multi-vpc setup with
+			more ease, without having to assign a specific tag each time.</span
+		>
+	{/if}
+</div>

package/package/components/DefaultTagsInner.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        defaultTagPerWorkspace?: boolean | undefined;
+        defaultTagWorkspaces?: string[] | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type DefaultTagsInnerProps = typeof __propDef.props;
+export type DefaultTagsInnerEvents = typeof __propDef.events;
+export type DefaultTagsInnerSlots = typeof __propDef.slots;
+export default class DefaultTagsInner extends SvelteComponent<DefaultTagsInnerProps, DefaultTagsInnerEvents, DefaultTagsInnerSlots> {
+}
+export {};

package/package/components/DeployToSetting.svelte

@@ -0,0 +1,190 @@
+<script>import { WorkspaceService } from '../gen';
+import { enterpriseLicense, usersWorkspaceStore, workspaceStore } from '../stores';
+import { sendUserToast } from '../toast';
+import { fade } from 'svelte/transition';
+import Tooltip from './Tooltip.svelte';
+import { Plus, X } from 'lucide-svelte';
+import { Button } from './common';
+import Toggle from './Toggle.svelte';
+import { emptyString } from '../utils';
+$: deployableWorkspaces = $usersWorkspaceStore?.workspaces
+    .map((w) => w.id)
+    .filter((w) => w != $workspaceStore);
+const all_ok = {
+    scripts: true,
+    flows: true,
+    apps: true,
+    resources: true,
+    variables: true,
+    secrets: true
+};
+export let workspaceToDeployTo;
+export let deployUiSettings = {
+    include_path: [],
+    include_type: all_ok
+};
+function deployUITypeMapToArray(typesMap, expectedValue) {
+    let result = [];
+    if (typesMap.scripts == expectedValue) {
+        result.push('script');
+    }
+    if (typesMap.flows == expectedValue) {
+        result.push('flow');
+    }
+    if (typesMap.apps == expectedValue) {
+        result.push('app');
+    }
+    if (typesMap.resources == expectedValue) {
+        result.push('resource');
+    }
+    if (typesMap.variables == expectedValue) {
+        result.push('variable');
+    }
+    if (typesMap.secrets == expectedValue) {
+        result.push('secret');
+    }
+    return result;
+}
+async function editWindmillDeploymentUISettings() {
+    let include_path = deployUiSettings.include_path.filter((elmt) => !emptyString(elmt));
+    let include_type = deployUITypeMapToArray(deployUiSettings.include_type, true);
+    await WorkspaceService.editWorkspaceDeployUiSettings({
+        workspace: $workspaceStore,
+        requestBody: {
+            deploy_ui_settings: {
+                include_path: include_path,
+                include_type: include_type
+            }
+        }
+    });
+    sendUserToast('Workspace Deployment UI settings updated');
+}
+</script>
+
+<h3 class="mt-8">Workspace to link to</h3>
+<div class="flex min-w-0 mt-2">
+	<select
+		bind:value={workspaceToDeployTo}
+		on:change={async (e) => {
+			await WorkspaceService.editDeployTo({
+				workspace: $workspaceStore ?? '',
+				requestBody: { deploy_to: workspaceToDeployTo == '' ? undefined : workspaceToDeployTo }
+			})
+			if (workspaceToDeployTo == '') {
+				workspaceToDeployTo = undefined
+				sendUserToast('Disabled setting deployable workspace')
+			} else {
+				sendUserToast('Set deployable workspace to ' + workspaceToDeployTo)
+			}
+		}}
+	>
+		{#if deployableWorkspaces?.length == 0}
+			<option disabled>No workspace deployable to</option>
+		{/if}
+		<option value="">Disable deployment</option>
+		{#each deployableWorkspaces ?? [] as name}
+			<option value={name}>{name}</option>
+		{/each}
+	</select>
+</div>
+<h3 class="mt-6 mb-3">Deployable items</h3>
+<div class="flex flex-wrap gap-20">
+	<div class="max-w-md w-full">
+		{#if Array.isArray(deployUiSettings?.include_path)}
+			<h4 class="flex gap-2 mb-4"
+				>Filter on path<Tooltip>
+					Only scripts, flows and apps with their path matching one of those filters will be allowed
+					to be deployed in the deploy UI. The filters allow '*'' and '**' characters, with '*''
+					matching any character allowed in paths until the next slash (/) and '**' matching
+					anything including slashes.
+				</Tooltip></h4
+			>
+			{#each deployUiSettings.include_path ?? [] as regexpPath, idx}
+				<div class="flex mt-1 items-center">
+					<input type="text" bind:value={regexpPath} id="arg-input-array" />
+					<button
+						transition:fade|local={{ duration: 100 }}
+						class="rounded-full p-1 bg-surface-secondary duration-200 hover:bg-surface-hover ml-2"
+						aria-label="Clear"
+						on:click={() => {
+							deployUiSettings.include_path.splice(idx, 1)
+							deployUiSettings.include_path = [...deployUiSettings.include_path]
+						}}
+					>
+						<X size={14} />
+					</button>
+				</div>
+			{/each}
+		{/if}
+		<div class="flex mt-2">
+			<Button
+				variant="border"
+				color="light"
+				size="xs"
+				btnClasses="mt-1"
+				on:click={() => {
+					deployUiSettings.include_path = [...deployUiSettings.include_path, '']
+				}}
+				id="deploy-ui-add-path-filter"
+				startIcon={{ icon: Plus }}
+			>
+				Add filter
+			</Button>
+		</div>
+	</div>
+
+	<div class="max-w-md w-full">
+		<h4 class="flex gap-2 mb-4"
+			>Filter on type<Tooltip>
+				You can filter which types of item can be deployed to the production workspace. By default
+				everything is deployable.
+			</Tooltip></h4
+		>
+		<div class="flex flex-col gap-2 mt-1">
+			<Toggle
+				bind:checked={deployUiSettings.include_type.scripts}
+				options={{ right: 'Scripts' }}
+			/>
+			<Toggle
+				bind:checked={deployUiSettings.include_type.flows}
+				options={{ right: 'Flows' }}
+			/>
+			<Toggle
+				bind:checked={deployUiSettings.include_type.apps}
+				options={{ right: 'Apps' }}
+			/>
+			<Toggle
+				bind:checked={deployUiSettings.include_type.resources}
+				options={{ right: 'Resources' }}
+			/>
+			<div class="flex gap-3">
+				<Toggle
+					bind:checked={deployUiSettings.include_type.variables}
+					on:change={(ev) => {
+						if (!ev.detail) {
+							deployUiSettings.include_type.secrets = false
+						}
+					}}
+					options={{ right: 'Variables ' }}
+				/>
+				<span>-</span>
+				<Toggle
+					disabled={!deployUiSettings.include_type.variables}
+					bind:checked={deployUiSettings.include_type.secrets}
+					options={{ left: 'Include secrets' }}
+				/>
+			</div>
+		</div>
+	</div>
+</div>
+{#if $enterpriseLicense}
+	<div class="flex mt-5 mb-5 gap-1">
+		<Button
+			color="blue"
+			disabled={workspaceToDeployTo == undefined}
+			on:click={() => {
+				editWindmillDeploymentUISettings()
+			}}>Save Deployment UI settings</Button
+		>
+	</div>
+{/if}

package/package/components/DeployToSetting.svelte.d.ts

@@ -0,0 +1,27 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        workspaceToDeployTo: string | undefined;
+        deployUiSettings?: {
+            include_path: string[];
+            include_type: {
+                scripts: boolean;
+                flows: boolean;
+                apps: boolean;
+                resources: boolean;
+                variables: boolean;
+                secrets: boolean;
+            };
+        } | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type DeployToSettingProps = typeof __propDef.props;
+export type DeployToSettingEvents = typeof __propDef.events;
+export type DeployToSettingSlots = typeof __propDef.slots;
+export default class DeployToSetting extends SvelteComponent<DeployToSettingProps, DeployToSettingEvents, DeployToSettingSlots> {
+}
+export {};