From a75ae3bfdbfdc7612d193f61f4c953eaac5dbf39 Mon Sep 17 00:00:00 2001 From: Ruben Fiszel Date: Thu, 2 Nov 2023 18:52:40 +0100 Subject: [PATCH] improve devex for local flow (#2543) * all * all * improve dev pages * improve dev pages * fix multiple bugs * fix multiple bugs --- cli/deps.ts | 2 +- cli/dev.ts | 13 +- cli/script.ts | 12 + frontend/src/lib/components/DurationMs.svelte | 20 ++ frontend/src/lib/components/EditorBar.svelte | 2 +- frontend/src/lib/components/JobStatus.svelte | 15 +- .../src/lib/components/WorkspaceGroup.svelte | 45 ++- .../details/ErrorHandlerToggleButton.svelte | 2 + .../src/lib/components/jobs/JobDetail.svelte | 11 +- .../src/lib/components/jobs/JobPreview.svelte | 13 +- .../src/lib/components/runs/JobPreview.svelte | 231 ++++++++------- .../components/sidebar/DarkModeToggle.svelte | 18 +- .../(logged)/runs/[...path]/+page.svelte | 4 +- .../user/(user)/workspaces/+page.svelte | 8 +- .../(root)/(logged)/workers/+page.svelte | 25 +- frontend/src/routes/(root)/+layout.svelte | 8 +- .../{(root)/(logged) => }/flows/dev/+page.js | 0 .../(logged) => }/flows/dev/+page.svelte | 57 +++- .../(logged) => }/scripts/dev/+page.js | 0 frontend/src/routes/scripts/dev/+page.svelte | 273 ++++++++++++++++++ frontend/src/routes/scripts/p/dev/+page.js | 0 .../scripts => scripts/p}/dev/+page.svelte | 5 + 22 files changed, 558 insertions(+), 206 deletions(-) create mode 100644 frontend/src/lib/components/DurationMs.svelte rename frontend/src/routes/{(root)/(logged) => }/flows/dev/+page.js (100%) rename frontend/src/routes/{(root)/(logged) => }/flows/dev/+page.svelte (79%) rename frontend/src/routes/{(root)/(logged) => }/scripts/dev/+page.js (100%) create mode 100644 frontend/src/routes/scripts/dev/+page.svelte create mode 100644 frontend/src/routes/scripts/p/dev/+page.js rename frontend/src/routes/{(root)/(logged)/scripts => scripts/p}/dev/+page.svelte (96%) diff --git a/cli/deps.ts b/cli/deps.ts index b57838d4bb..e710255465 100644 --- a/cli/deps.ts +++ b/cli/deps.ts @@ -1,6 +1,6 @@ // windmill export { setClient } from "https://deno.land/x/windmill@v1.188.1/mod.ts"; -export * from "https://deno.land/x/windmill@v1.188.1/windmill-api/index.ts"; +export * from "https://deno.land/x/windmill@v1.195.0/windmill-api/index.ts"; export { SEP } from "https://deno.land/std@0.201.0/path/separator.ts"; // cliffy export { Command } from "https://deno.land/x/cliffy@v1.0.0-rc.2/command/mod.ts"; diff --git a/cli/dev.ts b/cli/dev.ts index b120f86c3d..6855ea58ae 100644 --- a/cli/dev.ts +++ b/cli/dev.ts @@ -44,14 +44,15 @@ async function dev(opts: GlobalOptions & { filter?: string }) { const content = await Deno.readTextFile(cpath); const splitted = cpath.split("."); const wmPath = splitted[0]; - const ext = splitted[splitted.length - 1]; + const len = splitted.length; + const ext = splitted[len - 1]; const lang = ext == "py" ? "python3" : ext == "ts" - ? splitted.length > 2 && splitted[splitted.length - 2] == "fetch" + ? len > 2 && splitted[len - 2] == "fetch" ? "nativets" - : splitted.length > 2 && splitted[splitted.length - 2] == "bun" + : len > 2 && splitted[len - 2] == "bun" ? "bun" : "deno" : ext == "go" @@ -61,11 +62,11 @@ async function dev(opts: GlobalOptions & { filter?: string }) { : ext == "ps1" ? "powershell" : ext == "sql" - ? splitted.length > 2 && splitted[splitted.length - 2] == "my" + ? len > 2 && splitted[len - 2] == "my" ? "mysql" - : splitted.length > 2 && splitted[splitted.length - 2] == "bq" + : len > 2 && splitted[len - 2] == "bq" ? "bigquery" - : splitted.length > 2 && splitted[splitted.length - 2] == "sf" + : len > 2 && splitted[len - 2] == "sf" ? "snowflake" : "postgresql" : ext == "gql" diff --git a/cli/script.ts b/cli/script.ts index b6b40fa688..f8d81bde8b 100644 --- a/cli/script.ts +++ b/cli/script.ts @@ -151,6 +151,12 @@ export async function handleFile( lock: typed?.lock, parent_hash: remote.hash, schema: typed?.schema, + tag: typed?.tag, + ws_error_handler_muted: typed?.ws_error_handler_muted, + dedicated_worker: typed?.dedicated_worker, + cache_ttl: typed?.cache_ttl, + concurrency_time_window_s: typed?.concurrency_time_window_s, + concurrent_limit: typed?.concurrent_limit, }, }); } else { @@ -171,6 +177,12 @@ export async function handleFile( lock: typed?.lock, parent_hash: undefined, schema: typed?.schema, + tag: typed?.tag, + ws_error_handler_muted: typed?.ws_error_handler_muted, + dedicated_worker: typed?.dedicated_worker, + cache_ttl: typed?.cache_ttl, + concurrency_time_window_s: typed?.concurrency_time_window_s, + concurrent_limit: typed?.concurrent_limit, }, }); } diff --git a/frontend/src/lib/components/DurationMs.svelte b/frontend/src/lib/components/DurationMs.svelte new file mode 100644 index 0000000000..f26adbc61a --- /dev/null +++ b/frontend/src/lib/components/DurationMs.svelte @@ -0,0 +1,20 @@ + + + + + Ran in {msToSec(duration_ms)}sFor scripts, this is the time that it took to execute from the time it was picked by a worker, + to the time the result was stored.
+ For flows, it is the cumulative time of the execution of each steps. Suspend/sleep/transition times + are not accounted for, and each step's duration in a parallel branch would be added. Hence the time + here can differ from the time it took for the flow to have a result from start. + diff --git a/frontend/src/lib/components/EditorBar.svelte b/frontend/src/lib/components/EditorBar.svelte index e055011228..28992c12fb 100644 --- a/frontend/src/lib/components/EditorBar.svelte +++ b/frontend/src/lib/components/EditorBar.svelte @@ -444,7 +444,7 @@ {#if showResourceTypePicker} +Disable workspace error handler, EE only diff --git a/frontend/src/lib/components/jobs/JobDetail.svelte b/frontend/src/lib/components/jobs/JobDetail.svelte index 71d501792e..8a8e558761 100644 --- a/frontend/src/lib/components/jobs/JobDetail.svelte +++ b/frontend/src/lib/components/jobs/JobDetail.svelte @@ -2,7 +2,7 @@ import { goto } from '$app/navigation' import { page } from '$app/stores' import type { Job } from '$lib/gen' - import { displayDate, msToSec, truncateHash, truncateRev } from '$lib/utils' + import { displayDate, truncateHash, truncateRev } from '$lib/utils' import { faCalendar, faCircle, @@ -23,6 +23,7 @@ import JobPreview from './JobPreview.svelte' import TimeAgo from '../TimeAgo.svelte' import { forLater } from '$lib/forLater' + import DurationMs from '../DurationMs.svelte' const SMALL_ICON_SCALE = 0.7 @@ -141,13 +142,7 @@ > {#if job && 'duration_ms' in job && job.duration_ms != undefined} -
- - Ran in {msToSec(job.duration_ms)}s -
+ {/if}
diff --git a/frontend/src/lib/components/jobs/JobPreview.svelte b/frontend/src/lib/components/jobs/JobPreview.svelte index 79f976e719..cedf92c1ae 100644 --- a/frontend/src/lib/components/jobs/JobPreview.svelte +++ b/frontend/src/lib/components/jobs/JobPreview.svelte @@ -11,11 +11,10 @@ import JobArgs from '../JobArgs.svelte' import { writable } from 'svelte/store' import LogViewer from '../LogViewer.svelte' - import { msToSec } from '$lib/utils' - import { Icon } from 'svelte-awesome' - import { faHourglassHalf } from '@fortawesome/free-solid-svg-icons' + import { Badge } from '../common' import { forLater } from '$lib/forLater' + import DurationMs from '../DurationMs.svelte' const POPUP_HEIGHT = 320 as const @@ -105,11 +104,9 @@ Mem: {job?.['mem_peak'] ? `${(job['mem_peak'] / 1024).toPrecision(4)}MB` : 'N/A'} - - - Ran in {msToSec(job?.['duration_ms'])}s - + {#if job?.['duration_ms']} + + {/if}
diff --git a/frontend/src/lib/components/runs/JobPreview.svelte b/frontend/src/lib/components/runs/JobPreview.svelte index a71402ac97..047a378198 100644 --- a/frontend/src/lib/components/runs/JobPreview.svelte +++ b/frontend/src/lib/components/runs/JobPreview.svelte @@ -1,23 +1,20 @@ ['Escape', 'Esc'].includes(key) && close()} /> - +
-
- {#if job?.['priority']} - - priority: {job?.['priority']} - - {/if} - {#if job && 'duration_ms' in job && job.duration_ms != undefined} - - Ran in ({msToSec(job.duration_ms)}s) - - {/if} - {#if job?.['mem_peak']} - - Mem: {job?.['mem_peak'] ? `${(job['mem_peak'] / 1024).toPrecision(4)}MB` : 'N/A'} - - {/if} -
- - ID: - {job?.id} - - - Arguments - -
- -
- - Results - - {#if job && 'scheduled_for' in job && !job.running && job.scheduled_for && forLater(job.scheduled_for)} -
-
Job is scheduled for
-
{new Date(job?.['scheduled_for']).toLocaleString()}
+ {#if job} +
+ {#if job?.['priority']} + + priority: {job?.['priority']} + + {/if} + {#if job && 'duration_ms' in job && job.duration_ms != undefined} + + {/if} + {#if job?.['mem_peak']} + + Mem: {job?.['mem_peak'] ? `${(job['mem_peak'] / 1024).toPrecision(4)}MB` : 'N/A'} + + {/if}
- {/if} + + ID: + {job?.id ?? ''} + -
- {#if job?.type === Job.type.COMPLETED_JOB} - - Result - Logs - {#if job?.job_kind == 'dependencies'} - Code - {:else if job?.job_kind == 'preview'} - Code - {/if} - + Arguments - - {#if job} - {#if viewTab == 'result' && (job?.job_kind == 'flow' || job?.job_kind == 'flowpreview')} -
-
- +
+ +
+ + Results + + {#if job && 'scheduled_for' in job && !job.running && job.scheduled_for && forLater(job.scheduled_for)} +
+
Job is scheduled for
+
{new Date(job?.['scheduled_for']).toLocaleString()}
+
+ {/if} + +
+ {#if job?.type === Job.type.COMPLETED_JOB} + + Result + Logs + {#if job?.job_kind == 'dependencies'} + Code + {:else if job?.job_kind == 'preview'} + Code + {/if} + + + + {#if job} + {#if viewTab == 'result' && (job?.job_kind == 'flow' || job?.job_kind == 'flowpreview')} +
+
+ +
+ {:else} +
+ {#if viewTab == 'logs'} +
+ +
+ {:else if viewTab == 'code'} + {#if job && 'raw_code' in job && job.raw_code} +
+ +
+ {:else if job} + No code is available + {:else} + + {/if} + {:else if job !== undefined && 'result' in job && job.result !== undefined} + + {:else if job} + No output is available yet + {/if} +
+ {/if} + {/if} + {:else if job && `running` in job ? job.running : false} + {#if job?.job_kind == 'flow' || job?.job_kind == 'flowpreview'} +
+ +
{:else} -
- {#if viewTab == 'logs'} -
- -
- {:else if viewTab == 'code'} - {#if job && 'raw_code' in job && job.raw_code} -
- -
- {:else if job} - No code is available - {:else} - - {/if} - {:else if job !== undefined && 'result' in job && job.result !== undefined} - - {:else if job} - No output is available yet - {/if} -
+
Job is still running
+ {/if} {/if} - {:else if job && `running` in job ? job.running : false} - {#if job?.job_kind == 'flow' || job?.job_kind == 'flowpreview'} -
- - -
- {:else} -
Job is still running
- - {/if} - {/if} -
+
+ {/if}
diff --git a/frontend/src/lib/components/sidebar/DarkModeToggle.svelte b/frontend/src/lib/components/sidebar/DarkModeToggle.svelte index e570edcdd9..f078968a77 100644 --- a/frontend/src/lib/components/sidebar/DarkModeToggle.svelte +++ b/frontend/src/lib/components/sidebar/DarkModeToggle.svelte @@ -14,14 +14,8 @@ darkMode = false } } - -
- + {#if !$enterpriseLicense}
@@ -273,8 +274,8 @@ @@ -283,7 +284,7 @@
{/if}
- {#each groupedWorkers as worker_group} + {#each groupedWorkers as worker_group (worker_group[0])} - {#each Object.entries(workerGroups ?? {}).filter((x) => !groupedWorkers.some((y) => y[0] == x[0])) as worker_group} + {#each Object.entries(workerGroups ?? {}).filter((x) => !groupedWorkers.some((y) => y[0] == x[0])) as worker_group (worker_group[0])} { loadWorkerGroups() diff --git a/frontend/src/routes/(root)/+layout.svelte b/frontend/src/routes/(root)/+layout.svelte index ce149e725f..e79964f8ca 100644 --- a/frontend/src/routes/(root)/+layout.svelte +++ b/frontend/src/routes/(root)/+layout.svelte @@ -1,7 +1,7 @@ + + + + + +
+
+
+ +
+
+ {currentScript?.path ?? 'Not editing a script'} + {currentScript?.language ?? ''} +
+
+ {#if $userStore} + As {$userStore?.username} in {$workspaceStore} + {:else} + Unable to login + {/if} +
+ + {#if !validCode} +
Invalid code
+ {/if} +
+ {#if testIsLoading} + + {:else} + + {/if} +
+ + +
+
+ +
+
+ + + + + +
+
diff --git a/frontend/src/routes/scripts/p/dev/+page.js b/frontend/src/routes/scripts/p/dev/+page.js new file mode 100644 index 0000000000..e69de29bb2 diff --git a/frontend/src/routes/(root)/(logged)/scripts/dev/+page.svelte b/frontend/src/routes/scripts/p/dev/+page.svelte similarity index 96% rename from frontend/src/routes/(root)/(logged)/scripts/dev/+page.svelte rename to frontend/src/routes/scripts/p/dev/+page.svelte index 74fab6d915..313dfabd40 100644 --- a/frontend/src/routes/(root)/(logged)/scripts/dev/+page.svelte +++ b/frontend/src/routes/scripts/p/dev/+page.svelte @@ -11,6 +11,7 @@ import { faPlay } from '@fortawesome/free-solid-svg-icons' import { Pane, Splitpanes } from 'svelte-splitpanes' import { onDestroy, onMount } from 'svelte' + import DarkModeToggle from '$lib/components/sidebar/DarkModeToggle.svelte' let testJobLoader: TestJobLoader @@ -160,10 +161,14 @@
+
+ +
{currentScript?.path ?? 'Not editing a script'} {currentScript?.language ?? ''}
+ {#if !validCode}
Invalid code
{/if}