refac: access control

src/lib/components/workspace/common/AccessControl.svelte

@@ -21,38 +21,30 @@
 	let groups = [];
 
 	$: if (!allowPublic && accessControl === null) {
-		accessControl = {
-			read: {
-				group_ids: [],
-				user_ids: []
-			},
-			write: {
-				group_ids: [],
-				user_ids: []
-			}
-		};
-		onChange(accessControl);
+		initPublicAccess();
 	}
 
+	const initPublicAccess = () => {
+		if (!allowPublic && accessControl === null) {
+			accessControl = {
+				read: {
+					group_ids: [],
+					user_ids: []
+				},
+				write: {
+					group_ids: [],
+					user_ids: []
+				}
+			};
+			onChange(accessControl);
+		}
+	};
+
 	onMount(async () => {
 		groups = await getGroups(localStorage.token);
 
 		if (accessControl === null) {
-			if (allowPublic) {
-				accessControl = null;
-			} else {
-				accessControl = {
-					read: {
-						group_ids: [],
-						user_ids: []
-					},
-					write: {
-						group_ids: [],
-						user_ids: []
-					}
-				};
-				onChange(accessControl);
-			}
+			initPublicAccess();
 		} else {
 			accessControl = {
 				read: {
@@ -66,20 +58,6 @@
 			};
 		}
 	});
-
-	$: onChange(accessControl);
-
-	$: if (selectedGroupId) {
-		onSelectGroup();
-	}
-
-	const onSelectGroup = () => {
-		if (selectedGroupId !== '') {
-			accessControl.read.group_ids = [...(accessControl?.read?.group_ids ?? []), selectedGroupId];
-
-			selectedGroupId = '';
-		}
-	};
 </script>
 
 <div class=" rounded-lg flex flex-col gap-2">
@@ -143,6 +121,7 @@
 								}
 							};
 						}
+						onChange(accessControl);
 					}}
 				>
 					<option class=" text-gray-700" value="private" selected>{$i18n.t('Private')}</option>
@@ -182,6 +161,17 @@
 									{selectedGroupId ? '' : 'text-gray-500'}
 									dark:placeholder-gray-500"
 									bind:value={selectedGroupId}
+									on:change={() => {
+										if (selectedGroupId !== '') {
+											accessControl.read.group_ids = [
+												...(accessControl?.read?.group_ids ?? []),
+												selectedGroupId
+											];
+
+											selectedGroupId = '';
+											onChange(accessControl);
+										}
+									}}
 								>
 									<option class=" text-gray-700" value="" disabled selected
 										>{$i18n.t('Select a group')}</option
@@ -238,6 +228,7 @@
 														group.id
 													];
 												}
+												onChange(accessControl);
 											}
 										}}
 									>
@@ -255,6 +246,10 @@
 											accessControl.read.group_ids = (accessControl?.read?.group_ids ?? []).filter(
 												(id) => id !== group.id
 											);
+											accessControl.write.group_ids = (
+												accessControl?.write?.group_ids ?? []
+											).filter((id) => id !== group.id);
+											onChange(accessControl);
 										}}
 									>
 										<XMark />