NeahNew/app/missions/layout.tsx
2025-05-04 23:43:43 +02:00

49 lines
1.5 KiB
TypeScript

"use client";
import React from "react";
import { ScrollArea } from "@/components/ui/scroll-area";
import { Button } from "@/components/ui/button";
import { Kanban, Plus } from "lucide-react";
import Link from "next/link";
import { usePathname } from "next/navigation";
export default function MissionsLayout({
children,
}: {
children: React.ReactNode;
}) {
const pathname = usePathname();
return (
<div className="flex h-screen">
{/* Sidebar */}
<div className="w-[246px] min-w-[246px] border-r bg-white">
<ScrollArea className="h-full">
<div className="p-4 space-y-2">
<Link href="/missions" passHref>
<div className={`w-full p-3 rounded-md ${pathname === "/missions" ? "bg-slate-100" : "hover:bg-slate-50"}`}>
<span className="text-sm font-medium">Mes Missions</span>
</div>
</Link>
<Link href="/missions/new" passHref>
<div className={`w-full p-3 rounded-md ${pathname === "/missions/new" ? "bg-slate-100" : "hover:bg-slate-50"}`}>
<span className="text-sm font-medium">Nouvelle Mission</span>
</div>
</Link>
</div>
</ScrollArea>
</div>
{/* Main content */}
<div
className="flex-1 overflow-auto bg-cover bg-center"
style={{
backgroundImage: "url('/images/wood-background.jpg')",
backgroundRepeat: "repeat",
}}
>
{children}
</div>
</div>
);
}