Merge pull request #17848 from Classic298/feat/group-permission-warning

Feat/chore: Add warning for conflicting group permissions / Refactored Permissions.svelte

src/lib/components/admin/Users/Groups.svelte

@@ -23,11 +23,7 @@
 	import Pencil from '$lib/components/icons/Pencil.svelte';
 	import GroupItem from './Groups/GroupItem.svelte';
 	import { createNewGroup, getGroups } from '$lib/apis/groups';
-	import {
-		getUserDefaultPermissions,
-		getAllUsers,
-		updateUserDefaultPermissions
-	} from '$lib/apis/users';
+	import { getUserDefaultPermissions, getAllUsers, updateUserDefaultPermissions } from '$lib/apis/users';
 
 	const i18n = getContext('i18n');
 
@@ -50,54 +46,20 @@
 	});
 
 	let search = '';
-	let defaultPermissions = {
-		workspace: {
-			models: false,
-			knowledge: false,
-			prompts: false,
-			tools: false
-		},
-		sharing: {
-			public_models: false,
-			public_knowledge: false,
-			public_prompts: false,
-			public_tools: false
-		},
-		chat: {
-			controls: true,
-			valves: true,
-			system_prompt: true,
-			params: true,
-			file_upload: true,
-			delete: true,
-			delete_message: true,
-			continue_response: true,
-			regenerate_response: true,
-			rate_response: true,
-			edit: true,
-			share: true,
-			export: true,
-			stt: true,
-			tts: true,
-			call: true,
-			multiple_models: true,
-			temporary: true,
-			temporary_enforced: false
-		},
-		features: {
-			direct_tool_servers: false,
-			web_search: true,
-			image_generation: true,
-			code_interpreter: true,
-			notes: true
-		}
-	};
+	let defaultPermissions = {};
 
 	let showAddGroupModal = false;
 	let showDefaultPermissionsModal = false;
 
 	const setGroups = async () => {
-		groups = await getGroups(localStorage.token);
+		const allGroups = await getGroups(localStorage.token);
+		const userGroup = allGroups.find((g) => g.name.toLowerCase() === 'user');
+
+		if (userGroup) {
+			defaultPermissions = userGroup.permissions;
+		}
+
+		groups = allGroups.filter((g) => g.name.toLowerCase() !== 'user');
 	};
 
 	const addGroupHandler = async (group) => {
@@ -145,8 +107,6 @@
 		}
 
 		await setGroups();
-		defaultPermissions = await getUserDefaultPermissions(localStorage.token);
-
 		loaded = true;
 	});
 </script>
@@ -231,7 +191,7 @@
 
 				{#each filteredGroups as group}
 					<div class="my-2">
-						<GroupItem {group} {users} {setGroups} />
+						<GroupItem {group} {users} {setGroups} {defaultPermissions} />
 					</div>
 				{/each}
 			</div>

src/lib/components/admin/Users/Groups/EditGroupModal.svelte

@@ -21,6 +21,7 @@
 
 	export let users = [];
 	export let group = null;
+	export let defaultPermissions = {};
 
 	export let custom = true;
 
@@ -230,7 +231,7 @@
 							{#if selectedTab == 'general'}
 								<Display bind:name bind:description />
 							{:else if selectedTab == 'permissions'}
-								<Permissions bind:permissions />
+								<Permissions bind:permissions {defaultPermissions} />
 							{:else if selectedTab == 'users'}
 								<Users bind:userIds {users} />
 							{/if}

src/lib/components/admin/Users/Groups/GroupItem.svelte

@@ -17,6 +17,7 @@
 		name: 'Admins',
 		user_ids: [1, 2, 3]
 	};
+	export let defaultPermissions = {};
 
 	export let setGroups = () => {};
 
@@ -59,6 +60,7 @@
 	edit
 	{users}
 	{group}
+	{defaultPermissions}
 	onSubmit={updateHandler}
 	onDelete={deleteHandler}
 />

src/lib/components/admin/Users/Groups/Permissions.svelte

@@ -6,7 +6,7 @@
 	import Tooltip from '$lib/components/common/Tooltip.svelte';
 
 	// Default values for permissions
-	const defaultPermissions = {
+	const DEFAULT_PERMISSIONS = {
 		workspace: {
 			models: false,
 			knowledge: false,
@@ -51,10 +51,11 @@
 	};
 
 	export let permissions = {};
+	export let defaultPermissions = {};
 
 	// Reactive statement to ensure all fields are present in `permissions`
 	$: {
-		permissions = fillMissingProperties(permissions, defaultPermissions);
+		permissions = fillMissingProperties(permissions, DEFAULT_PERMISSIONS);
 	}
 
 	function fillMissingProperties(obj: any, defaults: any) {
@@ -69,140 +70,65 @@
 	}
 
 	onMount(() => {
-		permissions = fillMissingProperties(permissions, defaultPermissions);
+		permissions = fillMissingProperties(permissions, DEFAULT_PERMISSIONS);
 	});
 </script>
 
-<div>
-	<!-- <div>
-		<div class=" mb-2 text-sm font-medium">{$i18n.t('Model Permissions')}</div>
-
-		<div class="mb-2">
-			<div class="flex justify-between items-center text-xs pr-2">
-				<div class=" text-xs font-medium">{$i18n.t('Model Filtering')}</div>
-
-				<Switch bind:state={permissions.model.filter} />
-			</div>
-		</div>
-
-		{#if permissions.model.filter}
-			<div class="mb-2">
-				<div class=" space-y-1.5">
-					<div class="flex flex-col w-full">
-						<div class="mb-1 flex justify-between">
-							<div class="text-xs text-gray-500">{$i18n.t('Model IDs')}</div>
-						</div>
-
-						{#if model_ids.length > 0}
-							<div class="flex flex-col">
-								{#each model_ids as modelId, modelIdx}
-									<div class=" flex gap-2 w-full justify-between items-center">
-										<div class=" text-sm flex-1 rounded-lg">
-											{modelId}
-										</div>
-										<div class="shrink-0">
-											<button
-												type="button"
-												on:click={() => {
-													model_ids = model_ids.filter((_, idx) => idx !== modelIdx);
-												}}
-											>
-												<Minus strokeWidth="2" className="size-3.5" />
-											</button>
-										</div>
-									</div>
-								{/each}
-							</div>
-						{:else}
-							<div class="text-gray-500 text-xs text-center py-2 px-10">
-								{$i18n.t('No model IDs')}
-							</div>
-						{/if}
-					</div>
-				</div>
-				<hr class=" border-gray-100 dark:border-gray-700/10 mt-2.5 mb-1 w-full" />
-
-				<div class="flex items-center">
-					<select
-						class="w-full py-1 text-sm rounded-lg bg-transparent {selectedModelId
-							? ''
-							: 'text-gray-500'} placeholder:text-gray-300 dark:placeholder:text-gray-700 outline-hidden"
-						bind:value={selectedModelId}
-					>
-						<option value="">{$i18n.t('Select a model')}</option>
-						{#each $models.filter((m) => m?.owned_by !== 'arena') as model}
-							<option value={model.id} class="bg-gray-50 dark:bg-gray-700">{model.name}</option>
-						{/each}
-					</select>
-
-					<div>
-						<button
-							type="button"
-							on:click={() => {
-								if (selectedModelId && !permissions.model.model_ids.includes(selectedModelId)) {
-									permissions.model.model_ids = [...permissions.model.model_ids, selectedModelId];
-									selectedModelId = '';
-								}
-							}}
-						>
-							<Plus className="size-3.5" strokeWidth="2" />
-						</button>
-					</div>
-				</div>
-			</div>
-		{/if}
-
-		<div class=" space-y-1 mb-3">
-			<div class="">
-				<div class="flex justify-between items-center text-xs">
-					<div class=" text-xs font-medium">{$i18n.t('Default Model')}</div>
-				</div>
-			</div>
-
-			<div class="flex-1 mr-2">
-				<select
-					class="w-full bg-transparent outline-hidden py-0.5 text-sm"
-					bind:value={permissions.model.default_id}
-					placeholder={$i18n.t('Select a model')}
-				>
-					<option value="" disabled selected>{$i18n.t('Select a model')}</option>
-					{#each permissions.model.filter ? $models.filter( (model) => filterModelIds.includes(model.id) ) : $models.filter((model) => model.id) as model}
-						<option value={model.id} class="bg-gray-100 dark:bg-gray-700">{model.name}</option>
-					{/each}
-				</select>
-			</div>
-		</div>
-	</div>
-
-	<hr class=" border-gray-100 dark:border-gray-850 my-2" /> -->
-
+<div class="space-y-2">
 	<div>
 		<div class=" mb-2 text-sm font-medium">{$i18n.t('Workspace Permissions')}</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Models Access')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Models Access')}
+				</div>
+				<Switch bind:state={permissions.workspace.models} />
 			</div>
-			<Switch bind:state={permissions.workspace.models} />
+			{#if defaultPermissions?.workspace?.models && !permissions.workspace.models}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Knowledge Access')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Knowledge Access')}
+				</div>
+				<Switch bind:state={permissions.workspace.knowledge} />
 			</div>
-			<Switch bind:state={permissions.workspace.knowledge} />
+			{#if defaultPermissions?.workspace?.knowledge && !permissions.workspace.knowledge}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Prompts Access')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Prompts Access')}
+				</div>
+				<Switch bind:state={permissions.workspace.prompts} />
 			</div>
-			<Switch bind:state={permissions.workspace.prompts} />
+			{#if defaultPermissions?.workspace?.prompts && !permissions.workspace.prompts}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class=" ">
+		<div class="flex flex-col w-full">
 			<Tooltip
-				className=" flex w-full justify-between my-2 pr-2"
+				className="flex w-full justify-between my-2 pr-2"
 				content={$i18n.t(
 					'Warning: Enabling this will allow users to upload arbitrary code on the server.'
 				)}
@@ -213,254 +139,499 @@
 				</div>
 				<Switch bind:state={permissions.workspace.tools} />
 			</Tooltip>
+			{#if defaultPermissions?.workspace?.tools && !permissions.workspace.tools}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 	</div>
 
-	<hr class=" border-gray-100 dark:border-gray-850 my-2" />
+	<hr class=" border-gray-100 dark:border-gray-850" />
 
 	<div>
 		<div class=" mb-2 text-sm font-medium">{$i18n.t('Sharing Permissions')}</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Models Public Sharing')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Models Public Sharing')}
+				</div>
+				<Switch bind:state={permissions.sharing.public_models} />
 			</div>
-			<Switch bind:state={permissions.sharing.public_models} />
+			{#if defaultPermissions?.sharing?.public_models && !permissions.sharing.public_models}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Knowledge Public Sharing')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Knowledge Public Sharing')}
+				</div>
+				<Switch bind:state={permissions.sharing.public_knowledge} />
 			</div>
-			<Switch bind:state={permissions.sharing.public_knowledge} />
+			{#if defaultPermissions?.sharing?.public_knowledge && !permissions.sharing.public_knowledge}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Prompts Public Sharing')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Prompts Public Sharing')}
+				</div>
+				<Switch bind:state={permissions.sharing.public_prompts} />
 			</div>
-			<Switch bind:state={permissions.sharing.public_prompts} />
+			{#if defaultPermissions?.sharing?.public_prompts && !permissions.sharing.public_prompts}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Tools Public Sharing')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Tools Public Sharing')}
+				</div>
+				<Switch bind:state={permissions.sharing.public_tools} />
 			</div>
-			<Switch bind:state={permissions.sharing.public_tools} />
+			{#if defaultPermissions?.sharing?.public_tools && !permissions.sharing.public_tools}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Notes Public Sharing')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Notes Public Sharing')}
+				</div>
+				<Switch bind:state={permissions.sharing.public_notes} />
 			</div>
-			<Switch bind:state={permissions.sharing.public_notes} />
+			{#if defaultPermissions?.sharing?.public_notes && !permissions.sharing.public_notes}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 	</div>
 
-	<hr class=" border-gray-100 dark:border-gray-850 my-2" />
+	<hr class=" border-gray-100 dark:border-gray-850" />
 
 	<div>
 		<div class=" mb-2 text-sm font-medium">{$i18n.t('Chat Permissions')}</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow File Upload')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow File Upload')}
+				</div>
+				<Switch bind:state={permissions.chat.file_upload} />
 			</div>
-
-			<Switch bind:state={permissions.chat.file_upload} />
+			{#if defaultPermissions?.chat?.file_upload && !permissions.chat.file_upload}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Chat Controls')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Chat Controls')}
+				</div>
+				<Switch bind:state={permissions.chat.controls} />
 			</div>
-
-			<Switch bind:state={permissions.chat.controls} />
+			{#if defaultPermissions?.chat?.controls && !permissions.chat.controls}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
 		{#if permissions.chat.controls}
-			<div class="  flex w-full justify-between my-2 pr-2">
-				<div class=" self-center text-xs font-medium">
-					{$i18n.t('Allow Chat Valves')}
+			<div class="flex flex-col w-full pl-4">
+				<div class="flex w-full justify-between my-2 pr-2">
+					<div class=" self-center text-xs font-medium">
+						{$i18n.t('Allow Chat Valves')}
+					</div>
+					<Switch bind:state={permissions.chat.valves} />
 				</div>
-
-				<Switch bind:state={permissions.chat.valves} />
+				{#if defaultPermissions?.chat?.valves && !permissions.chat.valves}
+					<div class="pb-1 pl-1 pr-2 pt-1">
+						<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+							⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+						</div>
+					</div>
+				{/if}
 			</div>
 
-			<div class="  flex w-full justify-between my-2 pr-2">
-				<div class=" self-center text-xs font-medium">
-					{$i18n.t('Allow Chat System Prompt')}
+			<div class="flex flex-col w-full pl-4">
+				<div class="flex w-full justify-between my-2 pr-2">
+					<div class=" self-center text-xs font-medium">
+						{$i18n.t('Allow Chat System Prompt')}
+					</div>
+					<Switch bind:state={permissions.chat.system_prompt} />
 				</div>
-
-				<Switch bind:state={permissions.chat.system_prompt} />
+				{#if defaultPermissions?.chat?.system_prompt && !permissions.chat.system_prompt}
+					<div class="pb-1 pl-1 pr-2 pt-1">
+						<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+							⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+						</div>
+					</div>
+				{/if}
 			</div>
 
-			<div class="  flex w-full justify-between my-2 pr-2">
-				<div class=" self-center text-xs font-medium">
-					{$i18n.t('Allow Chat Params')}
+			<div class="flex flex-col w-full pl-4">
+				<div class="flex w-full justify-between my-2 pr-2">
+					<div class=" self-center text-xs font-medium">
+						{$i18n.t('Allow Chat Params')}
+					</div>
+					<Switch bind:state={permissions.chat.params} />
 				</div>
-
-				<Switch bind:state={permissions.chat.params} />
+				{#if defaultPermissions?.chat?.params && !permissions.chat.params}
+					<div class="pb-1 pl-1 pr-2 pt-1">
+						<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+							⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+						</div>
+					</div>
+				{/if}
 			</div>
 		{/if}
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Chat Edit')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Chat Edit')}
+				</div>
+				<Switch bind:state={permissions.chat.edit} />
 			</div>
-
-			<Switch bind:state={permissions.chat.edit} />
+			{#if defaultPermissions?.chat?.edit && !permissions.chat.edit}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Chat Delete')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Chat Delete')}
+				</div>
+				<Switch bind:state={permissions.chat.delete} />
 			</div>
-
-			<Switch bind:state={permissions.chat.delete} />
+			{#if defaultPermissions?.chat?.delete && !permissions.chat.delete}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Delete Messages')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Delete Messages')}
+				</div>
+				<Switch bind:state={permissions.chat.delete_message} />
 			</div>
-
-			<Switch bind:state={permissions.chat.delete_message} />
+			{#if defaultPermissions?.chat?.delete_message && !permissions.chat.delete_message}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Continue Response')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Continue Response')}
+				</div>
+				<Switch bind:state={permissions.chat.continue_response} />
 			</div>
-
-			<Switch bind:state={permissions.chat.continue_response} />
+			{#if defaultPermissions?.chat?.continue_response && !permissions.chat.continue_response}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Regenerate Response')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Regenerate Response')}
+				</div>
+				<Switch bind:state={permissions.chat.regenerate_response} />
 			</div>
-
-			<Switch bind:state={permissions.chat.regenerate_response} />
+			{#if defaultPermissions?.chat?.regenerate_response && !permissions.chat.regenerate_response}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Rate Response')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Rate Response')}
+				</div>
+				<Switch bind:state={permissions.chat.rate_response} />
 			</div>
-
-			<Switch bind:state={permissions.chat.rate_response} />
+			{#if defaultPermissions?.chat?.rate_response && !permissions.chat.rate_response}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Chat Share')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Chat Share')}
+				</div>
+				<Switch bind:state={permissions.chat.share} />
 			</div>
-
-			<Switch bind:state={permissions.chat.share} />
+			{#if defaultPermissions?.chat?.share && !permissions.chat.share}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Chat Export')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Chat Export')}
+				</div>
+				<Switch bind:state={permissions.chat.export} />
 			</div>
-
-			<Switch bind:state={permissions.chat.export} />
+			{#if defaultPermissions?.chat?.export && !permissions.chat.export}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Speech to Text')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Speech to Text')}
+				</div>
+				<Switch bind:state={permissions.chat.stt} />
 			</div>
-
-			<Switch bind:state={permissions.chat.stt} />
+			{#if defaultPermissions?.chat?.stt && !permissions.chat.stt}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Text to Speech')}
-			</div>
 
-			<Switch bind:state={permissions.chat.tts} />
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Text to Speech')}
+				</div>
+				<Switch bind:state={permissions.chat.tts} />
+			</div>
+			{#if defaultPermissions?.chat?.tts && !permissions.chat.tts}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Call')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Call')}
+				</div>
+				<Switch bind:state={permissions.chat.call} />
 			</div>
-
-			<Switch bind:state={permissions.chat.call} />
+			{#if defaultPermissions?.chat?.call && !permissions.chat.call}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Multiple Models in Chat')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Multiple Models in Chat')}
+				</div>
+				<Switch bind:state={permissions.chat.multiple_models} />
 			</div>
-
-			<Switch bind:state={permissions.chat.multiple_models} />
+			{#if defaultPermissions?.chat?.multiple_models && !permissions.chat.multiple_models}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Allow Temporary Chat')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Allow Temporary Chat')}
+				</div>
+				<Switch bind:state={permissions.chat.temporary} />
 			</div>
-
-			<Switch bind:state={permissions.chat.temporary} />
+			{#if defaultPermissions?.chat?.temporary && !permissions.chat.temporary}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
 		{#if permissions.chat.temporary}
-			<div class="  flex w-full justify-between my-2 pr-2">
-				<div class=" self-center text-xs font-medium">
-					{$i18n.t('Enforce Temporary Chat')}
+			<div class="flex flex-col w-full pl-4">
+				<div class="flex w-full justify-between my-2 pr-2">
+					<div class=" self-center text-xs font-medium">
+						{$i18n.t('Enforce Temporary Chat')}
+					</div>
+					<Switch bind:state={permissions.chat.temporary_enforced} />
 				</div>
-
-				<Switch bind:state={permissions.chat.temporary_enforced} />
+				{#if defaultPermissions?.chat?.temporary_enforced && !permissions.chat.temporary_enforced}
+					<div class="pb-1 pl-1 pr-2 pt-1">
+						<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+							⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+						</div>
+					</div>
+				{/if}
 			</div>
 		{/if}
 	</div>
 
-	<hr class=" border-gray-100 dark:border-gray-850 my-2" />
+	<hr class=" border-gray-100 dark:border-gray-850" />
 
 	<div>
 		<div class=" mb-2 text-sm font-medium">{$i18n.t('Features Permissions')}</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Direct Tool Servers')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Direct Tool Servers')}
+				</div>
+				<Switch bind:state={permissions.features.direct_tool_servers} />
 			</div>
-
-			<Switch bind:state={permissions.features.direct_tool_servers} />
+			{#if defaultPermissions?.features?.direct_tool_servers && !permissions.features.direct_tool_servers}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Web Search')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Web Search')}
+				</div>
+				<Switch bind:state={permissions.features.web_search} />
 			</div>
-
-			<Switch bind:state={permissions.features.web_search} />
+			{#if defaultPermissions?.features?.web_search && !permissions.features.web_search}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Image Generation')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Image Generation')}
+				</div>
+				<Switch bind:state={permissions.features.image_generation} />
 			</div>
-
-			<Switch bind:state={permissions.features.image_generation} />
+			{#if defaultPermissions?.features?.image_generation && !permissions.features.image_generation}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Code Interpreter')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Code Interpreter')}
+				</div>
+				<Switch bind:state={permissions.features.code_interpreter} />
 			</div>
-
-			<Switch bind:state={permissions.features.code_interpreter} />
+			{#if defaultPermissions?.features?.code_interpreter && !permissions.features.code_interpreter}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 
-		<div class="  flex w-full justify-between my-2 pr-2">
-			<div class=" self-center text-xs font-medium">
-				{$i18n.t('Notes')}
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-2 pr-2">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Notes')}
+				</div>
+				<Switch bind:state={permissions.features.notes} />
 			</div>
-
-			<Switch bind:state={permissions.features.notes} />
+			{#if defaultPermissions?.features?.notes && !permissions.features.notes}
+				<div class="pb-1 pl-1 pr-2 pt-1">
+					<div class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded px-2 py-1">
+						⚠️ {$i18n.t('This permission is enabled for the default "user" role and will remain active.')}
+					</div>
+				</div>
+			{/if}
 		</div>
 	</div>
 </div>