"use client"; import { IconAt, IconExternalLink, IconMoon, IconSun } from "@tabler/icons-react"; import { useTheme } from "next-themes"; import Image from "next/image"; import Link from "next/link"; import { usePathname } from "next/navigation"; import { useEffect, useState } from "react"; import avatarImg from "@/app/avatar.jpg"; import { Menu } from "@/components/layout/menu"; import { Button } from "@/components/ui/button"; import { Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, } from "@/components/ui/popover"; import { Separator } from "@/components/ui/separator"; import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"; import authorConfig from "@/lib/config/author"; import siteConfig from "@/lib/config/site"; import { cn } from "@/lib/utils"; const contactIconClassName = "text-muted-foreground size-4"; const contactLinks = [ { label: "Email", value: authorConfig.email, href: `mailto:${authorConfig.email}`, Icon: (props: React.SVGProps) => ( {/* Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE */} ), external: false, }, { label: "GitHub", value: `@${authorConfig.social.github}`, href: `https://github.com/${authorConfig.social.github}`, Icon: (props: React.SVGProps) => ( {/* Icon from Simple Icons by Simple Icons Collaborators - https://github.com/simple-icons/simple-icons/blob/develop/LICENSE.md */} ), external: true, }, { label: "Bluesky", value: `@${authorConfig.social.bluesky}`, href: `https://bsky.app/profile/${authorConfig.social.bluesky}`, Icon: (props: React.SVGProps) => ( {/* Icon from Simple Icons by Simple Icons Collaborators - https://github.com/simple-icons/simple-icons/blob/develop/LICENSE.md */} ), external: true, }, { label: "Mastodon", value: authorConfig.social.mastodon, href: `https://${authorConfig.social.mastodon}`, Icon: (props: React.SVGProps) => ( {/* Icon from Simple Icons by Simple Icons Collaborators - https://github.com/simple-icons/simple-icons/blob/develop/LICENSE.md */} ), external: true, }, { label: "Twitter", value: `@${authorConfig.social.twitter}`, href: `https://x.com/${authorConfig.social.twitter}`, Icon: (props: React.SVGProps) => ( {/* Icon from Simple Icons by Simple Icons Collaborators - https://github.com/simple-icons/simple-icons/blob/develop/LICENSE.md */} ), external: true, }, { label: "Instagram", value: `@${authorConfig.social.instagram}`, href: `https://www.instagram.com/${authorConfig.social.instagram}/`, Icon: (props: React.SVGProps) => ( {/* Icon from Simple Icons by Simple Icons Collaborators - https://github.com/simple-icons/simple-icons/blob/develop/LICENSE.md */} ), external: true, }, { label: "LinkedIn", value: `/in/${authorConfig.social.linkedin}`, href: `https://www.linkedin.com/in/${authorConfig.social.linkedin}/`, Icon: (props: React.SVGProps) => ( {/* Icon from Simple Icons by Simple Icons Collaborators - https://github.com/simple-icons/simple-icons/blob/develop/LICENSE.md */} ), external: true, }, { label: "Medium", value: `@${authorConfig.social.medium}`, href: `https://medium.com/@${authorConfig.social.medium}`, Icon: (props: React.SVGProps) => ( {/* Icon from Simple Icons by Simple Icons Collaborators - https://github.com/simple-icons/simple-icons/blob/develop/LICENSE.md */} ), external: true, }, { label: "Facebook", value: authorConfig.social.facebook, href: `https://www.facebook.com/${authorConfig.social.facebook}`, Icon: (props: React.SVGProps) => ( {/* Icon from Simple Icons by Simple Icons Collaborators - https://github.com/simple-icons/simple-icons/blob/develop/LICENSE.md */} ), external: true, }, ] as const; const ContactPopover = () => ( } > Get in touch: Email and social links. ); const Header = ({ className }: { className?: string }) => { const [isScrolled, setIsScrolled] = useState(false); const { theme, setTheme } = useTheme(); const pathname = usePathname(); useEffect(() => { const handleScroll = () => { setIsScrolled(window.scrollY > 10); }; // Check initial scroll position handleScroll(); window.addEventListener("scroll", handleScroll, { passive: true }); return () => window.removeEventListener("scroll", handleScroll); }, []); return (
{`Photo {siteConfig.name}
); }; export { Header };