import { Fragment, useState } from "react"; import { Disclosure, Menu, Switch, Transition } from "@headlessui/react"; import { MagnifyingGlassIcon } from "@heroicons/react/20/solid"; import { Bars3Icon, BellIcon, CogIcon, CreditCardIcon, KeyIcon, SquaresPlusIcon, UserCircleIcon, XMarkIcon, UsersIcon, } from "@heroicons/react/24/outline"; import { useRouter } from "next/router"; import Link from "next/link"; import Head from "next/head"; import avatarFromInitials from "avatar-from-initials"; import { useSession } from "next-auth/react"; import { User } from "next-auth"; import { Value } from "sass"; const subNavigation = [ { name: "Profile", href: "/settings/profile", icon: UserCircleIcon, current: true, }, { name: "Password", href: "/settings/password", icon: KeyIcon, current: false, }, { name: "Account", href: "/settings/account", icon: CogIcon, current: false, }, ]; function classNames(...classes: any) { return classes.filter(Boolean).join(" "); } export default function Setttings() { const [availableToHire, setAvailableToHire] = useState(true); const session = useSession(); let user = session.data?.user; const router = useRouter(); subNavigation.forEach((element) => { element.current = element.href == router.route; }); return (