web-humas-fe/components/navbar/HumasNavbarWrapper.tsx

'use client'
import { Navbar, NavbarBrand, NavbarContent, NavbarItem } from '@nextui-org/navbar';
import { Avatar, Dropdown, DropdownItem, DropdownMenu, DropdownTrigger, ScrollShadow } from '@nextui-org/react';
import React from 'react'
import { ThemeSwitch } from '../theme-switch';
import Link from 'next/link';

interface Props {
    children: React.ReactNode;
    pageTitle?: string;
}
export default function HumasNavbarWrapper({ children }: Props) {
    return (
        <div className='w-full relative overflow-y-auto overflow-x-hidden'>
            <Navbar maxWidth='full' className='dark:text-white bg-slate-200 dark:bg-[#182237]'
                isBordered
                classNames={{
                    wrapper: "p-2"
                }}
            >
                <NavbarContent>
                    <NavbarItem>
                        Judul
                    </NavbarItem>
                </NavbarContent>
                <NavbarContent as="div" justify="end" className='pr-2'>
                    <Dropdown placement="bottom-end">
                        <DropdownTrigger>
                            <Avatar
                                isBordered
                                as="button"
                                className="transition-transform"
                                color="secondary"
                                name="Jason Hughes"
                                size="sm"
                                src="https://i.pravatar.cc/150?u=a042581f4e29026704d"
                            />
                        </DropdownTrigger>
                        <DropdownMenu aria-label="Profile Actions" variant="flat">
                            <DropdownItem key="profile" className="h-14 gap-2">
                                <p className="font-semibold">Signed in as</p>
                                <p className="font-semibold">zoey@example.com</p>
                            </DropdownItem>
                            <DropdownItem key="settings">My Settings</DropdownItem>
                            <DropdownItem key="help_and_feedback">Help & Feedback</DropdownItem>
                            <DropdownItem key="logout" color="danger">
                                Log Out
                            </DropdownItem>
                            <DropdownItem>
                                <ThemeSwitch />
                            </DropdownItem>
                        </DropdownMenu>
                    </Dropdown>
                </NavbarContent>
            </Navbar>
            <div className='p-2'>
                {children}
            </div>
        </div>

    )
}