windmill-components 1.655.2 → 1.665.1

package/package/components/instanceSettings/GhesAppSettings.svelte

@@ -0,0 +1,161 @@
+<script lang="ts">import TextInput from '../text_input/TextInput.svelte';
+import Toggle from '../Toggle.svelte';
+let { values, disabled = false } = $props();
+// Ensure the nested object exists
+if (!$values['github_enterprise_app']) {
+    $values['github_enterprise_app'] = {};
+}
+let selfManaged = $derived(!!$values['github_enterprise_app'].self_managed);
+let fieldsDisabled = $derived(disabled || !selfManaged);
+</script>
+
+<div class="space-y-6">
+	<Toggle
+		size="xs"
+		options={{ right: 'Self-managed GitHub App' }}
+		checked={selfManaged}
+		on:change={() => {
+			$values['github_enterprise_app'] = {
+				...$values['github_enterprise_app'],
+				self_managed: !selfManaged
+			}
+		}}
+	/>
+
+	{#if !selfManaged}
+		<p class="text-xs text-secondary">
+			Using the managed Windmill GitHub App via stats.windmill.dev. Enable self-managed mode to
+			configure your own GitHub App (required for GitHub Enterprise Server).
+		</p>
+	{:else}
+		<details class="mt-1">
+			<summary class="text-xs font-medium text-secondary cursor-pointer hover:text-primary"
+				>How to create a GitHub App</summary
+			>
+			<div class="mt-2 p-3 bg-surface rounded text-2xs text-secondary space-y-2">
+				<p>
+					<strong>1.</strong> On your GitHub instance, go to
+					<strong
+						>Settings &rarr; Developer settings &rarr; GitHub Apps &rarr; New GitHub App</strong
+					>.
+				</p>
+				<p><strong>2.</strong> Fill in the required fields:</p>
+				<ul class="list-disc ml-4 space-y-1">
+					<li>
+						<strong>GitHub App name</strong>: e.g. <code>windmill-sync</code> (this becomes the app slug)
+					</li>
+					<li>
+						<strong>Homepage URL</strong>: your Windmill instance URL
+					</li>
+					<li>
+						<strong>Callback URL</strong>: <code>&lt;your-windmill-url&gt;/gh_success</code>
+					</li>
+					<li>
+						<strong>Setup URL</strong> (optional):
+						<code>&lt;your-windmill-url&gt;/gh_success</code> with "Redirect on update" checked
+					</li>
+					<li>Uncheck <strong>Active</strong> under Webhook (not needed)</li>
+				</ul>
+				<p><strong>3.</strong> Set repository permissions:</p>
+				<ul class="list-disc ml-4 space-y-1">
+					<li><strong>Contents</strong>: Read &amp; write</li>
+					<li><strong>Metadata</strong>: Read-only</li>
+				</ul>
+				<p>
+					<strong>4.</strong> Under "Where can this GitHub App be installed?", choose
+					<strong>Any account</strong> (or restrict to your organization).
+				</p>
+				<p>
+					<strong>5.</strong> Click <strong>Create GitHub App</strong>. On the next page, note the
+					<strong>App ID</strong> and <strong>Client ID</strong>.
+				</p>
+				<p>
+					<strong>6.</strong> Scroll down and click <strong>Generate a private key</strong>. Save
+					the downloaded <code>.pem</code> file — paste its contents into the Private Key field below.
+				</p>
+				<p>
+					<strong>7.</strong> The <strong>App Slug</strong> is the URL-friendly name shown in the
+					app's URL (e.g. <code>github.com/apps/<strong>windmill-sync</strong></code>).
+				</p>
+				<p>
+					<strong>8.</strong> The <strong>Base URL</strong> is your GitHub instance root (e.g.
+					<code>https://github.com</code> or <code>https://github.mycompany.com</code>).
+				</p>
+			</div>
+		</details>
+	{/if}
+
+	<div class="grid grid-cols-2 gap-x-2 gap-y-6">
+		<div class="flex flex-col gap-1">
+			<label for="ghes_base_url" class="block text-xs font-semibold text-emphasis mb-1">
+				Base URL
+			</label>
+			<TextInput
+				inputProps={{
+					type: 'text',
+					id: 'ghes_base_url',
+					placeholder: 'https://github.mycompany.com',
+					disabled: fieldsDisabled
+				}}
+				bind:value={$values['github_enterprise_app'].base_url}
+			/>
+		</div>
+		<div class="flex flex-col gap-1">
+			<label for="ghes_app_id" class="block text-xs font-semibold text-emphasis mb-1">
+				App ID
+			</label>
+			<TextInput
+				inputProps={{
+					type: 'number',
+					id: 'ghes_app_id',
+					placeholder: '12345',
+					disabled: fieldsDisabled
+				}}
+				bind:value={$values['github_enterprise_app'].app_id}
+			/>
+		</div>
+		<div class="flex flex-col gap-1">
+			<label for="ghes_app_slug" class="block text-xs font-semibold text-emphasis mb-1">
+				App Slug
+			</label>
+			<TextInput
+				inputProps={{
+					type: 'text',
+					id: 'ghes_app_slug',
+					placeholder: 'my-windmill-app',
+					disabled: fieldsDisabled
+				}}
+				bind:value={$values['github_enterprise_app'].app_slug}
+			/>
+		</div>
+		<div class="flex flex-col gap-1">
+			<label for="ghes_client_id" class="block text-xs font-semibold text-emphasis mb-1">
+				Client ID
+			</label>
+			<TextInput
+				inputProps={{
+					type: 'text',
+					id: 'ghes_client_id',
+					placeholder: 'Iv1.abc123',
+					disabled: fieldsDisabled
+				}}
+				bind:value={$values['github_enterprise_app'].client_id}
+			/>
+		</div>
+	</div>
+
+	<div class="flex flex-col gap-1">
+		<label for="ghes_private_key" class="block text-xs font-semibold text-emphasis mb-1">
+			Private Key (PEM)
+		</label>
+		<textarea
+			id="ghes_private_key"
+			class="w-full h-32 font-mono text-xs p-2 border rounded resize-y {fieldsDisabled
+				? 'bg-surface-disabled text-disabled cursor-not-allowed'
+				: 'bg-surface text-primary'}"
+			placeholder="-----BEGIN RSA PRIVATE KEY-----&#10;...&#10;-----END RSA PRIVATE KEY-----"
+			disabled={fieldsDisabled}
+			bind:value={$values['github_enterprise_app'].private_key}
+		></textarea>
+	</div>
+</div>

package/package/components/instanceSettings/GhesAppSettings.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Writable } from 'svelte/store';
+interface Props {
+    values: Writable<Record<string, any>>;
+    disabled?: boolean;
+}
+declare const GhesAppSettings: import("svelte").Component<Props, {}, "">;
+type GhesAppSettings = ReturnType<typeof GhesAppSettings>;
+export default GhesAppSettings;

package/package/components/instanceSettings/IndexerMemorySettings.svelte

@@ -12,6 +12,7 @@ let { values, disabled = false, errors = {} } = $props();
 let clearJobsIndexModalOpen = $state(false);
 let clearServiceLogsIndexModalOpen = $state(false);
 let status = $state(undefined);
+let diskSizes = $state(undefined);
 let statusLoading = $state(true);
 let statusError = $state(false);
 function formatTimeAgo(isoDate) {
@@ -29,10 +30,16 @@ async function loadStatus() {
     statusLoading = true;
     statusError = false;
     try {
-        status = await IndexSearchService.getIndexerStatus();
+        const [statusRes, diskRes] = await Promise.all([
+            IndexSearchService.getIndexerStatus(),
+            IndexSearchService.getIndexDiskStorageSizes().catch(() => undefined)
+        ]);
+        status = statusRes;
+        diskSizes = diskRes;
     }
     catch (e) {
         status = undefined;
+        diskSizes = undefined;
         statusError = true;
     }
     finally {
@@ -128,7 +135,11 @@ loadStatus();
 								: 'bg-red-500'}"
 						></span>
 						<span class="text-primary font-medium">{label}:</span>
-						<span class="font-semibold {entry?.is_alive ? 'text-green-600 dark:text-green-400' : 'text-red-600 dark:text-red-400'}">
+						<span
+							class="font-semibold {entry?.is_alive
+								? 'text-green-600 dark:text-green-400'
+								: 'text-red-600 dark:text-red-400'}"
+						>
 							{entry?.is_alive ? 'Running' : 'Stopped'}
 						</span>
 						{#if entry?.last_locked_at}
@@ -150,21 +161,21 @@ loadStatus();
 			<div class="flex flex-col gap-1 text-2xs text-tertiary">
 				<span>
 					Jobs index:
-					{#if status.job_indexer?.storage?.disk_size_bytes != null}
-						Disk: {displaySize(status.job_indexer.storage.disk_size_bytes) ?? 'N/A'}
+					{#if diskSizes?.job_index_disk_size_bytes != null}
+						Disk: {displaySize(diskSizes.job_index_disk_size_bytes) ?? 'N/A'}
 					{/if}
 					{#if status.job_indexer?.storage?.s3_size_bytes != null}
-						{#if status.job_indexer?.storage?.disk_size_bytes != null}&middot;{/if}
+						{#if diskSizes?.job_index_disk_size_bytes != null}&middot;{/if}
 						S3: {displaySize(status.job_indexer.storage.s3_size_bytes) ?? 'N/A'}
 					{/if}
 				</span>
 				<span>
 					Service logs index:
-					{#if status.log_indexer?.storage?.disk_size_bytes != null}
-						Disk: {displaySize(status.log_indexer.storage.disk_size_bytes) ?? 'N/A'}
+					{#if diskSizes?.log_index_disk_size_bytes != null}
+						Disk: {displaySize(diskSizes.log_index_disk_size_bytes) ?? 'N/A'}
 					{/if}
 					{#if status.log_indexer?.storage?.s3_size_bytes != null}
-						{#if status.log_indexer?.storage?.disk_size_bytes != null}&middot;{/if}
+						{#if diskSizes?.log_index_disk_size_bytes != null}&middot;{/if}
 						S3: {displaySize(status.log_indexer.storage.s3_size_bytes) ?? 'N/A'}
 					{/if}
 				</span>

package/package/components/instanceSettings/InstanceAISettings.svelte

@@ -0,0 +1,132 @@
+<script lang="ts">import { JobService, SettingService, WorkspaceService } from '../../gen';
+import { setCopilotInfo } from '../../aiStore';
+import { workspaceStore, userStore } from '../../stores';
+import { getUserExt } from '../../user';
+import { sendUserToast } from '../../toast';
+import { workspaceAIClients } from '../copilot/lib';
+import AISettings from '../workspaceSettings/AISettings.svelte';
+import { Alert, Button } from '../common';
+let { hasUnsavedChanges = $bindable(false), disableChatOffset = false, showHubSync = false } = $props();
+let initialConfig = $state(undefined);
+let loaded = $state(false);
+let aiSettings = $state(undefined);
+async function loadConfig() {
+    try {
+        initialConfig =
+            (await SettingService.getGlobal({ key: 'ai_config' })) ?? {};
+        loaded = true;
+    }
+    catch (e) {
+        console.error('Failed to load instance AI config', e);
+        sendUserToast('Failed to load instance AI config', true);
+    }
+}
+async function handleCustomSave(config) {
+    const hasProviders = Object.keys(config.providers ?? {}).length > 0;
+    await SettingService.setGlobal({
+        key: 'ai_config',
+        requestBody: { value: hasProviders ? config : null }
+    });
+    if ($workspaceStore) {
+        try {
+            const effectiveConfig = await WorkspaceService.getCopilotInfo({
+                workspace: $workspaceStore
+            });
+            setCopilotInfo(effectiveConfig);
+        }
+        catch (e) {
+            console.error('Failed to refresh workspace AI state after instance save', e);
+        }
+    }
+    sendUserToast('Instance AI settings saved');
+}
+export async function persistBeforeExit() {
+    return (await aiSettings?.saveIfDirtyAndValid()) ?? true;
+}
+// Ensure stores are set (this page may bypass the (logged) layout)
+async function ensureStores() {
+    if (!$workspaceStore) {
+        $workspaceStore = 'admins';
+    }
+    if (!$userStore) {
+        $userStore = await getUserExt($workspaceStore);
+    }
+    workspaceAIClients.init($workspaceStore);
+}
+ensureStores();
+loadConfig();
+// --- Hub sync ---
+let hubSyncStatus = $state('idle');
+let hubSyncMessage = $state('');
+async function syncFromHub() {
+    hubSyncStatus = 'loading';
+    hubSyncMessage = '';
+    try {
+        await JobService.runWaitResultScriptByPath({
+            workspace: 'admins',
+            path: 'u/admin/hub_sync',
+            requestBody: {}
+        });
+        hubSyncStatus = 'success';
+        hubSyncMessage = 'Resource types synced from hub successfully';
+    }
+    catch (e) {
+        hubSyncMessage =
+            e?.body?.error?.message ||
+                e?.body?.message ||
+                (typeof e?.body === 'string' ? e.body : null) ||
+                e?.message ||
+                'Failed to sync from hub';
+        hubSyncStatus = 'error';
+    }
+}
+</script>
+
+{#if loaded}
+	{#if showHubSync}
+		<div
+			class="p-3 border rounded-md bg-surface-secondary mb-4 mt-4 flex items-center justify-between gap-4"
+		>
+			<div>
+				<p class="text-xs font-medium text-secondary">Resource types</p>
+				<p class="text-2xs text-tertiary mt-0.5">
+					AI providers require their resource types. Sync from the Hub if they are missing.
+				</p>
+			</div>
+			<Button
+				variant="default"
+				unifiedSize="sm"
+				loading={hubSyncStatus === 'loading'}
+				onClick={syncFromHub}
+			>
+				Sync from hub
+			</Button>
+		</div>
+		{#if hubSyncStatus === 'success'}
+			<div class="mb-4">
+				<Alert type="success" title="Resource types synced">
+					{hubSyncMessage}
+				</Alert>
+			</div>
+		{:else if hubSyncStatus === 'error'}
+			<div class="mb-4">
+				<Alert type="error" title="Sync failed">
+					{hubSyncMessage}
+				</Alert>
+			</div>
+		{/if}
+	{/if}
+
+	<AISettings
+		bind:this={aiSettings}
+		bind:hasUnsavedChanges
+		{initialConfig}
+		workspace="admins"
+		{disableChatOffset}
+		title="Windmill AI"
+		description="Windmill AI integrates with your favorite AI providers and models. Set your AI settings at the instance level to be able to use them on all your workspaces. Workspace-level settings can override these."
+		link="https://www.windmill.dev/docs/core_concepts/ai_generation"
+		promptScope="instance"
+		customSave={handleCustomSave}
+	/>
+{/if}

package/package/components/instanceSettings/InstanceAISettings.svelte.d.ts

@@ -0,0 +1,10 @@
+interface Props {
+    hasUnsavedChanges?: boolean;
+    disableChatOffset?: boolean;
+    showHubSync?: boolean;
+}
+declare const InstanceAISettings: import("svelte").Component<Props, {
+    persistBeforeExit: () => Promise<boolean>;
+}, "hasUnsavedChanges">;
+type InstanceAISettings = ReturnType<typeof InstanceAISettings>;
+export default InstanceAISettings;

package/package/components/instanceSettings/WorkspaceRegistries.svelte

@@ -0,0 +1,293 @@
+<script lang="ts">import { WORKSPACE_REGISTRY_SETTINGS } from '../instanceSettings';
+import { Button } from '../common';
+import SettingCard from './SettingCard.svelte';
+import { WorkspaceService } from '../../gen';
+import { sendUserToast } from '../../toast';
+import Toggle from '../Toggle.svelte';
+import SimpleEditor from '../SimpleEditor.svelte';
+import { ChevronDown, ChevronRight, Plus, Trash2, X } from 'lucide-svelte';
+import Password from '../Password.svelte';
+import { SvelteSet } from 'svelte/reactivity';
+import { untrack } from 'svelte';
+let { values, loading } = $props();
+let workspaces = $state([]);
+let expandedWorkspaces = new SvelteSet();
+let showAddWorkspace = $state(false);
+let newWorkspaceId = $state('');
+const registries = $derived(($values['workspace_registries'] ?? {}));
+const workspaceIds = $derived(Object.keys(registries).sort());
+async function loadWorkspaces() {
+    try {
+        const result = await WorkspaceService.listWorkspacesAsSuperAdmin({ perPage: 1000 });
+        workspaces = result.map((w) => ({ id: w.id, name: w.name }));
+    }
+    catch (e) {
+        console.error('Failed to load workspaces', e);
+    }
+}
+$effect(() => {
+    if (!loading) {
+        untrack(() => loadWorkspaces());
+    }
+});
+function addWorkspace(wsId) {
+    if (!wsId || registries[wsId]) {
+        sendUserToast('Workspace already has overrides or invalid ID', true);
+        return;
+    }
+    if (!$values['workspace_registries']) {
+        $values['workspace_registries'] = {};
+    }
+    $values['workspace_registries'] = { ...$values['workspace_registries'], [wsId]: {} };
+    expandedWorkspaces.add(wsId);
+    showAddWorkspace = false;
+    newWorkspaceId = '';
+}
+function removeWorkspace(wsId) {
+    if ($values['workspace_registries']) {
+        const copy = { ...$values['workspace_registries'] };
+        delete copy[wsId];
+        $values['workspace_registries'] = Object.keys(copy).length > 0 ? copy : undefined;
+        expandedWorkspaces.delete(wsId);
+    }
+}
+function toggleExpand(wsId) {
+    if (expandedWorkspaces.has(wsId)) {
+        expandedWorkspaces.delete(wsId);
+    }
+    else {
+        expandedWorkspaces.add(wsId);
+    }
+}
+function updateSetting(wsId, key, value, isBool = false) {
+    if (!$values['workspace_registries']) {
+        $values['workspace_registries'] = {};
+    }
+    if (!$values['workspace_registries'][wsId]) {
+        $values['workspace_registries'][wsId] = {};
+    }
+    const ws = { ...$values['workspace_registries'][wsId] };
+    if (!isBool && (value === undefined || value === null || value === '')) {
+        delete ws[key];
+    }
+    else if (isBool && (value === undefined || value === null)) {
+        delete ws[key];
+    }
+    else {
+        ws[key] = value;
+    }
+    $values['workspace_registries'] = {
+        ...$values['workspace_registries'],
+        [wsId]: ws
+    };
+}
+function addField(wsId, key) {
+    const setting = WORKSPACE_REGISTRY_SETTINGS.find((s) => s.key === key);
+    if (!setting)
+        return;
+    if (!$values['workspace_registries']) {
+        $values['workspace_registries'] = {};
+    }
+    if (!$values['workspace_registries'][wsId]) {
+        $values['workspace_registries'][wsId] = {};
+    }
+    // Initialize with proper default — bypass updateSetting to avoid empty-string deletion
+    const ws = { ...$values['workspace_registries'][wsId] };
+    ws[key] = setting.fieldType === 'boolean' ? false : '';
+    $values['workspace_registries'] = {
+        ...$values['workspace_registries'],
+        [wsId]: ws
+    };
+}
+function removeField(wsId, key) {
+    if (!$values['workspace_registries']?.[wsId])
+        return;
+    const ws = { ...$values['workspace_registries'][wsId] };
+    delete ws[key];
+    $values['workspace_registries'] = {
+        ...$values['workspace_registries'],
+        [wsId]: ws
+    };
+}
+function getAvailableFields(wsId) {
+    const wsSettings = registries[wsId] ?? {};
+    return WORKSPACE_REGISTRY_SETTINGS.filter((s) => !(s.key in wsSettings));
+}
+const availableWorkspaces = $derived(workspaces.filter((w) => !registries[w.id]));
+</script>
+
+<SettingCard
+	label="Workspace-Specific Registry Overrides"
+	ee_only=""
+	description="Override global registry settings for specific workspaces. Workspace overrides fully replace the global value for each configured key."
+>
+	{#if workspaceIds.length === 0 && !showAddWorkspace}
+		<p class="text-secondary text-xs">No workspace overrides configured.</p>
+	{/if}
+
+	<div class="flex flex-col gap-2">
+		{#each workspaceIds as wsId (wsId)}
+			{@const wsName = workspaces.find((w) => w.id === wsId)?.name}
+			{@const isExpanded = expandedWorkspaces.has(wsId)}
+			{@const wsSettings = registries[wsId] ?? {}}
+			{@const activeKeys = Object.keys(wsSettings)}
+			{@const activeSettings = WORKSPACE_REGISTRY_SETTINGS.filter((s) =>
+				activeKeys.includes(s.key)
+			)}
+			<div class="bg-surface-tertiary border rounded-md">
+				<button
+					class="w-full flex items-center justify-between px-3 py-2.5 hover:bg-surface-hover rounded-md text-left"
+					onclick={() => toggleExpand(wsId)}
+				>
+					<div class="flex items-center gap-2">
+						{#if isExpanded}
+							<ChevronDown size={14} class="text-secondary" />
+						{:else}
+							<ChevronRight size={14} class="text-secondary" />
+						{/if}
+						<span class="font-semibold text-xs text-primary">{wsId}</span>
+						{#if wsName}
+							<span class="text-secondary text-xs">({wsName})</span>
+						{/if}
+						{#if activeKeys.length > 0}
+							<span class="text-tertiary text-2xs"
+								>{activeKeys.length} override{activeKeys.length !== 1 ? 's' : ''}</span
+							>
+						{/if}
+					</div>
+					<Button
+						startIcon={{ icon: Trash2 }}
+						iconOnly
+						variant="subtle"
+						size="xs"
+						destructive
+						onclick={(e) => {
+							e.stopPropagation()
+							removeWorkspace(wsId)
+						}}
+					/>
+				</button>
+
+				{#if isExpanded}
+					<div class="px-3 pb-3 flex flex-col gap-3 border-t border-border pt-3">
+						{#each activeSettings as setting (setting.key)}
+							{@const currentValue = wsSettings[setting.key]}
+							<div class="flex flex-col gap-1">
+								<div class="flex items-center justify-between">
+									<span class="text-xs font-medium text-emphasis">{setting.label}</span>
+									<Button
+										startIcon={{ icon: X }}
+										iconOnly
+										variant="subtle"
+										size="xs"
+										destructive
+										onclick={() => removeField(wsId, setting.key)}
+										title="Remove override"
+									/>
+								</div>
+								{#if setting.fieldType === 'boolean'}
+									<Toggle
+										bind:checked={
+											() => currentValue ?? false, (v) => updateSetting(wsId, setting.key, v, true)
+										}
+									/>
+								{:else if setting.fieldType === 'codearea'}
+									<SimpleEditor
+										lang={setting.codeAreaLang ?? 'text'}
+										bind:code={() => currentValue ?? '', (v) => updateSetting(wsId, setting.key, v)}
+										autoHeight
+										fixedOverflowWidgets={false}
+									/>
+								{:else if setting.fieldType === 'password'}
+									<Password
+										bind:password={
+											() => currentValue ?? '', (v) => updateSetting(wsId, setting.key, v)
+										}
+										placeholder={setting.placeholder}
+									/>
+								{:else}
+									<input
+										type="text"
+										class="input-base text-sm"
+										value={currentValue ?? ''}
+										placeholder={setting.placeholder}
+										oninput={(e) => updateSetting(wsId, setting.key, e.currentTarget.value)}
+									/>
+								{/if}
+							</div>
+						{/each}
+
+						{#if getAvailableFields(wsId).length > 0}
+							<select
+								class="input-base text-xs"
+								value=""
+								onchange={(e) => {
+									const key = e.currentTarget.value
+									if (key) {
+										addField(wsId, key)
+										e.currentTarget.value = ''
+									}
+								}}
+							>
+								<option value="">+ Add a registry override...</option>
+								{#each getAvailableFields(wsId) as s (s.key)}
+									<option value={s.key}>{s.label}</option>
+								{/each}
+							</select>
+						{/if}
+					</div>
+				{/if}
+			</div>
+		{/each}
+	</div>
+
+	{#if showAddWorkspace}
+		<div class="flex items-center gap-2 mt-2">
+			{#if availableWorkspaces.length > 0}
+				<select class="input-base text-xs flex-1" bind:value={newWorkspaceId}>
+					<option value="">Select a workspace...</option>
+					{#each availableWorkspaces as ws (ws.id)}
+						<option value={ws.id}>{ws.id} ({ws.name})</option>
+					{/each}
+				</select>
+			{:else}
+				<input
+					type="text"
+					class="input-base text-xs"
+					placeholder="Workspace ID"
+					bind:value={newWorkspaceId}
+				/>
+			{/if}
+			<Button
+				variant="default"
+				size="xs"
+				disabled={!newWorkspaceId}
+				onclick={() => addWorkspace(newWorkspaceId)}
+			>
+				Add
+			</Button>
+			<Button
+				variant="subtle"
+				size="xs"
+				onclick={() => {
+					showAddWorkspace = false
+					newWorkspaceId = ''
+				}}
+			>
+				Cancel
+			</Button>
+		</div>
+	{:else}
+		<div class="flex justify-start mt-1">
+			<Button
+				variant="default"
+				size="xs"
+				onclick={() => (showAddWorkspace = true)}
+				btnClasses="text-xs flex items-center gap-2"
+			>
+				<Plus size={14} />
+				Add workspace override
+			</Button>
+		</div>
+	{/if}
+</SettingCard>

package/package/components/instanceSettings/WorkspaceRegistries.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Writable } from 'svelte/store';
+interface Props {
+    values: Writable<Record<string, any>>;
+    loading: boolean;
+}
+declare const WorkspaceRegistries: import("svelte").Component<Props, {}, "">;
+type WorkspaceRegistries = ReturnType<typeof WorkspaceRegistries>;
+export default WorkspaceRegistries;