diff --git a/ui/src/components/BreadcrumbBar.tsx b/ui/src/components/BreadcrumbBar.tsx index a93d96c8..6f1f9bbf 100644 --- a/ui/src/components/BreadcrumbBar.tsx +++ b/ui/src/components/BreadcrumbBar.tsx @@ -2,6 +2,7 @@ import { Link } from "@/lib/router"; import { Menu } from "lucide-react"; import { useBreadcrumbs } from "../context/BreadcrumbContext"; import { useSidebar } from "../context/SidebarContext"; +import { useCompany } from "../context/CompanyContext"; import { Button } from "@/components/ui/button"; import { Breadcrumb, @@ -11,13 +12,37 @@ import { BreadcrumbPage, BreadcrumbSeparator, } from "@/components/ui/breadcrumb"; -import { Fragment } from "react"; +import { Fragment, useMemo } from "react"; +import { PluginSlotOutlet } from "@/plugins/slots"; export function BreadcrumbBar() { const { breadcrumbs } = useBreadcrumbs(); const { toggleSidebar, isMobile } = useSidebar(); + const { selectedCompanyId, selectedCompany } = useCompany(); - if (breadcrumbs.length === 0) return null; + const globalToolbarSlotContext = useMemo( + () => ({ + companyId: selectedCompanyId ?? null, + companyPrefix: selectedCompany?.issuePrefix ?? null, + }), + [selectedCompanyId, selectedCompany?.issuePrefix], + ); + + const globalToolbarSlots = ( + + ); + + if (breadcrumbs.length === 0) { + return ( +
+ {globalToolbarSlots} +
+ ); + } const menuButton = isMobile && (