import { IconAt, IconExternalLink } from "@tabler/icons-react"; import Image from "next/image"; import avatarImg from "@/app/avatar.jpg"; import { HeaderShell } from "@/components/layout/header-shell"; import { HomeLink } from "@/components/layout/home-link"; import { Menu } from "@/components/layout/menu"; import { ThemeToggle } from "@/components/layout/theme-toggle"; 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: authorConfig.social.mastodon.replace(/^@([^@]+)@(.+)$/, "https://$2/@$1"), 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 }) => (
{`Photo {siteConfig.name}
); export { Header };