mirror of
https://github.com/open-webui/open-webui.git
synced 2025-12-12 04:15:25 +00:00
feat: user permissions for workspace in UI
This commit is contained in:
TheLastFrame
parent
6f1486ffd0
commit
8364db2e05
1 changed files with 111 additions and 0 deletions
|
|
@ -4,6 +4,7 @@
|
||||||
const i18n = getContext('i18n');
|
const i18n = getContext('i18n');
|
||||||
|
|
||||||
import { getGroups } from '$lib/apis/groups';
|
import { getGroups } from '$lib/apis/groups';
|
||||||
|
import { getAllUsers } from '$lib/apis/users';
|
||||||
import Tooltip from '$lib/components/common/Tooltip.svelte';
|
import Tooltip from '$lib/components/common/Tooltip.svelte';
|
||||||
import Plus from '$lib/components/icons/Plus.svelte';
|
import Plus from '$lib/components/icons/Plus.svelte';
|
||||||
import UserCircleSolid from '$lib/components/icons/UserCircleSolid.svelte';
|
import UserCircleSolid from '$lib/components/icons/UserCircleSolid.svelte';
|
||||||
|
|
@ -21,6 +22,9 @@
|
||||||
let selectedGroupId = '';
|
let selectedGroupId = '';
|
||||||
let groups = [];
|
let groups = [];
|
||||||
|
|
||||||
|
let selectedUserId = '';
|
||||||
|
let users = [];
|
||||||
|
|
||||||
$: if (!sharePublic && accessControl === null) {
|
$: if (!sharePublic && accessControl === null) {
|
||||||
initPublicAccess();
|
initPublicAccess();
|
||||||
}
|
}
|
||||||
|
|
@ -43,6 +47,8 @@
|
||||||
|
|
||||||
onMount(async () => {
|
onMount(async () => {
|
||||||
groups = await getGroups(localStorage.token, true);
|
groups = await getGroups(localStorage.token, true);
|
||||||
|
users = await getAllUsers(localStorage.token);
|
||||||
|
users = users?.users ?? [];
|
||||||
|
|
||||||
if (accessControl === null) {
|
if (accessControl === null) {
|
||||||
initPublicAccess();
|
initPublicAccess();
|
||||||
|
|
@ -253,6 +259,111 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Users section -->
|
||||||
|
{@const accessUsers = users.filter((user) =>
|
||||||
|
(accessControl?.read?.user_ids ?? []).includes(user.id)
|
||||||
|
)}
|
||||||
|
<div class="mt-4">
|
||||||
|
<div class="">
|
||||||
|
<div class="flex justify-between mb-2.5">
|
||||||
|
<div class="text-xs font-medium text-gray-500">
|
||||||
|
{$i18n.t('Users')}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{#if accessUsers.length > 0}
|
||||||
|
<div class="flex flex-col gap-1.5 mb-2 px-0.5 mx-0.5">
|
||||||
|
{#each accessUsers as user}
|
||||||
|
<div class="flex items-center gap-3 justify-between text-sm w-full transition">
|
||||||
|
<div class="flex items-center gap-1.5 w-full">
|
||||||
|
<div>
|
||||||
|
{user.name} <span class="text-xs text-gray-500">{user?.email}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full flex justify-end items-center gap-0.5">
|
||||||
|
<button
|
||||||
|
class=""
|
||||||
|
type="button"
|
||||||
|
on:click={() => {
|
||||||
|
if (accessRoles.includes('write')) {
|
||||||
|
if ((accessControl?.write?.user_ids ?? []).includes(user.id)) {
|
||||||
|
accessControl.write.user_ids = (
|
||||||
|
accessControl?.write?.user_ids ?? []
|
||||||
|
).filter((user_id) => user_id !== user.id);
|
||||||
|
} else {
|
||||||
|
accessControl.write.user_ids = [
|
||||||
|
...(accessControl?.write?.user_ids ?? []),
|
||||||
|
user.id
|
||||||
|
];
|
||||||
|
}
|
||||||
|
onChange(accessControl);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{#if (accessControl?.write?.user_ids ?? []).includes(user.id)}
|
||||||
|
<Badge type={'success'} content={$i18n.t('Write')} />
|
||||||
|
{:else}
|
||||||
|
<Badge type={'info'} content={$i18n.t('Read')} />
|
||||||
|
{/if}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button
|
||||||
|
class=" rounded-full p-1 hover:bg-gray-100 dark:hover:bg-gray-850 transition"
|
||||||
|
type="button"
|
||||||
|
on:click={() => {
|
||||||
|
accessControl.read.user_ids = (
|
||||||
|
accessControl?.read?.user_ids ?? []
|
||||||
|
).filter((id) => id !== user.id);
|
||||||
|
accessControl.write.user_ids = (
|
||||||
|
accessControl?.write?.user_ids ?? []
|
||||||
|
).filter((id) => id !== user.id);
|
||||||
|
onChange(accessControl);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<XMark />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/each}
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
|
||||||
|
<div class="mb-1">
|
||||||
|
<div class="flex w-full">
|
||||||
|
<div class="flex flex-1 items-center">
|
||||||
|
<div class="w-full px-0.5">
|
||||||
|
<select
|
||||||
|
class="dark:bg-gray-900 outline-hidden bg-transparent text-sm block w-full pr-10 max-w-full
|
||||||
|
{selectedUserId ? '' : 'text-gray-500'}
|
||||||
|
dark:placeholder-gray-500"
|
||||||
|
bind:value={selectedUserId}
|
||||||
|
on:change={() => {
|
||||||
|
if (selectedUserId !== '') {
|
||||||
|
accessControl.read.user_ids = [
|
||||||
|
...(accessControl?.read?.user_ids ?? []),
|
||||||
|
selectedUserId
|
||||||
|
];
|
||||||
|
|
||||||
|
selectedUserId = '';
|
||||||
|
onChange(accessControl);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<option class=" text-gray-700" value="" disabled selected
|
||||||
|
>{$i18n.t('Select a user')}</option
|
||||||
|
>
|
||||||
|
{#each users.filter((user) => !(accessControl?.read?.user_ids ?? []).includes(user.id)) as user}
|
||||||
|
<option class=" text-gray-700" value={user.id}>{user.name} ({user.email})</option>
|
||||||
|
{/each}
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue