zerobyte/app/client/modules/repositories/routes/repository-details.tsx
Nico ec4cf938bc
feat: show progress indicator on mirrors (#499)
* feat: show progress indicator on mirrors

refactor: remove unnecessary useEffects

* refactor: pr feedbacks
2026-02-12 22:27:30 +01:00

36 lines
1.3 KiB
TypeScript

import { useSuspenseQuery } from "@tanstack/react-query";
import { Suspense } from "react";
import { getRepositoryOptions } from "~/client/api-client/@tanstack/react-query.gen";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "~/client/components/ui/tabs";
import { RepositoryInfoTabContent } from "../tabs/info";
import { RepositorySnapshotsTabContent } from "../tabs/snapshots";
import { useNavigate, useSearch } from "@tanstack/react-router";
export default function RepositoryDetailsPage({ repositoryId }: { repositoryId: string }) {
const navigate = useNavigate();
const { tab } = useSearch({ from: "/(dashboard)/repositories/$repositoryId" });
const activeTab = tab || "info";
const { data } = useSuspenseQuery({
...getRepositoryOptions({ path: { id: repositoryId } }),
});
return (
<>
<Tabs value={activeTab} onValueChange={(value) => navigate({ to: ".", search: (s) => ({ ...s, tab: value }) })}>
<TabsList className="mb-2">
<TabsTrigger value="info">Configuration</TabsTrigger>
<TabsTrigger value="snapshots">Snapshots</TabsTrigger>
</TabsList>
<TabsContent value="info">
<RepositoryInfoTabContent repository={data} />
</TabsContent>
<TabsContent value="snapshots">
<Suspense>
<RepositorySnapshotsTabContent repository={data} />
</Suspense>
</TabsContent>
</Tabs>
</>
);
}