windmill-components 1.13.27 → 1.22.42
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/AppConnect.svelte +281 -0
- package/components/AppConnect.svelte.d.ts +22 -0
- package/components/ArgInput.svelte +32 -24
- package/components/ArgInput.svelte.d.ts +6 -1
- package/components/Button.svelte +16 -7
- package/components/CenteredModal.svelte +30 -0
- package/components/CenteredModal.svelte.d.ts +19 -0
- package/components/DisplayResult.svelte +52 -46
- package/components/Editor.svelte +69 -64
- package/components/Editor.svelte.d.ts +3 -1
- package/components/EditorBar.svelte +204 -0
- package/components/EditorBar.svelte.d.ts +23 -0
- package/components/FlowBuilder.svelte +57 -110
- package/components/FlowBuilder.svelte.d.ts +0 -2
- package/components/FlowEditor.svelte +183 -65
- package/components/FlowEditor.svelte.d.ts +4 -4
- package/components/FlowJobResult.svelte +23 -0
- package/components/FlowJobResult.svelte.d.ts +17 -0
- package/components/FlowPreview.svelte +17 -28
- package/components/FlowPreview.svelte.d.ts +7 -1
- package/components/FlowStatusViewer.svelte +55 -25
- package/components/FlowStatusViewer.svelte.d.ts +1 -1
- package/components/FlowViewer.svelte +136 -0
- package/components/FlowViewer.svelte.d.ts +24 -0
- package/components/IconedResourceType.svelte +6 -4
- package/components/JobStatus.svelte +1 -1
- package/components/Modal.svelte +5 -3
- package/components/ModuleStep.svelte +129 -56
- package/components/ModuleStep.svelte.d.ts +4 -8
- package/components/ObjectResourceInput.svelte +0 -1
- package/components/Path.svelte +55 -9
- package/components/Path.svelte.d.ts +2 -0
- package/components/RadioButton.svelte +1 -1
- package/components/RadioButtonV2.svelte +33 -0
- package/components/RadioButtonV2.svelte.d.ts +20 -0
- package/components/ResourceEditor.svelte +19 -15
- package/components/ResourcePicker.svelte +2 -2
- package/components/ResourcePicker.svelte.d.ts +2 -2
- package/components/RunForm.svelte +2 -3
- package/components/SchemaForm.svelte +119 -121
- package/components/SchemaForm.svelte.d.ts +6 -4
- package/components/SchemaModal.svelte +1 -1
- package/components/SchemaModal.svelte.d.ts +1 -1
- package/components/SchemaViewer.svelte +1 -1
- package/components/ScriptBuilder.svelte +43 -62
- package/components/ScriptEditor.svelte +12 -189
- package/components/ScriptPicker.svelte +7 -18
- package/components/ScriptPicker.svelte.d.ts +1 -0
- package/components/Switch.svelte.d.ts +2 -2
- package/components/Toggle.svelte +34 -0
- package/components/Toggle.svelte.d.ts +28 -0
- package/components/Tooltip.svelte +53 -80
- package/components/Tooltip.svelte.d.ts +1 -5
- package/components/VariableEditor.svelte +11 -2
- package/components/flows/CopyFirstStepSchema.svelte +10 -0
- package/components/flows/CopyFirstStepSchema.svelte.d.ts +14 -0
- package/components/flows/DynamicInputHelpBox.svelte +72 -0
- package/components/flows/DynamicInputHelpBox.svelte.d.ts +14 -0
- package/components/flows/FlowInputs.svelte +27 -0
- package/components/flows/FlowInputs.svelte.d.ts +19 -0
- package/components/flows/FlowModuleHeader.svelte +92 -0
- package/components/flows/FlowModuleHeader.svelte.d.ts +22 -0
- package/components/flows/flowStore.d.ts +17 -0
- package/components/flows/flowStore.js +161 -0
- package/components/flows/pickers/FlowScriptPicker.svelte +11 -0
- package/components/flows/pickers/FlowScriptPicker.svelte.d.ts +22 -0
- package/components/flows/pickers/PickHubScript.svelte +30 -0
- package/components/flows/pickers/PickHubScript.svelte.d.ts +18 -0
- package/components/flows/pickers/PickScript.svelte +38 -0
- package/components/flows/pickers/PickScript.svelte.d.ts +18 -0
- package/components/flows/utils.d.ts +17 -0
- package/components/flows/utils.js +143 -0
- package/components/propertyPicker/ObjectViewer.svelte +113 -0
- package/components/propertyPicker/ObjectViewer.svelte.d.ts +21 -0
- package/components/propertyPicker/OverlayPropertyPicker.svelte +69 -0
- package/components/propertyPicker/OverlayPropertyPicker.svelte.d.ts +21 -0
- package/components/propertyPicker/PropPicker.svelte +24 -0
- package/components/propertyPicker/PropPicker.svelte.d.ts +18 -0
- package/components/propertyPicker/WarningMessage.svelte +43 -0
- package/components/propertyPicker/WarningMessage.svelte.d.ts +16 -0
- package/components/propertyPicker/utils.d.ts +2 -0
- package/components/propertyPicker/utils.js +40 -0
- package/gen/core/ApiError.d.ts +3 -1
- package/gen/core/ApiError.js +3 -1
- package/gen/core/OpenAPI.js +1 -1
- package/gen/core/request.js +2 -2
- package/gen/index.d.ts +4 -0
- package/gen/index.js +1 -0
- package/gen/models/CompletedJob.d.ts +3 -1
- package/gen/models/CompletedJob.js +1 -0
- package/gen/models/CreateResource.d.ts +1 -0
- package/gen/models/CreateVariable.d.ts +2 -0
- package/gen/models/FlowModule.d.ts +2 -0
- package/gen/models/FlowModuleValue.d.ts +14 -2
- package/gen/models/FlowModuleValue.js +7 -0
- package/gen/models/FlowStatusModule.d.ts +6 -0
- package/gen/models/ListableVariable.d.ts +2 -0
- package/gen/models/OpenFlow.d.ts +7 -0
- package/gen/models/OpenFlow.js +4 -0
- package/gen/models/QueuedJob.d.ts +2 -1
- package/gen/models/QueuedJob.js +1 -0
- package/gen/models/Resource.d.ts +1 -0
- package/gen/models/Script.d.ts +1 -0
- package/gen/models/SlackToken.d.ts +8 -0
- package/gen/models/SlackToken.js +4 -0
- package/gen/models/TokenResponse.d.ts +6 -0
- package/gen/models/TokenResponse.js +4 -0
- package/gen/services/AdminService.d.ts +6 -2
- package/gen/services/AuditService.d.ts +24 -8
- package/gen/services/FlowService.d.ts +50 -10
- package/gen/services/FlowService.js +26 -0
- package/gen/services/GranularAclService.d.ts +6 -2
- package/gen/services/GroupService.d.ts +18 -6
- package/gen/services/JobService.d.ts +167 -46
- package/gen/services/JobService.js +26 -2
- package/gen/services/OauthService.d.ts +104 -0
- package/gen/services/OauthService.js +133 -0
- package/gen/services/ResourceService.d.ts +39 -7
- package/gen/services/ResourceService.js +30 -0
- package/gen/services/ScheduleService.d.ts +36 -6
- package/gen/services/ScheduleService.js +30 -0
- package/gen/services/ScriptService.d.ts +77 -19
- package/gen/services/ScriptService.js +31 -1
- package/gen/services/UserService.d.ts +49 -11
- package/gen/services/UserService.js +17 -0
- package/gen/services/VariableService.d.ts +19 -4
- package/gen/services/VariableService.js +15 -0
- package/gen/services/WorkerService.d.ts +6 -2
- package/gen/services/WorkspaceService.d.ts +29 -24
- package/gen/services/WorkspaceService.js +8 -23
- package/logout.js +10 -3
- package/package.json +52 -23
- package/script_helpers.d.ts +4 -0
- package/script_helpers.js +70 -0
- package/scripts.d.ts +2 -1
- package/scripts.js +5 -5
- package/stores.d.ts +7 -0
- package/stores.js +12 -0
- package/utils.d.ts +28 -1
- package/utils.js +206 -0
|
@@ -1,14 +1,19 @@
|
|
|
1
1
|
import { SvelteComponentTyped } from "svelte";
|
|
2
|
-
import { type Flow } from '../gen';
|
|
3
2
|
import type { Schema } from '../common';
|
|
3
|
+
import { type Flow } from '../gen';
|
|
4
|
+
import type { FlowMode } from './flows/flowStore';
|
|
4
5
|
declare const __propDef: {
|
|
5
6
|
props: {
|
|
6
7
|
i: number;
|
|
7
8
|
flow: Flow;
|
|
8
9
|
schemas?: Schema[] | undefined;
|
|
10
|
+
mode: FlowMode;
|
|
9
11
|
args?: Record<string, any> | undefined;
|
|
12
|
+
runPreview?: ((args: any) => Promise<void>) | undefined;
|
|
10
13
|
};
|
|
11
14
|
events: {
|
|
15
|
+
change: CustomEvent<any>;
|
|
16
|
+
} & {
|
|
12
17
|
[evt: string]: CustomEvent<any>;
|
|
13
18
|
};
|
|
14
19
|
slots: {};
|
|
@@ -17,5 +22,6 @@ export declare type FlowPreviewProps = typeof __propDef.props;
|
|
|
17
22
|
export declare type FlowPreviewEvents = typeof __propDef.events;
|
|
18
23
|
export declare type FlowPreviewSlots = typeof __propDef.slots;
|
|
19
24
|
export default class FlowPreview extends SvelteComponentTyped<FlowPreviewProps, FlowPreviewEvents, FlowPreviewSlots> {
|
|
25
|
+
get runPreview(): (args: any) => Promise<void>;
|
|
20
26
|
}
|
|
21
27
|
export {};
|
|
@@ -1,23 +1,38 @@
|
|
|
1
1
|
<script>import { faHourglassHalf, faSpinner, faTimes } from '@fortawesome/free-solid-svg-icons';
|
|
2
|
-
import { truncateRev } from '../utils';
|
|
2
|
+
import { scriptPathToHref, truncateRev } from '../utils';
|
|
3
3
|
import Icon from 'svelte-awesome';
|
|
4
4
|
import { check } from 'svelte-awesome/icons';
|
|
5
5
|
import { CompletedJob, FlowModuleValue, FlowStatusModule, JobService, QueuedJob } from '../gen';
|
|
6
6
|
import { workspaceStore } from '../stores';
|
|
7
|
-
import DisplayResult from './DisplayResult.svelte';
|
|
8
|
-
import ChevronButton from './ChevronButton.svelte';
|
|
9
7
|
import JobStatus from './JobStatus.svelte';
|
|
8
|
+
import FlowJobResult from './FlowJobResult.svelte';
|
|
10
9
|
export let job;
|
|
11
|
-
export let jobs;
|
|
10
|
+
export let jobs = [];
|
|
11
|
+
let forloop_selected = '';
|
|
12
12
|
function loadResults() {
|
|
13
13
|
job?.flow_status?.modules?.forEach(async (x, i) => {
|
|
14
14
|
if ((i >= jobs.length && x.type == FlowStatusModule.type.SUCCESS) ||
|
|
15
15
|
x.type == FlowStatusModule.type.FAILURE) {
|
|
16
|
-
|
|
17
|
-
|
|
16
|
+
if (x.forloop_jobs) {
|
|
17
|
+
const forloop_jobs = [];
|
|
18
|
+
for (let j of x.forloop_jobs) {
|
|
19
|
+
forloop_jobs.push(await JobService.getCompletedJob({ workspace: $workspaceStore, id: j }));
|
|
20
|
+
}
|
|
21
|
+
jobs.push(forloop_jobs);
|
|
22
|
+
}
|
|
23
|
+
else {
|
|
24
|
+
jobs.push(await JobService.getCompletedJob({ workspace: $workspaceStore, id: x.job }));
|
|
25
|
+
}
|
|
26
|
+
jobs = jobs;
|
|
18
27
|
}
|
|
19
28
|
});
|
|
20
29
|
}
|
|
30
|
+
function toCompletedJob(x) {
|
|
31
|
+
return x;
|
|
32
|
+
}
|
|
33
|
+
function toCompletedJobs(x) {
|
|
34
|
+
return x;
|
|
35
|
+
}
|
|
21
36
|
$: $workspaceStore && job && loadResults();
|
|
22
37
|
</script>
|
|
23
38
|
|
|
@@ -43,7 +58,7 @@ $: $workspaceStore && job && loadResults();
|
|
|
43
58
|
out of <span class="font-medium text-gray-900">{job?.raw_flow?.modules.length}</span>
|
|
44
59
|
<span class="mt-4" />
|
|
45
60
|
</p>
|
|
46
|
-
<ul
|
|
61
|
+
<ul class="-mb-8 w-full">
|
|
47
62
|
{#each job?.raw_flow?.modules ?? [] as mod, i}
|
|
48
63
|
<li class="w-full">
|
|
49
64
|
<div class="relative pb-8 w-full">
|
|
@@ -96,7 +111,8 @@ $: $workspaceStore && job && loadResults();
|
|
|
96
111
|
<p class="text-sm text-gray-500">
|
|
97
112
|
{#if mod.value.type == FlowModuleValue.type.SCRIPT}
|
|
98
113
|
Script at path <a
|
|
99
|
-
|
|
114
|
+
target="_blank"
|
|
115
|
+
href={scriptPathToHref(mod.value.path ?? '')}
|
|
100
116
|
class="font-medium text-gray-900">{mod.value.path}</a
|
|
101
117
|
>
|
|
102
118
|
{/if}
|
|
@@ -104,7 +120,15 @@ $: $workspaceStore && job && loadResults();
|
|
|
104
120
|
</div>
|
|
105
121
|
<div class="text-right text-sm whitespace-nowrap text-gray-500">
|
|
106
122
|
{job.flow_status?.modules[i].type}
|
|
107
|
-
{#if job.flow_status?.modules[i].
|
|
123
|
+
{#if job.flow_status?.modules[i].forloop_jobs}
|
|
124
|
+
{#each job.flow_status?.modules[i].forloop_jobs ?? [] as job}
|
|
125
|
+
<div class="flex flex-col">
|
|
126
|
+
<a href="/run/{job}" class="font-medium text-blue-600"
|
|
127
|
+
>{truncateRev(job ?? '', 10)}</a
|
|
128
|
+
>
|
|
129
|
+
</div>
|
|
130
|
+
{/each}
|
|
131
|
+
{:else if job.flow_status?.modules[i].job}
|
|
108
132
|
<a href="/run/{job.flow_status?.modules[i].job}" class="font-medium text-blue-600"
|
|
109
133
|
>{truncateRev(job.flow_status?.modules[i].job ?? '', 10)}</a
|
|
110
134
|
>
|
|
@@ -112,23 +136,29 @@ $: $workspaceStore && job && loadResults();
|
|
|
112
136
|
</div>
|
|
113
137
|
</div>
|
|
114
138
|
</div>
|
|
115
|
-
{#if
|
|
116
|
-
|
|
117
|
-
<div>
|
|
118
|
-
|
|
119
|
-
<
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
139
|
+
{#if jobs[i]}
|
|
140
|
+
{#if Array.isArray(jobs[i])}
|
|
141
|
+
<div class="flex flex-col space-y-2">
|
|
142
|
+
{#each toCompletedJobs(jobs[i]) as job, i}
|
|
143
|
+
<button
|
|
144
|
+
class="underline text-blue-600 hover:text-blue-700"
|
|
145
|
+
on:click={() => {
|
|
146
|
+
if (forloop_selected == job.id) {
|
|
147
|
+
forloop_selected = ''
|
|
148
|
+
} else {
|
|
149
|
+
forloop_selected = job.id
|
|
150
|
+
}
|
|
151
|
+
}}
|
|
152
|
+
>Iteration: #{i}: {job.id} {forloop_selected == job.id ? '(-)' : '(+)'}</button
|
|
153
|
+
>
|
|
154
|
+
{#if forloop_selected == job.id}
|
|
155
|
+
<svelte:self {job} />
|
|
156
|
+
{/if}
|
|
157
|
+
{/each}
|
|
130
158
|
</div>
|
|
131
|
-
|
|
159
|
+
{:else}
|
|
160
|
+
<FlowJobResult job={toCompletedJob(jobs[i])} />
|
|
161
|
+
{/if}
|
|
132
162
|
{/if}
|
|
133
163
|
</div>
|
|
134
164
|
</li>
|
|
@@ -3,7 +3,7 @@ import { CompletedJob, QueuedJob } from '../gen';
|
|
|
3
3
|
declare const __propDef: {
|
|
4
4
|
props: {
|
|
5
5
|
job: QueuedJob | CompletedJob;
|
|
6
|
-
jobs
|
|
6
|
+
jobs?: (CompletedJob | CompletedJob[] | undefined)[] | undefined;
|
|
7
7
|
};
|
|
8
8
|
events: {
|
|
9
9
|
[evt: string]: CustomEvent<any>;
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
<script>import { scriptPathToHref } from '../utils';
|
|
2
|
+
import Highlight from 'svelte-highlight';
|
|
3
|
+
import json from 'svelte-highlight/languages/json';
|
|
4
|
+
import python from 'svelte-highlight/languages/python';
|
|
5
|
+
import typescript from 'svelte-highlight/languages/typescript';
|
|
6
|
+
import { FlowModuleValue } from '../gen';
|
|
7
|
+
import github from 'svelte-highlight/styles/github';
|
|
8
|
+
import { slide } from 'svelte/transition';
|
|
9
|
+
import Tabs from './Tabs.svelte';
|
|
10
|
+
import SchemaViewer from './SchemaViewer.svelte';
|
|
11
|
+
import FieldHeader from './FieldHeader.svelte';
|
|
12
|
+
export let flow;
|
|
13
|
+
let flowFiltered = {
|
|
14
|
+
summary: flow.summary,
|
|
15
|
+
description: flow.description,
|
|
16
|
+
value: flow.value,
|
|
17
|
+
schema: flow.schema
|
|
18
|
+
};
|
|
19
|
+
export let embedded = false;
|
|
20
|
+
export let tab = 'ui';
|
|
21
|
+
let open = {};
|
|
22
|
+
</script>
|
|
23
|
+
|
|
24
|
+
<svelte:head>
|
|
25
|
+
{@html github}
|
|
26
|
+
</svelte:head>
|
|
27
|
+
|
|
28
|
+
{#if !embedded}
|
|
29
|
+
<Tabs
|
|
30
|
+
tabs={[
|
|
31
|
+
['ui', 'Flow rendered'],
|
|
32
|
+
['json', 'JSON'],
|
|
33
|
+
['schema', 'Input schema of the flow']
|
|
34
|
+
]}
|
|
35
|
+
bind:tab
|
|
36
|
+
/>
|
|
37
|
+
{/if}
|
|
38
|
+
{#if tab == 'ui'}
|
|
39
|
+
<div class="flow-root w-full p-4">
|
|
40
|
+
<p class="font-black text-lg w-full ml-2">
|
|
41
|
+
<span>Inputs</span>
|
|
42
|
+
</p>
|
|
43
|
+
{#if flow.schema && flow.schema.properties && Object.keys(flow.schema.properties).length > 0 && flow.schema}
|
|
44
|
+
<ul class="my-4 ml-6">
|
|
45
|
+
{#each Object.entries(flow.schema.properties) as [inp, v]}
|
|
46
|
+
<li class="list-disc flex flex-row">
|
|
47
|
+
<FieldHeader
|
|
48
|
+
label={inp}
|
|
49
|
+
required={flow.schema.required?.includes(inp)}
|
|
50
|
+
type={v?.type}
|
|
51
|
+
contentEncoding={v?.contentEncoding}
|
|
52
|
+
format={v?.format}
|
|
53
|
+
itemsType={v?.itemsType}
|
|
54
|
+
/><span class="ml-4 mt-2 text-xs"
|
|
55
|
+
>{v.default != undefined ? 'default: ' + JSON.stringify(v.default) : ''}</span
|
|
56
|
+
>
|
|
57
|
+
</li>
|
|
58
|
+
{/each}
|
|
59
|
+
</ul>
|
|
60
|
+
{:else}
|
|
61
|
+
<div class="text-gray-700 text-xs italic mb-4">
|
|
62
|
+
This script has no argument or is ill-defined
|
|
63
|
+
</div>
|
|
64
|
+
{/if}
|
|
65
|
+
<p class="font-black text-lg my-6 w-full ml-2">
|
|
66
|
+
<span>{flow?.value?.modules?.length} Steps </span>
|
|
67
|
+
<span class="mt-4" />
|
|
68
|
+
</p>
|
|
69
|
+
<ul class="-mb-8 w-full">
|
|
70
|
+
{#each flow?.value?.modules ?? [] as mod, i}
|
|
71
|
+
<li class="w-full">
|
|
72
|
+
<div class="relative pb-8 w-full">
|
|
73
|
+
{#if i < (flow?.value?.modules ?? []).length - 1}
|
|
74
|
+
<span
|
|
75
|
+
class="absolute top-4 left-4 -ml-px h-full w-0.5 bg-gray-200"
|
|
76
|
+
aria-hidden="true"
|
|
77
|
+
/>
|
|
78
|
+
{/if}
|
|
79
|
+
<div class="relative flex space-x-3">
|
|
80
|
+
<div>
|
|
81
|
+
<span
|
|
82
|
+
class="h-8 w-8 rounded-full bg-blue-600 flex items-center justify-center ring-8 ring-white text-white"
|
|
83
|
+
>{i + 1}
|
|
84
|
+
</span>
|
|
85
|
+
</div>
|
|
86
|
+
<div class="min-w-0 flex-1 pt-1.5 flex justify-between space-x-4 w-full">
|
|
87
|
+
<div class="w-full">
|
|
88
|
+
<p class="text-sm text-gray-500">
|
|
89
|
+
{#if mod?.value?.type == FlowModuleValue.type.SCRIPT}
|
|
90
|
+
Script at path <a
|
|
91
|
+
target="_blank"
|
|
92
|
+
href={scriptPathToHref(mod?.value?.path ?? '')}
|
|
93
|
+
class="font-medium text-gray-900">{mod?.value?.path}</a
|
|
94
|
+
>
|
|
95
|
+
{:else if mod?.value?.type == FlowModuleValue.type.RAWSCRIPT}
|
|
96
|
+
<button
|
|
97
|
+
on:click={() => (open[i] = !open[i])}
|
|
98
|
+
class="mb-2 underline text-black"
|
|
99
|
+
>
|
|
100
|
+
Raw {mod?.value?.language} script {open[i] ? '(-)' : '(+)'}</button
|
|
101
|
+
>
|
|
102
|
+
|
|
103
|
+
{#if open[i]}
|
|
104
|
+
<div transition:slide class="border border-black p-2 bg-gray-50 w-full">
|
|
105
|
+
<Highlight
|
|
106
|
+
language={mod?.value?.language == 'deno' ? typescript : python}
|
|
107
|
+
code={mod?.value?.content}
|
|
108
|
+
/>
|
|
109
|
+
</div>
|
|
110
|
+
{/if}
|
|
111
|
+
{:else if mod?.value?.type == FlowModuleValue.type.FLOW}
|
|
112
|
+
Flow at path {mod?.value?.path}
|
|
113
|
+
{:else if mod?.value?.type == FlowModuleValue.type.FORLOOPFLOW}
|
|
114
|
+
For loop over step {i}'s result':
|
|
115
|
+
<svelte:self flow={mod?.value} embedded={true} />
|
|
116
|
+
{/if}
|
|
117
|
+
</p>
|
|
118
|
+
</div>
|
|
119
|
+
</div>
|
|
120
|
+
</div>
|
|
121
|
+
</div>
|
|
122
|
+
</li>
|
|
123
|
+
{/each}
|
|
124
|
+
</ul>
|
|
125
|
+
</div>
|
|
126
|
+
{:else if tab == 'json'}
|
|
127
|
+
<button
|
|
128
|
+
on:click={async () => {
|
|
129
|
+
await navigator.clipboard.writeText(JSON.stringify(flowFiltered, null, 4))
|
|
130
|
+
}}
|
|
131
|
+
class="default-primary-button-v2 float-right my-2 ml-4">copy content</button
|
|
132
|
+
>
|
|
133
|
+
<Highlight language={json} code={JSON.stringify(flowFiltered, null, 4)} />
|
|
134
|
+
{:else if tab == 'schema'}
|
|
135
|
+
<SchemaViewer schema={flow.schema} />
|
|
136
|
+
{/if}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { SvelteComponentTyped } from "svelte";
|
|
2
|
+
import { type FlowValue } from '../gen';
|
|
3
|
+
declare const __propDef: {
|
|
4
|
+
props: {
|
|
5
|
+
flow: {
|
|
6
|
+
summary: string;
|
|
7
|
+
description?: string;
|
|
8
|
+
value: FlowValue;
|
|
9
|
+
schema?: any;
|
|
10
|
+
};
|
|
11
|
+
embedded?: boolean | undefined;
|
|
12
|
+
tab?: "json" | "schema" | "ui" | undefined;
|
|
13
|
+
};
|
|
14
|
+
events: {
|
|
15
|
+
[evt: string]: CustomEvent<any>;
|
|
16
|
+
};
|
|
17
|
+
slots: {};
|
|
18
|
+
};
|
|
19
|
+
export declare type FlowViewerProps = typeof __propDef.props;
|
|
20
|
+
export declare type FlowViewerEvents = typeof __propDef.events;
|
|
21
|
+
export declare type FlowViewerSlots = typeof __propDef.slots;
|
|
22
|
+
export default class FlowViewer extends SvelteComponentTyped<FlowViewerProps, FlowViewerEvents, FlowViewerSlots> {
|
|
23
|
+
}
|
|
24
|
+
export {};
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
import Mail from './icons/Mail.svelte';
|
|
3
3
|
import DbIcon from './icons/DbIcon.svelte';
|
|
4
4
|
import PostgresIcon from './icons/PostgresIcon.svelte';
|
|
5
|
-
import
|
|
6
|
-
import { faSlack } from '@fortawesome/free-brands-svg-icons';
|
|
5
|
+
import { faGithub } from '@fortawesome/free-brands-svg-icons';
|
|
7
6
|
import Slack from './icons/Slack.svelte';
|
|
7
|
+
import Icon from 'svelte-awesome';
|
|
8
8
|
export let name;
|
|
9
9
|
export let after = false;
|
|
10
10
|
export let height = '24px';
|
|
@@ -15,16 +15,18 @@ export let width = '24px';
|
|
|
15
15
|
{#if !after}
|
|
16
16
|
{name}
|
|
17
17
|
{/if}
|
|
18
|
-
{#if name === '
|
|
18
|
+
{#if name === 'postgresql'}
|
|
19
19
|
<PostgresIcon {height} {width} />
|
|
20
20
|
{:else if name === 'mysql'}
|
|
21
21
|
<Mysql {height} {width} />
|
|
22
|
-
{:else if name === '
|
|
22
|
+
{:else if name === 'smtp'}
|
|
23
23
|
<Mail {height} {width} />
|
|
24
24
|
{:else if name === 'mongodb'}
|
|
25
25
|
<DbIcon {height} {width} />
|
|
26
26
|
{:else if name === 'slack'}
|
|
27
27
|
<Slack {height} {width} />
|
|
28
|
+
{:else if name === 'github'}
|
|
29
|
+
<Icon data={faGithub} scale={1.4} />
|
|
28
30
|
{/if}
|
|
29
31
|
{#if after}
|
|
30
32
|
{name}
|
|
@@ -8,7 +8,7 @@ export let job;
|
|
|
8
8
|
|
|
9
9
|
{#if job && 'success' in job && job.success}
|
|
10
10
|
<Icon class="text-green-600" data={check} scale={SMALL_ICON_SCALE} />
|
|
11
|
-
<span class="mx-2">Succeeded</span>
|
|
11
|
+
<span class="mx-2">Succeeded {job.is_skipped ? '(Skipped)' : ''}</span>
|
|
12
12
|
<div>
|
|
13
13
|
<Icon class="text-gray-700" data={faHourglassHalf} scale={SMALL_ICON_SCALE} /><span class="mx-2"
|
|
14
14
|
>Job ran in {job.duration}
|
package/components/Modal.svelte
CHANGED
|
@@ -3,10 +3,12 @@ export let open = false;
|
|
|
3
3
|
export let z = 'z-30';
|
|
4
4
|
const dispatch = createEventDispatcher();
|
|
5
5
|
export function closeModal() {
|
|
6
|
+
document.body.style.overflow = 'auto';
|
|
6
7
|
open = false;
|
|
7
8
|
dispatch('close');
|
|
8
9
|
}
|
|
9
10
|
export function openModal() {
|
|
11
|
+
document.body.style.overflow = 'hidden';
|
|
10
12
|
open = true;
|
|
11
13
|
dispatch('open');
|
|
12
14
|
}
|
|
@@ -23,9 +25,9 @@ function handleKeyUp(event) {
|
|
|
23
25
|
|
|
24
26
|
<svelte:window on:keyup={handleKeyUp} />
|
|
25
27
|
|
|
26
|
-
<div class="blurred-background
|
|
28
|
+
<div class="blurred-background {open ? '' : 'hidden'}" />
|
|
27
29
|
|
|
28
|
-
<div class="fixed top-0 w-screen h-screen
|
|
30
|
+
<div class="fixed top-0 w-screen h-screen {open ? '' : 'hidden'} {z}">
|
|
29
31
|
<div
|
|
30
32
|
class="fixed right-0 flex flex-col w-3/4 sm:w-2/3 lg:w-1/2 h-screen border border-gray-300 shadow-xl"
|
|
31
33
|
>
|
|
@@ -90,5 +92,5 @@ function handleKeyUp(event) {
|
|
|
90
92
|
<style>
|
|
91
93
|
.blurred-background {
|
|
92
94
|
/* @apply absolute sm:top-6 lg:top-8 left-28 sm:left-40 md:left-48; */ /* If we wanted to make the navbars visible */ position: fixed; top: 0px; left: 0px; --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity)); opacity: 0.75; width: 100vw; height: 100vh;
|
|
93
|
-
z-index:
|
|
95
|
+
z-index: 10;
|
|
94
96
|
}</style>
|
|
@@ -1,65 +1,138 @@
|
|
|
1
|
-
<script>import
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
1
|
+
<script>import { FlowModuleValue } from '../gen';
|
|
2
|
+
import { addPreviewResult, previewResults } from '../stores';
|
|
3
|
+
import { buildExtraLib, objectToTsType, schemaToObject, schemaToTsType } from '../utils';
|
|
4
|
+
import { faRobot } from '@fortawesome/free-solid-svg-icons';
|
|
5
|
+
import Icon from 'svelte-awesome';
|
|
6
|
+
import Editor from './Editor.svelte';
|
|
7
|
+
import EditorBar from './EditorBar.svelte';
|
|
5
8
|
import FlowPreview from './FlowPreview.svelte';
|
|
6
|
-
|
|
9
|
+
import FlowInputs from './flows/FlowInputs.svelte';
|
|
10
|
+
import FlowModuleHeader from './flows/FlowModuleHeader.svelte';
|
|
11
|
+
import { createInlineScriptModule, flowStore, loadSchema, pickScript, schemasStore } from './flows/flowStore';
|
|
12
|
+
import SchemaForm from './SchemaForm.svelte';
|
|
13
|
+
import Tooltip from './Tooltip.svelte';
|
|
14
|
+
export let open;
|
|
15
|
+
export let mode;
|
|
7
16
|
export let i;
|
|
8
17
|
export let mod;
|
|
9
18
|
export let args = {};
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
JSON.stringify(Object.keys(mod.input_transform).sort())) {
|
|
17
|
-
let it = {};
|
|
18
|
-
Object.keys(schema?.properties ?? {}).map((x) => (it[x] = {
|
|
19
|
-
type: 'static',
|
|
20
|
-
value: ''
|
|
21
|
-
}));
|
|
22
|
-
schemaForms[i]?.setArgs(it);
|
|
23
|
-
}
|
|
24
|
-
schemas[i] = schema ?? emptySchema();
|
|
25
|
-
}
|
|
26
|
-
else {
|
|
27
|
-
schemaForms[i]?.setArgs({});
|
|
28
|
-
schemas[i] = emptySchema();
|
|
29
|
-
}
|
|
30
|
-
schemas = schemas;
|
|
31
|
-
}
|
|
19
|
+
let editor;
|
|
20
|
+
let websocketAlive = { pyright: false, black: false, deno: false };
|
|
21
|
+
$: schema = $schemasStore[i];
|
|
22
|
+
$: shouldPick = mod.value.path === '' && mod.value.language === undefined;
|
|
23
|
+
$: previousSchema = i === 0 ? schemaToObject($flowStore?.schema) : $previewResults[i];
|
|
24
|
+
$: extraLib = buildExtraLib(i === 0 ? schemaToTsType($flowStore?.schema) : objectToTsType($previewResults[i]));
|
|
32
25
|
</script>
|
|
33
26
|
|
|
34
|
-
<li class="flex flex-row flex-shrink max-w-full
|
|
35
|
-
<div
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
<
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
27
|
+
<li class="flex flex-row flex-shrink max-w-full mx-auto mt-16">
|
|
28
|
+
<div
|
|
29
|
+
class="bg-white border border-gray xl-rounded shadow-lg w-full max-w-4xl mx-4 md:mx-auto"
|
|
30
|
+
id="module-{i}"
|
|
31
|
+
>
|
|
32
|
+
<div class="flex items-center justify-between flex-wra p-4 sm:px-6 z-10">
|
|
33
|
+
<FlowModuleHeader bind:open {mod} {i} {shouldPick}>
|
|
34
|
+
<div>
|
|
35
|
+
<h3 class="text-lg font-bold text-gray-900">Step {i + 1}</h3>
|
|
36
|
+
{#if i == 0 && mode == 'pull'}
|
|
37
|
+
<h3 class="font-bold">
|
|
38
|
+
Trigger Script <Tooltip
|
|
39
|
+
>When a flow is 'Pull', the first step is a trigger script. Trigger scripts are
|
|
40
|
+
scripts that must return a list which are the new items to be treated one by one by
|
|
41
|
+
the rest of the flow, usually the list of new items since last time the flow was
|
|
42
|
+
run. One can retrieve the item in the next step using `previous_result._value`. To
|
|
43
|
+
easily compute the diff, windmill provides some helpers under the form of
|
|
44
|
+
`getInternalState` and `setInternalState`.</Tooltip
|
|
45
|
+
>
|
|
46
|
+
</h3>{/if}
|
|
47
|
+
<p>
|
|
48
|
+
{#if mod.value.path}
|
|
49
|
+
{mod.value.path}
|
|
50
|
+
{/if}
|
|
51
|
+
{#if mod.value.language}
|
|
52
|
+
Inline {mod.value.language}
|
|
53
|
+
{/if}
|
|
54
|
+
{#if !mod.value.path && !mod.value.language}
|
|
55
|
+
Select a script
|
|
56
|
+
{/if}
|
|
57
|
+
</p>
|
|
58
|
+
</div>
|
|
59
|
+
</FlowModuleHeader>
|
|
63
60
|
</div>
|
|
61
|
+
<div class="border-b border-gray-200" />
|
|
62
|
+
{#if open == i}
|
|
63
|
+
<div class="p-6">
|
|
64
|
+
{#if shouldPick}
|
|
65
|
+
<FlowInputs
|
|
66
|
+
isTrigger={mode == 'pull' && i == 0}
|
|
67
|
+
on:pick={(e) => pickScript(e.detail.path, i)}
|
|
68
|
+
on:new={(e) => createInlineScriptModule(e.detail.language, i, mode)}
|
|
69
|
+
/>
|
|
70
|
+
{/if}
|
|
71
|
+
{#if mod.value.type === FlowModuleValue.type.RAWSCRIPT}
|
|
72
|
+
<div class="p-1 overflow-hidden">
|
|
73
|
+
<EditorBar {editor} {websocketAlive} lang={mod.value.language ?? 'deno'} />
|
|
74
|
+
</div>
|
|
75
|
+
<Editor
|
|
76
|
+
bind:websocketAlive
|
|
77
|
+
bind:this={editor}
|
|
78
|
+
class="h-80 border p-2 rounded"
|
|
79
|
+
bind:code={mod.value.content}
|
|
80
|
+
deno={mod.value.language === FlowModuleValue.language.DENO}
|
|
81
|
+
/>
|
|
82
|
+
<div class="mt-2 mb-8">
|
|
83
|
+
<button class="default-primary-button-v2" on:click={() => loadSchema(i)}>
|
|
84
|
+
<Icon data={faRobot} class="w-4 h-4 mr-2 -ml-2" />
|
|
85
|
+
|
|
86
|
+
Infer step inputs from code
|
|
87
|
+
</button>
|
|
88
|
+
</div>
|
|
89
|
+
{/if}
|
|
90
|
+
{#if !shouldPick}
|
|
91
|
+
<p class="text-lg font-bold text-gray-900 mb-2">Step inputs</p>
|
|
92
|
+
<SchemaForm
|
|
93
|
+
inputTransform={true}
|
|
94
|
+
{schema}
|
|
95
|
+
{extraLib}
|
|
96
|
+
{i}
|
|
97
|
+
{previousSchema}
|
|
98
|
+
bind:args={mod.input_transform}
|
|
99
|
+
/>
|
|
100
|
+
{/if}
|
|
101
|
+
</div>
|
|
102
|
+
|
|
103
|
+
{#if !shouldPick}
|
|
104
|
+
<div class="border-b border-gray-200" />
|
|
105
|
+
<div class="p-3">
|
|
106
|
+
<FlowPreview
|
|
107
|
+
bind:args
|
|
108
|
+
flow={$flowStore}
|
|
109
|
+
{i}
|
|
110
|
+
{mode}
|
|
111
|
+
schemas={$schemasStore}
|
|
112
|
+
on:change={(e) => {
|
|
113
|
+
addPreviewResult(e.detail.result, i + 1)
|
|
114
|
+
}}
|
|
115
|
+
/>
|
|
116
|
+
</div>
|
|
117
|
+
<div>
|
|
118
|
+
<button class="w-full h-full" on:click={() => (open = -1)}>(-)</button>
|
|
119
|
+
</div>
|
|
120
|
+
{:else}
|
|
121
|
+
<div>
|
|
122
|
+
<button class="w-full h-full" on:click={() => (open = i)}>(+)</button>
|
|
123
|
+
</div>
|
|
124
|
+
{/if}
|
|
125
|
+
{/if}
|
|
64
126
|
</div>
|
|
65
127
|
</li>
|
|
128
|
+
{#if i == 0 && mode == 'pull'}
|
|
129
|
+
<li class="relative m-20 ">
|
|
130
|
+
<div class="relative flex justify-center bg-white shadow p-2">
|
|
131
|
+
Starting from here, the flow for loop over items from step 1's result above <Tooltip
|
|
132
|
+
>This flow being in 'Pull' mode, the rest of the flow will for loop over the list of items
|
|
133
|
+
returned by the trigger script right above. Retrieve the item value using
|
|
134
|
+
`previous_result._value`</Tooltip
|
|
135
|
+
>
|
|
136
|
+
</div>
|
|
137
|
+
</li>
|
|
138
|
+
{/if}
|
|
@@ -1,16 +1,13 @@
|
|
|
1
1
|
import { SvelteComponentTyped } from "svelte";
|
|
2
|
-
import type
|
|
3
|
-
import
|
|
4
|
-
import SchemaForm from './SchemaForm.svelte';
|
|
2
|
+
import { type FlowModule } from '../gen';
|
|
3
|
+
import { type FlowMode } from './flows/flowStore';
|
|
5
4
|
declare const __propDef: {
|
|
6
5
|
props: {
|
|
7
|
-
|
|
6
|
+
open: number;
|
|
7
|
+
mode: FlowMode;
|
|
8
8
|
i: number;
|
|
9
9
|
mod: FlowModule;
|
|
10
10
|
args?: Record<string, any> | undefined;
|
|
11
|
-
schemas?: Schema[] | undefined;
|
|
12
|
-
schemaForms?: (SchemaForm | undefined)[] | undefined;
|
|
13
|
-
loadSchema?: (() => Promise<void>) | undefined;
|
|
14
11
|
};
|
|
15
12
|
events: {
|
|
16
13
|
[evt: string]: CustomEvent<any>;
|
|
@@ -21,6 +18,5 @@ export declare type ModuleStepProps = typeof __propDef.props;
|
|
|
21
18
|
export declare type ModuleStepEvents = typeof __propDef.events;
|
|
22
19
|
export declare type ModuleStepSlots = typeof __propDef.slots;
|
|
23
20
|
export default class ModuleStep extends SvelteComponentTyped<ModuleStepProps, ModuleStepEvents, ModuleStepSlots> {
|
|
24
|
-
get loadSchema(): () => Promise<void>;
|
|
25
21
|
}
|
|
26
22
|
export {};
|