feat/enh: group share setting

src/lib/apis/groups/index.ts

@@ -31,10 +31,15 @@ export const createNewGroup = async (token: string, group: object) => {
 	return res;
 };
 
-export const getGroups = async (token: string = '') => {
+export const getGroups = async (token: string = '', share?: boolean) => {
 	let error = null;
 
-	const res = await fetch(`${WEBUI_API_BASE_URL}/groups/`, {
+	const searchParams = new URLSearchParams();
+	if (share !== undefined) {
+		searchParams.append('share', String(share));
+	}
+
+	const res = await fetch(`${WEBUI_API_BASE_URL}/groups/?${searchParams.toString()}`, {
 		method: 'GET',
 		headers: {
 			Accept: 'application/json',

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

@@ -34,7 +34,7 @@
 
 	export let name = '';
 	export let description = '';
-	export let config = {};
+	export let data = {};
 
 	export let permissions = {
 		workspace: {
@@ -98,6 +98,7 @@
 		const group = {
 			name,
 			description,
+			data,
 			permissions
 		};
 
@@ -112,7 +113,7 @@
 			name = group.name;
 			description = group.description;
 			permissions = group?.permissions ?? {};
-			config = group?.data?.config ?? {};
+			data = group?.data ?? {};
 
 			userCount = group?.member_count ?? 0;
 		}
@@ -246,7 +247,7 @@
 									<General
 										bind:name
 										bind:description
-										bind:config
+										bind:data
 										{edit}
 										onDelete={() => {
 											showDeleteConfirmDialog = true;

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

@@ -2,13 +2,14 @@
 	import { getContext } from 'svelte';
 	import Textarea from '$lib/components/common/Textarea.svelte';
 	import Tooltip from '$lib/components/common/Tooltip.svelte';
+	import Switch from '$lib/components/common/Switch.svelte';
 
 	const i18n = getContext('i18n');
 
 	export let name = '';
 	export let color = '';
 	export let description = '';
-	export let config = {};
+	export let data = {};
 
 	export let edit = false;
 	export let onDelete: Function = () => {};
@@ -64,6 +65,34 @@
 	</div>
 </div>
 
+<hr class="border-gray-50 dark:border-gray-850 my-1" />
+
+<div class="flex flex-col w-full mt-2">
+	<div class=" mb-1 text-xs text-gray-500">{$i18n.t('Setting')}</div>
+
+	<div>
+		<div class=" flex w-full justify-between">
+			<div class=" self-center text-xs">
+				{$i18n.t('Allow Group Sharing')}
+			</div>
+
+			<div class="flex items-center gap-2 p-1">
+				<Switch
+					tooltip={true}
+					state={data?.config?.share ?? true}
+					on:change={(e) => {
+						if (data?.config?.share) {
+							data.config.share = e.detail;
+						} else {
+							data.config = { ...(data?.config ?? {}), share: e.detail };
+						}
+					}}
+				/>
+			</div>
+		</div>
+	</div>
+</div>
+
 {#if edit}
 	<div class="flex flex-col w-full mt-2">
 		<div class=" mb-0.5 text-xs text-gray-500">{$i18n.t('Actions')}</div>

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

@@ -10,7 +10,7 @@
 	import Pencil from '$lib/components/icons/Pencil.svelte';
 	import User from '$lib/components/icons/User.svelte';
 	import UserCircleSolid from '$lib/components/icons/UserCircleSolid.svelte';
-	import GroupModal from './EditGroupModal.svelte';
+	import EditGroupModal from './EditGroupModal.svelte';
 
 	export let group = {
 		name: 'Admins',
@@ -54,7 +54,7 @@
 	});
 </script>
 
-<GroupModal
+<EditGroupModal
 	bind:show={showEdit}
 	edit
 	{group}

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

@@ -42,7 +42,7 @@
 	};
 
 	onMount(async () => {
-		groups = await getGroups(localStorage.token);
+		groups = await getGroups(localStorage.token, true);
 
 		if (accessControl === null) {
 			initPublicAccess();