remember page on back navigation over the UI

frontend/src/lib/components/advanced-table.svelte

@@ -120,7 +120,7 @@
 	function changePageState(page: number) {
 		const url = new URL(window.location.href);
 		url.searchParams.set(`${id}-page`, page.toString());
-		history.replaceState({}, '', url.toString());
+		history.replaceState(history.state, '', url.toString());
 		requestOptions.pagination!.page = page;
 	}
 

frontend/src/lib/services/version-service.ts

@@ -4,7 +4,7 @@ import APIService from './api-service';
 export default class VersionService extends APIService {
 	getNewestVersion = async () => {
 		const response = await this.api
-			.get('/api/version/latest', { timeout: 2000 })
+			.get('/version/latest', { timeout: 2000 })
 			.then((res) => res.data);
 		return response.latestVersion;
 	};

frontend/src/routes/settings/admin/oidc-clients/[id]/+page.svelte

@@ -13,9 +13,10 @@
 	import clientSecretStore from '$lib/stores/client-secret-store';
 	import type { OidcClientCreateWithLogo } from '$lib/types/oidc.type';
 	import { axiosErrorToast } from '$lib/utils/error-util';
-	import { LucideChevronLeft, LucideRefreshCcw, RectangleEllipsis } from '@lucide/svelte';
+	import { LucideChevronLeft, LucideRefreshCcw } from '@lucide/svelte';
 	import { toast } from 'svelte-sonner';
 	import { slide } from 'svelte/transition';
+	import { backNavigate } from '../../users/navigate-back-util';
 	import OidcForm from '../oidc-client-form.svelte';
 	import OidcClientPreviewModal from '../oidc-client-preview-modal.svelte';
 
@@ -28,6 +29,7 @@
 	let showPreview = $state(false);
 
 	const oidcService = new OidcService();
+	const backNavigation = backNavigate('/settings/admin/oidc-clients');
 
 	const setupDetails = $state({
 		[m.authorization_url()]: `https://${page.url.hostname}/authorize`,
@@ -113,8 +115,8 @@
 </svelte:head>
 
 <div>
-	<a class="text-muted-foreground flex text-sm" href="/settings/admin/oidc-clients"
-		><LucideChevronLeft class="size-5" /> {m.back()}</a
+	<button class="text-muted-foreground flex text-sm" onclick={backNavigation.go}
+		><LucideChevronLeft class="size-5" /> {m.back()}</button
 	>
 </div>
 <Card.Root>

frontend/src/routes/settings/admin/user-groups/[id]/+page.svelte

@@ -4,6 +4,7 @@
 	import { Badge } from '$lib/components/ui/badge';
 	import { Button } from '$lib/components/ui/button';
 	import * as Card from '$lib/components/ui/card';
+	import { m } from '$lib/paraglide/messages';
 	import CustomClaimService from '$lib/services/custom-claim-service';
 	import UserGroupService from '$lib/services/user-group-service';
 	import appConfigStore from '$lib/stores/application-configuration-store';
@@ -11,9 +12,9 @@
 	import { axiosErrorToast } from '$lib/utils/error-util';
 	import { LucideChevronLeft } from '@lucide/svelte';
 	import { toast } from 'svelte-sonner';
+	import { backNavigate } from '../../users/navigate-back-util';
 	import UserGroupForm from '../user-group-form.svelte';
 	import UserSelection from '../user-selection.svelte';
-	import { m } from '$lib/paraglide/messages';
 
 	let { data } = $props();
 	let userGroup = $state({
@@ -23,6 +24,7 @@
 
 	const userGroupService = new UserGroupService();
 	const customClaimService = new CustomClaimService();
+	const backNavigation = backNavigate('/settings/admin/user-groups');
 
 	async function updateUserGroup(updatedUserGroup: UserGroupCreate) {
 		let success = true;
@@ -61,8 +63,8 @@
 </svelte:head>
 
 <div class="flex items-center justify-between">
-	<a class="text-muted-foreground flex text-sm" href="/settings/admin/user-groups"
-		><LucideChevronLeft class="size-5" /> {m.back()}</a
+	<button class="text-muted-foreground flex text-sm" onclick={backNavigation.go}
+		><LucideChevronLeft class="size-5" /> {m.back()}</button
 	>
 	{#if !!userGroup.ldapId}
 		<Badge class="rounded-full" variant="default">{m.ldap()}</Badge>

frontend/src/routes/settings/admin/users/[id]/+page.svelte

@@ -14,6 +14,7 @@
 	import { axiosErrorToast } from '$lib/utils/error-util';
 	import { LucideChevronLeft } from '@lucide/svelte';
 	import { toast } from 'svelte-sonner';
+	import { backNavigate } from '../navigate-back-util';
 	import UserForm from '../user-form.svelte';
 
 	let { data } = $props();
@@ -24,6 +25,7 @@
 
 	const userService = new UserService();
 	const customClaimService = new CustomClaimService();
+	const backNavigation = backNavigate('/settings/admin/users');
 
 	async function updateUserGroups(userIds: string[]) {
 		await userService
@@ -81,8 +83,8 @@
 </svelte:head>
 
 <div class="flex items-center justify-between">
-	<a class="text-muted-foreground flex text-sm" href="/settings/admin/users"
-		><LucideChevronLeft class="size-5" /> {m.back()}</a
+	<button class="text-muted-foreground flex text-sm" onclick={() => backNavigation.go()}
+		><LucideChevronLeft class="size-5" /> {m.back()}</button
 	>
 	{#if !!user.ldapId}
 		<Badge class="rounded-full" variant="default">{m.ldap()}</Badge>

frontend/src/routes/settings/admin/users/navigate-back-util.ts

@@ -0,0 +1,21 @@
+import { afterNavigate, goto } from '$app/navigation';
+
+export const backNavigate = (defaultRoute: string) => {
+	let previousUrl: URL | undefined;
+	afterNavigate((e) => {
+		console.log(e);
+		if (e.from) {
+			previousUrl = e.from.url;
+		}
+	});
+
+	return {
+		go: () => {
+			if (previousUrl && previousUrl.pathname === defaultRoute) {
+				window.history.back();
+			} else {
+				goto(defaultRoute);
+			}
+		}
+	};
+};