41 lines
1.3 KiB
TypeScript

import './sidebar.css'
import { Button, NavLink } from 'react-bootstrap';
import React, { ReactNode, useState } from 'react';
import Link from 'next/link';
import { headers } from 'next/headers';
export type SidebarEntry = {
label:string;
view:string;
}
type Props = {
children?:ReactNode;
sidebarEntries:Array<SidebarEntry>;
slug:string
}
export default async function Sidebar({children, sidebarEntries, slug}:Props){
return (
<div className='w-fit h[100%] drop-shadow-2xl shadow-xl'>
<ul className={`navbar-light bg-light nav nav-pills flex-column mb-auto container-fluid h-[100%] items-start justify-start p-0 w-fit`}>
{sidebarEntries.map((sidebarEntry)=>{
const activeClass:string = (slug == sidebarEntry.view) ? 'active' : '';
return <li
key={sidebarEntry.view}
className='nav-item w-[100%]'>
<Link
href={`/admin/${sidebarEntry.view}`}
className={`${activeClass} nav-link m-2 whitespace-nowrap outline outline-1`}>
{sidebarEntry.label}
</Link></li>
})}
</ul>
</div>
);
}