windmill-components 1.677.1 → 1.695.0

package/package/components/CompareWorkspaces.svelte

@@ -1,24 +1,28 @@
-<script lang="ts">import { AlertTriangle, ArrowDown, ArrowDownRight, ArrowRight, ArrowUp, ArrowUpRight, Building, DiffIcon, FileJson, GitFork, Loader2, Trash2, Upload } from 'lucide-svelte';
+<script lang="ts">import { AlertTriangle, ArrowDown, ArrowDownRight, ArrowRight, ArrowUp, ArrowUpRight, Building, CircleCheck, CircleX, DiffIcon, FileJson, FlaskConical, GitFork, Loader2, UserPlus } from 'lucide-svelte';
 import { Alert, Badge } from './common';
-import { AppService, EmailTriggerService, FlowService, FolderService, GcpTriggerService, HttpTriggerService, KafkaTriggerService, MqttTriggerService, NatsTriggerService, PostgresTriggerService, ScheduleService, ScriptService, SqsTriggerService, UserService, WebsocketTriggerService, WorkspaceService } from '../gen';
+import { AppService, EmailTriggerService, FlowService, FolderService, AzureTriggerService, GcpTriggerService, HttpTriggerService, KafkaTriggerService, MqttTriggerService, NatsTriggerService, PostgresTriggerService, ScheduleService, ScriptService, SqsTriggerService, UserService, WebsocketTriggerService, WorkspaceService } from '../gen';
 import Button from './common/button/Button.svelte';
-import ConfirmationModal from './common/confirmationModal/ConfirmationModal.svelte';
-import Row from './common/table/Row.svelte';
 import DiffDrawer from './DiffDrawer.svelte';
-import DeployWorkspaceDrawer from './DeployWorkspaceDrawer.svelte';
+import DiffEditor from './DiffEditor.svelte';
+import Drawer from './common/drawer/Drawer.svelte';
+import DrawerContent from './common/drawer/DrawerContent.svelte';
 import ParentWorkspaceProtectionAlert from './ParentWorkspaceProtectionAlert.svelte';
 import { userWorkspaces, workspaceStore } from '../stores';
-import { deployItem, getItemValue, getOnBehalfOf } from '../utils_workspace_deploy';
+import { deployItem, deleteItemInWorkspace, getItemValue, getOnBehalfOf } from '../utils_workspace_deploy';
 import Tooltip from './Tooltip.svelte';
 import OnBehalfOfSelector, { needsOnBehalfOfSelection } from './OnBehalfOfSelector.svelte';
 import { sendUserToast } from '../toast';
 import { deepEqual } from 'fast-equals';
+import { orderedJsonStringify, orderedYamlStringify } from '../utils';
 import WorkspaceDeployLayout from './WorkspaceDeployLayout.svelte';
+import DeploymentRequestPanel from './deploymentRequest/DeploymentRequestPanel.svelte';
+import { userStore } from '../stores';
 import { triggerDisplayNamesMap, triggerKindToTriggerType } from './triggers/utils';
 import { getEmailAddress, getEmailDomain } from './triggers/email/utils';
 import { base } from '../base';
 import ToggleButtonGroup from './common/toggleButton-v2/ToggleButtonGroup.svelte';
 import ToggleButton from './common/toggleButton-v2/ToggleButton.svelte';
+import DatatableSchemaDiff from './DatatableSchemaDiff.svelte';
 let { currentWorkspaceId, parentWorkspaceId, comparison } = $props();
 let currentWorkspaceInfo = $derived($userWorkspaces.find((w) => w.id == currentWorkspaceId));
 let parentWorkspaceInfo = $derived($userWorkspaces.find((w) => w.id == parentWorkspaceId));
@@ -177,7 +181,10 @@ async function showDiff(kind, path) {
         });
     }
 }
-let allSelected = $derived(selectedItems.length == selectableDiffs.length);
+// All *diff* items selected. Trigger items are opt-in and don't count
+// toward "all selected" — see item merge below in deployableItems.
+let allSelected = $derived(selectableDiffs.length > 0 &&
+    selectableDiffs.every((d) => selectedItems.includes(getItemKey(d))));
 async function selectAll() {
     selectedItems = selectableDiffs
         .map((d) => getItemKey(d))
@@ -196,21 +203,45 @@ const deploymentStatus = $state({});
 function getWorkspacedKey(workspace, key) {
     return `${workspace}/${key}`;
 }
-async function deploy(kind, path, workspaceToDeployTo, workspaceFrom, statusPath) {
-    deploymentStatus[statusPath] = { status: 'loading' };
-    const result = await deployItem({
-        kind,
-        path,
-        workspaceFrom,
-        workspaceTo: workspaceToDeployTo,
-        onBehalfOf: getOnBehalfOfForDeploy(statusPath, kind)
-    });
+async function deploy(kind, path, workspaceToDeployTo, workspaceFrom, statusKey, trigger) {
+    deploymentStatus[statusKey] = { status: 'loading' };
+    // Check if the item was deleted in the source workspace.
+    // If so, archive/delete it in the target workspace instead of copying.
+    const diff = comparison?.diffs.find((d) => getItemKey(d) === statusKey);
+    const itemDeletedInSource = diff
+        ? mergeIntoParent
+            ? diff.exists_in_fork === false
+            : diff.exists_in_source === false
+        : false;
+    let result;
+    if (itemDeletedInSource) {
+        result = await deleteItemInWorkspace(kind, path, workspaceToDeployTo);
+    }
+    else if (trigger) {
+        result = await deployItem({
+            kind: 'trigger',
+            path,
+            workspaceFrom,
+            workspaceTo: workspaceToDeployTo,
+            additionalInformation: { triggers: { kind: trigger.triggerKind } },
+            onBehalfOf: getOnBehalfOfForDeploy(statusKey, 'trigger')
+        });
+    }
+    else {
+        result = await deployItem({
+            kind,
+            path,
+            workspaceFrom,
+            workspaceTo: workspaceToDeployTo,
+            onBehalfOf: getOnBehalfOfForDeploy(statusKey, kind)
+        });
+    }
     if (result.success) {
-        deploymentStatus[statusPath] = { status: 'deployed' };
+        deploymentStatus[statusKey] = { status: 'deployed' };
     }
     else {
-        deploymentStatus[statusPath] = { status: 'failed', error: result.error };
-        sendUserToast(`Failed to deploy ${statusPath}: ${result.error}`);
+        deploymentStatus[statusKey] = { status: 'failed', error: result.error };
+        sendUserToast(`Failed to deploy ${statusKey}: ${result.error}`);
     }
 }
 let deploymentErrorMessage = $state('');
@@ -254,24 +285,43 @@ async function deployChanges() {
             return 1;
         return 0;
     });
+    let anyFailed = false;
     for (const itemKey of sortedItems) {
-        const diff = selectableDiffs.find((d) => itemKey == getItemKey(d));
-        if (!diff) {
+        const deployable = deployableItems.find((d) => d.key === itemKey);
+        if (!deployable) {
             sendUserToast(`Undeployable item: ${itemKey}`, true);
             continue;
         }
-        if (mergeIntoParent) {
-            await deploy(diff.kind, diff.path, parent, current, itemKey);
-        }
-        else {
-            await deploy(diff.kind, diff.path, current, parent, itemKey);
+        const to = mergeIntoParent ? parent : current;
+        const from = mergeIntoParent ? current : parent;
+        await deploy(deployable.kind, deployable.path, to, from, itemKey, deployable.trigger);
+        if (deploymentStatus[itemKey]?.status === 'failed') {
+            anyFailed = true;
         }
     }
     deploying = false;
     deselectAll();
+    // If every selected item deployed cleanly and the direction was
+    // merge-into-parent, close any open deployment request for this fork.
+    if (!anyFailed && mergeIntoParent) {
+        try {
+            const open = await WorkspaceService.getOpenDeploymentRequest({
+                workspace: currentWorkspaceId
+            });
+            if (open) {
+                await WorkspaceService.closeDeploymentRequestMerged({
+                    workspace: currentWorkspaceId,
+                    id: open.id
+                });
+                deploymentRequestPanel?.refresh();
+            }
+        }
+        catch (e) {
+            console.error('Failed to close open deployment request after merge', e);
+        }
+    }
 }
-function toggleItem(diff) {
-    const key = getItemKey(diff);
+function toggleKey(key) {
     if (selectedItems.includes(key)) {
         selectedItems = selectedItems.filter((i) => i !== key);
     }
@@ -336,154 +386,301 @@ $effect(() => {
     [selectedItems, mergeIntoParent];
     allowBehindChangesOverride = false;
 });
-// Transform diffs to deployable item format for the shared layout
-let deployableItems = $derived((comparison?.diffs ?? [])
-    .filter((diff) => {
-    const key = getItemKey(diff);
-    const isSelectable = selectableDiffs.includes(diff);
-    const isDeployedAndIrrelevant = deploymentStatus[key]?.status === 'deployed' && !isSelectable;
-    return !isDeployedAndIrrelevant;
-})
-    .map((diff) => ({
-    key: getItemKey(diff),
-    path: diff.path,
-    kind: diff.kind,
-    diff
-})));
+function getTriggerKey(trigger) {
+    return `trigger:${trigger.triggerKind}:${trigger.path}`;
+}
+// Transform diffs + fork triggers to deployable item format for the
+// shared layout. Triggers render as inline rows alongside diff items;
+// they carry no ahead/behind info and are selectable à la carte.
+let deployableItems = $derived.by(() => {
+    const diffItems = (comparison?.diffs ?? [])
+        .filter((diff) => {
+        const key = getItemKey(diff);
+        const isSelectable = selectableDiffs.includes(diff);
+        const isDeployedAndIrrelevant = deploymentStatus[key]?.status === 'deployed' && !isSelectable;
+        return !isDeployedAndIrrelevant;
+    })
+        .map((diff) => ({
+        key: getItemKey(diff),
+        path: diff.path,
+        kind: diff.kind,
+        diff,
+        trigger: undefined
+    }));
+    const triggerItems = forkTriggers
+        .filter((t) => {
+        if (!isTriggerRelevantForDirection(t, mergeIntoParent))
+            return false;
+        const key = getTriggerKey(t);
+        return deploymentStatus[key]?.status !== 'deployed';
+    })
+        .map((trigger) => ({
+        key: getTriggerKey(trigger),
+        path: trigger.path,
+        kind: 'trigger',
+        triggerKind: trigger.triggerKind,
+        diff: undefined,
+        trigger
+    }));
+    return [...diffItems, ...triggerItems];
+});
+let ciTestResults = $state({});
+async function fetchCiTests() {
+    if (!comparison?.diffs || !currentWorkspaceId)
+        return;
+    const items = comparison.diffs
+        .filter((d) => d.kind === 'script' || d.kind === 'flow' || d.kind === 'resource')
+        .map((d) => ({ path: d.path, kind: d.kind }));
+    if (items.length === 0)
+        return;
+    try {
+        ciTestResults = await ScriptService.getCiTestResultsBatch({
+            workspace: currentWorkspaceId,
+            requestBody: { items }
+        });
+    }
+    catch (e) {
+        console.error('Failed to fetch CI test results:', e);
+    }
+}
+$effect(() => {
+    if (comparison && comparison.diffs.length > 0) {
+        fetchCiTests();
+    }
+});
+function getCiTestStatus(diff) {
+    const key = `${diff.kind}:${diff.path}`;
+    const results = ciTestResults[key];
+    if (!results || results.length === 0)
+        return null;
+    if (results.some((r) => r.status === 'failure' || r.status === 'canceled'))
+        return 'fail';
+    if (results.some((r) => r.status === 'running' || (r.job_id && !r.status)))
+        return 'running';
+    if (results.every((r) => r.status === 'success'))
+        return 'pass';
+    return null;
+}
+// Deduplicated list of all CI tests across all items
+let allCiTests = $derived.by(() => {
+    const seen = new Map();
+    for (const results of Object.values(ciTestResults)) {
+        for (const r of results) {
+            const existing = seen.get(r.test_script_path);
+            if (!existing ||
+                (r.started_at && (!existing.started_at || r.started_at > existing.started_at))) {
+                seen.set(r.test_script_path, r);
+            }
+        }
+    }
+    return [...seen.values()];
+});
 let forkTriggers = $state([]);
-let loadingTriggers = $state(true);
-let deploymentDrawer = $state(undefined);
-let triggerToDelete = $state(undefined);
-/** Deployable trigger kinds and their list+delete services */
+let deploymentRequestPanel = $state(undefined);
+let hasOpenDeploymentRequest = $state(false);
+/** Deployable trigger kinds and their list services */
 const triggerServices = {
     schedules: {
         list: (ws) => ScheduleService.listSchedules({ workspace: ws }),
-        delete: (ws, path) => ScheduleService.deleteSchedule({ workspace: ws, path }),
         normalize: (item) => ({
             path: item.path,
             triggerKind: 'schedules',
             scriptPath: item.script_path,
             isFlow: item.is_flow,
-            enabled: item.enabled,
-            extraLabel: item.schedule
+            extraLabel: item.schedule,
+            raw: item
         })
     },
     routes: {
         list: (ws) => HttpTriggerService.listHttpTriggers({ workspace: ws }),
-        delete: (ws, path) => HttpTriggerService.deleteHttpTrigger({ workspace: ws, path }),
         normalize: (item) => ({
             path: item.path,
             triggerKind: 'routes',
             scriptPath: item.script_path,
             isFlow: item.is_flow,
-            enabled: item.mode === 'enabled',
             extraLabel: `${(item.http_method ?? 'get').toUpperCase()} ${item.route_path ?? ''}`
         })
     },
     websockets: {
         list: (ws) => WebsocketTriggerService.listWebsocketTriggers({ workspace: ws }),
-        delete: (ws, path) => WebsocketTriggerService.deleteWebsocketTrigger({ workspace: ws, path }),
         normalize: (item) => ({
             path: item.path,
             triggerKind: 'websockets',
             scriptPath: item.script_path,
             isFlow: item.is_flow,
-            enabled: item.mode === 'enabled',
-            extraLabel: item.url
+            extraLabel: item.url,
+            raw: item
         })
     },
     kafka: {
         list: (ws) => KafkaTriggerService.listKafkaTriggers({ workspace: ws }),
-        delete: (ws, path) => KafkaTriggerService.deleteKafkaTrigger({ workspace: ws, path }),
         normalize: (item) => ({
             path: item.path,
             triggerKind: 'kafka',
             scriptPath: item.script_path,
             isFlow: item.is_flow,
-            enabled: item.mode === 'enabled',
-            extraLabel: item.topics?.join(', ')
+            extraLabel: item.topics?.join(', '),
+            raw: item
         })
     },
     postgres: {
         list: (ws) => PostgresTriggerService.listPostgresTriggers({ workspace: ws }),
-        delete: (ws, path) => PostgresTriggerService.deletePostgresTrigger({ workspace: ws, path }),
         normalize: (item) => ({
             path: item.path,
             triggerKind: 'postgres',
             scriptPath: item.script_path,
             isFlow: item.is_flow,
-            enabled: item.mode === 'enabled'
+            raw: item
         })
     },
     nats: {
         list: (ws) => NatsTriggerService.listNatsTriggers({ workspace: ws }),
-        delete: (ws, path) => NatsTriggerService.deleteNatsTrigger({ workspace: ws, path }),
         normalize: (item) => ({
             path: item.path,
             triggerKind: 'nats',
             scriptPath: item.script_path,
             isFlow: item.is_flow,
-            enabled: item.mode === 'enabled',
-            extraLabel: item.subjects?.join(', ')
+            extraLabel: item.subjects?.join(', '),
+            raw: item
         })
     },
     mqtt: {
         list: (ws) => MqttTriggerService.listMqttTriggers({ workspace: ws }),
-        delete: (ws, path) => MqttTriggerService.deleteMqttTrigger({ workspace: ws, path }),
         normalize: (item) => ({
             path: item.path,
             triggerKind: 'mqtt',
             scriptPath: item.script_path,
             isFlow: item.is_flow,
-            enabled: item.mode === 'enabled'
+            raw: item
         })
     },
     sqs: {
         list: (ws) => SqsTriggerService.listSqsTriggers({ workspace: ws }),
-        delete: (ws, path) => SqsTriggerService.deleteSqsTrigger({ workspace: ws, path }),
         normalize: (item) => ({
             path: item.path,
             triggerKind: 'sqs',
             scriptPath: item.script_path,
             isFlow: item.is_flow,
-            enabled: item.mode === 'enabled',
-            extraLabel: item.queue_url
+            extraLabel: item.queue_url,
+            raw: item
         })
     },
     gcp: {
         list: (ws) => GcpTriggerService.listGcpTriggers({ workspace: ws }),
-        delete: (ws, path) => GcpTriggerService.deleteGcpTrigger({ workspace: ws, path }),
         normalize: (item) => ({
             path: item.path,
             triggerKind: 'gcp',
             scriptPath: item.script_path,
             isFlow: item.is_flow,
-            enabled: item.mode === 'enabled',
-            extraLabel: item.topic_id
+            extraLabel: item.topic_id,
+            raw: item
+        })
+    },
+    azure: {
+        list: (ws) => AzureTriggerService.listAzureTriggers({ workspace: ws }),
+        normalize: (item) => ({
+            path: item.path,
+            triggerKind: 'azure',
+            scriptPath: item.script_path,
+            isFlow: item.is_flow,
+            extraLabel: item.topic_name ?? item.scope_resource_id,
+            raw: item
         })
     },
     emails: {
         list: (ws) => EmailTriggerService.listEmailTriggers({ workspace: ws }),
-        delete: (ws, path) => EmailTriggerService.deleteEmailTrigger({ workspace: ws, path }),
         normalize: (item) => ({
             path: item.path,
             triggerKind: 'emails',
             scriptPath: item.script_path,
             isFlow: item.is_flow,
-            enabled: item.mode === 'enabled',
-            extraLabel: getEmailAddress(item.local_part, item.workspaced_local_part, currentWorkspaceId, emailDomain ?? '')
+            extraLabel: getEmailAddress(item.local_part, item.workspaced_local_part, currentWorkspaceId, emailDomain ?? ''),
+            raw: item
         })
     }
 };
 let emailDomain = $state(undefined);
+/**
+ * Fields that should not count as a "change" between the parent and the
+ * fork. Mode/enabled are forced to 'disabled'/false on clone and stripped
+ * by the fork-export filter; the rest are runtime state or per-row
+ * metadata that always diverges. Comparing without these matches the
+ * semantics of "is this trigger configured the same way?" rather than
+ * "are these two rows byte-identical?".
+ */
+const TRIGGER_COMPARE_IGNORE = new Set([
+    'workspace_id',
+    'mode',
+    'enabled',
+    'edited_at',
+    'edited_by',
+    'last_server_ping',
+    'server_id',
+    'error',
+    'extra_perms',
+    'permissioned_as'
+]);
+function stripIgnoredFields(row) {
+    if (!row || typeof row !== 'object')
+        return row;
+    const out = {};
+    for (const [k, v] of Object.entries(row)) {
+        if (!TRIGGER_COMPARE_IGNORE.has(k))
+            out[k] = v;
+    }
+    return out;
+}
+function rowsHaveSameConfig(a, b) {
+    return (orderedJsonStringify(stripIgnoredFields(a)) === orderedJsonStringify(stripIgnoredFields(b)));
+}
 async function fetchAllTriggers() {
-    loadingTriggers = true;
     try {
         emailDomain = await getEmailDomain();
-        const entries = Object.values(triggerServices);
-        const results = await Promise.allSettled(entries.map(async (svc) => {
-            const items = await svc.list(currentWorkspaceId);
-            return items.map(svc.normalize);
+        const entries = Object.entries(triggerServices);
+        // Fetch fork + parent in parallel for each kind. Either side may
+        // fail (e.g. permission denied on parent) — fall back to empty.
+        const results = await Promise.allSettled(entries.map(async ([kind, svc]) => {
+            const [forkItems, parentItems] = await Promise.all([
+                svc.list(currentWorkspaceId).catch(() => []),
+                svc.list(parentWorkspaceId).catch(() => [])
+            ]);
+            const byPath = new Map();
+            for (const item of forkItems) {
+                byPath.set(item.path, { fork: item });
+            }
+            for (const item of parentItems) {
+                const entry = byPath.get(item.path) ?? {};
+                entry.parent = item;
+                byPath.set(item.path, entry);
+            }
+            const merged = [];
+            for (const [path, entry] of byPath) {
+                const sourceItem = entry.fork ?? entry.parent;
+                const normalized = svc.normalize(sourceItem);
+                let changeKind;
+                let hasChanges = false;
+                if (entry.fork && !entry.parent) {
+                    changeKind = 'new';
+                }
+                else if (!entry.fork && entry.parent) {
+                    changeKind = 'deleted-in-source';
+                }
+                else if (entry.fork && entry.parent) {
+                    hasChanges = !rowsHaveSameConfig(entry.fork, entry.parent);
+                    if (hasChanges)
+                        changeKind = 'modified';
+                }
+                merged.push({
+                    ...normalized,
+                    raw: sourceItem,
+                    hasChanges,
+                    changeKind,
+                    sourceRaw: entry.fork,
+                    targetRaw: entry.parent,
+                    path
+                });
+            }
+            return merged;
         }));
         forkTriggers = results.flatMap((r) => (r.status === 'fulfilled' ? r.value : []));
     }
@@ -491,52 +688,48 @@ async function fetchAllTriggers() {
         console.error('Failed to fetch fork triggers:', e);
         forkTriggers = [];
     }
-    finally {
-        loadingTriggers = false;
-    }
 }
-function deleteTrigger(trigger) {
-    triggerToDelete = trigger;
-}
-async function confirmDeleteTrigger() {
-    const trigger = triggerToDelete;
-    if (!trigger)
-        return;
-    triggerToDelete = undefined;
-    const triggerType = triggerKindToTriggerType(trigger.triggerKind);
-    const displayName = triggerType ? triggerDisplayNamesMap[triggerType] : trigger.triggerKind;
-    try {
-        const svc = triggerServices[trigger.triggerKind];
-        if (!svc) {
-            throw new Error(`No service for trigger kind: ${trigger.triggerKind}`);
-        }
-        await svc.delete(currentWorkspaceId, trigger.path);
-        forkTriggers = forkTriggers.filter((t) => !(t.path === trigger.path && t.triggerKind === trigger.triggerKind));
-        sendUserToast(`Deleted ${displayName} trigger '${trigger.path}'`);
+/**
+ * Triggers worth showing in the merge UI given the current direction.
+ * - "Deploy to parent": rows that exist in fork and either don't exist in
+ *   parent or have config differences.
+ * - "Update current" (pull from parent): mirror.
+ * Triggers that exist on both sides with identical config are filtered
+ * out — they would generate a no-op deploy and only add noise.
+ */
+function isTriggerRelevantForDirection(t, deployingToParent) {
+    const existsInFork = !!t.sourceRaw;
+    const existsInParent = !!t.targetRaw;
+    if (deployingToParent) {
+        return existsInFork && (!existsInParent || !!t.hasChanges);
     }
-    catch (e) {
-        sendUserToast(`Failed to delete trigger '${trigger.path}': ${e.body || e.message}`, true);
+    else {
+        return existsInParent && (!existsInFork || !!t.hasChanges);
     }
 }
 function getTriggerDisplayName(triggerKind) {
     const triggerType = triggerKindToTriggerType(triggerKind);
     return triggerType ? triggerDisplayNamesMap[triggerType] : triggerKind;
 }
-const triggerKindToPagePath = {
-    schedules: '/schedules',
-    routes: '/routes',
-    websockets: '/websocket_triggers',
-    kafka: '/kafka_triggers',
-    postgres: '/postgres_triggers',
-    nats: '/nats_triggers',
-    mqtt: '/mqtt_triggers',
-    sqs: '/sqs_triggers',
-    gcp: '/gcp_triggers',
-    emails: '/email_triggers'
-};
-function getTriggerHref(triggerKind) {
-    const pagePath = triggerKindToPagePath[triggerKind];
-    return pagePath ? `${base}${pagePath}` : undefined;
+let triggerDiffOpen = $state(false);
+let triggerDiffPayload = $state(undefined);
+function openTriggerDiff(t) {
+    // `sourceRaw` is the fork row, `targetRaw` is the parent row regardless
+    // of direction (set in fetchAllTriggers). The diff reads from the
+    // destination (left) to the source (right), matching the deploy arrow.
+    const sourceWorkspace = mergeIntoParent ? currentWorkspaceId : parentWorkspaceId;
+    const targetWorkspace = mergeIntoParent ? parentWorkspaceId : currentWorkspaceId;
+    const fromRow = mergeIntoParent ? t.sourceRaw : t.targetRaw;
+    const toRow = mergeIntoParent ? t.targetRaw : t.sourceRaw;
+    triggerDiffPayload = {
+        kindLabel: getTriggerDisplayName(t.triggerKind),
+        path: t.path,
+        originalLabel: `${targetWorkspace} (target)`,
+        modifiedLabel: `${sourceWorkspace} (source)`,
+        original: orderedYamlStringify(stripIgnoredFields(toRow ?? {})),
+        modified: orderedYamlStringify(stripIgnoredFields(fromRow ?? {}))
+    };
+    triggerDiffOpen = true;
 }
 // Fetch triggers when workspace is available
 $effect(() => {
@@ -561,398 +754,462 @@ $effect(() => {
 	{@const selectedConflicts = conflictingDiffs.filter((e) =>
 		selectedItems.includes(getItemKey(e))
 	).length}
+	<div class="flex flex-col gap-4">
+		<div class="bg-surface-tertiary p-4 rounded-md border">
+			<WorkspaceDeployLayout
+				items={deployableItems}
+				{selectedItems}
+				{deploymentStatus}
+				selectablePredicate={(item) =>
+					item.trigger != null || selectableDiffs.some((d) => getItemKey(d) === item.key)}
+				{allSelected}
+				onToggleItem={(item) => toggleKey(item.key)}
+				onSelectAll={selectAll}
+				onDeselectAll={deselectAll}
+				emptyMessage="No comparison data available"
+			>
+				{#snippet header()}
+					<div class="flex items-center justify-between bg-surface-tertiary">
+						<div class="flex flex-col gap-2 w-full pb-4 border-b">
+							<div class="flex flex-wrap gap-1 items-center">
+								<ToggleButtonGroup
+									disabled={deploying}
+									selected="deploy_to"
+									onSelected={toggleDeploymentDirection}
+									noWFull
+								>
+									{#snippet children({ item })}
+										<ToggleButton
+											value="deploy_to"
+											label="Deploy to {parentWorkspaceId}"
+											icon={ArrowUp}
+											{item}
+										/>
+										<ToggleButton value="update" label="Update current" icon={ArrowDown} {item} />
+									{/snippet}
+								</ToggleButtonGroup>
+								{#if currentWorkspaceInfo && parentWorkspaceInfo}
+									<div class="flex-1 flex gap-1 items-center">
+										<Badge
+											color="transparent"
+											class="ml-5 font-semibold"
+											title={mergeIntoParent ? currentWorkspaceInfo.name : parentWorkspaceInfo.name}
+										>
+											<span class="text-secondary">merge:</span>
+											{#if mergeIntoParent}
+												<GitFork size={14} />
+												<span class="text-emphasis">{currentWorkspaceInfo.id}</span>
+											{:else}
+												<Building size={14} />
+												<span class="text-emphasis">{parentWorkspaceInfo.id}</span>
+											{/if}
+										</Badge>
+										<ArrowRight size={16} />
+										<Badge
+											color="transparent"
+											class="font-semibold"
+											title={!mergeIntoParent
+												? currentWorkspaceInfo.name
+												: parentWorkspaceInfo.name}
+										>
+											<span class="text-secondary">into:</span>
+											{#if !mergeIntoParent}
+												<GitFork size={14} />
+												<span class="text-emphasis">{currentWorkspaceInfo.id}</span>
+											{:else}
+												<Building size={14} />
+												<span class="text-emphasis">{parentWorkspaceInfo.id}</span>
+											{/if}
+										</Badge>
+									</div>
+								{/if}
+								<div class="flex items-center gap-2 text-sm">
+									<Badge color="transparent">
+										{comparison.summary.total_diffs} total items
+									</Badge>
+									<Badge color="transparent">
+										{selectableDiffs.length}
+										{mergeIntoParent ? 'deployable' : 'updateable'}
+									</Badge>
+									{#if conflictingDiffs.length > 0}
+										<Badge color="orange">
+											<AlertTriangle class="w-3 h-3 inline mr-1" />
+											{conflictingDiffs.length} conflicts
+										</Badge>
+									{/if}
+								</div>
+							</div>
+						</div>
+					</div>
+				{/snippet}
+				{#if allCiTests.length > 0}
+					<div class="flex flex-col gap-1.5 mt-3 p-3 border bg-surface-secondary rounded text-xs">
+						<div class="flex items-center gap-1.5 font-semibold text-secondary">
+							<FlaskConical size={14} />
+							CI tests
+						</div>
+						<div class="flex flex-col gap-1">
+							{#each allCiTests as test (test.test_script_path)}
+								<div class="flex items-center gap-2">
+									{#if test.status === 'success'}
+										<CircleCheck size={14} class="text-green-600" />
+									{:else if test.status === 'failure' || test.status === 'canceled'}
+										<CircleX size={14} class="text-red-600" />
+									{:else if test.status === 'running'}
+										<Loader2 size={14} class="text-yellow-600 animate-spin" />
+									{:else}
+										<div class="w-3.5 h-3.5 rounded-full border border-tertiary"></div>
+									{/if}
+									<span class="text-secondary">{test.test_script_path}</span>
+									{#if test.job_id}
+										<a
+											href="{base}/run/{test.job_id}?workspace={currentWorkspaceId}"
+											class="text-tertiary hover:text-secondary text-2xs"
+										>
+											view run
+										</a>
+									{/if}
+								</div>
+							{/each}
+						</div>
+					</div>
+				{/if}
 
-	<WorkspaceDeployLayout
-		items={deployableItems}
-		{selectedItems}
-		{deploymentStatus}
-		selectablePredicate={(item) => selectableDiffs.some((d) => getItemKey(d) === item.key)}
-		{allSelected}
-		onToggleItem={(item) => {
-			const diff = comparison?.diffs.find((d) => getItemKey(d) === item.key)
-			if (diff) toggleItem(diff)
-		}}
-		onSelectAll={selectAll}
-		onDeselectAll={deselectAll}
-		emptyMessage="No comparison data available"
-	>
-		{#snippet header()}
-			<div class="flex items-center justify-between">
-				<div
-					class="flex flex-col gap-2 border bg-surface-tertiary w-full p-4 border-radius-5 rounded"
-				>
-					<div class="flex flex-row gap-1 items-center">
-						<ToggleButtonGroup
-							disabled={deploying}
-							selected="deploy_to"
-							onSelected={toggleDeploymentDirection}
-							noWFull
+				{#snippet alerts()}
+					{#if mergeIntoParent}
+						<ParentWorkspaceProtectionAlert
+							{parentWorkspaceId}
+							onUpdateCanDeploy={(canDeploy) => {
+								canDeployToParent = canDeploy
+							}}
+						/>
+					{/if}
+					{#if conflictingDiffs.length > 0}
+						<Alert title="Conflicting changes detected" type="warning" class="mt-2">
+							<span>
+								{conflictingDiffs.length} item{conflictingDiffs.length !== 1 ? 's have' : ' has'} conflicting
+								changes, it was modified on the original workspace while changes were made on this fork.
+								Make sure to resolve these before merging.
+							</span>
+						</Alert>
+					{/if}
+					{#if hasBehindChanges && hasAheadChanges && !(mergeIntoParent && !canDeployToParent)}
+						<Alert
+							title="This fork is behind {parentWorkspaceId} and needs to be up to date before deploying"
+							type="warning"
+							class="my-2"
 						>
-							{#snippet children({ item })}
-								<ToggleButton
-									value="deploy_to"
-									label="Deploy to {parentWorkspaceId}"
-									icon={ArrowUp}
-									{item}
+							You have items behind '{parentWorkspaceId}'. You need to update and test your changes
+							before being able to deploy.
+							<span class="font-medium flex flex-row gap-1 text-red-500">
+								<input
+									type="checkbox"
+									bind:checked={allowBehindChangesOverride}
+									class="rounded max-w-4"
 								/>
-								<ToggleButton value="update" label="Update current" icon={ArrowDown} {item} />
-							{/snippet}
-						</ToggleButtonGroup>
-						{#if currentWorkspaceInfo && parentWorkspaceInfo}
+								Override: Deploy despite {itemsWithBehindChanges.length} outdated item{itemsWithBehindChanges.length !==
+								1
+									? 's'
+									: ''}
+							</span>
+						</Alert>
+					{/if}
+					{#if !comparison.all_ahead_items_visible || !comparison.all_behind_items_visible}
+						<Alert
+							title="This fork has changes not visible to your user"
+							type="warning"
+							class="my-2"
+						>
+							{#if !comparison.all_ahead_items_visible && !comparison.all_behind_items_visible}
+								This fork is ahead and behind its parent
+							{:else if !comparison.all_behind_items_visible}
+								This fork is behind of its parent
+							{:else if !comparison.all_ahead_items_visible}
+								This fork is ahead of its parent
+							{/if}
+							and some of the changes are not visible by you. Only a user with access to the whole context
+							may deploy or update this fork. You can share the link to this page to someone with proper
+							permissions to get it deployed.
+						</Alert>
+					{/if}
+				{/snippet}
+
+				{#snippet itemSummary(item)}
+					{#if item.trigger}
+						{@const t = item.trigger as ForkTrigger}
+						<span class="text-emphasis">{getTriggerDisplayName(t.triggerKind)}</span>
+						{#if t.extraLabel}
+							<span class="text-secondary ml-1">{t.extraLabel}</span>
+						{/if}
+						<span class="text-tertiary mx-1">&rarr;</span>
+						<span class="text-secondary">{t.scriptPath}</span>
+					{:else}
+						{@const diff = item.diff as WorkspaceItemDiff}
+						{@const key = item.key}
+						{@const isSelectable = selectableDiffs.includes(diff)}
+						{@const oldSummary = mergeIntoParent
+							? summaryCache[key]?.parent
+							: summaryCache[key]?.current}
+						{@const newSummary = mergeIntoParent
+							? summaryCache[key]?.current
+							: summaryCache[key]?.parent}
+						{@const existsInBothWorkspaces = !(
+							(diff.exists_in_fork && !diff.exists_in_source) ||
+							(!diff.exists_in_fork && diff.exists_in_source)
+						)}
+						{#if oldSummary != newSummary && isSelectable && existsInBothWorkspaces}
+							<span class="line-through text-secondary">{oldSummary || diff.path}</span>
+							{newSummary || diff.path}
+						{:else if !existsInBothWorkspaces}
+							{newSummary || oldSummary || diff.path}
+						{:else}
+							{newSummary || diff.path}
+						{/if}
+					{/if}
+				{/snippet}
+
+				{#snippet itemActions(item)}
+					{#if item.trigger}
+						{@const t = item.trigger as ForkTrigger}
+						{@const key = item.key}
+						{#if t.changeKind === 'new'}
 							<Badge
-								color="transparent"
-								class="ml-5 font-semibold"
-								title={mergeIntoParent ? currentWorkspaceInfo.name : parentWorkspaceInfo.name}
+								title={mergeIntoParent
+									? `Only exists in '${currentWorkspaceId}'`
+									: `Only exists in '${parentWorkspaceId}'`}
+								color="indigo"
+								size="xs">New</Badge
 							>
-								<span class="text-secondary">merge:</span>
-								{#if mergeIntoParent}
-									<GitFork size={14} />
-									<span class="text-emphasis">{currentWorkspaceInfo.id}</span>
-								{:else}
-									<Building size={14} />
-									<span class="text-emphasis">{parentWorkspaceInfo.id}</span>
-								{/if}
-							</Badge>
-							<ArrowRight size={16} />
+						{/if}
+						{#if t.isFlow}
+							<Badge color="blue" size="xs">flow</Badge>
+						{/if}
+						{#if !deploymentStatus[key] || deploymentStatus[key].status != 'deployed'}
+							{#if mergeIntoParent}
+								<Badge color="green" size="xs">
+									<ArrowUpRight class="w-3 h-3 inline" />
+									1 ahead
+								</Badge>
+							{:else}
+								<Badge color="blue" size="xs">
+									<ArrowDownRight class="w-3 h-3 inline" />
+									1 behind
+								</Badge>
+							{/if}
+							{#if t.changeKind === 'modified'}
+								<div>
+									<Button size="xs" variant="subtle" onclick={() => openTriggerDiff(t)}>
+										<DiffIcon class="w-3 h-3" />
+										Show diff
+									</Button>
+								</div>
+							{/if}
+						{/if}
+					{:else}
+						{@const diff = item.diff as WorkspaceItemDiff}
+						{@const key = item.key}
+						{@const targetOnBehalfOf = getTargetOnBehalfOf(key)}
+						{@const isConflict = diff.ahead > 0 && diff.behind > 0}
+						{@const existsInBothWorkspaces = !(
+							(diff.exists_in_fork && !diff.exists_in_source) ||
+							(!diff.exists_in_fork && diff.exists_in_source)
+						)}
+						<!-- On-behalf-of selector -->
+						{#if itemNeedsOnBehalfOfSelection(key, diff.kind)}
+							<OnBehalfOfSelector
+								targetWorkspace={deployTargetWorkspace}
+								targetValue={targetOnBehalfOf}
+								selected={onBehalfOfChoice[key]}
+								onSelect={(choice, details) => {
+									onBehalfOfChoice[key] = choice
+									if (details) customOnBehalfOf[key] = details
+								}}
+								kind={diff.kind}
+								canPreserve={canPreserveOnBehalfOf}
+								customValue={customOnBehalfOf[key]?.permissionedAs}
+							/>
+						{/if}
+						{#if diff.kind === 'raw_app'}
+							<Badge small icon={{ icon: FileJson }}>Raw</Badge>
+						{/if}
+						<!-- Status badges -->
+						{#if !diff.exists_in_fork && diff.exists_in_source && diff.ahead == 0 && diff.behind > 0}
 							<Badge
-								color="transparent"
-								class="font-semibold"
-								title={!mergeIntoParent ? currentWorkspaceInfo.name : parentWorkspaceInfo.name}
+								title="This item was newly created in the parent workspace '{parentWorkspaceId}'"
+								color="indigo"
+								size="xs">New</Badge
 							>
-								<span class="text-secondary">into:</span>
-								{#if !mergeIntoParent}
-									<GitFork size={14} />
-									<span class="text-emphasis">{currentWorkspaceInfo.id}</span>
-								{:else}
-									<Building size={14} />
-									<span class="text-emphasis">{parentWorkspaceInfo.id}</span>
-								{/if}
-							</Badge>
 						{/if}
-					</div>
-					<div class="flex items-center gap-2 text-sm">
-						<Badge color="transparent">
-							{comparison.summary.total_diffs} total items
-						</Badge>
-						<Badge color="transparent">
-							{selectableDiffs.length}
-							{mergeIntoParent ? 'deployable' : 'updateable'}
-						</Badge>
-						{#if conflictingDiffs.length > 0}
-							<Badge color="orange">
-								<AlertTriangle class="w-3 h-3 inline mr-1" />
-								{conflictingDiffs.length} conflicts
-							</Badge>
+						{#if !diff.exists_in_fork && diff.exists_in_source && diff.ahead > 0}
+							<Badge title="This item was deleted in '{currentWorkspaceId}'" color="red" size="xs"
+								>Deleted</Badge
+							>
 						{/if}
-					</div>
-				</div>
-			</div>
-		{/snippet}
-
-		{#snippet alerts()}
-			{#if mergeIntoParent}
-				<ParentWorkspaceProtectionAlert
-					{parentWorkspaceId}
-					onUpdateCanDeploy={(canDeploy) => {
-						canDeployToParent = canDeploy
-					}}
-				/>
-			{/if}
-			{#if conflictingDiffs.length > 0}
-				<Alert title="Conflicting changes detected" type="warning" class="mt-2">
-					<span>
-						{conflictingDiffs.length} item{conflictingDiffs.length !== 1 ? 's have' : ' has'} conflicting
-						changes, it was modified on the original workspace while changes were made on this fork.
-						Make sure to resolve these before merging.
-					</span>
-				</Alert>
-			{/if}
-			{#if hasBehindChanges && hasAheadChanges && !(mergeIntoParent && !canDeployToParent)}
-				<Alert
-					title="This fork is behind {parentWorkspaceId} and needs to be up to date before deploying"
-					type="warning"
-					class="my-2"
-				>
-					You have items behind '{parentWorkspaceId}'. You need to update and test your changes
-					before being able to deploy.
-					<span class="font-medium flex flex-row gap-1 text-red-500">
-						<input
-							type="checkbox"
-							bind:checked={allowBehindChangesOverride}
-							class="rounded max-w-4"
-						/>
-						Override: Deploy despite {itemsWithBehindChanges.length} outdated item{itemsWithBehindChanges.length !==
-						1
-							? 's'
-							: ''}
-					</span>
-				</Alert>
-			{/if}
-			{#if !comparison.all_ahead_items_visible || !comparison.all_behind_items_visible}
-				<Alert title="This fork has changes not visible to your user" type="warning" class="my-2">
-					{#if !comparison.all_ahead_items_visible && !comparison.all_behind_items_visible}
-						This fork is ahead and behind its parent
-					{:else if !comparison.all_behind_items_visible}
-						This fork is behind of its parent
-					{:else if !comparison.all_ahead_items_visible}
-						This fork is ahead of its parent
-					{/if}
-					and some of the changes are not visible by you. Only a user with access to the whole context
-					may deploy or update this fork. You can share the link to this page to someone with proper
-					permissions to get it deployed.
-				</Alert>
-			{/if}
-		{/snippet}
-
-		{#snippet itemSummary(item)}
-			{@const diff = item.diff as WorkspaceItemDiff}
-			{@const key = item.key}
-			{@const isSelectable = selectableDiffs.includes(diff)}
-			{@const oldSummary = mergeIntoParent ? summaryCache[key]?.parent : summaryCache[key]?.current}
-			{@const newSummary = mergeIntoParent ? summaryCache[key]?.current : summaryCache[key]?.parent}
-			{@const existsInBothWorkspaces = !(
-				(diff.exists_in_fork && !diff.exists_in_source) ||
-				(!diff.exists_in_fork && diff.exists_in_source)
-			)}
-			{#if oldSummary != newSummary && isSelectable && existsInBothWorkspaces}
-				<span class="line-through text-secondary">{oldSummary || diff.path}</span>
-				{newSummary || diff.path}
-			{:else if !existsInBothWorkspaces}
-				{newSummary || oldSummary || diff.path}
-			{:else}
-				{newSummary || diff.path}
-			{/if}
-		{/snippet}
-
-		{#snippet itemActions(item)}
-			{@const diff = item.diff as WorkspaceItemDiff}
-			{@const key = item.key}
-			{@const targetOnBehalfOf = getTargetOnBehalfOf(key)}
-			{@const isConflict = diff.ahead > 0 && diff.behind > 0}
-			{@const existsInBothWorkspaces = !(
-				(diff.exists_in_fork && !diff.exists_in_source) ||
-				(!diff.exists_in_fork && diff.exists_in_source)
-			)}
-			<!-- On-behalf-of selector -->
-			{#if itemNeedsOnBehalfOfSelection(key, diff.kind)}
-				<OnBehalfOfSelector
-					targetWorkspace={deployTargetWorkspace}
-					targetValue={targetOnBehalfOf}
-					selected={onBehalfOfChoice[key]}
-					onSelect={(choice, details) => {
-						onBehalfOfChoice[key] = choice
-						if (details) customOnBehalfOf[key] = details
-					}}
-					kind={diff.kind}
-					canPreserve={canPreserveOnBehalfOf}
-					customValue={customOnBehalfOf[key]?.permissionedAs}
-				/>
-			{/if}
-			{#if diff.kind === 'raw_app'}
-				<Badge small icon={{ icon: FileJson }}>Raw</Badge>
-			{/if}
-			<!-- Status badges -->
-			{#if !diff.exists_in_fork && diff.exists_in_source && diff.ahead == 0 && diff.behind > 0}
-				<Badge
-					title="This item was newly created in the parent workspace '{parentWorkspaceId}'"
-					color="indigo"
-					size="xs">New</Badge
-				>
-			{/if}
-			{#if !diff.exists_in_fork && diff.exists_in_source && diff.ahead > 0}
-				<Badge title="This item was deleted in '{currentWorkspaceId}'" color="red" size="xs"
-					>Deleted</Badge
-				>
-			{/if}
-			{#if diff.exists_in_fork && !diff.exists_in_source && diff.behind > 0}
-				<Badge
-					title="This item was deleted in the parent workspace '{parentWorkspaceId}'"
-					color="red"
-					size="xs">Deleted</Badge
-				>
-			{/if}
-			{#if diff.exists_in_fork && !diff.exists_in_source && diff.ahead > 0 && diff.behind == 0}
-				<Badge
-					title="This item was newly created in '{currentWorkspaceId}'"
-					color="indigo"
-					size="xs">New</Badge
-				>
-			{/if}
-			{#if !deploymentStatus[key] || deploymentStatus[key].status != 'deployed'}
-				<div class="flex items-center gap-2">
-					{#if isConflict || existsInBothWorkspaces}
-						{#if diff.ahead > 0}
-							<Badge color="green" size="xs">
-								<ArrowUpRight class="w-3 h-3 inline" />
-								{diff.ahead} ahead
-							</Badge>
+						{#if diff.exists_in_fork && !diff.exists_in_source && diff.behind > 0}
+							<Badge
+								title="This item was deleted in the parent workspace '{parentWorkspaceId}'"
+								color="red"
+								size="xs">Deleted</Badge
+							>
+						{/if}
+						{#if diff.exists_in_fork && !diff.exists_in_source && diff.ahead > 0 && diff.behind == 0}
+							<Badge
+								title="This item was newly created in '{currentWorkspaceId}'"
+								color="indigo"
+								size="xs">New</Badge
+							>
 						{/if}
-						{#if diff.behind > 0}
-							<Badge color="blue" size="xs">
-								<ArrowDownRight class="w-3 h-3 inline" />
-								{diff.behind} behind
-							</Badge>
+						{@const ciStatus = getCiTestStatus(diff)}
+						{#if ciStatus === 'pass'}
+							<Badge color="green" size="xs"><CircleCheck size={10} class="mr-0.5" />CI pass</Badge>
+						{:else if ciStatus === 'fail'}
+							<Badge color="red" size="xs"><CircleX size={10} class="mr-0.5" />CI fail</Badge>
+						{:else if ciStatus === 'running'}
+							<Badge color="yellow" size="xs"
+								><Loader2 size={10} class="mr-0.5 animate-spin" />CI</Badge
+							>
 						{/if}
-						{#if isConflict}
-							<Badge color="orange" size="xs">
-								<AlertTriangle class="w-3 h-3 inline" />
-								Conflict
-							</Badge>
+						{#if !deploymentStatus[key] || deploymentStatus[key].status != 'deployed'}
+							<div class="flex items-center gap-2">
+								{#if isConflict || existsInBothWorkspaces}
+									{#if diff.ahead > 0}
+										<Badge color="green" size="xs">
+											<ArrowUpRight class="w-3 h-3 inline" />
+											{diff.ahead} ahead
+										</Badge>
+									{/if}
+									{#if diff.behind > 0}
+										<Badge color="blue" size="xs">
+											<ArrowDownRight class="w-3 h-3 inline" />
+											{diff.behind} behind
+										</Badge>
+									{/if}
+									{#if isConflict}
+										<Badge color="orange" size="xs">
+											<AlertTriangle class="w-3 h-3 inline" />
+											Conflict
+										</Badge>
+									{/if}
+								{/if}
+							</div>
+							<div class:invisible={!existsInBothWorkspaces}>
+								<Button
+									size="xs"
+									variant="subtle"
+									onclick={() => showDiff(diff.kind as Kind, diff.path)}
+								>
+									<DiffIcon class="w-3 h-3" />
+									Show diff
+								</Button>
+							</div>
 						{/if}
 					{/if}
-				</div>
-				<div class:invisible={!existsInBothWorkspaces}>
-					<Button size="xs" variant="subtle" onclick={() => showDiff(diff.kind as Kind, diff.path)}>
-						<DiffIcon class="w-3 h-3" />
-						Show diff
-					</Button>
-				</div>
-			{/if}
-		{/snippet}
+				{/snippet}
 
-		{#snippet footer()}
-			<div class="flex items-center justify-between">
-				<div></div>
+				{#snippet footer()}
+					<div class="flex items-center justify-between">
+						<div></div>
 
-				<div class="flex flex-col items-end gap-2">
-					{#if comparison.all_behind_items_visible && comparison.all_ahead_items_visible}
-						{#if !(mergeIntoParent && !canDeployToParent)}
-							<Button
-								color="blue"
-								disabled={selectedItems.length === 0 ||
-									deploying ||
-									(hasBehindChanges && !allowBehindChangesOverride) ||
-									(mergeIntoParent && !canDeployToParent) ||
-									hasUnselectedOnBehalfOf}
-								loading={deploying}
-								on:click={deployChanges}
-							>
-								{mergeIntoParent ? 'Deploy' : 'Update'}
-								{selectedItems.length} Item{selectedItems.length !== 1 ? 's' : ''}
-								{#if selectedConflicts != 0}
-									({selectedConflicts} conflicts)
+						<div class="flex flex-col items-end gap-2">
+							{#if comparison.all_behind_items_visible && comparison.all_ahead_items_visible}
+								<div class="flex items-center gap-2">
+									{#if mergeIntoParent && !hasOpenDeploymentRequest && !deploymentRequestPanel?.isDialogOpen()}
+										<Button
+											variant="default"
+											startIcon={{ icon: UserPlus }}
+											on:click={() => deploymentRequestPanel?.openRequestDialog()}
+										>
+											Request deployment
+										</Button>
+									{/if}
+									<Button
+										variant="accent"
+										disabled={selectedItems.length === 0 ||
+											deploying ||
+											(hasBehindChanges && !allowBehindChangesOverride) ||
+											(mergeIntoParent && !canDeployToParent) ||
+											hasUnselectedOnBehalfOf}
+										loading={deploying}
+										on:click={deployChanges}
+									>
+										{mergeIntoParent ? 'Deploy' : 'Update'}
+										{selectedItems.length} Item{selectedItems.length !== 1 ? 's' : ''}
+										{#if selectedConflicts != 0}
+											({selectedConflicts} conflicts)
+										{/if}
+									</Button>
+								</div>
+								{#if !(mergeIntoParent && !canDeployToParent) && hasUnselectedOnBehalfOf}
+									<span class="text-xs text-yellow-600">
+										You must set the "on behalf of" user for all items before deploying
+										<Tooltip class="text-yellow-600">
+											The "run on behalf of" field defines which user's permissions will be applied
+											during execution. Make sure this is set to an appropriate user before
+											deploying.
+										</Tooltip>
+									</span>
 								{/if}
-							</Button>
-							{#if hasUnselectedOnBehalfOf}
-								<span class="text-xs text-yellow-600">
-									You must set the "on behalf of" user for all items before deploying
-									<Tooltip class="text-yellow-600">
-										The "run on behalf of" field defines which user's permissions will be applied
-										during execution. Make sure this is set to an appropriate user before deploying.
-									</Tooltip>
-								</span>
 							{/if}
-						{/if}
-					{/if}
 
-					{#if deploymentErrorMessage != ''}
-						<Alert
-							title="Cannot {mergeIntoParent ? 'deploy these changes' : 'update these items'}"
-							type="error"
-							class="my-2 max-w-80"
-						>
-							<span>
-								{deploymentErrorMessage}
-							</span>
-						</Alert>
-					{/if}
-				</div>
-			</div>
-		{/snippet}
-	</WorkspaceDeployLayout>
+							{#if deploymentErrorMessage != ''}
+								<Alert
+									title="Cannot {mergeIntoParent ? 'deploy these changes' : 'update these items'}"
+									type="error"
+									class="my-2 max-w-80"
+								>
+									<span>
+										{deploymentErrorMessage}
+									</span>
+								</Alert>
+							{/if}
+						</div>
+					</div>
+				{/snippet}
+			</WorkspaceDeployLayout>
 
-	<!-- Fork Triggers Section -->
-	<div class="mt-6">
-		<div class="flex items-center gap-2 mb-2">
-			<h3 class="text-sm font-semibold">Triggers created in this fork</h3>
-			{#if !loadingTriggers}
-				<Badge color="indigo" size="xs"
-					>{forkTriggers.length} trigger{forkTriggers.length !== 1 ? 's' : ''}</Badge
-				>
-			{/if}
+			<DeploymentRequestPanel
+				bind:this={deploymentRequestPanel}
+				forkWorkspaceId={currentWorkspaceId}
+				{parentWorkspaceId}
+				currentUsername={$userStore?.username ?? ''}
+				isAdmin={$userStore?.is_admin ?? false}
+				onStateChange={(open) => {
+					hasOpenDeploymentRequest = open
+				}}
+			/>
 		</div>
 
-		<Alert title="Deploy and/or delete these triggers" type="info" class="mb-2">
-			When forking a workspace, triggers are not forked to avoid unnecessary executions or
-			collisions. If you created this triggers with the intention of deploying them to the parent
-			workspace, you can do so here. Otherwise it is recommended to delete them or disable them.
-		</Alert>
-
-		{#if loadingTriggers}
-			<div class="flex items-center gap-2 text-secondary text-sm p-4">
-				<Loader2 class="animate-spin w-4 h-4" />
-				Loading triggers...
-			</div>
-		{:else if forkTriggers.length === 0}
-			<div class="text-secondary text-sm p-4 border rounded-md bg-surface-tertiary">
-				No triggers in this fork workspace.
-			</div>
-		{:else}
-			<div class="border rounded-md bg-surface-tertiary">
-				{#each forkTriggers as trigger (trigger.triggerKind + ':' + trigger.path)}
-					<Row
-						kind="trigger"
-						triggerKind={trigger.triggerKind}
-						path={trigger.path}
-						href={getTriggerHref(trigger.triggerKind)}
-						marked={undefined}
-						isSelectable={false}
-						canFavorite={false}
-						workspaceId={currentWorkspaceId}
-					>
-						{#snippet customSummary()}
-							<span>{getTriggerDisplayName(trigger.triggerKind)}</span>
-							<span class="text-secondary mx-1">&rarr;</span>
-							<span class="text-secondary">{trigger.scriptPath}</span>
-							{#if trigger.isFlow}
-								<Badge color="blue" size="xs">flow</Badge>
-							{/if}
-							{#if trigger.extraLabel}
-								<span class="text-tertiary text-xs">({trigger.extraLabel})</span>
-							{/if}
-						{/snippet}
-						{#snippet actions()}
-							{#if trigger.enabled != null}
-								<Badge color={trigger.enabled ? 'green' : 'gray'} size="xs">
-									{trigger.enabled ? 'Enabled' : 'Disabled'}
-								</Badge>
-							{/if}
-							<Button
-								size="xs"
-								variant="subtle"
-								onclick={() => {
-									deploymentDrawer?.openDrawer(trigger.path, 'trigger', {
-										triggers: { kind: trigger.triggerKind }
-									})
-								}}
-							>
-								<Upload size={12} />
-								Deploy
-							</Button>
-							<Button size="xs" variant="subtle" color="red" onclick={() => deleteTrigger(trigger)}>
-								<Trash2 size={12} />
-							</Button>
-						{/snippet}
-					</Row>
-				{/each}
-			</div>
-		{/if}
+		<div class="bg-surface-tertiary p-4 rounded-md border">
+			<DatatableSchemaDiff {currentWorkspaceId} {parentWorkspaceId} />
+		</div>
 	</div>
 
-	<DeployWorkspaceDrawer bind:this={deploymentDrawer} />
 	<DiffDrawer bind:this={diffDrawer} {isFlow} />
-	<ConfirmationModal
-		title="Delete trigger"
-		confirmationText="Delete"
-		open={!!triggerToDelete}
-		onConfirmed={confirmDeleteTrigger}
-		onCanceled={() => (triggerToDelete = undefined)}
-	>
-		{#if triggerToDelete}
-			Are you sure you want to delete the {getTriggerDisplayName(triggerToDelete.triggerKind)} trigger
-			'{triggerToDelete.path}'?
-		{/if}
-	</ConfirmationModal>
+
+	<Drawer bind:open={triggerDiffOpen} size="900px">
+		<DrawerContent
+			title={triggerDiffPayload
+				? `${triggerDiffPayload.kindLabel} ${triggerDiffPayload.path}`
+				: 'Trigger diff'}
+			on:close={() => (triggerDiffOpen = false)}
+		>
+			{#if triggerDiffPayload}
+				<div class="flex flex-col h-full">
+					<div class="flex-1 min-h-0">
+						<DiffEditor
+							open={triggerDiffOpen}
+							className="!h-full"
+							defaultLang="yaml"
+							defaultOriginal={triggerDiffPayload.original}
+							defaultModified={triggerDiffPayload.modified}
+							readOnly
+							inlineDiff={false}
+						/>
+					</div>
+				</div>
+			{/if}
+		</DrawerContent>
+	</Drawer>
 {:else}
 	<div class="flex items-center justify-center h-full">
 		<div class="text-gray-500">No comparison data available</div>