36 lines
1 KiB
React
36 lines
1 KiB
React
|
"use client";
|
||
|
import Logo from "@/components/Logo";
|
||
|
import { headerLinks } from "@/constants";
|
||
|
import Link from "next/link";
|
||
|
import { usePathname } from "next/navigation";
|
||
|
import { Menu, Moon, Sun, X } from "lucide-react";
|
||
|
import { useTheme } from "next-themes";
|
||
|
import { useEffect, useState } from "react";
|
||
|
import PropTypes from "prop-types";
|
||
|
|
||
|
function Header({ links }) {
|
||
|
const pathname = usePathname();
|
||
|
|
||
|
return (
|
||
|
<ul className={`flex flex-col my-3 list-none`}>
|
||
|
{links.map((link) => (
|
||
|
<li className="block my-1" key={link.label}>
|
||
|
<Link
|
||
|
href={link.href}
|
||
|
target={link.target || "_self"}
|
||
|
className={`${link.sub ? "ml-4" : ""} block align-middle ${pathname == link.href ? "bg-accent" : ""} text-inherit px-2 py-1 mx-1 rounded-sm hover:bg-accent/60 transition-colors`}
|
||
|
>
|
||
|
{link.label}
|
||
|
</Link>
|
||
|
</li>
|
||
|
))}
|
||
|
</ul>
|
||
|
);
|
||
|
}
|
||
|
|
||
|
Header.propTypes = {
|
||
|
links: PropTypes.arrayOf(PropTypes.object)
|
||
|
};
|
||
|
|
||
|
export default Header;
|