windmill-components 1.623.1 → 1.642.0

package/package/components/LogViewer.svelte

@@ -1,9 +1,11 @@
 <script lang="ts" module>"use strict";
 const s3LogPrefixes = [
-    '\n[windmill] Previous logs have been saved to object storage at logs/',
-    '\n[windmill] Previous logs have been saved to disk at logs/',
-    '\n[windmill] No object storage set in instance settings. Previous logs have been saved to disk at logs/'
+    '[windmill] Previous logs have been saved to object storage at logs/',
+    '[windmill] Previous logs have been saved to disk at logs/',
+    '[windmill] No object storage set in instance settings. Previous logs have been saved to disk at logs/'
 ];
+// Only search within first N characters to avoid expensive full-content scans
+const S3_LOG_SEARCH_LIMIT = 2000;
 </script>
 
 <script lang="ts">import { ClipboardCopy, Download, Expand, Loader2 } from 'lucide-svelte';
@@ -28,33 +30,60 @@ let LOG_INC = 10000;
 let LOG_LIMIT = $state(LOG_INC);
 let lastJobId = $state(jobId);
 let loadedFromObjectStore = $state('');
-function findPrefixIndex(truncateContent) {
-    let index = s3LogPrefixes.findIndex((x) => truncateContent.startsWith(x));
-    if (index == -1) {
+function findPrefixInfo(truncateContent) {
+    // Quick check - [windmill] is rare, so bail early in the common case
+    // This is much faster than doing 3 long string indexOf searches
+    const windmillPos = truncateContent.indexOf('[windmill]');
+    if (windmillPos === -1 || windmillPos >= S3_LOG_SEARCH_LIMIT) {
         return undefined;
     }
-    return index;
+    // Found [windmill] marker, now determine which specific prefix matches
+    for (let i = 0; i < s3LogPrefixes.length; i++) {
+        const prefix = s3LogPrefixes[i];
+        if (truncateContent.length >= windmillPos + prefix.length &&
+            truncateContent.startsWith(prefix, windmillPos)) {
+            return { prefixIndex: i, position: windmillPos };
+        }
+    }
+    return undefined;
 }
-function findStartUrl(truncateContent, prefixIndex = undefined) {
-    if (prefixIndex == undefined) {
+function findStartUrl(truncateContent, prefixInfo) {
+    if (!prefixInfo) {
         return undefined;
     }
-    const end = truncateContent.substring(1).indexOf('\n');
-    return prefixIndex != undefined && truncateContent
-        ? truncateContent.substring(s3LogPrefixes[prefixIndex]?.length, end == -1 ? undefined : end + 1)
-        : undefined;
+    const { prefixIndex, position } = prefixInfo;
+    const prefix = s3LogPrefixes[prefixIndex];
+    const startOfPath = position + prefix.length;
+    const endOfLine = truncateContent.indexOf('\n', startOfPath);
+    return truncateContent.substring(startOfPath, endOfLine === -1 ? undefined : endOfLine);
+}
+function splitAtWindmillLine(content, prefixInfo) {
+    const { prefixIndex, position } = prefixInfo;
+    const prefix = s3LogPrefixes[prefixIndex];
+    // Find line boundaries
+    const lineStart = position > 0 && content[position - 1] === '\n' ? position - 1 : position;
+    const pathStart = position + prefix.length;
+    const lineEnd = content.indexOf('\n', pathStart);
+    if (lineEnd === -1) {
+        // [windmill] line is at the end
+        return { before: content.substring(0, lineStart), after: '' };
+    }
+    return {
+        before: content.substring(0, lineStart),
+        after: content.substring(lineEnd)
+    };
 }
-function tooltipText(prefixIndex) {
-    if (prefixIndex == undefined) {
+function tooltipText(prefixInfo) {
+    if (prefixInfo == undefined) {
         return 'No path/file detected to download from';
     }
-    else if (prefixIndex == 0) {
+    else if (prefixInfo.prefixIndex == 0) {
         return 'Download the previous logs from the instance configured object store';
     }
-    else if (prefixIndex == 1) {
+    else if (prefixInfo.prefixIndex == 1) {
         return 'Attempt to download the logs from disk. Assume there is a shared disk between the workers and the server at /tmp/windmill/logs. Upgrade to EE to use an object store such as S3 instead of a shared volume.';
     }
-    else if (prefixIndex == 2) {
+    else if (prefixInfo.prefixIndex == 2) {
         return 'Attempt to download the logs from disk. Assume there is a shared disk between the workers and the server at /tmp/windmill/logs. Since you are on EE, you can alternatively use an object store such as S3 configured in the instance settings instead of a shared volume..';
     }
 }
@@ -77,7 +106,6 @@ async function getStoreLogs() {
             workspace: $workspaceStore ?? '',
             path: downloadStartUrl
         }));
-        downloadStartUrl = undefined;
         LOG_LIMIT += Math.min(LOG_INC, res.length);
         loadedFromObjectStore = res + loadedFromObjectStore;
         let newC = truncateContent(content, loadedFromObjectStore, LOG_LIMIT);
@@ -105,14 +133,36 @@ $effect.pre(() => {
     }
 });
 let truncatedContent = $derived(truncateContent(content, loadedFromObjectStore, LOG_LIMIT));
-let prefixIndex = $derived(findPrefixIndex(truncatedContent));
-let downloadStartUrl = $derived(findStartUrl(truncatedContent, prefixIndex));
+let prefixInfo = $derived(findPrefixInfo(truncatedContent));
+let downloadStartUrl = $derived(findStartUrl(truncatedContent, prefixInfo));
 $effect.pre(() => {
     truncatedContent && scrollToBottom();
 });
-let html = $derived(ansi_up.ansi_to_html(downloadStartUrl && prefixIndex != undefined
-    ? truncatedContent.substring(truncatedContent.substring(1).indexOf('\n') + 2, truncatedContent.length)
-    : truncatedContent));
+// When [windmill] line is NOT at start, split into before/after to render button inline
+let splitHtml = $derived.by(() => {
+    if (prefixInfo == undefined || prefixInfo.position === 0) {
+        return undefined;
+    }
+    const { before, after } = splitAtWindmillLine(truncatedContent, prefixInfo);
+    return {
+        before: ansi_up.ansi_to_html(before),
+        after: ansi_up.ansi_to_html(after)
+    };
+});
+// Only compute html when splitHtml won't be used (avoids wasteful ansi_to_html call)
+let html = $derived.by(() => {
+    if (splitHtml) {
+        // splitHtml is active - skip expensive computation
+        return '';
+    }
+    if (prefixInfo == undefined) {
+        // No [windmill] line - return full content
+        return ansi_up.ansi_to_html(truncatedContent);
+    }
+    // [windmill] at start - strip the line and return the rest
+    const { after } = splitAtWindmillLine(truncatedContent, prefixInfo);
+    return ansi_up.ansi_to_html(after);
+});
 </script>
 
 <Drawer bind:this={logViewer} bind:open={drawerOpen} size="900px">
@@ -148,12 +198,15 @@ let html = $derived(ansi_up.ansi_to_html(downloadStartUrl && prefixIndex != unde
 				class="bg-surface-secondary text-primary text-xs w-full p-2 whitespace-pre-wrap border rounded-md"
 				>{#if content}{@const len =
 						(content?.length ?? 0) +
-						(loadedFromObjectStore?.length ?? 0)}{#if downloadStartUrl}<button
+						(loadedFromObjectStore?.length ?? 0)}{#if splitHtml}{@html splitHtml.before}<button
+								onclick={getStoreLogs}
+								>Show more... <Tooltip>{tooltipText(prefixInfo)}</Tooltip></button
+							>{@html splitHtml.after}{:else if downloadStartUrl}<button
 							onclick={getStoreLogs}
-							>Show more... <Tooltip>{tooltipText(prefixIndex)}</Tooltip></button
-						><br />{:else if len > LOG_LIMIT}(truncated to the last {LOG_LIMIT} characters)...<br
+							>Show more... <Tooltip>{tooltipText(prefixInfo)}</Tooltip></button
+						><br />{@html html}{:else if len > LOG_LIMIT}(truncated to the last {LOG_LIMIT} characters)...<br
 						/><button onclick={() => showMoreTruncate(len)}>Show more..</button><br
-						/>{/if}{@html html}{:else if isLoading}Waiting for job to start...{:else}No logs are available yet{/if}</pre
+						/>{@html html}{:else}{@html html}{/if}{:else if isLoading}Waiting for job to start...{:else}No logs are available yet{/if}</pre
 			>
 		</div>
 	</DrawerContent>
@@ -230,13 +283,18 @@ let html = $derived(ansi_up.ansi_to_html(downloadStartUrl && prefixIndex != unde
 				)}
 				>{#if content}{@const len =
 						(content?.length ?? 0) +
-						(loadedFromObjectStore?.length ?? 0)}{#if downloadStartUrl}<button
+						(loadedFromObjectStore?.length ?? 0)}{#if splitHtml}<span>{@html splitHtml.before}</span><button
+								onclick={getStoreLogs}
+								>Show more... &nbsp;<Tooltip>{tooltipText(prefixInfo)}</Tooltip></button
+							><span>{@html splitHtml.after}</span
+						>{:else if downloadStartUrl}<button
 							onclick={getStoreLogs}
-							>Show more... &nbsp;<Tooltip>{tooltipText(prefixIndex)}</Tooltip></button
-						><br />{:else if len > LOG_LIMIT}<button onclick={() => showMoreTruncate(len)}
+							>Show more... &nbsp;<Tooltip>{tooltipText(prefixInfo)}</Tooltip></button
+						><br /><span>{@html html}</span
+						>{:else if len > LOG_LIMIT}<button onclick={() => showMoreTruncate(len)}
 							>Show more..</button
-						>&nbsp;({LOG_LIMIT}/{len} chars)<br />{/if}<span>{@html html}</span
-					>{:else if !isLoading}<span>{customEmptyMessage}</span>{/if}</pre
+						>&nbsp;({LOG_LIMIT}/{len} chars)<br /><span>{@html html}</span
+						>{:else}<span>{@html html}</span>{/if}{:else if !isLoading}<span>{customEmptyMessage}</span>{/if}</pre
 			>
 		</div>
 	</div>

package/package/components/Login.svelte

@@ -6,6 +6,7 @@ import Microsoft from './icons/brands/Microsoft.svelte';
 import Okta from './icons/brands/Okta.svelte';
 import Auth0 from './icons/brands/Auth0.svelte';
 import NextcloudIcon from './icons/NextcloudIcon.svelte';
+import PocketIdIcon from './icons/PocketIdIcon.svelte';
 import { OauthService, UserService, WorkspaceService } from '../gen';
 import { usersWorkspaceStore, workspaceStore, userStore } from '../stores';
 import { classNames, emptyString, escapeHtml, parseQueryParams } from '../utils';
@@ -54,12 +55,18 @@ const providers = [
         type: 'nextcloud',
         name: 'Nextcloud',
         icon: NextcloudIcon
+    },
+    {
+        type: 'pocketid',
+        name: 'Pocket ID',
+        icon: PocketIdIcon
     }
 ];
 const providersType = providers.map((p) => p.type);
 let showPassword = $state(false);
 let logins = $state(undefined);
 let saml = $state(undefined);
+let smtpConfigured = $state(undefined);
 async function login() {
     if (!email || !password) {
         sendUserToast('Please fill in both email and password', true);
@@ -159,6 +166,22 @@ async function loadLogins() {
     }
 }
 loadLogins();
+$effect(() => {
+    if (firstTime && !email && !password) {
+        email = 'admin@windmill.dev';
+        password = 'changeme';
+    }
+});
+async function checkSmtpConfigured() {
+    try {
+        smtpConfigured = await UserService.isSmtpConfigured();
+    }
+    catch (err) {
+        console.error('Could not check if SMTP is configured', err);
+        smtpConfigured = false;
+    }
+}
+checkSmtpConfigured();
 function handleKeyUp(event) {
     const key = event.key;
     if (key === 'Enter') {
@@ -304,9 +327,9 @@ $effect(() => {
 	{#if showPassword}
 		<div>
 			{#if firstTime}
-				<div class="text-lg text-center w-full pb-6 text-emphasis"
-					>First time login: admin@windmill.dev / changeme</div
-				>
+				<p class="text-xs text-center w-full pb-4 text-secondary">
+					Welcome! Default credentials admin@windmill.dev / changeme have been prefilled.
+				</p>
 			{/if}
 			<div class="space-y-6">
 				{#if isCloudHosted()}
@@ -333,6 +356,16 @@ $effect(() => {
 							autocomplete="current-password"
 						/>
 					</div>
+					{#if smtpConfigured}
+						<div class="text-right pt-1">
+							<a
+								href="{base}/user/forgot-password"
+								class="text-2xs text-blue-500 hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-300"
+							>
+								Forgot password?
+							</a>
+						</div>
+					{/if}
 				</div>
 
 				<div class="pt-2">

package/package/components/ManualPopover.svelte

@@ -2,12 +2,11 @@
 import Portal from './Portal.svelte';
 import { fade } from 'svelte/transition';
 import { twMerge } from 'tailwind-merge';
-export let placement = 'bottom';
-const [popperRef, popperContent, getInstance] = createPopperActions({ placement });
 export async function refresh() {
     await getInstance()?.update();
 }
-export let showTooltip = false;
+let { placement = 'bottom', class: clazz = '', showTooltip = $bindable(false), children, content } = $props();
+const [popperRef, popperContent, getInstance] = createPopperActions({ placement });
 export function open() {
     showTooltip = true;
 }
@@ -17,16 +16,16 @@ export function close() {
 </script>
 
 <fragment use:popperRef>
-	<slot />
+	{@render children?.()}
 </fragment>
 {#if showTooltip}
 	<Portal name="manual-popover">
 		<div
 			use:popperContent
-			class={twMerge('z-[901] rounded-lg shadow-md border p-4 bg-surface', $$props.class)}
+			class={twMerge('z-[901] rounded-lg shadow-md border p-4 bg-surface', clazz)}
 			transition:fade={{ duration: 200 }}
 		>
-			<slot name="content" />
+			{@render content?.()}
 		</div>
 	</Portal>
 {/if}

package/package/components/ManualPopover.svelte.d.ts

@@ -1,41 +1,15 @@
 import type { PopoverPlacement } from './Popover.model';
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
+interface Props {
+    placement?: PopoverPlacement;
+    class?: string;
+    showTooltip?: boolean;
+    children?: import('svelte').Snippet;
+    content?: import('svelte').Snippet;
 }
-type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
-    default: any;
-} ? Props extends Record<string, never> ? any : {
-    children?: any;
-} : {});
-declare const ManualPopover: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
-    [x: string]: any;
-    placement?: PopoverPlacement | undefined;
-    refresh?: (() => Promise<void>) | undefined;
-    showTooltip?: boolean | undefined;
-    open?: (() => void) | undefined;
-    close?: (() => void) | undefined;
-}, {
-    default: {};
-    content: {};
-}>, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-    content: {};
-}, {
+declare const ManualPopover: import("svelte").Component<Props, {
     refresh: () => Promise<void>;
     open: () => void;
     close: () => void;
-}, string>;
-type ManualPopover = InstanceType<typeof ManualPopover>;
+}, "showTooltip">;
+type ManualPopover = ReturnType<typeof ManualPopover>;
 export default ManualPopover;

package/package/components/MemoryFootprintViewer.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">import { MetricsService } from '../gen';
 import { displayTime } from '../utils';
-import { enterpriseLicense, workspaceStore } from '../stores';
+import { workspaceStore } from '../stores';
 import { CategoryScale, Chart as ChartJS, Legend, LinearScale, LineElement, PointElement, Title, Tooltip } from 'chart.js';
 import { Line } from './chartjs-wrappers/chartJs';
 import { Alert } from './common';
@@ -48,11 +48,7 @@ $: jobUpdateLastFetch && loadMetricsData();
 </script>
 
 <div class="relative max-h-100">
-	{#if !$enterpriseLicense}
-		<Alert type="warning" title="Enterprise Edition only feature">
-			Job metrics are only available on Windmill Enterprise Edition.
-		</Alert>
-	{:else if (jobMemoryStats?.length ?? 0) === 0}
+	{#if (jobMemoryStats?.length ?? 0) === 0}
 		<Alert type="info" title="No metric available"
 			>No data points available for this job. Metrics are recorded only for jobs running for more
 			than 500ms.</Alert

package/package/components/ModulePreview.svelte

@@ -4,7 +4,7 @@ import Button from './common/button/Button.svelte';
 import ModulePreviewForm from './ModulePreviewForm.svelte';
 import ModuleTest from './ModuleTest.svelte';
 import { getContext } from 'svelte';
-let { mod, schema, pickableProperties, testJob = $bindable(undefined), testIsLoading = $bindable(false), noEditor = false, scriptProgress = $bindable(undefined), focusArg = undefined, class: className = '', onJobDone } = $props();
+let { mod, schema, pickableProperties, testJob = $bindable(undefined), testIsLoading = $bindable(false), noEditor = false, scriptProgress = $bindable(undefined), focusArg = undefined, class: className = '', onJobDone, hideRunButton = false } = $props();
 const { flowStore } = getContext('FlowEditorContext');
 let moduleTest = $state();
 export function runTestWithStepArgs() {
@@ -29,26 +29,28 @@ export function runTestWithStepArgs() {
 		>
 	{/if}
 
-	<div class="w-full justify-center flex">
-		{#if testIsLoading}
-			<Button size="sm" on:click={moduleTest?.cancelJob} btnClasses="w-full" color="red">
-				<Loader2 size={16} class="animate-spin mr-1" />
-				Cancel
-			</Button>
-		{:else}
-			<Button
-				variant="accent"
-				btnClasses="truncate"
-				size="sm"
-				on:click={runTestWithStepArgs}
-				shortCut={{
-					Icon: CornerDownLeft
-				}}
-			>
-				Run
-			</Button>
-		{/if}
-	</div>
+	{#if !hideRunButton}
+		<div class="w-full justify-center flex">
+			{#if testIsLoading}
+				<Button size="sm" on:click={moduleTest?.cancelJob} btnClasses="w-full" color="red">
+					<Loader2 size={16} class="animate-spin mr-1" />
+					Cancel
+				</Button>
+			{:else}
+				<Button
+					variant="accent"
+					btnClasses="truncate"
+					size="sm"
+					on:click={runTestWithStepArgs}
+					shortCut={{
+						Icon: CornerDownLeft
+					}}
+				>
+					Run
+				</Button>
+			{/if}
+		</div>
+	{/if}
 
 	<ModulePreviewForm {pickableProperties} {mod} {schema} {focusArg} />
 </div>

package/package/components/ModulePreview.svelte.d.ts

@@ -14,6 +14,7 @@ interface Props {
     focusArg?: string;
     class?: string;
     onJobDone?: () => void;
+    hideRunButton?: boolean;
 }
 declare const ModulePreview: import("svelte").Component<Props, {
     runTestWithStepArgs: () => void;

package/package/components/ModuleStatus.svelte

@@ -8,17 +8,17 @@ export let skipped = false;
 </script>
 
 {#if type == 'WaitingForEvents'}
-	<span class="italic text-violet-700 dark:text-violet-400">
-		<Hourglass class="inline" />
+	<span class="italic text-xs text-violet-700 dark:text-violet-400">
+		<Hourglass class="inline" size={14} />
 		Waiting to be resumed by resume events such as approvals
 	</span>
 {:else if type == 'WaitingForPriorSteps'}
-	<span class="italic text-primary">
-		<Hourglass class="inline" />
+	<span class="italic text-xs text-primary">
+		<Hourglass class="inline" size={14} />
 		Waiting for prior steps to complete
 	</span>
 {:else if type == 'WaitingForExecutor'}
-	<span class="italic text-primary">
+	<span class="italic text-xs text-primary">
 		<Hourglass class="inline" />
 		{#if scheduled_for && forLater(scheduled_for.toString())}
 			Job is scheduled to be executed at {displayDate(scheduled_for, true)}

package/package/components/ModuleTest.svelte

@@ -37,13 +37,13 @@ export async function runTest(args) {
         }
     };
     if (val.type == 'rawscript') {
-        await jobLoader?.runPreview(val.path ?? ($pathStore ?? '') + '/' + mod.id, val.content, val.language, mod.id === 'preprocessor' ? { _ENTRYPOINT_OVERRIDE: 'preprocessor', ...args } : args, flowStore?.val?.tag ?? val.tag, undefined, undefined, callbacks);
+        await jobLoader?.runPreview(val.path ?? ($pathStore ?? '') + '/' + mod.id, val.content, val.language, mod.id === 'preprocessor' ? { _ENTRYPOINT_OVERRIDE: 'preprocessor', ...args } : args, flowStore?.val?.tag ?? val.tag, undefined, undefined, callbacks, $pathStore);
     }
     else if (val.type == 'script') {
         const script = val.hash
             ? await ScriptService.getScriptByHash({ workspace: $workspaceStore, hash: val.hash })
             : await getScriptByPath(val.path);
-        await jobLoader?.runPreview(val.path, script.content, script.language, mod.id === 'preprocessor' ? { _ENTRYPOINT_OVERRIDE: 'preprocessor', ...args } : args, flowStore?.val?.tag ?? (val.tag_override ? val.tag_override : script.tag), script.lock, val.hash ?? script.hash, callbacks);
+        await jobLoader?.runPreview(val.path, script.content, script.language, mod.id === 'preprocessor' ? { _ENTRYPOINT_OVERRIDE: 'preprocessor', ...args } : args, flowStore?.val?.tag ?? (val.tag_override ? val.tag_override : script.tag), script.lock, val.hash ?? script.hash, callbacks, $pathStore);
     }
     else if (val.type == 'flow') {
         await jobLoader?.runFlowByPath(val.path, args, callbacks);
@@ -72,7 +72,7 @@ export async function runTest(args) {
             },
             summary: '',
             schema
-        }, callbacks);
+        }, callbacks, $pathStore);
     }
     else {
         throw Error('Not supported module type');

package/package/components/MoveDrawer.svelte

@@ -3,84 +3,46 @@ import { userStore, workspaceStore } from '../stores';
 import { Alert, Button, Drawer } from './common';
 import DrawerContent from './common/drawer/DrawerContent.svelte';
 import Path from './Path.svelte';
-import { AppService, FlowService, RawAppService, ScriptService } from '../gen';
 import { isOwner } from '../utils';
+import { updateItemPathAndSummary, checkFlowOnBehalfOf } from './moveRenameManager';
+import Label from './Label.svelte';
+import TextInput from './text_input/TextInput.svelte';
 const dispatch = createEventDispatcher();
-let kind;
-let initialPath = '';
-let path = undefined;
-let summary = undefined;
-let drawer;
-let own = false;
+let kind = $state('flow');
+let initialPath = $state('');
+let initialSummary = $state('');
+let path = $state(undefined);
+let summary = $state(undefined);
+let dirtyPath = $state(false);
+let drawer = $state();
+let own = $state(false);
+let onBehalfOfEmail = $state(undefined);
+let hasChanges = $derived((summary ?? '') !== initialSummary || dirtyPath);
 export async function openDrawer(initialPath_l, summary_l, kind_l) {
     kind = kind_l;
     path = undefined;
+    dirtyPath = false;
+    onBehalfOfEmail = undefined;
     initialPath = initialPath_l;
+    initialSummary = summary_l ?? '';
     summary = summary_l;
     loadOwner();
     drawer.openDrawer();
+    if (kind === 'flow') {
+        onBehalfOfEmail = await checkFlowOnBehalfOf($workspaceStore, initialPath_l);
+    }
 }
 function loadOwner() {
     own = isOwner(initialPath, $userStore, $workspaceStore);
 }
 async function updatePath() {
-    if (kind == 'flow') {
-        const flow = await FlowService.getFlowByPath({
-            workspace: $workspaceStore,
-            path: initialPath
-        });
-        await FlowService.updateFlow({
-            workspace: $workspaceStore,
-            path: initialPath,
-            requestBody: {
-                path: path ?? '',
-                summary: summary ?? '',
-                description: flow.description,
-                value: flow.value,
-                schema: flow.schema,
-                tag: flow.tag,
-                dedicated_worker: flow.dedicated_worker,
-                ws_error_handler_muted: flow.ws_error_handler_muted,
-                visible_to_runner_only: flow.visible_to_runner_only,
-                on_behalf_of_email: flow.on_behalf_of_email
-            }
-        });
-    }
-    else if (kind == 'script') {
-        const script = await ScriptService.getScriptByPath({
-            workspace: $workspaceStore,
-            path: initialPath
-        });
-        script.summary = summary ?? '';
-        await ScriptService.createScript({
+    if (kind === 'flow' || kind === 'script' || kind === 'app') {
+        await updateItemPathAndSummary({
             workspace: $workspaceStore,
-            requestBody: {
-                ...script,
-                description: script.description ?? '',
-                lock: script.lock,
-                parent_hash: script.hash,
-                path: path ?? ''
-            }
-        });
-    }
-    else if (kind == 'app') {
-        await AppService.updateApp({
-            workspace: $workspaceStore,
-            path: initialPath,
-            requestBody: {
-                path: path != initialPath ? path : undefined,
-                summary
-            }
-        });
-    }
-    else if (kind == 'raw_app') {
-        await RawAppService.updateRawApp({
-            workspace: $workspaceStore,
-            path: initialPath,
-            requestBody: {
-                path: path != initialPath ? path : undefined,
-                summary
-            }
+            kind,
+            initialPath,
+            newPath: path ?? '',
+            newSummary: summary ?? ''
         });
     }
     dispatch('update', path);
@@ -91,24 +53,33 @@ async function updatePath() {
 <Drawer bind:this={drawer}>
 	<DrawerContent title="Move/Rename {initialPath}" on:close={drawer.closeDrawer}>
 		{#if !own}
-			<Alert type="warning" title="Not owner">
+			<Alert type="warning" title="Not owner" class="mb-4">
 				Since you do not own this item, you cannot move this item (you can however fork it)
 			</Alert>
 		{/if}
-		<h2 class="border-b pb-1 mt-2 mb-4">Summary</h2>
-		<input
-			type="text"
-			bind:value={summary}
-			placeholder="Short summary to be displayed when listed"
-			disabled={!own}
-		/>
+		{#if own && onBehalfOfEmail}
+			<Alert type="info" title="Run on behalf of" class="mb-4">
+				This flow will be redeployed on behalf of you ({$userStore?.email}) instead of {onBehalfOfEmail}
+			</Alert>
+		{/if}
+		<Label label="Summary" class="mb-6">
+			<TextInput
+				inputProps={{
+					type: 'text',
+					placeholder: 'Short summary to be displayed when listed',
+					disabled: !own
+				}}
+				bind:value={summary}
+			/>
+		</Label>
 
-		<h2 class="border-b pb-1 mt-10 mb-4">Path</h2>
-		<div class="flex flex-col mb-2 gap-6">
-			<Path disabled={!own} {kind} {initialPath} bind:path />
-		</div>
+		<Label label="Path">
+			<Path disabled={!own} {kind} {initialPath} bind:path bind:dirty={dirtyPath} />
+		</Label>
 		{#snippet actions()}
-			<Button disabled={!own} on:click={updatePath}>Move/Rename</Button>
+			<Button variant="accent" disabled={!own || !hasChanges} on:click={updatePath}
+				>Move/Rename</Button
+			>
 		{/snippet}
 	</DrawerContent>
 </Drawer>