ik hou van kaas

This commit is contained in:
ben
2026-08-19 11:56:44 +02:00
parent 8fe812e8e6
commit 468c34ff92
9 changed files with 320 additions and 107 deletions
@@ -18,8 +18,8 @@ export default function RootLayout({
children: React.ReactNode
}>) {
return (
<html lang="en" className="bg-background">
<body className={inter.className}>
<html lang="en" className="h-full overflow-hidden bg-background">
<body className={`${inter.className} h-full overflow-hidden`}>
<AuthProvider>{children}</AuthProvider>
</body>
</html>
+11 -15
View File
@@ -1,11 +1,10 @@
"use client"
import { useMemo, useState } from "react"
import Image from "next/image"
import { Menu, Plus, Loader2 } from "lucide-react"
import { useAuth } from "@/lib/auth-context"
import { useRooms, useEvents } from "@/lib/hooks"
import { useRooms, useEvents, useMyResponses } from "@/lib/hooks"
import { AuthScreen } from "@/components/auth-screen"
import { Sidebar } from "@/components/sidebar"
import { WeekView } from "@/components/week-view"
@@ -13,6 +12,7 @@ import { CreateEventDialog } from "@/components/create-event-dialog"
import { EventDetailDialog } from "@/components/event-detail-dialog"
import { CreateRoomDialog, JoinRoomDialog } from "@/components/room-dialogs"
import { RoomSettingsDialog } from "@/components/room-settings-dialog"
import { RoomBackground } from "@/components/room-background"
import { getRoomBackground } from "@/lib/room-theme"
import { addDays, startOfWeek, toDateParam, formatMonthYear } from "@/lib/date-utils"
import type { CalendarEvent, User } from "@/lib/types"
@@ -62,6 +62,8 @@ function CalendarApp({ user, onLogout }: { user: User; onLogout: () => void }) {
mutate: mutateEvents,
} = useEvents(activeRoomId, from, to)
const { myResponses } = useMyResponses(events, user.id)
const activeRoom = rooms.find((r) => r.id === activeRoomId)
const background = getRoomBackground(activeRoomId)
@@ -71,17 +73,11 @@ function CalendarApp({ user, onLogout }: { user: User; onLogout: () => void }) {
}
return (
<div className="relative min-h-screen w-full overflow-hidden bg-slate-900">
<Image
src={background || "/placeholder.svg"}
alt=""
fill
priority
className="object-cover transition-all duration-700"
/>
<div className="relative h-screen w-full overflow-hidden bg-slate-900">
<RoomBackground src={background} />
<div className="absolute inset-0 bg-black/35" />
<div className="relative z-10 flex min-h-screen w-full">
<div className="relative z-10 flex h-full w-full">
{/* Mobile sidebar backdrop */}
{sidebarOpen && (
<div
@@ -112,7 +108,7 @@ function CalendarApp({ user, onLogout }: { user: User; onLogout: () => void }) {
/>
</div>
<main className="flex min-h-screen flex-1 flex-col overflow-hidden">
<main className="flex h-full flex-1 flex-col overflow-hidden">
<header className="flex items-center justify-between gap-3 border-b border-white/10 bg-white/5 px-4 py-3 backdrop-blur-md md:px-6">
<div className="flex items-center gap-3">
<button
@@ -149,7 +145,7 @@ function CalendarApp({ user, onLogout }: { user: User; onLogout: () => void }) {
</div>
</header>
<div className="flex-1 overflow-auto p-3 md:p-6">
<div className="min-h-0 flex-1 overflow-auto p-3 md:p-6">
{eventsLoading ? (
<div className="flex h-full items-center justify-center">
<Loader2 className="h-6 w-6 animate-spin text-white/60" />
@@ -158,7 +154,7 @@ function CalendarApp({ user, onLogout }: { user: User; onLogout: () => void }) {
<WeekView
weekStart={weekStart}
events={events}
showRoomColors={activeRoomId === null}
myResponses={myResponses}
onEventClick={(event) => setDialog({ type: "event-detail", event })}
/>
)}
@@ -226,4 +222,4 @@ function CalendarApp({ user, onLogout }: { user: User; onLogout: () => void }) {
)}
</div>
)
}
}