windmill-components 1.394.8 → 1.405.5

package/package/components/flows/content/FlowInput.svelte

@@ -10,7 +10,9 @@ import { sendUserToast } from '../../../toast';
 import SavedInputs from '../../SavedInputs.svelte';
 import EditableSchemaForm from '../../EditableSchemaForm.svelte';
 import AddProperty from '../../schema/AddProperty.svelte';
+import FlowInputViewer from '../../FlowInputViewer.svelte';
 export let noEditor;
+export let disabled;
 const { flowStore, flowStateStore, previewArgs, initialPath } = getContext('FlowEditorContext');
 let capturePayload;
 let inputLibraryDrawer;
@@ -32,67 +34,73 @@ const yOffset = 191;
 <CapturePayload bind:this={capturePayload} />
 
 <FlowCard {noEditor} title="Flow Input">
-	<div class="flex flex-row items-center gap-2 px-4 py-2 border-b">
-		<div>Copy input's schema from</div>
-		<Button
-			color="dark"
-			size="xs"
-			on:click={() => {
-				capturePayload.openDrawer()
-			}}
-		>
-			A request
-		</Button>
-		<Button
-			color="dark"
-			size="xs"
-			on:click={() => {
-				jsonPayload.openDrawer()
-			}}
-		>
-			A JSON
-		</Button>
-		<Button
-			color="dark"
-			size="xs"
-			on:click={() => {
-				inputLibraryDrawer.openDrawer()
-			}}
-		>
-			Past Runs/Input library
-		</Button>
-		<Button
-			color="dark"
-			size="xs"
-			disabled={$flowStore.value.modules.length === 0 ||
-				$flowStore.value.modules[0].value.type == 'identity'}
-			on:click={() => copyFirstStepSchema($flowStateStore, flowStore)}
-		>
-			First step's inputs
-		</Button>
-	</div>
-	<div class="p-4 border-b">
-		<AddProperty
+	{#if !disabled}
+		<div class="flex flex-row items-center gap-2 px-4 py-2 border-b">
+			<div>Copy input's schema from</div>
+			<Button
+				color="dark"
+				size="xs"
+				on:click={() => {
+					capturePayload.openDrawer()
+				}}
+			>
+				A request
+			</Button>
+			<Button
+				color="dark"
+				size="xs"
+				on:click={() => {
+					jsonPayload.openDrawer()
+				}}
+			>
+				A JSON
+			</Button>
+			<Button
+				color="dark"
+				size="xs"
+				on:click={() => {
+					inputLibraryDrawer.openDrawer()
+				}}
+			>
+				Past Runs/Input library
+			</Button>
+			<Button
+				color="dark"
+				size="xs"
+				disabled={$flowStore.value.modules.length === 0 ||
+					$flowStore.value.modules[0].value.type == 'identity'}
+				on:click={() => copyFirstStepSchema($flowStateStore, flowStore)}
+			>
+				First step's inputs
+			</Button>
+		</div>
+		<div class="p-4 border-b">
+			<AddProperty
+				bind:schema={$flowStore.schema}
+				bind:this={addProperty}
+				on:change={() => {
+					$flowStore = $flowStore
+				}}
+			/>
+		</div>
+
+		<EditableSchemaForm
 			bind:schema={$flowStore.schema}
-			bind:this={addProperty}
-			on:change={() => {
-				$flowStore = $flowStore
+			isFlowInput
+			on:edit={(e) => {
+				addProperty?.openDrawer(e.detail)
 			}}
+			on:delete={(e) => {
+				addProperty?.handleDeleteArgument([e.detail])
+			}}
+			offset={yOffset}
+			displayWebhookWarning
 		/>
-	</div>
-
-	<EditableSchemaForm
-		bind:schema={$flowStore.schema}
-		isFlowInput
-		on:edit={(e) => {
-			addProperty?.openDrawer(e.detail)
-		}}
-		on:delete={(e) => {
-			addProperty?.handleDeleteArgument([e.detail])
-		}}
-		offset={yOffset}
-		displayWebhookWarning
-	/>
+	{:else}
+		<div class="p-4 border-b">
+			<FlowInputViewer schema={$flowStore.schema} />
+		</div>
+	{/if}
 </FlowCard>
 
 <Drawer bind:this={jsonPayload} size="800px">

package/package/components/flows/content/FlowInput.svelte.d.ts

@@ -2,6 +2,7 @@ import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         noEditor: boolean;
+        disabled: boolean;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/package/components/flows/content/FlowInputs.svelte

@@ -15,6 +15,7 @@ import { defaultScripts } from '../../../stores';
 import { defaultScriptLanguages, processLangs } from '../../../scripts';
 import DefaultScripts from '../../DefaultScripts.svelte';
 export let failureModule;
+export let preprocessorModule;
 export let shouldDisableTriggerScripts = false;
 export let noEditor;
 export let summary = undefined;
@@ -36,12 +37,12 @@ function displayLang(lang, kind) {
         return true;
     }
     if (lang == 'go') {
-        return kind == 'script' || kind == 'trigger' || failureModule;
+        return (kind == 'script' || kind == 'trigger' || failureModule) && !preprocessorModule;
     }
     if (lang == 'bash' || lang == 'nativets') {
-        return kind == 'script';
+        return kind == 'script' && !preprocessorModule;
     }
-    return kind == 'script' && !failureModule;
+    return kind == 'script' && !failureModule && !preprocessorModule;
 }
 let customUi = getContext('customUi');
 </script>
@@ -51,7 +52,7 @@ let customUi = getContext('customUi');
 		<Alert role="info" title="The flow stops here"
 			>This is an identity step with an early stop that has 'true' for expression</Alert
 		>
-	{:else}{#if !failureModule}
+	{:else}{#if !failureModule && !preprocessorModule}
 			<div class="center-center">
 				<div class="max-w-min">
 					<ToggleButtonGroup bind:selected={kind}>
@@ -114,7 +115,7 @@ let customUi = getContext('customUi');
 			</Alert>
 		{/if}
 
-		{#if kind == 'script' && !noEditor}
+		{#if kind == 'script' && !noEditor && !preprocessorModule}
 			<div class="mt-2" />
 			<Alert title="Action Scripts" role="info">
 				An action script is simply a script that is neither a trigger nor an approval script. Those
@@ -212,7 +213,7 @@ let customUi = getContext('customUi');
 							dispatch('new', {
 								language: lang == 'docker' ? 'bash' : lang,
 								kind,
-								subkind: lang == 'docker' ? 'docker' : 'flow',
+								subkind: lang == 'docker' ? 'docker' : preprocessorModule ? 'preprocessor' : 'flow',
 								summary
 							})
 						}}

package/package/components/flows/content/FlowInputs.svelte.d.ts

@@ -2,6 +2,7 @@ import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         failureModule: boolean;
+        preprocessorModule: boolean;
         shouldDisableTriggerScripts?: boolean | undefined;
         noEditor: boolean;
         summary?: string | undefined;

package/package/components/flows/content/FlowInputsFlowQuick.svelte

@@ -0,0 +1,65 @@
+<script>import { Skeleton } from '../../common';
+import SearchItems from '../../SearchItems.svelte';
+import { FlowService } from '../../../gen';
+import { workspaceStore } from '../../../stores';
+import { emptyString } from '../../../utils';
+import BarsStaggered from '../../icons/BarsStaggered.svelte';
+import { createEventDispatcher } from 'svelte';
+// export let failureModule: boolean
+const dispatch = createEventDispatcher();
+let items = undefined;
+let filteredItems = undefined;
+export let filter = '';
+$: $workspaceStore && loadFlows();
+let ownerFilter = undefined;
+$: prefilteredItems = ownerFilter ? items?.filter((x) => x.path.startsWith(ownerFilter)) : items;
+export let owners = [];
+$: owners = Array.from(new Set(filteredItems?.map((x) => x.path.split('/').slice(0, 2).join('/')) ?? [])).sort();
+async function loadFlows() {
+    items = await FlowService.listFlows({ workspace: $workspaceStore });
+}
+</script>
+
+<SearchItems
+	{filter}
+	items={prefilteredItems}
+	bind:filteredItems
+	f={(x) => (emptyString(x.summary) ? x.path : x.summary + ' (' + x.path + ')')}
+/>
+<div class="flex flex-col min-h-0">
+	{#if filteredItems}
+		{#if filter.length > 0 && filteredItems.length == 0}
+			<div class="text-2xs text-tercary font-extralight text-center py-2 px-3 items-center">
+				No items found.
+			</div>
+		{/if}
+		<ul class="overflow-auto">
+			{#each filteredItems as { path, summary, marked }}
+				<li class="flex flex-row w-full">
+					<button
+						class="px-3 py-2 gap-2 flex flex-row w-full hover:bg-surface-hover bg-surface transition-all items-center rounded-md text-left text-2xs text-primary font-normal"
+						on:click={async () => {
+							dispatch('pickFlow', {
+								path,
+								summary
+							})
+						}}
+					>
+						<BarsStaggered size={14} />
+						<span class="grow truncate">
+							{#if marked}
+								{@html marked}
+							{:else}
+								{!summary || summary.length == 0 ? path : summary}
+							{/if}
+						</span>
+					</button>
+				</li>
+			{/each}
+		</ul>
+	{:else}
+		{#each Array(10).fill(0) as _}
+			<Skeleton layout={[0.5, [1.5]]} />
+		{/each}
+	{/if}
+</div>

package/package/components/flows/content/FlowInputsFlowQuick.svelte.d.ts

@@ -0,0 +1,19 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        filter?: string | undefined;
+        owners?: string[] | undefined;
+    };
+    events: {
+        pickFlow: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type FlowInputsFlowQuickProps = typeof __propDef.props;
+export type FlowInputsFlowQuickEvents = typeof __propDef.events;
+export type FlowInputsFlowQuickSlots = typeof __propDef.slots;
+export default class FlowInputsFlowQuick extends SvelteComponent<FlowInputsFlowQuickProps, FlowInputsFlowQuickEvents, FlowInputsFlowQuickSlots> {
+}
+export {};