bhetherman/open-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refac

Browse Source
This commit is contained in:
Timothy Jaeryang Baek
2026-07-15 05:49:48 -04:00
parent f8ea15b84a
commit 727041da78
8 changed files with 302 additions and 282 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/admin/Users.svelte
+42 -5
View File
@@ -2,8 +2,11 @@
import { getContext, onMount } from 'svelte';
import { goto } from '$app/navigation';
import { user } from '$lib/stores';
import { adminGroupCount, adminUserCount, config, user } from '$lib/stores';
import { page } from '$app/stores';
import { getGroups } from '$lib/apis/groups';
import { getUsers } from '$lib/apis/users';
import { formatNumber } from '$lib/utils';
import UserList from './Users/UserList.svelte';
import Groups from './Users/Groups.svelte';
@@ -30,12 +33,32 @@
};
let loaded = false;
$: usersSeatLimit = $config?.license_metadata?.seats ?? null;
$: usersCountExceeded = usersSeatLimit !== null && ($adminUserCount ?? 0) > usersSeatLimit;
$: formattedUserCount =
$adminUserCount === null
? null
: usersSeatLimit !== null
? `${formatNumber($adminUserCount)} of ${formatNumber(usersSeatLimit)}`
: formatNumber($adminUserCount);
$: formattedGroupCount = $adminGroupCount === null ? null : formatNumber($adminGroupCount);
const loadCounts = async () => {
const [usersRes, groupsRes] = await Promise.all([
getUsers(localStorage.token, undefined, 'created_at', 'asc', 1).catch(() => null),
getGroups(localStorage.token).catch(() => null)
]);
adminUserCount.set(usersRes?.total ?? null);
adminGroupCount.set(Array.isArray(groupsRes) ? groupsRes.length : null);
};
onMount(async () => {
if ($user?.role !== 'admin') {
await goto('/');
}
await loadCounts();
loaded = true;
const containerElement = document.getElementById('users-tabs-container');
@@ -55,33 +78,47 @@
</script>
{#if loaded}
<div class="flex flex-col lg:flex-row w-full h-full pb-2 lg:space-x-4">
<div class="flex flex-col lg:flex-row w-full h-full pb-2">
<div
id="users-tabs-container"
class="tabs mx-2 sm:mx-[16px] lg:mx-0 lg:px-[16px] flex flex-row overflow-x-auto gap-2.5 max-w-full lg:gap-1 lg:flex-col lg:flex-none lg:w-50 dark:text-gray-200 text-sm font-normal text-left scrollbar-none"
class="tabs mx-2 px-2 sm:mx-2.5 lg:mx-0 lg:px-2.5 flex flex-row overflow-x-auto gap-2.5 max-w-full lg:gap-0 lg:flex-col lg:flex-none lg:w-50 dark:text-gray-200 text-sm font-normal text-left scrollbar-none"
>
<a
id="overview"
href="/admin/users/overview"
draggable="false"
class="px-0.5 py-1 min-w-fit rounded-lg lg:flex-none flex text-right transition select-none {selectedTab ===
class="px-0.5 py-1 min-w-fit rounded-lg lg:flex-none flex items-center gap-1.5 text-right transition select-none {selectedTab ===
'overview'
? ''
: ' text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'}"
>
<div class=" self-center">{$i18n.t('Overview')}</div>
{#if formattedUserCount !== null}
<div
class="self-center text-sm {usersCountExceeded
? `text-red-500 ${selectedTab === 'overview' ? '' : 'opacity-50'}`
: 'opacity-60'}"
>
{formattedUserCount}
</div>
{/if}
</a>
<a
id="groups"
href="/admin/users/groups"
draggable="false"
class="px-0.5 py-1 min-w-fit rounded-lg lg:flex-none flex text-right transition select-none {selectedTab ===
class="px-0.5 py-1 min-w-fit rounded-lg lg:flex-none flex items-center gap-1.5 text-right transition select-none {selectedTab ===
'groups'
? ''
: ' text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'}"
>
<div class=" self-center">{$i18n.t('Groups')}</div>
{#if formattedGroupCount !== null}
<div class="self-center text-sm opacity-60">
{formattedGroupCount}
</div>
{/if}
</a>
</div>