sistema-de-chamados/src/components/admin/machines/machine-breadcrumbs.client.tsx

30 lines
1.1 KiB
TypeScript

"use client"
import Link from "next/link"
import { useMemo } from "react"
import { useQuery } from "convex/react"
import type { Id } from "@/convex/_generated/dataModel"
import { api } from "@/convex/_generated/api"
import { useAuth } from "@/lib/auth-client"
export function MachineBreadcrumbs({ tenantId, machineId }: { tenantId: string; machineId: string }) {
const { convexUserId } = useAuth()
const list = useQuery(
convexUserId ? api.machines.listByTenant : "skip",
convexUserId ? { tenantId, includeMetadata: false } : ("skip" as const)
) as Array<{ id: Id<"machines">; hostname: string }> | undefined
const hostname = useMemo(() => list?.find((m) => m.id === (machineId as unknown as Id<"machines">))?.hostname ?? "Detalhe", [list, machineId])
return (
<nav className="mb-4 text-sm text-neutral-600">
<ol className="flex items-center gap-2">
<li>
<Link href="/admin/machines" className="underline-offset-4 hover:underline">Máquinas</Link>
</li>
<li className="text-neutral-400">/</li>
<li className="text-neutral-800">{hostname}</li>
</ol>
</nav>
)
}