tomru/pfadi-bussle
1
0
Fork 0
mirror of https://github.com/tomru/pfadi-bussle.git synced 2026-03-03 06:27:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

more work on auth

Browse Source
This commit is contained in:
Thomas Ruoff
2024-09-12 23:25:34 +02:00
parent 9f80ca4b1b
commit 219881810d
4 changed files with 45 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
components/header.tsx
View File

@@ -1,10 +1,14 @@
import { useState } from 'react'
import { createPortal } from 'react-dom'
import React, { useState } from 'react'
import Head from 'next/head'
import Link from 'next/link'
import { useRouter } from 'next/router'
import User from './user'
type INavEntry = {
label: string
href: string
}
const NAV_ENTRIES = [
{
label: 'Home',
@@ -24,6 +28,26 @@ const NAV_ENTRIES = [
},
]
function NavEntries({ children, navEntries, changeRoute }) {
return (
<>
{navEntries?.map(({ label, href }: INavEntry, index: React.Key) => {
return (
<a
key={index}
href={href}
onClick={changeRoute}
className="text-base font-medium text-gray-500 hover:text-gray-900"
>
{label}
</a>
)
})}
{children}
</>
)
}
export default function Header() {
const router = useRouter()
const [hamburgerOpen, setHamburgerOpen] = useState(false)
@@ -34,6 +58,11 @@ export default function Header() {
router.push(event.currentTarget.href)
}
const navEntries: (INavEntry | React.ReactNode)[] = [
...NAV_ENTRIES,
<User key="user" />,
]
return (
<>
<Head>
@@ -52,18 +81,9 @@ export default function Header() {
</Link>
</div>
<nav className="hidden space-x-10 sm:flex items-center">
{NAV_ENTRIES.map(({ label, href }) => {
return (
<a
key={href}
href={href}
onClick={changeRoute}
className="text-base font-medium text-gray-500 hover:text-gray-900"
>
{label}
</a>
)
})}
<NavEntries navEntries={navEntries} changeRoute={changeRoute}>
<User />
</NavEntries>
</nav>
<nav
onClick={() => setHamburgerOpen(!hamburgerOpen)}
@@ -90,18 +110,12 @@ export default function Header() {
>
<div className="rounded-lg shadow-lg ring-1 ring-black ring-opacity-5 overflow-hidden">
<div className="relative grid gap-2 bg-white px-4 py-2">
{NAV_ENTRIES.map(({ label, href }) => {
return (
<a
key={href}
href={href}
onClick={changeRoute}
className="text-base font-medium text-gray-500 hover:text-gray-900"
<NavEntries
navEntries={navEntries}
changeRoute={changeRoute}
>
{label}
</a>
)
})}
<User />
</NavEntries>
</div>
</div>
</div>

4
helpers/withAuth.tsx
View File

@@ -1,16 +1,14 @@
import { SessionProvider } from 'next-auth/react'
import Auth from '../components/auth'
import User from '../components/user'
// This is the HOC
function withAuth(WrappedComponent) {
function withAuth(WrappedComponent: React.FunctionComponent) {
// Return a new component
function withAuth({ session, ...pageProps }) {
// Render the WrappedComponent with additional props
return (
<SessionProvider session={session}>
<Auth>
<User />
<WrappedComponent {...pageProps} />
</Auth>
</SessionProvider>

2
pages/_app.tsx
View File

@@ -7,10 +7,8 @@ import '../styles/gfm.css'
export default function MyApp({ Component, pageProps }) {
return (
<div className="flex flex-col min-h-screen">
<Layout>
<Component {...pageProps} />
<Analytics />
</Layout>
</div>
)
}

4
pages/admin/index.tsx
View File

@@ -17,11 +17,11 @@ function AdminRecentBookings({ bookings }) {
}
return (
<>
<Layout>
{bookings.map((booking: any) => (
<BookingTable key={booking.uuid} booking={booking} />
))}
</>
</Layout>
)
}