ondra/ironmount
1
1
Fork 0
mirror of https://github.com/nicotsx/ironmount.git synced 2025-12-10 12:10:51 +01:00
Code Issues Packages Projects Releases 1 Wiki Activity

feat(details): keep tab in url to preserve active tab on reload

Browse Source
This commit is contained in:
Nicolas Meienberger
2025-10-17 21:23:33 +02:00
parent 269116c25e
commit 3bda6e81ae
1 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/client/app/routes/details.tsx
View File

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