From c7e34e0fa9bdd34f798ab197e1e21aca2234ed2b Mon Sep 17 00:00:00 2001
From: Timothy Jaeryang Baek <tim@openwebui.com>
Date: Sun, 25 Oct 2026 14:34:12 +0900
Subject: [PATCH] refac

---
 .../admin/Settings/ExternalKnowledge.svelte   | 26 ++++++++++++-------
 .../components/admin/Settings/Models.svelte   |  3 +++
 .../layout/Sidebar/ChannelModal.svelte        | 22 +++++++++-------
 .../workspace/Models/ModelEditor.svelte       | 18 ++++++++++---
 .../workspace/common/AccessControl.svelte     | 13 +++++++---
 5 files changed, 57 insertions(+), 25 deletions(-)

diff --git a/src/lib/components/admin/Settings/ExternalKnowledge.svelte b/src/lib/components/admin/Settings/ExternalKnowledge.svelte
index 8be0a60ea6..9ba809da65 100644
--- a/src/lib/components/admin/Settings/ExternalKnowledge.svelte
+++ b/src/lib/components/admin/Settings/ExternalKnowledge.svelte
@@ -370,6 +370,7 @@
 	};
 
 	const submitSource = async () => {
+		if (creating) return;
 		if (editingItem) {
 			await updateSource();
 		} else {
@@ -432,7 +433,12 @@
 
 		<div class="flex flex-col md:flex-row w-full px-4 pb-4 md:space-x-4 dark:text-gray-200">
 			<div class="flex flex-col w-full sm:flex-row sm:justify-center sm:space-x-6">
-				<form class="flex flex-col w-full" on:submit|preventDefault={submitSource}>
+				<form
+					class="flex flex-col w-full"
+					inert={creating}
+					aria-busy={creating}
+					on:submit|preventDefault={submitSource}
+				>
 					<div class="px-1">
 						<div class="flex gap-2">
 							<div class="flex flex-col flex-1">
@@ -773,19 +779,21 @@
 							share={true}
 							sharePublic={true}
 							shareUsers={true}
-							onChange={async () => {
+							onChange={async (grants) => {
 								if (editingItem) {
+									const item = editingItem;
+									creating = true;
 									try {
-										await updateKnowledgeAccessGrants(
-											localStorage.token,
-											editingItem.id,
-											accessGrants
-										);
-										editingItem.access_grants = structuredClone(accessGrants);
+										await updateKnowledgeAccessGrants(localStorage.token, item.id, grants);
+										item.access_grants = structuredClone(grants);
+										if (editingItem === item) accessGrants = item.access_grants;
 										toast.success($i18n.t('Saved'));
 									} catch (error) {
-										accessGrants = structuredClone(editingItem.access_grants ?? []);
+										if (editingItem === item)
+											accessGrants = structuredClone(item.access_grants ?? []);
 										toast.error(`${error}`);
+									} finally {
+										creating = false;
 									}
 								}
 							}}
diff --git a/src/lib/components/admin/Settings/Models.svelte b/src/lib/components/admin/Settings/Models.svelte
index a00599436b..acee87ba8b 100644
--- a/src/lib/components/admin/Settings/Models.svelte
+++ b/src/lib/components/admin/Settings/Models.svelte
@@ -1344,6 +1344,9 @@
 			edit
 			model={models.find((m) => m.id === selectedModelId)}
 			preset={false}
+			onAccessUpdate={(model) => {
+				savedModels = [...savedModels.filter((m) => m.id !== model.id), model];
+			}}
 			onSubmit={async (model) => {
 				console.log(model);
 				if (!(await upsertModelHandler(model))) {
diff --git a/src/lib/components/layout/Sidebar/ChannelModal.svelte b/src/lib/components/layout/Sidebar/ChannelModal.svelte
index 9bd1a3ed03..ee904ac336 100644
--- a/src/lib/components/layout/Sidebar/ChannelModal.svelte
+++ b/src/lib/components/layout/Sidebar/ChannelModal.svelte
@@ -59,6 +59,7 @@
 	};
 
 	const submitHandler = async () => {
+		if (loading) return;
 		loading = true;
 		if (name.length > 128) {
 			toast.error($i18n.t('Channel name must be less than 128 characters'));
@@ -138,7 +139,6 @@
 		name = '';
 		accessGrants = [];
 		userIds = [];
-		loading = false;
 	};
 </script>
 
@@ -239,25 +239,27 @@
 					</div>
 
 					{#if type !== 'dm'}
-						<div class="-mx-2 mb-1 mt-2.5 px-2">
+						<div class="-mx-2 mb-1 mt-2.5 px-2" inert={loading} aria-busy={loading}>
 							{#if type === ''}
 								<AccessControl
 									bind:accessGrants
 									accessRoles={['read', 'write']}
-									onChange={async () => {
+									onChange={async (grants) => {
 										if (edit && channel?.id) {
+											const item = channel;
+											loading = true;
 											try {
-												await updateChannelAccessGrants(
-													localStorage.token,
-													channel.id,
-													accessGrants
-												);
-												channel.access_grants = structuredClone(accessGrants);
+												await updateChannelAccessGrants(localStorage.token, item.id, grants);
+												item.access_grants = structuredClone(grants);
+												if (channel === item) accessGrants = item.access_grants;
 												toast.success($i18n.t('Saved'));
 												onUpdate();
 											} catch (error) {
-												accessGrants = structuredClone(channel.access_grants ?? []);
+												if (channel === item)
+													accessGrants = structuredClone(item.access_grants ?? []);
 												toast.error(`${error}`);
+											} finally {
+												loading = false;
 											}
 										}
 									}}
diff --git a/src/lib/components/workspace/Models/ModelEditor.svelte b/src/lib/components/workspace/Models/ModelEditor.svelte
index 248f70b753..d0053330d2 100644
--- a/src/lib/components/workspace/Models/ModelEditor.svelte
+++ b/src/lib/components/workspace/Models/ModelEditor.svelte
@@ -68,6 +68,7 @@
 	const formId = `model-editor-${uuidv4()}`;
 
 	export let onSubmit: Function = () => {};
+	export let onAccessUpdate: Function = () => {};
 	export let readOnly = false;
 	export let onBack: null | Function = null;
 
@@ -832,6 +833,7 @@
 		}}
 	/>
 	<AccessControlModal
+		disabled={loading}
 		bind:show={showAccessControlModal}
 		bind:accessGrants
 		accessRoles={preset ? ['read', 'write'] : ['read']}
@@ -840,15 +842,25 @@
 		shareUsers={($user?.permissions?.access_grants?.allow_users ?? true) || $user?.role === 'admin'}
 		allowGroups={($user?.permissions?.access_grants?.allow_groups ?? true) ||
 			$user?.role === 'admin'}
-		onChange={async () => {
+		onChange={async (grants) => {
 			if (edit && model?.id) {
+				loading = true;
 				try {
-					await updateModelAccessGrants(localStorage.token, model.id, model.name, accessGrants);
-					model.access_grants = structuredClone(accessGrants);
+					const saved = await updateModelAccessGrants(
+						localStorage.token,
+						model.id,
+						model.name,
+						grants
+					);
+					model.access_grants = structuredClone(saved.access_grants);
+					accessGrants = structuredClone(saved.access_grants);
+					onAccessUpdate(saved);
 					toast.success($i18n.t('Saved'));
 				} catch (error) {
 					accessGrants = structuredClone(model.access_grants ?? []);
 					toast.error(`${error}`);
+				} finally {
+					loading = false;
 				}
 			}
 		}}
diff --git a/src/lib/components/workspace/common/AccessControl.svelte b/src/lib/components/workspace/common/AccessControl.svelte
index 8f5400146b..6903c6da1d 100644
--- a/src/lib/components/workspace/common/AccessControl.svelte
+++ b/src/lib/components/workspace/common/AccessControl.svelte
@@ -33,6 +33,7 @@
 	};
 
 	export let onChange: Function = () => {};
+	let saving = false;
 
 	export let accessRoles = ['read'];
 	export let labels: Partial<Record<'title' | 'public' | 'private' | 'read' | 'empty', string>> =
@@ -227,9 +228,15 @@
 				grant.permission === permission
 		);
 
-	const commitAccessGrants = (nextGrants: AccessGrant[]) => {
+	const commitAccessGrants = async (nextGrants: AccessGrant[]) => {
+		if (saving) return;
+		saving = true;
 		accessGrants = dedupeAccessGrants(nextGrants);
-		onChange(accessGrants);
+		try {
+			await onChange(accessGrants);
+		} finally {
+			saving = false;
+		}
 	};
 
 	const getVisibility = (grants: AccessGrant[]): 'private' | 'public' | 'open' => {
@@ -493,7 +500,7 @@
 	onAdd={handleAddAccess}
 />
 
-<div class="flex flex-col gap-2">
+<div class="flex flex-col gap-2" inert={saving} aria-busy={saving}>
 	<div class="-mx-1 rounded-xl bg-gray-50/60 px-3 py-2 dark:bg-white/[0.03]">
 		<Tooltip
 			content={!(share && sharePublic) && visibility === 'private'