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 04:12:11 -04:00
parent 05e3f71317
commit f8350360df
13 changed files with 492 additions and 249 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/admin/Analytics.svelte
+1 -1
View File
@@ -18,7 +18,7 @@
</script>
{#if loaded}
<div class="w-full h-full pb-2 px-[16px]">
<div class="w-full h-full pb-2 px-3">
<Dashboard />
</div>
{/if}
src/lib/components/admin/Users.svelte
+37 -36
View File
@@ -1,6 +1,5 @@
<script>
import { getContext, tick, onMount } from 'svelte';
import { toast } from 'svelte-sonner';
import { getContext, onMount } from 'svelte';
import { goto } from '$app/navigation';
import { user } from '$lib/stores';
@@ -55,41 +54,43 @@
});
</script>
<div class="flex flex-col w-full h-full pb-2">
<div
id="users-tabs-container"
class="mx-2 sm:mx-[16px] flex flex-row overflow-x-auto gap-2.5 max-w-full 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 ===
'overview'
? ''
: ' text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'}"
{#if loaded}
<div class="flex flex-col lg:flex-row w-full h-full pb-2 lg:space-x-4">
<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"
>
<div class=" self-center">{$i18n.t('Overview')}</div>
</a>
<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 ===
'overview'
? ''
: ' text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'}"
>
<div class=" self-center">{$i18n.t('Overview')}</div>
</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 ===
'groups'
? ''
: ' text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'}"
>
<div class=" self-center">{$i18n.t('Groups')}</div>
</a>
</div>
<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 ===
'groups'
? ''
: ' text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'}"
>
<div class=" self-center">{$i18n.t('Groups')}</div>
</a>
</div>
<div class="flex-1 mt-1 px-[16px] overflow-y-scroll">
{#if selectedTab === 'overview'}
<UserList />
{:else if selectedTab === 'groups'}
<Groups />
{/if}
<div class="flex-1 mt-1 lg:mt-0 px-[16px] lg:pr-[16px] lg:pl-0 overflow-y-scroll">
{#if selectedTab === 'overview'}
<UserList />
{:else if selectedTab === 'groups'}
<Groups />
{/if}
</div>
</div>
</div>
{/if}
src/lib/components/admin/Users/Groups.svelte
+6 -4
View File
@@ -106,7 +106,7 @@
onSubmit={addGroupHandler}
/>
<div class="flex flex-col gap-1 px-1 mt-1.5 mb-3">
<div class="flex flex-col gap-1 mt-0.5 mb-3">
<div class="flex justify-between items-center">
<div class="flex items-center md:self-center text-xl font-normal px-0.5 gap-2 shrink-0">
<div>
@@ -145,8 +145,10 @@
</div>
</div>
<div class="space-y-1">
<div class="flex h-8 flex-1 items-center w-full gap-2">
<div
class="py-2 bg-white dark:bg-gray-900 rounded-3xl border border-gray-100/30 dark:border-gray-850/30"
>
<div class="px-2.5 flex h-8 flex-1 items-center w-full gap-2">
<div class="flex min-w-0 flex-1">
<div class="self-center ml-1 mr-3">
<Search className="size-3.5" />
@@ -199,7 +201,7 @@
</div>
{#if filteredGroups.length !== 0}
<div class="my-1 grid grid-cols-1 gap-y-0.5">
<div class="mt-1 grid grid-cols-1 px-2">
{#each filteredGroups as group}
<GroupItem {group} {setGroups} {defaultPermissions} />
{/each}
src/lib/components/admin/Users/Groups/GroupItem.svelte
+1 -1
View File
@@ -67,7 +67,7 @@
/>
<button
class="group flex cursor-pointer text-left w-full px-2.5 py-2 rounded-2xl border-b border-gray-100/60 last:border-b-0 hover:bg-gray-50/70 dark:border-gray-850/60 dark:hover:bg-gray-850/50 transition"
class="group flex cursor-pointer text-left w-full px-2.5 py-2 rounded-xl border-b border-gray-100/60 last:border-b-0 hover:bg-gray-50/70 dark:border-gray-850/60 dark:hover:bg-gray-850/50 transition"
on:click={() => {
showEdit = true;
}}
src/lib/components/admin/Users/UserList.svelte
+8 -11
View File
@@ -1,8 +1,7 @@
<script lang="ts">
import { WEBUI_API_BASE_URL, WEBUI_BASE_URL } from '$lib/constants';
import { WEBUI_NAME, config, user, showSidebar } from '$lib/stores';
import { goto } from '$app/navigation';
import { onMount, getContext, onDestroy } from 'svelte';
import { WEBUI_API_BASE_URL } from '$lib/constants';
import { config, user } from '$lib/stores';
import { getContext, onDestroy } from 'svelte';
import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';
@@ -12,7 +11,7 @@
import { toast } from 'svelte-sonner';
import { updateUserRole, getUsers, deleteUserById } from '$lib/apis/users';
import { getUsers, deleteUserById } from '$lib/apis/users';
import Pagination from '$lib/components/common/Pagination.svelte';
import ChatBubbles from '$lib/components/icons/ChatBubbles.svelte';
@@ -23,13 +22,11 @@
import AddUserModal from '$lib/components/admin/Users/UserList/AddUserModal.svelte';
import ConfirmDialog from '$lib/components/common/ConfirmDialog.svelte';
import RoleUpdateConfirmDialog from '$lib/components/common/ConfirmDialog.svelte';
import Badge from '$lib/components/common/Badge.svelte';
import Plus from '$lib/components/icons/Plus.svelte';
import ChevronUp from '$lib/components/icons/ChevronUp.svelte';
import ChevronDown from '$lib/components/icons/ChevronDown.svelte';
import About from '$lib/components/chat/Settings/About.svelte';
import Banner from '$lib/components/common/Banner.svelte';
import Markdown from '$lib/components/chat/Messages/Markdown.svelte';
import Spinner from '$lib/components/common/Spinner.svelte';
@@ -169,7 +166,7 @@
<div
class="pt-0.5 pb-1 gap-1 flex flex-col md:flex-row justify-between sticky top-0 z-10 bg-white dark:bg-gray-900"
>
<div class="flex md:self-center text-lg font-normal px-0.5 gap-2">
<div class="flex items-center md:self-center text-xl font-normal px-0.5 gap-2 shrink-0">
<div class="flex-shrink-0">
{$i18n.t('Users')}
</div>
@@ -194,7 +191,7 @@
</div>
<div class="flex gap-1">
<div class=" flex w-full space-x-2">
<div class="flex w-full space-x-2">
<div class="flex flex-1">
<div class=" self-center ml-1 mr-3">
<svg
@@ -356,11 +353,11 @@
</div>
</th>
<th scope="col" class="px-2.5 py-2 text-right" />
<th scope="col" class="px-2.5 py-2 text-right"></th>
</tr>
</thead>
<tbody class="">
{#each users as user, userIdx (user.id)}
{#each users as user (user.id)}
<tr class="bg-white dark:bg-gray-900 dark:border-gray-850 text-xs">
<td class="px-3 py-1 min-w-[7rem] w-28">
<button