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
+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}