Add full width organization layout mode on framework sub routes
Signed-off-by: Émile Ré <nemile.re@gmail.com>
This commit is contained in:
@@ -1,18 +1,30 @@
|
|||||||
import { Outlet } from "react-router";
|
import { Outlet, useMatch } from "react-router";
|
||||||
import { AppSidebar } from "@/components/AppSidebar";
|
import { AppSidebar } from "@/components/AppSidebar";
|
||||||
import { Suspense } from "react";
|
import { Suspense } from "react";
|
||||||
import { SidebarInset, SidebarProvider } from "@/components/ui/sidebar";
|
import { SidebarInset, SidebarProvider } from "@/components/ui/sidebar";
|
||||||
import { Toaster } from "@/components/ui/toaster";
|
import { Toaster } from "@/components/ui/toaster";
|
||||||
import { BreadCrumb } from "./OrganizationBreadcrumb";
|
import { BreadCrumb } from "./OrganizationBreadcrumb";
|
||||||
|
import { cn } from "@/lib/utils";
|
||||||
|
|
||||||
export default function OrganizationLayout() {
|
export default function OrganizationLayout() {
|
||||||
|
const match = useMatch(
|
||||||
|
"organizations/:organizationId/frameworks/:frameworkId"
|
||||||
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SidebarProvider>
|
<SidebarProvider>
|
||||||
<Suspense>
|
<Suspense>
|
||||||
<AppSidebar className="p-4" />
|
<AppSidebar className="p-4" />
|
||||||
</Suspense>
|
</Suspense>
|
||||||
<SidebarInset>
|
<SidebarInset>
|
||||||
<div className="mx-auto w-lg md:w-xl lg:w-3xl xl:w-4xl 2xl:w-5xl p-8">
|
<div
|
||||||
|
className={cn(
|
||||||
|
"p-8",
|
||||||
|
match
|
||||||
|
? "w-full"
|
||||||
|
: "mx-auto w-lg md:w-xl lg:w-3xl xl:w-4xl 2xl:w-5xl"
|
||||||
|
)}
|
||||||
|
>
|
||||||
<header className="flex shrink-0 items-center gap-2">
|
<header className="flex shrink-0 items-center gap-2">
|
||||||
<BreadCrumb />
|
<BreadCrumb />
|
||||||
</header>
|
</header>
|
||||||
|
|||||||
Reference in New Issue
Block a user