diff --git a/src/lib/components/admin/Users.svelte b/src/lib/components/admin/Users.svelte index e777757e0..205d86555 100644 --- a/src/lib/components/admin/Users.svelte +++ b/src/lib/components/admin/Users.svelte @@ -4,13 +4,32 @@ import { goto } from '$app/navigation'; import { user } from '$lib/stores'; + import { page } from '$app/stores'; import UserList from './Users/UserList.svelte'; import Groups from './Users/Groups.svelte'; const i18n = getContext('i18n'); - let selectedTab = 'overview'; + let selectedTab; + $: { + const pathParts = $page.url.pathname.split('/'); + const tabFromPath = pathParts[pathParts.length - 1]; + selectedTab = ['overview', 'groups'].includes(tabFromPath) ? tabFromPath : 'overview'; + } + + $: if (selectedTab) { + // scroll to selectedTab + scrollToTab(selectedTab); + } + + const scrollToTab = (tabId) => { + const tabElement = document.getElementById(tabId); + if (tabElement) { + tabElement.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'start' }); + } + }; + let loaded = false; onMount(async () => { @@ -30,6 +49,9 @@ } }); } + + // Scroll to the selected tab on mount + scrollToTab(selectedTab); }); @@ -39,12 +61,13 @@ class=" flex flex-row overflow-x-auto gap-2.5 max-w-full lg:gap-1 lg:flex-col lg:flex-none lg:w-40 dark:text-gray-200 text-sm font-medium text-left scrollbar-none" >