From 3bda6e81aefc0745a5689b622e077f7229464a08 Mon Sep 17 00:00:00 2001
From: Nicolas Meienberger <github@thisprops.com>
Date: Fri, 17 Oct 2025 21:23:33 +0200
Subject: [PATCH] feat(details): keep tab in url to preserve active tab on
 reload

---
 apps/client/app/routes/details.tsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/apps/client/app/routes/details.tsx b/apps/client/app/routes/details.tsx
index 2646536..19a6bf6 100644
--- a/apps/client/app/routes/details.tsx
+++ b/apps/client/app/routes/details.tsx
@@ -1,5 +1,5 @@
 import { useMutation, useQuery } from "@tanstack/react-query";
-import { useNavigate, useParams } from "react-router";
+import { useNavigate, useParams, useSearchParams } from "react-router";
 import { toast } from "sonner";
 import {
 	deleteVolumeMutation,
@@ -38,6 +38,8 @@ export const clientLoader = async ({ params }: Route.ClientLoaderArgs) => {
 export default function DetailsPage({ loaderData }: Route.ComponentProps) {
 	const { name } = useParams<{ name: string }>();
 	const navigate = useNavigate();
+	const [searchParams, setSearchParams] = useSearchParams();
+	const activeTab = searchParams.get("tab") || "info";
 
 	const { data } = useQuery({
 		...getVolumeOptions({ path: { name: name ?? "" } }),
@@ -131,7 +133,7 @@ export default function DetailsPage({ loaderData }: Route.ComponentProps) {
 					</Button>
 				</div>
 			</div>
-			<Tabs defaultValue="info" className="mt-4">
+			<Tabs value={activeTab} onValueChange={(value) => setSearchParams({ tab: value })} className="mt-4">
 				<TabsList className="mb-2">
 					<TabsTrigger value="info">Configuration</TabsTrigger>
 					<TabsTrigger value="files">Files</TabsTrigger>