122 lines
4.1 KiB
TypeScript
122 lines
4.1 KiB
TypeScript
// import Link from "next/link"
|
|
// import { signIn, signOut, useSession } from "next-auth/react"
|
|
// import styles from "../styles/header.module.css"
|
|
|
|
// // The approach used in this component shows how to build a sign in and sign out
|
|
// // component that works on pages which support both client and server side
|
|
// // rendering, and avoids any flash incorrect content on initial page load.
|
|
// export default function Header() {
|
|
// const { data: session, status } = useSession()
|
|
// const loading = status === "loading"
|
|
|
|
// //generate top header with sign in/out button and dropdown menu and user name/surname using tailwindcss
|
|
|
|
|
|
|
|
|
|
// return (
|
|
// <header className="">
|
|
// <noscript>
|
|
// <style>{`.nojs-show { opacity: 1; top: 0; }`}</style>
|
|
// </noscript>
|
|
// {/* <script src="https://cdn.jsdelivr.net/npm/tw-elements/dist/js/index.min.js"></script> */}
|
|
// <div className={styles.signedInStatus}>
|
|
// <p className={`nojs-show ${!session && loading ? styles.loading : styles.loaded}`}>
|
|
// {!session && (
|
|
// <>
|
|
// <span className={styles.notSignedInText}>
|
|
// You are not signed in
|
|
// </span>
|
|
// <a
|
|
// href={`/api/auth/signin`}
|
|
// className={styles.buttonPrimary}
|
|
// onClick={(e) => {
|
|
// e.preventDefault()
|
|
// signIn()
|
|
// }}
|
|
// >
|
|
// Sign in
|
|
// </a>
|
|
// </>
|
|
// )}
|
|
// {session?.user && (
|
|
// <>
|
|
// {session.user.image && (
|
|
// <span
|
|
// style={{ backgroundImage: `url('${session.user.image}')` }}
|
|
// className={styles.avatar}
|
|
// />
|
|
// )}
|
|
// <span className={styles.signedInText}>
|
|
// <small>Signed in as</small>
|
|
// <br />
|
|
// <strong>{session.user.email ?? session.user.name}</strong>
|
|
// </span>
|
|
// <a
|
|
// href={`/api/auth/signout`}
|
|
// className={styles.button}
|
|
// onClick={(e) => {
|
|
// e.preventDefault()
|
|
// signOut()
|
|
// }}
|
|
// >
|
|
// Sign out
|
|
// </a>
|
|
// </>
|
|
// )}
|
|
// </p>
|
|
// </div>
|
|
// {/* <nav className="max-w-7xl mx-auto ">
|
|
// <ul className={styles.navItems}>
|
|
// <li className={styles.navItem}>
|
|
// <Link href="/">Home</Link>
|
|
// </li>
|
|
// <li className={styles.navItem}>
|
|
// <Link href="/client">Client</Link>
|
|
// </li>
|
|
// <li className={styles.navItem}>
|
|
// <Link href="/server">Server</Link>
|
|
// </li>
|
|
// <li className={styles.navItem}>
|
|
// <Link href="/protected">Protected</Link>
|
|
// </li>
|
|
// <li className={styles.navItem}>
|
|
// <Link href="/api-example">API</Link>
|
|
// </li>
|
|
// <li className={styles.navItem}>
|
|
// <Link href="/admin">Admin</Link>
|
|
// </li>
|
|
// <li className={styles.navItem}>
|
|
// <Link href="/me">Me</Link>
|
|
// </li>
|
|
// <li className={styles.navItem}>
|
|
// CART
|
|
// {/* cart submenus * / }
|
|
// <ul className={styles.submenu}>
|
|
// <li className={styles.submenuItem}>
|
|
// <Link href="/cart/locations">Locations</Link>
|
|
// </li>
|
|
// <li className={styles.submenuItem}>
|
|
// <Link href="/cart/publishers">Publishers</Link>
|
|
// </li>
|
|
// <li className={styles.submenuItem}>
|
|
// <Link href="/cart/availabilities">Availabilities</Link>
|
|
// </li>
|
|
// <li className={styles.submenuItem}>
|
|
// <Link href="/cart/cartevents">Cart Event</Link>
|
|
// </li>
|
|
// </ul>
|
|
|
|
// </li>
|
|
// {/* end cart submenus * / }
|
|
|
|
// <li className={styles.navItem}>
|
|
// <Link href="/cart/calendar">Calendar</Link>
|
|
// </li>
|
|
// </ul >
|
|
// </nav > */ }
|
|
|
|
// </header >
|
|
// )
|
|
// }
|