not sure but it seems to work

2026-03-03 06:27:11 +01:00 · 2025-03-26 22:10:46 +01:00
parent 0db0339a55
commit eb9a297a09
15 changed files with 1459 additions and 1697 deletions
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -9,7 +9,7 @@ type INavEntry = {
  href: string
 }

-const NAV_ENTRIES = [
+const NAV_ENTRIES: INavEntry[] = [
  {
    label: 'Home',
    href: '/',
@@ -48,7 +48,7 @@ function NavEntries({ children, navEntries, changeRoute }) {
  )
 }

-export default function Header() {
+export default function Header({ restricted }: { restricted: boolean }) {
  const router = useRouter()
  const [hamburgerOpen, setHamburgerOpen] = useState(false)

@@ -58,11 +58,6 @@ export default function Header() {
    router.push(event.currentTarget.href)
  }

-  const navEntries: (INavEntry | React.ReactNode)[] = [
-    ...NAV_ENTRIES,
-    <User key="user" />,
-  ]
-
  return (
    <>
      <Head>
@@ -81,8 +76,8 @@ export default function Header() {
              </Link>
            </div>
            <nav className="hidden space-x-10 sm:flex items-center">
-              <NavEntries navEntries={navEntries} changeRoute={changeRoute}>
-                <User />
+              <NavEntries navEntries={NAV_ENTRIES} changeRoute={changeRoute}>
+                {restricted && <User />}
              </NavEntries>
            </nav>
            <nav
@@ -111,10 +106,10 @@ 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">
                    <NavEntries
-                      navEntries={navEntries}
+                      navEntries={NAV_ENTRIES}
                      changeRoute={changeRoute}
                    >
-                      <User />
+                      {restricted && <User />}
                    </NavEntries>
                  </div>
                </div>
--- a/components/layout.tsx
+++ b/components/layout.tsx
@@ -2,10 +2,16 @@ import React from 'react'
 import Footer from '../components/footer'
 import Header from '../components/header'

-export default function Home({ children }: { children: React.ReactNode }) {
+export default function Home({
+  children,
+  restricted = false,
+}: {
+  children: React.ReactNode
+  restricted?: boolean
+}) {
  return (
    <>
-      <Header />
+      <Header restricted={restricted} />
      <main className="max-w-7xl mx-auto p-4 sm:p-6">{children}</main>
      <Footer />
    </>
--- a/next-env.d.ts
+++ b/next-env.d.ts
@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />

 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.
+// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information.
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -14,7 +14,7 @@
    "@mdx-js/loader": "^3.0.1",
    "@mdx-js/react": "^3.0.1",
    "@next-auth/mongodb-adapter": "1.1.3",
-    "@next/mdx": "^14.1.3",
+    "@next/mdx": "^14.2.11",
    "@types/mdx": "^2.0.11",
    "@vercel/analytics": "^1.0.0",
    "autoprefixer": "10.4.20",
@@ -24,7 +24,7 @@
    "googleapis": "142.0.0",
    "ics": "3.7.6",
    "mongoose": "^8.5.4",
-    "next": "^14.0.1",
+    "next": "^14.2.11",
    "next-auth": "4.24.7",
    "next-axiom": "^1.1.0",
    "nodemailer": "^6.9.1",
@@ -37,7 +37,7 @@
    "@types/nodemailer": "^6.4.7",
    "@types/uuid": "10.0.0",
    "eslint": "8.57.0",
-    "eslint-config-next": "14.2.10",
+    "eslint-config-next": "^14.2.11",
    "eslint-config-prettier": "9.1.0",
    "jest": "29.7.0",
    "postcss": "8.4.45",
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -1,5 +1,4 @@
 import { Analytics } from '@vercel/analytics/react'
-import Layout from '../components/layout'

 import '../styles/index.css'
 import '../styles/gfm.css'
@@ -11,4 +10,4 @@ export default function MyApp({ Component, pageProps }) {
      <Analytics />
    </div>
  )
-}
+}
--- a/pages/admin/index.tsx
+++ b/pages/admin/index.tsx
@@ -1,4 +1,4 @@
-import React, { ReactElement } from 'react'
+import React from 'react'
 import BookingTable from '../../components/bookingTable'
 import Layout from '../../components/layout'
 import withAuth from '../../helpers/withAuth'
@@ -25,4 +25,4 @@ function AdminRecentBookings({ bookings }) {
  )
 }

-export default withAuth(AdminRecentBookings)
+export default withAuth(AdminRecentBookings)
--- a/pages/book.tsx
+++ b/pages/book.tsx
@@ -1,10 +1,11 @@
+import Layout from '../components/layout'
 import Book from '../components/book'

 export default function Home() {
  return (
-    <>
+    <Layout>
      <h1 className="text-xl font-extrabold mb-6">Buchungsanfrage</h1>
      <Book />
-    </>
+    </Layout>
  )
-}
+}
--- a/pages/bookings/[uuid]/index.tsx
+++ b/pages/bookings/[uuid]/index.tsx
@@ -5,6 +5,7 @@ import { BOOKING_STATUS } from '../../../db/enums'
 import { daysFormatFrontend } from '../../../helpers/date'
 import { log } from '../../../helpers/log'
 import { getBookingStatus, cancelBooking } from '../../../helpers/booking'
+import Layout from '../../../components/layout'

 export const getServerSideProps = getServerSideBooking

@@ -40,7 +41,7 @@ export default function ShowBooking({
  }

  return (
-    <>
+    <Layout>
      <div>
        <strong>Buchungsstatus:</strong> {getBookingStatus(booking.status)}
      </div>
@@ -53,16 +54,16 @@ export default function ShowBooking({
      {[BOOKING_STATUS.CONFIRMED, BOOKING_STATUS.REQUESTED].includes(
        booking.status
      ) && (
-          <div className="my-6">
-            <button
-              onClick={onCancelBooking}
-              className="btn btn-red"
-              disabled={storingBooking}
-            >
-              Buchung Stornieren
-            </button>
-          </div>
-        )}
-    </>
+        <div className="my-6">
+          <button
+            onClick={onCancelBooking}
+            className="btn btn-red"
+            disabled={storingBooking}
+          >
+            Buchung Stornieren
+          </button>
+        </div>
+      )}
+    </Layout>
  )
-}
+}
--- a/pages/bookings/[uuid]/stored.tsx
+++ b/pages/bookings/[uuid]/stored.tsx
@@ -3,6 +3,7 @@ import Link from 'next/link'
 import { IBooking } from '../../../db/booking'
 import { loadBookingData, storeBookingData } from '../../../helpers/storage'
 import { getServerSideBooking } from '../../../lib/getServerSideProps'
+import Layout from '../../../components/layout'

 export const getServerSideProps = getServerSideBooking

@@ -18,7 +19,7 @@ export default function ShowBookingStored({ booking }: { booking: IBooking }) {
  }

  return (
-    <>
+    <Layout>
      <h3 className="thanks mb-3 mt-6 text-lg">
        Vielen Dank für die Buchungsanfrage
      </h3>
@@ -51,6 +52,6 @@ export default function ShowBookingStored({ booking }: { booking: IBooking }) {
          </p>
        </div>
      )}
-    </>
+    </Layout>
  )
-}
+}
--- a/pages/impressum.mdx
+++ b/pages/impressum.mdx
@@ -1,8 +1,9 @@
+import Layout from '../components/layout'
 import Mdx from '../components/mdx'

 export default function MDXPage({ children }) {
-  return <Mdx>{children}</Mdx>;
- 
+  return <Layout><Mdx>{children}</Mdx></Layout>;
+
 }

 # Impressum
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -1,77 +1,96 @@
 import Image from 'next/image'
 import Link from 'next/link'
+import Layout from '../components/layout'

 import bussleImage from '../public/bussle.webp'

 export default function Home() {
  return (
-    <div className="mt-6 sm:text-center">
-      <h1 className="text-xl tracking-tight font-extrabold text-gray-900 sm:text-2xl md:text-3xl">
-        <span className="block text-blue-800 xl:inline">Pfadi-Bussle</span>{' '}
-        <span className="block xl:inline">
-          des Freundeskreis des VCP Rosenfeld e.V.
-        </span>
-      </h1>
-      <p className="my-6 info-message inline-flex">
-        Ab 2023 gilt ein neues
-        <Link href="./prices" className="ml-1 font-medium text-blue-400 underline cursor-pointer hover:text-blue-600">Preismodell</Link>!
-      </p>
-      <p className="mt-3 text-gray-500 sm:mt-5 sm:text-lg md:text-xl">
-        Für Lager, Vereinsausflüge, Urlaubsreisen, Umzüge, etc. kann man unser
-        Pfadi-Bussle mieten.
-      </p>
-      <p className="mt-3 text-gray-500 sm:mt-5 sm:text-lg md:text-xl">
-        Das Bussle ist ein VW T5 Kleinbus mit 9 Sitzplätzen (inkl. Fahrer),
-        mit Klimaanlage, Radio/CD/Aux und Anhängerkupplung. Die zweite und
-        dritte Sitzreihe können ausgebaut werden.
-      </p>
-      <p className="mt-3 text-gray-500 sm:mt-5 sm:text-lg md:text-xl">
-        <Link href="/prices" className="underline hover:text-blue-700">
-          Preise
-        </Link>{' '}
-        und{' '}
-        <Link href="/terms" className="underline hover:text-blue-700">
-          Mietbedingungen
-        </Link>
-      </p>
-      <div className="mt-5 sm:mt-8 sm:flex sm:justify-center">
-        <div className="rounded-md shadow">
-          <Link href="/book" className="w-full flex items-center justify-center px-6 py-2 border border-transparent text-base font-medium rounded-md text-white bg-blue-800 hover:bg-blue-900 md:py-2 md:text-lg md:px-5">
-            Zur Buchungsanfrage
-          </Link>
-        </div>
-      </div>
-      <p className="mt-3 text-gray-500 sm:mt-5 sm:text-lg md:text-xl">
-        Du hast weiter Fragen melde Dich gerne per
-        <br />
-        <a
-          className="underline hover:text-blue-700"
-          href="mailto:pfadibussle@tomru.space"
-        >
-          E-Mail
-        </a>
-        , Telefon{' '}
-        <a
-          className="underline hover:text-blue-700"
-          href="tel:+4915121225362"
-        >
-          0151 / 21 22 53 62
-        </a>{' '}
-        oder{' '}
-        <Link href="https://wa.me/4915121225362" className="underline inline-flex flex-row items-baseline hover:text-blue-700">
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            className="fill-current h-4 inline"
-            viewBox="0 0 738 741"
+    <Layout>
+      <div className="mt-6 sm:text-center">
+        <h1 className="text-xl tracking-tight font-extrabold text-gray-900 sm:text-2xl md:text-3xl">
+          <span className="block text-blue-800 xl:inline">Pfadi-Bussle</span>{' '}
+          <span className="block xl:inline">
+            des Freundeskreis des VCP Rosenfeld e.V.
+          </span>
+        </h1>
+        <p className="my-6 info-message inline-flex">
+          Ab 2023 gilt ein neues
+          <Link
+            href="./prices"
+            className="ml-1 font-medium text-blue-400 underline cursor-pointer hover:text-blue-600"
          >
-            <title>Whatsapp</title>
-            <path d="M630 108A368 368 0 0052 551L0 741l195-51a368 368 0 00435-582M370 672c-55 0-108-14-155-42l-11-7-116 31 31-113-7-12A304 304 0 01370 62a303 303 0 01306 305c-1 169-137 305-306 305m168-228l-63-30c-8-3-15-4-21 5l-29 36c-5 6-10 7-20 2-9-5-38-14-73-46-28-24-46-54-51-63-6-9-1-14 4-19l13-16c5-5 7-9 10-15s1-12-1-16l-28-68c-8-18-15-16-21-16h-18c-6 0-16 2-24 11-9 9-32 31-32 77s33 88 37 94c5 7 65 99 157 139l52 19c22 7 42 6 58 4 18-3 54-22 62-44 8-21 8-40 5-43-2-4-8-6-17-11" />
-          </svg>
-        </Link>
-      </p>
-      <p className="flex justify-center mt-3 sm:mt-5 sm:text-lg md:text-xl">
-        <Image src={bussleImage} sizes="(max-width: 800px) 100vw" alt="Bild des Pfadi-Bussles"/>
-      </p>
-    </div>
+            Preismodell
+          </Link>
+          !
+        </p>
+        <p className="mt-3 text-gray-500 sm:mt-5 sm:text-lg md:text-xl">
+          Für Lager, Vereinsausflüge, Urlaubsreisen, Umzüge, etc. kann man unser
+          Pfadi-Bussle mieten.
+        </p>
+        <p className="mt-3 text-gray-500 sm:mt-5 sm:text-lg md:text-xl">
+          Das Bussle ist ein VW T5 Kleinbus mit 9 Sitzplätzen (inkl. Fahrer),
+          mit Klimaanlage, Radio/CD/Aux und Anhängerkupplung. Die zweite und
+          dritte Sitzreihe können ausgebaut werden.
+        </p>
+        <p className="mt-3 text-gray-500 sm:mt-5 sm:text-lg md:text-xl">
+          <Link href="/prices" className="underline hover:text-blue-700">
+            Preise
+          </Link>{' '}
+          und{' '}
+          <Link href="/terms" className="underline hover:text-blue-700">
+            Mietbedingungen
+          </Link>
+        </p>
+        <div className="mt-5 sm:mt-8 sm:flex sm:justify-center">
+          <div className="rounded-md shadow">
+            <Link
+              href="/book"
+              className="w-full flex items-center justify-center px-6 py-2 border border-transparent text-base font-medium rounded-md text-white bg-blue-800 hover:bg-blue-900 md:py-2 md:text-lg md:px-5"
+            >
+              Zur Buchungsanfrage
+            </Link>
+          </div>
+        </div>
+        <p className="mt-3 text-gray-500 sm:mt-5 sm:text-lg md:text-xl">
+          Du hast weiter Fragen melde Dich gerne per
+          <br />
+          <a
+            className="underline hover:text-blue-700"
+            href="mailto:pfadibussle@tomru.space"
+          >
+            E-Mail
+          </a>
+          , Telefon{' '}
+          <a
+            className="underline hover:text-blue-700"
+            href="tel:+4915121225362"
+          >
+            0151 / 21 22 53 62
+          </a>{' '}
+          oder{' '}
+          <Link
+            href="https://wa.me/4915121225362"
+            className="underline inline-flex flex-row items-baseline hover:text-blue-700"
+          >
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              className="fill-current h-4 inline"
+              viewBox="0 0 738 741"
+            >
+              <title>Whatsapp</title>
+              <path d="M630 108A368 368 0 0052 551L0 741l195-51a368 368 0 00435-582M370 672c-55 0-108-14-155-42l-11-7-116 31 31-113-7-12A304 304 0 01370 62a303 303 0 01306 305c-1 169-137 305-306 305m168-228l-63-30c-8-3-15-4-21 5l-29 36c-5 6-10 7-20 2-9-5-38-14-73-46-28-24-46-54-51-63-6-9-1-14 4-19l13-16c5-5 7-9 10-15s1-12-1-16l-28-68c-8-18-15-16-21-16h-18c-6 0-16 2-24 11-9 9-32 31-32 77s33 88 37 94c5 7 65 99 157 139l52 19c22 7 42 6 58 4 18-3 54-22 62-44 8-21 8-40 5-43-2-4-8-6-17-11" />
+            </svg>
+          </Link>
+        </p>
+        <p className="flex justify-center mt-3 sm:mt-5 sm:text-lg md:text-xl">
+          <Image
+            src={bussleImage}
+            sizes="(max-width: 800px) 100vw"
+            alt="Bild des Pfadi-Bussles"
+          />
+        </p>
+      </div>
+    </Layout>
  )
-}
+}
--- a/pages/prices.tsx
+++ b/pages/prices.tsx
@@ -1,6 +1,8 @@
+import Layout from '../components/layout'
+
 export default function Prices() {
  return (
-    <>
+    <Layout>
      <h1 className="mb-3 text-xl font-extrabold">Preise</h1>
      <table className="divide-y divide-gray-200">
        <thead className="bg-gray-50">
@@ -50,6 +52,6 @@ export default function Prices() {
          </tr>
        </tbody>
      </table>
-    </>
+    </Layout>
  )
-}
+}
--- a/pages/privacy.mdx
+++ b/pages/privacy.mdx
@@ -1,10 +1,10 @@
+import Layout from '../components/layout'
 import Mdx from '../components/mdx'

 export default function MDXPage({ children }) {
-  return <Mdx>{children}</Mdx>;
- 
+  return <Layout><Mdx>{children}</Mdx></Layout>;
 }
- 
+
 # Datenschutzerklärung

 ## Geltungsbereich
--- a/pages/terms.mdx
+++ b/pages/terms.mdx
@@ -1,8 +1,8 @@
+import Layout from '../components/layout'
 import Mdx from '../components/mdx'

 export default function MDXPage({ children }) {
-  return <Mdx>{children}</Mdx>;
- 
+  return <Layout><Mdx>{children}</Mdx></Layout>;
 }

 # I. Pflichten des Eigentümers