From 39575df3eea9309a4502e2d8496087a2e4b311da Mon Sep 17 00:00:00 2001
From: Diego Imbert <70353967+diegoimbert@users.noreply.github.com>
Date: Thu, 30 Oct 2025 20:32:59 +0100
Subject: [PATCH] 'small' prop in Tabs to solve x-scroll in workspace settings
 (#6966)

* 'small' prop in Tabs to solve x-scroll in workspace settings

* add deprecated notice
---
 frontend/src/lib/components/common/tabs/Tab.svelte   |  8 +++++++-
 .../(root)/(logged)/workspace_settings/+page.svelte  | 12 ++++++++++++
 2 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/frontend/src/lib/components/common/tabs/Tab.svelte b/frontend/src/lib/components/common/tabs/Tab.svelte
index 53993a8bcd..a652525b45 100644
--- a/frontend/src/lib/components/common/tabs/Tab.svelte
+++ b/frontend/src/lib/components/common/tabs/Tab.svelte
@@ -21,6 +21,10 @@
 		exact?: boolean
 		otherValues?: string[]
 		disabled?: boolean
+		/**
+		 * @deprecated TODO : Re-organize workspace settings so we don't have so many tabs
+		 */
+		small?: boolean
 		extra?: import('svelte').Snippet
 	}
 
@@ -39,6 +43,7 @@
 		exact = false,
 		otherValues = [],
 		disabled = false,
+		small = false,
 		extra = undefined
 	}: Props = $props()
 	const { selected, update, hashNavigation } = getContext<TabsContext>('Tabs')
@@ -71,10 +76,11 @@
 		}
 	}}
 	class={twMerge(
-		'border-b-2 border-border-light py-1 px-2 cursor-pointer transition-all z-10 ease-linear text-primary font-normal text-xs',
+		'border-b-2 border-border-light py-1 cursor-pointer transition-all z-10 ease-linear text-primary font-normal text-xs',
 		isSelected
 			? 'text-emphasis font-semibold border-border-normal'
 			: 'border-opacity-0 hover:border-opacity-100',
+		small ? 'px-1' : 'px-2',
 		c,
 		isSelected ? selectedClass : '',
 		disabled ? 'cursor-not-allowed text-disabled' : ''
diff --git a/frontend/src/routes/(root)/(logged)/workspace_settings/+page.svelte b/frontend/src/routes/(root)/(logged)/workspace_settings/+page.svelte
index f309f7711f..132b626a21 100644
--- a/frontend/src/routes/(root)/(logged)/workspace_settings/+page.svelte
+++ b/frontend/src/routes/(root)/(logged)/workspace_settings/+page.svelte
@@ -600,18 +600,21 @@
 				}}
 			>
 				<Tab
+					small
 					value="users"
 					aiId="workspace-settings-users"
 					aiDescription="Users workspace settings"
 					label="Users"
 				/>
 				<Tab
+					small
 					value="git_sync"
 					aiId="workspace-settings-git-sync"
 					aiDescription="Git sync workspace settings"
 					label="Git Sync"
 				/>
 				<Tab
+					small
 					value="deploy_to"
 					aiId="workspace-settings-deploy-to"
 					aiDescription="Deployment UI workspace settings"
@@ -620,6 +623,7 @@
 
 				{#if WORKSPACE_SHOW_SLACK_CMD}
 					<Tab
+						small
 						value="slack"
 						aiId="workspace-settings-slack"
 						aiDescription="Slack / Teams workspace settings"
@@ -628,6 +632,7 @@
 				{/if}
 				{#if isCloudHosted()}
 					<Tab
+						small
 						value="premium"
 						aiId="workspace-settings-premium"
 						aiDescription="Premium plans workspace settings"
@@ -636,6 +641,7 @@
 				{/if}
 				{#if WORKSPACE_SHOW_WEBHOOK_CLI_SYNC}
 					<Tab
+						small
 						value="webhook"
 						aiId="workspace-settings-webhook"
 						aiDescription="Webhook workspace settings"
@@ -643,24 +649,28 @@
 					/>
 				{/if}
 				<Tab
+					small
 					value="error_handler"
 					aiId="workspace-settings-error-handler"
 					aiDescription="Error handler workspace settings"
 					label="Error Handler"
 				/>
 				<Tab
+					small
 					value="ai"
 					aiId="workspace-settings-ai"
 					aiDescription="Windmill AI workspace settings"
 					label="Windmill AI"
 				/>
 				<Tab
+					small
 					value="windmill_lfs"
 					aiId="workspace-settings-windmill-lfs"
 					aiDescription="Object Storage (S3) workspace settings"
 					label="Object Storage (S3)"
 				/>
 				<Tab
+					small
 					value="default_app"
 					aiId="workspace-settings-default-app"
 					aiDescription="Default app workspace settings"
@@ -668,6 +678,7 @@
 				/>
 
 				<Tab
+					small
 					value="encryption"
 					aiId="workspace-settings-encryption"
 					aiDescription="Encryption workspace settings"
@@ -675,6 +686,7 @@
 				/>
 
 				<Tab
+					small
 					value="general"
 					aiId="workspace-settings-general"
 					aiDescription="General workspace settings"