refac

src/lib/components/admin/Settings/Audio.svelte

@@ -233,6 +233,8 @@
 		dispatch('save');
 	}}
 >
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">{$i18n.t('Audio')}</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		<div class="flex flex-col gap-3">
 			<div>

src/lib/components/admin/Settings/Authentication.svelte

@@ -118,6 +118,10 @@
 </script>
 
 <form class="flex h-full flex-col justify-between text-sm" on:submit|preventDefault={submitHandler}>
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">
+		{$i18n.t('Authentication')}
+	</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		{#if adminConfig !== null}
 			<AdminSettingSection title={$i18n.t('User Access')} first>

src/lib/components/admin/Settings/CodeExecution.svelte

@@ -47,6 +47,10 @@
 		saveHandler();
 	}}
 >
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">
+		{$i18n.t('Code Execution')}
+	</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		{#if config}
 			<AdminSettingSection first>

src/lib/components/admin/Settings/Connections.svelte

@@ -218,6 +218,8 @@
 />
 
 <form class="flex h-full flex-col justify-between text-sm" on:submit|preventDefault={submitHandler}>
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">{$i18n.t('Connections')}</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		{#if ENABLE_OPENAI_API !== null && ENABLE_OLLAMA_API !== null && connectionsConfig !== null}
 			<AdminSettingSection first>

src/lib/components/admin/Settings/Database.svelte

@@ -49,6 +49,8 @@
 </script>
 
 <div class="flex flex-col h-full justify-between text-sm">
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">{$i18n.t('Database')}</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		<input
 			id="config-json-input"

src/lib/components/admin/Settings/Documents.svelte

@@ -374,6 +374,8 @@
 		submitHandler();
 	}}
 >
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">{$i18n.t('Documents')}</h2>
+
 	{#if RAGConfig}
 		<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 			<div class="">

src/lib/components/admin/Settings/Evaluations.svelte

@@ -104,6 +104,8 @@
 		dispatch('save');
 	}}
 >
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">{$i18n.t('Evaluations')}</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		{#if evaluationConfig !== null}
 			<AdminSettingSection first>

src/lib/components/admin/Settings/General.svelte

@@ -84,6 +84,8 @@
 		updateHandler();
 	}}
 >
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">{$i18n.t('General')}</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		{#if adminConfig !== null}
 			<AdminSettingSection first>

src/lib/components/admin/Settings/Images.svelte

@@ -289,6 +289,8 @@
 		saveHandler();
 	}}
 >
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">{$i18n.t('Images')}</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		{#if config}
 			<div>

src/lib/components/admin/Settings/Integrations.svelte

@@ -161,6 +161,8 @@
 		updateHandler();
 	}}
 >
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">{$i18n.t('Integrations')}</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		{#if servers !== null}
 			<AdminSettingSection title={$i18n.t('Tools')} first>

src/lib/components/admin/Settings/Interface.svelte

@@ -108,6 +108,10 @@
 			dispatch('save');
 		}}
 	>
+		<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">
+			{$i18n.t('Interface')}
+		</h2>
+
 		<div class="  flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 			<div class="mb-5">
 				<div class=" mb-2 text-xs text-gray-400 dark:text-gray-600">

src/lib/components/admin/Settings/Pipelines.svelte

@@ -238,6 +238,8 @@
 		updateHandler();
 	}}
 >
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">{$i18n.t('Pipelines')}</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		{#if PIPELINES_LIST !== null}
 			{#if PIPELINES_LIST.length > 0}

src/lib/components/admin/Settings/Subagents.svelte

@@ -57,6 +57,8 @@
 </script>
 
 <form class="flex h-full flex-col justify-between text-sm" on:submit|preventDefault={save}>
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">{$i18n.t('Sub-agents')}</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		{#if loading}
 			<div class="flex justify-center py-8"><Spinner className="size-6" /></div>

src/lib/components/admin/Settings/WebSearch.svelte

@@ -152,6 +152,8 @@
 		saveHandler();
 	}}
 >
+	<h2 class="text-sm font-medium text-gray-900 dark:text-white mb-4">{$i18n.t('Web Search')}</h2>
+
 	<div class="flex-1 min-h-0 overflow-y-auto scrollbar-hover pr-1.5">
 		{#if webConfig}
 			<div class="">