windmill-components 1.623.1 → 1.642.0

package/package/components/DeployToSetting.svelte

@@ -7,9 +7,12 @@ 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);
+import { validateDeployPathFilters } from '../validators/workspaceSettings';
+import Alert from './common/alert/Alert.svelte';
+import SettingsFooter from './workspaceSettings/SettingsFooter.svelte';
+import SettingCard from './instanceSettings/SettingCard.svelte';
+import Select from './select/Select.svelte';
+let deployableWorkspaces = $derived($usersWorkspaceStore?.workspaces.map((w) => w.id).filter((w) => w != $workspaceStore));
 const all_ok = {
     scripts: true,
     flows: true,
@@ -19,11 +22,20 @@ const all_ok = {
     secrets: true,
     triggers: true
 };
-export let workspaceToDeployTo;
-export let deployUiSettings = {
+let { workspaceToDeployTo = $bindable(), deployUiSettings = $bindable({
     include_path: [],
     include_type: all_ok
-};
+}), hasUnsavedChanges = false, onSave, onDiscard, onWorkspaceToDeployToSave } = $props();
+// Validation state
+let pathValidationErrors = $state({});
+let hasValidationErrors = $derived(Object.keys(pathValidationErrors).length > 0);
+// Validate path filters whenever they change
+$effect(() => {
+    if (deployUiSettings?.include_path) {
+        const validationResult = validateDeployPathFilters(deployUiSettings.include_path);
+        pathValidationErrors = validationResult.errors;
+    }
+});
 function deployUITypeMapToArray(typesMap, expectedValue) {
     let result = [];
     if (typesMap.scripts == expectedValue) {
@@ -49,140 +61,188 @@ function deployUITypeMapToArray(typesMap, expectedValue) {
     }
     return result;
 }
+async function editWorkspaceToDeployTo() {
+    try {
+        await WorkspaceService.editDeployTo({
+            workspace: $workspaceStore ?? '',
+            requestBody: { deploy_to: workspaceToDeployTo === '' ? undefined : workspaceToDeployTo }
+        });
+        if (workspaceToDeployTo === '' || workspaceToDeployTo === undefined) {
+            sendUserToast('Disabled setting deployable workspace');
+            onWorkspaceToDeployToSave?.(undefined);
+        }
+        else {
+            sendUserToast('Set deployable workspace to ' + workspaceToDeployTo);
+            onWorkspaceToDeployToSave?.(workspaceToDeployTo);
+        }
+    }
+    catch (error) {
+        sendUserToast(`Failed to save workspace deployment setting: ${error}`, true);
+    }
+}
 async function editWindmillDeploymentUISettings() {
+    // Validate before saving
+    const validationResult = validateDeployPathFilters(deployUiSettings.include_path);
+    if (!validationResult.isValid) {
+        sendUserToast('Please fix validation errors before saving', true);
+        return;
+    }
     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
+    try {
+        // Save workspace to deploy to first
+        await editWorkspaceToDeployTo();
+        // Then save deployment UI settings
+        await WorkspaceService.editWorkspaceDeployUiSettings({
+            workspace: $workspaceStore,
+            requestBody: {
+                deploy_ui_settings: {
+                    include_path: include_path,
+                    include_type: include_type
+                }
             }
-        }
-    });
-    sendUserToast('Workspace Deployment UI settings updated');
+        });
+        sendUserToast('Workspace Deployment UI settings updated');
+        onSave?.();
+    }
+    catch (error) {
+        sendUserToast(`Failed to save deployment settings: ${error}`, true);
+    }
 }
 </script>
 
-<h3 class="mt-6 text-xs font-semibold text-emphasis">Workspace to link to</h3>
-<div class="flex min-w-0 mt-1">
-	<select
+<SettingCard label="Workspace to link to" class="mt-6">
+	<Select
+		items={[
+			{ label: 'Disable deployment', value: '' },
+			...(deployableWorkspaces ?? []).map((w) => ({ label: w, value: w }))
+		]}
 		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 text-sm font-semibold text-emphasis">Deployable items</h3>
-<div class="flex flex-wrap gap-20">
-	<div class="max-w-md w-full">
-		{#if Array.isArray(deployUiSettings?.include_path)}
+		placeholder={deployableWorkspaces?.length === 0
+			? 'No workspace deployable to'
+			: 'Select workspace'}
+	/>
+</SettingCard>
+<SettingCard
+	label="Deployable items"
+	description="You can filter which items can be deployed to the production workspace. By default everything is deployable."
+	class="mt-6"
+>
+	<div class="flex flex-wrap gap-6 mt-2">
+		<div class="max-w-md w-full">
+			{#if Array.isArray(deployUiSettings?.include_path)}
+				<h4 class="flex gap-2 mb-2 text-xs font-semibold text-emphasis"
+					>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 _, idx}
+					<div class="flex flex-col mt-1">
+						<div class="flex items-center">
+							<input
+								type="text"
+								bind:value={deployUiSettings.include_path[idx]}
+								id="arg-input-array-{idx}"
+								class="flex-1 {pathValidationErrors[idx] ? 'border-red-500' : ''}"
+								placeholder="e.g., f/*, u/admin/**"
+							/>
+							<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"
+								onclick={() => {
+									deployUiSettings.include_path.splice(idx, 1)
+									deployUiSettings.include_path = [...deployUiSettings.include_path]
+									// Clear validation error for this index
+									delete pathValidationErrors[idx]
+									pathValidationErrors = { ...pathValidationErrors }
+								}}
+							>
+								<X size={14} />
+							</button>
+						</div>
+						{#if pathValidationErrors[idx]}
+							<div class="text-xs text-red-600 dark:text-red-400 mt-1"
+								>{pathValidationErrors[idx]}</div
+							>
+						{/if}
+					</div>
+				{/each}
+			{/if}
+			<div class="flex mt-2">
+				<Button
+					variant="default"
+					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-2 text-xs font-semibold text-emphasis"
-				>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.
+				>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
 			>
-			{#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="default"
-				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-2 text-xs font-semibold text-emphasis"
-			>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">
+			<div class="flex flex-col gap-2 mt-1">
 				<Toggle
-					bind:checked={deployUiSettings.include_type.variables}
-					on:change={(ev) => {
-						if (!ev.detail) {
-							deployUiSettings.include_type.secrets = false
-						}
-					}}
-					options={{ right: 'Variables ' }}
+					bind:checked={deployUiSettings.include_type.scripts}
+					options={{ right: 'Scripts' }}
 				/>
-				<span>-</span>
+				<Toggle bind:checked={deployUiSettings.include_type.flows} options={{ right: 'Flows' }} />
+				<Toggle bind:checked={deployUiSettings.include_type.apps} options={{ right: 'Apps' }} />
 				<Toggle
-					disabled={!deployUiSettings.include_type.variables}
-					bind:checked={deployUiSettings.include_type.secrets}
-					options={{ left: 'Include secrets' }}
+					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>
+				<Toggle
+					bind:checked={deployUiSettings.include_type.triggers}
+					options={{ right: 'Trigger' }}
 				/>
 			</div>
-			<Toggle
-				bind:checked={deployUiSettings.include_type.triggers}
-				options={{ right: 'Trigger' }}
-			/>
 		</div>
 	</div>
-</div>
+</SettingCard>
+{#if hasValidationErrors}
+	<Alert type="error" title="Validation Errors" class="mt-4">
+		Please fix the validation errors in the path filters before saving.
+	</Alert>
+{/if}
 {#if $enterpriseLicense}
-	<div class="flex mt-5 mb-5 gap-1">
-		<Button
-			variant="accent"
-			disabled={workspaceToDeployTo == undefined}
-			on:click={() => {
-				editWindmillDeploymentUISettings()
-			}}>Save Deployment UI settings</Button
-		>
-	</div>
+	<SettingsFooter
+		{hasUnsavedChanges}
+		onSave={editWindmillDeploymentUISettings}
+		{onDiscard}
+		saveLabel="Save deployment UI"
+		disabled={workspaceToDeployTo == undefined || hasValidationErrors}
+		class="mt-8"
+	/>
 {/if}

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

@@ -1,32 +1,23 @@
-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;
-}
-declare const DeployToSetting: $$__sveltets_2_IsomorphicComponent<{
+type DeployUITypeMap = {
+    scripts: boolean;
+    flows: boolean;
+    apps: boolean;
+    resources: boolean;
+    variables: boolean;
+    secrets: boolean;
+    triggers: boolean;
+};
+type $$ComponentProps = {
     workspaceToDeployTo: string | undefined;
-    deployUiSettings?: {
+    deployUiSettings: {
         include_path: string[];
-        include_type: {
-            scripts: boolean;
-            flows: boolean;
-            apps: boolean;
-            resources: boolean;
-            variables: boolean;
-            secrets: boolean;
-            triggers: boolean;
-        };
+        include_type: DeployUITypeMap;
     };
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type DeployToSetting = InstanceType<typeof DeployToSetting>;
+    hasUnsavedChanges?: boolean;
+    onSave?: () => void;
+    onDiscard: () => void;
+    onWorkspaceToDeployToSave?: (workspaceToDeployTo: string | undefined) => void;
+};
+declare const DeployToSetting: import("svelte").Component<$$ComponentProps, {}, "workspaceToDeployTo" | "deployUiSettings">;
+type DeployToSetting = ReturnType<typeof DeployToSetting>;
 export default DeployToSetting;

package/package/components/DeployWorkspace.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">import { createEventDispatcher, untrack } from 'svelte';
 import { base } from '../base';
 import { enterpriseLicense, superadmin, workspaceStore } from '../stores';
-import { AppService, FlowService, FolderService, RawAppService, ResourceService, ScheduleService, ScriptService, UserService, VariableService, WorkspaceService } from '../gen';
+import { AppService, FlowService, FolderService, ResourceService, ScheduleService, ScriptService, UserService, VariableService, WorkspaceService } from '../gen';
 import { getAllModules } from './flows/flowExplorer';
 import Button from './common/button/Button.svelte';
 import Tooltip from './Tooltip.svelte';
@@ -14,8 +14,8 @@ import { existsTrigger, getTriggerDependency, getTriggersDeployData, getTriggerV
 import { getAllGridItems } from './apps/editor/appUtils';
 import { isRunnableByPath } from './apps/inputType';
 const dispatch = createEventDispatcher();
-let { kind, initialPath = '', additionalInformation = undefined, workspaceToDeployTo = $bindable(undefined), hideButton = false } = $props();
-let seeTarget = $state(undefined);
+let { kind, initialPath = '', additionalInformation = undefined, workspaceToDeployTo = $bindable(undefined), hideButton = false, canDeployToWorkspace = $bindable(false) } = $props();
+let canSeeTarget = $state(undefined);
 let dependencies = $state(undefined);
 const allAlreadyExists = $state({});
 let diffDrawer = $state(undefined);
@@ -26,13 +26,20 @@ async function reload(path) {
         if (!$superadmin) {
             await UserService.whoami({ workspace: workspaceToDeployTo });
         }
-        seeTarget = true;
+        canSeeTarget = 'yes';
     }
     catch {
-        seeTarget = false;
+        canSeeTarget = 'cant-deploy-to-workspace';
+        return;
+    }
+    let allDeps;
+    try {
+        allDeps = await getDependencies(kind, path);
+    }
+    catch {
+        canSeeTarget = 'cant-see-all-deps';
         return;
     }
-    const allDeps = await getDependencies(kind, path);
     let sortedSet = [];
     allDeps.forEach((x) => {
         if (!sortedSet.find((y) => y.kind == x.kind && y.path == x.path)) {
@@ -97,20 +104,34 @@ async function getDependencies(kind, path) {
         }
         else if (kind == 'app') {
             const app = await AppService.getAppByPath({ workspace: $workspaceStore, path });
-            console.log('app', app);
-            let appValue = app.value;
             let result = [];
-            getAllGridItems(appValue).forEach((gridItem) => {
-                const ci = gridItem.data.componentInput;
-                if (ci?.type == 'runnable' && isRunnableByPath(ci.runnable)) {
-                    if (ci.runnable.runType == 'script') {
-                        result.push({ kind: 'script', path: ci.runnable.path });
-                    }
-                    else if (ci.runnable.runType == 'flow') {
-                        result.push({ kind: 'flow', path: ci.runnable.path });
+            if (app.raw_app) {
+                const rawAppValue = app.value;
+                for (const runnable of Object.values(rawAppValue.runnables ?? {})) {
+                    if (isRunnableByPath(runnable)) {
+                        if (runnable.runType == 'script') {
+                            result.push({ kind: 'script', path: runnable.path });
+                        }
+                        else if (runnable.runType == 'flow') {
+                            result.push({ kind: 'flow', path: runnable.path });
+                        }
                     }
                 }
-            });
+            }
+            else {
+                let appValue = app.value;
+                getAllGridItems(appValue).forEach((gridItem) => {
+                    const ci = gridItem.data.componentInput;
+                    if (ci?.type == 'runnable' && isRunnableByPath(ci.runnable)) {
+                        if (ci.runnable.runType == 'script') {
+                            result.push({ kind: 'script', path: ci.runnable.path });
+                        }
+                        else if (ci.runnable.runType == 'flow') {
+                            result.push({ kind: 'flow', path: ci.runnable.path });
+                        }
+                    }
+                });
+            }
             return result;
         }
         else if (kind == 'resource') {
@@ -173,12 +194,6 @@ async function checkAlreadyExists(kind, path) {
             path: path
         });
     }
-    else if (kind == 'raw_app') {
-        exists = await RawAppService.existsRawApp({
-            workspace: workspaceToDeployTo,
-            path: path
-        });
-    }
     else if (kind == 'variable') {
         exists = await VariableService.existsVariable({
             workspace: workspaceToDeployTo,
@@ -293,21 +308,70 @@ async function deploy(kind, path) {
                 path: path
             });
             if (alreadyExists) {
-                await AppService.updateApp({
-                    workspace: workspaceToDeployTo,
-                    path: path,
-                    requestBody: {
-                        ...app
-                    }
-                });
+                if (app.raw_app) {
+                    const secret = await AppService.getPublicSecretOfLatestVersionOfApp({
+                        workspace: $workspaceStore,
+                        path: app.path
+                    });
+                    const js = await AppService.getRawAppData({
+                        secretWithExtension: `${secret}.js`,
+                        workspace: $workspaceStore
+                    });
+                    const css = await AppService.getRawAppData({
+                        secretWithExtension: `${secret}.css`,
+                        workspace: $workspaceStore
+                    });
+                    await AppService.updateAppRaw({
+                        workspace: workspaceToDeployTo,
+                        path: path,
+                        formData: {
+                            app,
+                            css,
+                            js
+                        }
+                    });
+                }
+                else {
+                    await AppService.updateApp({
+                        workspace: workspaceToDeployTo,
+                        path: path,
+                        requestBody: {
+                            ...app
+                        }
+                    });
+                }
             }
             else {
-                await AppService.createApp({
-                    workspace: workspaceToDeployTo,
-                    requestBody: {
-                        ...app
-                    }
-                });
+                if (app.raw_app) {
+                    const secret = await AppService.getPublicSecretOfLatestVersionOfApp({
+                        workspace: $workspaceStore,
+                        path: app.path
+                    });
+                    const js = await AppService.getRawAppData({
+                        secretWithExtension: `${secret}.js`,
+                        workspace: $workspaceStore
+                    });
+                    const css = await AppService.getRawAppData({
+                        secretWithExtension: `${secret}.css`,
+                        workspace: $workspaceStore
+                    });
+                    await AppService.createAppRaw({
+                        workspace: workspaceToDeployTo,
+                        formData: {
+                            app,
+                            css,
+                            js
+                        }
+                    });
+                }
+                else {
+                    await AppService.createApp({
+                        workspace: workspaceToDeployTo,
+                        requestBody: {
+                            ...app
+                        }
+                    });
+                }
             }
         }
         else if (kind == 'variable') {
@@ -395,22 +459,6 @@ async function deploy(kind, path) {
                 });
             }
         }
-        else if (kind == 'raw_app') {
-            throw new Error('Raw app deploy not implemented yet');
-            // const app = await RawAppService.getRawAppData({
-            // 	workspace: $workspaceStore!,
-            // 	path: path
-            // })
-            // if (alreadyExists) {
-            // }
-            // await RawAppService.updateRawApp({
-            // 	workspace: $workspaceStore!,
-            // 	path: path,
-            // 	requestBody: {
-            // 		path: path
-            // 	}
-            // })
-        }
         else if (kind == 'folder') {
             await FolderService.createFolder({
                 workspace: workspaceToDeployTo,
@@ -517,22 +565,6 @@ async function getValue(kind, path, workspace) {
             });
             return resource.schema;
         }
-        else if (kind == 'raw_app') {
-            throw new Error('Raw app deploy not implemented yet');
-            // const app = await RawAppService.getRawAppData({
-            // 	workspace: workspace,
-            // 	path: path
-            // })
-            // if (alreadyExists) {
-            // }
-            // await RawAppService.updateRawApp({
-            // 	workspace: workspace,
-            // 	path: path,
-            // 	requestBody: {
-            // 		path: path
-            // 	}
-            // })
-        }
         else if (kind == 'folder') {
             const folder = await FolderService.getFolder({
                 workspace: workspace,
@@ -607,10 +639,10 @@ $effect(() => {
 	>
 	<input class="max-w-xs" type="text" disabled value={workspaceToDeployTo} />
 
-	{#if seeTarget == undefined}
+	{#if canSeeTarget == undefined}
 		<div class="mt-6"></div>
 		<Loader2 class="animate-spin" />
-	{:else if seeTarget == true}
+	{:else if canSeeTarget == 'yes'}
 		<h3 class="mb-6 mt-16">All related deployable items</h3>
 
 		<DiffDrawer bind:this={diffDrawer} {isFlow} />
@@ -676,7 +708,7 @@ $effect(() => {
 							>
 						{/if}
 					{:else}
-						<Button color="light" size="xs" on:click={() => deploy(kind, path)}>Deploy</Button>
+						<Button color="light" size="xs" disabled={!canDeployToWorkspace} on:click={() => deploy(kind, path)}>Deploy</Button>
 					{/if}
 				</div>
 			{/each}
@@ -684,9 +716,16 @@ $effect(() => {
 
 		{#if !hideButton}
 			<div class="mt-16 flex flex-row-reverse max-w-3xl"
-				><Button on:click={deployAll}>Deploy all toggled</Button></div
+				><Button on:click={deployAll} disabled={!canDeployToWorkspace}>Deploy all toggled</Button></div
 			>
 		{/if}
+	{:else if canSeeTarget == 'cant-see-all-deps'}
+		<div class="my-2"></div>
+		<Alert type="error" title="User doesn't have visibility over all dependencies"
+			>You do not have visibility over some of the dependencies of this item. Ask a permissioned
+			user to deploy this item using the shareable link or get the proper permissions on the
+			dependencies</Alert
+		>
 	{:else}
 		<div class="my-2"></div>
 		<Alert type="error" title="User not allowed to deploy to this workspace"