windmill-components 1.677.1 → 1.687.0

package/package/components/select/Select.svelte

@@ -12,7 +12,7 @@ import { deepEqual } from 'fast-equals';
 import { inputBaseClass, inputBorderClass, inputSizeClasses } from '../text_input/TextInput.svelte';
 import { ButtonType } from '../common/button/model';
 import Tooltip from '../Tooltip.svelte';
-let { items, placeholder = 'Please select', value = $bindable(), filterText = $bindable(''), class: className = '', clearable = false, listAutoWidth = true, disabled: _disabled = false, containerStyle = '', inputClass = '', disablePortal = false, loading = false, error = false, autofocus, RightIcon, createText, noItemsMsg, tooltip, open = $bindable(false), id, itemLabelWrapperClasses, itemButtonWrapperClasses, size = 'md', showPlaceholderOnOpen = false, transformInputSelectedText, groupBy, sortBy, onFocus, onBlur, onClear, onCreateItem, startSnippet, endSnippet, bottomSnippet } = $props();
+let { items, placeholder = 'Please select', value = $bindable(), filterText = $bindable(''), class: className = '', clearable = false, listAutoWidth = true, disabled: _disabled = false, containerStyle = '', inputClass = '', disablePortal = false, loading = false, error = false, autofocus, RightIcon, createText, noItemsMsg, tooltip, open = $bindable(false), id, itemLabelWrapperClasses, itemButtonWrapperClasses, size = 'md', showPlaceholderOnOpen = false, dropdownClass, transformInputSelectedText, groupBy, sortBy, onFocus, onBlur, onClear, onCreateItem, startSnippet, endSnippet, bottomSnippet } = $props();
 let disabled = $derived(_disabled || (loading && !value));
 let iconSize = $derived(ButtonType.UnifiedIconSizes[size]);
 let inputEl = $state();
@@ -120,6 +120,7 @@ let inputText = $derived.by(() => {
 		{id}
 	/>
 	<SelectDropdown
+		class={dropdownClass}
 		{disablePortal}
 		onSelectValue={setValue}
 		{open}

package/package/components/select/Select.svelte.d.ts

@@ -31,6 +31,7 @@ declare function $$render<Item extends {
         itemButtonWrapperClasses?: string;
         size?: "sm" | "md" | "lg";
         showPlaceholderOnOpen?: boolean;
+        dropdownClass?: string;
         transformInputSelectedText?: (text: string, value: Item["value"]) => string;
         groupBy?: (item: Item) => string;
         sortBy?: (a: Item, b: Item) => number;

package/package/components/settings/CreateToken.svelte

@@ -9,13 +9,15 @@ import ScopeSelector from './ScopeSelector.svelte';
 import McpScopeSelector from '../mcp/McpScopeSelector.svelte';
 import TextInput from '../text_input/TextInput.svelte';
 import Select from '../select/Select.svelte';
-let { showMcpMode = false, defaultNewTokenWorkspace, scopes, onTokenCreated, newTokenLabel = $bindable(undefined), displayCreateToken = true } = $props();
+let { showMcpMode = false, openWithMcpMode = false, mcpOnly = false, lockWorkspace = false, title = 'Add a new token', defaultNewTokenWorkspace, scopes, onTokenCreated, newTokenLabel = $bindable(undefined), displayCreateToken = true } = $props();
 let newToken = $state(undefined);
 let newMcpToken = $state(undefined);
 let newTokenExpiration = $state(undefined);
 let newTokenWorkspace = $state(untrack(() => defaultNewTokenWorkspace));
 let mcpCreationMode = $state(false);
 let mcpScope = $state('mcp:favorites');
+let lastRequestedMcpMode = $state(undefined);
+let mcpLabelAutofilled = $state(false);
 let customScopes = $state([]);
 let showCustomScopes = $state(false);
 function ensureCurrentWorkspaceIncluded(workspacesList, currentWorkspace) {
@@ -28,6 +30,30 @@ function ensureCurrentWorkspaceIncluded(workspacesList, currentWorkspace) {
     }
     return [{ id: currentWorkspace, name: currentWorkspace }, ...workspacesList];
 }
+function enterMcpMode() {
+    mcpCreationMode = true;
+    newTokenExpiration = undefined;
+    newTokenWorkspace = defaultNewTokenWorkspace ?? $workspaceStore;
+    newToken = undefined;
+    newMcpToken = undefined;
+    if (!newTokenLabel) {
+        newTokenLabel = 'MCP token';
+        mcpLabelAutofilled = true;
+    }
+    else {
+        mcpLabelAutofilled = false;
+    }
+}
+function exitMcpMode() {
+    mcpCreationMode = false;
+    newTokenExpiration = undefined;
+    newTokenWorkspace = defaultNewTokenWorkspace;
+    newMcpToken = undefined;
+    if (mcpLabelAutofilled) {
+        newTokenLabel = undefined;
+    }
+    mcpLabelAutofilled = false;
+}
 async function createToken(mcpMode = false) {
     try {
         let date;
@@ -50,13 +76,17 @@ async function createToken(mcpMode = false) {
             }
         });
         if (mcpMode) {
+            newToken = undefined;
             newMcpToken = `${createdToken}`;
         }
         else {
+            newMcpToken = undefined;
             newToken = `${createdToken}`;
         }
-        onTokenCreated(newToken ?? newMcpToken ?? '');
-        mcpCreationMode = false;
+        onTokenCreated(`${createdToken}`);
+        if (!mcpOnly) {
+            mcpCreationMode = false;
+        }
     }
     catch (err) {
         console.error('Failed to create token:', err);
@@ -64,13 +94,31 @@ async function createToken(mcpMode = false) {
 }
 const workspaces = $derived(ensureCurrentWorkspaceIncluded($userWorkspaces, $workspaceStore));
 const mcpBaseUrl = $derived(`${window.location.origin}/api/mcp/w/${newTokenWorkspace}/mcp?token=`);
+$effect(() => {
+    const requestedMcpMode = mcpOnly || openWithMcpMode;
+    if (requestedMcpMode === lastRequestedMcpMode) {
+        return;
+    }
+    if (requestedMcpMode) {
+        enterMcpMode();
+    }
+    else {
+        exitMcpMode();
+    }
+    lastRequestedMcpMode = requestedMcpMode;
+});
+$effect(() => {
+    if (mcpLabelAutofilled && newTokenLabel !== 'MCP token') {
+        mcpLabelAutofilled = false;
+    }
+});
 </script>
 
 <div>
 	<div class="p-4 rounded-md mb-6 min-w-min bg-surface-tertiary">
-		<h3 class="pb-2 font-semibold text-emphasis text-sm">Add a new token</h3>
+		<h3 class="pb-2 font-semibold text-emphasis text-sm">{title}</h3>
 
-		{#if showMcpMode}
+		{#if showMcpMode && !mcpOnly}
 			<div
 				class="mb-4 flex flex-row flex-shrink-0"
 				use:triggerableByAI={{
@@ -80,15 +128,10 @@ const mcpBaseUrl = $derived(`${window.location.origin}/api/mcp/w/${newTokenWorks
 			>
 				<Toggle
 					on:change={(e) => {
-						mcpCreationMode = e.detail
 						if (e.detail) {
-							newTokenLabel = 'MCP token'
-							newTokenExpiration = undefined
-							newTokenWorkspace = $workspaceStore
+							enterMcpMode()
 						} else {
-							newTokenLabel = undefined
-							newTokenExpiration = undefined
-							newTokenWorkspace = defaultNewTokenWorkspace
+							exitMcpMode()
 						}
 					}}
 					checked={mcpCreationMode}
@@ -133,70 +176,76 @@ const mcpBaseUrl = $derived(`${window.location.origin}/api/mcp/w/${newTokenWorks
 		{/if}
 
 		<div class="mt-2 grid grid-cols-1 md:grid-cols-2 gap-4">
-			{#if mcpCreationMode}
-				<div class="col-span-2">
-					<McpScopeSelector
-						workspaceId={newTokenWorkspace || $workspaceStore || ''}
-						bind:scope={mcpScope}
-					/>
-				</div>
+				{#if mcpCreationMode}
+					<div class="col-span-2">
+						<McpScopeSelector
+							workspaceId={newTokenWorkspace || $workspaceStore || ''}
+							bind:scope={mcpScope}
+						/>
+					</div>
 
-				<div>
-					<span class="block mb-1 text-emphasis text-xs font-semibold">Workspace</span>
-					<Select
-						bind:value={newTokenWorkspace}
-						items={workspaces.map((w) => ({ label: w.name, value: w.id, subtitle: w.id }))}
-					/>
-				</div>
-			{/if}
+					{#if !lockWorkspace}
+						<div>
+							<span class="block mb-1 text-emphasis text-xs font-semibold">Workspace</span>
+							<Select
+								bind:value={newTokenWorkspace}
+								items={workspaces.map((w) => ({ label: w.name, value: w.id, subtitle: w.id }))}
+							/>
+						</div>
+					{/if}
+				{/if}
 
-			<div>
-				<span class="block mb-1 text-emphasis text-xs font-semibold"
-					>Label <span class="text-xs text-primary">(optional)</span></span
-				>
-				<TextInput inputProps={{ type: 'text' }} bind:value={newTokenLabel} class="w-full" />
-			</div>
+				{#if !mcpOnly}
+					<div>
+						<span class="block mb-1 text-emphasis text-xs font-semibold"
+							>Label <span class="text-xs text-primary">(optional)</span></span
+						>
+						<TextInput inputProps={{ type: 'text' }} bind:value={newTokenLabel} class="w-full" />
+					</div>
+				{/if}
 
-			{#if !mcpCreationMode}
-				<div>
-					<span class="block mb-1 text-xs text-emphasis font-semibold"
-						>Expires In <span class="text-xs text-primary">(optional)</span></span
-					>
-					<Select
-						bind:value={newTokenExpiration}
-						placeholder="No expiration"
-						inputClass="w-full"
-						items={[
-							{ label: 'No expiration', value: undefined },
-							{ label: '15 minutes', value: 15 * 60 },
-							{ label: '30 minutes', value: 30 * 60 },
-							{ label: '1 hour', value: 1 * 60 * 60 },
-							{ label: '1 day', value: 1 * 24 * 60 * 60 },
-							{ label: '7 days', value: 7 * 24 * 60 * 60 },
-							{ label: '30 days', value: 30 * 24 * 60 * 60 },
-							{ label: '90 days', value: 90 * 24 * 60 * 60 }
-						]}
-					/>
-				</div>
-			{/if}
+				{#if !mcpCreationMode}
+					<div>
+						<span class="block mb-1 text-xs text-emphasis font-semibold"
+							>Expires In <span class="text-xs text-primary">(optional)</span></span
+						>
+						<Select
+							bind:value={newTokenExpiration}
+							placeholder="No expiration"
+							inputClass="w-full"
+							items={[
+								{ label: 'No expiration', value: undefined },
+								{ label: '15 minutes', value: 15 * 60 },
+								{ label: '30 minutes', value: 30 * 60 },
+								{ label: '1 hour', value: 1 * 60 * 60 },
+								{ label: '1 day', value: 1 * 24 * 60 * 60 },
+								{ label: '7 days', value: 7 * 24 * 60 * 60 },
+								{ label: '30 days', value: 30 * 24 * 60 * 60 },
+								{ label: '90 days', value: 90 * 24 * 60 * 60 }
+							]}
+						/>
+					</div>
+				{/if}
 		</div>
 
 		<div class="mt-4 flex justify-end gap-2 flex-row">
-			<Button
-				on:click={() => {
-					mcpCreationMode = false
-				}}
-				variant="default"
-			>
-				Cancel
-			</Button>
+			{#if !mcpOnly}
+				<Button
+					on:click={() => {
+						exitMcpMode()
+					}}
+					variant="default"
+				>
+					Cancel
+				</Button>
+			{/if}
 			<Button
 				on:click={() => createToken(mcpCreationMode)}
 				disabled={mcpCreationMode &&
 					(newTokenWorkspace == undefined || !mcpScope || mcpScope.trim().length === 0)}
 				variant="accent"
 			>
-				New token
+				{mcpCreationMode ? 'Generate MCP URL' : 'New token'}
 			</Button>
 		</div>
 	</div>

package/package/components/settings/CreateToken.svelte.d.ts

@@ -1,6 +1,9 @@
 interface Props {
     showMcpMode?: boolean;
     openWithMcpMode?: boolean;
+    mcpOnly?: boolean;
+    lockWorkspace?: boolean;
+    title?: string;
     newTokenLabel?: string;
     defaultNewTokenWorkspace?: string;
     scopes?: string[];

package/package/components/settings/WorkspaceUserSettings.svelte

@@ -19,10 +19,14 @@ import SearchItems from '../SearchItems.svelte';
 import Cell from '../table/Cell.svelte';
 import Row from '../table/Row.svelte';
 import ConfirmationModal from '../common/confirmationModal/ConfirmationModal.svelte';
+import UserOffboardingModal from '../UserOffboardingModal.svelte';
 import { isCloudHosted } from '../../cloud';
 import { truncate } from '../../utils';
 import { onDestroy, untrack } from 'svelte';
 import { goto } from '../../navigation';
+import { ArrowRightLeft } from 'lucide-svelte';
+let offboardingUser = $state(undefined);
+let offboardingReassignOnly = $state(false);
 let users = $state(undefined);
 let invites = $state([]);
 let filteredUsers = $state(undefined);
@@ -219,7 +223,6 @@ onDestroy(() => {
         console.warn(e);
     }
 });
-let deleteConfirmedCallback = $state(undefined);
 let removeInstanceGroupConfirmedCallback = $state(undefined);
 let convertConfirmedCallback = $state(undefined);
 // Auto-add/invite confirmation modal states
@@ -896,14 +899,8 @@ const isAdminsWorkspaceWithoutEE = $derived($workspaceStore === 'admins' && !$en
 										destructive
 										{disabled}
 										onClick={() => {
-											deleteConfirmedCallback = async () => {
-												await UserService.deleteUser({
-													workspace: $workspaceStore ?? '',
-													username
-												})
-												sendUserToast('User removed')
-												listUsers()
-											}
+											offboardingUser = username
+											offboardingReassignOnly = false
 										}}
 										startIcon={{ icon: UserMinus }}
 									>
@@ -932,7 +929,20 @@ const isAdminsWorkspaceWithoutEE = $derived($workspaceStore === 'admins' && !$en
 										Convert
 									</Button>
 								{:else}
-									{@render removeUserButton(false)}
+									<div class="flex items-center gap-1">
+										<Button
+											unifiedSize="sm"
+											variant="subtle"
+											onClick={() => {
+												offboardingUser = username
+												offboardingReassignOnly = true
+											}}
+											startIcon={{ icon: ArrowRightLeft }}
+										>
+											Reassign
+										</Button>
+										{@render removeUserButton(false)}
+									</div>
 								{/if}
 							</div>
 						</Cell>
@@ -1073,24 +1083,20 @@ const isAdminsWorkspaceWithoutEE = $derived($workspaceStore === 'admins' && !$en
 		{/if}
 	</Section>
 {/if}
-<ConfirmationModal
-	open={Boolean(deleteConfirmedCallback)}
-	title="Remove user"
-	confirmationText="Remove"
-	on:canceled={() => {
-		deleteConfirmedCallback = undefined
-	}}
-	on:confirmed={() => {
-		if (deleteConfirmedCallback) {
-			deleteConfirmedCallback()
-		}
-		deleteConfirmedCallback = undefined
-	}}
->
-	<div class="flex flex-col w-full space-y-4">
-		<span>Are you sure you want to remove ?</span>
-	</div>
-</ConfirmationModal>
+{#if offboardingUser}
+	<UserOffboardingModal
+		open={offboardingUser != null}
+		username={offboardingUser}
+		reassignOnly={offboardingReassignOnly}
+		onClose={() => {
+			offboardingUser = undefined
+		}}
+		onComplete={() => {
+			offboardingUser = undefined
+			listUsers()
+		}}
+	/>
+{/if}
 
 <div class="[&>div]:!z-[5002]">
 	<ConfirmationModal

package/package/components/sidebar/SidebarContent.svelte

@@ -8,6 +8,7 @@ import DiscordIcon from '../icons/brands/Discord.svelte';
 import { WorkspaceService } from '../../gen';
 import { sendUserToast } from '../../toast';
 import { clearStores } from '../../storeUtils';
+import Toggle from '../Toggle.svelte';
 import { goto } from '../../navigation';
 import ConfirmationModal from '../common/confirmationModal/ConfirmationModal.svelte';
 import { twMerge } from 'tailwind-merge';
@@ -30,8 +31,39 @@ async function leaveWorkspace() {
     clearStores();
     goto('/user/workspaces');
 }
+let forkedDatatables = $state([]);
+async function loadForkedDatatables() {
+    if (!$workspaceStore)
+        return;
+    try {
+        const settings = await WorkspaceService.getSettings({ workspace: $workspaceStore });
+        const datatables = settings.datatable?.datatables ?? {};
+        forkedDatatables = Object.entries(datatables)
+            .filter(([_, dt]) => dt.forked_from != null)
+            .map(([name, dt]) => ({
+            name,
+            resourceType: dt.database.resource_type ?? 'instance',
+            resourcePath: dt.database.resource_path ?? '',
+            dropOnDelete: true
+        }));
+    }
+    catch {
+        forkedDatatables = [];
+    }
+}
 async function deleteFork() {
-    await WorkspaceService.deleteWorkspace({ workspace: $workspaceStore ?? '' });
+    const workspace = $workspaceStore ?? '';
+    const dbsToDrop = forkedDatatables.filter((dt) => dt.dropOnDelete).map((dt) => dt.name);
+    if (dbsToDrop.length > 0) {
+        const errors = await WorkspaceService.dropForkedDatatableDatabases({
+            workspace,
+            requestBody: { datatable_names: dbsToDrop }
+        });
+        for (const err of errors) {
+            sendUserToast(err, true);
+        }
+    }
+    await WorkspaceService.deleteWorkspace({ workspace });
     sendUserToast('You deleted the workspace');
     clearStores();
     goto('/user/workspaces');
@@ -359,7 +391,8 @@ let secondaryMenuLinks = $derived([
                 ? [
                     {
                         label: 'Delete Forked Workspace',
-                        action: () => {
+                        action: async () => {
+                            await loadForkedDatatables();
                             deleteWorkspaceForkModal = true;
                         },
                         icon: Trash2,
@@ -675,6 +708,29 @@ let secondaryMenuLinks = $derived([
 	>
 		<div class="flex flex-col w-full space-y-4">
 			<span>Are you sure you want to delete this workspace fork? (deleting {$workspaceStore})</span>
+			{#if forkedDatatables.length > 0}
+				<div class="border rounded-md divide-y">
+					<div class="px-4 py-2 text-xs font-semibold text-secondary"> Forked databases </div>
+					{#each forkedDatatables as dt}
+						<div class="flex items-center justify-between px-4 py-2">
+							<div class="flex flex-col">
+								<span class="text-xs font-medium text-secondary">{dt.name}</span>
+								<span class="text-3xs text-hint">
+									{dt.resourceType === 'instance'
+										? dt.resourcePath
+										: `${$workspaceStore?.replace(/-/g, '_')}__${dt.name}`}
+								</span>
+							</div>
+							<Toggle
+								class="shrink-0"
+								size="xs"
+								bind:checked={dt.dropOnDelete}
+								options={{ right: 'Drop database' }}
+							/>
+						</div>
+					{/each}
+				</div>
+			{/if}
 		</div>
 	</ConfirmationModal>
 {/if}

package/package/components/sidebar/WorkspaceMenu.svelte

@@ -1,4 +1,4 @@
-<script lang="ts">import { isPremiumStore, superadmin, userStore, userWorkspaces, workspaceStore, workspaceUsageStore, workspaceColor, clearWorkspaceFromStorage } from '../../stores';
+<script lang="ts">import { isPremiumStore, superadmin, userStore, userWorkspaces, workspaceStore, workspaceUsageStore, workspaceColor, clearWorkspaceFromStorage, globalForkModal } from '../../stores';
 import { isRuleActive } from '../../workspaceProtectionRules.svelte';
 import { Building, Plus, Settings, GitFork } from 'lucide-svelte';
 import MenuButton from './MenuButton.svelte';
@@ -63,7 +63,7 @@ const groupedWorkspaces = $derived.by(() => {
         return [];
     return buildWorkspaceHierarchy($userWorkspaces);
 });
-const itemClass = 'text-primary flex flex-row gap-2 px-4 py-2 text-xs hover:bg-surface-hover hover:text-primary data-[highlighted]:bg-surface-hover data-[highlighted]:text-primary';
+const itemClass = 'text-primary w-full flex flex-row gap-2 px-4 py-2 text-xs hover:bg-surface-hover hover:text-primary data-[highlighted]:bg-surface-hover data-[highlighted]:text-primary';
 </script>
 
 <Menu {createMenu} usePointerDownOutside>
@@ -155,9 +155,13 @@ const itemClass = 'text-primary flex flex-row gap-2 px-4 py-2 text-xs hover:bg-s
 					</MenuItem>
 				</div>
 			{/if}
-			{#if !strictWorkspaceSelect && !isCloudHosted() && !isRuleActive('DisableWorkspaceForking')}
+			{#if !strictWorkspaceSelect && !isCloudHosted() && !isRuleActive('DisableWorkspaceForking') && $workspaceStore !== 'admins'}
 				<div class="py-1" role="none">
-					<MenuItem href="{base}/user/fork_workspace" class={itemClass} {item}>
+					<MenuItem
+						class={itemClass}
+						{item}
+						onClick={() => (globalForkModal.val = { opened: true })}
+					>
 						<GitFork size={16} />
 						Fork current workspace
 					</MenuItem>

package/package/components/triggers/AddTriggersButton.svelte

@@ -10,14 +10,19 @@ let dropdown;
 const cloudHosted = isCloudHosted();
 let nextcloudAvailable = $state(false);
 let googleAvailable = $state(false);
+let githubAvailable = $state(false);
 async function setNextcloudState() {
     nextcloudAvailable = await isServiceAvailable('nextcloud', $workspaceStore);
 }
 async function setGoogleState() {
     googleAvailable = await isServiceAvailable('google', $workspaceStore);
 }
+async function setGithubState() {
+    githubAvailable = await isServiceAvailable('github', $workspaceStore);
+}
 setNextcloudState();
 setGoogleState();
+setGithubState();
 const addTriggerItems = $derived([
     {
         displayName: 'Schedule',
@@ -93,6 +98,12 @@ const addTriggerItems = $derived([
         action: () => onAddDraftTrigger?.('google'),
         icon: triggerIconMap.google,
         hidden: !googleAvailable
+    },
+    {
+        displayName: 'GitHub',
+        action: () => onAddDraftTrigger?.('github'),
+        icon: triggerIconMap.github,
+        hidden: !githubAvailable
     }
 ].filter((item) => !item.hidden));
 let triggersButtonWidth = $state(0);

package/package/components/triggers/PermissionedAsLine.svelte

@@ -1,11 +1,34 @@
 <script lang="ts">import OnBehalfOfSelector, {} from '../OnBehalfOfSelector.svelte';
+import { useFolderDefaultPermissionedAs } from '../useFolderDefaultPermissionedAs.svelte';
 import { userStore, workspaceStore } from '../../stores';
 import { AlertTriangle } from 'lucide-svelte';
-let { permissionedAs, onPermissionedAsChange } = $props();
+let { permissionedAs, onPermissionedAsChange, path = undefined } = $props();
 const canPreserve = $derived($userStore?.is_admin || ($userStore?.groups ?? []).includes('wm_deployers'));
 const myPermissionedAs = $derived($userStore?.username ? `u/${$userStore.username}` : undefined);
+const folderDefault = useFolderDefaultPermissionedAs(() => path);
 let onBehalfOfChoice = $state(undefined);
 let customPermissionedAs = $state(undefined);
+let userHasSelected = $state(false);
+// Full reset when permissionedAs changes (e.g. switching between edit/create).
+$effect(() => {
+    permissionedAs;
+    userHasSelected = false;
+    customPermissionedAs = undefined;
+    onBehalfOfChoice = undefined;
+});
+// On creation with no folder default, default to "me". When the folder default
+// loads async, transition to undefined so OnBehalfOfSelector's auto-select applies
+// the folder default. Skip if the user has already made an explicit selection.
+$effect(() => {
+    if (userHasSelected)
+        return;
+    if (permissionedAs === undefined && !folderDefault.value) {
+        onBehalfOfChoice = 'me';
+    }
+    else {
+        onBehalfOfChoice = undefined;
+    }
+});
 const effectivePermissionedAs = $derived.by(() => {
     if (onBehalfOfChoice === 'target')
         return permissionedAs;
@@ -16,7 +39,17 @@ const effectivePermissionedAs = $derived.by(() => {
 const willChange = $derived(permissionedAs !== undefined &&
     effectivePermissionedAs !== undefined &&
     permissionedAs !== effectivePermissionedAs);
+const shouldRender = $derived(!!$workspaceStore && (permissionedAs !== undefined || canPreserve));
+// For non-admin users editing a trigger owned by someone else: signal that
+// permissioned_as will change to the current user (backend ignores preserve for non-admins).
+// Only fires when there's an actual change (DB value differs from current user).
+$effect(() => {
+    if (!canPreserve && permissionedAs !== undefined && permissionedAs !== myPermissionedAs) {
+        onPermissionedAsChange(undefined, false);
+    }
+});
 function handleSelect(choice, details) {
+    userHasSelected = true;
     onBehalfOfChoice = choice;
     if (choice === 'target') {
         customPermissionedAs = undefined;
@@ -33,7 +66,7 @@ function handleSelect(choice, details) {
 }
 </script>
 
-{#if permissionedAs && $workspaceStore}
+{#if shouldRender && $workspaceStore}
 	<div class="flex items-center gap-1.5 text-2xs text-tertiary mb-4">
 		<span>Permissioned as</span>
 		{#if canPreserve}
@@ -46,6 +79,7 @@ function handleSelect(choice, details) {
 				{canPreserve}
 				customValue={customPermissionedAs}
 				isDeployment={false}
+				folderDefault={folderDefault.value}
 			/>
 			{#if willChange}
 				<AlertTriangle class="w-3.5 h-3.5 text-yellow-500" />
@@ -53,7 +87,7 @@ function handleSelect(choice, details) {
 					>will change from <strong>{permissionedAs}</strong> on save</span
 				>
 			{/if}
-		{:else}
+		{:else if permissionedAs}
 			<strong class="text-secondary">{permissionedAs}</strong>
 			{#if willChange}
 				<AlertTriangle class="w-3.5 h-3.5 text-yellow-500" />

package/package/components/triggers/PermissionedAsLine.svelte.d.ts

@@ -3,6 +3,12 @@ interface Props {
     permissionedAs: string | undefined;
     /** Callback when user changes the permissioned_as selection */
     onPermissionedAsChange: (permissionedAs: string | undefined, preserve: boolean) => void;
+    /**
+     * Item path (e.g. `f/prod/my_trigger`). When provided and the user is an
+     * admin/wm_deployers member, the component fetches the parent folder's
+     * `default_permissioned_as` rules and preselects the matching default.
+     */
+    path?: string | undefined;
 }
 declare const PermissionedAsLine: import("svelte").Component<Props, {}, "">;
 type PermissionedAsLine = ReturnType<typeof PermissionedAsLine>;

package/package/components/triggers/TriggersEditor.svelte

@@ -54,7 +54,8 @@ async function deleteDeployedTrigger(triggerIndex) {
     };
     const nativeTriggerServices = {
         nextcloud: 'nextcloud',
-        google: 'google'
+        google: 'google',
+        github: 'github'
     };
     const deleteHandler = deleteHandlers[triggerType];
     const nativeServiceName = nativeTriggerServices[triggerType];
@@ -143,6 +144,9 @@ async function handleUpdate(trigger, path) {
     else if (triggerType === 'google') {
         await triggersState.fetchNativeTriggers(triggersCount, 'google', $workspaceStore, currentPath, isFlow, $userStore);
     }
+    else if (triggerType === 'github') {
+        await triggersState.fetchNativeTriggers(triggersCount, 'github', $workspaceStore, currentPath, isFlow, $userStore);
+    }
     triggersState.selectedTriggerIndex = triggersState.triggers.findIndex((t) => t.path === path && t.type === triggerType);
     loading = false;
     onDeployTrigger?.({ type: triggerType, id: triggerId, path: triggerPath });

package/package/components/triggers/TriggersWrapper.svelte

@@ -155,6 +155,16 @@ $effect(() => {
 		{customLabel}
 		{...props}
 	/>
+{:else if selectedTrigger.type === 'github'}
+	<NativeTriggersPanel
+		service="github"
+		{isFlow}
+		path={initialPath || fakeInitialPath}
+		{selectedTrigger}
+		defaultValues={selectedTrigger.draftConfig ?? selectedTrigger.captureConfig ?? undefined}
+		{customLabel}
+		{...props}
+	/>
 {:else if selectedTrigger.type === 'cli'}
 	<div class="py-1 flex flex-col gap-6">
 		<ClipboardPanel content={selectedTrigger.extra?.cliCommand ?? ''} />